@font-face{ font-family:'Archivo'; font-style:normal; font-weight:100 900; font-display:swap;
    src:url(../fonts/archivo.woff2) format('woff2'); }
  @font-face{ font-family:'Archivo'; font-style:italic; font-weight:100 900; font-display:swap;
    src:url(../fonts/archivo-italic.woff2) format('woff2'); }
  @font-face{ font-family:'Hurricane'; font-style:normal; font-weight:400; font-display:swap;
    src:url(../fonts/hurricane.woff2) format('woff2'); }

  *,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

  /* Black and white only -- majorly white. Greys are tints of ink for legibility. */
  :root{
    --bg:#FFFFFF; --surface:#F6F5F3; --panel:#EDEBE7; --ink:#131313; --muted:#6E6E6E;
    --hair:#E4E2DE; --accent:#131313; --accent-2:#131313;
    --chip-bg:#131313; --chip-fg:#FFFFFF; --scrub-behind:#F2F1EF; --stroke:#C7C5C1;
    --sans:'Archivo',-apple-system,'Segoe UI',sans-serif;
    --serif:'Archivo',-apple-system,'Segoe UI',sans-serif; /* single typeface: see Master Chef badge for the one exception */
    --shadow:0 30px 60px -30px rgba(0,0,0,.18);
  }
  /* Light is the unconditional default. Dark applies only when the visitor
     opts in via the nav toggle (persisted as data-theme="dark"). */
  :root[data-theme="dark"]{
    --bg:#0C0C0C; --surface:#161616; --panel:#1E1E1E; --ink:#F4F3F1; --muted:#9C9C9C;
    --hair:#2A2A2A; --accent:#F4F3F1; --accent-2:#F4F3F1;
    --chip-bg:#F4F3F1; --chip-fg:#0C0C0C; --scrub-behind:#0C0C0C; --stroke:#414141; --shadow:0 34px 70px -30px rgba(0,0,0,.8);
  }
  :root[data-theme="light"]{
    --bg:#FFFFFF; --surface:#F6F5F3; --panel:#EDEBE7; --ink:#131313; --muted:#6E6E6E;
    --hair:#E4E2DE; --accent:#131313; --accent-2:#131313;
    --chip-bg:#131313; --chip-fg:#FFFFFF; --scrub-behind:#F2F1EF; --stroke:#C7C5C1; --shadow:0 30px 60px -30px rgba(0,0,0,.18);
  }

  /* ---------------- Type scale ----------------
     One fluid modular scale drives every size on the page.
     xs  labels/buttons | sm  meta | base  body | lg  lead
     xl  h4 | 2xl  h3 | 3xl  h2 | 4xl  h1 + display moments        */
  :root{
    --fs-xs:clamp(0.70rem, 0.10vw + 0.68rem, 0.76rem);
    --fs-sm:clamp(0.82rem, 0.20vw + 0.77rem, 0.90rem);
    --fs-base:clamp(0.98rem, 0.25vw + 0.92rem, 1.08rem);
    --fs-lg:clamp(1.12rem, 0.55vw + 0.99rem, 1.35rem);
    --fs-xl:clamp(1.40rem, 1.00vw + 1.15rem, 1.90rem);
    --fs-2xl:clamp(1.80rem, 2.00vw + 1.30rem, 2.60rem);
    --fs-3xl:clamp(2.30rem, 3.20vw + 1.45rem, 3.80rem);
    --fs-4xl:clamp(3.00rem, 6.50vw + 1.10rem, 6.40rem);
    --lh-tight:1.0; --lh-snug:1.15; --lh-body:1.7;
  }

  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
  body{
    font-family:var(--serif); background:var(--bg); color:var(--ink);
    line-height:var(--lh-body); font-size:var(--fs-base); overflow-x:hidden; -webkit-font-smoothing:antialiased;
  }

  /* ---------------- Base type hierarchy ---------------- */
  h1,h2,h3,h4,h5,h6{ font-family:var(--sans); font-weight:800; letter-spacing:-.03em;
    line-height:var(--lh-tight); text-wrap:balance; overflow-wrap:break-word; }
  h1{ font-size:var(--fs-4xl); }
  h2{ font-size:var(--fs-3xl); }
  h3{ font-size:var(--fs-2xl); line-height:var(--lh-snug); letter-spacing:-.025em; }
  h4{ font-size:var(--fs-xl); line-height:var(--lh-snug); letter-spacing:-.02em; }
  h5,h6{ font-size:var(--fs-lg); line-height:var(--lh-snug); letter-spacing:-.01em; }
  p{ font-size:var(--fs-base); line-height:var(--lh-body); }
  /* utilities */
  .u-display{ font-size:var(--fs-4xl); line-height:var(--lh-tight); letter-spacing:-.035em; }
  .u-lead{ font-size:var(--fs-lg); line-height:1.55; }
  .u-small{ font-size:var(--fs-sm); }
  .u-label{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs);
    letter-spacing:.22em; text-transform:uppercase; color:var(--muted); }
  .wrap{ max-width:1280px; margin:0 auto; padding:0 clamp(20px,4vw,60px); }
  .sans{ font-family:var(--sans); }
  ::selection{ background:var(--accent); color:var(--bg); }
  a{ color:inherit; text-decoration:none; }
  :focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:0; }

  .eyebrow{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.28em;
    text-transform:uppercase; color:var(--muted); }
  .meta{ font-family:var(--serif); font-style:italic; font-size:var(--fs-sm); color:var(--muted); letter-spacing:.01em; }
  .num-tab{ font-variant-numeric:tabular-nums; }

  /* ---------------- Nav ---------------- */
  .nav{ position:sticky; top:0; z-index:40; transition:background .3s, border-color .3s, backdrop-filter .3s; border-bottom:1px solid transparent; }
  .nav.solid{ background:color-mix(in srgb,var(--bg) 86%, transparent); backdrop-filter:blur(10px); border-bottom-color:var(--hair); }
  .nav-in{ display:flex; align-items:center; justify-content:space-between; height:70px; }
  .nav-left{ display:flex; align-items:center; gap:22px; }
  .dots{ display:inline-flex; gap:4px; }
  .dots i{ width:4px; height:4px; border-radius:0; background:var(--ink); display:block; }
  .brandmark{ font-family:var(--sans); font-weight:800; font-size:var(--fs-sm); letter-spacing:.02em; text-transform:uppercase; }
  .brandmark .amp{ color:var(--accent); }
  .nav-mid{ display:flex; gap:30px; align-items:center; }

  /* Brands dropdown */
  .nav-drop{ position:relative; }
  .nav-drop-btn{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.14em;
    text-transform:uppercase; color:var(--ink); background:none; border:0; cursor:pointer;
    padding:4px 0; display:inline-flex; align-items:center; gap:7px; position:relative; }
  .nav-drop-btn::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px;
    background:var(--accent); transition:width .25s; }
  .nav-drop:hover .nav-drop-btn::after, .nav-drop:focus-within .nav-drop-btn::after,
  .nav-drop.open .nav-drop-btn::after{ width:100%; }
  .nav-drop-btn .chev{ width:10px; height:7px; transition:transform .25s; }
  .nav-drop:hover .chev, .nav-drop:focus-within .chev, .nav-drop.open .chev{ transform:rotate(180deg); }
  .nav-drop-menu{ position:absolute; top:calc(100% + 16px); left:50%;
    transform:translate(-50%,-8px); min-width:238px; z-index:50;
    background:var(--bg); border:1px solid var(--hair); border-radius:0; padding:8px;
    display:flex; flex-direction:column; gap:2px;
    box-shadow:0 26px 54px -26px rgba(0,0,0,.4);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .22s ease, transform .22s ease, visibility .22s; }
  /* invisible bridge so the menu survives the gap under the button */
  .nav-drop-menu::before{ content:""; position:absolute; left:0; right:0; top:-18px; height:18px; }
  .nav-drop:hover .nav-drop-menu, .nav-drop:focus-within .nav-drop-menu,
  .nav-drop.open .nav-drop-menu{ opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0); }
  .nav-drop-menu a{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.1em;
    text-transform:uppercase; color:var(--ink); padding:10px 13px; border-radius:0;
    white-space:nowrap; transition:background .18s, color .18s; }
  .nav-drop-menu a:hover, .nav-drop-menu a:focus-visible{ background:var(--ink); color:var(--bg); }
  .nav-drop-menu .drop-all{ color:var(--muted); border-bottom:1px solid var(--hair);
    border-radius:0; margin-bottom:4px; padding-bottom:12px; }
  @media (prefers-reduced-motion:reduce){ .nav-drop-menu{ transition:none; } }
  .nav-mid a{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--ink); position:relative; padding:4px 0; white-space:nowrap; }
  .nav-mid a::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:var(--accent); transition:width .25s; }
  .nav-mid a:hover::after, .nav-mid a:focus-visible::after{ width:100%; }
  .nav-right{ display:flex; align-items:center; gap:18px; }
  .icn{ width:20px; height:20px; color:var(--ink); }
  .nav-cta{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xs); letter-spacing:.12em; text-transform:uppercase; border:1.5px solid var(--ink); border-radius:0; padding:8px 16px; transition:background .2s,color .2s; }
  .nav-cta:hover{ background:var(--ink); color:var(--bg); }
  .nav-mark{ display:flex; align-items:center; gap:13px; }
  .eros{ color:var(--ink); display:block; }
  .nav-mark .eros{ height:46px; width:auto; }
  .theme-toggle{ background:none; border:1.5px solid var(--ink); color:var(--ink); width:36px; height:36px; border-radius:0; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; transition:background .2s,color .2s; flex:none; }
  .theme-toggle:hover{ background:var(--ink); color:var(--bg); }
  .theme-toggle svg{ width:16px; height:16px; }
  .theme-toggle .moon{ display:none; } .theme-toggle .sun{ display:block; }
  .theme-toggle.is-dark .moon{ display:block; } .theme-toggle.is-dark .sun{ display:none; }
  .burger{ display:none; background:none; border:none; cursor:pointer; color:var(--ink); }
  @media (max-width:900px){ .nav-mid{ display:none; } .nav-cta{ display:none; } .burger{ display:inline-flex; } }

  .mnav{ position:fixed; inset:0; z-index:60; background:var(--bg); transform:translateY(-100%);
    transition:transform .4s cubic-bezier(.7,0,.2,1); display:flex; flex-direction:column;
    padding:20px clamp(20px,6vw,40px) 40px; overflow-y:auto; overscroll-behavior:contain; }
  .mnav.open{ transform:translateY(0); }
  /* full width: `margin:0 auto` from .wrap used to collapse this row to shrink-to-fit */
  .mnav-top{ display:flex; justify-content:space-between; align-items:center; width:100%; flex:none; min-height:50px; }
  .mnav-mark{ display:block; line-height:0; }
  .mnav-links{ margin-top:clamp(18px,3.5vh,36px); display:flex; flex-direction:column; width:100%; }
  .mnav-links > a, .mnav-group{ border-top:1px solid var(--hair); padding:15px 0; }
  .mnav-links > a:last-child{ border-bottom:1px solid var(--hair); }
  .mnav-links > a, .mnav-group-head{ font-family:var(--sans); font-weight:800; font-size:var(--fs-xl);
    letter-spacing:-.025em; line-height:1.1; display:block; color:var(--ink); }
  .mnav-sub{ display:grid; grid-template-columns:1fr 1fr; gap:2px 16px; margin-top:12px; }
  @media (max-width:400px){ .mnav-sub{ grid-template-columns:1fr; } }
  .mnav-sub a{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.12em;
    text-transform:uppercase; color:var(--muted); padding:7px 0; transition:color .18s; }
  .mnav-sub a:hover, .mnav-sub a:focus-visible{ color:var(--ink); }
  @media (prefers-reduced-motion:reduce){ .mnav{ transition:none; } }

  /* ---------------- Scroll-scrub ascent (hero) ---------------- */
  .scrub{ position:relative; height:420vh; }
  .scrub-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; background:var(--scrub-behind); }
  .scrub-sticky video{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; /* object-fit:contain; — swap if full frame must stay visible */
    filter:sepia(.14) contrast(1.02);
  }
  :root[data-theme="dark"] .scrub-sticky video{ filter:invert(.93) sepia(.22) contrast(1.04) !important; }
  :root[data-theme="light"] .scrub-sticky video{ filter:sepia(.14) contrast(1.02) !important; }
  .scrub-shade{ position:absolute; inset:0; pointer-events:none;
    background:
      linear-gradient(90deg, color-mix(in srgb,var(--bg) 84%,transparent) 0%, color-mix(in srgb,var(--bg) 40%,transparent) 42%, transparent 68%),
      linear-gradient(0deg, color-mix(in srgb,var(--bg) 76%,transparent) 0%, transparent 34%); }
  .stage .stage-title, .stage .stage-line, .stage .hero-sub, .stage .eyebrow, .stage .stage-sub{
    text-shadow: 0 0 10px var(--bg), 0 0 28px var(--bg), 0 2px 42px var(--bg); }
  .stage{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center;
    padding:0 clamp(20px,6vw,84px); opacity:0; transform:translateY(18px);
    transition:opacity .45s ease, transform .45s ease; pointer-events:none; }
  .stage.on{ opacity:1; transform:none; pointer-events:auto; }
  .stage .hero-eyebrow{ display:flex; align-items:center; gap:12px; margin-bottom:26px; }
  .stage .hero-eyebrow .ln{ width:44px; height:1px; background:var(--accent); }
  .stage .stage-title, .stage .stage-line{ font-size:var(--fs-4xl); letter-spacing:-.035em;
    line-height:.98; text-wrap:balance; max-width:12ch; }
  .stage .stage-line .soft{ font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:0; }
  .stage .stage-line .thin{ font-weight:500; }
  .stage .stage-line .dot{ color:var(--accent); }
  .hero-sub{ max-width:44ch; margin-top:28px; font-size:var(--fs-lg); color:var(--muted); line-height:1.65; }
  .hero-sub em{ color:var(--ink); font-style:italic; }
  .stage-2 .stage-line{ font-family:var(--serif); font-style:italic; font-weight:400;
    font-size:var(--fs-2xl); line-height:1.25; max-width:24ch; letter-spacing:0; }
  .stage-2 .stage-line b{ font-family:var(--sans); font-style:normal; font-weight:800; letter-spacing:-.02em; }
  /* Stage 1: centred title + tagline, sitting in the upper third */
  .stage-1{ align-items:center; text-align:center; justify-content:flex-start;
    padding-top:clamp(72px,16vh,180px); }
  .stage-1 .stage-title{ max-width:none; line-height:.98; }
  .vh{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
    clip-path:inset(50%); white-space:nowrap; border:0; }
  .stage-1 .stage-logo-h1{ font-size:0; line-height:0; display:flex; justify-content:center; }
  .stage-1 .stage-logo{ width:clamp(200px,27vw,360px); height:auto; color:var(--ink);
    filter:drop-shadow(0 0 14px var(--bg)) drop-shadow(0 0 36px var(--bg)); }
  .stage-1 .stage-sub{ margin-top:clamp(14px,2.2vw,24px); max-width:54ch;
    font-size:var(--fs-lg); font-weight:400; line-height:1.5;
    letter-spacing:.01em; color:var(--ink); }
  .scrub-hud{ position:absolute; right:clamp(18px,4vw,54px); bottom:26px; text-align:right; z-index:3; }
  .scrub-hud .pct{ font-family:var(--sans); font-weight:800; font-size:var(--fs-2xl);
    letter-spacing:-.02em; line-height:1; }
  .scrub-track{ position:absolute; right:clamp(8px,1.6vw,22px); top:50%; transform:translateY(-50%);
    width:2px; height:34vh; background:var(--hair); border-radius:0; overflow:hidden; }
  .scrub-track i{ display:block; width:100%; height:100%; background:var(--accent);
    transform-origin:top; transform:scaleY(0); }
  .scrub-hint{ transition:opacity .4s ease; position:absolute; left:clamp(20px,6vw,84px); bottom:26px; display:flex; align-items:center; gap:10px; }
  .hero-actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; align-items:center; }
  .btn{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xs); letter-spacing:.1em; text-transform:uppercase; border-radius:0; padding:14px 26px; display:inline-flex; align-items:center; gap:9px; transition:transform .2s, background .2s, color .2s, border-color .2s; }
  .btn-solid{ background:var(--ink); color:var(--bg); }
  .btn-solid:hover{ opacity:.84; }
  .btn-ghost{ border:1.5px solid var(--ink); color:var(--ink); }
  .btn-ghost:hover{ background:var(--ink); color:var(--bg); }
  .btn .arr{ transition:transform .2s; }
  .btn:hover .arr{ transform:translateX(4px); }

  .down{ width:26px; height:26px; border:1px solid var(--ink); border-radius:0; display:inline-flex; align-items:center; justify-content:center; animation:bob 2s ease-in-out infinite; flex:none; }
  @keyframes bob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(4px);} }

  /* ---------------- Marquee ---------------- */
  .marquee{ border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); overflow:hidden; padding:18px 0; background:var(--surface); }
  .marquee-track{ display:flex; gap:0; width:max-content; animation:scroll 44s linear infinite; }
  .marquee-track span{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xl); letter-spacing:-.01em; padding:0 30px; display:inline-flex; align-items:center; gap:30px; text-transform:uppercase; }
  .marquee-track span::after{ content:"\2726"; color:var(--accent); font-size:.55em; }
  @keyframes scroll{ to{ transform:translateX(-50%); } }

  /* ---------------- Intro strip (emblem + story) ---------------- */
  .intro{ padding:clamp(72px,12vw,160px) 0; text-align:center; background:var(--bg); }
  .intro .wrap{ display:flex; flex-direction:column; align-items:center; }
  .intro-mark{ color:var(--ink); width:clamp(150px,20vw,250px); height:auto; margin-bottom:clamp(30px,4.5vw,48px); }
  .intro-copy{ font-family:var(--serif); font-weight:400; font-size:var(--fs-lg); line-height:1.62; max-width:46rem; color:var(--ink); text-wrap:balance; }

  /* ---------------- Chef Eros (Meet the Chef) ---------------- */
  .chef{ background:var(--bg); color:var(--ink); padding:clamp(66px,9vw,124px) 0; overflow:hidden; }
  .chef-grid{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:clamp(30px,4.5vw,66px); }
  .chef-left{ max-width:36ch; }
  .chef-name{ line-height:1; margin-bottom:22px; }
  .chef-left p, .chef-right p{ font-family:var(--serif); font-weight:400; line-height:1.72; color:var(--muted); }
  .chef-left p + p{ margin-top:16px; }
  .chef-right{ max-width:34ch; }
  .chef-photo{ position:relative; width:clamp(250px,30vw,420px); flex:none; }
  .chef-frame{ aspect-ratio:413/480; overflow:hidden; background:var(--panel); }
  .chef-frame img{ width:100%; height:100%; object-fit:cover; object-position:center 22%; display:block; }
  @media (max-width:900px){
    .chef-grid{ grid-template-columns:1fr; justify-items:center; text-align:center; gap:clamp(30px,6vw,46px); }
    .chef-left, .chef-right{ max-width:46ch; }
    .chef-photo{ order:-1; }
  }

  /* ---------------- Brand stack (The House) ---------------- */
  .house{ padding:clamp(58px,8vw,96px) 0 clamp(90px,12vw,160px); background:var(--bg); }
  .house-head{ margin-bottom:clamp(28px,5vw,52px); text-align:center; display:flex;
    flex-direction:column; align-items:center; }
  .house-head h2{ font-family:var(--sans); font-weight:800; letter-spacing:-.025em; line-height:1; text-wrap:balance; }
  .house-head .meta{ margin-top:14px; }
  .stack{ display:flex; flex-direction:column; gap:clamp(20px,2.4vw,30px); }
  .hcard{ position:sticky; top:calc(92px + var(--i,0) * 18px);
    background:var(--bg); border:1.5px solid var(--stroke); border-radius:0; overflow:hidden;
    box-shadow:0 -16px 44px -26px rgba(0,0,0,.34);
    display:grid; grid-template-columns:1.06fr .94fr; min-height:min(552px,62vh); }
    /* grid items default to min-width:auto; combined with Safari's aspect-ratio/
     percent-height quirks this let the column grow wider than the card and the
     overflow:hidden frame cropped everything on the right/bottom (iPhone). */
  .hcard > *{ min-width:0; }
