/* ============================================================
   DM-WEB1 — Direction A, on the live site.

   The photographic design chosen on 6 Sep 2026 (published mockup
   "DesiMenus 🔥", project doc DesiMenus_Marketing_Site_Direction_A_Chosen):
   full-bleed photographic night bands between warm paper bands, Anton for
   every heading, Manrope for text, Courier Prime for bills, labels and
   prices. Loaded AFTER site.css and scoped to body.da, so the pages that
   still carry v7 markup (sign-in, sign-up, verify, legal) keep working
   while they wait for their own pass.

   ⚠ SINGLE COMMITTED THEME. Every colour is painted here; the page does
     not follow the viewer's light/dark setting (Direction A's decision).
   ⚠ NO THIRD-PARTY REQUEST. Fonts come from /fonts/marketing (R39e) and
     photographs from /img/site; nothing here names another host.
   ============================================================ */

.da {
  --night:   #100A06;
  --night-2: #1A110A;
  --nline:   rgba(255,255,255,.14);
  --paper:   #F7F4EF;
  --paper-2: #EFEAE1;
  --card:    #FFFDFA;
  --rule:    #E2DACD;
  --rule-2:  #CFC4B2;
  --ink:     #191009;
  --mid:     #5E5346;
  --dim:     #665B4E;  /* DM-WEB1 contrast: was #8B7F70 (3.6:1 on paper) */
  --blue:    #3498DB;
  --blue-lt: #6FC0F0;
  --blue-dk: #1B6FA8;
  --blue-t:  #E7F2FA;
  --ember:   #C96A2B;
  --ember-ink:#9A4C18; /* ember for small TEXT on paper: 5.6:1 */
  --ember-lt:#F0A868;
  --ember-t: #FAEDE1;
  --leaf:    #17845F;
  --leaf-t:  #E4F1EB;
  --onnight:   #F4EDE5;
  --onnight-d: #B0A092;

  --disp: "Anton", "Arial Narrow", Impact, sans-serif;
  --ui: "Manrope Variable", "Manrope", ui-sans-serif, system-ui, sans-serif;
  --mono: "Courier Prime", ui-monospace, "Courier New", monospace;
  --deva: "Tiro Devanagari Hindi", "Nirmala UI", serif;

  --wrap: 1180px;
  --pad: clamp(20px, 5vw, 46px);
  --band: clamp(64px, 7.6vw, 110px);

  color-scheme: light;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--ui);
  font-size: 16.5px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

.da h1, .da h2, .da h3, .da h4 { margin: 0; font-family: var(--disp); font-weight: 400; line-height: .95; letter-spacing: -0.005em; }
.da p { margin: 0; }
.da a { color: inherit; }
.da img { max-width: 100%; }
.da :focus-visible { outline: 2.5px solid var(--blue); outline-offset: 3px; border-radius: 3px; }
.da [hidden] { display: none !important; }

.da .wrap { max-width: var(--wrap); margin: 0 auto; padding-inline: var(--pad); }
.da .band { padding-block: var(--band); background: var(--paper); }
.da .band--paper2 { background: var(--paper-2); }
.da .band--night { background: var(--night); color: var(--onnight); }
.da .anchor { display: block; position: relative; top: -72px; visibility: hidden; height: 0; }

.da .eyebrow { font-family: var(--mono); font-size: 11.5px; letter-spacing: .17em; text-transform: uppercase; color: var(--ember-ink); margin: 0; }
.da .band--night .eyebrow, .da .photo .eyebrow { color: var(--ember-lt); }
.da .head { max-width: 780px; margin-bottom: clamp(34px, 4.4vw, 56px); }
.da .head h2 { font-size: clamp(30px, 4.2vw, 52px); margin-top: 14px; }
.da .head p { margin-top: 16px; font-size: 17.8px; color: var(--mid); max-width: 62ch; }
.da .band--night .head p { color: var(--onnight-d); }
.da .on-photo { color: #fff; }
.da .on-photo-d { color: rgba(255,255,255,.78) !important; }

/* ---------- buttons ---------- */
.da .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-family: var(--ui); font-weight: 800; font-size: 15px; letter-spacing: -0.01em;
  padding: 13px 22px; border-radius: 10px; border: 1.5px solid transparent;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}
