/* ============ Tokens ============ */
:root{
  --bg:#EDE7DE; --bg-2:#E4DED4; --surface:#FBF8F4; --surface-2:#F3EEE7;
  --ink:#1B1B1F; --ink-2:#55504B; --ink-3:#6E6862;
  --line:rgba(27,27,31,.10); --line-strong:rgba(27,27,31,.24);
  --encre:#1B1B1F; --acid:#C8FF2E; --nude:#EDE7DE; --paper:#FBF8F4;
  --lagoon:#1B1B1F; --lagoon-2:#2A2A2E; --lagoon-ink:#EDE7DE; --lagoon-mute:#9A948C;
  --brass:#1B1B1F; --brass-2:#C8FF2E; --brass-ink:#1B1B1F;
  --rose:#F3EEE7; --rose-ink:#55504B;
  --cyan:#C8FF2E; --indigo:#55504B; --violet:#6E6862; --pink:#C8FF2E;
  --spectrum:#C8FF2E;
  --sky-1:#F3EEE7; --sky-2:#E4DED4;
  --shadow:0 18px 44px -26px rgba(27,27,31,.42);
  --radius:4px;
  --font-display:"Cormorant Garamond","Hoefler Text",Garamond,serif;
  --font-body:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif;
  --font-script:"Mrs Saint Delafield","Snell Roundhand",cursive;
  --font-label:"Jost",Futura,"Century Gothic",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#1B1B1F; --bg-2:#232327; --surface:rgba(251,248,244,.05); --surface-2:#2A2A2E;
    --ink:#EDE7DE; --ink-2:#B8B2AA; --ink-3:#9A948C;
    --line:rgba(237,231,222,.14); --line-strong:rgba(237,231,222,.30);
    --encre:#1B1B1F; --acid:#C8FF2E; --nude:#EDE7DE; --paper:#FBF8F4;
    --lagoon:#1B1B1F; --lagoon-2:#2A2A2E; --lagoon-ink:#EDE7DE; --lagoon-mute:#9A948C;
    --brass:#C8FF2E; --brass-2:#C8FF2E; --brass-ink:#1B1B1F;
    --rose:#2A2A2E; --rose-ink:#EDE7DE;
    --cyan:#C8FF2E; --indigo:#9A948C; --violet:#B8B2AA; --pink:#C8FF2E;
    --spectrum:#C8FF2E;
    --sky-1:#2A2A2E; --sky-2:#1B1B1F;
    --shadow:0 18px 44px -26px rgba(0,0,0,.8);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#1B1B1F; --bg-2:#232327; --surface:rgba(251,248,244,.05); --surface-2:#2A2A2E;
  --ink:#EDE7DE; --ink-2:#B8B2AA; --ink-3:#9A948C;
  --line:rgba(237,231,222,.14); --line-strong:rgba(237,231,222,.30);
  --encre:#1B1B1F; --acid:#C8FF2E; --nude:#EDE7DE; --paper:#FBF8F4;
  --lagoon:#1B1B1F; --lagoon-2:#2A2A2E; --lagoon-ink:#EDE7DE; --lagoon-mute:#9A948C;
  --brass:#C8FF2E; --brass-2:#C8FF2E; --brass-ink:#1B1B1F;
  --rose:#2A2A2E; --rose-ink:#EDE7DE;
  --cyan:#C8FF2E; --indigo:#9A948C; --violet:#B8B2AA; --pink:#C8FF2E;
  --spectrum:#C8FF2E;
  --sky-1:#2A2A2E; --sky-2:#1B1B1F;
  --shadow:0 18px 44px -26px rgba(0,0,0,.8);
  color-scheme:dark;
}

/* ============ Base ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;line-height:1.05;margin:0 0 .5em;text-wrap:balance;letter-spacing:-.005em}
h1{font-size:clamp(2.6rem,6.2vw,5.4rem)}
h2{font-size:clamp(2rem,4vw,3.3rem)}
h3{font-size:clamp(1.35rem,2vw,1.8rem)}
h4{font-size:1.15rem;font-family:var(--font-body);font-weight:600}
em,.it{font-style:italic}
.display-it{font-family:var(--font-display);font-style:italic;font-weight:400}
.eyebrow{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin:0 0 1rem}
.lead{font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.5;color:var(--ink-2);max-width:62ch}
.muted{color:var(--ink-2)}
.small{font-size:.9rem}
.tabular{font-variant-numeric:tabular-nums}
.skip{position:absolute;left:1rem;top:0;transform:translateY(-150%);background:var(--brass);color:var(--brass-ink);padding:.5rem 1rem;z-index:100}
.skip:focus{left:1rem;top:1rem;transform:translateY(0)}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.wrap{width:min(1180px,100% - 3rem);margin-inline:auto}
.section{padding:clamp(3.5rem,8vw,7rem) 0}
.section-tight{padding:clamp(2.5rem,5vw,4rem) 0}
.section-head{display:grid;gap:.5rem;max-width:56ch;margin-bottom:clamp(2rem,4vw,3rem)}
.band{background:var(--lagoon);color:var(--lagoon-ink)}
.band .eyebrow{color:var(--lagoon-mute)}
.band .lead,.band .muted{color:var(--lagoon-mute)}
.band-soft{background:var(--bg-2)}
.rule{border:0;border-top:1px solid var(--line);margin:0}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.35rem;border-radius:999px;border:1px solid var(--line-strong);font-weight:600;font-size:.95rem;line-height:1;cursor:pointer;background:transparent;color:inherit;transition:transform .15s ease,background .2s ease,border-color .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn-solid{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.band .btn-solid{background:var(--brass);color:var(--brass-ink);border-color:var(--brass)}
.btn-brass{background:var(--brass);color:var(--brass-ink);border-color:var(--brass)}
.btn-ghost{border-color:var(--line-strong)}
.band .btn-ghost{border-color:rgba(237,231,222,.4);color:var(--lagoon-ink)}
.btn-sm{padding:.6rem 1rem;font-size:.85rem}
.btn-link{border:0;padding:0;background:none;text-decoration:underline;text-underline-offset:4px;font-weight:600;cursor:pointer;color:inherit}
.btn-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}

/* ============ Topbar ============ */
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem clamp(1rem,3vw,2.5rem);background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.wordmark{display:flex;align-items:center;gap:.7rem}
.wordmark-name{font-family:var(--font-display);font-size:1.25rem;letter-spacing:.01em;margin:0}
.wordmark-sub{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.logo-mark{width:34px;height:34px;flex:none}
.nav{display:flex;gap:.2rem;flex-wrap:wrap}
.nav a{padding:.5rem .7rem;border-radius:999px;font-size:.9rem;font-weight:500;color:var(--ink-2)}
.nav a:hover{color:var(--ink);background:var(--bg-2)}
.nav a[aria-current="page"]{color:var(--ink);background:var(--bg-2)}
.nav a .dot{color:var(--brass);font-weight:700}
.topbar-tools{display:flex;align-items:center;gap:.8rem}
.lang{display:flex;align-items:center;gap:.1rem;font-size:.8rem;font-weight:600;letter-spacing:.06em}
.lang-btn{background:none;border:0;padding:.3rem .35rem;cursor:pointer;color:var(--ink-3);font:inherit;border-radius:4px}
.lang-btn[aria-pressed="true"]{color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--brass)}
.lang-sep{color:var(--ink-3)}
.burger{display:none;width:40px;height:40px;border:1px solid var(--line-strong);border-radius:999px;background:none;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.burger span{display:block;width:16px;height:1.5px;background:var(--ink)}
@media (max-width:980px){
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;background:var(--bg);border-bottom:1px solid var(--line);padding:1rem clamp(1rem,3vw,2.5rem) 1.5rem}
  .nav.open{display:flex}
  .burger{display:flex}
  .wordmark-sub{display:none}
  .topbar .btn-sm{display:none}
}

/* ============ Hero ============ */
.hero{position:relative;overflow:hidden;padding:clamp(3rem,7vw,6.5rem) 0 clamp(2.5rem,5vw,4.5rem)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr);gap:clamp(2rem,5vw,5rem);align-items:end}
.hero h1{margin-bottom:.4em}
.hero h1 .line2{display:block;font-style:italic;font-weight:400;color:var(--ink-2)}
.hero-side{display:grid;gap:1.2rem;align-content:end}
.hero-langs{display:flex;gap:.5rem;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .7rem;border:1px solid var(--line);border-radius:999px;font-size:.8rem;font-weight:600;letter-spacing:.04em;color:var(--ink-2);background:var(--surface)}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--brass);display:inline-block}
.hero-glyph{position:absolute;right:-6vw;top:-4vw;width:min(52vw,640px);opacity:.09;pointer-events:none}
@media (max-width:820px){.hero-grid{grid-template-columns:1fr}.hero-glyph{width:80vw;right:-25vw;top:-8vw;opacity:.07}}

/* Doors */
.doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(2rem,4vw,3.5rem)}
.door{display:grid;gap:.6rem;background:var(--bg);padding:1.6rem 1.5rem;text-align:left;cursor:pointer;border:0;font:inherit;color:inherit;transition:background .2s ease}
.door:hover{background:var(--surface-2)}
.door .eyebrow{margin:0}
.door strong{font-family:var(--font-display);font-size:1.45rem;font-weight:500;line-height:1.1}
.door span{color:var(--ink-2);font-size:.95rem}
.door .arrow{color:var(--brass);font-weight:700;justify-self:start;margin-top:.3rem}
@media (max-width:820px){.doors{grid-template-columns:1fr}}

/* ============ Grids & cards ============ */
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem}
@media (max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.grid-3,.grid-2,.grid-4{grid-template-columns:1fr}}
.outcome{display:grid;gap:.5rem;padding-top:1.2rem;border-top:1px solid var(--line-strong)}
.outcome h3{font-size:1.5rem;margin:0}
.outcome p{margin:0;color:var(--ink-2)}
.band .outcome{border-top-color:rgba(237,231,222,.3)}
.band .outcome p{color:var(--lagoon-mute)}

.chain{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:1.5rem 0 0}
.chain li{list-style:none;display:flex;align-items:center;gap:.6rem;font-family:var(--font-display);font-size:clamp(1.3rem,2.4vw,2rem)}
.chain li+li::before{content:"→";color:var(--brass);font-family:var(--font-body);font-size:1rem}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;display:grid;gap:.8rem;align-content:start}
.card h3{margin:0}
.card p{margin:0;color:var(--ink-2)}
.card .meta{display:flex;justify-content:space-between;gap:1rem;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.card .price{font-family:var(--font-display);font-size:1.6rem;color:var(--ink);font-variant-numeric:tabular-nums}
.card ul{margin:0;padding-left:1.1rem;color:var(--ink-2);display:grid;gap:.25rem}
.card.featured{border-color:var(--brass);box-shadow:var(--shadow)}
.tag{display:inline-block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--brass);justify-self:start}
.note{font-size:.9rem;color:var(--ink-3);max-width:70ch}

/* Offer table */
.modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);background:var(--line);gap:1px}
.mode{background:var(--bg);padding:1.5rem;display:grid;gap:.5rem;align-content:start}
.mode h3{font-size:1.4rem;margin:0}
.mode p{margin:0;color:var(--ink-2)}
@media (max-width:820px){.modes{grid-template-columns:1fr}}

/* Method steps */
.steps{display:grid;gap:0;counter-reset:step}
.step{display:grid;grid-template-columns:5rem minmax(0,1fr) minmax(0,1fr);gap:1.5rem;padding:1.8rem 0;border-top:1px solid var(--line);align-items:start}
.step:last-child{border-bottom:1px solid var(--line)}
.step .num{font-family:var(--font-display);font-size:2.4rem;line-height:1;color:var(--brass);font-variant-numeric:tabular-nums}
.step h3{margin:0 0 .3rem}
.step p{margin:0;color:var(--ink-2)}
.step .get{font-size:.95rem}
.step .get strong{display:block;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.3rem}
@media (max-width:820px){.step{grid-template-columns:3rem minmax(0,1fr)}.step .get{grid-column:2}}

/* Checklist */
.checklist{display:grid;gap:0;margin:0;padding:0;counter-reset:q}
.checklist li{list-style:none;display:grid;grid-template-columns:2.2rem minmax(0,1fr);gap:1rem;padding:1rem 0;border-top:1px solid var(--line);font-size:1.05rem}
.checklist li::before{counter-increment:q;content:counter(q,decimal-leading-zero);font-family:var(--font-display);color:var(--brass);font-size:1.2rem}
.checklist li:last-child{border-bottom:1px solid var(--line)}

/* Journey (experience arc) */
.arc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.arc div{background:var(--bg);padding:1.4rem 1.2rem;display:grid;gap:.4rem}
.arc strong{font-family:var(--font-display);font-size:1.35rem;font-weight:500}
.arc span{color:var(--ink-2);font-size:.95rem}
@media (max-width:820px){.arc{grid-template-columns:repeat(2,1fr)}}

