/* assets/theme/lz-theme.css */
/* ──────────────────────────────────────────────────────────────────────────
   Tema Lenzuoli — foglio condiviso, iniettato nelle sezioni caricate in iframe
   (Preventivi, Ristorazione, Studio Grafico, Instagram, Planner) da dashboard.html.
   1) Override dei token --bbr-* → palette avorio/arancio + Space Grotesk/Inter
      (tinge le pagine che usano il design system, es. dashboard-quotes.html).
   2) Blu "legacy" (#0071e3 e simili) → arancio del brand, anche per i colori fissi.
   ────────────────────────────────────────────────────────────────────────── */
/* assets/theme/bbr-tokens.css */
/* ============================================================================
   BBR — Design tokens v2
   ----------------------------------------------------------------------------
   Sistema di base. Tutto qui sotto è una variabile CSS riusabile.
   Niente valori hardcoded altrove: se serve un colore/spazio/radius che
   non esiste qui, prima lo aggiungiamo qui, poi lo usiamo.

   Convenzioni:
   - --bbr-ink-N  → scala neutri (0 = più scuro, 9 = più chiaro)
   - --bbr-bg-*   → colori di sfondo per layer (app, surface, sunken, elev)
   - --bbr-fg-*   → colori di testo (primary, secondary, muted, on-accent…)
   - --bbr-bd-*   → bordi (default, strong, focus)
   - --bbr-accent → primario (CTA, link). Cambia con [data-accent="..."]
   - --bbr-{green|amber|red} → semantici
   - --space-N, --text-*, --radius-*, --shadow-*, --dur-*, --ease-*
   ========================================================================== */


/* ====== NEUTRI (oklch, cool-neutral leggermente bluato) =================== */
:root {
  --bbr-ink-0:  oklch(15% 0.008 260);   /* nero quasi puro, testo principale */
  --bbr-ink-1:  oklch(22% 0.008 260);   /* heading scuro */
  --bbr-ink-2:  oklch(34% 0.008 260);   /* testo secondario */
  --bbr-ink-3:  oklch(48% 0.008 260);   /* testo terziario, label */
  --bbr-ink-4:  oklch(64% 0.008 260);   /* placeholder, icone soft */
  --bbr-ink-5:  oklch(82% 0.006 260);   /* bordi forti, divisori */
  --bbr-ink-6:  oklch(90% 0.005 260);   /* bordi sottili default */
  --bbr-ink-7:  oklch(95% 0.004 260);   /* chip soft, hover */
  --bbr-ink-8:  oklch(97.5% 0.003 260); /* page bg */
  --bbr-ink-9:  oklch(100% 0 0);        /* superfici card */

  /* ====== SEMANTIC ALIASES (light theme defaults) ====== */
  --bbr-bg-app:      var(--bbr-ink-8);     /* sfondo pagina */
  --bbr-bg-surface:  var(--bbr-ink-9);     /* card, modali */
  --bbr-bg-sunken:   var(--bbr-ink-7);     /* aree inset, codice, hover-soft */
  --bbr-bg-elev:     var(--bbr-ink-9);     /* popover, dropdown (alza con shadow) */
  --bbr-bg-overlay:  oklch(15% 0.008 260 / 0.45); /* backdrop modale */

  --bbr-fg-primary:   var(--bbr-ink-0);
  --bbr-fg-secondary: var(--bbr-ink-2);
  --bbr-fg-muted:     var(--bbr-ink-3);
  --bbr-fg-soft:      var(--bbr-ink-4);
  --bbr-fg-on-accent: oklch(99% 0 0);

  --bbr-bd-default: var(--bbr-ink-6);
  --bbr-bd-strong:  var(--bbr-ink-5);
  --bbr-bd-soft:    color-mix(in oklch, var(--bbr-ink-6) 60%, transparent);
  --bbr-bd-focus:   var(--bbr-accent);
  --bbr-ring:       color-mix(in oklch, var(--bbr-accent) 30%, transparent);

  /* ====== ACCENT (default: Bosco — verde sobrio, hospitality) ====== */
  --bbr-accent:        oklch(42% 0.085 158);
  --bbr-accent-hover:  oklch(36% 0.09 158);
  --bbr-accent-active: oklch(30% 0.09 158);
  --bbr-accent-soft:   color-mix(in oklch, oklch(42% 0.085 158) 14%, transparent);
  --bbr-accent-soft-fg: oklch(32% 0.09 158);

  /* ====== SEMANTIC COLORS ====== */
  --bbr-green:       oklch(54% 0.13 152);
  --bbr-green-soft:  color-mix(in oklch, oklch(54% 0.13 152) 12%, transparent);
  --bbr-green-fg:    oklch(38% 0.13 152);

  --bbr-amber:       oklch(70% 0.14 70);
  --bbr-amber-soft:  color-mix(in oklch, oklch(70% 0.14 70) 18%, transparent);
  --bbr-amber-fg:    oklch(42% 0.12 60);

  --bbr-red:         oklch(56% 0.20 25);
  --bbr-red-soft:    color-mix(in oklch, oklch(56% 0.20 25) 12%, transparent);
  --bbr-red-fg:      oklch(42% 0.18 25);

  /* Banner "Stai lavorando come" — accent warm, distintivo ma non urlato */
  --bbr-context:      oklch(55% 0.14 50);
  --bbr-context-soft: color-mix(in oklch, oklch(55% 0.14 50) 14%, transparent);
  --bbr-context-bd:   color-mix(in oklch, oklch(55% 0.14 50) 35%, transparent);


  /* ====== TIPOGRAFIA ====== */
  /* Pairing: Instrument Serif (display) + Inter (UI/body, come admin.shopify.com)
     - Instrument Serif: contemporanea, leggermente editoriale, ospitalità
     - Inter: neutra e stretta, numeri tabulari: il font della UI dal 2026-09-04 */
  --bbr-font-display: 'Instrument Serif', 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --bbr-font-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', system-ui, sans-serif;
  --bbr-font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Scala tipografica — 7 livelli, 4px-grid friendly */
  --text-xs:   11.5px;  /* meta, label uppercase */
  --text-sm:   13px;    /* secondario, label form, badge */
  --text-base: 14px;    /* body default (UI) */
  --text-md:   15px;    /* body alt / paragrafi lunghi */
  --text-lg:   18px;    /* sottotitolo, card title piccolo */
  --text-xl:   22px;    /* card title, section heading */
  --text-2xl:  28px;    /* H2 (serif) */
  --text-3xl:  36px;    /* H1 page (serif) */
  --text-4xl:  48px;    /* display large (serif) */

  /* Line heights */
  --lh-tight: 1.15;
  --lh-snug:  1.3;
  --lh-base:  1.5;
  --lh-loose: 1.65;

  /* Letter spacing */
  --tracking-tight:  -0.012em;
  --tracking-base:    0em;
  --tracking-wide:    0.04em;   /* label uppercase */

  /* Weights */
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;


  /* ====== SPAZI — 15 valori, nomi proporzionali come Shopify Polaris ======
     --space-N vale N/100 × 4px (200 = 8px, 800 = 32px): il nome dice il valore.
     Ogni padding/margin/gap del guscio passa da qui, mai in px scritti a mano:
     scripts/test-spacing-scale.php lo verifica. Fuori scala (10, 14, 18px…)
     non si aggiunge: si sceglie il vicino. */
  --space-0:    0;
  --space-025:  1px;   /* bordi hairline */
  --space-050:  2px;
  --space-100:  4px;   /* gap icona-testo nei badge */
  --space-150:  6px;   /* padding verticale celle tabella */
  --space-200:  8px;   /* gap icona-label, gap fra bottoni */
  --space-300:  12px;  /* padding orizzontale celle tabella */
  --space-400:  16px;  /* padding interno standard di una card */
  --space-500:  20px;
  --space-600:  24px;  /* gap verticale fra sezioni impilate */
  --space-800:  32px;  /* colonna principale ↔ colonna laterale */
  --space-1000: 40px;
  --space-1200: 48px;  /* respiro fra blocchi */
  --space-1600: 64px;
  --space-2000: 80px;
  --space-2400: 96px;


  /* ====== RADIUS — 4 livelli + full ====== */
  --radius-xs:   4px;   /* checkbox, dot, barre sottili */
  --radius-sm:   6px;   /* chip, badge, pulsanti piccoli */
  --radius-md:   8px;   /* input, bottoni standard */
  --radius-lg:  12px;   /* card */
  --radius-xl:  16px;   /* modali, hero card */
  --radius-full: 999px;


  /* ====== SHADOWS — 3 livelli ====== */
  --shadow-sm: 0 1px 2px rgba(15, 18, 30, 0.04),
               0 1px 1px rgba(15, 18, 30, 0.04);

  --shadow-md: 0 4px 12px rgba(15, 18, 30, 0.06),
               0 1px 3px rgba(15, 18, 30, 0.05);

  --shadow-lg: 0 14px 36px rgba(15, 18, 30, 0.12),
               0 4px 10px rgba(15, 18, 30, 0.06);

  /* Focus ring (riusabile come box-shadow su :focus-visible) */
  --shadow-focus: 0 0 0 3px var(--bbr-ring);


  /* ====== MOTION ====== */
  --dur-instant: 80ms;
  --dur-fast:    140ms;
  --dur-base:    200ms;
  --dur-slow:    320ms;

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);


  /* ====== LAYOUT ====== */
  --sidebar-w:      232px;
  --sidebar-w-mini: 60px;
  --header-h:       56px;
  --banner-h:       48px;
  --settings-max:   1000px;    /* colonna delle Impostazioni; tutto il resto è a tutta larghezza */
  --tap-target:     40px;
  --page-title-size: 24px;
  --icon-inline:    16px;
  --icon-action:    20px;
  --icon-state:     24px;
}


/* ============================================================================
   ACCENT VARIANTS — switch con [data-accent="indigo"|"ink"] sul <html>
   (Bosco è il default e non richiede attributo)
   ========================================================================== */

[data-accent="bosco"] {
  /* Default — esplicito per coerenza */
  --bbr-accent:        oklch(42% 0.085 158);
  --bbr-accent-hover:  oklch(36% 0.09 158);
  --bbr-accent-active: oklch(30% 0.09 158);
  --bbr-accent-soft:   color-mix(in oklch, oklch(42% 0.085 158) 14%, transparent);
  --bbr-accent-soft-fg: oklch(32% 0.09 158);
  --bbr-ring:          color-mix(in oklch, oklch(42% 0.085 158) 30%, transparent);
}

[data-accent="indigo"] {
  /* Alternativa Stripe-like: blu profondo, B2B fintech */
  --bbr-accent:        oklch(48% 0.16 265);
  --bbr-accent-hover:  oklch(42% 0.17 265);
  --bbr-accent-active: oklch(36% 0.17 265);
  --bbr-accent-soft:   color-mix(in oklch, oklch(48% 0.16 265) 12%, transparent);
  --bbr-accent-soft-fg: oklch(38% 0.18 265);
  --bbr-ring:          color-mix(in oklch, oklch(48% 0.16 265) 30%, transparent);
}

[data-accent="ink"] {
  /* Linear/Vercel-like: l'accent È il nero. Massima sobrietà. */
  --bbr-accent:        oklch(22% 0.01 265);
  --bbr-accent-hover:  oklch(15% 0.01 265);
  --bbr-accent-active: oklch(10% 0.01 265);
  --bbr-accent-soft:   color-mix(in oklch, oklch(22% 0.01 265) 8%, transparent);
  --bbr-accent-soft-fg: oklch(22% 0.01 265);
  --bbr-ring:          color-mix(in oklch, oklch(22% 0.01 265) 22%, transparent);
}


/* ============================================================================
   DARK MODE — swap dei soli alias semantici
   Strategia: invertiamo la scala "ink" e ridefiniamo gli alias.
   I componenti non sanno della differenza: usano sempre gli alias.
   ========================================================================== */

[data-theme="dark"] {
  --bbr-ink-0:  oklch(98% 0.003 260);   /* testo primario su dark */
  --bbr-ink-1:  oklch(92% 0.005 260);
  --bbr-ink-2:  oklch(80% 0.006 260);
  --bbr-ink-3:  oklch(66% 0.008 260);   /* terziario */
  --bbr-ink-4:  oklch(52% 0.01 260);
  --bbr-ink-5:  oklch(36% 0.012 260);   /* bordi forti */
  --bbr-ink-6:  oklch(28% 0.01 260);    /* bordi default */
  --bbr-ink-7:  oklch(22% 0.008 260);   /* hover-soft, chip */
  --bbr-ink-8:  oklch(15% 0.008 260);   /* page bg */
  --bbr-ink-9:  oklch(18.5% 0.008 260); /* surface (card) — leggermente più chiaro del bg */

  --bbr-bg-app:      var(--bbr-ink-8);
  --bbr-bg-surface:  var(--bbr-ink-9);
  --bbr-bg-sunken:   oklch(13% 0.008 260);
  --bbr-bg-elev:     oklch(22% 0.01 260);
  --bbr-bg-overlay:  oklch(8% 0.005 260 / 0.65);

  --bbr-fg-primary:   var(--bbr-ink-0);
  --bbr-fg-secondary: var(--bbr-ink-2);
  --bbr-fg-muted:     var(--bbr-ink-3);
  --bbr-fg-soft:      var(--bbr-ink-4);

  --bbr-bd-default: var(--bbr-ink-6);
  --bbr-bd-strong:  var(--bbr-ink-5);
  --bbr-bd-soft:    color-mix(in oklch, var(--bbr-ink-6) 70%, transparent);

  /* Accent default Bosco in dark: alziamo lievemente la luminosità per contrasto */
  --bbr-accent:        oklch(60% 0.10 158);
  --bbr-accent-hover:  oklch(66% 0.10 158);
  --bbr-accent-active: oklch(54% 0.10 158);
  --bbr-accent-soft:   color-mix(in oklch, oklch(60% 0.10 158) 20%, transparent);
  --bbr-accent-soft-fg: oklch(78% 0.10 158);

  --bbr-green:       oklch(70% 0.14 152);
  --bbr-green-soft:  color-mix(in oklch, oklch(70% 0.14 152) 18%, transparent);
  --bbr-green-fg:    oklch(82% 0.13 152);

  --bbr-amber:       oklch(78% 0.14 75);
  --bbr-amber-soft:  color-mix(in oklch, oklch(78% 0.14 75) 18%, transparent);
  --bbr-amber-fg:    oklch(85% 0.13 75);

  --bbr-red:         oklch(68% 0.19 25);
  --bbr-red-soft:    color-mix(in oklch, oklch(68% 0.19 25) 18%, transparent);
  --bbr-red-fg:      oklch(80% 0.16 25);

  --bbr-context:      oklch(70% 0.14 55);
  --bbr-context-soft: color-mix(in oklch, oklch(70% 0.14 55) 20%, transparent);
  --bbr-context-bd:   color-mix(in oklch, oklch(70% 0.14 55) 45%, transparent);

  /* Ombre più morbide su dark (meno contrasto, fanno fatica a leggersi) */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.40);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.45),
               0 1px 3px rgba(0, 0, 0, 0.30);
  --shadow-lg: 0 18px 40px rgba(0, 0, 0, 0.55),
               0 4px 12px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"][data-accent="bosco"] {
  /* Default Bosco in dark — esplicito */
  --bbr-accent:        oklch(60% 0.10 158);
  --bbr-accent-hover:  oklch(66% 0.10 158);
  --bbr-accent-active: oklch(54% 0.10 158);
  --bbr-accent-soft:   color-mix(in oklch, oklch(60% 0.10 158) 20%, transparent);
  --bbr-accent-soft-fg: oklch(78% 0.10 158);
  --bbr-ring:          color-mix(in oklch, oklch(60% 0.10 158) 35%, transparent);
}

[data-theme="dark"][data-accent="indigo"] {
  --bbr-accent:        oklch(62% 0.17 265);
  --bbr-accent-hover:  oklch(68% 0.17 265);
  --bbr-accent-active: oklch(56% 0.17 265);
  --bbr-accent-soft:   color-mix(in oklch, oklch(62% 0.17 265) 18%, transparent);
  --bbr-accent-soft-fg: oklch(78% 0.13 265);
  --bbr-ring:          color-mix(in oklch, oklch(62% 0.17 265) 30%, transparent);
}

[data-theme="dark"][data-accent="ink"] {
  /* In dark, "ink" diventa bianco. Pulito. */
  --bbr-accent:        oklch(95% 0.005 260);
  --bbr-accent-hover:  oklch(100% 0 0);
  --bbr-accent-active: oklch(85% 0.005 260);
  --bbr-accent-soft:   color-mix(in oklch, oklch(95% 0.005 260) 10%, transparent);
  --bbr-accent-soft-fg: oklch(95% 0.005 260);
  --bbr-fg-on-accent:  oklch(15% 0.008 260);
  --bbr-ring:          color-mix(in oklch, oklch(95% 0.005 260) 25%, transparent);
}




/* ============================================================================
   GLOBAL RESET LITE — solo l'indispensabile
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--bbr-font-sans);
  font-size: var(--text-base);
  line-height: var(--lh-base);
  color: var(--bbr-fg-primary);
  background: var(--bbr-bg-app);
  font-feature-settings: 'cv11', 'ss01', 'ss03';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: var(--bbr-accent-soft);
  color: var(--bbr-fg-primary);
}

/* Focus visibile, mai outline browser default */
:focus { outline: none; }
:focus-visible {
  outline: none;
  box-shadow: var(--shadow-focus);
}

/* Reduce motion safety */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/fonts/inter-latin.woff2') format('woff2')}

