/* Shared styles for the newer web demos (bank, recipes, tickets). Each page sets its own colors with custom properties. */
.dw { margin: 0; color: var(--dw-ink); background: var(--dw-bg); font-family: "DM Sans", system-ui, sans-serif; }
.dw * { box-sizing: border-box; }
.dw a { color: inherit; }
.dw-head { display: flex; align-items: center; gap: 28px; height: 68px; padding: 0 clamp(18px, 5vw, 64px); border-bottom: 1px solid var(--dw-line); background: var(--dw-bg); }
.dw-mark { font: 600 20px "Sora", "DM Sans", sans-serif; letter-spacing: -.03em; text-decoration: none; }
.dw-nav { display: flex; gap: 6px; }
.dw-nav a { padding: 8px 12px; border-radius: 10px; color: var(--dw-sub); text-decoration: none; font-size: 15px; }
.dw-nav a[aria-current="page"], .dw-nav a:hover { color: var(--dw-ink); background: var(--dw-soft); }
.dw-user { margin-left: auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: #fff; background: var(--dw-accent); font-size: 14px; font-weight: 600; }
.dw-main { width: min(1100px, calc(100% - 36px)); margin: 0 auto; padding: 36px 0 90px; }
.dw h1 { margin: 0; font: 500 clamp(30px, 4.4vw, 46px)/1.05 "Sora", "DM Sans", sans-serif; letter-spacing: -.04em; }
.dw h2 { margin: 0; font-size: 19px; font-weight: 600; letter-spacing: -.02em; }
.dw .sub { color: var(--dw-sub); font-size: 15px; }
.dw-card { padding: 24px; border: 1px solid var(--dw-line); border-radius: 20px; background: var(--dw-card); }
.dw-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 0; border-radius: 999px; color: #fff; background: var(--dw-accent); font: 500 15px "DM Sans", sans-serif; cursor: pointer; }
.dw-btn:hover { filter: brightness(.92); }
.dw-btn.ghost { color: var(--dw-ink); background: var(--dw-soft); }
.dw-chip { min-height: 38px; padding: 0 16px; border: 1px solid var(--dw-line); border-radius: 999px; color: var(--dw-ink); background: var(--dw-card); font: 500 14px "DM Sans", sans-serif; cursor: pointer; }
.dw-chip[aria-pressed="true"] { color: #fff; border-color: var(--dw-accent); background: var(--dw-accent); }
.dw :focus-visible { outline: 3px solid #1d4ed8; outline-offset: 3px; }
.dw-grid { display: grid; gap: 20px; }
@media (max-width: 760px) { .dw-nav { display: none; } .dw-two { grid-template-columns: 1fr !important; } }
body.dw.experience-page { color: var(--dw-ink); background: var(--dw-bg); }