/* ============ Prototypes ============ */
.proto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem;padding:2.2rem 0;border-top:1px solid var(--line);align-items:start}
.proto:last-of-type{border-bottom:1px solid var(--line)}
.proto .screens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.screen{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:.8rem;min-height:120px;display:grid;gap:.35rem;align-content:start;font-size:.78rem;color:var(--ink-2)}
.screen b{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.screen .bar{height:6px;border-radius:3px;background:var(--bg-2)}
.screen .bar.brass{background:var(--brass);width:60%}
.screen .pill{display:inline-block;padding:.15rem .5rem;border:1px solid var(--line);border-radius:999px;font-size:.7rem;justify-self:start}
@media (max-width:820px){.proto{grid-template-columns:1fr}}

/* Mini demo */
.demo{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:1.5rem;display:grid;gap:1.2rem;box-shadow:var(--shadow)}
.demo-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.demo-head h3{margin:0}
.demo-steps{display:flex;gap:.4rem}
.demo-steps span{width:28px;height:4px;border-radius:2px;background:var(--bg-2)}
.demo-steps span.on{background:var(--brass)}
.opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.6rem}
.opt{border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:.9rem;text-align:left;font:inherit;color:inherit;cursor:pointer;display:grid;gap:.2rem;transition:border-color .15s ease,transform .15s ease}
.opt:hover{border-color:var(--line-strong);transform:translateY(-1px)}
.opt[aria-pressed="true"]{border-color:var(--brass);box-shadow:inset 0 0 0 1px var(--brass)}
.opt small{color:var(--ink-3)}
.opt .sw{width:100%;height:34px;border-radius:6px;margin-bottom:.3rem}
.demo-result{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;align-items:start}
.mood{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.mood div{aspect-ratio:1;border-radius:8px}
.brief{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:1rem;font-size:.92rem;white-space:pre-wrap;color:var(--ink-2);max-height:260px;overflow:auto}
@media (max-width:700px){.demo-result{grid-template-columns:1fr}}

/* ============ Journey widget ============ */
.journey{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:clamp(1.3rem,3vw,2.2rem);display:grid;gap:1.4rem;box-shadow:var(--shadow)}
.journey-q{display:grid;gap:.8rem}
.journey-q h3{margin:0;font-size:1.5rem}
.journey-progress{display:flex;gap:.4rem;align-items:center;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.journey-progress i{width:26px;height:3px;background:var(--bg-2);border-radius:2px;display:inline-block}
.journey-progress i.on{background:var(--brass)}
.reco{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:1.5rem}
.reco-main{display:grid;gap:.8rem}
.reco-main h3{margin:0;font-size:1.9rem}
.reco-main .price{font-family:var(--font-display);font-size:1.4rem}
.reco-path{display:grid;gap:.5rem;padding-left:0;margin:0}
.reco-path li{list-style:none;display:grid;grid-template-columns:1.6rem 1fr;gap:.6rem;font-size:.95rem;color:var(--ink-2)}
.reco-path li b{font-family:var(--font-display);color:var(--brass)}
.reco-side{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:1.1rem;display:grid;gap:.6rem;align-content:start}
.reco-side .brief{max-height:200px}
@media (max-width:760px){.reco{grid-template-columns:1fr}}

/* ============ Events ============ */
.ev{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:2rem;padding:2rem 0;border-top:1px solid rgba(237,231,222,.25)}
.ev:last-of-type{border-bottom:1px solid rgba(237,231,222,.25)}
.ev h3{margin:0;font-size:1.8rem}
.ev .ev-kicker{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lagoon-mute);margin-bottom:.4rem;font-weight:600}
.ev p{margin:0;color:var(--lagoon-mute)}
.ev ul{margin:.6rem 0 0;padding-left:1.1rem;color:var(--lagoon-ink);display:grid;gap:.3rem}
.ev .soon{display:inline-block;margin-left:.4rem;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--brass);font-weight:700;vertical-align:middle}
@media (max-width:760px){.ev{grid-template-columns:1fr}}
.concepts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.concept{border:1px solid rgba(237,231,222,.25);border-radius:10px;padding:1.2rem;display:grid;gap:.4rem;background:rgba(255,255,255,.03)}
.concept strong{font-family:var(--font-display);font-size:1.4rem;font-weight:500}
.concept span{color:var(--lagoon-mute);font-size:.95rem}
@media (max-width:820px){.concepts{grid-template-columns:1fr}}

/* ============ About + logo system ============ */
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.about .portrait{aspect-ratio:4/5;border-radius:12px;background:linear-gradient(160deg,var(--rose),var(--bg-2));display:grid;place-items:center;position:relative;overflow:hidden;border:1px solid var(--line)}
.about .portrait svg{width:60%}
.about .portrait span{position:absolute;bottom:1rem;left:1rem;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.beliefs{display:grid;gap:0;margin:1.5rem 0 0}
.beliefs div{padding:1rem 0;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:1rem}
.beliefs strong{font-family:var(--font-display);font-weight:500;font-size:1.2rem}
.beliefs span{color:var(--ink-2)}
@media (max-width:820px){.about{grid-template-columns:1fr}.about .portrait{max-width:360px}}

.logosys{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.logo-tile{border:1px solid var(--line);border-radius:10px;padding:1.2rem;display:grid;gap:.8rem;align-content:space-between;min-height:180px;background:var(--surface)}
.logo-tile.dark{background:var(--lagoon);color:var(--lagoon-ink);border-color:transparent}
.logo-tile.brass{background:var(--brass);color:var(--brass-ink);border-color:transparent}
.logo-tile.rose{background:var(--rose);color:var(--rose-ink);border-color:transparent}
.logo-tile small{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.75;font-weight:600}
.logo-tile .lock{font-family:var(--font-display);font-size:1.8rem;line-height:1}
.logo-tile .lock i{font-style:italic;font-weight:400;opacity:.8}
.logo-tile .lock .dot{color:var(--brass)}
.logo-tile.brass .lock .dot,.logo-tile.dark .lock .dot{color:currentColor}
.logo-tile svg{width:56px;height:56px}
@media (max-width:900px){.logosys{grid-template-columns:repeat(2,1fr)}}

.naming{display:grid;gap:1rem}
.naming table{width:100%;border-collapse:collapse;font-size:.95rem}
.naming th,.naming td{text-align:left;padding:.7rem .6rem;border-top:1px solid var(--line);vertical-align:top}
.naming th{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.naming td .dot{color:var(--brass);font-weight:700}
.naming code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;background:var(--bg-2);padding:.1rem .4rem;border-radius:4px}
.table-scroll{overflow-x:auto}
.switch{display:inline-flex;border:1px solid var(--line-strong);border-radius:999px;padding:3px;gap:2px}
.switch button{border:0;background:none;font:inherit;font-size:.85rem;font-weight:600;padding:.45rem .9rem;border-radius:999px;cursor:pointer;color:var(--ink-2)}
.switch button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.band .switch button[aria-pressed="true"]{background:var(--brass);color:var(--brass-ink)}

/* ============ Contact ============ */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.form{display:grid;gap:1rem}
.field{display:grid;gap:.35rem}
.field label{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.field input,.field select,.field textarea{font:inherit;padding:.8rem .9rem;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--brass);outline-offset:1px;border-color:transparent}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.contact-side{display:grid;gap:1.4rem}
.contact-side .card{gap:.5rem}
.what{display:grid;gap:.5rem;padding-left:0;margin:0}
.what li{list-style:none;display:grid;grid-template-columns:1.4rem 1fr;gap:.5rem;color:var(--ink-2)}
.what li::before{content:"·";color:var(--brass);font-weight:700;font-size:1.4rem;line-height:1}
.status{font-size:.9rem;color:var(--ink-2);min-height:1.4em}
.ig{display:inline-flex;align-items:center;gap:.4rem;font-size:.9rem;color:var(--ink-2)}
.ig svg{width:16px;height:16px}
@media (max-width:820px){.contact{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}}

/* Page head */
.page-head{padding:clamp(3rem,6vw,5rem) 0 clamp(1.5rem,3vw,2.5rem)}
.page-head h1{font-size:clamp(2.4rem,5.5vw,4.6rem)}
.page-head .lead{margin-top:.5rem}
.page-head .handle{margin-top:1rem}

/* Footer */
.footer{border-top:1px solid var(--line);padding:3rem 0 6rem;background:var(--bg-2)}
.footer-inner{width:min(1180px,100% - 3rem);margin-inline:auto;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:2rem}
.footer-line{color:var(--ink-2);max-width:36ch;font-size:.95rem}
.footer-nav{display:grid;gap:.3rem;align-content:start}
.footer-nav a{color:var(--ink-2);font-size:.95rem}
.footer-nav a .dot{color:var(--brass);font-weight:700}
.footer-link{font-weight:600}
.footer-note{font-size:.82rem;color:var(--ink-3)}
@media (max-width:820px){.footer-inner{grid-template-columns:1fr}}

.sticky-cta{position:fixed;left:0;right:0;bottom:0;padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom));display:none;justify-content:center;background:linear-gradient(to top,var(--bg) 60%,transparent);z-index:40}
@media (max-width:820px){.sticky-cta{display:flex}}