:root{
  --bbr-ink-0:#1a0f07; --bbr-ink-1:#21130a; --bbr-ink-2:#4a423a; --bbr-ink-3:#5f574d;
  --bbr-ink-4:#938a7d; --bbr-ink-5:#d2c7b2; --bbr-ink-6:#e0d7c6; --bbr-ink-7:#f1ead9;
  --bbr-ink-8:#f4efe6; --bbr-ink-9:#fbf8f1;
  --bbr-accent:#bb440e; --bbr-accent-hover:#7a2e0e; --bbr-accent-active:#6a280c;
  --bbr-accent-soft:color-mix(in srgb,#bb440e 14%,transparent); --bbr-accent-soft-fg:#7a2e0e;
  --bbr-bd-focus:#bb440e; --bbr-ring:color-mix(in srgb,#bb440e 30%,transparent);
  --bbr-blue:#1a5ab8; --bbr-blue-fg:#123f82; --bbr-blue-soft:#e8f0fe;
  --bbr-font-display:'Space Grotesk',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --bbr-font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --bbr-font-mono:'Space Grotesk','SFMono-Regular',ui-monospace,Menlo,Consolas,monospace;
  /* Studio Grafico's chrome follows the same theme; artwork colours remain data. */
  --tg-accent:var(--bbr-accent); --tg-accent-light:var(--bbr-accent-soft);
  --tg-purple:var(--bbr-accent); --tg-workspace:var(--bbr-bg-sunken);
  --tg-sidebar:var(--bbr-ink-0); --tg-sidebar-text:var(--bbr-ink-9);
  --tg-text:var(--bbr-fg-primary); --tg-text-dim:var(--bbr-fg-muted);
  --tg-border:var(--bbr-bd-default);

  /* Token namespace dei moduli "frame" (planner, ristorazione, studio grafico, ...):
     usano --accent/--ink/--bg ecc. (es. dashboard-fb.html: --accent:#0071e3 sui bottoni).
     Sovrascriviamo qui → bottoni e accenti diventano arancio, superfici avorio. */
  --bg:#f4efe6; --bg2:#f7f2e8; --canvas:#f4efe6;
  --surface:#fbf8f1; --surface-2:#f7f2e8;
  --ink:#21130a; --ink-2:#5f574d; --ink-3:#938a7d; --muted:#5f574d;
  --line:#e0d7c6; --line-2:#d2c7b2; --border:#e0d7c6;
  --accent:#bb440e; --accent-2:#7a2e0e; --accent-hover:#7a2e0e; --primary:#bb440e;
}

/* Font di brand anche negli embed legacy: i loro <style> inline dichiarano
   -apple-system/Inter sul body, ma questo foglio è linkato/iniettato DOPO quegli
   style, quindi a parità di specificità vince la regola qui sotto (niente font
   di sistema dentro gli iframe del cruscotto). */
body{ font-family:var(--bbr-font-sans); }
.bbr-table-scroll{ min-width:0; max-width:100%; overflow-x:auto; }

/* Focus ring coerente col cruscotto: gli embed lasciavano l'outline di default
   del browser (nero/blu). Il ring vale per tastiera e per i campi di testo. */
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible{
  outline:none;
  border-color:var(--bbr-bd-focus);
  box-shadow:0 0 0 3px var(--bbr-ring);
}

/* Titolo di pagina nel nero della barra (--bbr-fg-heading, passato dalla skin embed;
   ink-0 se la pagina e' aperta da sola), non piu' arancio: il marchio lo dice la barra.
   Il selettore per tag basta: ogni strumento embeddato ha ESATTAMENTE un <h1>,
   il proprio titolo, e nessuno di quegli <h1> ha una classe da agganciare. */
h1{ color:var(--bbr-fg-heading, var(--bbr-ink-0)); }
@media print{ h1{ color:#000; } }

/* Shared base: even an embed that previously styled bare button tags uses the
   same control. Layout-specific classes (toolbars, calendar cells) stay local. */
.btn {
  appearance:none; display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box; gap:var(--space-200); min-height:36px;
  padding:0 var(--space-300); border:1px solid var(--bbr-bd-default);
  border-radius:var(--radius-md); cursor:pointer;
  font:500 var(--text-sm)/1.3 var(--bbr-font-sans);
  color:var(--bbr-fg-secondary); background:var(--bbr-btn-bg, var(--bbr-bg-surface));
  box-shadow:var(--bbr-shadow-btn, var(--shadow-sm));
}
.btn:hover { background:var(--bbr-btn-bg-hover, var(--bbr-bg-sunken)); }
.btn.sec { color:var(--bbr-fg-secondary); background:var(--bbr-btn-bg, var(--bbr-bg-surface)); }
.btn.btn-primary,.btn.primary { color:var(--bbr-fg-on-accent); border-color:var(--bbr-accent); }
/* Keep the complete primary state stronger than legacy .btn:hover:not(:disabled). */
.btn.btn-primary:hover:not(:disabled),.btn.primary:hover:not(:disabled) {
  background:var(--bbr-btn-primary-bg-hover, var(--bbr-accent-hover));
  color:var(--bbr-fg-on-accent);
  border-color:var(--bbr-accent-hover);
}
.btn.btn-danger,.btn.del,.btn.danger { background:var(--bbr-bg-surface); color:var(--bbr-red-fg); border-color:var(--bbr-red-fg); }
.btn.btn-danger:hover,.btn.del:hover,.btn.danger:hover { background:var(--bbr-red-soft); }
.btn:disabled { cursor:not-allowed; opacity:.5; }

/* Rilievo dei bottoni come nello shell (token --bbr-shadow-btn* passati dalla skin embed;
   fuori dal cruscotto restano piatti): pieni = primary, chiari = secondari. */
.btn.primary, .btn-primary, button.primary{ background:var(--bbr-btn-primary-bg, var(--accent)); box-shadow:var(--bbr-shadow-btn-primary); }
.btn:not(.primary):not(.btn-primary), button.sec{ box-shadow:var(--bbr-shadow-btn); }

/* Le stesse sei categorie dello shell, per gli strumenti in iframe (audit del 4/9,
   docs/audit-bottoni-2026-09-04.md). Qui senza !important: dentro l'iframe non c'e'
   la guerra di cascata di patch.css. Ruolo = classe, mai stile inline. */
.btn.btn-plain{ background:none; border-color:transparent; box-shadow:none; color:var(--bbr-accent);
                white-space:nowrap; padding-left:var(--space-200); padding-right:var(--space-200); }
.btn.btn-plain:hover{ background:var(--bbr-accent-soft); color:var(--bbr-accent-hover); }
.btn.btn-icon{ display:inline-flex; align-items:center; justify-content:center; width:36px; min-width:36px; padding:0; line-height:1; }
.btn.btn-icon svg{ width:18px; height:18px; }
.btn.btn-icon{ font-size:18px; }
.btn.btn-icon.btn-plain{ color:var(--bbr-fg-muted); }
.btn.btn-icon.btn-plain:hover{ background:var(--bbr-bg-sunken); color:var(--bbr-fg-primary); }
.btn.btn-plain.btn-danger { background:none; border-color:transparent; color:var(--bbr-red-fg); }
.btn.btn-plain.btn-danger:hover { background:var(--bbr-red-soft); color:var(--bbr-red-fg); }

.btn.btn-chip{ white-space:nowrap; min-height:28px; border-radius:var(--radius-full,999px); padding:0 var(--space-300);
               font-size:var(--text-sm,13px); box-shadow:none; }
.btn.btn-chip.is-on,.btn.btn-chip.on,.btn.btn-chip.active{ background:var(--bbr-accent-soft); border-color:var(--bbr-accent); color:var(--bbr-accent-soft-fg); }
.btn.btn-sm{ min-height:28px; padding:0 var(--space-300); font-size:var(--text-sm,13px); }
.btn.btn-sm.btn-icon{ width:28px; min-width:28px; padding:0; }
.btn.btn-lg{ min-height:44px; padding:0 var(--space-500); font-size:var(--text-md,15px); }
.btn.btn-lg.btn-icon{ width:44px; min-width:44px; padding:0; }

/* Scheletro di caricamento condiviso. La definizione originale sta in
   bbr-components.css, che pero' e' linkato da 3 file soli: qui usa la scala
   avorio gia' definita sopra e arriva a tutte le pagine che caricano il tema. */
.bbr-skel{
  display:block; height:12px; border-radius:6px;
  background:linear-gradient(90deg,var(--bbr-ink-7) 0%,var(--bbr-ink-6) 50%,var(--bbr-ink-7) 100%);
  background-size:200% 100%;
  animation:bbr-shimmer 1.4s ease-in-out infinite;
}
@keyframes bbr-shimmer{ from{background-position:200% 0} to{background-position:-200% 0} }
@media (prefers-reduced-motion: reduce){ .bbr-skel{ animation:none } }

/* Il blu "legacy" (#0071e3 e simili) e' sostituito alla fonte nei file (accent o --bbr-blue):
   niente piu' cerotti [style*="..."] qui. */

/* Override mirati per accenti non-token specifici di alcune sezioni */
.sidebar-new-btn{ background:#bb440e !important; }   /* Studio Grafico: bottone "+ Nuovo documento" (era viola #5b5bd6) */
[style*="background:#5b5bd6"],[style*="background: #5b5bd6"],
[style*="background:#7b5cff"],[style*="background: #7b5cff"],
[style*="background: rgb(91, 91, 214)"]{ background:#bb440e !important; }

/* landing.css */
:root{--landing-white:#fff;--landing-bg:#fbf8f1;--landing-ink:#1a0f07;--landing-muted:#5f574d;--landing-line:#e0d7c6;--landing-soft:#f4efe6;--landing-accent:#bb440e;--landing-on:#fff;--landing-display:clamp(40px,6.8vw,76px);color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--landing-bg);color:var(--landing-ink);font-family:var(--bbr-font-sans);font-size:15px;line-height:1.5}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}img{max-width:100%}[hidden]{display:none!important}h1,h2,h3,p,figure{margin:0}h2{font-size:clamp(26px,3.3vw,40px);line-height:1.13;letter-spacing:-.045em;font-weight:600}small,.caption{color:var(--landing-muted)}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--landing-accent);outline-offset:4px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip{position:absolute;left:16px;top:-60px;padding:12px;background:var(--landing-white);z-index:50}.skip:focus{top:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:12px 20px;border:1px solid var(--landing-line);border-radius:8px;background:var(--landing-white);font-weight:600;font-size:13px;color:var(--landing-ink);white-space:nowrap}.btn-primary{background:var(--landing-accent);border-color:var(--landing-accent);color:var(--landing-on)}.btn-plain{border-color:transparent;background:transparent}.btn-icon{padding:0;min-width:44px}.btn:hover{filter:brightness(.97)}
.site-header{position:relative;z-index:20;display:flex;align-items:center;gap:32px;padding:20px 4%;border-bottom:1px solid var(--landing-line);background:var(--landing-bg)}.brand{margin-right:auto;display:flex;align-items:center}.brand img{width:138px;height:33px}.site-header nav,.header-actions{display:flex;align-items:center;gap:24px}.site-header nav{font-size:14px}.nav-trigger{padding:12px 0;display:flex;gap:6px;align-items:center;border:0;background:none;font-weight:500;color:var(--landing-ink)}.header-actions{gap:20px;font-size:14px}.language select{background:transparent;border:0;padding:8px;color:inherit}.header-actions .btn{min-height:40px;padding:10px 16px}.nav-direct:hover,.login:hover{color:var(--landing-accent)}
.mega-menu{position:absolute;top:100%;left:4%;right:4%;background:var(--landing-white);padding:32px;border-radius:0 0 16px 16px;box-shadow:0 24px 56px #1a0f071a;border:1px solid var(--landing-line);display:grid;grid-template-columns:1fr 1fr .9fr;gap:32px}.mega-menu a{display:flex;flex-direction:column;padding:12px;border-radius:8px;margin:4px 0;gap:4px}.mega-menu a:hover,.mega-menu a:focus-visible{background:var(--landing-soft)}.mega-menu b{font-size:16px}.mega-menu span{font-size:13px;color:var(--landing-muted)}.mega-menu small{font-size:11px;letter-spacing:.1em;text-transform:uppercase}.mega-menu figure{background:var(--landing-soft);border-radius:12px;position:relative;min-height:200px;overflow:hidden}.mega-menu figure img{position:absolute;width:270px;right:0;top:-20px;max-width:none}.mega-menu figcaption{position:absolute;left:20px;bottom:16px;font-weight:600}.solutions-menu{grid-template-columns:repeat(3,1fr)}.solutions-menu a{justify-content:center;min-height:150px}.solutions-menu b{font-size:22px;letter-spacing:-.035em}
.hero{position:relative;text-align:center;padding:24px 24px 24px;overflow:hidden}.hero--home #eyebrow{display:none}.trust-badges{display:inline-flex;align-items:stretch;justify-content:center;flex-wrap:nowrap;gap:var(--space-200);max-width:100%;margin-bottom:var(--space-400);vertical-align:middle}.trust-badges>p{margin:0;flex:0 0 auto}.hero--home .trust-badges{position:absolute;top:8px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:8px;width:max-content;max-width:calc(100vw - 24px)}.hero--home .security-first{margin:0}.security-first{display:inline-flex;align-items:center;justify-content:center;gap:8px;max-width:calc(100vw - 32px);margin:0 auto 16px;padding:8px 12px;border:1px solid var(--landing-line);border-radius:999px;background:var(--landing-white);font-size:13px;line-height:1.4}.security-first svg{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:var(--landing-accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.security-first strong{font-weight:700;color:var(--landing-ink);white-space:nowrap}.security-first span{display:none}.eu-ai-ready{display:inline-flex;align-items:center;justify-content:center;gap:7px;margin:0;padding:8px 12px;border:1px solid var(--landing-line);border-radius:999px;background:var(--landing-white);font-size:13px;line-height:1.4;white-space:nowrap}.eu-ai-ready svg{width:22px;height:22px;flex:0 0 22px}.eu-disc{fill:#173b72}.eu-stars{fill:#f5ce46}.eyebrow{font-size:12px;letter-spacing:.12em;font-weight:600;text-transform:uppercase;color:var(--landing-muted);margin-bottom:16px}.hero h1{font-size:var(--landing-display);line-height:1.01;letter-spacing:-.065em;font-weight:600;color:var(--landing-ink);outline:none}.hero h1 em{font-style:normal;color:var(--landing-accent)}#hero-summary{max-width:590px;margin:20px auto 0;font-size:16px;color:var(--landing-muted)}.hero-actions{display:flex;justify-content:center;gap:12px;margin-top:24px}.mascot-stage{position:relative;height:350px;max-width:1060px;margin:auto}.mascot{position:absolute;left:calc(50% - 245px);top:-24px;width:490px;height:408px;padding:0;border:0;background:none;isolation:isolate;border-radius:50%;will-change:transform}.mascot img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 12px 10px #1a0f0710)}#mascot-front{opacity:1}#mascot-back{opacity:0}.mascot-shadow{position:absolute;left:calc(50% - 95px);bottom:32px;background:#1a0f071c;width:190px;height:16px;border-radius:50%;filter:blur(12px)}.service-pill{position:absolute;top:135px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:16px 20px;border:1px solid var(--landing-line);border-radius:12px;background:var(--landing-white);box-shadow:0 12px 32px #1a0f0707;font-size:13px;transition:transform .2s}.service-pill:hover{transform:translateY(-4px)}.service-pill>span{color:var(--landing-accent);font-size:11px;font-weight:700}.pill-left{left:0}.pill-right{right:0}.mascot-hint{position:absolute;bottom:0;left:0;right:0;font-size:12px;color:var(--landing-muted);pointer-events:none}
.ecosystem,.product-proof{max-width:1200px;margin:0 auto;padding:64px 40px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:32px}.section-heading .eyebrow{margin-bottom:12px}.ecosystem{border-top:1px solid var(--landing-line);margin-top:24px}.ai-primary{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--landing-line);border-bottom:1px solid var(--landing-line)}.ai-primary a{display:flex;align-items:center;justify-content:center;gap:16px;padding:32px 24px;font-size:24px;font-weight:500;letter-spacing:-.04em}.ai-primary a+a{border-left:1px solid var(--landing-line)}.ai-primary img{width:36px;height:36px}.ai-primary a:hover{background:var(--landing-soft)}.ai-secondary{display:flex;align-items:center;justify-content:center;gap:32px;margin-top:24px;font-size:13px;color:var(--landing-muted)}.ai-secondary a{display:flex;gap:8px;align-items:center}.ecosystem>.caption{text-align:center;max-width:720px;margin:20px auto 0;font-size:12px;line-height:1.6}.product-proof{padding-top:32px}.shot-selector{display:flex;gap:4px;background:var(--landing-soft);padding:4px;border-radius:8px;flex-wrap:wrap}.shot-selector button{border:0;background:none;padding:10px 12px;border-radius:6px;font-size:13px}.shot-selector button[aria-pressed=true]{background:var(--landing-white);box-shadow:0 2px 6px #1a0f0710}.product-frame{display:block;width:100%;position:relative;border:1px solid var(--landing-line);border-radius:16px;background:var(--landing-white);overflow:hidden;padding:0;box-shadow:0 24px 56px #1a0f070b;text-align:left}.product-frame img{display:block;width:100%;height:auto;aspect-ratio:1920/911;object-fit:contain}.enlarge{position:absolute;right:16px;bottom:16px;padding:8px 12px;border:1px solid var(--landing-line);background:var(--landing-white);border-radius:8px;font-size:12px}.caption{font-size:12px;margin-top:16px}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px}.benefits h3{font-size:18px;letter-spacing:-.025em;margin-bottom:8px}.benefits p{color:var(--landing-muted);font-size:14px}.benefits small{display:block;color:var(--landing-accent);font-size:11px;margin-bottom:12px}.scope-note{font-size:12px;color:var(--landing-muted);margin-top:32px;padding-top:20px;border-top:1px solid var(--landing-line)}
footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:48px max(40px,calc((100vw - 1120px)/2));background:var(--landing-soft);flex-wrap:wrap}footer h2{font-size:32px}footer p{font-size:14px;color:var(--landing-muted);margin-top:12px}footer small{flex-basis:100%;font-size:11px;margin-top:24px}#page-veil{position:fixed;inset:0;z-index:100;background:var(--landing-white);opacity:0;display:grid;place-items:center;pointer-events:auto}#page-veil .veil-status{font-size:13px;color:var(--landing-muted);opacity:0;animation:slow-label .2s 1s forwards}@keyframes slow-label{to{opacity:1}}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:110;padding:16px 24px;border:1px solid var(--landing-line);border-radius:12px;background:var(--landing-white);box-shadow:0 8px 32px #1a0f0720;max-width:calc(100% - 32px);font-size:14px}dialog{border:1px solid var(--landing-line);border-radius:16px;background:var(--landing-white);color:var(--landing-ink);padding:40px;width:calc(100% - 32px);max-width:560px}dialog::backdrop{background:#1a0f0755;backdrop-filter:blur(5px)}dialog h2{margin-bottom:20px}dialog>p{color:var(--landing-muted);margin:16px 0}dialog>.btn{margin-top:20px}.close-dialog{position:absolute;right:12px;top:12px;font-size:24px;border:0}#image-dialog{max-width:1320px;padding:32px 20px 20px}#large-shot{display:block;width:100%;height:auto}#image-label{padding-right:40px}.no-script{padding:32px;text-align:center}
@media(max-width:1050px){.site-header{gap:24px;padding:20px 24px}.site-header nav,.header-actions{gap:16px}.nav-direct{display:none}.service-pill{top:180px;padding:12px;font-size:12px}.mascot-stage{max-width:920px}.mascot{width:450px;height:375px;left:calc(50% - 225px)}.hero{padding-top:40px}.section-heading{align-items:flex-start}.ecosystem,.product-proof{padding-left:32px;padding-right:32px}.shot-selector{max-width:350px}}
@media(max-width:740px){.hero--home .trust-badges{position:static;transform:none;width:auto;max-width:100%;margin:0 auto 16px;flex-wrap:nowrap}.hero--home .security-first{margin:0}.site-header{flex-wrap:wrap;gap:12px 24px;padding:16px 20px}.brand{margin-right:auto}.site-header nav{order:3;width:100%;gap:28px}.header-actions{gap:12px}.header-actions .btn{padding:10px 12px}.mega-menu{left:12px;right:12px;padding:24px;grid-template-columns:1fr 1fr;gap:20px}.mega-menu figure{display:none}.solutions-menu{grid-template-columns:1fr}.solutions-menu a{min-height:0}.hero{padding:32px 20px 16px}#hero-summary{font-size:15px}.mascot-stage{height:365px}.mascot{width:410px;height:342px;left:calc(50% - 205px);top:-12px}.service-pill{top:auto;bottom:36px;padding:10px 12px;gap:8px}.pill-left{left:calc(50% - 170px)}.pill-right{right:calc(50% - 170px)}.service-pill>span{font-size:10px}.service-pill b{display:none}.ecosystem,.product-proof{padding:40px 20px}.section-heading{flex-direction:column;gap:20px}.ai-primary a{gap:8px;padding:24px 12px;font-size:18px}.ai-primary img{width:28px;height:28px}.ai-secondary{gap:16px;flex-wrap:wrap}.ai-secondary>span{flex-basis:100%;text-align:center}.benefits{grid-template-columns:1fr;gap:24px}.shot-selector{max-width:none;width:100%}.shot-selector button{flex:1}.product-frame img{aspect-ratio:1.3;object-fit:cover;object-position:top left}.product-frame .enlarge{right:8px;bottom:8px}.hero-actions{margin-top:20px}footer{padding:32px 20px}dialog{padding:32px 24px}.scope-note{line-height:1.7}}
@media(max-width:390px){.header-actions .login{font-size:12px}.brand img{width:114px}.header-actions .btn{order:4}.site-header{column-gap:12px}.header-actions{flex-wrap:wrap;justify-content:flex-end;flex:1}.hero h1{font-size:44px}.mascot{width:360px;height:300px;left:calc(50% - 180px)}.mascot-stage{height:350px}.service-pill{font-size:11px}.pill-left{left:0}.pill-right{right:0}.ai-primary a{font-size:14px;flex-direction:column}.hero-actions .btn{padding:12px}}
.hero h1:focus,.hero h1:focus-visible{outline:none;box-shadow:none}
.catalog-section{max-width:1200px;margin:0 auto;padding:48px 40px 64px}.catalog-section .section-heading{align-items:flex-start;flex-direction:column;gap:24px}.catalog-filters{display:flex;flex-wrap:wrap;gap:8px}.catalog-filters .btn{min-height:36px;padding:8px 12px;font-size:12px;background:transparent}.catalog-filters [aria-pressed="true"]{background:var(--landing-ink);color:var(--landing-bg);border-color:var(--landing-ink)}.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.product-card{display:flex;flex-direction:column;gap:12px;padding:24px;border:1px solid var(--landing-line);border-radius:12px;background:var(--landing-white);transition:transform .2s,border-color .2s}.product-card:hover{transform:translateY(-4px);border-color:var(--landing-accent)}.product-card h3{font-size:20px;letter-spacing:-.035em;line-height:1.2;font-weight:600}.product-card p{font-size:14px;color:var(--landing-muted);line-height:1.6}.product-status{display:block;font-size:12px;font-weight:500;color:var(--landing-muted)}.product-card-action{font-size:13px;color:var(--landing-accent);font-weight:600;margin-top:auto;padding-top:8px}.full-catalog-menu{grid-template-columns:repeat(3,minmax(0,1fr));max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain;gap:24px}.full-catalog-menu h3{font-size:11px;font-weight:600;color:var(--landing-muted);text-transform:uppercase;letter-spacing:.08em;padding:0 12px;margin-bottom:8px}.full-catalog-menu a{padding:8px 12px;min-height:0}.full-catalog-menu a b{font-size:14px;letter-spacing:-.02em}.full-catalog-menu a span{font-size:12px;line-height:1.5}.full-catalog-menu a small{font-size:10px;letter-spacing:0;text-transform:none;color:var(--landing-accent)}.product-features{margin-top:40px;border-top:1px solid var(--landing-line);padding-top:32px}.product-features h3{font-size:22px;letter-spacing:-.03em;margin-bottom:20px}.product-features ul{padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px;margin:0}.product-features li{padding-left:24px;position:relative;font-size:14px;line-height:1.6;color:var(--landing-muted)}.product-features li::before{content:'✓';position:absolute;left:0;color:var(--landing-accent)}
@media(max-width:900px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.full-catalog-menu{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:740px){.catalog-section{padding:32px 20px}.catalog-filters .btn{min-height:44px}.product-features ul{grid-template-columns:1fr}.full-catalog-menu{max-height:calc(100dvh - 160px);grid-template-columns:1fr;gap:16px}.full-catalog-menu a{padding:12px}.full-catalog-menu a b{font-size:16px}.full-catalog-menu a small{font-size:11px}}
@media(max-width:480px){.catalog-grid{grid-template-columns:1fr}.product-card{padding:20px}}
@media(max-width:740px){.service-pill{width:calc(50% - 6px);min-height:52px;grid-template-columns:auto 1fr}.pill-left{left:0}.pill-right{right:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.service-pill:hover{transform:none}}

/* Keep the two trust badges together on small screens. */
@media (max-width: 740px) {
  .trust-badges > p { padding: var(--space-200); gap: var(--space-100); font-size: 12px; }
  .trust-badges .security-first svg { width: 16px; height: 16px; flex-basis: 16px; }
  .trust-badges .eu-ai-ready svg { width: 20px; height: 20px; flex-basis: 20px; }
}
@media (max-width: 360px) {
  .trust-badges, .hero--home .trust-badges { gap: var(--space-100); }
  .trust-badges > p { padding-inline: var(--space-100); font-size: var(--text-xs); }
}

/* chat.css */
.mascot-stage{transition:height 350ms var(--ease-out)}
.mascot-dock{position:absolute;left:0;top:0;width:100%;height:100%;transition:width 350ms var(--ease-out),left 350ms var(--ease-out)}
.mascot-stage.chat-open{height:500px;margin-top:var(--space-600);margin-bottom:var(--space-400)}
.mascot-stage.chat-open .mascot-dock{width:44%;left:0}
.mascot-stage.chat-open .mascot-dock .mascot{top:var(--space-800)}
.mascot-stage.chat-open .mascot-shadow{bottom:var(--space-1200)}
.mascot-stage.chat-open .mascot-hint{visibility:hidden;pointer-events:none}
.lenzo-chat{position:absolute;right:0;top:0;width:54%;height:500px;min-width:0;display:flex;flex-direction:column;gap:var(--space-300);padding:var(--space-500);border:1px solid var(--landing-line);border-radius:var(--radius-xl);background:var(--landing-white);box-shadow:var(--shadow-md);text-align:left;animation:chat-enter 350ms var(--ease-out)}
.lenzo-chat>header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-300);flex-shrink:0}
.lenzo-chat [data-chat-kicker]{font-size:11px;color:var(--landing-muted)}
.lenzo-chat h2{font-size:24px;letter-spacing:-.04em;line-height:1.2}
.lenzo-chat>header .btn-icon{font-size:24px;flex-shrink:0}
.lenzo-chat [data-chat-intro]{font-size:13px;line-height:1.5;color:var(--landing-muted)}
.lenzo-chat [data-chat-quick]{display:flex;gap:var(--space-200);flex-wrap:wrap;flex-shrink:0}
.lenzo-chat [data-chat-quick] .btn{min-height:36px;padding:var(--space-200) var(--space-300);font-size:11px;white-space:normal;text-align:left;font-weight:500}
.chat-log{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;display:flex;flex-direction:column;gap:var(--space-300);padding:var(--space-100);border-radius:var(--radius-sm)}
.chat-message{max-width:94%;flex-shrink:0;padding:var(--space-300) var(--space-400);border-radius:var(--radius-lg);background:var(--landing-soft);overflow-wrap:anywhere}
.chat-message-user{align-self:flex-end;background:var(--landing-bg);border:1px solid var(--landing-line)}
.chat-message-assistant{align-self:flex-start}
.chat-author{display:block;color:var(--landing-muted);font-size:10px;font-weight:600;margin-bottom:var(--space-100)}
.chat-message p{white-space:pre-wrap;font-size:13px;line-height:1.6}
.chat-products{display:flex;gap:var(--space-100);flex-wrap:wrap;margin-top:var(--space-200)}
.chat-products .btn{min-height:36px;padding:var(--space-200);font-size:12px;color:var(--landing-accent);white-space:normal}
.lenzo-chat [data-chat-status]{min-height:16px;font-size:11px;line-height:1.4;color:var(--landing-muted);flex-shrink:0}
.lenzo-chat [data-chat-retry]{align-self:flex-start;min-height:32px;padding:var(--space-100) var(--space-200);font-size:12px}
.lenzo-chat form{display:flex;gap:var(--space-200);align-items:flex-end;flex-shrink:0}
.lenzo-chat textarea{display:block;flex:1;min-width:0;min-height:64px;max-height:144px;resize:vertical;padding:var(--space-300);border:1px solid var(--landing-line);border-radius:var(--radius-md);color:var(--landing-ink);background:var(--landing-bg);font:inherit;font-size:14px;line-height:1.4}
.lenzo-chat textarea:focus-visible{outline:3px solid var(--landing-accent);outline-offset:2px}
.lenzo-chat form>.btn{align-self:stretch;min-height:44px;padding:var(--space-300);font-size:13px}
.lenzo-chat button:disabled,.lenzo-chat textarea:disabled{opacity:.55;cursor:default}
.lenzo-chat [data-chat-privacy]{font-size:11px;line-height:1.45;color:var(--landing-muted);flex-shrink:0}
@keyframes chat-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:740px){
  .mascot-stage.chat-open{height:auto;min-height:0;margin-top:var(--space-400);padding-bottom:var(--space-200)}
  .mascot-stage.chat-open .mascot-dock{position:relative;width:180px;height:144px;left:0}
  .mascot-stage.chat-open .mascot-dock .mascot{width:200px;height:167px;left:-12px;top:-20px}
  .mascot-stage.chat-open .mascot-shadow{width:80px;height:8px;left:50px;bottom:12px}
  .lenzo-chat{position:relative;right:auto;top:auto;width:100%;height:auto;min-height:500px;padding:var(--space-400);gap:var(--space-300);animation:none}
  .lenzo-chat .chat-log{flex:none;min-height:160px;max-height:320px}
  .lenzo-chat textarea{font-size:16px;max-height:112px}
  .lenzo-chat [data-chat-quick] .btn{min-height:44px;font-size:12px}
  .chat-products .btn,.lenzo-chat [data-chat-retry]{min-height:44px}
}
.mascot-stage[data-motion="false"],.mascot-stage[data-motion="false"] .mascot-dock{transition:none}
.mascot-stage[data-motion="false"] .lenzo-chat{animation:none}
@media(prefers-reduced-motion:reduce){.mascot-stage,.mascot-dock{transition:none}.lenzo-chat{animation:none}}

/* guided-demo.css */
.guided-demo {
  max-width: 1200px;
  margin-inline: auto;
  padding: var(--space-1600) var(--space-1200);
  color: var(--landing-ink, var(--bbr-fg-primary));
  font-family: var(--bbr-font-sans);
}
.guided-demo__header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  gap: var(--space-1200);
  margin-bottom: var(--space-800);
}
.guided-demo__header .eyebrow { margin-bottom: var(--space-300); }
.guided-demo__introduction {
  max-width: 440px;
  font-size: 15px;
  line-height: 1.65;
  color: var(--landing-muted, var(--bbr-fg-muted));
}
.guided-demo__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-500);
  margin-bottom: var(--space-800);
  border-bottom: 1px solid var(--landing-line, var(--bbr-bd-default));
}
.guided-demo__step.btn {
  justify-content: start;
  gap: var(--space-300);
  min-height: 56px;
  padding: var(--space-300) 0 var(--space-400);
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  color: var(--landing-muted, var(--bbr-fg-muted));
  background: transparent;
  text-align: left;
  white-space: normal;
  font-size: 13px;
  line-height: 1.4;
}
.guided-demo__step.btn[aria-selected="true"] {
  color: var(--landing-ink, var(--bbr-fg-primary));
  border-bottom-color: var(--landing-accent, var(--bbr-accent));
}
.guided-demo__number {
  color: var(--landing-accent, var(--bbr-accent));
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
}
.guided-demo__panel {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(260px, 1fr);
  gap: var(--space-1200);
  align-items: center;
}
.guided-demo__panel:focus-visible {
  outline: 2px solid var(--landing-accent, var(--bbr-accent));
  outline-offset: var(--space-200);
  border-radius: var(--radius-lg);
}
.guided-demo__figure { min-width: 0; margin: 0; }
.guided-demo__screen {
  min-height: 240px;
  overflow: hidden;
  border: 1px solid var(--landing-line, var(--bbr-bd-default));
  border-radius: var(--radius-lg);
  background: var(--landing-white, var(--bbr-bg-surface));
  box-shadow: var(--shadow-sm);
}
.guided-demo__image { display: block; width: 100%; height: auto; }
.guided-demo__placeholder {
  min-height: 240px;
  display: grid;
  place-items: center;
  padding: var(--space-800);
  color: var(--landing-muted, var(--bbr-fg-muted));
  font-size: 13px;
  text-align: center;
}
.guided-demo__caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-200);
  padding-top: var(--space-200);
  color: var(--landing-muted, var(--bbr-fg-muted));
  font-size: 11px;
}
.guided-demo__zoom.btn { padding: var(--space-200); font-size: 12px; color: var(--landing-accent, var(--bbr-accent)); }
.guided-demo__counter {
  margin-bottom: var(--space-400);
  color: var(--landing-accent, var(--bbr-accent));
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
}
.guided-demo__story h3 {
  margin: 0 0 var(--space-400);
  font-size: clamp(24px, 2.3vw, 32px);
  font-weight: 600;
  letter-spacing: -.04em;
  line-height: 1.15;
}
.guided-demo__description { font-size: 14px; line-height: 1.7; color: var(--landing-muted, var(--bbr-fg-muted)); }
.guided-demo__detail {
  margin-top: var(--space-600);
  padding-top: var(--space-600);
  border-top: 1px solid var(--landing-line, var(--bbr-bd-default));
  font-size: 13px;
  line-height: 1.6;
}
.guided-demo .btn:disabled { cursor: default; opacity: .45; filter: none; }
.guided-demo__scope {
  margin-top: var(--space-600);
  font-size: 11px;
  line-height: 1.6;
  color: var(--landing-muted, var(--bbr-fg-muted));
}
.guided-demo__error { margin-top: var(--space-400); font-size: 13px; color: var(--landing-muted, var(--bbr-fg-muted)); }
.guided-demo__retry.btn { margin-top: var(--space-300); }
.guided-demo__dialog {
  padding: 0;
  width: min(1120px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - 32px);
  overflow: hidden;
  border: 1px solid var(--landing-line, var(--bbr-bd-default));
  border-radius: var(--radius-lg);
  background: var(--landing-white, var(--bbr-bg-surface));
  color: var(--landing-ink, var(--bbr-fg-primary));
}
.guided-demo__dialog-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-400); padding: var(--space-300) var(--space-400); }
.guided-demo__dialog-header p { font-size: 14px; font-weight: 600; }
.guided-demo__dialog-header .btn-icon { flex: 0 0 44px; font-size: 24px; }
.guided-demo__dialog .guided-demo__zoom-hint { margin: 0; padding: 0 var(--space-400) var(--space-400); font-size: 12px; color: var(--landing-muted, var(--bbr-fg-muted)); }
.guided-demo__full-viewport {
  max-height: calc(100dvh - 168px);
  overflow: auto;
  overscroll-behavior: contain;
  border-top: 1px solid var(--landing-line, var(--bbr-bd-default));
}
.guided-demo__full-viewport img { display: block; width: auto; height: auto; max-width: none; }
.guided-demo__full-viewport:focus-visible { outline: 2px solid var(--landing-accent, var(--bbr-accent)); outline-offset: -2px; }
@media (max-width: 900px) {
  .guided-demo { padding: var(--space-1200) var(--space-800); }
  .guided-demo__panel { gap: var(--space-800); grid-template-columns: minmax(0, 1.3fr) minmax(240px, 1fr); }
  .guided-demo__header { gap: var(--space-800); }
}
@media (max-width: 680px) {
  .guided-demo { padding: var(--space-1000) var(--space-500); }
  .guided-demo__header { grid-template-columns: 1fr; gap: var(--space-400); margin-bottom: var(--space-500); }
  .guided-demo__introduction { font-size: 14px; }
  .guided-demo__steps { gap: var(--space-300); margin-bottom: var(--space-600); }
  .guided-demo__step.btn { align-items: start; flex-direction: column; gap: var(--space-200); font-size: 12px; }
  .guided-demo__panel { grid-template-columns: 1fr; gap: var(--space-500); }
  .guided-demo__story { grid-row: 1; }
  .guided-demo__counter { margin-bottom: var(--space-300); }
  .guided-demo__story h3 { font-size: 26px; }
  .guided-demo__detail { margin-top: var(--space-400); padding-top: var(--space-400); }
  .guided-demo__screen { min-height: 0; }
  .guided-demo__caption { flex-wrap: wrap; }
  .guided-demo__dialog-header { gap: var(--space-200); }
  .guided-demo__dialog-header p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .guided-demo *, .guided-demo *::before, .guided-demo *::after { animation: none !important; transition: none !important; }
}

