/* ============================================================
   ALSYST — Responsive polish layer (v2)
   Loaded LAST on every page. Catch-all overrides for mobile +
   tablet so headers, modals, forms, sidebars, drawers, and
   complex layouts behave 320px → 1920px.
   ============================================================ */

/* --- Global containment --- */
html, body { overflow-x: clip; max-width: 100vw; }
@supports not (overflow-x: clip){ html, body { overflow-x: hidden; } }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, canvas, iframe { max-width: 100%; height: auto; }
canvas#tech-net, canvas.tech-net, canvas.ai-orb-sm, canvas.ai-orb,
.cur-dot, .cur-ring, [id$="-orb"]{ height: revert; max-width: revert; }
pre, code { overflow-x: auto; max-width: 100%; }
p, h1, h2, h3, h4, h5, h6, li, span, a, button { overflow-wrap: anywhere; word-break: normal; }
img { vertical-align: middle; }

/* --- Modals & overlay dialogs (catch-all) --- */
@media (max-width: 640px) {
  .modal,
  .study-modal,
  #signin-modal,
  #partner-modal,
  #waitlist-code-modal,
  #signup-modal,
  [role="dialog"] {
    padding: 12px !important;
    align-items: flex-start !important;
  }
  .modal-card,
  .study-modal-panel,
  .partner-modal-card,
  .signin-modal-card,
  .signup-modal-card,
  .pm-card,
  .ac-card {
    width: 100% !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 24px) !important;
    margin: 0 auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    border-radius: 16px !important;
    padding: 24px 20px !important;
  }
  .study-modal-panel { margin: 8px auto !important; max-height: calc(100vh - 16px) !important; }
  .modal-close, .study-close, .pm-close { top: 10px !important; right: 10px !important; }
}

/* --- Form inputs: prevent iOS zoom --- */
@media (max-width: 760px) {
  input[type="text"], input[type="email"], input[type="password"],
  input[type="search"], input[type="tel"], input[type="url"],
  input[type="number"], input:not([type]), textarea, select {
    font-size: 16px !important;
  }
}

/* --- Touch targets --- */
@media (max-width: 760px) {
  button, .btn, a.sso, .wl-cta, .cta-btn, [role="button"],
  .pill-cta, .signin-link, .icon-btn, .topbar-cta, .ac-submit,
  .lt-btn, .modal-btn, .pl-cta, .ac-cancel, .lang-cur, .mobile-burger,
  .hl-send {
    min-height: 40px;
  }
}