.da .btn--blue { background: var(--blue); color: #06212F; }
.da .btn--blue:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(52,152,219,.4); }
.da .btn--dark { background: var(--ink); color: var(--paper); }
.da .btn--dark:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(25,16,9,.3); }
.da .btn--wireL { border-color: var(--rule-2); color: var(--ink); background: transparent; }
.da .btn--wireL:hover { transform: translateY(-2px); border-color: var(--blue); color: var(--blue-dk); }
.da .btn--wireD { border-color: rgba(255,255,255,.4); color: #fff; background: transparent; }
.da .btn--wireD:hover { transform: translateY(-2px); border-color: #fff; background: rgba(255,255,255,.08); }
.da .btn__a { transition: transform .16s ease; }
.da .btn:hover .btn__a { transform: translateX(4px); }

/* ---------- photography ---------- */
.da .photo { position: relative; overflow: hidden; background: #0B0703; isolation: isolate; }
.da .photo__base { position: absolute; inset: 0; background-position: center; background-size: cover; background-repeat: no-repeat; }
.da .photo__base--pan { inset: -3%; animation: da-pan 42s ease-in-out infinite alternate; }
@keyframes da-pan { from { transform: scale(1) translate3d(0,0,0); } to { transform: scale(1.06) translate3d(-1.2%, .8%, 0); } }
/* site-a.js adds this while the tab is hidden: nothing animates for nobody. */
.da.is-hidden-tab .photo__base--pan { animation-play-state: paused; }
.da .photo__grain {
  position: absolute; inset: 0; opacity: .09; mix-blend-mode: overlay; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}
.da .scrim { position: absolute; inset: 0; pointer-events: none; }
.da .scrim--hero {
  background:
    linear-gradient(90deg, rgba(8,5,2,.88) 0%, rgba(8,5,2,.72) 26%, rgba(8,5,2,.34) 50%, rgba(8,5,2,.06) 72%, rgba(8,5,2,.22) 100%),
    linear-gradient(180deg, rgba(8,5,2,.62) 0%, rgba(8,5,2,.12) 22%, rgba(8,5,2,.10) 52%, rgba(8,5,2,.72) 100%);
}
.da .scrim--band { background: linear-gradient(180deg, rgba(8,5,2,.70) 0%, rgba(8,5,2,.80) 100%); }
.da .scrim--close { background: radial-gradient(84% 108% at 50% 50%, rgba(8,5,2,.84) 0%, rgba(8,5,2,.62) 52%, rgba(8,5,2,.28) 100%); }
.da .scrim--card { background: linear-gradient(180deg, rgba(8,5,2,.04) 0%, rgba(8,5,2,.10) 62%, rgba(8,5,2,.30) 100%); }

/* The photographs, by slot. Files are served with a one-year cache (Program.cs);
   a replaced photograph gets a new file name, never the same one. */
.da .ph-hero    { background-image: url("/img/site/hero-counter.webp"); }
.da .ph-pass    { background-image: url("/img/site/band-kitchen-pass.webp"); }
.da .ph-close   { background-image: url("/img/site/band-closing-service.webp"); }

/* ============================================================ NAV */
.da .nav {
  position: sticky; top: 0; z-index: 80;
  background: rgba(16,10,6,.86);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--nline);
  color: var(--onnight);
}
.da .nav__in { max-width: var(--wrap); margin: 0 auto; padding: 12px var(--pad); display: flex; align-items: center; gap: 22px; }
.da .nav .brand { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 9px; }
.da .nav .brand-mark, .da .pagefoot .brand-mark { width: 26px; height: 26px; color: var(--blue-lt); }
.da .nav .brand-word, .da .pagefoot .brand-word { font-family: var(--ui); font-weight: 800; font-size: 19px; letter-spacing: -0.02em; color: #fff; }
.da .nav .brand-word em, .da .pagefoot .brand-word em { font-style: normal; color: var(--blue-lt); }
.da .nav__links { display: flex; gap: 6px; margin-left: auto; }
.da .nav__links a { font-size: 14px; font-weight: 700; text-decoration: none; color: rgba(244,237,229,.76); padding: 8px 12px; border-radius: 8px; transition: background .15s ease, color .15s ease; }
.da .nav__links a:hover { background: rgba(255,255,255,.09); color: #fff; }
.da .nav__cta { display: flex; gap: 9px; }
.da .nav .btn { padding: 9px 16px; font-size: 13.5px; }
.da .nav__toggle { display: none; margin-left: auto; background: transparent; border: 1px solid var(--nline); border-radius: 9px; color: #fff; width: 42px; height: 40px; cursor: pointer; }
.da .nav__toggle svg { width: 20px; height: 20px; }
.da .nav__panel { border-top: 1px solid var(--nline); padding: 10px var(--pad) 18px; display: grid; gap: 4px; }
.da .nav__panel a { color: var(--onnight); text-decoration: none; font-weight: 700; padding: 11px 4px; border-bottom: 1px solid rgba(255,255,255,.06); }
.da .nav__panel .btn { margin-top: 10px; }
@media (max-width: 980px) { .da .nav__links, .da .nav__cta { display: none; } .da .nav__toggle { display: inline-grid; place-items: center; } }
@media (min-width: 981px) { .da .nav__panel { display: none !important; } }

/* announcement strip (R130's Founding 25 slot) */
.da .announce { background: var(--ember); color: #241004; text-align: center; font-family: var(--mono); font-size: 12px; letter-spacing: .06em; padding: 8px var(--pad); }
.da .announce a { color: inherit; font-weight: 700; }

/* ============================================================ HERO */
.da .hero { position: relative; min-height: 640px; display: flex; flex-direction: column; color: #fff; }
.da .hero__body {
  position: relative; z-index: 5; margin-top: auto;
  max-width: var(--wrap); width: 100%; margin-inline: auto;
  padding: clamp(40px, 5vw, 76px) var(--pad) clamp(30px, 4vw, 54px);
  display: grid; grid-template-columns: minmax(0, 1.28fr) minmax(0, .72fr); gap: 32px; align-items: end;
}
@media (max-width: 900px) { .da .hero__body { grid-template-columns: 1fr; } }
.da .hero h1 { font-size: clamp(42px, 7vw, 100px); line-height: .87; text-transform: uppercase; margin-top: 16px; letter-spacing: -0.012em; }
.da .hero h1 em { font-style: normal; color: var(--blue-lt); }
.da .hero__sub { margin-top: 20px; max-width: 46ch; font-size: clamp(15.5px, 1.5vw, 18.5px); color: rgba(255,255,255,.84); }
.da .hero__acts { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 26px; }
.da .hero__strip { display: flex; flex-wrap: wrap; gap: 7px 24px; margin: 22px 0 0; padding: 0; list-style: none; font-family: var(--mono); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.62); }

.da .bill {
  background: #FFFEFA; color: #1B1207; width: min(262px, 100%); margin-left: auto;
  font-family: var(--mono); font-size: 11.4px; line-height: 1.62; padding: 22px 16px 14px;
  box-shadow: 0 30px 62px rgba(0,0,0,.55); transform: rotate(-1.5deg) translate(22px, 30px);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 7px), 92% 100%, 84% calc(100% - 7px), 76% 100%, 68% calc(100% - 7px), 60% 100%, 52% calc(100% - 7px), 44% 100%, 36% calc(100% - 7px), 28% 100%, 20% calc(100% - 7px), 12% 100%, 4% calc(100% - 7px), 0 100%);
}
.da .bill .c { text-align: center; }
.da .bill .big { font-weight: 700; font-size: 13px; letter-spacing: .05em; }
.da .bill hr { border: 0; border-top: 1px dashed #C4B49B; margin: 6px 0; }
.da .bill .r { display: flex; justify-content: space-between; gap: 10px; }
@media (max-width: 900px) { .da .bill { margin-left: 0; transform: rotate(-1.5deg); } }

.da .strip { position: relative; z-index: 5; border-top: 1px solid var(--nline); background: rgba(10,6,3,.55); backdrop-filter: blur(6px); }
.da .strip__in { max-width: var(--wrap); margin: 0 auto; padding: 18px var(--pad); display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px; }
.da .strip__in b { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.5); font-weight: 400; }
.da .strip__in span { font-size: 15px; font-weight: 700; color: rgba(255,255,255,.84); letter-spacing: -0.015em; }

/* ============================================================ LEDGER */
.da .ledger { border-top: 1px solid var(--rule); }
.da .led {
  display: grid; grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1.25fr);
  gap: 18px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--rule);
  transition: background .18s ease;
}
.da .led:hover { background: var(--card); }
@media (max-width: 760px) { .da .led { grid-template-columns: 40px 1fr; } .da .led > div { grid-column: 2; } }
.da .led__n { font-family: var(--mono); font-size: 12.5px; color: var(--ember-ink); letter-spacing: .06em; }
.da .led h3 { font-size: 25px; letter-spacing: -0.01em; }
.da .led p { font-size: 15.6px; color: var(--mid); line-height: 1.55; }
.da .led__mods { margin: 10px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px 14px; font-family: var(--mono); font-size: 11.5px; letter-spacing: .03em; color: var(--dim); }
.da .led__mods .unproven { color: var(--ember-ink); }
.da .led__mods .unproven::after { content: " †"; }
.da .ledger-note { margin-top: 16px; font-family: var(--mono); font-size: 11.5px; color: var(--dim); }

/* ============================================================ PLATFORM */
.da .plat { position: relative; overflow: hidden; }
.da .plat__in { position: relative; z-index: 5; max-width: var(--wrap); margin: 0 auto; padding: var(--band) var(--pad); }
.da .screens { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin: 40px 0 0; padding: 0; list-style: none; }
@media (max-width: 900px) { .da .screens { grid-template-columns: 1fr; } .da .scr { grid-column: auto !important; } }
.da .scr {
  background: rgba(20,13,8,.82); border: 1px solid var(--nline); border-radius: 12px;
  padding: 20px 20px 22px; display: flex; flex-direction: column; backdrop-filter: blur(6px);
  transition: transform .18s ease, border-color .18s ease;
}
.da .scr:hover { transform: translateY(-4px); border-color: rgba(255,255,255,.3); }
.da .scr:nth-child(1), .da .scr:nth-child(2) { grid-column: span 3; }
.da .scr:nth-child(n+3) { grid-column: span 2; }
.da .scr__n { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--blue-lt); }
.da .scr h3 { font-size: 22px; margin-top: 9px; color: #fff; }
.da .scr p { font-size: 14.8px; color: var(--onnight-d); margin-top: 8px; line-height: 1.5; }
.da .scr__meta { margin-top: auto; padding-top: 16px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; color: rgba(255,255,255,.42); }

/* ============================================================ FORMATS */
.da .fmts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
@media (max-width: 940px) { .da .fmts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .da .fmts { grid-template-columns: 1fr; } }
.da .fmt { background: var(--card); border: 1px solid var(--rule); border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; transition: transform .18s ease, box-shadow .18s ease; }
.da .fmt:hover { transform: translateY(-4px); box-shadow: 0 3px 8px rgba(25,16,9,.06), 0 22px 44px rgba(25,16,9,.12); }
.da .fmt__art { height: 152px; position: relative; }
.da .fmt__art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.da .fmt__art--plain { display: grid; place-items: center; background: var(--night-2); color: var(--ember-lt); }
.da .fmt__art--plain svg { width: 46px; height: 46px; }
.da .fmt__txt { padding: 18px 20px 22px; display: flex; flex-direction: column; flex: 1; }
.da .fmt h3 { font-size: 24px; }
.da .fmt p { font-size: 15px; color: var(--mid); margin-top: 8px; line-height: 1.5; }
.da .fmt__meta { margin-top: auto; padding-top: 14px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--dim); }

/* ============================================================ NUMBERS */
.da .nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 30px; margin: 0; padding: 0; list-style: none; }
.da .num b { display: block; font-family: var(--disp); font-weight: 400; font-size: clamp(46px, 6vw, 78px); line-height: .9; color: var(--blue-lt); }
.da .num span { display: block; margin-top: 12px; font-size: 15px; color: var(--onnight-d); line-height: 1.45; }