/* ai-connection-story.css */
.ai-story { margin-block: var(--space-1200) var(--space-2000); scroll-margin-top: var(--space-2400); }
.ai-story__heading { max-width: 720px; margin-inline: auto; text-align: center; }
.ai-story__heading > p:last-child { margin-top: var(--space-400); color: var(--landing-muted); font-size: var(--text-md); }
.ai-story figure { margin-top: var(--space-1000); }
.ai-story__scene { position: relative; height: 604px; overflow: hidden; border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: radial-gradient(ellipse at 75% 45%, var(--landing-white), transparent 60%), var(--landing-soft); }
.ai-story__visual { position: absolute; inset: 0; }
.ai-story__phone-group { position: absolute; top: var(--space-800); left: 19%; width: 280px; height: 532px; z-index: 3; transform: rotate(-5deg); transition: transform .6s var(--ease-out); }
.ai-story__phone { height: 100%; position: relative; overflow: hidden; border: 6px solid var(--landing-ink); border-radius: calc(var(--radius-xl) * 2); padding: var(--space-600) var(--space-400) var(--space-500); background: var(--landing-white); box-shadow: var(--shadow-lg), inset 0 0 0 1px var(--landing-line); }
.ai-story__island { position: absolute; top: var(--space-300); left: 50%; transform: translateX(-50%); width: 28%; height: 24px; border-radius: var(--radius-full); background: var(--landing-ink); }
.ai-story__phone-top { display: flex; align-items: center; justify-content: space-between; height: 16px; margin-top: calc(var(--space-200) * -1); font-size: var(--text-xs); font-weight: 600; }
.ai-story__phone-status { display: flex; align-items: center; gap: var(--space-100); color: var(--landing-ink); }
.ai-story__phone-status svg { display: block; flex-shrink: 0; height: 12px; }
.ai-story__signal { width: 16px; }
.ai-story__wifi { width: 16px; }
.ai-story__battery { width: 24px; }
.ai-story__chat-header { display: flex; justify-content: space-between; align-items: center; margin-block: var(--space-500) var(--space-400); font-size: var(--text-lg); }
.ai-story__chat-header strong { font-size: var(--text-base); font-weight: 600; }
.ai-story__conversation { position: relative; }
.ai-story__message { margin-left: var(--space-800); padding: var(--space-200); border-radius: var(--radius-lg) var(--radius-lg) var(--radius-xs) var(--radius-lg); background: var(--landing-soft); font-size: var(--text-xs); line-height: 1.5; }
.ai-story__thinking { display: none; align-items: center; gap: var(--space-300); margin-top: var(--space-400); }
.ai-story__thinking span { letter-spacing: .2em; color: var(--landing-muted); }
.ai-story__quote { margin-top: var(--space-300); padding: var(--space-300); border: 1px solid var(--landing-line); border-radius: var(--radius-lg); background: var(--landing-white); box-shadow: var(--shadow-sm); font-size: var(--text-xs); line-height: 1.4; }
.ai-story__quote-source { display: flex; align-items: center; justify-content: space-between; font-size: 8px; font-weight: 600; letter-spacing: .06em; color: var(--landing-muted); }
.ai-story__quote-source svg { width: 12px; height: 12px; }
.ai-story__quote-kicker { display: none; }
.ai-story__quote h3 { margin-top: var(--space-100); font-size: var(--text-lg); line-height: 1.2; letter-spacing: -.02em; font-weight: 700; }
.ai-story__dates { margin-top: var(--space-200); font-size: var(--text-base); font-weight: 600; }
.ai-story__guests, .ai-story__calculation { font-size: var(--text-xs); color: var(--landing-muted); }
.ai-story__room { display: flex; align-items: center; gap: var(--space-200); padding-block: var(--space-200); margin-block: var(--space-200); border-block: 1px solid var(--landing-line); font-size: var(--text-xs); }
.ai-story__room p { color: var(--landing-muted); }
.ai-story__room > svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--landing-accent); }
.ai-story__total { display: flex; justify-content: space-between; align-items: baseline; font-size: var(--text-xs); }
.ai-story__total strong { font-size: var(--text-xl); font-weight: 700; font-variant-numeric: tabular-nums; }
.ai-story__review { display: flex; align-items: center; gap: var(--space-150); margin-top: var(--space-200); padding: var(--space-150) var(--space-200); border-radius: var(--radius-sm); background: var(--landing-soft); font-size: var(--text-xs); font-weight: 500; color: var(--landing-ink); }
.ai-story__review svg { width: 12px; height: 12px; flex-shrink: 0; color: var(--landing-accent); }
.ai-story__quote-footer { margin-top: var(--space-150); font-size: 9px; color: var(--landing-muted); }
.ai-story__composer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-200); position: absolute; bottom: var(--space-500); left: var(--space-300); right: var(--space-300); min-height: 40px; padding: var(--space-200) var(--space-300); border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); font-size: var(--text-xs); }
.ai-story__composer > span:first-child { color: var(--landing-muted); }
.ai-story__send { display: grid; place-items: center; flex: 0 0 24px; height: 24px; border-radius: 50%; background: var(--landing-ink); color: var(--landing-white); font-size: var(--text-base); }
.ai-story__home-bar { position: absolute; bottom: var(--space-150); left: 34%; right: 34%; height: 4px; border-radius: var(--radius-full); background: var(--landing-ink); }
.ai-story__lenzo { position: absolute; width: 320px; top: 92px; right: 7%; }
.ai-story__actor { position: relative; aspect-ratio: 1374 / 1145; transform-origin: 50% 85%; }
.ai-story__actor > img, .ai-story__sleep-pose { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.ai-story__sleep-pose > img, .ai-story__sleep-eyes { position: absolute; width: 100%; height: 100%; inset: 0; }
.ai-story__sleep-eyes ellipse { fill: var(--landing-bg); }
.ai-story__sleep-eyes path { fill: none; stroke: var(--landing-ink); stroke-width: 10; stroke-linecap: round; }
.ai-story__name { text-align: center; font-size: var(--text-xl); font-weight: 600; letter-spacing: -.03em; }
.ai-story__name span { display: block; font-size: var(--text-xs); font-weight: 400; letter-spacing: 0; color: var(--landing-muted); margin-top: var(--space-100); }
.ai-story__zzz { position: absolute; top: 0; right: 64px; font-size: var(--text-xl); color: var(--landing-muted); transform: rotate(-10deg); }
.ai-story__zzz span { display: inline-block; transform: translateY(-12px); margin-left: var(--space-100); }
.ai-story__zzz span:last-child { transform: translateY(-28px); font-size: var(--text-2xl); }
.ai-story__notification { position: absolute; top: -16px; right: 0; display: flex; align-items: center; gap: var(--space-200); padding: var(--space-200) var(--space-300); z-index: 4; background: var(--landing-white); border: 1px solid var(--landing-line); box-shadow: var(--shadow-md); border-radius: var(--radius-lg); font-size: var(--text-xs); }
.ai-story__notification svg { width: 20px; height: 20px; color: var(--landing-accent); }
.ai-story__data { position: absolute; right: 9%; bottom: var(--space-600); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-200); width: 312px; }
.ai-story__data-row { display: flex; align-items: center; gap: var(--space-200); padding: var(--space-200) var(--space-300); border: 1px solid var(--landing-line); border-radius: var(--radius-md); background: var(--landing-white); box-shadow: var(--shadow-sm); transition: opacity var(--dur-base), transform var(--dur-base); }
.ai-story__data-row > span { color: var(--bbr-green-fg); }
.ai-story__data-row small { display: block; font-size: 9px; }
.ai-story__data-row strong { display: block; font-size: var(--text-xs); font-weight: 500; }
.ai-story__wire { position: absolute; top: 37%; left: 49%; width: 21%; height: 1px; }
.ai-story__packet, .ai-story__return-card { position: absolute; display: grid; place-items: center; top: -20px; width: 40px; height: 40px; background: var(--landing-accent); border-radius: var(--radius-lg); color: var(--landing-on); box-shadow: var(--shadow-md); }
.ai-story__return-card { top: -28px; width: 80px; height: 56px; background: var(--landing-white); border: 1px solid var(--landing-line); color: var(--landing-accent); font-size: var(--text-xs); }
.ai-story figcaption { display: flex; align-items: center; gap: var(--space-300); padding-block: var(--space-500); }
.ai-story__step { font-size: var(--text-xs); color: var(--landing-accent); font-weight: 600; }
.ai-story figcaption p { font-size: var(--text-base); font-weight: 500; }
.ai-story__progress { margin-left: auto; width: 120px; height: 4px; background: var(--landing-line); border-radius: var(--radius-full); overflow: hidden; }
.ai-story__progress i { display: block; height: 100%; width: var(--ai-story-progress, 100%); background: var(--landing-accent); }
.ai-story__actor > img, .ai-story__sleep-pose, .ai-story__zzz, .ai-story__notification, .ai-story__packet, .ai-story__return-card, .ai-story__thinking, .ai-story__quote { opacity: 0; }
.ai-story[data-phase="sleep"] .ai-story__sleep-pose, .ai-story[data-phase="send"] .ai-story__sleep-pose, .ai-story[data-phase="sleep"] .ai-story__zzz, .ai-story[data-phase="send"] .ai-story__zzz { opacity: 1; }
.ai-story[data-phase="wake"] .ai-story__awake, .ai-story[data-phase="scan"] .ai-story__reading, .ai-story[data-phase="return"] .ai-story__ready, .ai-story[data-phase="done"] .ai-story__ready { opacity: 1; }
.ai-story[data-phase="wake"] .ai-story__notification { opacity: 1; }
.ai-story[data-phase="sleep"] .ai-story__message { opacity: 0; }
.ai-story[data-phase="sleep"] .ai-story__composer { min-height: 96px; align-items: flex-end; }
.ai-story[data-phase="sleep"] .ai-story__phone-group, .ai-story[data-phase="send"] .ai-story__phone-group { transform: rotate(0) scale(1.05); }
.ai-story[data-phase="done"] .ai-story__phone-group { transform: none; }
.ai-story[data-phase="send"] .ai-story__packet { opacity: 1; animation: ai-story-send .72s var(--ease-in-out) both; }
.ai-story[data-phase="wake"] .ai-story__actor { animation: ai-story-wake .5s var(--ease-spring) both; }
.ai-story[data-phase="scan"] .ai-story__actor { animation: ai-story-read .24s ease-in-out 5; }
.ai-story[data-phase="return"] .ai-story__return-card { opacity: 1; animation: ai-story-return .66s var(--ease-in-out) both; }
.ai-story[data-phase="done"] .ai-story__quote { opacity: 1; animation: ai-story-card .6s var(--ease-out) both; }
.ai-story[data-phase="wake"] .ai-story__thinking, .ai-story[data-phase="scan"] .ai-story__thinking, .ai-story[data-phase="return"] .ai-story__thinking { display: flex; opacity: 1; }
.ai-story[data-phase="sleep"] .ai-story__data-row, .ai-story[data-phase="send"] .ai-story__data-row, .ai-story[data-phase="wake"] .ai-story__data-row, .ai-story__data-row[data-checked="false"] { opacity: 0; transform: translateY(12px); }
.ai-story[data-running="true"][data-phase="sleep"] .ai-story__actor, .ai-story[data-running="true"][data-phase="send"] .ai-story__actor { animation: ai-story-breathe 2.4s ease-in-out infinite; }
.ai-story[data-running="true"][data-phase="sleep"] .ai-story__hand { animation: ai-story-type .16s ease-in-out 6; }
.ai-story[data-running="false"]:not([data-phase="done"]) * { animation-play-state: paused; }
@keyframes ai-story-breathe { 0%,100% { transform: translateY(6px) rotate(-9deg) scale(.97); } 50% { transform: translateY(12px) rotate(-9deg) scale(1); } }
@keyframes ai-story-send { from { transform: translateX(-20px) scale(.7); opacity: 0; } 20% { opacity: 1; } to { transform: translateX(160px) scale(.7); opacity: 0; } }
@keyframes ai-story-wake { 0% { transform: translateY(12px) rotate(-9deg) scale(.9); } 45% { transform: translateY(-32px) rotate(6deg) scale(1.08); } 100% { transform: none; } }
@keyframes ai-story-read { 0%,100% { transform: translateX(-4px) rotate(-2deg); } 50% { transform: translateX(4px) rotate(2deg); } }
@keyframes ai-story-return { from { transform: translateX(160px) scale(.7); opacity: 0; } 20%,75% { opacity: 1; } to { transform: translateX(-40px) scale(.9); opacity: 0; } }
@keyframes ai-story-card { from { transform: translateY(16px) scale(.97); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes ai-story-type { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-3px) rotate(2deg); } }
@media (max-width: 1040px) {
  .ai-story__phone-group { left: 6%; }
  .ai-story__lenzo { right: 2%; width: 240px; }
  .ai-story__data { right: 2%; width: 240px; }
}
@media (max-width: 600px) {
  .ai-story { margin-top: var(--space-800); }
  .ai-story__heading h2 { font-size: var(--text-2xl); }
  .ai-story__heading > p:last-child { font-size: var(--text-base); }
  .ai-story__scene { height: auto; }
  .ai-story__visual { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--space-1000); padding: var(--space-600) var(--space-400); }
  .ai-story__phone-group { position: relative; top: auto; left: auto; width: min(280px, 100%); height: 584px; transform: none; }
  .ai-story[data-phase="sleep"] .ai-story__phone-group, .ai-story[data-phase="send"] .ai-story__phone-group { transform: none; }
  .ai-story__lenzo { position: relative; top: auto; right: auto; width: 200px; }
  .ai-story__notification { right: 0; top: 0; }
  .ai-story__data { position: relative; right: auto; bottom: auto; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-story__data-row { min-width: 0; gap: var(--space-100); padding: var(--space-200); }
  .ai-story__data-row strong { overflow-wrap: anywhere; }
  .ai-story__wire { left: 50%; top: 620px; width: 1px; height: 80px; }
  .ai-story__packet, .ai-story__return-card { display: none; }
  .ai-story__progress { width: 64px; flex-shrink: 0; }
  .ai-story figcaption p { font-size: var(--text-sm); }
}
@media (prefers-reduced-motion: reduce) {
  .ai-story *, .ai-story *::before { animation: none !important; transition: none !important; }
}