/* --- Hero / display type clamp safety --- */
@media (max-width: 640px) {
  .display, .hero-h1, .hero h1, .hero-pl-h, h1 {
    font-size: clamp(30px, 8.6vw, 48px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.02em !important;
  }
  .section-head h2, .explainer-head h2, .cases-head h2, .ccenter h2 {
    font-size: clamp(24px, 6.8vw, 38px) !important;
    line-height: 1.06 !important;
  }
  .hero-sub, .hero-pl-sub, .hero p, .lede {
    font-size: 14.5px !important;
    line-height: 1.55 !important;
  }
}

/* --- Smaller phones --- */
@media (max-width: 380px){
  .hero-pl-h, .hero h1, .display{ font-size: 30px !important; letter-spacing: -.018em !important; }
  .nav { padding: 12px 14px !important; gap: 8px !important; }
  .wrap, .container { padding-left: 16px !important; padding-right: 16px !important; }
}

/* --- Wide tables / horizontal scroll fallback --- */
.table-scroll, .scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* --- Cursor: hide custom cursors on touch / coarse pointer --- */
@media (hover: none), (pointer: coarse), (max-width: 760px) {
  .cursor-dot, .cursor-ring, #cursor-dot, #cursor-ring,
  .cur-dot, .cur-ring { display: none !important; }
  *, body, button, a, input, textarea, select { cursor: auto !important; }
}

/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --- Focus visibility --- */
:focus-visible {
  outline: 2px solid #8a6bff;
  outline-offset: 3px;
  border-radius: 6px;
}
button:focus:not(:focus-visible),
a:focus:not(:focus-visible),
input:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
select:focus:not(:focus-visible) { outline: none; }

/* --- Smooth scroll site-wide --- */
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* --- Selection color --- */
::selection { background: rgba(138, 107, 255, 0.35); color: #fff; }
html[data-theme="light"] ::selection { background: rgba(52, 3, 201, 0.18); color: #0d0d0d; }

/* --- Skip-to-content (a11y) --- */
.skip-link {
  position: absolute; left: -9999px; top: 12px; z-index: 99999;
  background: #3403C9; color: #fff; padding: 10px 16px;
  border-radius: 8px; font-weight: 600; font-size: 14px;
  text-decoration: none;
}
.skip-link:focus { left: 12px; outline: 2px solid #8a6bff; outline-offset: 2px; }

/* --- Disable tap highlight on iOS for buttons --- */
button, a, [role="button"] { -webkit-tap-highlight-color: transparent; }

/* --- Privacy / Terms: legible reading width + spacing --- */
.legal-body, .legal-content {
  max-width: 720px; margin: 0 auto;
  font-size: 15px; line-height: 1.7;
}
.legal-body h2, .legal-content h2 { margin-top: 2em; }
.legal-body p, .legal-content p { margin: 0.8em 0; }

/* --- GDPR bar / floating bottom UI on small screens --- */
@media (max-width: 640px) {
  #gdpr-bar {
    width: calc(100vw - 16px) !important;
    left: 8px !important; right: 8px !important;
    bottom: 12px !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 14px 16px !important;
    gap: 10px !important;
  }
  #gdpr-bar .gdpr-text { font-size: 12.5px !important; }
  .gdpr-btns { width: 100% !important; justify-content: flex-end !important; flex-wrap: wrap; gap: 8px !important; }
  .gdpr-btns button { flex: 1 1 auto; min-height: 40px; }
}

/* --- Pre-launch banner --- */
@media (max-width: 640px) {
  .prelaunch-bar { font-size: 12px !important; }
  .prelaunch-msg span.hide-mobile, .prelaunch-msg .hide-mobile { display: none !important; }
  .prelaunch-bar-inner { gap: 8px !important; padding: 9px 36px 9px 12px !important; font-size: 12px !important; flex-wrap: wrap; }
}
@media (max-width: 480px) {
  .prelaunch-bar-inner { padding: 8px 32px 8px 10px !important; font-size: 11.5px !important; }
}

/* --- Footer --- */
@media (max-width: 880px) {
  .foot-grid { grid-template-columns: 1fr 1fr !important; gap: 28px 18px !important; }
  .foot-grid > *:first-child { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .foot-grid { grid-template-columns: 1fr !important; }
  .foot-grid > *:first-child { grid-column: auto; }
  footer { padding: 44px 0 32px !important; }
  .foot-bottom { flex-direction: column !important; gap: 12px !important; align-items: flex-start !important; }
}

/* --- Nav: ensure it wraps cleanly on mobile --- */
@media (max-width: 640px) {
  .nav { padding: 12px 16px !important; gap: 10px 12px !important; }
  .nav-right { gap: 8px !important; }
  /* Hide desktop sign-in pill on phones - rely on burger menu */
  .nav-right .signin-link { display: none !important; }
  .nav-right .pill-cta { padding: 8px 14px !important; font-size: 12.5px !important; }
}
@media (max-width: 420px){
  .nav-right .pill-cta { display: none !important; }
  .nav .lang-picker .lang-cur span#lang-code { display: none; }
  .nav .lang-picker .lang-cur { padding: 6px 8px !important; }
}

/* --- Hero stats: better mobile breakpoints --- */
@media (max-width: 640px){
  .hero-stats { grid-template-columns: 1fr 1fr !important; gap: 0 !important; }
  .hero-stats .hs { padding: 18px 14px !important; }
  .hero-stats .hs-num { font-size: clamp(22px, 6vw, 30px) !important; }
}

/* --- Hero meta line wraps cleanly --- */
@media (max-width: 640px){
  .hero-meta { flex-wrap: wrap !important; gap: 8px !important; font-size: 11.5px !important; }
  .hero-meta .dot { display: none; }
}

/* --- Trust strip --- */
@media (max-width: 720px){
  .trust-strip { padding: 16px 0 !important; }
  .trust-strip-inner { font-size: 11.5px !important; }
}

/* --- Drawers / side panels: cap width --- */
@media (max-width: 640px) {
  #result-drawer, .result-drawer, .side-drawer,
  .ag-panel, #ag-panel, .agent-panel {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    right: 8px !important;
    left: auto !important;
  }
}

/* --- Toasts / floating buttons --- */
@media (max-width: 480px) {
  .toast, #toast {
    left: 12px !important; right: 12px !important;
    bottom: 12px !important;
    width: auto !important; max-width: none !important;
  }
}

/* --- Container max-width safety --- */
.wrap, .container, .page-wrap { max-width: 100%; box-sizing: border-box; }

/* --- Long URLs / emails in body copy --- */
.wl-foot, .modal-card a, .gdpr-text, .study-content { word-break: break-word; }

/* --- Two-ways cards / way-rows tighten on narrow --- */
@media (max-width: 540px){
  .way-rows .r { grid-template-columns: 72px 1fr !important; gap: 12px !important; padding: 12px 0 !important; }
  .way-rows .r .lab { font-size: 10px !important; }
  .way-head { padding: 24px 22px 18px !important; }
  .way-rows { padding: 4px 22px 18px !important; }
}

/* --- Token ledger: stack columns gracefully --- */
@media (max-width: 540px){
  .ledger-row {
    grid-template-columns: 22px 1fr !important;
    grid-template-rows: auto auto;
    row-gap: 4px;
    padding: 10px 0 !important;
  }
  .ledger-row .amt, .ledger-row .when {
    grid-column: 2;
    font-size: 11px;
  }
}

/* --- Cases meta on small phones --- */
@media (max-width: 380px){
  .case-meta { grid-template-columns: 1fr !important; gap: 12px !important; }
  .case-stats { grid-template-columns: 1fr 1fr !important; }
}

/* --- Reserve band stack --- */
@media (max-width: 880px){
  .reserve-band-inner { grid-template-columns: 1fr !important; gap: 22px !important; text-align: left !important; }
  .reserve-band { padding: 32px 24px !important; }
}

/* --- Hero agent card: tighter on mobile --- */
@media (max-width: 640px){
  .agent-card, .signup-card { padding: 22px 18px 20px !important; border-radius: 18px !important; }
  .agent-card .hl-body, .signup-card .hl-body { max-height: 280px !important; min-height: 200px !important; font-size: 13px !important; }
  .hl-composer { padding: 6px 6px 6px 12px !important; border-radius: 12px !important; }
  .hl-composer input { font-size: 16px !important; }
  .hl-chips { gap: 6px !important; }
  .hl-chips button { font-size: 12px !important; padding: 7px 10px !important; }
}

/* --- Mobile menu drawer: ensure it's full-height & scrollable --- */
@media (max-width: 920px){
  .mobile-menu {
    max-height: 100vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* --- Scroll manifesto: keep readable on phones --- */
@media (max-width: 760px){
  .scroll-manifesto, .sm-section { min-height: 0 !important; padding: 80px 0 !important; }
  .sm-line { font-size: clamp(28px, 7vw, 44px) !important; line-height: 1.05 !important; }
}

/* --- Pre-launch dashboard: sidebar drawer behavior on tablet/mobile --- */
@media (max-width: 980px){
  .shell { grid-template-columns: 1fr !important; }
  .sidebar { transform: translateX(-100%); transition: transform .3s ease; }
  .sidebar.open { transform: translateX(0); }
  .menu-burger { display: inline-flex !important; }
}
@media (max-width: 760px){
  .topbar { padding: 0 14px !important; gap: 8px !important; }
  main, .main, .scroller { padding: 16px !important; }
  .hero { grid-template-columns: 1fr !important; padding: 24px 18px !important; }
  .subs { grid-template-columns: 1fr !important; gap: 12px !important; }
  .sub { padding: 18px 16px !important; }
  .acc { padding: 12px 16px !important; }
}
@media (max-width: 540px){
  .agent-launcher .ag-text { display: none !important; }
  .agent-launcher { padding: 10px 14px !important; }
  .pack-grid { grid-template-columns: 1fr !important; }
}

/* --- Waitlist gate: scroll inside gate on tiny screens, stack pillars --- */
@media (max-width: 640px){
  #waitlist-gate { align-items: flex-start !important; padding: 16px 12px !important; min-height: 100vh; overflow-y: auto !important; }
  .wl-card { width: 100% !important; max-width: 100% !important; padding: 28px 20px 24px !important; }
  .wl-pillars { flex-wrap: wrap !important; justify-content: center !important; gap: 6px !important; }
  .wl-pillar { font-size: 11px !important; padding: 6px 10px !important; }
  .wl-cta { width: 100% !important; padding: 14px 18px !important; font-size: 14.5px !important; }
}

/* --- Onboarding form: legible on phones --- */
@media (max-width: 640px){
  .onb-card, .ob-card { padding: 28px 20px !important; border-radius: 18px !important; }
  .onb-form input, .onb-form textarea, .ob-input { font-size: 16px !important; padding: 14px 16px !important; }
  .onb-step-dots { gap: 6px !important; }
  .onb-actions, .ob-actions { flex-direction: column-reverse !important; gap: 10px !important; align-items: stretch !important; }
  .onb-actions button, .ob-actions button { width: 100% !important; min-height: 44px !important; }
}

/* --- AI agent: force every accent surface onto the active sector colour --- */
.agent-panel, .agent-launcher,
#agent-panel, #agent-launcher {
  --sector: inherit !important;
  --sector-soft: inherit !important;
  --sector-glow: inherit !important;
  --accent: var(--sector);
}
.ag-composer .ag-send,
.ag-send,
.agent-launcher .ag-fab,
.ag-fab,
.ag-chip.primary,
.ag-mic.active,
.ag-voice-btn,
.agent-panel .send-btn {
  background: var(--sector) !important;
  color: #0a0a0a !important;
  border-color: var(--sector) !important;
}
.ag-orb-wrap::before,
.ag-orb-wrap::after { border-color: var(--sector) !important; }
.ag-chip:hover { border-color: var(--sector) !important; color: var(--sector) !important; }
.ag-composer:focus-within { border-color: var(--sector) !important; }

/* --- Agent panel responsive --- */
@media (max-width: 640px){
  .agent-panel, #agent-panel {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    height: calc(100vh - 100px) !important;
    max-height: calc(100vh - 100px) !important;
    right: 8px !important; bottom: 76px !important;
    border-radius: 18px !important;
  }
  .agent-launcher, #agent-launcher {
    right: 12px !important; bottom: 12px !important;
  }
}

/* ============================================================
   v3 — COMPREHENSIVE MOBILE SWEEP (every page, every component)
   ============================================================ */

/* === GLOBAL: prevent any element from overflowing viewport === */
@media (max-width: 760px){
  *, *::before, *::after { max-width: 100vw; }
  body { -webkit-text-size-adjust: 100%; }
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  pre, code, kbd { white-space: pre-wrap; word-break: break-word; }
}

/* === LANDING — diagram + explainer + ways + steps === */
@media (max-width: 760px){
  .diagram { grid-template-columns: 1fr !important; }
  .diag-col { padding: 22px 18px 24px !important; border-right: 0 !important; border-bottom: 1px solid var(--hairline) !important; }
  .diag-col:last-child { border-bottom: 0 !important; }
  .diag-col h3 { font-size: 18px !important; }
  .diag-col p { font-size: 13px !important; line-height: 1.55 !important; }
  .ways { grid-template-columns: 1fr !important; gap: 18px !important; }
  .way { padding: 0 !important; }
  .way-head h3 { font-size: 22px !important; }
  .way-head p { font-size: 13px !important; line-height: 1.55 !important; }
  .steps { grid-template-columns: 1fr !important; }
  .step { padding: 24px 22px !important; border-right: 0 !important; border-bottom: 1px solid var(--hairline) !important; }
  .step:last-child { border-bottom: 0 !important; }
  .step h4 { font-size: 16px !important; }
  .step p { font-size: 13px !important; }
  .tokens { grid-template-columns: 1fr !important; gap: 24px !important; }
}

/* === LANDING — case studies grid === */
@media (max-width: 760px){
  .cases-head { grid-template-columns: 1fr !important; gap: 18px !important; }
  .cases-grid { grid-template-columns: 1fr !important; gap: 14px !important; }
  .case-card { padding: 24px 20px !important; }
  .case-card h3 { font-size: 20px !important; }
  .case-card p { font-size: 13px !important; }
  .case-meta { grid-template-columns: 1fr 1fr !important; gap: 12px !important; padding-bottom: 14px !important; }
  .case-meta > * { font-size: 11px !important; }
}
@media (max-width: 420px){
  .case-meta { grid-template-columns: 1fr !important; }
}

/* === LANDING — case modal === */
@media (max-width: 760px){
  .study-modal-panel { margin: 8px !important; max-height: calc(100vh - 16px) !important; border-radius: 14px !important; }
  .study-scroll { padding: 36px 18px 44px !important; }
  .study-hero h1, .study-modal-panel h1 { font-size: clamp(26px, 7vw, 38px) !important; line-height: 1.1 !important; }
  .study-hero h2, .study-modal-panel h2 { font-size: clamp(18px, 5vw, 24px) !important; }
  .study-stats-row { grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
  .study-stats-row .stat .v { font-size: clamp(22px, 6vw, 30px) !important; }
  .case-stats { grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
  .case-ba { grid-template-columns: 1fr !important; gap: 18px !important; }
}

/* === LANDING — Hero pre-launch === */
@media (max-width: 760px){
  .hero { padding: 28px 0 48px !important; }
  .hero-row { grid-template-columns: 1fr !important; gap: 26px !important; }
  .hero-pl-h, .hero h1 { font-size: clamp(32px, 9vw, 52px) !important; line-height: 1.04 !important; }
  .hero-pl-sub, .hero p.lede { font-size: 14px !important; line-height: 1.55 !important; }
  .hero-stats { grid-template-columns: 1fr 1fr !important; }
  .hero-stats .hs { padding: 16px 12px !important; }
  .hero-orbit { display: none !important; }
}

/* === LANDING — Manifesto / scroll-manifesto === */
@media (max-width: 760px){
  .scroll-manifesto { padding: 60px 0 !important; }
  .sm-section { min-height: 0 !important; padding: 40px 0 !important; }
  .sm-line { font-size: clamp(26px, 7.5vw, 44px) !important; line-height: 1.08 !important; }
  .sm-line.sm-emph { font-size: clamp(30px, 9vw, 50px) !important; }
}

/* === LANDING — Hero agent card (collapsed launcher state) === */
@media (max-width: 760px){
  .signup-card:not(.mobile-open) .signup-card-head,
  .signup-card:not(.mobile-open) .hl-body,
  .signup-card:not(.mobile-open) .hl-chips,
  .signup-card:not(.mobile-open) .hl-composer,
  .signup-card:not(.mobile-open) .signup-buttons,
  .signup-card:not(.mobile-open) .signup-footnote { display: none !important; }
  .signup-card:not(.mobile-open)::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: radial-gradient(circle at 50% 50%, rgba(122,77,255,.5) 0%, transparent 70%);
  }
}

/* === PRE-LAUNCH DASHBOARD — sectors grid, cards, agent === */
@media (max-width: 760px){
  .sectors-grid, .sub-grid, .subs { grid-template-columns: 1fr !important; gap: 12px !important; }
  .sector, .sub { padding: 16px 14px !important; }
  .sector h3 { font-size: 15px !important; }
  .sub h4 { font-size: 14px !important; }
  .acc-list .acc { padding: 12px 14px !important; gap: 10px !important; }
  .acc .acc-lbl { font-size: 13px !important; }
  .acc .acc-meta { font-size: 11px !important; }
  .acc .acc-status { font-size: 11px !important; padding: 4px 8px !important; }
  .topbar { padding: 0 12px !important; gap: 8px !important; height: 56px !important; }
  .topbar .brand-wrap, .topbar .brand-name { font-size: 14px !important; }
  .topbar-right { gap: 6px !important; }
  .topbar-cta { padding: 7px 10px !important; font-size: 12px !important; }
  .hero, .pl-hero { padding: 20px 16px !important; }
  .hero h1, .pl-hero h1 { font-size: clamp(22px, 6.5vw, 32px) !important; line-height: 1.1 !important; }
  .hero p, .pl-hero p { font-size: 13px !important; }
  .quick-links { grid-template-columns: 1fr 1fr !important; }
  .pack-grid { grid-template-columns: 1fr !important; }
}

/* === PRE-LAUNCH — waitlist gate, code modal === */
@media (max-width: 760px){
  #waitlist-gate { padding: 12px !important; }
  .wl-card { padding: 28px 20px 24px !important; max-width: 100% !important; width: 100% !important; }
  .wl-card h1, .wl-h1 { font-size: clamp(24px, 7vw, 36px) !important; line-height: 1.08 !important; }
  .wl-card p, .wl-sub { font-size: 13.5px !important; line-height: 1.5 !important; }
  .wl-pillars { flex-wrap: wrap !important; justify-content: center !important; gap: 6px !important; }
  .wl-pillar { font-size: 10.5px !important; padding: 5px 9px !important; }
  .wl-cta { padding: 13px 16px !important; font-size: 14px !important; }
  .wl-foot { font-size: 11px !important; line-height: 1.5 !important; flex-wrap: wrap !important; justify-content: center !important; gap: 4px 8px !important; }
}

/* === DASHBOARD — sidebar, sector list, tasks === */
@media (max-width: 980px){
  .sidebar { width: min(86vw, 320px) !important; }
}
@media (max-width: 760px){
  .ag-panel, #ag-panel {
    width: calc(100vw - 16px) !important;
    height: calc(100vh - 80px) !important;
    right: 8px !important; left: auto !important;
    bottom: 70px !important;
    border-radius: 16px !important;
  }
  .ag-body { padding: 12px !important; font-size: 13px !important; }
  .ag-msg { font-size: 13px !important; padding: 10px 12px !important; }
  .ag-composer { padding: 6px 6px 6px 10px !important; }
  .ag-composer input, .ag-composer textarea { font-size: 16px !important; }
  .ag-head { padding: 12px 14px !important; }
  .ag-head .ag-title { font-size: 13px !important; }
}

/* === ONBOARDING === */
@media (max-width: 640px){
  .ob-wrap, .onb-wrap { padding: 16px !important; min-height: 100vh !important; }
  .ob-card, .onb-card { padding: 28px 20px !important; border-radius: 18px !important; }
  .ob-q, .onb-q { font-size: clamp(20px, 5.5vw, 28px) !important; line-height: 1.15 !important; }
  .ob-sub, .onb-sub { font-size: 13px !important; }
  .ob-options { grid-template-columns: 1fr !important; gap: 8px !important; }
  .ob-option, .onb-option { padding: 14px 16px !important; font-size: 14px !important; min-height: 50px !important; }
  .ob-input, .onb-input { font-size: 16px !important; padding: 14px 16px !important; }
  .ob-actions, .onb-actions { flex-direction: column-reverse !important; gap: 10px !important; }
  .ob-actions button, .onb-actions button { width: 100% !important; min-height: 46px !important; }
  .ob-progress, .onb-step-dots { gap: 6px !important; margin-bottom: 16px !important; }
}

/* === LEGAL pages (Privacy / Terms) === */
@media (max-width: 760px){
  .legal-wrap, .legal-page, main.legal { padding: 24px 18px 48px !important; }
  .legal-body h1, .legal-content h1, .legal h1 { font-size: clamp(26px, 7vw, 38px) !important; line-height: 1.1 !important; margin-bottom: 18px !important; }
  .legal-body h2, .legal-content h2, .legal h2 { font-size: clamp(18px, 5vw, 22px) !important; margin-top: 1.6em !important; }
  .legal-body p, .legal-content p, .legal p, .legal-body li, .legal li { font-size: 14px !important; line-height: 1.65 !important; }
  .legal-toc { font-size: 13px !important; padding: 16px !important; }
  .legal-meta { font-size: 12px !important; flex-wrap: wrap !important; gap: 8px !important; }
}

/* === FOOTER on landing === */
@media (max-width: 760px){
  footer { padding: 48px 0 32px !important; }
  .foot-grid { grid-template-columns: 1fr 1fr !important; gap: 24px 18px !important; }
  .foot-grid h5 { font-size: 10px !important; margin-bottom: 10px !important; }
  .foot-grid ul { font-size: 12px !important; gap: 6px !important; }
  .foot-bottom { flex-direction: column !important; gap: 10px !important; align-items: flex-start !important; padding-top: 24px !important; font-size: 11px !important; }
}
@media (max-width: 420px){
  .foot-grid { grid-template-columns: 1fr !important; }
}

/* === Reserve band === */
@media (max-width: 760px){
  .reserve-band { padding: 36px 22px !important; margin: 36px 0 !important; }
  .reserve-band-inner { grid-template-columns: 1fr !important; gap: 20px !important; text-align: left !important; }
  .reserve-band h2 { font-size: clamp(22px, 6.5vw, 32px) !important; }
  .reserve-band p { font-size: 13.5px !important; }
  .reserve-btn { width: 100% !important; }
}

/* === Cookie banner — definitive mobile === */
@media (max-width: 640px){
  #gdpr-bar {
    left: 10px !important; right: 10px !important; bottom: 14px !important;
    width: auto !important; max-width: none !important;
    transform: none !important; margin: 0 !important;
    padding: 12px 14px !important; border-radius: 14px !important;
    flex-direction: column !important; align-items: stretch !important; gap: 10px !important;
  }
  #gdpr-bar .gdpr-text { font-size: 12px !important; line-height: 1.45 !important; }
  .gdpr-btns { gap: 6px !important; flex-wrap: nowrap !important; }
  .gdpr-btn { font-size: 12px !important; padding: 9px 10px !important; min-height: 38px !important; flex: 1 1 0 !important; }
}

/* === Pre-launch top banner — never overlap nav === */
@media (max-width: 640px){
  .prelaunch-bar-inner { font-size: 11px !important; padding: 7px 32px 7px 10px !important; gap: 6px !important; line-height: 1.3 !important; }
  .prelaunch-close { right: 6px !important; }
}

/* === Universal: no element clipped by safe area === */
@supports (padding: max(0px)){
  #gdpr-bar { bottom: max(14px, env(safe-area-inset-bottom)) !important; }
  .agent-launcher, #agent-launcher, .help-btn, #help-btn,
  .signup-card { bottom: max(76px, calc(env(safe-area-inset-bottom) + 60px)) !important; }
}
@media (min-width: 761px){
  @supports (padding: max(0px)){
    .agent-launcher, #agent-launcher, .help-btn, #help-btn { bottom: 24px !important; }
    .signup-card { bottom: auto !important; }
  }
}

/* --- Print styles for legal pages --- */
@media print {
  .nav, .prelaunch-bar, footer, #gdpr-bar, .agent-launcher,
  .lang-picker, .theme-toggle, .mobile-burger { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  .legal-body, .legal-content { max-width: none !important; }
}