/* ============================================================ PRICING */
.da .toggle { display: inline-flex; gap: 3px; background: var(--paper-2); border: 1px solid var(--rule); border-radius: 999px; padding: 4px; margin-bottom: 32px; }
.da .toggle button { font-family: var(--ui); font-weight: 800; font-size: 14px; border: 0; background: transparent; color: var(--mid); padding: 9px 18px; border-radius: 999px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.da .toggle button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.da .toggle small { font-family: var(--mono); font-size: 10.5px; color: var(--leaf); }
.da .toggle button[aria-pressed="true"] small { color: var(--blue-lt); }
.da .tickets { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; align-items: stretch; }
.da .tk {
  background: var(--card); border: 1px solid var(--rule); padding: 26px 24px 38px; display: flex; flex-direction: column;
  transition: transform .18s ease, box-shadow .18s ease;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), 93.75% 100%, 87.5% calc(100% - 8px), 81.25% 100%, 75% calc(100% - 8px), 68.75% 100%, 62.5% calc(100% - 8px), 56.25% 100%, 50% calc(100% - 8px), 43.75% 100%, 37.5% calc(100% - 8px), 31.25% 100%, 25% calc(100% - 8px), 18.75% 100%, 12.5% calc(100% - 8px), 6.25% 100%, 0 calc(100% - 8px));
}
.da .tk:hover { transform: translateY(-5px); box-shadow: 0 3px 8px rgba(25,16,9,.07), 0 24px 48px rgba(25,16,9,.14); }
.da .tk--best { background: var(--night); color: var(--onnight); border-color: var(--night); }
.da .tk__badge { align-self: flex-start; background: var(--ember); color: #241004; font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; margin-bottom: 13px; }
.da .tk h3 { font-size: 26px; }
.da .tk__for { font-size: 14.6px; color: var(--mid); margin-top: 8px; line-height: 1.5; }
.da .tk--best .tk__for { color: var(--onnight-d); }
.da .tk__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.da .tk__price b { font-family: var(--disp); font-weight: 400; font-size: 46px; line-height: .9; font-variant-numeric: tabular-nums; }
.da .tk__price b.tk__ask { font-size: 30px; }
.da .tk__price span { font-family: var(--mono); font-size: 11.5px; color: var(--dim); }
.da .tk--best .tk__price span { color: var(--onnight-d); }
.da .tk__alt { font-family: var(--mono); font-size: 11.5px; color: var(--dim); margin-top: 9px; min-height: 1.4em; }
.da .tk--best .tk__alt { color: var(--onnight-d); }
.da .tk__alt s { opacity: .8; }
.da .tk .btn { margin-top: 18px; }
.da .tk__inc { margin-top: 22px; padding-top: 18px; border-top: 1px dashed var(--rule-2); font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }
.da .tk--best .tk__inc { border-top-color: rgba(255,255,255,.24); color: var(--onnight-d); }
.da .tk ul { list-style: none; margin: 13px 0 0; padding: 0; display: grid; gap: 9px; }
.da .tk li { font-size: 14.8px; color: var(--mid); line-height: 1.45; padding-left: 22px; position: relative; }
.da .tk--best li { color: var(--onnight-d); }
.da .tk li::before { content: "✓"; position: absolute; left: 0; font-family: var(--mono); font-size: 12.5px; color: var(--leaf); }
.da .tk--best li::before { color: var(--blue-lt); }
.da .tk li.tk__no { opacity: .55; text-decoration: line-through; }
.da .tk li.tk__no::before { content: "–"; }
.da .addons { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.da .addon { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 22px; align-items: center; background: var(--leaf-t); border: 1px solid rgba(23,132,95,.28); padding: 21px 24px; }
.da .addon h4 { font-size: 24px; }
.da .addon p { font-size: 15.2px; color: var(--mid); margin-top: 7px; }
.da .addon__plan { font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); margin-top: 6px !important; }
.da .addon b { font-family: var(--disp); font-weight: 400; font-size: 34px; color: var(--leaf); white-space: nowrap; text-align: right; }
.da .addon b small { display: block; font-family: var(--mono); font-size: 11px; color: var(--mid); letter-spacing: 0; }
@media (max-width: 700px) { .da .addon { grid-template-columns: 1fr; } .da .addon b { text-align: left; } }
.da .note { margin-top: 18px; font-family: var(--mono); font-size: 12px; color: var(--dim); line-height: 1.75; background: none; border: 0; border-radius: 0; padding: 0; }

/* ============================================================ PARTNERS */
.da .tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.da .tier { background: var(--card); border: 1px solid var(--rule); border-radius: 12px; padding: 24px 22px 26px; display: flex; flex-direction: column; }
.da .tier__n { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ember-ink); }
.da .tier h3 { font-size: 24px; margin-top: 9px; }
.da .tier > p { font-size: 15px; color: var(--mid); margin-top: 9px; line-height: 1.5; }
.da .tier ul { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.da .tier li { font-size: 14.5px; color: var(--mid); padding-left: 20px; position: relative; line-height: 1.45; }
.da .tier li::before { content: "→"; position: absolute; left: 0; color: var(--ember); font-family: var(--mono); font-size: 12px; }
.da .tier dl { margin: auto 0 0; padding-top: 16px; border-top: 1px dashed var(--rule-2); display: grid; grid-template-columns: auto 1fr; gap: 7px 14px; }
.da .tier dt { font-family: var(--mono); font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--dim); align-self: center; }
.da .tier dd { margin: 0; font-size: 14.5px; font-weight: 800; }
.da .tier__who { margin-top: auto !important; padding-top: 16px; border-top: 1px dashed var(--rule-2); font-size: 13.8px !important; }
.da .tier__cta { margin-top: 28px; }