/* AI client orbit on the connection product hero. */
.hero--product #mascot-stage:has(.ai-orbit):not(.chat-open) { height: auto; min-height: 400px; display: grid; place-items: center; }
#mascot-stage:has(.ai-orbit):not(.chat-open) .mascot-dock,
#mascot-stage:has(.ai-orbit):not(.chat-open) .mascot-hint { display: none; }
#mascot-stage:has(.ai-orbit):not(.chat-open) #product-hero-visual { position: relative; inset: auto; width: 100%; overflow: visible; background: transparent; pointer-events: auto; }
#mascot-stage:has(.ai-orbit) #product-hero-visual::before { display: none; }
.ai-orbit { --orbit-radius: clamp(92px, 22vw, 140px); position: relative; width: min(400px, 100%); aspect-ratio: 1; margin-inline: auto; }
.ai-orbit__center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 112px; height: 112px; border: 1px solid var(--landing-line); border-radius: var(--radius-full); background: var(--landing-white); box-shadow: var(--shadow-sm); }
.ai-orbit__center img { display: block; width: 88px; height: auto; }
.ai-orbit__track { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
#product-hero-visual.ai-orbit-enhanced .ai-orbit__track { animation-name: ai-orbit-turn; }
#product-hero-visual.ai-orbit-enhanced .ai-orbit__counter { animation-name: ai-orbit-counter; }
.ai-orbit-enhanced .ai-orbit__track, .ai-orbit-enhanced .ai-orbit__counter { animation-duration: 24s; animation-timing-function: linear; animation-iteration-count: infinite; }
.ai-orbit__arm { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform: rotate(var(--orbit-angle)); }
.ai-orbit__arm--claude { --orbit-angle: 0deg; }
.ai-orbit__arm--gemini { --orbit-angle: 72deg; }
.ai-orbit__arm--chatgpt { --orbit-angle: 144deg; }
.ai-orbit__arm--perplexity { --orbit-angle: 216deg; }
.ai-orbit__arm--grok { --orbit-angle: 288deg; }
.ai-orbit__counter { position: absolute; left: -40px; top: calc(var(--orbit-radius) * -1 - 40px); width: 80px; height: 80px; display: grid; place-items: center; transform: rotate(calc(var(--orbit-angle) * -1));  }
.ai-orbit__counter img { display: block; width: 48px; height: 48px; object-fit: contain; }
@keyframes ai-orbit-turn { to { transform: rotate(360deg); } }
@keyframes ai-orbit-counter { to { transform: rotate(calc(var(--orbit-angle) * -1 - 360deg)); } }
@media (max-width: 600px) {
  .hero--product #mascot-stage:has(.ai-orbit):not(.chat-open) { min-height: 0; }
  .ai-orbit__counter { width: 64px; height: 64px; left: -32px; top: calc(var(--orbit-radius) * -1 - 32px); }
  .ai-orbit__counter img { width: 40px; height: 40px; }
  .ai-orbit__center { width: 100px; height: 100px; }
  .ai-orbit__center img { width: 80px; }
}
@media (prefers-reduced-motion: reduce) {
  .ai-orbit__track, .ai-orbit__counter { animation: none !important; }
}

/* Hide this decorative caption only on the AI connection page. */
.editorial-page:has(#ai-connection-story) .workflow-map-label { display: none; }

/* navigation.css */
/* The two menus answer different questions: products and ways to use them. */
.site-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:var(--space-800);align-items:center}
.site-header>.brand{justify-self:start;margin-right:0}
.site-header>nav{justify-self:center;justify-content:center;min-width:0}
.site-header>.header-actions{justify-self:end;min-width:0}
.site-header .mega-menu{left:50%;right:auto;width:clamp(1100px,68vw,1480px);max-width:calc(100vw - 48px);translate:-50% 0}
.mega-menu.products-catalog-menu{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-600);padding:var(--space-800);max-height:none;overflow:visible;align-items:start}
.mega-menu.solutions-catalog-menu{grid-template-columns:1fr 1.15fr 1fr;gap:var(--space-800);padding:var(--space-800);max-height:none;overflow:visible;align-items:start}
.catalog-menu-group{min-width:0}
.catalog-menu-group>h3{display:flex;align-items:center;gap:var(--space-200);font-size:18px;line-height:1.3;font-weight:600;letter-spacing:-.025em;color:var(--landing-ink);margin:0 0 var(--space-300);padding:0 var(--space-300) var(--space-300);border-bottom:1px solid var(--landing-line)}
.catalog-menu-group>h3>svg{flex:0 0 20px;width:20px;height:20px;color:var(--landing-accent)}
.mega-menu .catalog-menu-group>h3>span{font-size:inherit;line-height:inherit;letter-spacing:inherit;color:inherit}
.mega-menu>.catalog-all-products{grid-column:1/-1;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--space-600);width:100%;min-height:80px;margin:0;padding:var(--space-500) var(--space-600);border:1px solid var(--landing-line);border-radius:var(--radius-lg);background:var(--landing-soft);text-align:left;white-space:normal}
.mega-menu>.catalog-all-products>span{display:flex;flex-direction:column;gap:var(--space-100);color:var(--landing-ink)}
.mega-menu>.catalog-all-products b{font-size:clamp(24px,2.2vw,32px);line-height:1.2;letter-spacing:-.035em}
.mega-menu>.catalog-all-products>span>span{font-size:13px;line-height:1.45;font-weight:400;color:var(--landing-muted)}
.mega-menu>.catalog-all-products>svg{flex:0 0 24px;width:24px;height:24px;color:var(--landing-accent)}
.mega-menu>.catalog-all-products:hover{border-color:var(--landing-accent);background:var(--landing-bg)}
.mega-menu .catalog-menu-link{justify-content:flex-start;gap:var(--space-100);min-height:0;margin:0;padding:var(--space-300);border-radius:var(--radius-md)}
.mega-menu .catalog-menu-link>b{font-size:15px;line-height:1.35;letter-spacing:-.015em;font-weight:600}
.mega-menu .catalog-menu-link>span{font-size:13px;line-height:1.45;letter-spacing:0;color:var(--landing-muted)}
.mega-menu .catalog-menu-link>.product-status{font-size:11px;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--landing-accent)}
.mega-menu .catalog-menu-link[aria-current="page"]{background:var(--landing-soft)}
.ai-menu-item{position:relative}
.ai-menu-item>.catalog-menu-link{padding-right:var(--space-1200)}
.ai-preview-toggle.btn{position:absolute;right:var(--space-100);top:var(--space-100);min-width:36px;min-height:36px;padding:0;border:0;background:transparent;font-size:20px;font-weight:400;color:var(--landing-muted)}
.ai-preview-toggle.btn:hover{background:var(--landing-soft);color:var(--landing-accent)}
.ai-menu-preview{position:absolute;right:0;top:100%;z-index:1;width:max(100%,280px);padding:var(--space-400);background:var(--landing-white);border:1px solid var(--landing-line);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}
.ai-menu-preview .ai-preview-title{display:block;font-size:11px;line-height:1.4;font-weight:600;text-transform:none;letter-spacing:0;color:var(--landing-muted);margin-bottom:var(--space-300)}
.ai-preview-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-200);align-items:start}
.mega-menu .ai-preview-mark{display:flex;flex-direction:column;align-items:center;gap:var(--space-200);font-size:10px;color:var(--landing-ink)}
.ai-preview-mark img{width:24px;height:24px;object-fit:contain}
.mega-menu .ai-preview-mark>span{font-size:10px;line-height:1.3}
.ai-menu-preview p{font-size:11px;line-height:1.45;color:var(--landing-muted);margin-top:var(--space-300)}
.solution-invitation{align-self:stretch;display:flex;flex-direction:column;align-items:flex-start;background:var(--landing-soft);padding:var(--space-500);border-radius:var(--radius-lg);min-width:0}
.solution-invitation>img{display:block;align-self:center;width:200px;height:168px;object-fit:contain;margin-bottom:var(--space-300)}
.solution-invitation>h3{font-size:22px;line-height:1.15;letter-spacing:-.035em;font-weight:600}
.solution-invitation>p{font-size:13px;line-height:1.5;color:var(--landing-muted);margin-top:var(--space-300)}
.mega-menu .solution-invitation>.btn{display:inline-flex;flex-direction:row;min-height:44px;margin:var(--space-400) 0 0;padding:var(--space-200) 0;color:var(--landing-accent);font-size:13px;font-weight:600}
.solution-related-products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-400)}
.solution-related-products .product-card{padding:var(--space-500)}
.solution-related-products .product-card h3{font-size:18px}
@media (min-width:1001px) and (max-height:740px){
  .site-header .mega-menu{max-height:calc(100dvh - 112px);overflow-y:auto;overscroll-behavior:contain}
  .ai-menu-preview{position:static;width:100%;box-shadow:none}
}
@media(max-width:1100px){
  .site-header .mega-menu{width:calc(100vw - 48px)}
  .mega-menu.products-catalog-menu{gap:var(--space-300);padding:var(--space-600)}
  .mega-menu .catalog-menu-link{padding:var(--space-200)}
  .ai-menu-item>.catalog-menu-link{padding-right:var(--space-1000)}
  .mega-menu.solutions-catalog-menu{gap:var(--space-400);padding:var(--space-600)}
  .solution-invitation{padding:var(--space-400)}
  .solution-invitation>img{width:160px;height:136px}
  .solution-related-products{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1000px){
  .mega-menu.products-catalog-menu{grid-template-columns:repeat(2,minmax(0,1fr));max-height:calc(100dvh - 164px);overflow-y:auto;overscroll-behavior:contain;gap:var(--space-600)}
  .ai-menu-preview{position:static;width:100%;box-shadow:none;margin-top:var(--space-100)}
}
@media(max-width:980px){
  .site-header{grid-template-columns:auto minmax(0,1fr);column-gap:var(--space-600);row-gap:var(--space-200)}
  .site-header>nav{grid-column:1/-1;grid-row:2;width:auto;justify-self:center;flex-wrap:wrap;gap:var(--space-300) var(--space-600)}
  .site-header>.header-actions{grid-column:2;grid-row:1}
}
@media(max-width:800px){
  .mega-menu.products-catalog-menu{grid-template-columns:repeat(2,minmax(0,1fr));max-height:calc(100dvh - 164px);overflow-y:auto;overscroll-behavior:contain;gap:var(--space-600)}
  .mega-menu.solutions-catalog-menu{grid-template-columns:1fr 1fr;max-height:calc(100dvh - 164px);overflow-y:auto;overscroll-behavior:contain}
  .mega-menu .catalog-menu-link{padding:var(--space-300);min-height:44px}
  .ai-menu-item>.catalog-menu-link{padding-right:var(--space-1200)}
  .ai-preview-toggle.btn{min-width:44px;min-height:44px}
  .ai-menu-preview{position:static;width:100%;box-shadow:none;margin-top:var(--space-100)}
  .ai-preview-logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mega-menu .ai-preview-mark{flex-direction:row;justify-content:flex-start}
  .solution-invitation{grid-column:1/-1;display:grid;grid-template-columns:120px 1fr;column-gap:var(--space-400)}
  .solution-invitation>img{grid-row:1/4;width:120px;height:100px;margin:0}
  .solution-invitation>h3{font-size:20px}
  .mega-menu .solution-invitation>.btn{margin-top:var(--space-200)}
}
@media(max-width:740px){
  .site-header .mega-menu{left:20px;right:20px;width:auto;max-width:none;translate:none}
  .site-header>.header-actions{flex-wrap:wrap;justify-content:flex-end}
}
@media(max-width:480px){
  .mega-menu.products-catalog-menu,.mega-menu.solutions-catalog-menu{grid-template-columns:1fr;padding:var(--space-400);gap:var(--space-400)}
  .mega-menu .catalog-menu-link>b{font-size:15px}
  .catalog-menu-group>h3{margin-bottom:var(--space-100)}
  .ai-preview-logos{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mega-menu .ai-preview-mark{flex-direction:column}
  .solution-invitation{grid-template-columns:96px 1fr}
  .solution-invitation>img{width:96px;height:80px}
  .solution-related-products{grid-template-columns:1fr}
}
/* Keep navigation in the header row; small screens get an explicit menu. */
.site-header>.mobile-menu-toggle.btn{display:none}
@media(min-width:981px){.site-header{column-gap:var(--space-400);padding-inline:var(--space-600)}.site-header>nav{gap:var(--space-500)}}
@media(max-width:980px){
  .site-header{grid-template-columns:1fr auto;row-gap:0;padding:var(--space-300) var(--space-500)}
  .site-header>.brand{grid-column:1;grid-row:1}
  .site-header>.mobile-menu-toggle.btn{display:inline-flex;grid-column:2;grid-row:1;width:44px;height:44px;padding:var(--space-200);color:var(--landing-ink)}
  .mobile-menu-toggle svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
  .site-header>nav,.site-header>.header-actions{display:none}
  .site-header[data-menu-open]>nav{display:flex;grid-column:1/-1;grid-row:2;justify-self:stretch;justify-content:flex-start;gap:var(--space-500);padding-block:var(--space-400)}
  .site-header[data-menu-open]>.header-actions{display:flex;grid-column:1/-1;grid-row:3;justify-self:stretch;justify-content:flex-start;flex-wrap:wrap;padding-block:var(--space-300);border-top:1px solid var(--landing-line)}
  .site-header .mega-menu{top:100%;max-height:calc(100dvh - var(--site-header-h) - 16px);overflow-y:auto;overscroll-behavior:contain}
}

/* solution-pages.css */
.hero--solution {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: var(--space-600) var(--space-800);
  max-width: 1360px;
  margin-inline: auto;
  padding: var(--space-1200) var(--space-1000) var(--space-600);
}
.hero--solution .hero-intro { text-align: left; min-width: 0; }
#main[data-route="apartments"] #eyebrow { display: none; }
.hero--solution h1 { font-size: clamp(36px, 4.4vw, 64px); }
.hero--solution #hero-summary { margin-left: 0; }
.hero--solution .hero-actions { justify-content: flex-start; flex-wrap: wrap; }
.hero--solution .structure-stage { min-width: 0; align-self: stretch; }
.hero--solution .mascot-stage { grid-column: 1 / -1; width: 100%; }
.hero--solution .mascot-stage:not(.chat-open) { height: 172px; }
.hero--solution .mascot-stage:not(.chat-open) .mascot { width: 200px; height: 167px; left: calc(50% - 100px); top: 0; }
.hero--solution .mascot-stage:not(.chat-open) .mascot-shadow { width: 88px; left: calc(50% - 44px); bottom: var(--space-500); }
.related-products { max-width: 1200px; margin-inline: auto; padding: var(--space-1200) var(--space-1000) var(--space-1600); }
.related-products h2 { margin-bottom: var(--space-800); }
@media (max-width: 900px) {
  .hero--solution { padding: var(--space-800) var(--space-600); gap: var(--space-500); }
}
/* Use the full hero width while the two content columns are too narrow for both badges. */
@media (min-width: 741px) and (max-width: 1242px) {
  .hero--solution { padding-top: var(--space-2400); }
  .hero--solution .trust-badges {
    position: absolute;
    top: var(--space-600);
    left: 0;
    right: 0;
    margin-inline: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-200);
    width: max-content;
    max-width: calc(100% - var(--space-1200));
  }
  .hero--solution .trust-badges > p { margin: 0; }
}
@media (max-width: 740px) {
  .hero--solution { grid-template-columns: 1fr; padding: var(--space-800) var(--space-500); }
  .hero--solution .hero-intro { text-align: center; }
  .hero--solution #hero-summary { margin-inline: auto; }
  .hero--solution .hero-actions { justify-content: center; }
  .related-products { padding: var(--space-800) var(--space-500); }
}

#main[data-route="bb"] #pose-caption { display: none; }
#main[data-route="bb"] #overview > p:not(.eyebrow) { white-space: pre-line; }

/* structure-scene.css */
.structure-scene { width: 100%; min-width: 0; margin: 0; color: var(--landing-ink, var(--bbr-fg-primary)); }
.structure-scene__viewport {
  position: relative;
  width: 100%;
  max-width: 600px;
  aspect-ratio: 1;
  margin-inline: auto;
  min-width: 0;
}
.structure-scene__image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  transform-origin: 50% 80%;
}
[data-structure-state="ready"] .structure-scene__image {
  animation: structure-settle 4s var(--ease-in-out) 1;
}
.structure-scene__status {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-400);
  padding: var(--space-600);
  text-align: center;
  color: var(--landing-muted, var(--bbr-fg-muted));
  font-size: var(--text-base);
}
@keyframes structure-settle {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-2px) rotate(-.3deg); }
  60% { transform: translateY(0) rotate(.2deg); }
}
@media (prefers-reduced-motion: reduce) {
  .structure-scene *, .structure-scene *::before, .structure-scene *::after { animation: none !important; transition: none !important; }
}

/* editorial.css */
/* Public landing composition. Navigation and the product's real screenshots retain their own markup. */
.hero--utility { max-width: 920px; margin-inline: auto; padding: var(--space-1200) var(--space-500) var(--space-800); }
.hero--utility h1 { font-size: clamp(36px, 4vw, 56px); line-height: 1.1; }
.hero--utility #hero-summary { max-width: 660px; line-height: 1.7; }
#demo-form { padding: var(--space-200) var(--space-500) var(--space-2000); }
.privacy-document { max-width: 880px; margin: 0 auto; padding: var(--space-800) var(--space-500) var(--space-2000); }
.privacy-document .privacy-updated { font-size: 12px; color: var(--landing-muted); }
.privacy-document .privacy-intro { margin-top: var(--space-400); padding: var(--space-500); border-left: 2px solid var(--landing-accent); background: var(--landing-soft); }
.privacy-index { display: grid; gap: var(--space-300); margin: var(--space-800) 0; padding-bottom: var(--space-800); border-bottom: 1px solid var(--landing-line); }
.privacy-index a { font-size: 14px; color: var(--landing-accent); text-decoration: underline; text-underline-offset: 4px; }
.privacy-document section { margin-block: var(--space-1000); scroll-margin-top: var(--space-800); }
.privacy-document h2 { font-size: 24px; letter-spacing: -.025em; line-height: 1.3; }
.privacy-document p, .privacy-document li { font-size: 15px; line-height: 1.85; color: var(--landing-muted); }
.privacy-document section p, .privacy-document li { margin-top: var(--space-400); }
.privacy-document ul { padding-left: var(--space-600); }
.footer-contact { display: inline-flex; margin-top: var(--space-400); min-height: 44px; align-items: center; color: var(--landing-accent); font-size: 13px; }
#chat-privacy-link { color: var(--landing-accent); font-size: 11px; text-decoration: underline; text-underline-offset: 3px; }
:root {
  --editorial-width: 1280px;
  --editorial-gutter: var(--space-1200);
  --editorial-section: var(--space-2000);
}
.hero--home, .hero--about { padding-top: var(--space-1600); padding-bottom: var(--space-1000); }
.hero--home .hero-intro, .hero--about .hero-intro { max-width: 1080px; margin-inline: auto; }
.hero--home h1, .hero--about h1 { max-width: 1080px; margin-inline: auto; font-size: clamp(44px, 5.8vw, 80px); line-height: 1.035; letter-spacing: -.06em; }
.hero--home #hero-summary, .hero--about #hero-summary { max-width: 660px; font-size: 17px; line-height: 1.65; }
.hero--home #mascot-stage:not(.chat-open), .hero--about #mascot-stage:not(.chat-open) { height: 304px; margin-top: var(--space-200); }
.hero--home #mascot-stage:not(.chat-open) .mascot, .hero--about #mascot-stage:not(.chat-open) .mascot { width: 420px; height: 350px; left: calc(50% - 210px); top: -24px; }
.hero--home #mascot-stage:not(.chat-open) .mascot-shadow, .hero--about #mascot-stage:not(.chat-open) .mascot-shadow { width: 152px; left: calc(50% - 76px); bottom: var(--space-800); }
.hero--home #eyebrow { display: none; }

.hero--product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: var(--space-1200);
  max-width: 1440px;
  margin-inline: auto;
  padding: var(--space-1600) var(--editorial-gutter) var(--space-1200);
}
.hero--product .hero-intro { min-width: 0; max-width: 620px; text-align: left; }
.hero--product h1 { font-size: clamp(40px, 4.4vw, 68px); line-height: 1.055; letter-spacing: -.055em; }
.hero--product #hero-summary { margin-left: 0; max-width: 520px; font-size: 16px; line-height: 1.7; }
.hero--product .hero-actions { justify-content: flex-start; flex-wrap: wrap; gap: var(--space-300); margin-top: var(--space-800); }
.hero--product #mascot-stage { width: 100%; height: 440px; min-width: 0; max-width: none; margin: 0; }
.hero--product .mascot-dock { z-index: 1; }
.hero--product #mascot-stage:not(.chat-open) .mascot { width: 440px; height: 367px; left: calc(50% - 220px); top: var(--space-600); }
.hero--product #mascot-stage:not(.chat-open) .mascot-shadow { width: 152px; left: calc(50% - 76px); bottom: var(--space-2400); }
.hero--product .mascot-hint { bottom: var(--space-100); }
#product-hero-visual { position: absolute; inset: var(--space-500) 0 var(--space-1000); overflow: hidden; border-radius: var(--radius-xl); background: var(--landing-soft); pointer-events: none; }
#product-hero-visual::before { content: ''; position: absolute; width: 280px; height: 280px; left: calc(50% - 140px); top: var(--space-1200); border: 1px solid var(--landing-line); border-radius: var(--radius-full); }
.hero-product-badge { position: absolute; top: var(--space-500); left: var(--space-500); right: var(--space-500); display: flex; align-items: center; gap: var(--space-200); color: var(--landing-ink); font-size: 12px; font-weight: 600; line-height: 1.4; }
.hero-product-badge svg { width: 24px; height: 24px; flex: 0 0 24px; color: var(--landing-accent); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hero-workflow { position: absolute; left: var(--space-500); right: var(--space-500); bottom: var(--space-500); display: flex; justify-content: center; gap: var(--space-400); }
.hero-workflow > span { min-width: 0; flex: 1; padding-top: var(--space-300); border-top: 1px solid var(--landing-line); font-size: 12px; line-height: 1.4; font-weight: 500; text-align: center; color: var(--landing-muted); overflow-wrap: anywhere; }
.hero-workflow > span > small { display: block; margin-bottom: var(--space-100); color: var(--landing-accent); font-size: 10px; font-variant-numeric: tabular-nums; }
.mascot-stage.chat-open #product-hero-visual { display: none; }
.hero.hero--chat { grid-template-columns: 1fr; }
.hero--chat .hero-intro { max-width: 900px; margin-inline: auto; text-align: center; }
.hero--chat #hero-summary { margin-inline: auto; }
.hero--chat .hero-actions { justify-content: center; }
.hero.hero--chat #mascot-stage.chat-open { grid-column: 1 / -1; width: 100%; max-width: 1060px; height: 500px; margin-inline: auto; }
.hero--chat #mascot-stage.chat-open .mascot-dock .mascot { width: 440px; height: 367px; left: calc(50% - 220px); top: var(--space-800); }
.hero--chat #mascot-stage.chat-open .mascot-dock .mascot-shadow { bottom: var(--space-1200); }

.editorial-page {
  --editorial-accent: var(--landing-accent);
  --editorial-tint: color-mix(in srgb, var(--editorial-accent) 6%, var(--landing-white));
  max-width: var(--editorial-width);
  margin-inline: auto;
  padding: var(--space-1000) var(--editorial-gutter) var(--editorial-section);
  color: var(--landing-ink);
  font-family: var(--bbr-font-sans);
}
.editorial-page[data-category="operations"], .editorial-page[data-category="management"] { --editorial-accent: var(--bbr-green); }
.editorial-page[data-category="revenue"], .editorial-page[data-category="sales"], .editorial-page[data-category="control"] { --editorial-accent: var(--bbr-blue); }
.editorial-page[data-category="guests"] { --editorial-accent: var(--landing-accent); }
.editorial-page[data-category="intelligence"] { --editorial-accent: var(--landing-accent); }
.editorial-intro { max-width: 880px; margin-bottom: var(--space-1000); }
.editorial-intro h2 { max-width: 820px; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.15; letter-spacing: -.04em; }
.editorial-intro > p:not(.eyebrow) { max-width: 720px; margin-top: var(--space-500); color: var(--landing-muted); font-size: 16px; line-height: 1.75; }
.editorial-icon { display: block; width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; color: var(--editorial-accent, var(--landing-accent)); }
.btn > .editorial-icon { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; color: inherit; }
.outcome-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); }
.outcome-grid > article { min-width: 0; padding: var(--space-800); }
.outcome-grid > article + article { border-left: 1px solid var(--landing-line); }
.outcome-grid .editorial-icon { margin-bottom: var(--space-800); }
.outcome-grid h3 { max-width: 280px; margin-bottom: var(--space-300); font-size: 22px; line-height: 1.2; letter-spacing: -.03em; font-weight: 600; }
.outcome-grid p { font-size: 15px; line-height: 1.7; color: var(--landing-muted); }
@media (min-width: 741px) {
  #main[data-page-kind="home"] .outcome-grid { grid-template-rows: auto auto 1fr; }
  #main[data-page-kind="home"] .outcome-grid > article { display: grid; grid-row: span 3; grid-template-rows: subgrid; align-content: start; }
}
#main[data-page-kind="home"] .property-section .section-heading { display: block; }
#main[data-page-kind="home"] .property-section .section-heading > p { max-width: 720px; margin-top: var(--space-400); }