.hcard-body{ padding:clamp(28px,3.4vw,54px); display:flex; flex-direction:column; }
  .hcard-top{ display:flex; align-items:center; gap:14px; }
  .hcard-num{ font-family:var(--sans); font-weight:800; font-size:var(--fs-sm); letter-spacing:-.02em; }
  .hcard-kicker{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
  .hcard-name{ font-family:var(--sans); font-weight:800; letter-spacing:-.03em; line-height:.98; margin:auto 0 12px; padding-top:26px; }
  .hcard-tag{ font-family:var(--serif); font-style:italic; font-size:var(--fs-lg); margin-bottom:16px; color:var(--ink); }
  .hcard-copy{ font-family:var(--serif); line-height:1.72; color:var(--muted); max-width:48ch; }
  .hcard-cta{ margin-top:28px; align-self:flex-start; }
  .hcard-logo{ background:var(--lbg,#fff); display:flex; align-items:center; justify-content:center; padding:clamp(22px,3vw,46px); border-left:1.5px solid var(--stroke); }
  .hcard-logo img{ width:100%; height:auto; max-height:370px; object-fit:contain; }
  @media (max-width:820px){
    /* No sticky stacking on phones: a ~640px card plus a growing top offset
       runs past the visible viewport and clips the CTA. Let them flow. */
    .hcard{ position:static; grid-template-columns:1fr; min-height:0; border-radius:0; }
    .hcard-logo{ border-left:none; border-bottom:1.5px solid var(--stroke); order:-1;
      padding:clamp(18px,5vw,26px); }
    .hcard-logo img{ width:100%; height:auto; max-height:230px; object-fit:contain; }
    .hcard-name{ padding-top:20px; margin-top:0; }
  }
  @media (prefers-reduced-motion:reduce){ .hcard{ position:static; } }

  /* ---------------- Section shell ---------------- */
  section{ scroll-margin-top:80px; }
  .sec-head{ display:flex; justify-content:space-between; align-items:baseline; gap:20px; flex-wrap:wrap; margin-bottom:clamp(30px,5vw,56px); }
  .sec-title{ font-family:var(--sans); font-weight:800; letter-spacing:-.02em; line-height:1; }
  .sec-kicker{ display:flex; align-items:center; gap:12px; }
  .sec-kicker .ln{ width:36px; height:1px; background:var(--accent); }

  .chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
  .chip{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.05em; background:var(--chip-bg); color:var(--chip-fg); padding:7px 13px; border-radius:0; }
  .link-cta{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xs); letter-spacing:.08em; text-transform:uppercase; color:var(--ink); display:inline-flex; align-items:center; gap:10px; padding-bottom:5px; border-bottom:1.5px solid var(--accent); transition:gap .2s; }
  .link-cta:hover{ gap:16px; }

  .reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
  .reveal.in{ opacity:1; transform:none; }
  @media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; }
    .float,.marquee-track,.down{ animation:none !important; } }

  /* ---------------- Featured ---------------- */

  /* ---------------- Story ---------------- */
  @media (max-width:760px){ .story-cols{ grid-template-columns:1fr; } }

  /* ---------------- Reviews ---------------- */
  @media (max-width:900px){ .rev-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .rev-grid{ grid-template-columns:1fr; } }

  /* ---------------- Visit ---------------- */
  .visit{ padding:clamp(70px,11vw,150px) 0; text-align:left; }
  .visit h2{ font-family:var(--sans); font-weight:800; letter-spacing:-.04em; line-height:.9;
    font-size:var(--fs-4xl); text-wrap:balance; }
  .visit h2 .dot{ color:var(--accent); }
  .visit-row{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; margin-top:36px; }
  .visit-addr{ font-family:var(--serif); font-size:var(--fs-lg); line-height:1.55; max-width:30ch; }
  .visit-addr .co{ display:block; margin-top:6px; }
  .visit-actions{ display:flex; gap:14px; flex-wrap:wrap; }

  /* ---------------- Footer ---------------- */
  footer{ background:var(--ink); color:var(--bg); padding:clamp(50px,7vw,84px) 0 34px; }
  footer .eros{ color:var(--bg); }
  .foot-top{ display:grid; grid-template-columns:1fr 2fr; gap:clamp(32px,5vw,72px); align-items:start; }
  .foot-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,3vw,40px); }
  @media (max-width:860px){ .foot-top{ grid-template-columns:1fr; } .foot-cols{ grid-template-columns:1fr 1fr; } }
  @media (max-width:480px){ .foot-cols{ grid-template-columns:1fr; } }
  .foot-brand p{ margin-top:14px; font-style:italic; font-size:var(--fs-sm); color:color-mix(in srgb,var(--nav-fg,var(--bg)) 55%,transparent); }
  .foot-col h3{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xs); letter-spacing:.16em; text-transform:uppercase; color:var(--bg); margin-bottom:14px; line-height:var(--lh-snug); }
  .foot-col a{ display:block; font-size:var(--fs-sm); padding:6px 0; color:color-mix(in srgb,var(--bg) 82%,transparent); transition:color .2s; }
  .foot-col a:hover{ color:var(--bg); }
  .foot-note{ font-family:var(--serif); font-style:italic; font-size:var(--fs-xs); color:color-mix(in srgb,var(--bg) 45%,transparent); margin-top:6px; }
  /* the note is deliberately dim; lift the credit link out of it so it reads as a link */
  .foot-note a{ color:color-mix(in srgb,var(--bg) 78%,transparent); text-decoration:underline;
    text-underline-offset:3px; transition:color .2s; }
  .foot-note a:hover{ color:var(--bg); }
  .foot-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; margin-top:clamp(40px,6vw,70px); padding-top:24px; border-top:1px solid color-mix(in srgb,var(--bg) 18%,transparent); }
  .foot-bottom p{ font-family:var(--sans); font-size:var(--fs-xs); letter-spacing:.06em; color:color-mix(in srgb,var(--bg) 50%,transparent); }

  /* ---------------- Crest (external SVG, masked so it inherits colour) ---------------- */
  .crest-img{ display:block; aspect-ratio:304/255; background-color:currentColor;
    -webkit-mask:url(../img/crest.svg) no-repeat center/contain;
            mask:url(../img/crest.svg) no-repeat center/contain; }

  /* ---------------- Interior page shell ---------------- */
  .page-head{ padding:clamp(84px,11vw,150px) 0 clamp(34px,5vw,60px); text-align:center; }
  .page-head p{ color:var(--muted); max-width:60ch; margin:18px auto 0; }
  .page-sec{ padding:clamp(46px,7vw,96px) 0 clamp(76px,10vw,140px); }
  .prose{ max-width:66ch; margin:0 auto; }
  .prose p + p{ margin-top:1.1em; }
  .rule{ height:1px; background:var(--hair); border:0; margin:clamp(40px,6vw,72px) 0; }

  .media-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr)); gap:clamp(12px,1.6vw,20px); }
  .media-grid figure{ margin:0; border:1.5px solid var(--stroke); overflow:hidden; background:var(--surface); }
  .media-grid img{ width:100%; height:100%; aspect-ratio:4/5; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.7,.2,1); }
  .media-grid figure:hover img{ transform:scale(1.04); }
  .media-grid figcaption{ font-size:var(--fs-xs); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); padding:12px 14px; border-top:1.5px solid var(--stroke); }
  @media (prefers-reduced-motion:reduce){ .media-grid img{ transition:none; } .media-grid figure:hover img{ transform:none; } }

  .timeline{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr)); gap:clamp(18px,2.4vw,28px); }
  .tl-item{ border-top:1.5px solid var(--stroke); padding-top:18px; }
  .tl-year{ font-family:var(--sans); font-weight:800; font-size:var(--fs-xl); letter-spacing:-.02em; }
  .tl-name{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xs); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:6px; }
  .tl-item p{ margin-top:10px; color:var(--muted); font-size:var(--fs-sm); }

  .brand-hero{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; border-block:1.5px solid var(--stroke); }
  /* grid items default to min-width:auto, which refuses to shrink below min-content
     and blew the hero past the viewport on phones -- let them shrink. */
  .brand-hero > *{ min-width:0; }
  .brand-hero-txt h1{ overflow-wrap:break-word; }
  @media (max-width:860px){ .brand-hero{ grid-template-columns:1fr; } }
  .brand-hero-txt{ padding:clamp(34px,5vw,72px); display:flex; flex-direction:column; justify-content:center; }
  .brand-hero-txt .kicker{ font-family:var(--sans); font-weight:500; font-size:var(--fs-xs); letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; }
  .brand-hero-txt p{ color:var(--muted); margin-top:16px; max-width:46ch; }
  .brand-hero-logo{ display:flex; align-items:center; justify-content:center; padding:clamp(26px,4vw,56px); border-left:1.5px solid var(--stroke); }
  /* no aspect-ratio here: with a 330px-tall logo it forced the box ~668px wide.
     Let the image bound the height instead. */
  @media (max-width:860px){
    .brand-hero-logo{ border-left:0; border-top:1.5px solid var(--stroke); order:-1; padding:clamp(22px,6vw,40px); }
    .brand-hero-logo img{ max-height:min(220px,38vw); }
  }
  .brand-hero-logo img{ max-width:100%; max-height:330px; object-fit:contain; }

  .offer-list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr)); gap:clamp(16px,2vw,24px); list-style:none; }
  .offer-list li{ border-top:1.5px solid var(--stroke); padding-top:16px; }
  .offer-list b{ display:block; font-family:var(--sans); font-weight:800; font-size:var(--fs-lg); letter-spacing:-.02em; }
  .offer-list span{ display:block; color:var(--muted); font-size:var(--fs-sm); margin-top:6px; }

  .contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); }
  @media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } }
  .contact-row{ border-top:1.5px solid var(--stroke); padding:18px 0; }
  .contact-row dt{ font-family:var(--sans); font-weight:600; font-size:var(--fs-xs); letter-spacing:.16em; text-transform:uppercase; color:var(--muted); }
  .contact-row dd{ margin:8px 0 0; font-size:var(--fs-lg); }