/* Page transition */
.page{min-height:60vh}
.page > .view{animation:fadeUp .45s ease both}
@keyframes fadeUp{from{opacity:.001;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ============ The Studio (immersive scene) ============ */
.studio-scene{width:100vw;margin-left:calc(50% - 50vw);overflow:clip}
.studio-stage{position:relative;height:min(88vh,900px);min-height:520px;background:#0E1630;overflow:hidden;outline:none}
.studio-scene.compact .studio-stage{height:min(78vh,760px)}
.studio-stage .building{position:absolute;inset:0;width:100%;height:100%;display:block}
.studio-hint{position:absolute;left:50%;bottom:1.2rem;transform:translateX(-50%);margin:0;display:flex;align-items:center;gap:.6rem;padding:.55rem 1rem;border-radius:999px;background:rgba(27,27,31,.72);backdrop-filter:blur(8px);color:#EDE7DE;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;pointer-events:none;white-space:nowrap}
.studio-hint .pulse{width:8px;height:8px;border-radius:50%;background:#FFD68C;box-shadow:0 0 0 0 rgba(200,255,46,.7);animation:pulse 1.8s ease-out infinite}
@keyframes pulse{to{box-shadow:0 0 0 12px rgba(200,255,46,0)}}
.studio-legend{position:absolute;right:1rem;top:50%;transform:translateY(-50%);display:grid;gap:.35rem}
.studio-legend button{display:flex;align-items:center;gap:.5rem;border:0;background:rgba(27,27,31,.6);backdrop-filter:blur(6px);color:#E9EFEA;font:inherit;font-size:.72rem;font-weight:600;letter-spacing:.06em;padding:.35rem .6rem .35rem .45rem;border-radius:999px;cursor:pointer;opacity:.85;transition:opacity .2s,transform .2s}
.studio-legend button i{width:9px;height:9px;border-radius:50%;background:var(--c);display:inline-block}
.studio-legend button:hover,.studio-legend button.on{opacity:1;transform:translateX(-3px);outline:1px solid var(--c)}
.floor{cursor:pointer;transition:opacity .5s ease}
.floor .ring{opacity:0;transition:opacity .25s ease}
.floor .tag-num{opacity:.75;transition:opacity .25s ease}
.floor:hover .ring,.floor:focus-visible .ring{opacity:1}
.floor:hover .tag-num{opacity:1}
.floor:focus{outline:none}
.building.zoomed .floor:not(.on){opacity:.5}
.building.zoomed .floor.on .ring,.building.zoomed .floor.on .tag-num,.building.zoomed .floor.on .glass{opacity:0}
.building.zoomed .floor.on{cursor:default}
.hud{position:absolute;inset:0;pointer-events:none;display:grid;grid-template-rows:auto 1fr auto;padding:clamp(1rem,2.5vw,2rem);color:#F4F1EA;--acc:#FFD68C}
.hud > *{pointer-events:auto}
.hud-top{max-width:34ch;background:rgba(27,27,31,.62);backdrop-filter:blur(10px);border-left:3px solid var(--acc);padding:1rem 1.2rem;border-radius:0 12px 12px 0;justify-self:start;animation:hudIn .5s ease both}
.hud-top .eyebrow{color:var(--acc);margin:0 0 .3rem}
.hud-top h3{margin:0 0 .4rem;font-size:clamp(1.5rem,2.6vw,2.2rem);color:#fff}
.hud-text{margin:0;font-size:.95rem;color:#D8D6CE}
.hud-bottom{align-self:end;justify-self:start;max-width:46ch;background:rgba(27,27,31,.66);backdrop-filter:blur(10px);padding:1rem 1.2rem;border-radius:12px;display:grid;gap:.6rem;animation:hudIn .5s ease .15s both}
.hud .agents{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.hud .agents li{display:grid;grid-template-columns:10px auto 1fr;gap:.55rem;align-items:baseline;font-size:.9rem;animation:agentIn .5s ease both;transition:color .3s;color:#B9BBB3;padding:.15rem .4rem;border-radius:6px;margin-left:-.4rem}
.hud .agents li.speaking{color:#fff;background:rgba(255,255,255,.08)}
.hud .agents b{color:#fff}
.hud .agents .agent-dot{width:9px;height:9px;border-radius:50%;display:inline-block;border:1px solid rgba(255,255,255,.4)}
.hud .floor-out{margin:0;padding-top:.6rem;border-top:1px solid rgba(255,255,255,.18);font-family:var(--font-display);font-size:1.15rem;color:#fff}
.hud .floor-out small{display:block;font-family:var(--font-body);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-bottom:.15rem}
.hud-nav{position:absolute;right:clamp(1rem,2.5vw,2rem);top:clamp(1rem,2.5vw,2rem);display:flex;gap:.4rem}
.hud-btn{border:1px solid rgba(255,255,255,.35);background:rgba(27,27,31,.7);backdrop-filter:blur(8px);color:#fff;font:inherit;font-weight:600;font-size:.85rem;padding:.5rem .8rem;border-radius:999px;cursor:pointer}
.hud-btn:hover{background:rgba(255,255,255,.14)}
.hud-human{position:absolute;right:clamp(1rem,2.5vw,2rem);bottom:clamp(1rem,2.5vw,2rem);margin:0;max-width:26ch;text-align:right;font-size:.75rem;color:#D8D6CE;background:rgba(27,27,31,.55);padding:.5rem .7rem;border-radius:8px}
.studio-stage.inside .studio-legend{opacity:.9}
@keyframes hudIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes agentIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@media (max-width:760px){
  .studio-stage{height:min(92vh,760px)}
  .studio-legend{display:none}
  .hud{padding:.8rem;grid-template-rows:auto 1fr auto}
  .hud-top{max-width:none;padding:.7rem .9rem;margin-right:5.5rem}
  .hud-top h3{font-size:1.3rem}.hud-text{font-size:.85rem}
  .hud-bottom{max-width:none;padding:.7rem .9rem}
  .hud .agents li{font-size:.8rem}
  .hud-human{display:none}
  .hud-nav{top:.8rem;right:.8rem}
}
/* Scene life */
.plane{animation:plane 38s linear infinite;transform-box:view-box}
@keyframes plane{from{transform:translate(-160px,90px)}to{transform:translate(1400px,60px)}}
.car{animation:drive 16s linear infinite}
.car-back{animation-name:driveBack;animation-duration:19s}
@keyframes drive{from{transform:translateX(-80px)}to{transform:translateX(1300px)}}
@keyframes driveBack{from{transform:translateX(1300px) translateY(16px)}to{transform:translateX(-80px) translateY(16px)}}
.neon{animation:neon 3s ease-in-out infinite}
@keyframes neon{0%,100%{opacity:1}50%{opacity:.6}}

/* SVG micro-animations */
.fig{transform-box:fill-box}
.a-type .arm-l{animation:typeL .5s ease-in-out infinite alternate;transform-origin:-10px -28px}
.a-type .arm-r{animation:typeR .46s ease-in-out infinite alternate;transform-origin:10px -28px}
.a-idle{animation:breathe 3s ease-in-out infinite}
.a-bounce{animation:bounce 1.6s ease-in-out infinite}
.a-walk{animation:walk 7s ease-in-out infinite alternate}
.a-walk .arm-l{animation:swing 1s ease-in-out infinite alternate;transform-origin:-10px -28px}
.a-walk .arm-r{animation:swing 1s ease-in-out infinite alternate-reverse;transform-origin:10px -28px}
.a-talk{animation:talk 2.2s ease-in-out infinite}
.a-play .arm-r{animation:swat .9s ease-in-out infinite alternate;transform-origin:10px -28px}
.a-play .arm-l{animation:swat .9s ease-in-out infinite alternate-reverse;transform-origin:-10px -28px}
.screen{animation:glow 2.4s ease-in-out infinite}
.twinkle{animation:twinkle 2.6s ease-in-out infinite}
.steam{animation:steam 2.2s ease-in-out infinite}
.sun{animation:sunPulse 5s ease-in-out infinite}
.disco{animation:spin 6s linear infinite;transform-origin:center;transform-box:fill-box}
.disco-rays{animation:rays 1.4s ease-in-out infinite alternate}
.spin{animation:spin 2.4s linear infinite;transform-origin:center;transform-box:fill-box}
.pong{animation:pong 1.1s ease-in-out infinite alternate}
.note-float{animation:noteFloat 2.4s ease-in-out infinite}
.swatch{animation:swatch 3s ease-in-out infinite}
.bar-grow{transform-origin:bottom;transform-box:fill-box;animation:barGrow 3s ease-in-out infinite alternate}
.ticker-text{animation:ticker 14s linear infinite}
.scribble path,.scribble circle{stroke-dasharray:120;stroke-dashoffset:120;animation:draw 3s ease-out forwards}
.bubble{animation:bubbleIn .5s ease .4s both}
.birds{animation:birds 12s linear infinite}
@keyframes typeL{from{transform:rotate(-8deg)}to{transform:rotate(6deg)}}
@keyframes typeR{from{transform:rotate(8deg)}to{transform:rotate(-6deg)}}
@keyframes breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-1px)}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes walk{from{transform:translateX(0)}to{transform:translateX(70px)}}
@keyframes swing{from{transform:rotate(-20deg)}to{transform:rotate(20deg)}}
@keyframes talk{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-1px) rotate(-2deg)}60%{transform:translateY(0) rotate(2deg)}}
@keyframes swat{from{transform:rotate(-40deg)}to{transform:rotate(30deg)}}
@keyframes glow{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes twinkle{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes steam{0%{transform:translateY(0);opacity:.8}100%{transform:translateY(-8px);opacity:0}}
@keyframes sunPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes rays{from{opacity:.25}to{opacity:.8}}
@keyframes pong{from{transform:translate(-40px,0)}to{transform:translate(40px,-10px)}}
@keyframes noteFloat{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(-14px);opacity:0}}
@keyframes swatch{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes barGrow{from{transform:scaleY(.4)}to{transform:scaleY(1)}}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-260px)}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes bubbleIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes birds{from{transform:translateX(0)}to{transform:translateX(-900px)}}
.sun,.pong,.note-float,.swatch,.steam,.a-idle,.a-bounce,.a-walk,.a-talk{transform-box:fill-box}
.pong{transform-box:view-box}

/* Animation origins (fill-box keeps origins local to each shape) */
.fig{transform-box:fill-box;transform-origin:50% 100%}
.fig .arm-l,.fig .arm-r{transform-box:fill-box;transform-origin:50% 8%}
.sun,.swatch{transform-origin:center}

[hidden]{display:none!important}

/* ============ Tour mode (3D home) ============ */
body.tour-mode{--bg:#1B1B1F; --bg-2:#232327; --surface:rgba(251,248,244,.05); --surface-2:#2A2A2E;--ink:#EDE7DE; --ink-2:#B8B2AA; --ink-3:#9A948C;--line:rgba(237,231,222,.14); --line-strong:rgba(237,231,222,.30);--encre:#1B1B1F; --acid:#C8FF2E; --nude:#EDE7DE; --paper:#FBF8F4;--lagoon:#1B1B1F; --lagoon-2:#2A2A2E; --lagoon-ink:#EDE7DE; --lagoon-mute:#9A948C;--brass:#C8FF2E; --brass-2:#C8FF2E; --brass-ink:#1B1B1F;--rose:#2A2A2E; --rose-ink:#EDE7DE;--cyan:#C8FF2E; --indigo:#9A948C; --violet:#B8B2AA; --pink:#C8FF2E;--spectrum:#C8FF2E;--sky-1:#2A2A2E; --sky-2:#1B1B1F;--shadow:0 18px 44px -26px rgba(0,0,0,.8);color-scheme:dark}
body.tour-mode{background:#1B1B1F;overflow-x:hidden}
body:not(.tour-mode) .scene-layer,body:not(.tour-mode) #tour,body:not(.tour-mode) .rail,body:not(.tour-mode) .tour-caption,body:not(.tour-mode) .agent-spotlight,body:not(.tour-mode) .progress-line,body:not(.tour-mode) [data-motion]{display:none!important}
body.tour-mode #main{display:none}
body.tour-mode .topbar{background:linear-gradient(180deg,rgba(27,27,31,.75),rgba(27,27,31,.25));border-bottom-color:rgba(237,231,222,.1);backdrop-filter:blur(18px) saturate(1.4)}
body.tour-mode .topbar .btn-solid{background:var(--spectrum);color:#1B1B1F;border-color:transparent}
body.tour-mode .nav a{color:#B8B2AA}body.tour-mode .nav a:hover,body.tour-mode .nav a[aria-current="page"]{color:#fff;background:rgba(237,231,222,.08)}
body.tour-mode .footer{background:linear-gradient(0deg,#1B1B1F,rgba(11,13,22,.85));position:relative;z-index:5;border-top-color:rgba(237,231,222,.12)}
body.tour-mode .sticky-cta{display:none}
.tool-button{padding:.4rem .2rem;border:0;background:transparent;color:var(--ink-3);font:inherit;font-size:.78rem;cursor:pointer;white-space:nowrap}
.tool-button[aria-pressed="true"]{color:var(--cyan,#C8FF2E)}
@media (max-width:980px){.tool-button{display:none}}
.progress-line{position:fixed;top:0;left:0;width:100%;height:2px;z-index:100;pointer-events:none}
.progress-line span{display:block;width:100%;height:100%;background:var(--spectrum);transform-origin:left;transform:scaleX(0);box-shadow:0 0 18px rgba(27,27,31,.65)}

.scene-layer{position:fixed;inset:0;z-index:0;overflow:hidden;background:#1B1B1F;pointer-events:auto}
.scene-ready .scene-layer{background:radial-gradient(ellipse at 68% 34%,#2A2A2E 0%,#232327 48%,#1B1B1F 100%)}
.scene-layer::before{position:absolute;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(to right,rgba(237,231,222,.035) 1px,transparent 1px),linear-gradient(to bottom,rgba(237,231,222,.035) 1px,transparent 1px);background-size:64px 64px;content:'';mask-image:linear-gradient(90deg,transparent 0%,#000 32%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 32%,#000 100%)}
#sceneCanvas{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;outline:none;touch-action:pan-y}
.scene-shade{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(27,27,31,.97),rgba(27,27,31,.84) 18%,rgba(27,27,31,.43) 36%,transparent 60%),linear-gradient(0deg,rgba(27,27,31,.72),transparent 24%,transparent 82%,rgba(27,27,31,.24))}
.scene-fallback{position:absolute;right:12vw;top:42%;z-index:3;max-width:16rem;border-left:1px solid var(--brass);padding:0 1.2rem;color:#9A948C}
.scene-fallback span{color:var(--brass);font-size:.78rem}.scene-fallback p{font-size:.9rem;margin:.5rem 0}

#tour{position:relative;z-index:2;pointer-events:none;color:#EDE7DE}
#tour .chapter{position:relative;display:flex;align-items:center;min-height:120svh;padding:8rem 0 8rem 6.3vw;pointer-events:none}
#tour .chapter-inner{width:clamp(280px,30vw,440px);pointer-events:auto}
#tour .chapter--agents{min-height:145svh}#tour .chapter--contact{min-height:115svh}
#tour h1,#tour h2{margin:0 0 1.4rem;font-family:var(--font-display);font-weight:500;line-height:1.02;letter-spacing:-.01em;color:#fff;text-wrap:balance}
#tour h1{font-size:clamp(3.2rem,6vw,6.4rem)}#tour h2{font-size:clamp(2.8rem,4.8vw,5.2rem)}
#tour h1 em,#tour h2 em{font-style:italic;font-weight:400;color:transparent;color:var(--acid);animation:spectrum-word 12s ease-in-out infinite alternate}
@keyframes spectrum-word{from{background-position:0 50%}to{background-position:100% 50%}}
#tour .eyebrow{display:flex;align-items:center;gap:.65rem;margin:0 0 1.5rem;color:var(--cyan);font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
#tour .floor-number{color:#fff;letter-spacing:0;padding-right:.75rem;border-right:1px solid rgba(237,231,222,.2)}
#tour .signal-dot{width:6px;height:6px;background:var(--pink);border-radius:50%;box-shadow:0 0 14px rgba(200,255,46,.8)}
#tour .chapter-inner>p{max-width:32ch;color:#B8B2AA;font-size:clamp(.98rem,1.1vw,1.1rem);line-height:1.65}
#tour .lede{max-width:30ch}
#tour .floor-humor{max-width:30ch;margin:2rem 0 0;color:#b4b6ca;font-family:var(--font-display);font-style:italic;font-size:1.02rem;line-height:1.5}
#tour .interaction-note{display:flex;gap:.55rem;max-width:28ch;margin:1.2rem 0;color:var(--pink);font-size:.85rem}
#tour .interaction-note span:first-child{font-size:1.1rem;line-height:1}
#tour .scene-caption{display:block;margin-top:.8rem;color:#6E6862;font-size:.72rem}
#tour .button{display:inline-flex;align-items:center;justify-content:space-between;gap:1.4rem;margin-top:.9rem;padding:.92rem 1.15rem;font-size:.88rem;font-weight:600;line-height:1;text-decoration:none;border:1px solid rgba(27,27,31,.32);border-radius:999px;background:rgba(27,27,31,.34);backdrop-filter:blur(18px);color:#EDE7DE;transition:transform .3s ease,filter .3s ease}
#tour .button:hover{transform:translateY(-2px)}
#tour .button--solid{border-color:transparent;color:#1B1B1F;background:var(--spectrum);box-shadow:0 12px 36px -16px rgba(27,27,31,.9)}
#tour .button--solid:hover{filter:brightness(1.1)}
#tour .arrival-note{display:flex;align-items:center;gap:.65rem;margin-top:2.6rem;color:#9A948C;font-size:.78rem}
#tour .scroll-cue{display:inline-block;width:13px;height:21px;border:1px solid rgba(27,27,31,.6);border-radius:9px;position:relative}
#tour .scroll-cue:after{position:absolute;top:4px;left:5px;width:1px;height:5px;background:var(--cyan);content:'';animation:scroll-dot 2.8s ease-in-out infinite}
@keyframes scroll-dot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(4px)}}
#tour .chapter-aside{position:absolute;bottom:13rem;right:17vw;color:rgba(241,230,208,.7);font-family:var(--font-display);font-style:italic;font-size:.95rem;pointer-events:none}
#tour .chapter-disciplines{display:flex;flex-wrap:wrap;gap:.6rem 1.15rem;margin-top:1.4rem;color:#d7d8e6;font-size:.8rem}
#tour .chapter-disciplines span{padding-bottom:.35rem;border-bottom:1px solid rgba(200,255,46,.35)}
#tour .workflow-steps{display:flex;gap:1.2rem;list-style:none;padding:0;margin:1.6rem 0 0}
#tour .workflow-step{display:grid;gap:.3rem}#tour .workflow-step span{color:var(--cyan);font-size:.72rem}#tour .workflow-step strong{font-size:.82rem;font-weight:500}
#tour .contact-actions{display:flex;flex-wrap:wrap;gap:.6rem}
#tour .author-signature{display:flex;align-items:center;gap:1rem;margin:1.6rem 0 .4rem}
#tour .author-signature img{width:72px;height:88px;object-fit:cover;object-position:50% 20%;border-radius:8px;border:1px solid rgba(237,231,222,.18)}
#tour .author-signature strong,#tour .author-signature span,#tour .author-signature small{display:block}
#tour .author-signature strong{font-size:.95rem;font-weight:600}#tour .author-signature span{margin-top:.15rem;color:#9A948C;font-size:.82rem}#tour .author-signature small{margin-top:.4rem;color:var(--cyan);font-size:.68rem;letter-spacing:.12em}
/* Agent library */
#tour .agent-library{margin-top:1.6rem;border:1px solid rgba(237,231,222,.16);border-radius:18px;background:linear-gradient(180deg,rgba(237,231,222,.10),rgba(237,231,222,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 24px 60px -32px rgba(0,0,0,.9);backdrop-filter:blur(26px) saturate(1.5);overflow:hidden}
#tour summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;list-style:none;cursor:pointer;padding:.95rem 1rem;font-size:.9rem;font-weight:600;color:#EDE7DE}
#tour summary::-webkit-details-marker{display:none}
#tour .details-plus{font-weight:300;font-size:1.3rem;color:var(--cyan);transition:transform .3s ease}
#tour details[open]>summary>.details-plus{transform:rotate(45deg)}
#tour .agent-library-content{max-height:45svh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 .65rem .8rem}
#tour .agent-legend{display:flex;flex-wrap:wrap;gap:.35rem .8rem;padding:.6rem .25rem .9rem}
#tour .agent-legend-item{display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;letter-spacing:.07em;color:#B8B2AA}
#tour .agent-legend-item::before{width:5px;height:5px;border-radius:50%;background:var(--pack-color,var(--brass));box-shadow:0 0 9px var(--pack-color,var(--brass));content:''}
#tour .agent-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}
#tour .agent-card{position:relative;overflow:hidden;display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:.7rem;min-height:5.8rem;padding:.65rem;border:1px solid rgba(237,231,222,.13);border-radius:14px;background:rgba(27,27,31,.68);color:#EDE7DE;text-align:left;cursor:pointer;font:inherit;transition:background .3s ease,border-color .3s ease,transform .35s ease}
#tour .agent-card::after{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--pack-color,var(--brass)),transparent);content:''}
#tour .agent-card:hover,#tour .agent-card[data-selected="true"]{background:linear-gradient(135deg,rgba(27,27,31,.17),rgba(200,255,46,.08));border-color:var(--pack-color,var(--brass));transform:translateY(-2px)}
#tour .agent-card-copy{display:grid;gap:.24rem;min-width:0}
#tour .agent-card-index{font-size:.68rem;color:var(--pack-color,var(--brass));letter-spacing:.06em}
#tour .agent-card strong{font-size:.95rem;font-weight:600;overflow-wrap:anywhere}#tour .agent-card small{font-size:.75rem;color:#9A948C;line-height:1.25}
#tour .agent-avatar{display:block;width:54px;height:54px;filter:drop-shadow(0 0 12px rgba(27,27,31,.22))}
#tour .agent-detail{display:grid;gap:.45rem;margin:.8rem 0 0;padding:.8rem;border-left:1px solid var(--cyan);background:rgba(210,191,161,.04)}
#tour .agent-detail-kicker{color:var(--cyan);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}
#tour .agent-detail strong{font-size:1rem;font-weight:500}#tour .agent-detail p{margin:0;color:#9A948C;font-size:.82rem;line-height:1.5;max-width:none}
#tour .agent-squads{display:flex;flex-wrap:wrap;gap:.4rem .8rem;margin-top:.9rem;font-size:.72rem;color:#9A948C}
/* Spotlight, rail, caption */
.agent-spotlight{position:fixed;right:7vw;bottom:6rem;z-index:65;width:min(370px,88vw);padding:1.35rem 1.5rem 1.4rem;border:1px solid rgba(237,231,222,.2);border-top:2px solid var(--pack-color,#C8FF2E);border-radius:18px;background:linear-gradient(180deg,rgba(35,35,39,.9),rgba(21,21,24,.92));box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 34px 90px -28px rgba(0,0,0,.95),0 0 48px -22px var(--pack-color,#C8FF2E);backdrop-filter:blur(32px) saturate(1.65);color:#EDE7DE;animation:spotlight-enter .55s ease both}
@keyframes spotlight-enter{from{opacity:0;transform:translate3d(0,18px,0) scale(.97)}to{opacity:1;transform:none}}
.agent-spotlight .spotlight-close{display:block;margin:0 0 1rem auto;border:0;background:transparent;color:#9A948C;cursor:pointer;padding:.3rem;font:inherit;font-size:.85rem;min-height:32px}
.agent-spotlight .spotlight-avatar{float:left;width:82px;height:82px;margin:0 1rem .65rem 0;filter:drop-shadow(0 0 18px var(--pack-color,#C8FF2E))}
.agent-spotlight .agent-detail-kicker{display:block;color:var(--pack-color,#C8FF2E);font-size:.68rem;letter-spacing:.1em}
.agent-spotlight h3{margin:.35rem 1rem .3rem 0;font-family:var(--font-display);font-weight:500;font-size:1.6rem;color:#fff}
.agent-spotlight p{margin:.4rem 0 0;font-size:.85rem;color:#9A948C}
.agent-spotlight blockquote{clear:both;margin:1.1rem 0 .25rem;font-family:var(--font-display);font-style:italic;font-size:1.15rem;line-height:1.45;color:#e3d1af}
.rail{position:fixed;right:2.8vw;top:50%;z-index:60;transform:translateY(-50%)}
.rail ol{display:flex;flex-direction:column;align-items:flex-end;gap:.32rem;list-style:none;margin:0;padding:0}
.rail a{display:flex;flex-direction:row-reverse;align-items:center;gap:.8rem;min-height:34px;padding:.3rem 0;text-decoration:none;color:rgba(218,220,230,.5)}
.rail a span{display:grid;place-items:center;min-width:1.6rem;font-size:.75rem;letter-spacing:.025em}
.rail a em{font-style:normal;font-size:.75rem;letter-spacing:.045em;opacity:0;transform:translateX(4px);transition:opacity .25s,transform .25s}
.rail a:hover,.rail a:focus-visible,.rail a[data-active="true"]{color:var(--cyan,#C8FF2E)}
.rail a:hover em,.rail a:focus-visible em,.rail a[data-active="true"] em{opacity:1;transform:none}
.rail a[data-active="true"] span{height:1.6rem;border:1px solid rgba(200,255,46,.55);border-radius:50%;box-shadow:0 0 18px rgba(200,255,46,.18)}
.tour-caption{position:fixed;left:6.3vw;right:4vw;bottom:1.8rem;z-index:55;display:flex;align-items:center;justify-content:space-between;gap:1rem;pointer-events:none}
.tour-location{display:flex;align-items:center;gap:.8rem}
.tour-location>span{font-size:.75rem;letter-spacing:.075em;color:var(--cyan,#C8FF2E);padding-right:.8rem;border-right:1px solid rgba(200,255,46,.3)}
.tour-location strong{font-size:.8rem;font-weight:500;letter-spacing:.025em;color:#B8B2AA}
.tour-status{display:flex;align-items:center;gap:.45rem;font-size:.75rem;color:#9A948C}
.tour-status i{height:5px;width:5px;display:block;border-radius:50%;background:var(--pink,#C8FF2E);box-shadow:0 0 10px rgba(200,255,46,.7)}
body.motion-calm,body.motion-calm *{scroll-behavior:auto!important}
body.motion-calm #tour .scroll-cue:after,body.motion-calm #tour h1 em,body.motion-calm #tour h2 em{animation:none}
@media (max-width:1000px){#tour .chapter{padding-left:5vw}#tour .chapter-inner{width:34vw;min-width:270px}#tour .chapter-aside{right:12vw;font-size:.8rem}.rail{right:2vw}.rail a em{display:none}.tour-caption{left:5vw}}
@media (max-width:680px){
  #tour .chapter{align-items:flex-end;min-height:125svh;padding:70svh 13vw 16svh 7vw}
  #tour .chapter--arrival{min-height:108svh;padding-top:49svh;padding-bottom:15svh}
  #tour .chapter--agents{min-height:138svh}
  #tour .chapter-inner{width:min(380px,100%);min-width:0}
  #tour h1{font-size:clamp(3rem,12vw,4.6rem);margin-bottom:1rem}#tour h2{font-size:clamp(2.6rem,11vw,4rem);margin-bottom:1rem}
  #tour .chapter-aside{display:none}
  .scene-shade{background:linear-gradient(0deg,rgba(27,27,31,.94),rgba(27,27,31,.75) 34%,transparent 73%),linear-gradient(90deg,rgba(27,27,31,.25),transparent 68%)}
  .rail{right:3vw;top:46%}.rail ol{gap:.15rem}.rail a{min-height:30px}.rail a span{font-size:.7rem}
  .tour-caption{left:7vw;right:15vw;bottom:1.2rem}.tour-status{display:none}
  .agent-spotlight{right:5vw;bottom:4rem}.agent-spotlight .spotlight-avatar{width:68px;height:68px}
  #tour .agent-grid{grid-template-columns:1fr}#tour .agent-library-content{max-height:40svh}
}
@media (prefers-reduced-motion:reduce){#tour h1 em,#tour h2 em{animation:none}.agent-spotlight{animation:none}}
.about .portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 15%;display:block}
.tour-status::before{content:'';height:5px;width:5px;border-radius:50%;background:var(--pink,#C8FF2E);box-shadow:0 0 10px rgba(200,255,46,.7);flex:none}
.proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;max-width:720px}
.proof-card{display:block;min-width:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}
.proof-card img{display:block;width:100%;aspect-ratio:1.32;object-fit:cover;object-position:top}
.proof-card>span{display:flex;justify-content:space-between;padding:.6rem .8rem;font-size:.85rem;font-weight:600;color:var(--ink-2)}
.proof-card i{font-style:normal;color:var(--brass)}
@media (max-width:620px){.proof-grid{grid-template-columns:1fr}}

/* ============ One world: the night tower everywhere ============ */

body{background:#1B1B1F;overflow-x:hidden}
body:not(.tour-mode) .scene-layer,body:not(.tour-mode) .tour-caption,body:not(.tour-mode) [data-motion]{display:flex!important}
body:not(.tour-mode) .scene-layer{display:block!important}
body.page-mode .scene-shade{background:linear-gradient(90deg,rgba(27,27,31,.97) 0%,rgba(27,27,31,.93) 38%,rgba(27,27,31,.62) 70%,rgba(27,27,31,.35) 100%),linear-gradient(0deg,rgba(27,27,31,.9),transparent 22%,transparent 80%,rgba(27,27,31,.4))}
body.page-mode #main{position:relative;z-index:2}
body.page-mode .footer{position:relative;z-index:2;background:linear-gradient(0deg,#1B1B1F,rgba(11,13,22,.85))}
.topbar{background:linear-gradient(180deg,rgba(27,27,31,.78),rgba(27,27,31,.3));border-bottom-color:rgba(237,231,222,.1);backdrop-filter:blur(18px) saturate(1.4)}
.topbar .btn-solid{background:var(--spectrum);color:#1B1B1F;border-color:transparent}
.nav a{color:#B8B2AA}.nav a:hover,.nav a[aria-current="page"]{color:#fff;background:rgba(237,231,222,.08)}
.band{background:rgba(27,27,31,.6);backdrop-filter:blur(16px);border-top:1px solid rgba(237,231,222,.08);border-bottom:1px solid rgba(237,231,222,.08)}
.band-soft{background:rgba(237,231,222,.035);backdrop-filter:blur(10px)}
.card,.journey,.demo,.mode,.door,.arc div,.reco-side,.logo-tile,.screen,.brief{backdrop-filter:blur(14px)}
.card{background:rgba(27,27,31,.62)}.mode,.arc div,.door{background:rgba(27,27,31,.5)}
.btn-solid{background:var(--spectrum);color:#1B1B1F;border-color:transparent}
.band .btn-solid,.btn-brass{background:var(--brass);color:#1B1B1F;border-color:var(--brass)}
.card.featured{border-color:var(--violet);box-shadow:0 0 60px -30px var(--violet)}
.tag,.step .num,.checklist li::before,.reco-path li b,.chain li+li::before,.nav a .dot,.footer-nav a .dot,.what li::before{color:var(--cyan)}
.page-head h1{font-size:clamp(3rem,7vw,6.4rem)}
.page-head h1 .dot{color:var(--acid)}
.floor-chip{display:inline-flex;align-items:center;gap:.6rem;margin-top:1.2rem;padding:.45rem .9rem;border:1px solid rgba(237,231,222,.18);border-radius:999px;background:rgba(27,27,31,.55);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#B8B2AA}
.floor-chip b{color:var(--cyan);font-weight:700}
.footer{background:transparent}
.sticky-cta .btn-solid{background:var(--spectrum);color:#1B1B1F}
@media (max-width:820px){body.page-mode .tour-caption{display:none!important}}

/* Elevator transition between pages */
.lift{position:fixed;inset:0;z-index:95;pointer-events:none;display:grid;place-items:center;background:#1B1B1F;opacity:0}
.lift.run{animation:liftRun .95s ease both}
.lift-inner{display:grid;gap:.4rem;justify-items:center;transform:translateY(20px);opacity:0}
.lift.run .lift-inner{animation:liftText .95s ease both}
.lift-code{font-family:var(--font-display);font-size:clamp(4rem,12vw,9rem);line-height:1;color:var(--acid)}
.lift-name{font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;color:#B8B2AA}
.lift-line{width:120px;height:2px;background:var(--spectrum);transform-origin:left;animation:liftLine .95s ease both}
@keyframes liftRun{0%{opacity:0}18%{opacity:1}72%{opacity:1}100%{opacity:0}}
@keyframes liftText{0%{opacity:0;transform:translateY(24px)}25%{opacity:1;transform:none}70%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-16px)}}
@keyframes liftLine{0%{transform:scaleX(0)}60%{transform:scaleX(1)}100%{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.lift.run,.lift.run .lift-inner,.lift-line{animation:none}.lift{display:none}}

/* Made by Y. — the lab: one phone, five prototypes */
.lab{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:clamp(2rem,4vw,4rem);align-items:start}
.phone{position:relative;width:100%;max-width:340px;aspect-ratio:9/18.4;border-radius:44px;background:#1B1B1F;border:8px solid #2A2A2E;box-shadow:0 40px 90px -40px rgba(0,0,0,1),0 0 80px -40px var(--acc,#C8FF2E),inset 0 0 0 1px rgba(255,255,255,.06);overflow:hidden;display:grid;grid-template-rows:auto 1fr;--acc:#C8FF2E}
.phone::before{content:'';position:absolute;top:10px;left:50%;transform:translateX(-50%);width:34%;height:22px;border-radius:12px;background:#2A2A2E;z-index:2}
.phone-top{padding:2.6rem 1.2rem .6rem;display:grid;gap:.3rem}
.phone-top .tag{color:var(--acc)}
.phone-top h3{font-size:1.35rem;margin:0}
.phone-top p{margin:0;font-size:.82rem;color:var(--ink-3)}
.phone-body{padding:.6rem 1.2rem 1.4rem;overflow:auto;display:grid;gap:.8rem;align-content:start}
.phone .demo-steps span.on{background:var(--acc)}
.phone .opt{padding:.75rem .8rem;border-radius:12px;background:rgba(237,231,222,.05)}
.phone .opt[aria-pressed="true"],.phone .opt:hover{border-color:var(--acc);box-shadow:inset 0 0 0 1px var(--acc)}
.phone .opts{grid-template-columns:1fr 1fr;gap:.5rem}
.phone .opt strong{font-size:.9rem}
.phone .mood{grid-template-columns:repeat(3,1fr)}
.phone .recap{display:grid;gap:.35rem;margin:0;padding:0;list-style:none;font-size:.85rem}
.phone .recap li{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(237,231,222,.1);padding:.3rem 0}
.phone .recap li span:last-child{color:#fff;font-weight:600;text-align:right}
.phone .brief{font-size:.82rem;max-height:none;background:rgba(237,231,222,.05)}
.phone .btn{width:100%;justify-content:center}
.phone .outcome{font-size:.8rem;color:var(--ink-3);margin:0}
.proto-tabs{display:grid;gap:.6rem}
.proto-tab{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;text-align:left;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:14px;background:rgba(27,27,31,.5);color:inherit;font:inherit;cursor:pointer;transition:border-color .2s,transform .2s;backdrop-filter:blur(12px)}
.proto-tab:hover{transform:translateX(4px)}
.proto-tab[aria-pressed="true"]{border-color:var(--acc);box-shadow:0 0 50px -30px var(--acc)}
.proto-tab .num{font-family:var(--font-display);font-size:1.6rem;color:var(--acc);line-height:1}
.proto-tab strong{display:block;font-family:var(--font-display);font-weight:500;font-size:1.3rem}
.proto-tab small{display:block;color:var(--ink-3);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.3rem}
.proto-tab p{margin:.3rem 0 0;color:var(--ink-2);font-size:.9rem}
.proto-tab .res{display:none;margin-top:.5rem;color:#fff;font-size:.9rem}
.proto-tab[aria-pressed="true"] .res{display:block}
@media (max-width:820px){.lab{grid-template-columns:1fr}.phone{max-width:320px;margin:0 auto}}

/* Seen by Y. — event posters */
.posters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.poster{position:relative;aspect-ratio:3/4;border-radius:16px;padding:1.4rem;display:grid;align-content:end;gap:.5rem;overflow:hidden;background:var(--pbg);color:#fff;box-shadow:var(--shadow);transition:transform .45s cubic-bezier(.19,1,.22,1)}
.poster:hover{transform:translateY(-8px) rotate(-1.2deg)}
.poster::after{content:'';position:absolute;inset:0;background:radial-gradient(120% 80% at 80% 0%,rgba(255,255,255,.25),transparent 55%),linear-gradient(0deg,rgba(27,27,31,.55),transparent 60%);pointer-events:none}
.poster>*{position:relative;z-index:1}
.poster .num{position:absolute;top:.6rem;left:1.1rem;font-family:var(--font-display);font-size:5rem;line-height:1;opacity:.28;z-index:0}
.poster h3{margin:0;font-size:clamp(1.9rem,2.8vw,2.6rem);line-height:.98;color:#fff}
.poster p{margin:0;font-size:.9rem;color:rgba(255,255,255,.85)}
.poster .soon{position:absolute;top:1rem;right:1rem;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:.35rem .6rem;border-radius:999px;background:#fff;color:#1B1B1F;z-index:1}
@media (max-width:820px){.posters{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.posters{grid-template-columns:1fr}}

/* ============ Neon only ============ */

.band .btn-solid,.btn-brass{background:var(--spectrum);color:#1B1B1F;border-color:transparent}
.logo-tile.dark{background:#1B1B1F;border:1px solid var(--line)}
.logo-tile.brass{background:var(--spectrum);color:#1B1B1F}
.logo-tile.rose{background:linear-gradient(160deg,#C8FF2E,#C8FF2E);color:#1B1B1F}
.logo-tile.rose .lock .dot,.logo-tile.brass .lock .dot{color:#1B1B1F}
.wordmark .logo-mark circle:last-of-type{fill:url(#ydot)}

/* Guided journey inside the tower (hall) */
#tour .journey--tour{margin:1rem 0 1.2rem;padding:1rem;gap:.8rem;background:linear-gradient(180deg,rgba(237,231,222,.10),rgba(237,231,222,.035));border:1px solid rgba(237,231,222,.16);border-radius:18px;backdrop-filter:blur(26px) saturate(1.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
#tour .journey--tour h3{font-size:1.15rem;color:#fff}
#tour .journey--tour .opts{grid-template-columns:1fr 1fr;gap:.45rem}
#tour .journey--tour .opt{padding:.65rem .7rem;background:rgba(27,27,31,.5);border-radius:12px}
#tour .journey--tour .opt strong{font-size:.9rem}#tour .journey--tour .opt small{font-size:.74rem}
#tour .journey--tour .reco{grid-template-columns:1fr;gap:1rem}
#tour .journey--tour .reco-main h3{font-size:1.4rem}
#tour .journey--tour .brief{max-height:110px;font-size:.82rem}
#tour .journey--tour .journey-progress{font-size:.7rem}
#tour .journey--tour .btn{padding:.7rem 1rem;font-size:.85rem}
#tour #hall{min-height:150svh}
#tour .chapter--agents .chapter-inner{padding-bottom:4rem}
body.library-open .tour-caption{opacity:0;transition:opacity .3s}

/* Static poster when the 3D scene is skipped (weak mobile, reduced motion, data saver) */
.scene-poster{position:absolute;inset:0;z-index:0;background:#1B1B1F url(assets/tower-poster.jpg) center/cover no-repeat}
body.no-3d #sceneCanvas{display:none}
body.no-3d .scene-fallback{display:none}

/* Done by Y. — proof as a show */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.stat{position:relative;overflow:hidden;padding:1.4rem 1.2rem;border:1px solid var(--line);border-radius:16px;background:rgba(27,27,31,.55);backdrop-filter:blur(14px);display:grid;gap:.3rem;align-content:start}
.stat::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--spectrum);opacity:.8}
.stat b{font-family:var(--font-display);font-weight:500;font-size:clamp(2.6rem,5vw,4.4rem);line-height:1;color:var(--acid);font-variant-numeric:tabular-nums}
.stat span{color:var(--ink-2);font-size:.95rem}
.stat small{color:var(--ink-3);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
@media (max-width:900px){.stats{grid-template-columns:1fr 1fr}}
.ba{position:relative;aspect-ratio:16/9;min-height:320px;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);user-select:none;touch-action:none;cursor:ew-resize;--x:50%}
.ba-pane{position:absolute;inset:0;padding:clamp(1.2rem,4vw,3rem);display:grid;align-content:center;gap:.9rem}
.ba-before{background:#ecebe6;color:#3a3a3a;font-family:Arial,Helvetica,sans-serif}
.ba-after{background:radial-gradient(120% 90% at 80% 10%,#2A2A2E,#1B1B1F 60%);color:#fff;clip-path:inset(0 0 0 var(--x))}
.ba-handle{position:absolute;top:0;bottom:0;left:var(--x);width:2px;background:#fff;transform:translateX(-1px);pointer-events:none}
.ba-handle::after{content:'◂ ▸';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:#fff;color:#1B1B1F;display:grid;place-items:center;font-size:.78rem;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.ba-tag{position:absolute;top:1rem;z-index:2;padding:.35rem .7rem;border-radius:999px;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;pointer-events:none}
.ba-tag.l{left:1rem;background:#3a3a3a;color:#fff}.ba-tag.r{right:1rem;background:var(--spectrum);color:#1B1B1F}
.mock-nav{display:flex;gap:1rem;font-size:.7rem;opacity:.7}
.mock-h{font-size:clamp(1.3rem,3vw,2.4rem);line-height:1.1;font-weight:700;max-width:14ch}
.ba-after .mock-h{font-family:var(--font-display);font-weight:500;font-size:clamp(1.6rem,3.6vw,3rem)}
.ba-after .mock-h em{font-style:italic;color:var(--acid)}
.mock-p{font-size:.85rem;max-width:40ch;opacity:.85;margin:0}
.mock-btn{display:inline-block;padding:.55rem 1rem;border-radius:4px;font-size:.78rem;font-weight:700}
.ba-before .mock-btn{background:#bbb;color:#333}
.ba-after .mock-btn{background:var(--spectrum);color:#1B1B1F;border-radius:999px}
.ba-after .mock-chips{display:flex;gap:.4rem;flex-wrap:wrap}.ba-after .mock-chips span{padding:.25rem .6rem;border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:.7rem}
.ba-before .mock-img{width:100%;max-width:220px;aspect-ratio:3/2;background:repeating-linear-gradient(45deg,#d8d6cf 0 8px,#e6e4de 8px 16px);border-radius:4px}
.timeline{display:grid}
.tl{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:1.5rem;padding:1.3rem 0;border-top:1px solid var(--line)}
.tl:last-child{border-bottom:1px solid var(--line)}
.tl .when{font-family:var(--font-display);font-size:1.25rem;color:var(--cyan);line-height:1.2}
.tl strong{display:block;font-size:1.1rem;margin-bottom:.2rem}
.tl span{color:var(--ink-2);display:block}
.tl .fact{color:#fff}
@media (max-width:620px){.tl{grid-template-columns:1fr;gap:.4rem}}

/* Posters with real photos when present */
.poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.9}
.poster.has-photo::after{background:linear-gradient(0deg,rgba(27,27,31,.85),rgba(27,27,31,.2) 60%,transparent)}
.about .portrait{aspect-ratio:4/5}
.photo-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:1.5rem}
.photo-strip img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;border:1px solid var(--line)}
@media (max-width:620px){.photo-strip{grid-template-columns:1fr 1fr}}

/* Arabic */
[dir="rtl"]{text-align:right}
#tour .chapter-inner[dir="rtl"]{font-family:"Instrument Sans","Segoe UI",Tahoma,Arial,sans-serif}
#tour .chapter-inner[dir="rtl"] h1,#tour .chapter-inner[dir="rtl"] h2{font-family:"Bodoni Moda",Georgia,"Times New Roman",serif}
#tour .chapter-inner[dir="rtl"] .eyebrow,#tour .chapter-inner[dir="rtl"] .contact-actions,#tour .chapter-inner[dir="rtl"] .chapter-disciplines{justify-content:flex-start;flex-direction:row-reverse}
body.scene-ready .scene-poster{display:none}
body.no-3d .scene-poster{display:block}
.contact-book{display:grid;gap:.4rem;padding:1.2rem;border:1px solid var(--line);border-radius:14px;background:rgba(27,27,31,.55)}
.contact-book .btn{justify-self:start}

/* ============ Explore mode ============ */
.tour-right{display:flex;align-items:center;gap:.8rem;pointer-events:auto}
.explore-btn{border:1px solid rgba(200,255,46,.5);background:rgba(27,27,31,.7);backdrop-filter:blur(10px);color:#fff;font:inherit;font-size:.8rem;font-weight:600;padding:.5rem .9rem;border-radius:999px;cursor:pointer;box-shadow:0 0 30px -12px var(--cyan)}
.explore-btn:hover{background:rgba(200,255,46,.15)}
.chip-btn{margin-left:.6rem;border:1px solid rgba(200,255,46,.5);background:transparent;color:var(--cyan);font:inherit;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.25rem .6rem;border-radius:999px;cursor:pointer}
.chip-btn:hover{background:rgba(200,255,46,.15)}
html.lock-scroll{overflow:hidden}
body.exploring .scene-layer{z-index:30}
body.exploring #sceneCanvas{touch-action:none;cursor:grab}
body.exploring .scene-shade{background:linear-gradient(0deg,rgba(27,27,31,.55),transparent 22%,transparent 85%,rgba(27,27,31,.35))}
body.exploring #tour,body.exploring #main,body.exploring .footer,body.exploring .rail,body.exploring .sticky-cta,body.exploring .tour-caption,body.exploring .agent-spotlight[hidden]{display:none!important}
body.exploring .agent-spotlight{z-index:45}
.explore-hud{position:fixed;left:0;right:0;bottom:1.4rem;z-index:40;display:flex;justify-content:center;pointer-events:none}
.explore-bar{pointer-events:auto;display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:999px;background:rgba(27,27,31,.78);backdrop-filter:blur(16px);border:1px solid rgba(237,231,222,.18);box-shadow:0 24px 60px -24px rgba(0,0,0,.9)}
.explore-floor{font-family:var(--font-display);font-size:1.1rem;color:#fff;min-width:9ch;text-align:center}
.explore-hint{font-size:.74rem;color:#9A948C;letter-spacing:.04em;padding:0 .4rem;border-left:1px solid rgba(237,231,222,.18)}
@media (max-width:700px){.explore-hint{display:none}.explore-bar{gap:.4rem;padding:.5rem .6rem}}
.arrival-who{margin:-.4rem 0 1rem;font-size:.85rem!important;color:var(--cyan)!important;max-width:36ch!important;letter-spacing:.02em}

/* ============ Need first: doors in the tower, industry pages ============ */
#tour .needs-doors{display:grid;gap:.5rem;margin:1.2rem 0}
#tour .need-door{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.15rem 1rem;padding:.85rem 1rem;border:1px solid rgba(237,231,222,.16);border-radius:14px;background:linear-gradient(180deg,rgba(237,231,222,.10),rgba(237,231,222,.035));backdrop-filter:blur(20px);color:#fff;text-decoration:none;transition:transform .25s ease,border-color .25s ease}
#tour .need-door:hover{transform:translateX(6px);border-color:var(--cyan)}
#tour .need-door strong{font-family:var(--font-display);font-weight:500;font-size:1.2rem;line-height:1.1}
#tour .need-door span{grid-column:1;color:#9A948C;font-size:.82rem}
#tour .need-door i{grid-column:2;grid-row:1/3;font-style:normal;color:var(--cyan);font-size:1.3rem}
#tour #besoin{min-height:170svh}
.ind-h1{font-size:clamp(2.4rem,5vw,4.4rem)!important;max-width:16ch}
.ind-h1 em{font-style:italic;color:var(--acid)}
.pain{display:grid;gap:.5rem;padding:1.3rem;border:1px solid var(--line);border-radius:14px;background:rgba(27,27,31,.55);backdrop-filter:blur(12px)}
.pain b{font-family:var(--font-display);font-size:1.6rem;color:var(--pink);font-weight:500;line-height:1}
.pain p{margin:0;color:var(--ink-2)}
.ind-card{text-decoration:none;transition:border-color .2s,transform .2s}
.ind-card:hover{border-color:var(--cyan);transform:translateY(-3px)}
.ind-links{display:flex;flex-wrap:wrap;gap:.6rem}
.ind-links a{padding:.5rem .9rem;border:1px solid var(--line);border-radius:999px;font-size:.9rem;color:var(--ink-2)}
.ind-links a:hover{border-color:var(--cyan);color:#fff}

#tour .needs-doors{grid-template-columns:1fr 1fr;gap:.45rem}
#tour .need-door{padding:.7rem .8rem;gap:.1rem .6rem}
#tour .need-door strong{font-size:1.02rem}
#tour .need-door span{font-size:.72rem;line-height:1.25}
#tour .need-door--all{grid-column:1/-1;border-color:rgba(200,255,46,.4)}
#tour .need-door--all span{color:#B8B2AA}
#tour #besoin{min-height:185svh}
@media (max-width:680px){#tour .needs-doors{grid-template-columns:1fr}}

/* ============ Concierge: "How can I help?" ============ */
.concierge-fab{position:fixed;right:1.2rem;bottom:1.2rem;z-index:70;display:flex;align-items:center;gap:.6rem;padding:.55rem 1rem .55rem .55rem;border:1px solid rgba(237,231,222,.2);border-radius:999px;background:rgba(27,27,31,.82);backdrop-filter:blur(16px);color:#fff;font:inherit;font-weight:600;font-size:.88rem;cursor:pointer;box-shadow:0 20px 50px -20px rgba(0,0,0,.9),0 0 40px -18px var(--violet);animation:fabIn .6s ease both}
.concierge-fab .fab-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--spectrum);color:#1B1B1F;font-family:var(--font-display);font-size:1.1rem}
.concierge-fab .fab-mark i{font-style:normal}
.concierge-fab:hover{border-color:var(--cyan)}
@keyframes fabIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
body.exploring .concierge-fab{display:none}
.concierge{position:fixed;right:1.2rem;bottom:1.2rem;z-index:75;width:min(420px,calc(100vw - 2.4rem))}
.concierge-card{border:1px solid rgba(237,231,222,.2);border-top:2px solid transparent;border-image:var(--spectrum) 1;border-radius:20px;background:linear-gradient(180deg,rgba(35,35,39,.94),rgba(21,21,24,.96));backdrop-filter:blur(30px) saturate(1.6);box-shadow:0 34px 90px -28px rgba(0,0,0,.95);padding:1.2rem 1.3rem 1.3rem;display:grid;gap:.9rem;animation:conciergeIn .5s cubic-bezier(.19,1,.22,1) both;color:#EDE7DE;max-height:min(78vh,720px);overflow:auto}
@keyframes conciergeIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.concierge-head{display:grid;grid-template-columns:44px 1fr auto;gap:.8rem;align-items:center}
.concierge-head img{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:2px solid rgba(255,255,255,.2)}
.concierge-head strong{display:block;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--cyan)}
.concierge-head span{font-family:var(--font-display);font-size:1.25rem;line-height:1.1}
.concierge-close{border:0;background:transparent;color:#9A948C;font-size:1.2rem;cursor:pointer;padding:.2rem .4rem}
.concierge p{margin:0;color:#B8B2AA;font-size:.92rem}
.concierge .dots{display:flex;gap:.35rem}.concierge .dots i{width:22px;height:3px;border-radius:2px;background:rgba(237,231,222,.15)}.concierge .dots i.on{background:var(--spectrum)}
.concierge .q{font-family:var(--font-display);font-size:1.3rem;margin:0}
.concierge .choices{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
.concierge .choice{text-align:left;padding:.65rem .75rem;border:1px solid rgba(237,231,222,.16);border-radius:12px;background:rgba(237,231,222,.05);color:#fff;font:inherit;cursor:pointer;display:grid;gap:.1rem;transition:border-color .2s,transform .2s}
.concierge .choice:hover{border-color:var(--cyan);transform:translateY(-1px)}
.concierge .choice strong{font-size:.9rem;font-weight:600;line-height:1.2}
.concierge .choice small{color:#9A948C;font-size:.72rem;line-height:1.25}
.concierge .choice--wide{grid-column:1/-1}
.concierge .links{display:flex;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.concierge .btn-link{color:#9A948C;font-size:.85rem}
.concierge .result{display:grid;gap:.7rem}
.concierge .result h3{margin:0;font-size:1.4rem}
.concierge .result .offer{padding:.8rem .9rem;border:1px solid rgba(237,231,222,.16);border-radius:12px;background:rgba(237,231,222,.05)}
.concierge .result .offer b{display:block;font-family:var(--font-display);font-weight:500;font-size:1.1rem}
.concierge .result .offer em{font-style:normal;color:var(--cyan);font-size:.85rem}
.concierge .result ol{margin:0;padding-left:1.2rem;color:#B8B2AA;font-size:.88rem;display:grid;gap:.25rem}
.concierge .result .btn{justify-content:center}
.concierge .result .actions{display:grid;gap:.5rem}
@media (max-width:680px){.concierge{right:0;left:0;bottom:0;width:auto}.concierge-card{border-radius:20px 20px 0 0;max-height:82vh}.concierge-fab .fab-label{display:none}.concierge-fab{padding:.4rem;right:1rem;bottom:4.6rem}}

/* ============ Clear opening ============ */
#tour .chapter-inner--arrival{width:clamp(300px,34vw,520px)}
#tour .chapter--arrival h1{font-size:clamp(2.4rem,4.4vw,4.4rem)}
#tour .chapter--arrival .lede{max-width:40ch!important;font-size:1.02rem!important}
#tour .arrival-first{margin:.2rem 0 .6rem!important;padding:.75rem .9rem;border-left:2px solid var(--cyan);background:rgba(200,255,46,.07);border-radius:0 12px 12px 0;color:#EDE7DE!important;font-size:.95rem!important;max-width:44ch!important}
#tour .arrival-first b{color:var(--cyan);font-weight:700}
#tour .arrival-proof{margin:.9rem 0 0!important;font-size:.78rem!important;letter-spacing:.02em;color:#9A948C!important;max-width:none!important}
#tour .ladder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin:.8rem 0 .2rem}
#tour .rung{position:relative;padding:.6rem .7rem;border:1px solid rgba(237,231,222,.14);border-radius:10px;background:rgba(27,27,31,.5);display:grid;gap:.15rem}
#tour .rung b{font-size:.82rem;font-weight:700;color:#fff;line-height:1.2}
#tour .rung span{font-size:.7rem;color:#9A948C;line-height:1.25}
#tour .rung+.rung::before{content:'→';position:absolute;left:-.55rem;top:50%;transform:translateY(-50%);color:var(--cyan);font-size:.8rem}
#tour .arrival-who{margin:.6rem 0 .6rem!important}
#tour .chapter--arrival{min-height:135svh}
@media (max-width:680px){#tour .ladder{grid-template-columns:1fr}#tour .rung+.rung::before{content:'↓';left:.7rem;top:-.75rem;transform:none}#tour .chapter--arrival .chapter-inner{width:100%}}

/* ============ The menu ============ */
.menu{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:2rem;align-items:start}
.menu-groups{display:grid;gap:1.2rem}
.menu-group .eyebrow{margin-bottom:.5rem;color:var(--cyan)}
.menu-items{display:grid;gap:.4rem}
.menu-item{display:grid;grid-template-columns:22px 1fr;gap:.7rem;align-items:start;padding:.7rem .85rem;border:1px solid var(--line);border-radius:12px;background:rgba(27,27,31,.5);backdrop-filter:blur(10px);cursor:pointer;transition:border-color .2s,background .2s}
.menu-item:hover{border-color:var(--line-strong)}
.menu-item.on{border-color:var(--cyan);background:rgba(200,255,46,.08)}
.menu-item input{position:absolute;opacity:0;width:0;height:0}
.menu-item .box{width:20px;height:20px;border-radius:6px;border:1px solid var(--line-strong);display:grid;place-items:center;margin-top:.1rem}
.menu-item.on .box{background:var(--spectrum);border-color:transparent}
.menu-item.on .box::after{content:'✓';color:#1B1B1F;font-size:.8rem;font-weight:800}
.menu-item strong{display:block;font-size:.95rem;font-weight:600;line-height:1.25}
.menu-item small{display:block;color:var(--ink-3);font-size:.76rem;margin-top:.1rem}
.menu-side{display:grid;gap:1rem;position:sticky;top:5.5rem}
.menu-form{display:grid;gap:.8rem;padding:1rem;border:1px solid var(--line);border-radius:14px;background:rgba(27,27,31,.55)}
.menu-form .field label{font-size:.7rem}
.menu-form input,.menu-form select{padding:.6rem .7rem;font-size:.92rem}
.menu-preview{display:grid;gap:.7rem;padding:1rem;border:1px solid rgba(200,255,46,.35);border-radius:14px;background:rgba(27,27,31,.7);box-shadow:0 0 50px -30px var(--cyan)}
.menu-preview .brief{max-height:220px;font-size:.9rem;color:#EDE7DE}
.wa-ico{display:inline-block;color:#C8FF2E;font-size:.9rem;margin-right:.1rem}
@media (max-width:900px){.menu{grid-template-columns:1fr}.menu-side{position:static}}

/* Calm opening: the 3D stays subtle behind the first two screens, then takes over from the first floor */
.scene-shade{transition:background .8s ease}
body.tour-mode[data-floor="-1"] .scene-shade{background:linear-gradient(90deg,rgba(27,27,31,.9) 0%,rgba(27,27,31,.72) 34%,rgba(27,27,31,.18) 58%,rgba(27,27,31,0) 78%),linear-gradient(0deg,rgba(27,27,31,.7),transparent 26%,transparent 84%,rgba(27,27,31,.2))}
#tour .chapter--arrival{min-height:100svh;padding-top:6rem}
#tour .chapter--arrival h1{font-size:clamp(2.6rem,4.8vw,4.8rem)}
#tour .chapter--arrival .contact-actions{margin-top:.6rem}
#tour .chapter--arrival .button{margin-top:.4rem}
#tour .arrival-proof{margin-top:1.2rem!important}

@media (max-width:680px){body.tour-mode[data-floor="-1"] .scene-shade{background:linear-gradient(0deg,rgba(27,27,31,.9),rgba(27,27,31,.55) 45%,rgba(27,27,31,.05) 75%)}}

.scene-poster{display:grid;place-items:center}
.poster-go{pointer-events:auto;z-index:3}

/* ============================================================
   YOUS & CO. — la signature
   Le cadre de détection, la palette à trois valeurs et une
   fluorescence, et les deux mondes : l'encre et le papier.
   ============================================================ */

/* ---- Le cadre de détection ---- */
.ymark{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--s,34px);height:var(--s,34px);flex:none;overflow:hidden;line-height:1;vertical-align:middle;border-radius:calc(var(--s,34px)*.09)}
.ymark::before{content:'';position:absolute;inset:0;border:max(1px,calc(var(--s,34px)*.023)) solid var(--acid);pointer-events:none;z-index:2;border-radius:inherit}
.ymark i{font-family:var(--font-script);font-style:normal;font-size:calc(var(--s,34px)*.46);line-height:1;position:relative;z-index:1;transform:translate(-2.5%,-13%)}
.ymark b{position:absolute;left:max(1px,calc(var(--s,34px)*.023));right:max(1px,calc(var(--s,34px)*.023));bottom:max(1px,calc(var(--s,34px)*.023));height:19%;background:var(--acid);display:flex;align-items:center;justify-content:center;font-family:var(--font-label);font-weight:500;font-size:calc(var(--s,34px)*.10);letter-spacing:.2em;text-indent:.2em;line-height:1;color:var(--encre);white-space:nowrap;overflow:hidden;z-index:2}
.ymark em{position:absolute;left:-1px;bottom:100%;background:var(--acid);color:var(--encre);padding:.28em .6em;font-family:var(--font-mono);font-weight:500;font-size:calc(var(--s,34px)*.082);letter-spacing:.14em;font-style:normal;line-height:1;white-space:nowrap;z-index:2}
.ymark--ink{background:var(--encre)} .ymark--ink i{color:var(--nude)}
.ymark--paper{background:var(--paper)} .ymark--paper i{color:var(--encre)}
.ymark--acid{background:var(--acid)} .ymark--acid i{color:var(--encre)} .ymark--acid::before{border-color:var(--encre)} .ymark--acid b{background:var(--encre);color:var(--acid)}
.ymark--mono{background:var(--encre)} .ymark--mono i{color:var(--nude)} .ymark--mono::before{border-color:var(--nude)} .ymark--mono b{background:var(--nude);color:var(--encre)}
.ymark--bare b{display:none}
.ymark--bare i{transform:translate(-2.5%,0)}

/* ---- La signature complète, encadrée ---- */
.ysign{position:relative;display:inline-block;font-size:var(--s,64px);line-height:.94;padding:.26em .33em .46em .18em;margin-top:.34em}
.ysign::before{content:'';position:absolute;inset:0;border:2px solid var(--acid)}
.ysign i{position:relative;display:block;font-family:var(--font-script);font-style:normal;font-size:1em;line-height:.94}
.ysign em{position:absolute;left:-2px;bottom:100%;background:var(--acid);color:var(--encre);padding:3px 8px;font-family:var(--font-mono);font-weight:500;font-size:10.5px;letter-spacing:.14em;font-style:normal;line-height:1;white-space:nowrap}
.ysign b{position:absolute;right:-2px;top:100%;margin-top:-2px;background:var(--acid);color:var(--encre);padding:4px 9px;font-family:var(--font-label);font-weight:500;font-size:11px;letter-spacing:.4em;text-indent:.4em;line-height:1;white-space:nowrap}
.ysign--paper i{color:var(--encre)} .ysign--ink i{color:var(--nude)}

/* ---- Le lock-up horizontal ---- */
.ylock{display:inline-flex;align-items:center;gap:clamp(12px,1.6vw,18px)}
.ylock-rule{width:1px;height:clamp(40px,5vw,56px);background:var(--line-strong)}
.ylock-name{display:flex;flex-direction:column;gap:4px;min-width:0}
.ylock-name i{font-family:var(--font-script);font-style:normal;font-size:clamp(26px,3vw,38px);line-height:1}
.ylock-name b{font-family:var(--font-label);font-weight:300;font-size:8.5px;letter-spacing:.26em;color:var(--ink-2);padding-left:2px}

/* ---- Le bloc-marque de la barre ---- */
.wordmark{gap:.7rem;align-items:center}
.wordmark-mark{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:none;overflow:hidden;background:var(--encre);border-radius:3px}
.wordmark-mark::before{content:'';position:absolute;inset:0;border:1px solid var(--acid);pointer-events:none;z-index:2;border-radius:inherit}
.wordmark-mark i{font-family:var(--font-script);font-style:normal;font-size:16px;line-height:1;color:var(--nude);transform:translate(-3%,-13%)}
.wordmark-mark b{position:absolute;left:1px;right:1px;bottom:1px;height:19%;background:var(--acid);display:flex;align-items:center;justify-content:center;font-family:var(--font-label);font-weight:500;font-size:4.4px;letter-spacing:.2em;text-indent:.2em;line-height:1;color:var(--encre);z-index:2}
.wordmark-name{font-family:var(--font-script);font-size:1.6rem;line-height:.9;letter-spacing:0;display:flex;flex-direction:column;gap:.1rem}
.wordmark-name i{font-family:var(--font-label);font-style:normal;font-weight:300;font-size:.44rem;letter-spacing:.24em;color:var(--ink-2)}
.wordmark-sub{font-family:var(--font-label);font-weight:300;font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3)}

/* ---- Typographie de la maison ---- */
h1,h2,h3,.wordmark-name,.price,.stat b,.lift-code{font-family:var(--font-display)}
h1,h2,h3{font-weight:400;letter-spacing:-.008em}
h1 em,h2 em,#tour h1 em,#tour h2 em,.ind-h1 em{font-style:italic;font-weight:300;color:inherit;background:none;-webkit-text-fill-color:currentColor;animation:none}
.eyebrow,.tag,.floor-chip,.ba-tag,.agent-detail-kicker,.agent-card-index,.tour-location>span,.explore-hint,.wordmark-sub{font-family:var(--font-label);font-weight:400;letter-spacing:.22em;text-transform:uppercase}
.note,.small,.scene-caption,.footer-note,.tour-status,.agent-legend-item,.card .meta,.step .get strong,.stat small{font-family:var(--font-mono);letter-spacing:.1em}
body{font-family:var(--font-body);font-weight:400}

/* ---- Les deux mondes ---- */
body.page-mode{background:var(--nude)}
body.page-mode #main,body.page-mode .footer{background:var(--nude);position:relative;z-index:2}
body.page-mode .scene-layer{display:none}
body.page-mode .card,body.page-mode .journey,body.page-mode .demo,body.page-mode .menu-form,body.page-mode .menu-preview,body.page-mode .contact-book,body.page-mode .pain,body.page-mode .menu-item,body.page-mode .journey-details,body.page-mode .proto-tab,body.page-mode .stat,body.page-mode .logo-tile{background:var(--paper);border-color:var(--line);backdrop-filter:none;box-shadow:none}
body.page-mode .band{background:var(--encre);color:var(--nude);border:0}
body.page-mode .band h2,body.page-mode .band h3,body.page-mode .band .outcome h3{color:var(--nude)}
body.page-mode .band p,body.page-mode .band .lead,body.page-mode .band .muted{color:#B8B2AA}
body.page-mode .band-soft{background:var(--surface-2);backdrop-filter:none}
body.page-mode .topbar{background:rgba(237,231,222,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
body.tour-mode .topbar{background:linear-gradient(180deg,rgba(27,27,31,.82),rgba(27,27,31,.2));border-bottom:1px solid rgba(237,231,222,.12)}

/* ---- Boutons : encre et acide, jamais de dégradé ---- */
.btn,#tour .button{border-radius:2px;font-family:var(--font-label);font-weight:500;letter-spacing:.1em;text-transform:uppercase;font-size:.72rem}
.btn-solid,#tour .button--solid,.band .btn-solid,.btn-brass,.topbar .btn-solid,.sticky-cta .btn-solid{background:var(--encre);color:var(--acid);border:1px solid var(--encre);box-shadow:none;filter:none}
.btn-solid:hover,#tour .button--solid:hover{background:var(--acid);color:var(--encre);border-color:var(--acid);filter:none}
body.tour-mode .btn-solid,body.tour-mode #tour .button--solid{background:var(--acid);color:var(--encre);border-color:var(--acid)}
body.tour-mode .btn-solid:hover,body.tour-mode #tour .button--solid:hover{background:var(--nude);border-color:var(--nude)}
.btn-ghost,#tour .button--quiet{background:transparent;border:1px solid var(--line-strong);backdrop-filter:none}
.btn-ghost:hover,#tour .button--quiet:hover{border-color:var(--encre)}
body.tour-mode .btn-ghost:hover,body.tour-mode #tour .button--quiet:hover{border-color:var(--acid)}
.btn-link{font-family:var(--font-body);text-transform:none;letter-spacing:0}

/* ---- L'acide ne surligne pas, il signale ---- */
.stat::after,.progress-line span,.poster::after{background:var(--acid)}
.stat b{color:var(--acid);-webkit-text-fill-color:var(--acid);background:none}
body.page-mode .stat b{color:var(--encre);-webkit-text-fill-color:var(--encre)}
body.page-mode .stat::after{background:var(--acid)}
.card.featured{border-color:var(--acid);box-shadow:none}
.signal-dot,.tour-status i,.tour-status::before{background:var(--acid);box-shadow:none}
.lift{background:var(--encre)}
.lift-code{color:var(--acid);-webkit-text-fill-color:var(--acid);background:none}
.lift-line{background:var(--acid)}
.lift-name{font-family:var(--font-label);letter-spacing:.24em;color:#B8B2AA}
.concierge-fab{border-radius:2px;box-shadow:var(--shadow);background:var(--encre);color:var(--nude);border:1px solid var(--acid)}
.concierge-fab .fab-mark{background:var(--acid);color:var(--encre);border-radius:2px;font-family:var(--font-script)}
.concierge-card{border-radius:4px;border:1px solid var(--line-strong);border-top:2px solid var(--acid);border-image:none;background:var(--paper);color:var(--encre);backdrop-filter:none}
.concierge-card::before{display:none}
.concierge p,.concierge .choice small{color:var(--ink-2)}
.concierge .choice{background:var(--surface-2);border-color:var(--line);color:var(--encre);border-radius:2px}
.concierge .choice:hover{border-color:var(--acid)}
.concierge .dots i.on{background:var(--acid)}
.concierge-head img{border-color:var(--line-strong)}
.concierge-head strong{color:var(--ink-3);font-family:var(--font-mono);letter-spacing:.14em}
.concierge-head span{font-family:var(--font-display)}
.explore-btn,.chip-btn{border-radius:2px;border-color:var(--acid);box-shadow:none;font-family:var(--font-label);letter-spacing:.14em;text-transform:uppercase}
.explore-bar{border-radius:2px;background:rgba(27,27,31,.86);border-color:rgba(237,231,222,.2)}
.explore-floor{font-family:var(--font-display)}
.need-door,.menu-item,.proto-tab,.ind-card,.journey-details,.card,.pain,.stat,.logo-tile,.opt,.screen,.arc div,.mode,.demo,.journey{border-radius:3px}
#tour .need-door:hover{border-color:var(--acid)}
#tour .need-door--said{border-color:var(--acid);background:rgba(200,255,46,.08)}
#tour .need-door--said strong{color:var(--acid)}
.menu-item.on{border-color:var(--acid);background:rgba(200,255,46,.10)}
.menu-item.on .box{background:var(--acid);border-color:transparent}
.menu-item.on .box::after{color:var(--encre)}
.menu-item .box{border-radius:2px}
.menu-preview{border-color:var(--line-strong);box-shadow:none}
.wa-ico{color:var(--acid)}
.agent-card::after{background:var(--acid);opacity:.5}
.agent-spotlight{border-radius:4px;border-top:2px solid var(--acid);background:rgba(27,27,31,.94);box-shadow:var(--shadow)}
.agent-spotlight::before{display:none}
.agent-spotlight blockquote{font-family:var(--font-display);color:var(--nude)}
.rail a[data-active="true"] span{border-color:var(--acid);box-shadow:none;border-radius:0}
.poster{border-radius:3px;background:var(--pbg);color:var(--nude)}
.poster h3{font-family:var(--font-display)}
.poster:nth-child(2),.poster:nth-child(6){color:var(--encre)}
.poster:nth-child(2) p,.poster:nth-child(6) p{color:var(--ink-2)}
.poster:nth-child(4){color:var(--encre)}
.poster:nth-child(4) p{color:var(--ink-2)}
.poster .soon{background:var(--acid);color:var(--encre);border-radius:2px;font-family:var(--font-label)}
.ba-tag.r{background:var(--acid);color:var(--encre)}
.ba-tag.l{background:var(--encre);color:var(--nude)}
.ba-after{background:var(--encre)}
.ba-after .mock-h em{color:var(--acid);-webkit-text-fill-color:var(--acid);background:none}
.ba-after .mock-btn{background:var(--acid);color:var(--encre);border-radius:2px}
.arrival-proof,#tour .arrival-proof{font-family:var(--font-mono);letter-spacing:.06em}
#tour .arrival-first{border-left:2px solid var(--acid);padding-left:.9rem!important;background:transparent}
#tour .arrival-first b{color:var(--acid);font-weight:500}
.arrival-who,#tour .arrival-who{color:var(--acid)!important;font-family:var(--font-label);letter-spacing:.1em;text-transform:none}
.scroll-cue:after{background:var(--acid)}
.scroll-cue{border-color:rgba(237,231,222,.5)}
.field input:focus,.field select:focus,.field textarea:focus{outline-color:var(--acid)}
:focus-visible{outline-color:var(--acid)}
.skip{background:var(--acid);color:var(--encre)}
.logo-tile{display:grid;gap:1rem;place-items:center;align-content:center;min-height:210px}
.logo-tile.dark{background:var(--encre);color:var(--nude);border-color:transparent}
.logo-tile.paper{background:var(--paper);border:1px solid var(--line)}
.logo-tile small{font-family:var(--font-mono);letter-spacing:.14em;color:var(--ink-3);text-align:center}
.logo-tile .lock{display:none}

/* ---- La barre : le bloc-marque reste compact, la navigation tient sur une ligne ---- */
.wordmark-name{flex-direction:row;align-items:baseline;gap:.42rem;font-size:1.42rem}
.wordmark-name i{font-size:.42rem;letter-spacing:.22em;transform:translateY(-.15em)}
.wordmark-sub{display:none}
.topbar{padding-block:.6rem}
.nav{gap:.05rem}
.nav a{font-size:.8rem;padding:.42rem .55rem;font-family:var(--font-body);letter-spacing:0;text-transform:none}
.topbar .btn-sm{font-size:.64rem;padding:.55rem .8rem}
.tool-button{font-size:.7rem;font-family:var(--font-mono);letter-spacing:.08em}
@media (max-width:1180px){.nav a{font-size:.75rem;padding:.4rem .4rem}}

/* ---- Deux mondes déterministes : le papier ne suit pas le thème du système ---- */
body.page-mode,body:not(.tour-mode){
  --bg:#EDE7DE;--bg-2:#E4DED4;--surface:#FBF8F4;--surface-2:#F3EEE7;
  --ink:#1B1B1F;--ink-2:#55504B;--ink-3:#6E6862;
  --line:rgba(27,27,31,.10);--line-strong:rgba(27,27,31,.24);
  --lagoon:#1B1B1F;--lagoon-ink:#EDE7DE;--lagoon-mute:#9A948C;
  --brass:#1B1B1F;--brass-2:#C8FF2E;--cyan:#C8FF2E;--indigo:#55504B;--violet:#6E6862;--pink:#C8FF2E;--spectrum:#C8FF2E;
  --shadow:0 18px 44px -26px rgba(27,27,31,.42);
  color-scheme:light;background:#EDE7DE;color:#1B1B1F}
body.tour-mode{
  --bg:#1B1B1F;--bg-2:#232327;--surface:rgba(251,248,244,.05);--surface-2:#2A2A2E;
  --ink:#EDE7DE;--ink-2:#B8B2AA;--ink-3:#9A948C;
  --line:rgba(237,231,222,.14);--line-strong:rgba(237,231,222,.30);
  --lagoon:#1B1B1F;--lagoon-ink:#EDE7DE;--lagoon-mute:#9A948C;
  --brass:#C8FF2E;--brass-2:#C8FF2E;--cyan:#C8FF2E;--indigo:#9A948C;--violet:#B8B2AA;--pink:#C8FF2E;--spectrum:#C8FF2E;
  --shadow:0 18px 44px -26px rgba(0,0,0,.8);
  color-scheme:dark;background:#1B1B1F;color:#EDE7DE}
body.page-mode .page-head h1,body.page-mode #main h1,body.page-mode #main h2,body.page-mode #main h3{color:var(--encre)}
body.page-mode .band h1,body.page-mode .band h2,body.page-mode .band h3{color:var(--nude)}
body.page-mode .nav a,body.page-mode .tool-button,body.page-mode .lang-btn{color:var(--ink-2)}
body.page-mode .nav a:hover,body.page-mode .nav a[aria-current="page"]{color:var(--encre);background:var(--surface-2)}
body.page-mode .wordmark-name,body.page-mode .wordmark-name i{color:var(--encre)}
body.page-mode .footer{border-top:1px solid var(--line)}
body.page-mode .concierge-fab{background:var(--encre);color:var(--nude)}
body.page-mode .logo-tile.dark,body.tour-mode .logo-tile.dark{background:var(--encre);border-color:transparent}
body.page-mode .logo-tile.dark small,body.tour-mode .logo-tile.dark small{color:#9A948C}
body.page-mode .logo-tile.dark .ylock-name i{color:var(--nude)}
body.page-mode .logo-tile.dark .ylock-name b{color:#9A948C}

/* ============================================================
   LA SIGNATURE, CONSTRUCTION EXACTE
   Relevé au pixel sur la référence. Tout se dérive de --s, la
   largeur du cadre : hauteur .85, étiquettes .08, mot .5166.
   Les longueurs passent par calc(var(--s)*k) et non par em,
   qui se résoudrait sur la fonte de l'élément et non du cadre.
   ============================================================ */
.ysign{--w:var(--s,300px);position:relative;display:inline-block;width:var(--w);height:calc(var(--w)*.85);
  margin:calc(var(--w)*.095) 0;padding:0;line-height:normal;
  border:max(2px,calc(var(--w)*.008)) solid var(--acid);box-sizing:border-box}
.ysign::before{content:none}
.ysign i{position:absolute;display:block;white-space:nowrap;font-style:normal;
  font-family:var(--font-script);font-size:calc(var(--w)*.5166);line-height:1;
  left:calc(var(--w)*.0867);top:calc(var(--w)*.1111)}
.ysign em,.ysign b{position:absolute;display:flex;align-items:center;box-sizing:border-box;
  height:calc(var(--w)*.08);background:var(--acid);color:var(--encre);
  font-family:var(--font-mono);font-weight:500;font-size:calc(var(--w)*.042);
  letter-spacing:.14em;font-style:normal;line-height:1;white-space:nowrap;margin:0}
.ysign em{left:calc(-1*max(2px,var(--w)*.008));bottom:100%;padding:0 calc(var(--w)*.022)}
.ysign b{right:calc(-1*max(2px,var(--w)*.008));top:100%;padding:0 calc(var(--w)*.030);letter-spacing:.24em;text-indent:.24em}
.ysign--paper{background:var(--paper)} .ysign--paper i{color:var(--encre)}
.ysign--ink{background:var(--encre)} .ysign--ink i{color:#EDE7DE}

/* ---- Le Y seul, même construction : cadre fin, pied acide, lettre centrée
        dans la place qui reste au-dessus du pied. ---- */
.ymark{--w:var(--s,34px);width:var(--w);height:var(--w);border-radius:0;overflow:visible;display:block;position:relative;background:none}
.ymark::before{inset:0;border:max(1px,calc(var(--w)*.009)) solid var(--acid);border-radius:0}
.ymark i{position:absolute;display:block;transform:none;line-height:1;
  font-size:calc(var(--w)*.368);left:calc(var(--w)*.338);top:calc(var(--w)*.178)}
.ymark b{left:calc(var(--w)*.009);right:calc(var(--w)*.009);bottom:calc(var(--w)*.009);height:19%;
  font-family:var(--font-label);font-weight:500;font-size:calc(var(--w)*.095);letter-spacing:.2em;text-indent:.2em}
.ymark em{font-size:calc(var(--w)*.082);padding:.3em .7em;left:calc(-1*max(1px,var(--w)*.009))}
.ymark--ink{background:var(--encre)} .ymark--paper{background:var(--paper)} .ymark--acid{background:var(--acid)}
.wordmark-mark{border-radius:0;width:32px;height:32px}
.wordmark-mark::before{border-width:1px;border-radius:0}
.wordmark-mark i{position:absolute;left:10.8px;top:5.7px;font-size:11.8px;line-height:1;transform:none}
.wordmark-mark b{left:1px;right:1px;bottom:1px;height:19%;font-size:3.9px}