.workflow-section {
  --workflow-muted: color-mix(in srgb, var(--landing-bg) 72%, var(--landing-ink));
  --workflow-line: color-mix(in srgb, var(--landing-bg) 20%, var(--landing-ink));
  --workflow-accent: color-mix(in srgb, var(--editorial-accent) 45%, var(--landing-white));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: var(--space-1200);
  align-items: center;
  margin-top: var(--editorial-section);
  padding: var(--space-1200);
  border-radius: var(--radius-xl);
  background: var(--landing-ink);
  color: var(--landing-bg);
}
.workflow-story { min-width: 0; }
.workflow-story .eyebrow { color: var(--workflow-accent); }
.workflow-story h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.15; letter-spacing: -.04em; }
.workflow-story > p:not(.eyebrow) { margin-top: var(--space-400); color: var(--workflow-muted); font-size: 15px; line-height: 1.75; }
.workflow-story ol { display: grid; gap: var(--space-600); margin: var(--space-800) 0 0; padding: 0; list-style: none; }
.workflow-story li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: var(--space-200) var(--space-400); }
.workflow-story li > span { color: var(--workflow-accent); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.workflow-story li > div { min-width: 0; }
.workflow-story li > div > p { margin-top: var(--space-200); }
.workflow-story li h3 { font-size: 16px; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; }
.workflow-story li p { color: var(--workflow-muted); font-size: 14px; line-height: 1.65; }
.workflow-art { min-width: 0; }
.workflow-art figure { margin: 0; }
.workflow-art figure img { display: block; width: 100%; height: auto; max-width: 100%; object-fit: contain; border: 1px solid var(--workflow-line); border-radius: var(--radius-md); background: var(--landing-white); }
.workflow-art figcaption { margin-top: var(--space-300); color: var(--workflow-muted); font-size: 12px; line-height: 1.6; }
.workflow-map { display: grid; gap: var(--space-600); max-width: 400px; margin-inline: auto; }
.workflow-node { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: center; gap: var(--space-200) var(--space-400); padding: var(--space-500) var(--space-600); border: 1px solid var(--workflow-line); border-radius: var(--radius-lg); background: color-mix(in srgb, var(--landing-white) 5%, var(--landing-ink)); }
.workflow-node > span { grid-column: 1 / -1; color: var(--workflow-muted); font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.workflow-node svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; color: var(--workflow-accent); }
.workflow-node strong { font-size: 17px; line-height: 1.35; font-weight: 500; letter-spacing: -.02em; }
.workflow-map-label { grid-column: 1 / -1; color: var(--workflow-muted); font-size: 11px; line-height: 1.5; text-align: center; }

.product-depth { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: start; gap: var(--space-1200); margin-top: var(--editorial-section); }
.product-depth h2 { max-width: 400px; font-size: clamp(28px, 3vw, 40px); line-height: 1.18; letter-spacing: -.04em; }
.product-depth > .section-heading { display: block; margin: 0; }
.capability-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-600); list-style: none; padding: 0; margin: 0; }
.capability-list li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: var(--space-300); padding-block: var(--space-500); border-bottom: 1px solid var(--landing-line); font-size: 15px; line-height: 1.6; }
.capability-list li > .editorial-icon { width: 20px; height: 20px; margin-top: var(--space-050); }
.faq-section { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--space-1200); margin-top: var(--editorial-section); padding-top: var(--space-1000); border-top: 1px solid var(--landing-line); }
.faq-section > .section-heading { display: block; margin: 0; }
.faq-section h2 { max-width: 400px; font-size: clamp(28px, 3vw, 40px); line-height: 1.18; letter-spacing: -.04em; }
.faq-section .section-heading p:not(.eyebrow) { max-width: 360px; margin-top: var(--space-400); color: var(--landing-muted); font-size: 15px; line-height: 1.7; }
.faq-list { min-width: 0; }
.faq-list details { border-bottom: 1px solid var(--landing-line); }
.faq-list details:first-child { border-top: 1px solid var(--landing-line); }
.faq-list summary { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-600); min-height: 64px; padding: var(--space-500) 0; cursor: pointer; list-style: none; font-size: 16px; font-weight: 500; line-height: 1.5; transition: color var(--dur-base) var(--ease-out); }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: '+'; flex: 0 0 20px; color: var(--landing-accent); font-size: 22px; line-height: 1; font-weight: 400; text-align: center; }
.faq-list details[open] summary::after { content: '−'; }
.faq-list summary:focus-visible { outline: 2px solid var(--landing-accent); outline-offset: var(--space-100); border-radius: var(--radius-sm); }
.faq-list details > p { max-width: 640px; padding: 0 var(--space-1000) var(--space-600) 0; color: var(--landing-muted); font-size: 15px; line-height: 1.75; }
.faq-list .faq-custom summary { color: var(--landing-accent); }
.faq-list .faq-lenzo-chat { position: static; width: 100%; height: auto; min-height: 0; padding: 0 0 var(--space-600); border: 0; border-radius: 0; background: transparent; box-shadow: none; animation: none; gap: var(--space-400); }
.faq-lenzo-chat > [data-faq-intro] { font-size: var(--text-base); line-height: 1.65; color: var(--landing-muted); }
.faq-list .faq-lenzo-chat .chat-log { flex: none; min-height: 0; max-height: none; overflow: visible; padding: 0; }
.faq-lenzo-chat .chat-log:empty { display: none; }
.faq-lenzo-chat .chat-message { max-width: 100%; padding: var(--space-300) 0; border: 0; border-radius: 0; background: transparent; }
.faq-lenzo-chat .chat-message p { font-size: var(--text-base); line-height: 1.75; }
.faq-lenzo-chat .chat-message-user { align-self: flex-start; }
.faq-lenzo-chat [data-faq-close] { align-self: flex-start; }
.faq-lenzo-chat .faq-privacy { font-size: var(--text-xs); line-height: 1.65; color: var(--landing-muted); }
.faq-lenzo-chat .faq-privacy a { color: var(--landing-accent); text-underline-offset: var(--space-100); }
@media (max-width: 740px) {
  .faq-lenzo-chat form { flex-direction: column; align-items: stretch; }
  .faq-lenzo-chat textarea { width: 100%; }
}
.editorial-cta { display: grid; grid-template-columns: 144px minmax(0, 1fr) auto; align-items: center; gap: var(--space-800); margin-top: var(--editorial-section); padding: var(--space-800) var(--space-1000); border-radius: var(--radius-xl); background: var(--landing-accent); color: var(--landing-on); }
#main[data-page-kind="home"] .editorial-page { padding-bottom: var(--space-400); }
#main[data-page-kind="home"] .editorial-cta { margin-top: var(--space-800); }
#main[data-page-kind="home"] #catalog-section { padding-top: var(--space-400); }
#main[data-page-kind="home"] .editorial-cta { grid-template-columns: minmax(0, 1fr); justify-items: center; row-gap: var(--space-300); text-align: center; }
#main[data-page-kind="home"] .editorial-cta > img { grid-column: 1; grid-row: 1; width: 80px; height: 68px; }
#main[data-page-kind="home"] .editorial-cta > div:not(.cta-actions) { grid-column: 1; grid-row: 2; }
#main[data-page-kind="home"] .editorial-cta h2, #main[data-page-kind="home"] .editorial-cta p { margin-inline: auto; }
#main[data-page-kind="home"] .editorial-cta .cta-actions { grid-column: 1 / -1; flex-direction: row; justify-content: center; flex-wrap: wrap; gap: var(--space-300); margin-top: 0; }
.editorial-cta > img { display: block; width: 176px; height: 148px; max-width: 100%; object-fit: contain; }
.copy-email { display: inline; padding: 0; border: 0; background: transparent; color: var(--landing-accent); text-decoration: underline; text-underline-offset: var(--space-100); }
.copy-email:hover { color: var(--landing-ink); }
.editorial-cta h2 { max-width: 540px; font-size: clamp(26px, 2.8vw, 36px); line-height: 1.18; letter-spacing: -.04em; }
.editorial-cta p { margin-top: var(--space-300); max-width: 560px; color: var(--landing-muted); font-size: 15px; line-height: 1.65; }
.cta-actions { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-200); }
.cta-actions .btn { min-height: 48px; white-space: normal; text-align: center; }
/* Closing call to action in the brand orange: light text and an inverted primary button keep the contrast. */
.editorial-cta h2 { color: var(--landing-on); }
.editorial-cta p { color: var(--landing-bg); }
.editorial-cta .copy-email { color: var(--landing-on); }
.editorial-cta .copy-email:hover { color: var(--landing-soft); }
.editorial-cta .btn-primary { border-color: var(--landing-white); background: var(--landing-white); color: var(--landing-accent); }
.editorial-cta .btn-primary:hover { border-color: var(--landing-bg); background: var(--landing-bg); color: var(--landing-ink); }
.editorial-cta .btn-plain { color: var(--landing-on); }
.editorial-cta .btn-plain:hover { color: var(--landing-on); text-decoration: underline; text-underline-offset: var(--space-100); }
.editorial-cta a:focus-visible, .editorial-cta button:focus-visible { outline-color: var(--landing-on); }

/* Keep the approved warm sand closing card on property solution pages. */
#main[data-page-kind="solution"] .editorial-cta { background: var(--landing-soft); color: var(--landing-ink); }
#main[data-page-kind="solution"] .editorial-cta h2 { color: var(--landing-ink); }
#main[data-page-kind="solution"] .editorial-cta p { color: var(--landing-muted); }
#main[data-page-kind="solution"] .editorial-cta .btn-primary { border-color: var(--landing-accent); background: var(--landing-accent); color: var(--landing-on); }
#main[data-page-kind="solution"] .editorial-cta .btn-primary:hover { filter: brightness(.97); }
#main[data-page-kind="solution"] .editorial-cta .btn-plain { color: var(--landing-accent); }
#main[data-page-kind="solution"] .editorial-cta .btn-plain:hover { color: var(--landing-ink); }
#main[data-page-kind="solution"] .editorial-cta a:focus-visible, #main[data-page-kind="solution"] .editorial-cta button:focus-visible { outline-color: var(--landing-accent); }

.home-pathways, .property-pathways { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-600); margin-top: var(--space-800); }
.home-pathways { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pathways-section { margin-bottom: var(--editorial-section); }
#home-pathways { padding-bottom: 0; } /* the section margin already separates it from the next block */
.property-section { margin-top: var(--editorial-section); }
.home-pathways > article { display: flex; flex-direction: column; align-items: start; min-width: 0; padding: var(--space-800); border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); }
.home-pathways > article > svg { width: 40px; height: 40px; margin-bottom: var(--space-800); color: var(--landing-accent); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.home-pathways h3, .property-pathways h3 { font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: -.035em; }
.home-pathways p, .property-pathways p { margin-top: var(--space-300); color: var(--landing-muted); font-size: 15px; line-height: 1.75; }
.home-pathways article > a, .property-pathways article > a { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; padding-top: var(--space-600); color: var(--landing-accent); font-size: 13px; font-weight: 600; }
.home-pathways article > a, .property-pathways article > a { gap: var(--space-200); }
.home-pathways article > a svg, .property-pathways article > a svg { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; color: inherit; }
.home-pathways article > a:hover, .property-pathways article > a:hover { text-decoration: underline; text-underline-offset: 4px; }
.property-pathways { margin-top: var(--space-1000); }
.property-pathways > article { display: flex; flex-direction: column; align-items: start; min-width: 0; padding-bottom: var(--space-400); }
.property-card-art { position: relative; display: grid; place-items: center; width: 100%; height: 208px; margin-bottom: var(--space-600); overflow: hidden; border-radius: var(--radius-xl); background: var(--landing-soft); }
.property-card-art img { display: block; width: 100%; height: 208px; object-fit: contain; }
.property-card-art > svg { position: absolute; left: var(--space-600); bottom: var(--space-600); width: 32px; height: 32px; color: var(--landing-accent); }
.property-pathways article > p { padding-right: var(--space-400); }

.product-proof { max-width: var(--editorial-width); padding: var(--space-1200) var(--editorial-gutter) var(--space-1600); }
.product-proof .section-heading { align-items: flex-start; gap: var(--space-800); }
.product-proof h2 { max-width: 720px; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.15; }
.product-proof .product-frame { border-radius: var(--radius-xl); border-color: var(--landing-line); box-shadow: var(--shadow-lg); }
.product-proof .product-frame img { height: auto; aspect-ratio: auto; object-fit: contain; }
.product-proof .shot-selector { flex-shrink: 0; padding: var(--space-100); border: 1px solid var(--landing-line); background: var(--landing-soft); }
.product-proof .shot-selector button { min-height: 40px; padding: var(--space-200) var(--space-300); }
.product-proof .caption { margin-top: var(--space-500); line-height: 1.7; }
.product-proof .benefits { gap: var(--space-800); }
.product-proof .benefits > article { padding-top: var(--space-500); border-top: 1px solid var(--landing-line); }
.product-proof .benefits h3 { font-size: 20px; line-height: 1.25; }
.product-proof .scope-note { max-width: 880px; }

.site-footer { display: block; padding: var(--space-1600) max(var(--editorial-gutter), calc((100vw - 1184px) / 2)) var(--space-800); border-top: 1px solid var(--landing-line); background: var(--landing-soft); color: var(--landing-ink); }
.footer-top { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: var(--space-1200); }
.footer-top > div:first-child { max-width: 300px; }
.footer-top .brand { display: inline-flex; margin: 0; }
.footer-top .brand img { width: 148px; height: auto; }
.footer-top p { font-size: 14px; line-height: 1.7; color: var(--landing-muted); }
.footer-contact { display: inline-flex; align-items: center; min-height: 44px; margin-top: var(--space-200); color: var(--landing-accent); font-size: 13px; }
.footer-column { display: flex; flex-direction: column; align-items: start; min-width: 0; }
.footer-column h2, .footer-column h3, .footer-column > strong { margin: 0 0 var(--space-400); font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: .04em; text-transform: uppercase; }
.footer-column a { display: inline-flex; align-items: center; min-height: 36px; padding-block: var(--space-200); font-size: 14px; line-height: 1.5; color: var(--landing-muted); overflow-wrap: anywhere; }
.footer-column a:hover, .footer-bottom a:hover { color: var(--landing-accent); text-decoration: underline; text-underline-offset: 4px; }
.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-300) var(--space-600); margin-top: var(--space-1200); padding-top: var(--space-600); border-top: 1px solid var(--landing-line); color: var(--landing-muted); font-size: 12px; line-height: 1.6; }
.footer-bottom > small { flex-basis: auto; margin: 0 auto 0 0; font-size: inherit; }
.footer-bottom a { min-height: 32px; display: inline-flex; align-items: center; }
.site-footer a:focus-visible, .editorial-page a:focus-visible, .editorial-page button:focus-visible { outline: 2px solid var(--landing-accent); outline-offset: var(--space-100); }

/* Integrations: Lenzuoli in the centre, a solid line to what is connected, a dashed one to what we build. */
.integration-map { --integration-line: color-mix(in srgb, var(--landing-accent) 35%, var(--landing-line)); margin-top: var(--editorial-section); }
.integration-map h2 { max-width: 620px; font-size: clamp(28px, 3vw, 40px); line-height: 1.18; letter-spacing: -.04em; }
.integration-map .section-heading > p { max-width: 380px; color: var(--landing-muted); font-size: 15px; line-height: 1.7; }
.integration-hub { display: flex; flex-direction: column; align-items: center; gap: var(--space-200); width: max-content; max-width: 100%; margin: var(--space-800) auto 0; padding: var(--space-600) var(--space-1000); border: 1px solid var(--integration-line); border-radius: var(--radius-xl); background: var(--landing-white); box-shadow: var(--shadow-md); text-align: center; }
.integration-hub img { display: block; width: 148px; height: auto; }
.integration-hub span { color: var(--landing-muted); font-size: 13px; line-height: 1.5; }
.integration-groups { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-500); margin: var(--space-1200) 0 0; padding: 0; list-style: none; }
.integration-groups::before { content: ''; position: absolute; top: calc(-1 * var(--space-600)); left: 12.5%; right: 12.5%; border-top: 1px solid var(--integration-line); }
.integration-groups::after { content: ''; position: absolute; top: calc(-1 * var(--space-1200)); left: 50%; height: var(--space-600); border-left: 1px solid var(--integration-line); }
.integration-groups > li { position: relative; display: flex; flex-direction: column; align-items: start; min-width: 0; padding: var(--space-600); border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); }
.integration-groups > li::before { content: ''; position: absolute; top: calc(-1 * var(--space-600) - 1px); left: 50%; height: var(--space-600); border-left: 1px solid var(--integration-line); }
.integration-groups .editorial-icon { width: 32px; height: 32px; margin-bottom: var(--space-500); }
.integration-groups h3 { font-size: 19px; font-weight: 600; line-height: 1.25; letter-spacing: -.02em; }
.integration-groups p { margin-top: var(--space-200); color: var(--landing-muted); font-size: 14px; line-height: 1.65; }
.integration-chips { display: flex; flex-wrap: wrap; gap: var(--space-200); margin: auto 0 0; padding: var(--space-500) 0 0; list-style: none; }
.integration-chips li { padding: var(--space-100) var(--space-300); border: 1px solid var(--landing-line); border-radius: var(--radius-full); background: var(--landing-soft); font-size: 12px; font-weight: 500; line-height: 1.5; }
.integration-groups > .integration-yours { border: 1px dashed var(--integration-line); background: var(--editorial-tint); }
.integration-groups > .integration-yours::before { border-left-style: dashed; }
.integration-yours .integration-chips li { border-style: dashed; background: var(--landing-white); }
.integration-yours > a { display: inline-flex; align-items: center; gap: var(--space-200); min-height: 44px; margin-top: var(--space-400); color: var(--landing-accent); font-size: 13px; font-weight: 600; }
.integration-yours > a svg { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; color: inherit; }
.integration-yours > a:hover { text-decoration: underline; text-underline-offset: 4px; }
.integration-switch { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: center; gap: var(--space-500); margin-top: var(--space-500); padding: var(--space-600) var(--space-800); border-radius: var(--radius-xl); background: var(--landing-soft); }
.integration-switch .editorial-icon { width: 32px; height: 32px; }
.integration-switch h3 { font-size: 17px; font-weight: 600; line-height: 1.3; }
.integration-switch p { margin-top: var(--space-100); color: var(--landing-muted); font-size: 14px; line-height: 1.65; }
@media (max-width: 1050px) {
  .integration-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: var(--space-600); }
  .integration-groups::before, .integration-groups::after, .integration-groups > li::before { display: none; }
}
@media (max-width: 560px) {
  .integration-hub { width: 100%; padding: var(--space-500); }
  .integration-groups { grid-template-columns: 1fr; gap: var(--space-400); }
  .integration-groups > li { padding: var(--space-500); }
  .integration-switch { padding: var(--space-500); gap: var(--space-400); }
}