/* ============================================================ SUPPORT */
.da .support { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.86fr); gap: clamp(26px,4.5vw,56px); align-items: center; }
@media (max-width: 900px) { .da .support { grid-template-columns: 1fr; } }
.da .support h2 { font-size: clamp(30px,4.2vw,52px); margin-top: 14px; }
.da .support__lead { margin-top: 16px !important; font-size: 17.8px; color: var(--mid); max-width: 52ch; }
.da .slab { background: var(--card); border: 1px solid var(--rule); border-radius: 12px; padding: 8px 22px 18px; margin: 0; list-style: none; }
.da .slab__r { display: flex; align-items: center; gap: 13px; padding: 14px 0; border-bottom: 1px dashed var(--rule); }
.da .slab__r:last-child { border-bottom: 0; }
.da .slab__r i { width: 8px; height: 8px; border-radius: 50%; background: var(--blue); flex: none; }
.da .slab__r.is-sla i { background: var(--leaf); }
.da .slab__r b, .da .slab__r a { font-size: 16px; font-weight: 800; text-decoration: none; }
.da .slab__r a:hover { color: var(--blue-dk); }
.da .slab__r span { margin-left: auto; text-align: right; font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); }

/* ============================================================ FAQ */
.da .faq { max-width: 860px; border-top: 1px solid var(--rule); }
.da .faq details { border-bottom: 1px solid var(--rule); }
.da .faq summary { list-style: none; cursor: pointer; padding: 20px 44px 20px 0; font-size: 20px; font-family: var(--disp); font-weight: 400; position: relative; line-height: 1.15; }
.da .faq summary::-webkit-details-marker { display: none; }
.da .faq summary::after { content: "+"; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-family: var(--mono); font-size: 22px; color: var(--ember); }
.da .faq details[open] summary::after { content: "–"; }
.da .faq details p { padding: 0 44px 22px 0; color: var(--mid); font-size: 16.2px; max-width: 70ch; }

/* ============================================================ CONTACT
   R135/DM-ENQ1's ContactSection, in Direction A's clothes. The Oasis form
   brings its own layout; .dm-oxf maps this palette onto its variables. */