@media (min-width: 1700px) {
  .hero--product { max-width: 1520px; gap: var(--space-2000); padding-block: var(--space-2000); }
  .hero--product #mascot-stage { height: 484px; }
  .hero--product #mascot-stage:not(.chat-open) .mascot { width: 488px; height: 407px; left: calc(50% - 244px); top: var(--space-600); }
  .hero--home, .hero--about { padding-top: var(--space-2000); }
}
@media (max-width: 1050px) {
  :root { --editorial-gutter: var(--space-800); --editorial-section: var(--space-1600); }
  .hero--product { gap: var(--space-800); padding-top: var(--space-1200); }
  .hero--product h1 { font-size: clamp(36px, 4.8vw, 56px); }
  .hero--product #mascot-stage { height: 392px; }
  .hero--product #mascot-stage:not(.chat-open) .mascot { width: 380px; height: 317px; left: calc(50% - 190px); top: var(--space-600); }
  .hero-product-badge { top: var(--space-400); left: var(--space-400); right: var(--space-400); }
  .hero-workflow { left: var(--space-400); right: var(--space-400); gap: var(--space-200); }
  .outcome-grid > article { padding: var(--space-600); }
  .workflow-section { padding: var(--space-800); gap: var(--space-800); }
  .product-depth, .faq-section { gap: var(--space-800); }
  .capability-list { grid-template-columns: 1fr; }
  .editorial-cta { grid-template-columns: 112px minmax(0, 1fr); gap: var(--space-600); padding: var(--space-800); }
  .editorial-cta .cta-actions { grid-column: 2; flex-direction: row; flex-wrap: wrap; }
  .home-pathways > article { padding: var(--space-600); }
  .home-pathways { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-top { gap: var(--space-800); }
}
@media (max-width: 780px) {
  .hero--product { grid-template-columns: 1fr; gap: var(--space-500); max-width: 680px; }
  .hero--product .hero-intro { max-width: none; text-align: center; }
  .hero--product h1 { font-size: clamp(38px, 6.5vw, 56px); }
  .hero--product #hero-summary { margin-inline: auto; }
  .hero--product .hero-actions { justify-content: center; }
  .hero--product #mascot-stage { max-width: 560px; margin-inline: auto; }
  .hero--home #hero-summary, .hero--about #hero-summary { font-size: 16px; }
  .workflow-section { grid-template-columns: 1fr; }
  .workflow-art { width: 100%; }
  .workflow-map { max-width: none; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-300); }
  .workflow-node { grid-template-columns: 1fr; gap: var(--space-300); padding: var(--space-400); }
  .workflow-node > span { grid-column: auto; }
  .workflow-node strong { font-size: 15px; }
  .product-depth, .faq-section { grid-template-columns: 1fr; gap: var(--space-600); }
  .product-depth h2, .faq-section h2 { max-width: 600px; }
  .capability-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-pathways, .property-pathways { gap: var(--space-400); }
  .home-pathways h3, .property-pathways h3 { font-size: 21px; }
  .home-pathways > article { padding: var(--space-500); }
  .footer-top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-top > div:first-child { grid-column: 1 / -1; max-width: 460px; }
}
@media (max-width: 740px) {
  .hero.hero--chat #mascot-stage.chat-open { height: auto; }
  .hero--chat #mascot-stage.chat-open .mascot-dock .mascot { width: 200px; height: 167px; left: -12px; top: -20px; }
  .hero--chat #mascot-stage.chat-open .mascot-dock .mascot-shadow { width: 80px; height: 8px; left: 50px; bottom: 12px; }
  .product-proof .product-frame img { aspect-ratio: auto; object-fit: contain; }
  .product-proof .shot-selector button { min-height: 44px; }
}
@media (max-width: 560px) {
  :root { --editorial-gutter: var(--space-500); --editorial-section: var(--space-1200); }
  .hero--home, .hero--about { padding: var(--space-1000) var(--space-500) var(--space-800); }
  .hero--home h1, .hero--about h1 { font-size: clamp(38px, 8.5vw, 48px); letter-spacing: -.055em; }
  .hero--home #mascot-stage:not(.chat-open), .hero--about #mascot-stage:not(.chat-open) { height: 288px; }
  .hero--home #mascot-stage:not(.chat-open) .mascot, .hero--about #mascot-stage:not(.chat-open) .mascot { width: 352px; height: 293px; left: calc(50% - 176px); top: -12px; }
  .hero--home #mascot-stage:not(.chat-open) .mascot-shadow { bottom: 64px; }
  .hero--product { padding: var(--space-1000) var(--space-500) var(--space-600); }
  .hero--product h1 { font-size: clamp(36px, 8.5vw, 44px); }
  .hero--product #hero-summary { font-size: 15px; }
  .hero--product #mascot-stage { height: 368px; }
  .hero--product #mascot-stage:not(.chat-open) .mascot { width: 304px; height: 253px; left: calc(50% - 152px); top: var(--space-600); }
  .hero--product #mascot-stage:not(.chat-open) .mascot-shadow { bottom: var(--space-2400); }
  #product-hero-visual::before { width: 216px; height: 216px; left: calc(50% - 108px); top: var(--space-1200); }
  .hero-product-badge { font-size: 11px; }
  .hero-workflow > span { font-size: 11px; }
  .editorial-page { padding-top: var(--space-800); }
  .editorial-intro { margin-bottom: var(--space-800); }
  .editorial-intro > p:not(.eyebrow) { margin-top: var(--space-400); font-size: 15px; }
  .outcome-grid { grid-template-columns: 1fr; }
  .outcome-grid > article { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: var(--space-200) var(--space-400); padding: var(--space-600); }
  .outcome-grid > article + article { border-left: 0; border-top: 1px solid var(--landing-line); }
  .outcome-grid .editorial-icon { grid-row: 1 / span 2; width: 28px; height: 28px; margin: 0; }
  .outcome-grid h3 { max-width: none; margin: 0; font-size: 21px; }
  .outcome-grid p { grid-column: 2; }
  .workflow-section { padding: var(--space-600); gap: var(--space-800); }
  .workflow-story li { grid-template-columns: 24px minmax(0, 1fr); gap: var(--space-200) var(--space-300); }
  .workflow-map { grid-template-columns: 1fr; gap: var(--space-300); }
  .workflow-node { grid-template-columns: 28px minmax(0, 1fr); }
  .workflow-node > span { grid-column: 1 / -1; }
  .capability-list { grid-template-columns: 1fr; }
  .faq-section { padding-top: var(--space-800); }
  .faq-list summary { gap: var(--space-400); font-size: 15px; }
  .faq-list details > p { padding-right: 0; }
  .editorial-cta { grid-template-columns: 72px minmax(0, 1fr); padding: var(--space-600); gap: var(--space-400); }
  #main[data-page-kind="home"] .editorial-cta { grid-template-columns: 1fr; }
  #main[data-page-kind="home"] .editorial-cta > img, #main[data-page-kind="home"] .editorial-cta > div:not(.cta-actions) { grid-column: 1; }
  #main[data-page-kind="home"] .editorial-cta > img { grid-row: auto; width: 64px; height: 56px; margin-inline: auto; }
  #main[data-page-kind="home"] .editorial-cta > div:not(.cta-actions) { grid-row: auto; }
  .editorial-cta > img { width: 96px; height: 96px; }
  .editorial-cta h2 { font-size: 26px; }
  .editorial-cta > div:not(.cta-actions) p { grid-column: 1 / -1; }
  .editorial-cta .cta-actions { grid-column: 1 / -1; flex-direction: column; margin-top: var(--space-200); }
  .home-pathways, .property-pathways { grid-template-columns: 1fr; gap: var(--space-500); }
  .home-pathways > article { padding: var(--space-600); }
  .home-pathways > article > svg { width: 32px; height: 32px; margin-bottom: var(--space-500); }
  .home-pathways h3, .property-pathways h3 { font-size: 24px; }
  .property-card-art { margin-bottom: var(--space-500); }
  .property-pathways > article + article { padding-top: var(--space-500); border-top: 1px solid var(--landing-line); }
  .product-proof { padding-top: var(--space-800); padding-bottom: var(--space-1200); }
  .product-proof .section-heading { gap: var(--space-500); }
  .product-proof .product-frame .enlarge { font-size: 11px; }
  .site-footer { padding-top: var(--space-1200); }
  .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-800) var(--space-500); }
  .footer-column a { min-height: 44px; }
  .footer-bottom { gap: var(--space-200) var(--space-500); margin-top: var(--space-800); }
  .footer-bottom > small { flex-basis: 100%; }
  .footer-bottom a { min-height: 44px; }
}
@media (max-width: 390px) {
  .site-header { column-gap: var(--space-300); }
  .header-actions { flex: 0 0 auto; flex-wrap: nowrap; gap: var(--space-200); }
  .header-actions .btn { padding-inline: var(--space-200); font-size: 11px; }
  .language select { padding-inline: var(--space-100); }
}
@media (prefers-reduced-motion: reduce) {
  .hero--product *, .editorial-page *, .site-footer * { animation: none !important; transition: none !important; }
}

/* product-tour.css */
/* Product heroes with a guided tour: a real screen replaces the generic product visual. */
.tour-hero { display: none; }
/* The booking snapshots use the widget's own families; declared here because Shadow DOM sheets cannot load fonts. */
@font-face { font-family: LzBookingInter; font-style: normal; font-weight: 400 700; font-display: swap; src: url('/assets/fonts/inter-latin.woff2') format('woff2'); }
@font-face { font-family: LzBookingMontserrat; font-style: normal; font-weight: 400 700; font-display: swap; src: url('/assets/fonts/montserrat-latin.woff2') format('woff2'); }
@font-face { font-family: LzBookingPlayfair; font-style: normal; font-weight: 400 700; font-display: swap; src: url('/assets/fonts/playfair-latin.woff2') format('woff2'); }
#main[data-route="booking"] #booking-demo,
#main[data-route="pms"] #pms-demo { display: block; }
#main:is([data-route="booking"], [data-route="pms"]) #mascot-stage.chat-open .tour-hero,
#main:is([data-route="booking"], [data-route="pms"]) #product-hero-visual,
#main:is([data-route="booking"], [data-route="pms"]) #mascot-stage:not(.chat-open) .mascot-dock { display: none; }
#main:is([data-route="booking"], [data-route="pms"]) .hero--product #mascot-stage:not(.chat-open) { height: auto; padding: var(--space-1600) 0 var(--space-1000); }

.tour-hero__trigger { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; color: inherit; text-align: left; isolation: isolate; }
.tour-hero__frame { position: relative; z-index: 1; display: block; overflow: hidden; border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); box-shadow: 0 24px 56px #1a0f0714; transition: transform var(--dur-slow) var(--ease-out), box-shadow var(--dur-slow) var(--ease-out); }
.tour-hero__shot { display: block; width: 100%; height: auto; }
.tour-hero__trigger:hover .tour-hero__frame, .tour-hero__trigger:focus-visible .tour-hero__frame { box-shadow: 0 32px 64px #1a0f071f; }
.tour-hero__play { position: relative; flex: 0 0 32px; height: 32px; border-radius: var(--radius-full); background: var(--landing-accent); }
.tour-hero__play::before { content: ''; position: absolute; left: 13px; top: 10px; border-left: 9px solid var(--landing-on); border-block: 6px solid transparent; }
.tour-hero__play::after { content: ''; position: absolute; inset: calc(-1 * var(--space-100)); border: 2px solid var(--landing-accent); border-radius: inherit; opacity: 0; animation: tour-pulse 1.8s var(--ease-out) 3; }
@keyframes tour-pulse { from { opacity: .8; transform: scale(.8); } to { opacity: 0; transform: scale(1.5); } }

/* Booking: the hotel website in a browser frame, CTA over the screen. */
.tour-hero__bar { display: flex; align-items: center; gap: var(--space-150); height: 36px; padding: 0 var(--space-400); border-bottom: 1px solid var(--landing-line); background: var(--landing-soft); }
.tour-hero__bar i { flex: 0 0 10px; height: 10px; border-radius: var(--radius-full); background: var(--landing-line); }
.tour-hero__address { flex: 0 1 260px; margin-inline: auto; padding: var(--space-050) var(--space-300); border-radius: var(--radius-full); background: var(--landing-white); color: var(--landing-muted); font-size: 11px; line-height: 1.6; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* PMS: the software in an app window, live figures floating around it. */
.tour-hero--pms { --pms-rail: var(--landing-ink); --pms-rail-fg: #cbb89f; --pms-live: #287451; }
.tour-hero__frame--app { border-color: var(--pms-rail); }
.tour-hero__appbar { display: flex; align-items: center; gap: var(--space-300); height: 40px; padding: 0 var(--space-400); background: var(--pms-rail); color: var(--pms-rail-fg); font-size: 12px; font-weight: 500; }
.tour-hero__mark { display: grid; flex: 0 0 22px; height: 22px; place-items: center; border-radius: var(--radius-sm); background: var(--landing-accent); color: var(--landing-on); font-family: var(--bbr-font-display); font-size: 13px; font-weight: 700; }
.tour-hero__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tour-hero__live { display: inline-flex; align-items: center; gap: var(--space-150); margin-left: auto; padding: var(--space-050) var(--space-300); border-radius: var(--radius-full); background: #ffffff14; }
.tour-hero__live i { position: relative; width: 8px; height: 8px; border-radius: var(--radius-full); background: var(--pms-live); }
.tour-hero__live i::after { content: ''; position: absolute; inset: -4px; border: 2px solid var(--pms-live); border-radius: inherit; opacity: 0; animation: tour-pulse 1.6s var(--ease-out) 3; }
/* The real Planner as a lightweight HTML snapshot (Shadow DOM), scaled to the frame. */
.tour-hero__snap { position: relative; display: block; aspect-ratio: 1696 / 1072; overflow: hidden; background: var(--landing-soft); pointer-events: none; }
/* Lenzo leans over the window's top edge. Each hero sets --lean-up (the line under his eyes meets the edge) and the
   outline of the hands below that line, traced from the image pixels. A second copy above the window uncovers
   only the hands, so they rest on the bar. He rises first, then puts his hands down; on leave the reverse.
   PMS: affaccia.png, eyes end at 62% (y 707/1145), hands at 66%, top right.
   Booking: aggrappato.png, eyes end at 56% (y 639/1145), hands at 64%, top left. */
.tour-hero--pms {
  --lean-up: -62.4%;
  --hands-shut: polygon(29.7% 62.2%, 29.7% 62.2%, 30.1% 62.2%, 30.6% 62.2%, 31% 62.2%, 31.4% 62.2%, 31.9% 62.2%, 32.3% 62.2%, 32.8% 62.2%, 33.2% 62.2%, 33.6% 62.2%, 34.1% 62.2%, 34.5% 62.2%, 34.9% 62.2%, 35.4% 62.2%, 35.8% 62.2%, 36.2% 62.2%, 36.7% 62.2%, 37.1% 62.2%, 37.6% 62.2%, 38% 62.2%, 38.4% 62.2%, 38.9% 62.2%, 39.3% 62.2%, 39.7% 62.2%, 40.2% 62.2%, 40.5% 62.2%, 40.5% 62.2%, 59.2% 62.2%, 59.2% 62.2%, 59.6% 62.2%, 60% 62.2%, 60.5% 62.2%, 60.9% 62.2%, 61.4% 62.2%, 61.8% 62.2%, 62.2% 62.2%, 62.7% 62.2%, 63.1% 62.2%, 63.5% 62.2%, 64% 62.2%, 64.4% 62.2%, 64.8% 62.2%, 65.3% 62.2%, 65.7% 62.2%, 66.2% 62.2%, 66.6% 62.2%, 67% 62.2%, 67.5% 62.2%, 67.9% 62.2%, 68.3% 62.2%, 68.8% 62.2%, 69.2% 62.2%, 69.7% 62.2%, 70.1% 62.2%, 70.4% 62.2%, 70.4% 62.2%);
  --hands-open: polygon(29.7% 62.2%, 29.7% 62.6%, 30.1% 63.8%, 30.6% 64.4%, 31% 64.9%, 31.4% 65.3%, 31.9% 65.5%, 32.3% 65.5%, 32.8% 65.5%, 33.2% 65.3%, 33.6% 65.1%, 34.1% 64.7%, 34.5% 65%, 34.9% 65.4%, 35.4% 65.8%, 35.8% 66%, 36.2% 66.2%, 36.7% 66.3%, 37.1% 66.3%, 37.6% 66.3%, 38% 66.2%, 38.4% 66%, 38.9% 65.9%, 39.3% 65.5%, 39.7% 65%, 40.2% 64.3%, 40.5% 63.1%, 40.5% 62.2%, 59.2% 62.2%, 59.2% 62.8%, 59.6% 64.4%, 60% 65%, 60.5% 65.5%, 60.9% 65.8%, 61.4% 65.9%, 61.8% 66.1%, 62.2% 66.2%, 62.7% 66.2%, 63.1% 66.1%, 63.5% 66%, 64% 65.9%, 64.4% 65.6%, 64.8% 65.2%, 65.3% 64.8%, 65.7% 64.5%, 66.2% 64.9%, 66.6% 65.1%, 67% 65.2%, 67.5% 65.3%, 67.9% 65.2%, 68.3% 65.2%, 68.8% 64.9%, 69.2% 64.4%, 69.7% 63.8%, 70.1% 63.3%, 70.4% 62.4%, 70.4% 62.2%);
}
.tour-hero--booking {
  --lean-up: -56.4%;
  --hands-shut: polygon(27% 56.2%, 27% 56.2%, 27.4% 56.2%, 27.9% 56.2%, 28.3% 56.2%, 28.7% 56.2%, 29.2% 56.2%, 29.6% 56.2%, 30.1% 56.2%, 30.5% 56.2%, 30.9% 56.2%, 31.4% 56.2%, 31.8% 56.2%, 32.2% 56.2%, 32.7% 56.2%, 33.1% 56.2%, 33.6% 56.2%, 34% 56.2%, 34.4% 56.2%, 34.9% 56.2%, 35.3% 56.2%, 35.7% 56.2%, 36.2% 56.2%, 36.6% 56.2%, 37% 56.2%, 37.5% 56.2%, 37.9% 56.2%, 38.4% 56.2%, 38.8% 56.2%, 39.2% 56.2%, 39.2% 56.2%, 60.5% 56.2%, 60.5% 56.2%, 60.9% 56.2%, 61.4% 56.2%, 61.8% 56.2%, 62.2% 56.2%, 62.7% 56.2%, 63.1% 56.2%, 63.5% 56.2%, 64% 56.2%, 64.4% 56.2%, 64.8% 56.2%, 65.3% 56.2%, 65.7% 56.2%, 66.2% 56.2%, 66.6% 56.2%, 67% 56.2%, 67.5% 56.2%, 67.9% 56.2%, 68.3% 56.2%, 68.8% 56.2%, 69.2% 56.2%, 69.7% 56.2%, 70.1% 56.2%, 70.5% 56.2%, 71% 56.2%, 71.4% 56.2%, 71.8% 56.2%, 72.3% 56.2%, 72.7% 56.2%, 73.1% 56.2%, 73.1% 56.2%);
  --hands-open: polygon(27% 56.2%, 27% 59.7%, 27.4% 60.3%, 27.9% 60.9%, 28.3% 61.4%, 28.7% 61.9%, 29.2% 62.1%, 29.6% 62.2%, 30.1% 62.3%, 30.5% 62.2%, 30.9% 62.1%, 31.4% 61.8%, 31.8% 61.5%, 32.2% 61.2%, 32.7% 61.2%, 33.1% 61.7%, 33.6% 62.6%, 34% 63.1%, 34.4% 63.7%, 34.9% 63.9%, 35.3% 64%, 35.7% 64.1%, 36.2% 64.1%, 36.6% 64%, 37% 63.8%, 37.5% 63.6%, 37.9% 63.2%, 38.4% 62.6%, 38.8% 61.8%, 39.2% 60.3%, 39.2% 56.2%, 60.5% 56.2%, 60.5% 59.9%, 60.9% 61.7%, 61.4% 62.6%, 61.8% 63.1%, 62.2% 63.5%, 62.7% 63.8%, 63.1% 63.9%, 63.5% 64%, 64% 64.1%, 64.4% 64%, 64.8% 63.8%, 65.3% 63.6%, 65.7% 63.1%, 66.2% 62.5%, 66.6% 61.7%, 67% 61.1%, 67.5% 61.2%, 67.9% 61.5%, 68.3% 61.8%, 68.8% 62.1%, 69.2% 62.3%, 69.7% 62.3%, 70.1% 62.4%, 70.5% 62.3%, 71% 62.1%, 71.4% 61.8%, 71.8% 61.3%, 72.3% 60.8%, 72.7% 60.3%, 73.1% 59.4%, 73.1% 56.2%);
}
.tour-hero--booking .tour-hero__lean { right: auto; left: var(--space-1000); }
.tour-hero--booking .tour-hero__snap { aspect-ratio: 1440 / 860; }
.tour-hero__lean { position: absolute; z-index: 0; top: 0; right: var(--space-1200); width: 230px; height: auto; transform: translateY(var(--space-400)); transition: transform 420ms var(--ease-in-out) 160ms; }
.tour-hero__lean--hands { z-index: 2; clip-path: var(--hands-shut); pointer-events: none; transition: transform 420ms var(--ease-in-out) 160ms, clip-path 180ms var(--ease-in-out); }
.tour-hero__trigger:hover .tour-hero__lean, .tour-hero__trigger:focus-visible .tour-hero__lean { transform: translateY(var(--lean-up)); transition: transform 620ms var(--ease-out); }
.tour-hero__trigger:hover .tour-hero__lean--hands, .tour-hero__trigger:focus-visible .tour-hero__lean--hands { clip-path: var(--hands-open); transition: transform 620ms var(--ease-out), clip-path 320ms var(--ease-out) 540ms; }
@media (hover: none) { .tour-hero__lean { transform: translateY(var(--lean-up)); } .tour-hero__lean--hands { clip-path: var(--hands-open); } }
.tour-hero__kpis { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.tour-hero__kpi { position: absolute; display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; align-items: center; column-gap: var(--space-300); padding: var(--space-300) var(--space-400) var(--space-300) var(--space-300); border: 1px solid var(--landing-line); border-radius: var(--radius-lg); background: var(--landing-white); box-shadow: 0 16px 36px #1a0f071a; animation: kpi-in 640ms var(--ease-spring) backwards; --depth: var(--space-300); translate: calc(var(--px, 0) * var(--depth)) calc(var(--py, 0) * var(--depth)); transition: transform 760ms var(--ease-spring), box-shadow 520ms var(--ease-out), translate 700ms var(--ease-out); }
.tour-hero__kpi-icon svg { transition: transform 620ms var(--ease-spring); }
.tour-hero__kpi-icon { display: grid; grid-row: 1 / 3; width: 36px; height: 36px; place-items: center; border-radius: var(--radius-md); }
.tour-hero__kpi-icon svg { width: 20px; height: 20px; }
.tour-hero__kpi b { font-size: 22px; line-height: 1.1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.tour-hero__kpi small { font-size: 11px; line-height: 1.3; white-space: nowrap; }
.tour-hero__kpi--occupancy { top: 30%; left: calc(-1 * var(--space-800)); animation-delay: 240ms; }
.tour-hero__kpi--occupancy .tour-hero__kpi-icon { background: var(--landing-soft); color: var(--landing-accent); }
.tour-hero__kpi--arrivals { top: 14%; right: calc(-1 * var(--space-600)); animation-delay: 380ms; }
.tour-hero__kpi--arrivals .tour-hero__kpi-icon { background: #eaf1fc; color: #245b9b; }
.tour-hero__kpi--inhouse { bottom: calc(-1 * var(--space-500)); left: 18%; animation-delay: 520ms; }
.tour-hero__kpi--inhouse .tour-hero__kpi-icon { background: #e6f3ef; color: var(--pms-live); }
/* At hover the figures spring apart one after the other, tilt slightly and lift; they drift with the pointer. */
.tour-hero__kpi--occupancy { --depth: var(--space-400); }
.tour-hero__kpi--arrivals { --depth: var(--space-200); transition-delay: 70ms, 70ms, 0ms; }
.tour-hero__kpi--inhouse { --depth: var(--space-300); transition-delay: 140ms, 140ms, 0ms; }
.tour-hero__trigger:hover .tour-hero__kpi { box-shadow: 0 24px 48px #1a0f0726; }
.tour-hero__trigger:hover .tour-hero__kpi-icon svg { transform: scale(1.15) rotate(-8deg); }
.tour-hero--pms .tour-hero__trigger:hover .tour-hero__kpi--occupancy { transform: translate(calc(-1 * var(--space-300)), calc(-1 * var(--space-150))) rotate(-2.5deg) scale(1.04); }
.tour-hero--pms .tour-hero__trigger:hover .tour-hero__kpi--arrivals { transform: translate(var(--space-300), calc(-1 * var(--space-200))) rotate(2deg) scale(1.04); }
.tour-hero--pms .tour-hero__trigger:hover .tour-hero__kpi--inhouse { transform: translate(calc(-1 * var(--space-150)), var(--space-200)) rotate(-1.5deg) scale(1.04); }
/* Booking: facts taken from the demo itself (the four templates, a real price, the install platforms). */
.tour-hero__kpi--templates { top: 20%; right: calc(-1 * var(--space-600)); animation-delay: 240ms; --depth: var(--space-200); }
.tour-hero__kpi--templates .tour-hero__kpi-icon { background: var(--landing-soft); color: var(--landing-accent); }
.tour-hero__kpi--price { bottom: calc(-1 * var(--space-500)); left: 6%; animation-delay: 380ms; --depth: var(--space-400); transition-delay: 70ms, 70ms, 0ms; }
.tour-hero__kpi--price .tour-hero__kpi-icon { background: #eaf1fc; color: #245b9b; }
.tour-hero__kpi--install { bottom: calc(-1 * var(--space-500)); right: 6%; animation-delay: 520ms; --depth: var(--space-300); transition-delay: 140ms, 140ms, 0ms; }
.tour-hero__kpi--install .tour-hero__kpi-icon { background: #e6f3ef; color: #237d76; }
.tour-hero__kpi--install b { font-size: 17px; letter-spacing: -.01em; }
.tour-hero--booking .tour-hero__trigger:hover .tour-hero__kpi--templates { transform: translate(var(--space-300), calc(-1 * var(--space-200))) rotate(2deg) scale(1.04); }
.tour-hero--booking .tour-hero__trigger:hover .tour-hero__kpi--price { transform: translate(calc(-1 * var(--space-300)), calc(-1 * var(--space-150))) rotate(-2.5deg) scale(1.04); }
.tour-hero--booking .tour-hero__trigger:hover .tour-hero__kpi--install { transform: translate(var(--space-200), var(--space-200)) rotate(1.5deg) scale(1.04); }
.tour-hero__how { display: flex; align-items: center; gap: var(--space-200); min-height: 44px; margin: var(--space-1000) auto 0; padding: var(--space-150) var(--space-500) var(--space-150) var(--space-150); border: 1px solid var(--landing-ink); border-radius: var(--radius-full); background: var(--landing-ink); color: var(--landing-on); font-size: 14px; font-weight: 600; box-shadow: 0 12px 28px #1a0f0726; transition: transform var(--dur-base) var(--ease-out); }
.tour-hero__how:hover { transform: translateY(calc(-1 * var(--space-050))); }
#main[data-route="pms"] .hero--product #mascot-stage:not(.chat-open) { padding-bottom: var(--space-1200); }
#main[data-route="pms"] .mascot-hint { display: none; }
@keyframes kpi-in { from { opacity: 0; transform: translateY(var(--space-400)) scale(.92); } }

/* Guided tour: real screens on the left, Lenzo explaining on the right. */
html.product-tour-open { overflow: hidden; }
.product-tour {
  --tour-rail: var(--landing-ink);
  --tour-rail-fg: #cbb89f;
  --tour-rail-muted: #9a876f;
  width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: var(--space-600);
  border: 0; background: transparent; color: var(--landing-ink); overflow: hidden;
}
.product-tour[open] { display: grid; place-items: center; }
.product-tour::backdrop { background: color-mix(in srgb, var(--landing-ink) 45%, transparent); backdrop-filter: blur(6px); }
.product-tour__window { display: grid; grid-template-columns: minmax(0, 1fr) 384px; width: min(1480px, 100%); height: min(920px, 100%); overflow: hidden; border-radius: var(--radius-xl); background: var(--landing-bg); box-shadow: 0 40px 120px #1a0f0740; transform-origin: 0 0; }

.product-tour__stage { display: flex; flex-direction: column; min-width: 0; min-height: 0; margin: var(--space-400) 0 var(--space-400) var(--space-400); overflow: hidden; border-radius: var(--radius-lg); background: var(--tour-rail); }
.product-tour__chrome { display: flex; flex: 0 0 44px; align-items: center; gap: var(--space-300); padding: 0 var(--space-400); color: var(--tour-rail-fg); font-size: 13px; }
.product-tour__mark { display: grid; flex: 0 0 24px; height: 24px; place-items: center; border-radius: var(--radius-sm); background: var(--landing-accent); color: var(--landing-on); font-family: var(--bbr-font-display); font-size: 14px; font-weight: 700; }
.product-tour__crumb { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-tour__stage[data-frame="site"] { background: var(--landing-soft); }
.product-tour__stage[data-frame="site"] .product-tour__chrome { border-bottom: 1px solid var(--landing-line); color: var(--landing-muted); }
.product-tour__stage[data-frame="site"] .product-tour__mark { visibility: hidden; }
.product-tour__stage[data-frame="site"] .product-tour__crumb { margin-inline: auto; padding: var(--space-050) var(--space-400); border-radius: var(--radius-full); background: var(--landing-white); font-size: 12px; }
.product-tour__viewport { position: relative; display: grid; flex: 1; min-height: 0; place-items: center; overflow: hidden; background: var(--landing-soft); }
.product-tour__canvas { position: relative; transition: transform 700ms var(--ease-out); }
.product-tour__shot { display: block; width: 100%; height: 100%; }
.product-tour__snap { position: absolute; inset: 0; overflow: hidden; background: var(--landing-soft); }
.product-tour__spot { position: absolute; padding: 0; border: 2px solid var(--landing-accent); border-radius: var(--radius-lg); background: transparent; box-shadow: 0 0 0 200vmax color-mix(in srgb, var(--landing-ink) 26%, transparent); transition: left 600ms var(--ease-out), top 600ms var(--ease-out), width 600ms var(--ease-out), height 600ms var(--ease-out); }
.product-tour__spot:focus-visible { outline: 3px solid var(--landing-on); outline-offset: 2px; }
.product-tour__beacon { position: absolute; top: calc(-1 * var(--space-300)); right: calc(-1 * var(--space-300)); width: 22px; height: 22px; border-radius: var(--radius-full); background: var(--landing-accent); box-shadow: 0 0 0 4px var(--landing-white); }
.product-tour__beacon::after { content: ''; position: absolute; inset: calc(-1 * var(--space-150)); border: 2px solid var(--landing-accent); border-radius: inherit; opacity: 0; }
.product-tour__spot.is-live .product-tour__beacon::after { animation: tour-pulse 1.6s var(--ease-out) 3; }
.product-tour__scope { flex: 0 0 auto; padding: var(--space-200) var(--space-400); color: var(--tour-rail-muted); font-size: 11px; line-height: 1.5; }
.product-tour__stage[data-frame="site"] .product-tour__scope { color: var(--landing-muted); }

.product-tour__guide { position: relative; display: flex; flex-direction: column; min-height: 0; padding: var(--space-800) var(--space-600) var(--space-500); overflow-y: auto; }
.product-tour__close { position: absolute; top: var(--space-300); right: var(--space-300); font-size: 22px; line-height: 1; }
.product-tour__lenzo { align-self: flex-start; width: 140px; height: auto; margin-left: var(--space-200); }
.product-tour__lenzo.is-hop { animation: tour-hop 520ms var(--ease-spring); }
.product-tour__bubble { position: relative; margin-top: var(--space-200); padding: var(--space-500); border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); box-shadow: 0 12px 32px #1a0f070d; }
.product-tour__bubble::before { content: ''; position: absolute; top: -8px; left: 68px; width: 14px; height: 14px; border-top: 1px solid var(--landing-line); border-left: 1px solid var(--landing-line); background: inherit; transform: rotate(45deg); }
.product-tour__counter { display: flex; align-items: center; gap: var(--space-200); color: var(--landing-accent); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.product-tour__icon { width: 18px; height: 18px; }
.product-tour__bubble h2 { margin-top: var(--space-200); font-size: 24px; line-height: 1.15; letter-spacing: -.03em; }
.product-tour__text { margin-top: var(--space-300); color: var(--landing-muted); font-size: 14px; line-height: 1.65; }
.product-tour__facts { display: flex; flex-wrap: wrap; gap: var(--space-150); margin: var(--space-400) 0 0; padding: 0; list-style: none; }
.product-tour__facts li { padding: var(--space-100) var(--space-300); border-radius: var(--radius-full); background: color-mix(in srgb, var(--landing-accent) 10%, var(--landing-white)); color: var(--landing-ink); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; animation: fact-in 420ms var(--ease-out) both; }
.product-tour__facts li:nth-child(2) { animation-delay: 80ms; }
.product-tour__facts li:nth-child(3) { animation-delay: 160ms; }
.product-tour__legend { display: flex; flex-wrap: wrap; gap: var(--space-150) var(--space-300); margin: var(--space-400) 0 0; padding: 0; list-style: none; color: var(--landing-ink); font-size: 12px; font-weight: 500; }
.product-tour__legend li { display: inline-flex; align-items: center; gap: var(--space-150); animation: fact-in 420ms var(--ease-out) 420ms both; }
.product-tour__legend li:nth-child(2) { animation-delay: 480ms; }
.product-tour__legend li:nth-child(3) { animation-delay: 540ms; }
.product-tour__legend li:nth-child(4) { animation-delay: 600ms; }
.product-tour__legend li:nth-child(5) { animation-delay: 660ms; }
.product-tour__swatch { width: 18px; height: 10px; border-radius: var(--radius-xs); background: var(--swatch); }
.product-tour__swatch.is-dashed { background: transparent; border: 2px dashed var(--swatch); }
.product-tour__swatch.is-warn { width: 12px; height: 12px; }
.product-tour__detail { display: flex; gap: var(--space-200); margin-top: var(--space-400); padding: var(--space-300); border-radius: var(--radius-md); background: var(--landing-soft); font-size: 13px; line-height: 1.5; }
.product-tour__detail::before { content: '✓'; color: var(--landing-accent); font-weight: 700; }
.product-tour__caret { display: inline-block; width: 2px; height: 1em; margin-left: var(--space-050); vertical-align: -.15em; background: var(--landing-accent); animation: caret-blink 640ms steps(1) infinite; }
@keyframes caret-blink { 50% { opacity: 0; } }
.product-tour__outro { margin-top: var(--space-300); color: var(--landing-muted); font-size: 13px; line-height: 1.5; }
.product-tour__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-200); margin-top: var(--space-500); }
.product-tour__steps { display: grid; gap: var(--space-100); margin: auto 0 0; padding: var(--space-500) 0 0; list-style: none; }
.product-tour__step { display: flex; align-items: center; gap: var(--space-300); width: 100%; min-height: 40px; padding: var(--space-200) var(--space-300); border: 0; border-radius: var(--radius-md); background: none; color: var(--landing-muted); font-size: 13px; text-align: left; }
.product-tour__step:hover { background: var(--landing-soft); }
.product-tour__step[aria-current] { background: var(--landing-white); color: var(--landing-ink); font-weight: 600; box-shadow: inset 0 0 0 1px var(--landing-line); }
.product-tour__number { color: var(--landing-accent); font-size: 11px; font-variant-numeric: tabular-nums; }
.product-tour[open] .product-tour__guide > * { animation: tour-in 480ms var(--ease-out) 160ms both; }
@keyframes tour-in { from { opacity: 0; transform: translateY(var(--space-300)); } }
@keyframes fact-in { from { opacity: 0; transform: translateY(var(--space-200)); } }
@keyframes tour-hop { 40% { transform: translateY(calc(-1 * var(--space-300))) scale(1.03, .97); } }

@media (max-width: 1050px) {
  .tour-hero__kpi--occupancy { left: calc(-1 * var(--space-400)); }
  .tour-hero__kpi--arrivals { right: calc(-1 * var(--space-300)); }
  .tour-hero__kpi--templates { right: calc(-1 * var(--space-300)); }
  .product-tour__window { grid-template-columns: minmax(0, 1fr) 320px; }
}
@media (max-width: 900px) {
  .product-tour { padding: 0; }
  .product-tour__window { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) auto; width: 100%; height: 100%; border-radius: 0; }
  .product-tour__stage { margin: var(--space-200) var(--space-200) 0; }
  .product-tour__guide { padding: var(--space-1200) var(--space-400) var(--space-400); overflow: visible; }
  .product-tour__close { position: fixed; top: var(--space-300); right: var(--space-300); z-index: 3; background: var(--landing-white); }
  .product-tour__lenzo { position: absolute; z-index: 2; top: calc(-1 * var(--space-200)); right: var(--space-400); width: 96px; margin: 0; }
  .product-tour__bubble { margin: 0; padding: var(--space-400); }
  .product-tour__bubble::before, .product-tour__steps { display: none; }
  .product-tour__bubble h2 { padding-right: 88px; font-size: 20px; }
  .product-tour__text { font-size: 13px; }
  .product-tour__facts { margin-top: var(--space-300); }
  .product-tour__actions { margin-top: var(--space-400); }
}
@media (max-width: 560px) {
  #main:is([data-route="booking"], [data-route="pms"]) .hero--product #mascot-stage:not(.chat-open) { padding-top: var(--space-1200); }
  .tour-hero__lean { width: 150px; right: var(--space-600); }
  .tour-hero--booking .tour-hero__lean { left: var(--space-600); }
  .tour-hero__bar { height: 28px; }
  .tour-hero__play { flex-basis: 28px; height: 28px; }
  .tour-hero__play::before { left: 11px; top: 8px; }
  .tour-hero__kpi { padding: var(--space-200) var(--space-300) var(--space-200) var(--space-200); column-gap: var(--space-200); }
  .tour-hero__kpi-icon { width: 28px; height: 28px; }
  .tour-hero__kpi b { font-size: 17px; }
  .tour-hero__kpi small { font-size: 10px; }
  .tour-hero__kpi--occupancy { left: calc(-1 * var(--space-100)); top: 36%; }
  .tour-hero__kpi--arrivals { right: calc(-1 * var(--space-100)); top: 24%; }
  .tour-hero__kpi--inhouse { left: 8%; bottom: calc(-1 * var(--space-400)); }
  .tour-hero__kpi--price { left: 2%; }
  .tour-hero__kpi--templates { right: calc(-1 * var(--space-100)); top: 22%; }
  .tour-hero__kpi--install { display: none; }
}

/* trial-request.css */
.trial-request { width: min(1040px, calc(100vw - var(--space-600))); max-width:calc(100vw - var(--space-600)); max-height: calc(100dvh - var(--space-600)); margin: auto; padding: var(--space-1200); border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-bg); color: var(--landing-ink); overflow-y: auto; overflow-x: hidden; }
.trial-request[open] { display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); align-items:center; gap:var(--space-1200); }
.trial-request::backdrop { background: color-mix(in srgb, var(--landing-ink) 55%, transparent); backdrop-filter: blur(8px); }
.trial-request-open { overflow: hidden; }
.trial-request__close { position: absolute; top: var(--space-300); right: var(--space-300); }
.trial-request__visual { display:flex; align-items:center; justify-content:center; }
.trial-request__lenzo { display: block; width: 400px; max-width: 100%; height: auto; margin:0; }
.trial-request__content { position:relative; width:100%; max-width:480px; padding:var(--space-800); border:1px solid var(--landing-line); border-radius:var(--radius-xl); background:var(--landing-white); }
.trial-request__content::before { content:''; position:absolute; left:-9px; top:var(--space-1200); width:16px; height:16px; background:var(--landing-white); border-left:1px solid var(--landing-line); border-bottom:1px solid var(--landing-line); transform:rotate(45deg); }
.trial-request h2 { text-align: left; font-size: 36px; line-height: 1.15; letter-spacing: -.03em; }
.trial-request__intro { margin-top: var(--space-300); text-align: left; color: var(--landing-muted); }
.trial-request__choice { display: grid; gap: var(--space-300); margin-top: var(--space-600); }
.trial-request__choice .btn { justify-content: center; min-height: 48px; }
.trial-request__choice .trial-request__google-button { position: relative; background: #fff; border: 1px solid #747775; color: #1f1f1f; font-size: 14px; font-weight: 500; border-radius: var(--radius-md); }
.trial-request__google { position: absolute; left: var(--space-300); width: 18px; height: 18px; object-fit: contain; }
.trial-request__note { font-size: 12px; line-height: 1.6; color: var(--landing-muted); }
.trial-request__choice .trial-request__note { text-align: center; }
.trial-request__activation { margin-top: var(--space-500); padding-top: var(--space-400); border-top: 1px solid var(--landing-line); font-size: 13px; line-height: 1.6; color: var(--landing-muted); text-align: center; }
.trial-request__form { display: grid; gap: var(--space-400); margin-top: var(--space-500); }
.trial-request__field { display: grid; gap: var(--space-200); font-size: 13px; font-weight: 600; }
.trial-request__field input { min-height: 44px; width: 100%; padding: var(--space-300); border: 1px solid var(--landing-line); border-radius: var(--radius-md); background: var(--landing-white); color: var(--landing-ink); font: inherit; }
.trial-request__field input[aria-invalid], .trial-request__privacy input[aria-invalid] { outline: 2px solid var(--bbr-red); outline-offset: 2px; }
.trial-request__privacy { display: flex; align-items: center; gap: var(--space-300); font-size: 13px; }
.trial-request__privacy input { width: 20px; height: 20px; accent-color: var(--landing-accent); }
.trial-request__privacy a { text-decoration: underline; }
.trial-request__actions { display: flex; justify-content: space-between; align-items: center; gap: var(--space-300); }
.trial-request__feedback { margin-top: var(--space-400); color: var(--bbr-red); font-size: 13px; }
.trial-request__done { margin: var(--space-500) auto 0; }
.trial-request__replay { display:flex; margin:var(--space-400) auto 0; justify-content:center; width:100%; }
.trial-request [hidden] { display: none !important; }
.trial-request__trap { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
@media (max-width: 720px) {
  .trial-request[open] {grid-template-columns:1fr;gap:var(--space-400);}
  .trial-request { padding: var(--space-600) var(--space-400); }
  .trial-request__lenzo { width: 200px; }
  .trial-request__content {max-width:none;padding:var(--space-500);}
  .trial-request__content::before {left:calc(50% - 8px);top:-9px;transform:rotate(135deg);}
  .trial-request h2 { font-size: 28px; }
  .trial-request__field input { font-size: 16px; }
  .trial-request__actions { flex-wrap: wrap; }
  .trial-request__actions .btn-primary { flex: 1; }
}

/* demo-form.css */
.demo-form {
  max-width: 880px;
  margin: 0 auto;
  padding: var(--space-1200);
  border: 1px solid var(--landing-line, var(--bbr-bd-default));
  border-radius: var(--radius-xl);
  background: var(--landing-white, var(--bbr-bg-surface));
  color: var(--landing-ink, var(--bbr-fg-primary));
  font-family: var(--bbr-font-sans);
  text-align: left;
}
.demo-form__steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-600); margin: 0 0 var(--space-1000); padding: 0; list-style: none; }
.demo-form__steps li { padding-bottom: var(--space-400); border-bottom: 2px solid var(--landing-line, var(--bbr-bd-default)); }
.demo-form__steps li[aria-current="step"] { border-color: var(--landing-accent, var(--bbr-accent)); }
.demo-form__steps .btn { justify-content: start; gap: var(--space-300); padding: 0; border: 0; font-size: 14px; min-height: 44px; background: transparent; }
.demo-form__step-number { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-full); background: var(--landing-soft, var(--bbr-bg-sunken)); color: var(--landing-muted, var(--bbr-fg-muted)); font-size: 11px; font-variant-numeric: tabular-nums; }
.demo-form__steps [aria-current="step"] .demo-form__step-number { background: var(--landing-accent, var(--bbr-accent)); color: var(--landing-on); }
.demo-form__panel { min-width: 0; margin: 0; padding: 0; border: 0; }
.demo-form__panel legend { width: 100%; padding: 0; font-size: 26px; font-weight: 600; line-height: 1.2; letter-spacing: -.035em; }
.demo-form__panel legend:focus { outline: none; }
.demo-form__intro { margin-top: var(--space-300); font-size: 14px; line-height: 1.6; color: var(--landing-muted, var(--bbr-fg-muted)); }
.demo-form__required { margin: var(--space-300) 0 var(--space-800); font-size: 11px; color: var(--landing-muted, var(--bbr-fg-muted)); }
.demo-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-600); }
.demo-form__field { min-width: 0; }
.demo-form__field--full { grid-column: 1 / -1; }
.demo-form__field label { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-200); margin-bottom: var(--space-200); font-size: 13px; font-weight: 600; }
.demo-form__optional { font-size: 11px; font-weight: 400; color: var(--landing-muted, var(--bbr-fg-muted)); }
.demo-form__field input, .demo-form__field select, .demo-form__field textarea {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: var(--space-300) var(--space-400);
  border: 1px solid var(--landing-line, var(--bbr-bd-default));
  border-radius: var(--radius-md);
  background: var(--landing-white, var(--bbr-bg-surface));
  color: var(--landing-ink, var(--bbr-fg-primary));
  font: inherit;
  font-size: 16px;
  line-height: 1.4;
}
.demo-form__field textarea { min-height: 120px; resize: vertical; }
.demo-form__field input::placeholder, .demo-form__field textarea::placeholder { color: var(--landing-muted, var(--bbr-fg-muted)); opacity: .8; }
.demo-form__field [aria-invalid="true"], .demo-form__privacy [aria-invalid="true"] { border-color: var(--bbr-red-fg); outline-color: var(--bbr-red-fg); }
.demo-form__hint { margin-top: var(--space-200); color: var(--landing-muted, var(--bbr-fg-muted)); font-size: 11px; line-height: 1.5; }
.demo-form__field-error { margin-top: var(--space-200); color: var(--bbr-red-fg); font-size: 12px; line-height: 1.5; }
.demo-form__privacy { margin-top: var(--space-800); }
.demo-form__privacy label { display: flex; align-items: start; gap: var(--space-300); min-height: 44px; font-size: 13px; line-height: 1.6; cursor: pointer; }
.demo-form__privacy input { flex: 0 0 20px; width: 20px; height: 20px; margin: var(--space-025) 0 0; accent-color: var(--landing-accent, var(--bbr-accent)); }
.demo-form a { color: var(--landing-accent, var(--bbr-accent)); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.demo-form__purpose { font-size: 11px; line-height: 1.6; color: var(--landing-muted, var(--bbr-fg-muted)); }
.demo-form__actions { display: flex; justify-content: space-between; align-items: center; gap: var(--space-400); margin-top: var(--space-800); }
.demo-form__actions .btn-primary { margin-left: auto; min-height: 48px; padding-inline: var(--space-600); }
.demo-form .btn:disabled { opacity: .55; cursor: default; filter: none; }
.demo-form__panel:disabled { opacity: .75; }
.demo-form__feedback, .demo-form__error-summary { margin: var(--space-600) 0; padding: var(--space-400) var(--space-500); border: 1px solid var(--landing-line, var(--bbr-bd-default)); border-radius: var(--radius-md); background: var(--landing-soft, var(--bbr-bg-sunken)); font-size: 13px; line-height: 1.6; }
.demo-form__feedback p + p { margin-top: var(--space-200); }
.demo-form__error-summary { margin-top: 0; color: var(--bbr-red-fg); border-color: var(--bbr-red-fg); }
.demo-form__error-summary p { font-weight: 600; }
.demo-form__error-summary ul { margin: var(--space-200) 0 0; padding-left: var(--space-500); }
.demo-form__error-summary a { color: inherit; }
.demo-form__success { padding: var(--space-800) 0; }
.demo-form__success h2 { max-width: 600px; font-size: clamp(28px, 4vw, 36px); }
.demo-form__success p { margin-top: var(--space-500); max-width: 600px; font-size: 15px; line-height: 1.7; color: var(--landing-muted, var(--bbr-fg-muted)); }
.demo-form__trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 680px) {
  .demo-form { padding: var(--space-600); border-radius: var(--radius-lg); }
  .demo-form__steps { gap: var(--space-400); margin-bottom: var(--space-800); }
  .demo-form__grid { grid-template-columns: 1fr; gap: var(--space-500); }
  .demo-form__panel legend { font-size: 24px; }
  .demo-form__actions .btn-primary { padding-inline: var(--space-400); }
}
@media (prefers-reduced-motion: reduce) {
  .demo-form *, .demo-form *::before, .demo-form *::after { animation: none !important; transition: none !important; }
}

/* language-picker.css */
.language-picker{position:relative;flex:0 0 auto}
.header-actions #language{min-height:44px;min-width:56px;padding:var(--space-200);gap:var(--space-150);border:0;background:transparent}
.language-trigger>img,.language-option>img{display:block;width:24px;height:16px;object-fit:contain;flex:0 0 24px}
.language-trigger>svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.language-options{position:absolute;top:calc(100% + var(--space-200));right:0;z-index:30;min-width:176px;padding:var(--space-200);border:1px solid var(--landing-line);border-radius:var(--radius-lg);background:var(--landing-white);box-shadow:var(--shadow-md)}
.header-actions .language-option{display:flex;width:100%;min-height:44px;justify-content:flex-start;gap:var(--space-300);padding:var(--space-200) var(--space-300);border:0;font-weight:400;font-size:13px}
.language-option[aria-checked="true"]{background:var(--landing-soft);font-weight:600}
.language-option[aria-checked="true"]::after{content:'✓';margin-left:auto;color:var(--landing-accent)}
.language-option:hover{background:var(--landing-soft)}
@media(max-width:560px){
  .header-actions #language{width:44px;min-width:44px;padding:var(--space-050);gap:var(--space-050)}
}

/* motion.css */
/* One motion language for the landing, on the product's own tokens (bbr-tokens):
   entrances with --ease-out, small feedback with --dur-fast/--dur-base, nothing that loops. */
:root { --site-header-h: 73px; scroll-padding-top: calc(var(--site-header-h) + 72px); }

/* Product families: one colour per family, the same in menu, filters, cards and paths. */
[data-family="operations"] { --family: var(--bbr-green); }
[data-family="revenue"] { --family: var(--bbr-blue); }
[data-family="guests"] { --family: var(--landing-accent); }
[data-family="intelligence"] { --family: var(--landing-ink); }
.home-pathways > article:nth-child(2) { --family: var(--bbr-blue); }
.home-pathways > article:nth-child(3) { --family: var(--landing-accent); }

/* Header always at hand; on small screens it steps aside while reading down. */
.site-header { position: sticky; top: 0; z-index: 30; background: color-mix(in srgb, var(--landing-bg) 94%, transparent); backdrop-filter: saturate(1.3) blur(10px); transition: box-shadow var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); }
.site-header[data-scrolled] { box-shadow: 0 10px 28px color-mix(in srgb, var(--landing-ink) 7%, transparent); }
[data-header-hidden] .site-header { transform: translateY(-100%); }

/* Feedback: a press is felt, an arrow points where the link goes. */
.btn { transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), filter var(--dur-base) var(--ease-out); }
.btn:active { transform: scale(.98); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 8px 20px color-mix(in srgb, var(--landing-accent) 26%, transparent); }
.btn-primary:active { transform: scale(.98); box-shadow: none; }
:is(.home-pathways article > a, .property-pathways article > a, .cta-actions .btn, .catalog-all-products, .product-card-action) svg { transition: transform var(--dur-base) var(--ease-out); }
:is(.home-pathways article > a, .property-pathways article > a, .cta-actions .btn, .catalog-all-products):hover svg { transform: translateX(3px); }
.product-card { transition: transform var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.product-card:hover { box-shadow: 0 14px 32px color-mix(in srgb, var(--landing-ink) 7%, transparent); }
.product-card[data-family] > h3::before { content: ''; display: inline-block; width: 8px; height: 8px; margin: 0 var(--space-200) 0 0; border-radius: var(--radius-full); background: var(--family); vertical-align: .18em; }
.product-card[data-family]:hover { border-color: var(--family); }
.catalog-filters [data-family]::before { content: ''; width: 8px; height: 8px; border-radius: var(--radius-full); background: var(--family); }
.catalog-filters [data-family][aria-pressed="true"]::before { background: currentColor; }
.catalog-menu-group[data-family] > h3 > svg { color: var(--family); }
.mega-menu .catalog-menu-link { transition: background-color var(--dur-fast) var(--ease-out); }
.product-frame img { transition: opacity var(--dur-slow) var(--ease-out); }

/* Four doors with their own colour; the AI one is dark and Lenzo looks out of it. */
.home-pathways > article { position: relative; overflow: hidden; border-top: 3px solid var(--family, var(--landing-line)); transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.home-pathways > article > svg { color: var(--family, var(--landing-accent)); }
.home-pathways > article:hover { transform: translateY(-4px); box-shadow: 0 16px 36px color-mix(in srgb, var(--landing-ink) 8%, transparent); }
.home-pathways > article[data-family="intelligence"] { background: var(--landing-ink); border-color: var(--landing-ink); color: var(--landing-bg); }
.home-pathways > article[data-family="intelligence"] > svg { color: color-mix(in srgb, var(--landing-accent) 55%, var(--landing-white)); }
.home-pathways > article[data-family="intelligence"] p { color: color-mix(in srgb, var(--landing-bg) 72%, var(--landing-ink)); }
.home-pathways > article[data-family="intelligence"] > a { color: color-mix(in srgb, var(--landing-accent) 45%, var(--landing-white)); }
.pathway-lenzo { position: absolute; right: -28px; top: -6px; width: 132px; height: auto; pointer-events: none; transform: rotate(-8deg); transform-origin: 50% 90%; transition: transform 420ms var(--ease-spring); }
.home-pathways > article:hover .pathway-lenzo { transform: rotate(-2deg) translateY(-6px); }

/* Index of a long page: follows the reader, says where they are. */
.page-toc { position: sticky; top: calc(var(--site-header-h) + var(--space-300)); z-index: 15; display: flex; align-items: center; gap: var(--space-300); width: fit-content; max-width: 100%; margin: 0 auto var(--space-1000); padding: var(--space-100); border: 1px solid var(--landing-line); border-radius: var(--radius-full); background: color-mix(in srgb, var(--landing-white) 90%, transparent); backdrop-filter: blur(10px); box-shadow: var(--shadow-md); transition: top var(--dur-slow) var(--ease-out); }
[data-header-hidden] .page-toc { top: var(--space-300); }
.page-toc__title { padding-left: var(--space-400); font-size: 13px; font-weight: 600; white-space: nowrap; }
.page-toc__links { display: flex; gap: var(--space-100); min-width: 0; overflow-x: auto; scrollbar-width: none; }
.page-toc__links::-webkit-scrollbar { display: none; }
.page-toc a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 var(--space-400); border-radius: var(--radius-full); font-size: 13px; font-weight: 500; color: var(--landing-muted); white-space: nowrap; transition: background-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out); }
.page-toc a:hover { color: var(--landing-ink); background: var(--landing-soft); }
.page-toc a[aria-current] { color: var(--landing-bg); background: var(--landing-ink); }
.editorial-page > section:focus { outline: none; }

/* FAQ answers open instead of appearing (browsers that can animate to auto height). */
@supports (interpolate-size: allow-keywords) {
  .faq-list { interpolate-size: allow-keywords; }
  .faq-list details::details-content { block-size: 0; overflow: clip; transition: block-size var(--dur-slow) var(--ease-out), content-visibility var(--dur-slow) allow-discrete; }
  .faq-list details[open]::details-content { block-size: auto; }
}
.faq-list summary::after { transition: transform var(--dur-base) var(--ease-out); }
.faq-list details[open] summary::after { transform: rotate(180deg); }
.faq-list summary:hover { color: var(--landing-accent); }

@media (max-width: 740px) {
  .page-toc { width: auto; margin-inline: calc(-1 * var(--space-100)); }
  .page-toc__title { display: none; }
  .page-toc a { min-height: 40px; padding-inline: var(--space-300); }
  .pathway-lenzo { width: 112px; right: -22px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-motion] .reveal:not(.is-revealed) { opacity: 1; }
  .site-header, .page-toc, .btn, .product-card, .home-pathways > article, .pathway-lenzo { transition: none; }
  [data-header-hidden] .site-header { transform: none; }
  .btn:active, .btn-primary:hover, .home-pathways > article:hover, .home-pathways > article:hover .pathway-lenzo { transform: none; }
}

@media (min-width: 741px) {
  .product-frame img[src*="/screens/home.jpg"], .product-frame img[src*="/screens/planner.jpg"] { aspect-ratio: 16 / 9; }
}

/* analytics-consent.css */
#analytics-consent { position: relative; z-index: 120; }
.analytics-consent-panel { position: fixed; inset: auto var(--space-400) var(--space-400); max-width: 720px; margin-inline: auto; padding: var(--space-600); border: 1px solid var(--landing-line); border-radius: var(--radius-xl); background: var(--landing-white); color: var(--landing-ink); box-shadow: var(--shadow-lg); max-height: calc(100dvh - var(--space-800)); overflow-y: auto; }
.analytics-consent-panel[hidden], .analytics-consent-preferences[hidden] { display: none; }
.analytics-consent-panel h2 { margin: 0 0 var(--space-300); font-size: var(--text-xl); font-weight: 600; line-height: 1.3; }
.analytics-consent-panel p { margin: 0 0 var(--space-300); font-size: var(--text-base); line-height: 1.6; color: var(--landing-muted); }
.analytics-consent-panel a { color: var(--landing-accent); text-decoration: underline; font-size: var(--text-base); }
.analytics-consent-panel .analytics-consent-state { margin-block: var(--space-300); font-size: var(--text-sm); }
.analytics-consent-actions { display: flex; flex-wrap: wrap; gap: var(--space-300); }
.analytics-consent-actions .btn { flex: 1; min-height: 44px; }
.analytics-consent-preferences { position: fixed; left: var(--space-400); bottom: var(--space-400); min-height: 44px; font-size: var(--text-sm); box-shadow: var(--shadow-sm); }
@media (max-width: 480px) { .analytics-consent-panel { padding: var(--space-400); } .analytics-consent-actions { flex-direction: column; } }

/* builder.css */
/* A small workspace for the property; shared landing tokens keep it in the brand. */
#main[data-route="builder"] .hero--utility{max-width:1320px;padding:var(--space-800) var(--space-600) var(--space-600);text-align:left}
#main[data-route="builder"] .hero-intro{max-width:none}
#main[data-route="builder"] .hero h1{font-size:clamp(36px,4.4vw,48px);line-height:1.08}
#main[data-route="builder"] .hero h1 br{display:none}
#main[data-route="builder"] .hero h1 em::before{content:" "}
#main[data-route="builder"] #hero-summary{max-width:none;margin-top:var(--space-400);font-size:var(--text-md);line-height:1.6}
#main[data-route="builder"] .trust-badges,#main[data-route="builder"] #eyebrow{display:none}
.nav-builder{display:inline-flex;align-items:center;gap:var(--space-100);white-space:nowrap}
.nav-builder__label{text-decoration:underline;text-underline-offset:var(--space-100)}
.nav-builder:hover,.nav-builder[aria-current="page"]{color:var(--landing-accent)}
.property-builder{max-width:1320px;margin:0 auto;padding:0 var(--space-600) var(--space-1600);color:var(--landing-ink)}
.builder-steps{border-block:1px solid var(--landing-line);margin-bottom:var(--space-600)}
.builder-steps ol{list-style:none;display:flex;align-items:stretch;justify-content:space-between;gap:var(--space-200);margin:0;padding:var(--space-300) 0}
.builder-steps li{min-width:0}
.builder-steps .btn{font-size:var(--text-sm);font-weight:500;padding:var(--space-200) var(--space-300);min-height:44px;gap:var(--space-200);color:var(--landing-muted)}
.builder-step-number{width:24px;height:24px;flex:0 0 24px;border:1px solid var(--landing-line);border-radius:var(--radius-full);display:grid;place-items:center;font-size:var(--text-xs)}
.builder-steps [aria-current="step"]{color:var(--landing-ink);font-weight:600;background:var(--landing-soft)}
.builder-steps [aria-current="step"] .builder-step-number{background:var(--landing-accent);border-color:var(--landing-accent);color:var(--landing-on)}
.builder-steps [data-completed="true"] .builder-step-number{border-color:var(--landing-accent);color:var(--landing-accent)}
.builder-layout{display:grid;grid-template-columns:minmax(340px,.9fr) minmax(0,1.2fr);gap:var(--space-1200);align-items:start}
.builder-controls{min-width:0;padding:var(--space-200) 0}
[data-builder-panel]{scroll-margin-top:160px}
.builder-panel-heading>p:first-child{font-size:var(--text-xs);font-weight:600;color:var(--landing-accent);margin-bottom:var(--space-300)}
.builder-panel-heading h2{font-size:clamp(24px,2.6vw,32px);line-height:1.2;letter-spacing:-.035em;font-weight:600}
.builder-panel-heading>p:last-child{margin-top:var(--space-300);font-size:var(--text-sm);line-height:1.6;color:var(--landing-muted)}
.builder-fields{display:grid;gap:var(--space-600);margin-top:var(--space-800)}
.builder-field{border:0;padding:0;margin:0;min-width:0}
.builder-field>legend,.builder-field>label{display:block;padding:0;margin-bottom:var(--space-300);font-size:var(--text-base);line-height:1.4;font-weight:600}
.builder-field>label small{font-size:var(--text-xs);font-weight:400;color:var(--landing-muted)}
.builder-field>small{display:block;margin-top:var(--space-200);font-size:var(--text-xs);line-height:1.5}
.builder-options{display:flex;flex-wrap:wrap;gap:var(--space-200)}
.builder-choice{display:inline-flex;align-items:center;gap:var(--space-200);min-height:40px;padding:var(--space-200) var(--space-300);border:1px solid var(--landing-line);border-radius:var(--radius-md);font-size:var(--text-sm);line-height:1.45;background:var(--landing-white);cursor:pointer;transition:background var(--dur-fast),border-color var(--dur-fast)}
.builder-choice:has(input:checked){background:var(--landing-soft);border-color:var(--landing-accent);color:var(--landing-ink)}
.builder-choice input,.builder-toggle input,.builder-type input{width:16px;height:16px;flex:0 0 16px;margin:0;accent-color:var(--landing-accent)}
.builder-choice:focus-within,.builder-type:focus-within,.builder-toggle:focus-within{outline:2px solid var(--landing-accent);outline-offset:var(--space-100)}
.builder-choice input:focus-visible,.builder-type input:focus-visible,.builder-toggle input:focus-visible{outline:none}
.builder-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-300)}
.builder-type{position:relative;display:grid;grid-template-columns:56px 1fr;gap:var(--space-200);align-items:center;min-height:96px;padding:var(--space-300);border:1px solid var(--landing-line);border-radius:var(--radius-lg);background:var(--landing-white);cursor:pointer;transition:background var(--dur-fast),border-color var(--dur-fast)}
.builder-type input{position:absolute;top:var(--space-200);right:var(--space-200)}
.builder-type img{width:64px;height:72px;object-fit:contain}
.builder-type>span{padding-right:var(--space-100)}
.builder-type strong{display:block;font-size:var(--text-base);line-height:1.3;font-weight:600}
.builder-type small{display:block;margin-top:var(--space-100);font-size:var(--text-xs);line-height:1.4}
.builder-type:has(input:checked){border-color:var(--landing-accent);background:var(--landing-soft)}
.builder-type:hover{border-color:var(--landing-accent)}
.builder-stars .builder-choice{padding-inline:var(--space-200);gap:var(--space-100)}
.builder-toggles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-200) var(--space-400)}
.builder-toggle{display:flex;align-items:center;gap:var(--space-300);min-height:40px;cursor:pointer;font-size:var(--text-sm);line-height:1.5}
.builder-field>input[type="text"]{width:100%;min-height:44px;padding:var(--space-300) var(--space-400);border:1px solid var(--landing-line);border-radius:var(--radius-md);background:var(--landing-white);color:var(--landing-ink);font-size:var(--text-base)}
.builder-number-row{display:flex;align-items:center;gap:var(--space-400)}
.builder-number-row>input[type="range"]{min-width:0;flex:1;height:32px;margin:0;accent-color:var(--landing-accent);cursor:pointer}
.builder-number{display:inline-flex;align-items:center;gap:var(--space-200);font-size:var(--text-xs);color:var(--landing-muted);flex:none}
.builder-number input{width:76px;min-height:44px;border:1px solid var(--landing-line);border-radius:var(--radius-md);background:var(--landing-white);color:var(--landing-ink);padding:var(--space-200);text-align:center;font-size:var(--text-base);font-variant-numeric:tabular-nums}
.builder-navigation{display:flex;justify-content:space-between;align-items:center;gap:var(--space-400);margin-top:var(--space-600);padding-top:var(--space-400);border-top:1px solid var(--landing-line)}
.builder-navigation>[data-builder-next]{margin-left:auto}
.builder-preview{position:sticky;top:120px;min-width:0;padding:var(--space-600);background:var(--landing-soft);border-radius:var(--radius-xl)}
.builder-preview-heading{display:flex;align-items:start;justify-content:space-between;gap:var(--space-400)}
.builder-preview-heading>div{min-width:0}
.builder-preview-heading p{font-size:var(--text-xs);color:var(--landing-muted);margin-bottom:var(--space-100)}
.builder-preview-heading h2{font-size:var(--text-xl);line-height:1.3;letter-spacing:-.025em;overflow-wrap:anywhere}
.builder-preview-heading span{display:block;font-size:var(--text-xs);color:var(--landing-muted);margin-top:var(--space-100)}
.builder-preview-heading>.btn{font-size:var(--text-xs);padding:var(--space-100) var(--space-200);min-height:32px;color:var(--landing-muted);flex:none}
.builder-canvas-wrap{position:relative;width:100%;aspect-ratio:1.4;min-height:0;isolation:isolate}
.builder-canvas-wrap canvas,.builder-canvas-wrap>img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;pointer-events:none}
.builder-canvas-wrap>img{padding:var(--space-400)}
.property-builder[data-scene="loading"] .builder-canvas-wrap>img{opacity:.45}
.builder-model-feedback{font-size:var(--text-xs);line-height:1.6;color:var(--landing-muted)}
.builder-model-feedback>.btn{padding:var(--space-200) 0;color:var(--landing-accent);font-size:var(--text-sm)}
.builder-model-feedback>p:empty{display:none}
.builder-preview-note{margin-top:var(--space-200);font-size:var(--text-xs);line-height:1.5;color:var(--landing-muted);text-align:center}
.builder-reset-confirm{margin-top:var(--space-500);padding-top:var(--space-500);border-top:1px solid var(--landing-line);font-size:var(--text-sm)}
.builder-reset-confirm>div{display:flex;gap:var(--space-200);margin-top:var(--space-300)}
.builder-summary{margin:var(--space-600) 0 var(--space-800);font-size:var(--text-sm);line-height:1.6}
.builder-summary>div{display:grid;grid-template-columns:minmax(112px,.65fr) minmax(0,1fr);gap:var(--space-500);padding:var(--space-300) 0;border-bottom:1px solid var(--landing-line)}
.builder-summary dt{color:var(--landing-muted)}
.builder-summary dd{margin:0;overflow-wrap:anywhere;font-weight:500}
.builder-demo{width:100%}
.builder-noscript{padding:var(--space-500);margin-top:var(--space-600);background:var(--landing-soft);font-size:var(--text-sm)}
.builder-noscript a{color:var(--landing-accent);text-decoration:underline}
@media(min-width:981px) and (max-width:1240px){.site-header:has(.nav-builder){column-gap:var(--space-400)}.site-header:has(.nav-builder)>nav{gap:var(--space-300);font-size:var(--text-sm)}.nav-builder{font-size:var(--text-xs)}}
@media(max-width:1080px){.builder-layout{grid-template-columns:minmax(320px,1fr) minmax(0,1fr);gap:var(--space-800)}.builder-steps .btn{padding-inline:var(--space-200)}.builder-preview{padding:var(--space-500)}.builder-type{grid-template-columns:44px 1fr;padding:var(--space-300) var(--space-200)}.builder-type img{width:48px}}
@media(max-width:800px){.builder-steps{overflow-x:auto;scrollbar-width:thin}.builder-steps ol{width:max-content;min-width:100%;gap:var(--space-200)}.builder-steps .btn{padding-inline:var(--space-300)}.builder-layout{grid-template-columns:1fr;gap:var(--space-600)}.builder-preview{position:relative;top:auto;grid-row:1;padding:var(--space-400);display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,1fr);align-items:center;column-gap:var(--space-200)}.builder-preview-heading{flex-direction:column;gap:var(--space-100)}.builder-canvas-wrap{grid-column:2;grid-row:1/3;aspect-ratio:1.15}.builder-preview-note{grid-column:1;text-align:left;margin-top:var(--space-300)}.builder-model-feedback,.builder-reset-confirm{grid-column:1/-1}.builder-model-feedback:not(:has(p:empty)){margin-top:var(--space-300)}.builder-fields{margin-top:var(--space-600)}.builder-type-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.builder-type{grid-template-columns:1fr;text-align:center;gap:var(--space-100);padding:var(--space-400) var(--space-200)}.builder-type img{width:80px;height:72px;margin:auto}.builder-type>span{padding:0}}
@media(max-width:560px){#main[data-route="builder"] .hero--utility{padding:var(--space-800) var(--space-500) var(--space-600)}#main[data-route="builder"] .hero h1{font-size:36px}.property-builder{padding:0 var(--space-500) var(--space-1000)}.builder-steps{margin-bottom:var(--space-500)}.builder-steps .btn{font-size:var(--text-xs)}.builder-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.builder-type{grid-template-columns:48px 1fr;text-align:left;min-height:104px;padding:var(--space-300) var(--space-200);gap:var(--space-200)}.builder-type img{width:56px;height:64px}.builder-type strong{font-size:var(--text-sm)}.builder-preview{grid-template-columns:minmax(0,.8fr) minmax(140px,1fr);padding:var(--space-300)}.builder-preview-heading h2{font-size:var(--text-lg)}.builder-preview-note{font-size:var(--text-xs)}.builder-panel-heading h2{font-size:26px}.builder-number input,.builder-field>input[type="text"]{font-size:16px}.builder-choice{min-height:44px}.builder-summary>div{grid-template-columns:1fr;gap:var(--space-100)}.builder-toggles{column-gap:var(--space-200)}.site-header>nav .nav-builder{font-size:var(--text-sm)}}
@media(prefers-reduced-motion:reduce){.builder-choice,.builder-type{transition:none}}