.da #contact.section { padding-block: var(--band); background: var(--paper); }
.da #contact .wrap-narrow { max-width: var(--wrap); }
.da #contact .contact-card { display: grid; grid-template-columns: minmax(0,.86fr) minmax(0,1.14fr); gap: clamp(26px,4.5vw,54px); align-items: start; background: none; border: 0; box-shadow: none; padding: 0; border-radius: 0; }
@media (max-width: 900px) { .da #contact .contact-card { grid-template-columns: 1fr; } }
.da #contact .contact-copy { padding: 0; background: none; color: var(--ink); }
.da #contact .contact-copy h2 { font-size: clamp(30px,4.2vw,52px); margin-top: 14px; color: var(--ink); }
.da #contact .contact-copy > p { margin-top: 16px; font-size: 17px; color: var(--mid); max-width: 50ch; }
.da #contact .contact-details { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 12px; }
.da #contact .contact-details li { display: flex; gap: 10px; align-items: center; font-size: 15.4px; color: var(--mid); }
.da #contact .contact-details a { color: var(--ink); font-weight: 800; text-decoration: none; }
.da #contact .contact-details a:hover { color: var(--blue-dk); }
.da #contact .contact-details .i { width: 18px; height: 18px; stroke: var(--ember); fill: none; stroke-width: 1.8; flex: none; }
.da #contact .contact-form { padding: 0; background: none; gap: 18px; }
.da #contact .enquiry-modes { display: inline-flex; gap: 3px; background: var(--paper-2); border: 1px solid var(--rule); border-radius: 999px; padding: 4px; align-self: flex-start; }
.da #contact .enquiry-mode { font-family: var(--ui); font-weight: 800; font-size: 14px; border: 0; background: transparent; color: var(--mid); padding: 9px 18px; border-radius: 999px; cursor: pointer; }
.da #contact .enquiry-mode[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.da #contact .enquiry-help { background: var(--card); border: 1px solid var(--rule); padding: clamp(20px,2.8vw,30px); }
.da #contact .enquiry-help-title { font-size: 28px; }
.da #contact .enquiry-help-lead { margin-top: 10px; color: var(--mid); }
.da #contact .enquiry-help-list { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.da #contact .enquiry-help-list li { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 10px; border-bottom: 1px dashed var(--rule); }
.da #contact .enquiry-help-list a { font-weight: 800; color: var(--ink); }
.da #contact .enquiry-help-list em { font-style: normal; font-family: var(--mono); font-size: 11.5px; color: var(--dim); }
.da .dm-enquiry-slot { background: var(--card); border: 1px solid var(--rule); padding: clamp(18px,2.6vw,28px); box-shadow: 0 3px 8px rgba(25,16,9,.05), 0 22px 46px rgba(25,16,9,.10); }
.da .dm-enquiry-slot:empty { min-height: 280px; }
.da .dm-oxf {
  --oxf-brand: var(--blue-dk);  /* text-in-brand (links, secondary buttons): 5.3:1 on card */
  --oxf-accent: var(--blue-dk);  /* the form writes links and the secondary button IN the accent, so it must read as text */
  --oxf-accent-ink: #fff;
  --oxf-ink: var(--ink);
  --oxf-muted: var(--mid);
  --oxf-surface: var(--card);
  --oxf-canvas: var(--paper);
  --oxf-line: var(--rule-2);
  --oxf-error: var(--ember-ink);
  --oxf-ok: var(--leaf);
  --oxf-radius: 8px;
  --oxf-gap: 14px;
  --oxf-font: var(--ui);
}

/* ============================================================ CLOSING */
.da .close { position: relative; overflow: hidden; text-align: center; color: #fff; }
.da .close__in { position: relative; z-index: 5; padding: clamp(64px, 7vw, 106px) var(--pad); }
.da .close h2 { font-size: clamp(34px, 5.4vw, 74px); text-transform: uppercase; line-height: .9; }
.da .close p { margin: 20px auto 0; max-width: 50ch; font-size: 17.5px; color: rgba(255,255,255,.8); }
.da .close__acts { display: flex; gap: 11px; justify-content: center; margin-top: 28px; flex-wrap: wrap; }

/* ============================================================ FOOTER
   The Oasis family's footer: brand and contact, Product, Solutions,
   Company, Legal, then the family and the legal line. */
.da .pagefoot { background: var(--night); color: var(--onnight-d); padding-block: clamp(46px,5.6vw,68px) 26px; border-top: 1px solid var(--nline); }
.da .pagefoot__grid { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 32px; }
@media (max-width: 980px) { .da .pagefoot__grid { grid-template-columns: 1fr 1fr; } .da .pagefoot__brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .da .pagefoot__grid { grid-template-columns: 1fr 1fr; gap: 26px 18px; } }
@media (max-width: 340px) { .da .pagefoot__grid { grid-template-columns: 1fr; } }
.da .pagefoot .brand { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 9px; }
.da .pagefoot h4 { font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--ember-lt); margin-bottom: 14px; }
.da .pagefoot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.da .pagefoot a { color: var(--onnight-d); text-decoration: none; font-size: 14.6px; }
.da .pagefoot a:hover { color: #fff; }
.da .pagefoot__about { font-size: 14.6px; max-width: 40ch; margin-top: 14px !important; line-height: 1.6; }
.da .pagefoot__about a { text-decoration: underline; text-underline-offset: 3px; }
.da .pagefoot__contact { margin-top: 16px !important; display: grid; gap: 6px; }
.da .social { display: flex; gap: 8px; margin-top: 18px; }
.da .social a { width: 36px; height: 36px; border-radius: 9px; border: 1px solid var(--nline); display: grid; place-items: center; transition: color .15s ease, border-color .15s ease, background .15s ease, transform .15s ease; }
.da .social a:hover { color: #fff; border-color: var(--blue); background: rgba(52,152,219,.14); transform: translateY(-2px); }
.da .social svg { width: 17px; height: 17px; }
.da .pagefoot__family { margin-top: 34px; padding-top: 18px; border-top: 1px solid var(--nline); display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; font-size: 13.5px; }
.da .pagefoot__family b { font-family: var(--mono); font-size: 11px; font-weight: 400; letter-spacing: .13em; text-transform: uppercase; color: var(--ember-lt); }
.da .pagefoot__legal { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--nline); display: flex; flex-wrap: wrap; gap: 8px 22px; font-family: var(--mono); font-size: 11.5px; color: rgba(176,160,146,.85); }
.da .pagefoot__legal a { font-size: 11.5px; margin-left: auto; }

/* ============================================================ FLOATING BUTTONS */
.da .to-top {
  position: fixed; right: 18px; bottom: 134px; z-index: 70;
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--night); color: #fff; border: 1px solid rgba(255,255,255,.22);
  box-shadow: 0 10px 26px rgba(0,0,0,.28); text-decoration: none;
  opacity: 0; transform: translateY(10px); pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, background .15s ease;
}
.da .to-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.da .to-top:hover { background: var(--blue-dk); }
.da .to-top svg { width: 18px; height: 18px; }
.da .wa-float { background: #1F9E5A; }

/* ============================================================ MOTION */
.da .rise { transform: translateY(13px); transition: transform .68s cubic-bezier(.2,.7,.3,1); }
.da .rise.in { transform: none; }
@media (prefers-reduced-motion: reduce) {
  .da *, .da *::before, .da *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .da .rise { transform: none; }
}

/* DM-WEB1 contrast: skip link reads white on the deep blue (>= 4.5:1). */
.da .skip-link { background: #14548A; color: #fff; }
.da .band--night, .da .photo, .da .pagefoot { --dim: #B4A898; --ember-ink: var(--ember-lt); }

/* ============================================================ DM-WEB4 · ASK DESIMENUS
   The helper's button sits between WhatsApp (bottom) and back-to-top (above it).
   Open, the panel covers the corner, so the two floating buttons step aside. */
.da .dm-chat { position: fixed; right: 18px; bottom: 76px; z-index: 75; font-family: var(--ui); }
.da .dm-chat__open {
  display: inline-flex; align-items: center; gap: 9px; cursor: pointer;
  background: var(--night); color: #fff; border: 1px solid rgba(255,255,255,.22); border-radius: 999px;
  font: 700 14px/1 var(--ui); padding: 12px 17px; box-shadow: 0 12px 30px -12px rgba(0,0,0,.55);
  transition: transform .15s ease, background .15s ease;
}
.da .dm-chat__open:hover { transform: translateY(-2px); background: #22160D; }
.da .dm-chat__open svg { width: 19px; height: 19px; color: var(--blue-lt); flex: none; }
.da .dm-chat.is-open .dm-chat__open { display: none; }
.da.dm-chat-is-open .wa-float, .da.dm-chat-is-open .to-top { opacity: 0; pointer-events: none; }

.da .dm-chat__panel {
  position: fixed; right: 18px; bottom: 18px; z-index: 90;
  width: min(380px, calc(100vw - 24px)); height: min(560px, calc(100vh - 96px));
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--card); color: var(--ink); border: 1px solid var(--rule); border-radius: 14px;
  box-shadow: 0 30px 70px -20px rgba(16,10,6,.55);
}
.da .dm-chat__panel[hidden] { display: none; }
.da .dm-chat__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 14px 13px 18px; background: var(--night); color: #fff; }
.da .dm-chat__head b { display: block; font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; }
.da .dm-chat__head small { display: block; margin-top: 3px; font-size: 12px; color: #CFC5B8; }
.da .dm-chat__close { background: none; border: 0; color: #fff; padding: 6px; border-radius: 8px; cursor: pointer; }
.da .dm-chat__close:hover { background: rgba(255,255,255,.1); }
.da .dm-chat__close svg { width: 18px; height: 18px; display: block; }

.da .dm-chat__log { flex: 1; overflow-y: auto; padding: 16px 14px 8px; display: flex; flex-direction: column; gap: 10px; background: var(--paper); }
.da .dm-msg { max-width: 88%; padding: 10px 13px; border-radius: 12px; font-size: 14px; line-height: 1.5; }
.da .dm-msg p { margin: 0; }
.da .dm-msg p + p { margin-top: 4px; }
.da .dm-msg.bot { align-self: flex-start; background: var(--card); color: var(--ink); border: 1px solid var(--rule); border-bottom-left-radius: 4px; }
.da .dm-msg.me { align-self: flex-end; background: var(--blue-dk); color: #fff; border-bottom-right-radius: 4px; }
.da .dm-msg.typing { display: inline-flex; align-items: center; gap: 8px; color: var(--dim); }
.da .dm-msg.typing em { font-style: normal; font-size: 12.5px; }
.da .dm-dots { display: inline-flex; gap: 3px; }
.da .dm-dots span { width: 6px; height: 6px; border-radius: 50%; background: var(--dim); animation: dm-dot 1s infinite ease-in-out; }
.da .dm-dots span:nth-child(2) { animation-delay: .15s; }
.da .dm-dots span:nth-child(3) { animation-delay: .3s; }
@keyframes dm-dot { 0%, 80%, 100% { opacity: .3; transform: none; } 40% { opacity: 1; transform: translateY(-2px); } }
.da .dm-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.da .dm-links a { font-size: 12.5px; font-weight: 700; color: var(--blue-dk); text-decoration: none; border: 1px solid var(--blue-t); background: var(--blue-t); padding: 5px 10px; border-radius: 999px; }
.da .dm-links a:hover { border-color: var(--blue-dk); }

.da .dm-chat__chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 14px; background: var(--paper); }
.da .dm-chat__chips:empty { display: none; }
.da .dm-chat__chips button { font: 600 12.5px/1.2 var(--ui); color: var(--ink); background: var(--card); border: 1px solid var(--rule-2); border-radius: 999px; padding: 7px 11px; cursor: pointer; text-align: left; }
.da .dm-chat__chips button:hover { border-color: var(--blue-dk); color: var(--blue-dk); }

.da .dm-chat__form { display: flex; gap: 8px; padding: 10px 12px 12px; border-top: 1px solid var(--rule); background: var(--card); }
.da .dm-chat__form input { flex: 1; min-width: 0; font: 400 14.5px/1.3 var(--ui); color: var(--ink); background: #fff; border: 1px solid var(--rule-2); border-radius: 10px; padding: 10px 12px; }
.da .dm-chat__form input:focus { outline: 2px solid var(--blue); outline-offset: 1px; border-color: transparent; }
.da .dm-chat__form button { flex: none; width: 42px; border: 0; border-radius: 10px; background: var(--blue-dk); color: #fff; cursor: pointer; display: grid; place-items: center; }
.da .dm-chat__form button svg { width: 18px; height: 18px; }

@media (max-width: 560px) {
  .da .dm-chat { bottom: 74px; }
  .da .dm-chat__open span { display: none; }
  .da .dm-chat__open { padding: 13px; }
  .da .to-top { bottom: 130px; }
  .da .dm-chat__panel { right: 12px; bottom: 12px; height: min(560px, calc(100vh - 80px)); }
}
@media (prefers-reduced-motion: reduce) { .da .dm-dots span { animation: none; } }

/* ============================================================ DM-WEB5 · INNER PAGES
   Sign-in, start, verify, the legal pages and the error page were drawn for v7's
   dark ground. Under Direction A they sit on paper, so they take its type and
   buttons here rather than each page being redrawn. */
.da main > .section { padding: clamp(56px, 7vw, 96px) 0 clamp(64px, 8vw, 110px); }
.da .wrap-narrow { max-width: 780px; }
.da main > .section h1, .da main > .section .section-title { font-family: var(--disp); font-weight: 400; font-size: clamp(36px, 5vw, 60px); line-height: .98; color: var(--ink); margin: 14px 0 18px; max-width: none; }
.da main > .section h2 { font-size: clamp(22px, 2.4vw, 28px); margin: 34px 0 12px; color: var(--ink); }
.da main > .section p { color: var(--mid); font-size: 17px; line-height: 1.65; max-width: 64ch; }
.da main > .section p + p { margin-top: 12px; }
.da main > .section a:not(.btn) { color: var(--blue-dk); text-underline-offset: 3px; }
.da main > .section .section-lead { margin: 0 0 22px; color: var(--mid); }
.da main > .section .muted { color: var(--dim); }
.da main > .section .btn-primary { background: var(--blue-dk); color: #fff; border-color: transparent; }
.da main > .section .btn-primary:hover { background: #155A89; }
.da main > .section .btn { font-family: var(--ui); font-weight: 800; border-radius: 10px; margin-top: 8px; height: auto; }
.da main > .section .contact-details { list-style: none; padding: 0; margin: 0; }
.da main > .section .contact-details li { font-family: var(--ui); color: var(--ink); }
.da main > .section .contact-details .i { stroke: var(--ember); fill: none; color: var(--ember); }
.da .inner__actions { margin: 6px 0 8px; }
.da .inner__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.da .inner__links a { font-weight: 600; }
.da .inner__back { margin-top: 40px !important; font-size: 15px !important; }

/* Forms on the start and verify pages: paper fields, ink labels. */
.da main > .section .ds-field { margin-bottom: 16px; }
.da main > .section .ds-field__label { color: var(--ink); font-family: var(--ui); font-size: 13px; }
.da main > .section .ds-field__input { background: #fff; color: var(--ink); border: 1px solid var(--rule-2); border-radius: 10px; font-family: var(--ui); }
.da main > .section .ds-field__input:focus { border-color: var(--blue-dk); outline: 2px solid var(--blue-t); }
.da main > .section .form-note { color: var(--leaf); }
.da main > .section .form-note.note-error { color: #A8321E; }
.da main > .section .form-note.note-info { color: var(--ink); background: var(--blue-t); }
.da main > .section .claim-card { background: var(--card); color: var(--ink); border: 1px solid var(--rule); }
.da main > .section .claim-card__label, .da main > .section .claim-card__pair dt { color: var(--dim); }
.da main > .section .claim-card { border: 2px solid var(--blue-dk); }
.da main > .section .claim-card__pair dd, .da main > .section .claim-card__pair code { color: var(--ink); }
.da main > .section .claim-card__warning { color: #A8321E; }

/* ============================================================ DM-WEB5 · CARD ROWS THAT DIVIDE EVENLY
   Grids that auto-fit leave an orphan when the count does not divide the row:
   four plans fell 3 + 1 and eight formats 3 + 3 + 2. Where the count is
   even, the row is four wide on a desktop and two wide in between, so every
   row is full. Any other count keeps the auto-fit rule above. */
@media (min-width: 1140px) {
  .da .tickets:has(> :nth-child(4):last-child),
  .da .tickets:has(> :nth-child(8):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .da .fmts:has(> :nth-child(4):last-child),
  .da .fmts:has(> :nth-child(8):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 641px) and (max-width: 1139px) {
  .da .tickets:has(> :nth-child(2n):last-child),
  .da .fmts:has(> :nth-child(2n):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.da .tickets > *, .da .fmts > *, .da .tiers > * { min-width: 0; }
.da [id] { scroll-margin-top: 84px; }
.da .tk--best { --dim: #B4A898; --ember-ink: var(--ember-lt); --mid: var(--onnight-d); }
.da main > .section .center, .da main > .wrap .center { margin-left: auto; margin-right: auto; text-align: center; }
.da main > .section.inner { padding-bottom: clamp(72px, 9vw, 120px); }
.da main > .section .inner__sub { font-size: clamp(20px, 2.2vw, 26px); margin: 38px 0 12px; }

/* ============================================================ DM-WEB5 · CONTACT, BALANCED
   The copy column ended a third of the way down the form; it now carries
   "what happens next" and stays in view beside the form on a desktop. The
   three "I am…" tiles sit three across with the icon above the words,
   instead of two plus an orphan. */
.da #contact .contact-next { list-style: none; margin: 34px 0 0; padding: 0; display: grid; gap: 0; counter-reset: nxt; border-top: 1px solid var(--rule); }
.da #contact .contact-next li { counter-increment: nxt; display: grid; grid-template-columns: 42px 1fr; column-gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--rule); }
.da #contact .contact-next li::before { content: "0" counter(nxt); grid-row: 1 / span 2; font-family: var(--mono); font-size: 12.5px; color: var(--ember-ink); padding-top: 3px; }
.da #contact .contact-next b { font-size: 16px; font-weight: 800; color: var(--ink); }
.da #contact .contact-next span { font-size: 14.6px; color: var(--mid); line-height: 1.5; margin-top: 3px; }
@media (min-width: 901px) {
  .da #contact .contact-card { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
  .da #contact .contact-copy { position: sticky; top: 96px; }
}
@container oxf (min-width: 560px) {
  .da .dm-oxf .oxf-tiles:not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .da .dm-oxf .oxf-tiles:not(:has(> :nth-child(4))) .oxf-tile { flex-direction: column; gap: 10px; padding: 16px 14px 16px; }
}
.da .dm-oxf .oxf-tile-sub { color: var(--mid); }

/* ============================================================ DM-WEB6 · LEGAL PAGES
   Privacy, terms, refunds, sub-processors, the grievance officer and the
   grievance form, on paper, in the site's own type. */
.da main > .section.legal .wrap-narrow { max-width: 820px; }
.da .legal__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 6px 0 22px; }
.da .legal__fact { background: var(--card); border: 1px solid var(--rule); border-radius: 10px; padding: 14px 16px; display: grid; gap: 4px; }
.da .legal__fact span { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ember-ink); }
.da .legal__fact b { font-size: 15.5px; color: var(--ink); overflow-wrap: anywhere; }
.da .legal__fact small { font-size: 13.4px; color: var(--mid); }
.da .legal__toc { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 30px; padding-bottom: 18px; border-bottom: 1px solid var(--rule); }
.da main > .section .legal__toc a { font-size: 13.5px; font-weight: 700; color: var(--mid); text-decoration: none; border: 1px solid var(--rule-2); border-radius: 999px; padding: 6px 12px; background: var(--card); }
.da main > .section .legal__toc a:hover { color: var(--blue-dk); border-color: var(--blue-dk); }
.da main > .section .legal__toc a[aria-current="page"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.da .legal__body h2 { font-family: var(--ui); font-weight: 800; font-size: 20px; letter-spacing: -.01em; line-height: 1.3; margin: 30px 0 10px; color: var(--ink); scroll-margin-top: 96px; }
.da .legal__body h3 { font-family: var(--ui); font-weight: 800; font-size: 17px; line-height: 1.3; margin: 22px 0 8px; color: var(--ink); }
.da .legal__body ul { margin: 10px 0 14px; padding-left: 20px; color: var(--mid); }
.da .legal__body li { margin: 5px 0; line-height: 1.6; font-size: 16.4px; }
.da .legal__body li::marker { color: var(--ember); }
.da .legal__body p + p { margin-top: 10px; }
.da .legal__body strong { color: var(--ink); }
.da .legal__part { font-family: var(--mono) !important; font-size: 12px !important; letter-spacing: .14em; text-transform: uppercase; color: var(--ember-ink) !important; margin: 40px 0 0 !important; padding-top: 18px; border-top: 2px solid var(--ink); }
.da .legal__part:first-child { margin-top: 0 !important; }
.da .legal__meta { margin-top: 34px !important; padding-top: 16px; border-top: 1px dashed var(--rule-2); font-size: 14px !important; color: var(--dim) !important; }
.da .legal__table { overflow-x: auto; border: 1px solid var(--rule); border-radius: 12px; background: var(--card); }
.da .legal__table table { width: 100%; border-collapse: collapse; min-width: 720px; }
.da .legal__table th { text-align: left; font-family: var(--mono); font-size: 11px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--ember-ink); padding: 14px 16px; border-bottom: 1px solid var(--rule); background: var(--paper-2); }
.da .legal__table td { padding: 14px 16px; border-bottom: 1px solid var(--rule); vertical-align: top; font-size: 14.8px; line-height: 1.55; color: var(--mid); }
.da .legal__table tr:last-child td { border-bottom: 0; }
.da .legal__table td:first-child { font-weight: 800; color: var(--ink); width: 22%; }
.da main > .section .legal__table a { color: var(--blue-dk); }
.da .legal__table + .legal__body { margin-top: 24px; }
.da .legal__officer { margin: 0 0 24px; border: 1px solid var(--rule); border-radius: 12px; background: var(--card); }
.da .legal__officer div { display: grid; grid-template-columns: 170px 1fr; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--rule); }
.da .legal__officer div:last-child { border-bottom: 0; }
.da .legal__officer dt { font-family: var(--mono); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ember-ink); padding-top: 3px; }
.da .legal__officer dd { margin: 0; font-weight: 700; color: var(--ink); }
@media (max-width: 560px) { .da .legal__officer div { grid-template-columns: 1fr; gap: 2px; } }

.da .grv { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: clamp(22px, 4vw, 44px); align-items: start; }
@media (max-width: 900px) { .da .grv { grid-template-columns: 1fr; } }
.da .grv__form { background: var(--card); border: 1px solid var(--rule); border-radius: 12px; padding: clamp(18px, 2.6vw, 28px); box-shadow: 0 3px 8px rgba(25,16,9,.05), 0 22px 46px rgba(25,16,9,.10); }
.da .grv__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 620px) { .da .grv__grid { grid-template-columns: 1fr; } }
.da .grv__wide { grid-column: 1 / -1; }
.da main > .section .grv__form .ds-field { display: flex; flex-direction: column; gap: 6px; }
.da main > .section .grv__form .ds-field__input { width: 100%; min-height: 44px; padding: 10px 12px; font-size: 15px; }
.da main > .section .grv__form textarea.ds-field__input { min-height: 140px; resize: vertical; }
.da main > .section .grv__note { font-size: 14px; color: var(--dim); margin: 2px 0 6px; }
.da main > .section .grv__fallback { font-size: 13.5px; color: var(--dim); margin-top: 12px; }
.da .grv__aside { background: var(--night); color: var(--onnight); border-radius: 12px; padding: clamp(20px, 2.6vw, 28px); position: sticky; top: 96px; }
.da main > .section .grv__aside h2 { color: #fff; font-size: 26px; margin: 0 0 14px; }
.da main > .section .grv__aside h3 { color: #fff; font-family: var(--ui); font-weight: 800; font-size: 15px; margin: 22px 0 8px; }
.da .grv__aside ol { list-style: none; margin: 0; padding: 0; counter-reset: g; }
.da .grv__aside li { counter-increment: g; display: grid; grid-template-columns: 34px 1fr; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.da .grv__aside li::before { content: "0" counter(g); grid-row: 1 / span 2; font-family: var(--mono); font-size: 12px; color: var(--ember-lt); padding-top: 3px; }
.da .grv__aside li b { color: #fff; font-size: 15px; }
.da .grv__aside li span { color: var(--onnight-d); font-size: 13.8px; line-height: 1.5; }
.da .grv__aside dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 14px; }
.da .grv__aside dt { color: var(--onnight-d); font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; padding-top: 3px; }
.da .grv__aside dd { margin: 0; color: #fff; overflow-wrap: anywhere; }
.da main > .section .grv__aside a { color: var(--blue-lt); }

/* ============================================================ DM-WEB6 · DOWNLOAD THE APP */
.da .dl { padding: clamp(56px, 7vw, 96px) 0 clamp(64px, 8vw, 110px); }
.da .dl__notice { margin: 0 0 28px; padding: 14px 18px; border-radius: 10px; background: var(--blue-t); border: 1px solid #C7E0F2; color: var(--ink); font-size: 15.5px; max-width: 760px; }
.da .dl__notice b { color: var(--blue-dk); }
.da .dl__title { font-size: clamp(36px, 5vw, 62px); margin: 14px 0 16px; max-width: 16ch; }
.da .dl__lead { font-size: 17.6px; color: var(--mid); max-width: 66ch; line-height: 1.65; }
.da .dl__platforms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 36px; }
@media (max-width: 760px) { .da .dl__platforms { grid-template-columns: 1fr; } }
.da .dl-card { background: var(--card); border: 1px solid var(--rule); border-radius: 14px; padding: clamp(20px, 2.6vw, 30px); display: flex; flex-direction: column; gap: 22px; box-shadow: 0 3px 8px rgba(25,16,9,.05), 0 22px 46px rgba(25,16,9,.08); }
.da .dl-card__head { display: grid; grid-template-columns: 52px 1fr; gap: 16px; align-items: start; }
.da .dl-card__icon { width: 52px; height: 52px; padding: 12px; border-radius: 12px; background: var(--night); color: var(--blue-lt); }
.da .dl-card h2 { font-size: 30px; }
.da .dl-card p { margin-top: 8px; color: var(--mid); font-size: 15.4px; line-height: 1.55; }
.da .dl-card__acts { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: auto; }
.da .dl-card__soon { font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ember-ink); background: var(--ember-t); border-radius: 999px; padding: 8px 13px; }
.da .dl__version { margin-top: 12px; font-family: var(--mono); font-size: 12.5px; color: var(--dim); }
.da .dl__h2 { font-size: clamp(26px, 3.2vw, 40px); margin: clamp(48px, 6vw, 72px) 0 18px; }
.da .dl-roles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.da .dl-role { background: var(--card); border: 1px solid var(--rule); border-radius: 12px; padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; }
.da .dl-role b { font-size: 17px; font-weight: 800; color: var(--ink); }
.da .dl-role span { font-size: 14.6px; color: var(--mid); line-height: 1.5; }
.da .dl-role em { margin-top: auto; padding-top: 8px; font-style: normal; font-family: var(--mono); font-size: 11.5px; letter-spacing: .06em; color: var(--ember-ink); }
.da .dl__notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: clamp(40px, 5vw, 60px); padding-top: 28px; border-top: 1px solid var(--rule); }
@media (max-width: 860px) { .da .dl__notes { grid-template-columns: 1fr; } }
.da .dl__notes h3 { font-family: var(--ui); font-weight: 800; font-size: 17px; color: var(--ink); margin-bottom: 6px; }
.da .dl__notes p { color: var(--mid); font-size: 15.2px; line-height: 1.6; }
.da .dl__notes a { color: var(--blue-dk); }
.da main > .section.legal { padding-bottom: clamp(72px, 9vw, 120px); }

/* ============================================================ DM-WEB6 · TICKETS ON ONE LINE
   Each ticket spans eight rows of the tickets grid and shares them (subgrid):
   badge, name, blurb, price, fine print, button, "What's included", list. So
   the names, prices, buttons and lists line up across every card in a row,
   whatever the length of each blurb. Browsers without subgrid keep the
   column layout above. */
@supports (grid-template-rows: subgrid) {
  .da .tickets { row-gap: 0; }
  .da .tk { display: grid; grid-row: span 8; grid-template-rows: subgrid; row-gap: 0; margin-bottom: 20px; }
  .da .tk > * { align-self: start; min-width: 0; }
}
.da .tk__badge { justify-self: start; }
.da .tk__slot { display: block; }
.da .tk__badge, .da .tk__slot { min-height: 0; }

/* ============================================================ DM-WEB6 · INNER PAGES AT FULL WIDTH
   The legal, sign-up, verify and error pages were held to a narrow reading
   column (780–820px) while the sub-processors table used the site's full
   width, so the set looked squeezed beside it. Every inner page now uses the
   same width as the rest of the site; forms keep a comfortable field width. */
.da main > .section .wrap-narrow,
.da main > .section.legal .wrap-narrow { max-width: var(--wrap); }
.da main > .section.legal p,
.da main > .section.legal li,
.da main > .section.legal .section-lead,
.da main > .section.inner .section-lead { max-width: none; }
.da main > .section .form-fields { max-width: 760px; }
.da main > .section:not(#contact) p { max-width: none; }