:root{
    --bg: #08131E;
    --text: #F4F1EB;
    --text-soft: #C3C8CD;
    --text-mute: rgba(195,200,205,0.63);
    --brass: #B48A52;
    --marina: #5D8299;
    --caution: #D97757;
    --line: rgba(255,255,255,.09);

    --display: 'Instrument Serif', serif;
    --body: 'Manrope', sans-serif;

    --space-1: 8px; --space-2: 16px; --space-3: 24px; --space-4: 32px;
    --space-5: 40px; --space-6: 48px; --space-8: 64px; --space-10: 80px;
    --space-13: 104px; --space-15: 120px; --space-20: 160px;
  }
  @media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{ margin:0; background:var(--bg); color:var(--text); font-family:var(--body); line-height:1.6; -webkit-font-smoothing:antialiased; }
  ::selection{ background:var(--brass); color:var(--bg); }
  a{ color:inherit; }
  p{ font-size:17px; line-height:1.75; color:var(--text-soft); max-width:560px; }

  a:focus-visible, button:focus-visible, summary:focus-visible{ outline:1px solid var(--brass); outline-offset:3px; }

  /* ===== ACCESSIBILITY UTILITIES ===== */
  .sr-only{
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
  }
  .skip-link{
    position:absolute; left:var(--space-3); top:-60px; z-index:100;
    background:var(--brass); color:var(--bg); text-decoration:none;
    font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
    padding:12px 20px; border-radius:2px; transition:top .15s ease;
  }
  .skip-link:focus{ top:var(--space-3); }
  a[aria-disabled="true"]{ cursor:default; }

  .wrap{ max-width:1200px; margin:0 auto; padding:0 var(--space-4); }

  .eyebrow{
    font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
    color:var(--brass); display:flex; align-items:center; gap:12px;
  }
  .eyebrow::before{ content:""; width:20px; height:1px; background:var(--brass); display:inline-block; }

  h1,h2,h3{ font-family:var(--display); font-weight:400; margin:0; color:var(--text); }

  hr.hair{ border:none; border-top:1px solid var(--line); margin:0; }

  /* ===== NAV ===== */
  nav{ position:sticky; top:0; z-index:50; background:rgba(8,19,30,0.97); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
  nav .wrap{ display:flex; align-items:center; justify-content:space-between; height:74px; }
  .brand{ font-family:var(--display); font-size:19px; }
  .brand span{ color:var(--brass); }
  .navlinks{ display:flex; gap:var(--space-4); }
  .navlinks a{
    text-decoration:none; text-transform:uppercase; letter-spacing:.16em; font-size:11px;
    color:var(--text-mute); font-weight:500; padding-bottom:4px; border-bottom:1px solid transparent;
    transition:border-color .15s, color .15s;
  }
  .navlinks a:hover{ color:var(--text-soft); border-color:var(--brass); }

  /* ===== MOBILE NAV TOGGLE (hamburger) — hidden on desktop, shown <=900px ===== */
  .nav-toggle{
    display:none; align-items:center; justify-content:center;
    width:44px; height:44px; padding:0; flex:0 0 auto;
    background:transparent; border:1px solid rgba(244,241,235,0.28); border-radius:2px;
    cursor:pointer;
  }
  .nav-toggle-box{ position:relative; width:18px; height:14px; }
  .nav-toggle-bar,
  .nav-toggle-box::before,
  .nav-toggle-box::after{
    content:""; position:absolute; left:0; width:18px; height:1.5px;
    background:var(--text); transition:transform .18s ease, opacity .18s ease, top .18s ease;
  }
  .nav-toggle-bar{ top:6px; }
  .nav-toggle-box::before{ top:0; }
  .nav-toggle-box::after{ top:12px; }
  .nav-toggle.is-open .nav-toggle-bar{ opacity:0; }
  .nav-toggle.is-open .nav-toggle-box::before{ top:6px; transform:rotate(45deg); }
  .nav-toggle.is-open .nav-toggle-box::after{ top:6px; transform:rotate(-45deg); }

  /* Backdrop behind the mobile drawer — dims the page, absorbs outside clicks. */
  .nav-backdrop{
    position:fixed; inset:0; top:74px; z-index:45;
    background:rgba(8,19,30,0.55);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .18s ease, visibility 0s linear .18s;
  }
  .nav-backdrop.is-open{
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity .18s ease, visibility 0s linear 0s;
  }

  @media (max-width:900px){
    .nav-toggle{ display:inline-flex; }
    .navlinks{
      display:flex; flex-direction:column; gap:0;
      position:absolute; top:100%; left:0; right:0;
      max-height:calc(100vh - 74px); overflow-y:auto;
      background:rgba(8,19,30,0.97); backdrop-filter:blur(10px);
      border-bottom:1px solid var(--line);
      padding:var(--space-2) var(--space-5) var(--space-5);
      opacity:0; visibility:hidden; transform:translateY(-6px); pointer-events:none;
      transition:opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
    }
    .navlinks.is-open{
      opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto;
      transition:opacity .18s ease, transform .18s ease, visibility 0s linear 0s;
    }
    .navlinks a{
      padding:var(--space-3) 0; border-bottom:1px solid var(--line);
    }
    .navlinks a:last-child{ border-bottom:none; }
  }

  /* ===== BUTTONS — outline-first ===== */
  .btn{
    font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; text-decoration:none;
    height:48px; padding:0 26px; border-radius:2px;
    display:inline-flex; align-items:center; justify-content:center;
    border:1px solid rgba(244,241,235,0.28); color:var(--text);
    transition:border-color .15s ease, opacity .15s ease;
  }
  .btn:hover{ border-color:var(--brass); }
  .btn-solid{ background:var(--brass); border-color:var(--brass); color:var(--bg); }
  .btn-solid:hover{ border-color:#c39a63; background:#c39a63; }
  .btn:disabled{ opacity:.6; cursor:not-allowed; }
  .btn-solid:disabled:hover{ border-color:var(--brass); background:var(--brass); }
  .hero-cta{ display:flex; gap:var(--space-2); margin-top:var(--space-6); flex-wrap:wrap; }

  /* ===== CHART LINE (signature) ===== */
  .chart-col{ position:relative; }
  .chart-col::before{ content:""; position:absolute; left:-40px; top:0; bottom:0; width:0; border-left:1px dashed rgba(180,138,82,0.3); }
  .waypoint{ position:absolute; left:-46px; top:6px; width:8px; height:8px; border-radius:50%; background:var(--bg); border:1px solid var(--brass); }
  @media (max-width:960px){ .chart-col::before, .waypoint{ display:none; } }

  /* ===== HERO — ambient water motion ===== */
  .hero{
    position:relative; min-height:88vh; display:flex; align-items:center; overflow:hidden;
    background:var(--bg);
  }
  .hero .ripple{
    position:absolute; inset:-10%; z-index:0; opacity:.55;
    background:
      radial-gradient(ellipse 60% 40% at 20% 20%, rgba(85,122,145,0.16), transparent 60%),
      radial-gradient(ellipse 50% 35% at 80% 75%, rgba(180,138,82,0.10), transparent 60%),
      radial-gradient(ellipse 40% 30% at 60% 15%, rgba(85,122,145,0.10), transparent 60%);
    animation:drift 22s ease-in-out infinite alternate;
    background-size:140% 140%;
  }
  @keyframes drift{
    0%{ background-position:0% 0%, 100% 100%, 50% 0%; }
    100%{ background-position:8% 6%, 92% 94%, 46% 10%; }
  }
  .hero::after{
    content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
    background-image:
      repeating-linear-gradient(0deg, transparent 0 38px, rgba(244,241,235,0.014) 39px),
      repeating-linear-gradient(90deg, transparent 0 38px, rgba(244,241,235,0.014) 39px);
  }
  .hero-inner{ position:relative; z-index:2; padding:var(--space-20) 0 var(--space-15); }
  .hero .eyebrow{ margin-bottom:var(--space-4); }
  .hero h1{ font-size:clamp(40px, 6.2vw, 80px); line-height:1.05; max-width:17ch; }
  .hero h1 em{ font-style:italic; opacity:.95; }
  .hero p.lede{ font-size:19px; max-width:46ch; margin-top:var(--space-4); }

  /* ===== STATS ===== */
  .stats{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .stats .wrap{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3); padding:var(--space-6) var(--space-4); }
  .stat{ display:flex; flex-direction:column; gap:2px; }
  .stat b{ font-family:var(--display); font-size:42px; font-weight:400; color:var(--text); line-height:1; margin-bottom:var(--space-2); }
  .stat small{ font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--text-soft); }
  .stat small.dim{ color:var(--text-mute); font-weight:500; }
  @media (max-width:760px){ .stats .wrap{ grid-template-columns:repeat(2,1fr); } }

  /* ===== PHOTOGRAPHY REVEAL ===== */
  .reveal{
    position:relative; height:64vh; min-height:420px; overflow:hidden;
    background:
      linear-gradient(180deg, #0a1826 0%, #16232e 38%, #3a2f28 68%, #2a2118 100%);
  }
  .reveal svg{ position:absolute; bottom:0; left:0; width:100%; height:auto; opacity:.9; }
  .reveal .tag{
    position:absolute; left:var(--space-4); bottom:var(--space-4);
    font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:rgba(244,241,235,0.5);
  }

  /* ===== SECTION SCAFFOLD — no boxes ===== */
  section{ padding:var(--space-20) 0; }
  .section-head{ max-width:640px; margin-bottom:var(--space-10); }
  .section-head h2{ font-size:clamp(30px,3.8vw,46px); margin-top:var(--space-3); line-height:1.14; }
  .section-head p{ margin-top:var(--space-3); }

  /* ===== INTELLIGENCE ROW (was callout-grid) ===== */
  .intel-row{ display:flex; border-top:1px solid var(--line); }
  .intel{ flex:1; padding:var(--space-6) var(--space-4) 0 0; }
  .intel:not(:first-child){ border-left:1px solid var(--line); padding-left:var(--space-4); }
  .intel .figure{ font-family:var(--display); font-size:36px; color:var(--brass); display:block; margin-bottom:var(--space-1); line-height:1; }
  .intel .figure small{ font-family:var(--body); font-size:13px; color:var(--text-soft); font-weight:600; }
  .intel h3{ font-size:18px; margin-bottom:var(--space-2); font-family:var(--body); font-weight:600; }
  .intel p{ font-size:15px; }
  @media (max-width:860px){ .intel-row{ flex-direction:column; } .intel:not(:first-child){ border-left:none; border-top:1px solid var(--line); padding-left:0; padding-top:var(--space-5); } }

  .more-list{ margin-top:var(--space-8); padding-top:var(--space-5); border-top:1px solid var(--line); }
  .more-list .items{ display:flex; flex-wrap:wrap; gap:var(--space-1) var(--space-3); margin-top:var(--space-3); }
  .more-list .items span{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); }
  .more-list .items span::after{ content:"·"; margin-left:var(--space-3); color:var(--text-mute); }
  .more-list .items span:last-child::after{ content:""; }
  .more-list .note{ font-size:13px; color:var(--text-mute); margin-top:var(--space-3); max-width:none; }

  /* ===== TOOLS TEASER ===== */
  .tools-row{ display:flex; flex-direction:column; border-top:1px solid var(--line); }
  .tool{ display:flex; justify-content:space-between; align-items:baseline; gap:var(--space-4); padding:var(--space-4) 0; border-bottom:1px solid var(--line); }
  .tool h3{ font-size:20px; font-family:var(--display); font-weight:400; transition:color .15s; }
  a.tool{ text-decoration:none; color:inherit; cursor:pointer; }
  a.tool:hover h3{ color:var(--brass); }
  a.tool .read-more, .quad .read-more, a.life .read-more{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--brass); margin-top:8px; }
  a.tool .read-more .arrow, .quad .read-more .arrow, a.life .read-more .arrow{ transition:transform .15s; }
  a.tool:hover .read-more .arrow, .quad:hover .read-more .arrow, a.life:hover .read-more .arrow{ transform:translateX(3px); }
  a.life{ text-decoration:none; color:inherit; cursor:pointer; }
  a.life:hover h3{ color:var(--brass); }
  .tool p{ font-size:14.5px; margin:0; max-width:420px; }
  .tool .status{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--marina); white-space:nowrap; }
  @media (max-width:700px){ .tool{ flex-direction:column; gap:var(--space-1); } }

  /* ===== QUADRANTS — plain rows, no boxes ===== */
  .quad-row{ display:flex; flex-wrap:wrap; border-top:1px solid var(--line); }
  .quad{ width:50%; padding:var(--space-5) var(--space-4) var(--space-5) 0; display:block; text-decoration:none; color:inherit; }
  .quad:nth-child(odd){ padding-right:var(--space-6); }
  .quad:nth-child(odd){ border-right:1px solid var(--line); }
  .quad:nth-child(3), .quad:nth-child(4){ border-top:1px solid var(--line); padding-top:var(--space-5); }
  .quad .compass{ font-size:11px; font-weight:600; color:var(--text-mute); letter-spacing:.14em; text-transform:uppercase; }
  .quad h3{ font-size:25px; margin:var(--space-2) 0 var(--space-2); transition:color .15s; }
  .quad:hover h3{ color:var(--brass); }
  .quad p{ font-size:15.5px; }
  @media (max-width:760px){ .quad{ width:100%; border-right:none !important; padding-right:0 !important; } .quad:nth-child(2){ border-top:1px solid var(--line); padding-top:var(--space-5); } }

  /* ===== NEIGHBORHOODS — plain list ===== */
  .nbhd-list{ border-top:1px solid var(--line); }
  .nbhd{ display:flex; gap:var(--space-6); padding:var(--space-4) 0; border-bottom:1px solid var(--line); align-items:baseline; flex-wrap:wrap; text-decoration:none; color:inherit; }
  .nbhd h3{ transition:color .15s; }
  .nbhd:hover h3{ color:var(--brass); }
  .nbhd .tag{ font-size:11px; font-weight:600; color:var(--brass); text-transform:uppercase; letter-spacing:.1em; width:180px; flex:none; }
  .nbhd h3{ font-size:20px; width:200px; flex:none; font-family:var(--display); font-weight:400; }
  .nbhd p{ font-size:15px; margin:0; flex:1; min-width:220px; }

  /* ===== LIFESTYLE — plain row ===== */
  .life-row{ display:flex; border-top:1px solid var(--line); }
  .life{ flex:1; padding:var(--space-5) var(--space-4) 0 0; }
  .life:not(:first-child){ border-left:1px solid var(--line); padding-left:var(--space-4); }
  .life .num{ font-family:var(--display); font-size:20px; color:var(--marina); }
  .life h3{ font-size:18px; margin:var(--space-2) 0 var(--space-2); font-family:var(--body); font-weight:600; }
  .life p{ font-size:14.5px; }
  @media (max-width:860px){ .life-row{ flex-direction:column; } .life:not(:first-child){ border-left:none; border-top:1px solid var(--line); padding-left:0; padding-top:var(--space-5); } }

  /* ===== ABOUT ===== */
  .about-grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:var(--space-10); align-items:start; }
  .portrait{
    aspect-ratio:4/5; border:1px solid var(--line); border-radius:2px;
    background:linear-gradient(160deg, rgba(180,138,82,0.14), rgba(8,19,30,0.97));
    display:flex; align-items:flex-end; padding:var(--space-4);
  }
  .portrait .cap{ font-size:11px; color:var(--text-mute); letter-spacing:.05em; }
  .credentials{ list-style:none; padding:0; margin:var(--space-5) 0 0; display:grid; gap:var(--space-3); }
  .credentials li{ display:flex; gap:var(--space-2); align-items:flex-start; font-size:15px; color:var(--text-soft); max-width:520px; }
  .credentials li::before{ content:"—"; color:var(--brass); flex:none; }
  .human-moment{ margin-top:var(--space-6); padding-top:var(--space-5); border-top:1px solid var(--line); }
  .human-moment blockquote{
    font-family:var(--display); font-style:italic; font-size:23px; line-height:1.5; color:var(--text); margin:0; max-width:540px;
  }
  .human-moment .flag{ font-size:11px; color:var(--text-mute); letter-spacing:.05em; margin-top:var(--space-2); }

  /* ===== TESTIMONIALS — plain, no boxes ===== */
  .testi-cols{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-8); border-top:1px solid var(--line); padding-top:var(--space-6); }
  .testi p{ font-size:15.5px; font-style:italic; max-width:none; }
  .testi b{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--brass); display:block; margin-top:var(--space-3); font-weight:600; }
  @media (max-width:760px){ .testi-cols{ grid-template-columns:1fr; gap:var(--space-5); } }

  /* ===== FINAL CTA — the one solid button lives here ===== */
  .final-cta{ text-align:center; padding:var(--space-20) 0; border-top:1px solid var(--line); }
  .final-cta h2{ font-size:clamp(32px,4.6vw,52px); max-width:15ch; margin:var(--space-4) auto 0; }
  .final-cta .hero-cta{ justify-content:center; margin-top:var(--space-6); }

  /* ===== ROTATING CONTENT SLOT ===== */
  .content-slot{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:var(--space-5) 0; }
  .slot-card{
    display:flex; align-items:baseline; gap:var(--space-4); text-decoration:none;
    color:inherit; opacity:0; transition:opacity .4s ease;
  }
  .slot-card.is-visible{ opacity:1; }
  .slot-tag{
    flex:none; width:150px; font-size:11px; font-weight:600; letter-spacing:.12em;
    text-transform:uppercase; color:var(--brass);
  }
  .slot-text{ flex:1; font-family:var(--display); font-size:20px; color:var(--text); transition:color .15s; }
  .slot-card:hover .slot-text{ color:var(--brass); }
  .slot-arrow{ flex:none; font-size:13px; color:var(--text-mute); transition:transform .15s; }
  .slot-card:hover .slot-arrow{ transform:translateX(3px); color:var(--brass); }
  @media (max-width:700px){
    .slot-card{ flex-direction:column; gap:var(--space-2); }
    .slot-tag{ width:auto; }
  }

  /* ===== FOOTER ===== */
  footer{ border-top:1px solid var(--line); padding:var(--space-8) 0 var(--space-5); font-size:13px; color:var(--text-mute); }
  .foot-grid{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--space-4); padding-bottom:var(--space-4); border-bottom:1px solid var(--line); margin-bottom:var(--space-3); }
  .foot-areas a{ text-decoration:none; opacity:.8; margin-right:var(--space-2); font-size:12.5px; }
  .foot-areas a:hover{ opacity:1; color:var(--brass); }
  .foot-areas .foot-area-text{ display:inline-block; opacity:.65; margin-right:var(--space-2); font-size:12.5px; }
  .social-row a{ color:var(--text-mute); display:inline-flex; transition:color .15s; }
  .social-row a:hover{ color:var(--brass); }
  .fine{ font-size:11px; opacity:.7; max-width:760px; }

  /* ===== ARTICLE / BLOG POST PAGES ===== */
  .breadcrumb{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); }
  .breadcrumb a{ text-decoration:none; color:var(--text-mute); }
  .breadcrumb a:hover{ color:var(--brass); }
  .article-header{ max-width:760px; padding:var(--space-13) 0 var(--space-8); }
  .article-header .eyebrow{ margin:var(--space-4) 0 var(--space-3); }
  .article-header h1{ font-size:clamp(32px,4.6vw,52px); line-height:1.12; }
  .article-meta{ display:flex; gap:var(--space-3); margin-top:var(--space-4); font-size:12px; color:var(--text-mute); letter-spacing:.04em; text-transform:uppercase; }
  .article-body{ max-width:700px; padding-bottom:var(--space-15); }
  .article-body h2{ font-size:26px; margin-top:var(--space-8); margin-bottom:var(--space-3); font-weight:400; }
  .article-body h3{ font-size:19px; font-family:var(--body); font-weight:600; margin-top:var(--space-6); margin-bottom:var(--space-2); color:var(--text); }
  .article-body p{ max-width:none; margin-bottom:var(--space-3); }
  .article-body ul{ margin:0 0 var(--space-4); padding-left:1.2em; color:var(--text-soft); font-size:17px; line-height:1.8; }
  .article-body li{ margin-bottom:6px; }
  .article-body a{ color:var(--brass); text-decoration:underline; }
  .fact-table{ width:100%; border-collapse:collapse; margin:var(--space-4) 0 var(--space-6); font-size:15px; }
  .fact-table th, .fact-table td{ text-align:left; padding:10px 14px; border-bottom:1px solid var(--line); }
  .fact-table th{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-mute); font-weight:600; }
  .source-box{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:var(--space-4) 0; margin:var(--space-8) 0; font-size:14px; color:var(--text-mute); }
  .source-box a{ color:var(--brass); }
  .article-cta{ border-top:1px solid var(--line); padding-top:var(--space-6); margin-top:var(--space-6); }
  .article-cta h3{ font-family:var(--display); font-size:24px; font-weight:400; color:var(--text); margin-bottom:var(--space-3); }

  /* ===== LEGAL DISCLOSURES (collapsible) ===== */
  .foot-utility{ margin-top:var(--space-3); display:flex; gap:var(--space-3); flex-wrap:wrap; }
  .foot-utility a{ font-size:11px; letter-spacing:.04em; color:var(--text-mute); text-decoration:none; }
  .foot-utility a:hover{ color:var(--brass); }
  .legal-disclosures{ margin-top:var(--space-4); border-top:1px solid var(--line); padding-top:var(--space-3); }
  .legal-disclosures summary{
    cursor:pointer; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
    color:var(--text-mute); list-style:none; display:flex; align-items:center; gap:8px;
  }
  .legal-disclosures summary::-webkit-details-marker{ display:none; }
  .legal-disclosures summary:hover{ color:var(--text-soft); }
  .legal-disclosures summary::before{ content:"+"; color:var(--brass); font-size:13px; }
  .legal-disclosures[open] summary::before{ content:"\2212"; }
  .legal-disclosures .legal-body{
    margin-top:var(--space-3); font-size:11px; line-height:1.7; color:var(--text-mute);
    max-width:none; display:grid; gap:var(--space-3);
  }
  .legal-disclosures .legal-body a{ color:var(--text-mute); text-decoration:underline; }
  .legal-disclosures .legal-body a:hover{ color:var(--brass); }

  /* ===== TOOL / CALCULATOR WIDGETS ===== */
  .tool-widget{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:var(--space-6) 0; margin:var(--space-6) 0; }
  .tool-form{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-4) var(--space-5); max-width:640px; }
  .field{ display:flex; flex-direction:column; gap:8px; }
  .field.full{ grid-column:1 / -1; }
  .field label{
    font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--brass);
    display:flex; align-items:center; gap:10px;
  }
  .field label::before{ content:""; width:14px; height:1px; background:var(--brass); display:inline-block; }
  .field .hint{ font-size:12px; color:var(--text-mute); margin-top:2px; }
  .field input[type="number"], .field input[type="text"], .field select{
    font-family:var(--body); font-size:16px; color:var(--text); background:transparent;
    border:1px solid rgba(244,241,235,0.28); border-radius:2px; padding:12px 14px; height:46px;
    width:100%; appearance:none;
  }
  .field select{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23B48A52' stroke-width='1.5'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 12px center; background-size:16px; padding-right:36px;
  }
  .field select option{ background:var(--bg); color:var(--text); }
  .field input:focus-visible, .field select:focus-visible{ outline:1px solid var(--brass); outline-offset:2px; border-color:var(--brass); }
  .field-row{ display:flex; gap:var(--space-2); }
  .field-row .field{ flex:1; }
  .tool-actions{ grid-column:1 / -1; margin-top:var(--space-2); }
  .tool-widget .btn{ cursor:pointer; background:transparent; font-family:var(--body); }

  .tool-result{
    margin-top:var(--space-6); padding-top:var(--space-5); border-top:1px solid var(--line);
    display:none;
  }
  .tool-result.is-visible{ display:block; }
  .tool-result .verdict{ font-family:var(--display); font-size:28px; line-height:1.25; max-width:34ch; }
  .tool-result .verdict.ok{ color:var(--brass); }
  .tool-result .verdict.warn{ color:var(--caution); }
  .tool-result .verdict.neutral{ color:var(--marina); }
  .tool-result .detail{ margin-top:var(--space-3); font-size:15px; color:var(--text-soft); max-width:560px; }
  .tool-result .detail strong{ color:var(--text); }
  .result-rows{ margin-top:var(--space-4); border-top:1px solid var(--line); }
  .result-row{ display:flex; justify-content:space-between; gap:var(--space-4); padding:10px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
  .result-row span:first-child{ color:var(--text-mute); }
  .result-row span:last-child{ color:var(--text); font-weight:600; }
  .field-error{ font-size:12px; color:var(--caution); margin-top:4px; display:none; }
  .field-error.is-visible{ display:block; }
  @media (max-width:640px){ .tool-form{ grid-template-columns:1fr; } .field-row{ flex-direction:column; } }

  /* ===== FAQ ACCORDION ===== */
  .faq-group{ margin-top:var(--space-8); }
  .faq-group h2{ font-size:24px; margin-bottom:var(--space-1); }
  .faq-group .faq-count{ font-size:12px; color:var(--text-mute); letter-spacing:.06em; text-transform:uppercase; margin-bottom:var(--space-4); display:block; }
  .faq-list{ border-top:1px solid var(--line); }
  .faq-item{ border-bottom:1px solid var(--line); padding:var(--space-3) 0; }
  .faq-item summary{
    cursor:pointer; font-family:var(--display); font-size:19px; font-weight:400; color:var(--text);
    list-style:none; display:flex; justify-content:space-between; align-items:baseline; gap:var(--space-3);
  }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary:hover{ color:var(--brass); }
  .faq-item summary::after{ content:"+"; color:var(--brass); font-size:20px; flex:none; font-family:var(--body); }
  .faq-item[open] summary::after{ content:"\2212"; }
  .faq-item .faq-answer{ margin-top:var(--space-3); font-size:15.5px; color:var(--text-soft); line-height:1.7; max-width:640px; }
  .faq-item .faq-answer a{ color:var(--brass); }
  .faq-item .faq-source{ display:inline-block; margin-top:var(--space-2); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); text-decoration:none; }
  .faq-item .faq-source:hover{ color:var(--brass); }

  /* ===== HUB CARDS ===== */
  .hub-grid{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
  .hub-card{ padding:var(--space-6) var(--space-5); border-right:1px solid var(--line); border-bottom:1px solid var(--line); text-decoration:none; color:inherit; display:flex; flex-direction:column; }
  .hub-card .hub-icon{ width:34px; height:34px; border:1px solid var(--brass); border-radius:50%; display:flex; align-items:center; justify-content:center; margin-bottom:var(--space-4); flex:none; }
  .hub-card h3{ font-size:20px; margin-bottom:var(--space-2); transition:color .15s; }
  .hub-card:hover h3{ color:var(--brass); }
  .hub-card p{ font-size:14px; max-width:none; flex:1; }
  .hub-card .status{ font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--marina); margin-top:var(--space-3); }
  .hub-card.is-soon .hub-icon{ border-color:var(--text-mute); }
  .hub-card.is-soon h3{ color:var(--text-mute); }
  .hub-card.is-soon:hover h3{ color:var(--text-mute); }
  .hub-card.is-soon .status{ color:var(--text-mute); }
  @media (max-width:900px){ .hub-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:640px){ .hub-grid{ grid-template-columns:1fr; } }

  /* ===== JOURNEY TIMELINE ===== */
  .journey{ border-top:1px solid var(--line); }
  .journey-stage{ display:flex; gap:var(--space-5); padding:var(--space-5) 0; border-bottom:1px solid var(--line); }
  .journey-stage .stage-num{ font-family:var(--display); font-size:32px; color:var(--brass); flex:none; width:56px; line-height:1; }
  .journey-stage .stage-body h3{ font-size:19px; font-family:var(--display); font-weight:400; margin-bottom:6px; }
  .journey-stage .stage-body p{ font-size:14.5px; margin:0 0 10px; max-width:520px; }
  .journey-stage .stage-body a.stage-link{ font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--brass); text-decoration:none; }
  .journey-stage .stage-body a.stage-link:hover{ text-decoration:underline; }
  .journey-stage.is-cta .stage-num{ color:var(--marina); }
  @media (max-width:640px){ .journey-stage{ gap:var(--space-3); } .journey-stage .stage-num{ width:40px; font-size:24px; } }

  /* ===== RELATED GUIDES ===== */
  .related-guides{ border-top:1px solid var(--line); margin-top:var(--space-8); padding-top:var(--space-5); }
  .related-guides .eyebrow{ margin-bottom:var(--space-3); }
  .related-guides ul{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
  .related-guides li{ margin:0; }
  .related-guides a{ font-size:15px; color:var(--text); text-decoration:none; display:inline-flex; align-items:center; gap:8px; }
  .related-guides a:hover{ color:var(--brass); }
  .related-guides a::after{ content:"→"; color:var(--brass); font-size:13px; }

  /* ===== CHECKLIST ===== */
  .checklist{ border-top:1px solid var(--line); margin-top:var(--space-6); }
  .checklist-item{ border-bottom:1px solid var(--line); }
  .checklist-label{ display:flex; align-items:flex-start; gap:var(--space-4); padding:var(--space-4) 0; cursor:pointer; }
  .checklist-check{ appearance:none; -webkit-appearance:none; width:22px; height:22px; flex:none; margin-top:2px; border:1px solid var(--line); border-radius:3px; position:relative; cursor:pointer; background:transparent; }
  .checklist-check:checked{ border-color:var(--brass); background:var(--brass); }
  .checklist-check:checked::after{ content:""; position:absolute; left:6px; top:2px; width:6px; height:11px; border:solid var(--bg); border-width:0 2px 2px 0; transform:rotate(40deg); }
  .checklist-check:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }
  .checklist-num{ font-family:var(--display); font-size:15px; color:var(--text-mute); flex:none; width:22px; padding-top:1px; }
  .checklist-text{ flex:1; }
  .checklist-text strong{ display:block; font-size:16px; color:var(--text); font-weight:600; transition:color .15s; }
  .checklist-label:has(.checklist-check:checked) .checklist-text strong{ color:var(--text-mute); text-decoration:line-through; text-decoration-color:var(--line); }
  .checklist-hint{ display:block; font-size:13.5px; color:var(--text-mute); margin-top:4px; line-height:1.6; max-width:560px; }
  .checklist-hint a{ color:var(--brass); }
  .checklist-progress{ display:flex; align-items:center; gap:var(--space-4); margin-top:var(--space-6); }
  .checklist-progress-bar{ flex:1; height:4px; background:var(--line); border-radius:2px; overflow:hidden; }
  .checklist-progress-fill{ height:100%; width:0%; background:var(--brass); transition:width .25s ease; }
  .checklist-progress p{ font-size:13px; color:var(--text-mute); white-space:nowrap; margin:0; }
  @media (max-width:640px){ .checklist-label{ gap:var(--space-3); } }

  /* ===== PROPERTY INTELLIGENCE REPORT ===== */
  .pir-header{ border-bottom:1px solid var(--line); padding-bottom:var(--space-5); }
  .pir-header h1{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-3); }
  .pir-meta{ font-size:15px; color:var(--text-mute); margin-top:6px; }
  .pir-badge{ display:inline-flex; align-items:center; font-family:var(--body); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:5px 12px; border-radius:20px; border:1px solid; vertical-align:middle; }
  .pir-badge.is-demo{ color:var(--caution); border-color:var(--caution); background:rgba(217,119,87,.08); }
  .pir-badge.is-info{ color:var(--marina); border-color:var(--marina); background:rgba(93,130,153,.08); }
  .pir-badge.is-good{ color:#7CB88F; border-color:#7CB88F; background:rgba(124,184,143,.08); }
  .pir-notice{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:var(--space-4) 0; margin:var(--space-6) 0; font-size:14px; color:var(--text-mute); }
  .pir-notice strong{ color:var(--text-soft); }
  .pir-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:var(--space-6); }
  .pir-panel{ background:var(--bg); padding:var(--space-5); }
  .pir-panel.span-2{ grid-column:1 / -1; }
  .pir-panel-head{ display:flex; align-items:center; gap:12px; margin-bottom:var(--space-3); }
  .pir-panel-head .pir-icon{ width:30px; height:30px; border:1px solid var(--brass); border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; color:var(--brass); }
  .pir-panel-head h2{ font-size:18px; font-family:var(--display); font-weight:400; margin:0; }
  .pir-panel .result-rows{ margin-top:0; }
  .pir-compass{ display:flex; align-items:center; gap:var(--space-5); flex-wrap:wrap; }
  .pir-compass svg{ flex:none; }
  .pir-compass-detail{ flex:1; min-width:180px; font-size:14px; color:var(--text-mute); }
  .pir-compass-detail p{ font-size:14px; color:var(--text-mute); margin:0 0 6px; }
  .pir-amenity-list{ display:grid; gap:2px; }
  .pir-amenity{ display:flex; justify-content:space-between; align-items:baseline; gap:var(--space-3); padding:9px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
  .pir-amenity:last-child{ border-bottom:none; }
  .pir-amenity .name{ color:var(--text); }
  .pir-amenity .dist{ color:var(--text-mute); font-size:12.5px; white-space:nowrap; }
  .pir-observations{ border-left:2px solid var(--brass); padding:var(--space-2) 0 var(--space-2) var(--space-4); font-size:15.5px; color:var(--text-soft); line-height:1.75; font-style:italic; }
  .pir-observations cite{ display:block; margin-top:var(--space-3); font-size:12.5px; font-style:normal; letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); }
  @media (max-width:800px){ .pir-grid{ grid-template-columns:1fr; } }

  /* ===== EDITORIAL — long-form magazine-style pages (e.g. Our Philosophy) ===== */
  .editorial-hero{ padding:var(--space-15) 0 var(--space-13); background:var(--bg); }
  .editorial-hero .breadcrumb{ margin-bottom:var(--space-8); }

  .editorial-section{ padding:var(--space-15) 0; }
  .editorial-section.is-dark{ background:var(--bg); }
  .editorial-section.is-light{ background:var(--text); }
  @media (min-width:761px){ .editorial-section{ padding:var(--space-20) 0; } }

  .editorial-inner{ max-width:900px; margin:0 auto; padding:0 var(--space-4); }

  .editorial-kicker{
    font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
    color:var(--brass); display:flex; align-items:center; gap:12px; margin-bottom:var(--space-6);
  }
  .editorial-kicker::before{ content:""; width:28px; height:1px; background:var(--brass); display:inline-block; }
  .editorial-section.is-light .editorial-kicker{ color:#8A642F; }
  .editorial-section.is-light .editorial-kicker::before{ background:#8A642F; }

  .editorial-opening{
    font-family:var(--display); font-weight:400; font-size:clamp(26px,3.6vw,40px);
    line-height:1.32; color:var(--text); max-width:820px;
  }
  .editorial-hero .editorial-opening{ font-size:clamp(30px,4.6vw,48px); line-height:1.3; max-width:820px; }
  .editorial-section.is-light .editorial-opening{ color:var(--bg); }
  .editorial-opening .line{ display:block; }

  .editorial-lede{
    font-family:var(--display); font-style:italic; font-size:clamp(19px,2.2vw,23px);
    line-height:1.6; color:var(--text-soft); max-width:640px; margin-top:var(--space-5);
  }
  .editorial-section.is-light .editorial-lede{ color:rgba(8,19,30,0.72); }

  .editorial-body{ margin-top:var(--space-6); max-width:680px; }
  .editorial-body p{ font-size:17px; line-height:1.85; color:var(--text-soft); max-width:none; margin:0 0 var(--space-4); }
  .editorial-body p.beats{ line-height:2.05; }
  .editorial-section.is-light .editorial-body p{ color:rgba(8,19,30,0.74); }

  .editorial-pull{ margin:var(--space-10) auto; max-width:620px; text-align:center; }
  .editorial-pull .rule{ width:40px; height:1px; background:var(--brass); margin:0 auto var(--space-4); }
  .editorial-section.is-light .editorial-pull .rule{ background:#8A642F; }
  .editorial-pull blockquote{
    font-family:var(--display); font-style:italic; font-weight:400;
    font-size:clamp(22px,3vw,30px); line-height:1.45; color:var(--text); margin:0;
  }
  .editorial-section.is-light .editorial-pull blockquote{ color:var(--bg); }

  .editorial-photo{
    position:relative; height:52vh; min-height:340px; overflow:hidden;
    background:linear-gradient(180deg, #0a1826 0%, #16232e 38%, #3a2f28 68%, #2a2118 100%);
  }
  .editorial-photo svg{ position:absolute; bottom:0; left:0; width:100%; height:auto; opacity:.9; }
  .editorial-photo .tag{
    position:absolute; left:var(--space-4); bottom:var(--space-4); z-index:2;
    font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:rgba(244,241,235,0.85);
    text-shadow:0 1px 3px rgba(0,0,0,0.9), 0 1px 10px rgba(0,0,0,0.75);
  }

  .editorial-final{ text-align:center; }
  .editorial-final .editorial-opening{ margin:0 auto; max-width:20ch; }
  .editorial-final .editorial-lede{ margin-left:auto; margin-right:auto; }
  .editorial-final-cta{ margin-top:var(--space-8); display:flex; justify-content:center; }

  .reveal-up{ opacity:0; transform:translateY(18px); transition:opacity .9s ease, transform .9s ease; }
  .reveal-up.is-visible{ opacity:1; transform:translateY(0); }

  /* ===== FAQ CENTER — search bar, jump nav, empty-category states ===== */
  .faq-search-bar{ margin-bottom:var(--space-6); }
  .faq-search-input{
    width:100%; max-width:560px; height:52px; padding:0 var(--space-4);
    background:transparent; border:1px solid var(--line); border-radius:2px;
    color:var(--text); font-family:var(--body); font-size:15px;
    transition:border-color .15s ease;
  }
  .faq-search-input::placeholder{ color:var(--text-mute); }
  .faq-search-input:focus{ outline:none; border-color:var(--brass); }
  .faq-search-count{ font-size:12px; color:var(--text-mute); margin-top:var(--space-2); min-height:1em; }

  .faq-jump{ display:flex; flex-wrap:wrap; gap:var(--space-1) var(--space-4); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:var(--space-3) 0; margin-bottom:var(--space-4); }
  .faq-jump a{ font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); text-decoration:none; }
  .faq-jump a:hover{ color:var(--brass); }

  .faq-editorial-note{ font-size:13px; color:var(--text-mute); max-width:640px; margin:0 0 var(--space-8); }

  .faq-group-empty{ opacity:.9; }
  .faq-count-empty{ color:var(--marina) !important; }
  .faq-empty-note{ border-top:1px solid var(--line); padding-top:var(--space-3); max-width:640px; }
  .faq-empty-note p{ font-size:14.5px; color:var(--text-mute); font-style:italic; max-width:none; }
  .faq-empty-note .faq-source{ margin-right:var(--space-4); }

  /* ===== FAQ CATEGORY NAVIGATION — sticky, compact tab strip =====
     Sticky offset (top:75px) matches the main header's fixed height
     (nav .wrap{ height:74px }) exactly, so this bar sits flush beneath it
     and never overlaps it. z-index:40 stays below the header's z-index:50
     for the same reason. A 1px sentinel placed immediately before this
     block lets the page's own inline script add "is-stuck" only once the
     bar has actually reached its sticky position — the subtle border below
     is present either way so the bar never looks unstyled if JS is off. */
  .faq-cat-nav-sentinel{ height:1px; }
  .faq-cat-nav-wrap{
    position:sticky; top:75px; z-index:40;
    background:rgba(8,19,30,0.94); backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
    margin-top:var(--space-6); margin-bottom:var(--space-10);
    transition:box-shadow .2s ease;
  }
  .faq-cat-nav-wrap.is-stuck{ box-shadow:0 10px 24px -14px rgba(0,0,0,0.55); }

  .faq-cat-tabs{
    display:flex; flex-wrap:wrap; gap:2px var(--space-2);
    max-width:1200px; margin:0 auto; padding:var(--space-2) var(--space-4);
  }
  .faq-cat-tab{
    display:flex; align-items:center; gap:8px; min-height:44px;
    padding:8px 12px; border-radius:2px; border:1px solid transparent;
    text-decoration:none; color:var(--text-soft); white-space:nowrap;
    font-size:13.5px; font-weight:600; transition:color .15s ease, border-color .15s ease, background-color .15s ease;
  }
  .faq-cat-tab:hover{ color:var(--text); border-color:var(--line); }
  .faq-cat-tab:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }
  .faq-cat-tab .faq-cat-tab-count{
    font-size:11px; font-weight:600; letter-spacing:.04em; color:var(--text-mute);
  }
  .faq-cat-tab .faq-cat-tab-count.is-empty{ color:var(--marina); }
  .faq-cat-tab[aria-current="true"]{
    color:var(--brass); border-color:var(--brass); background:rgba(180,138,82,0.09);
  }
  .faq-cat-tab[aria-current="true"] .faq-cat-tab-count{ color:var(--brass); }

  /* Tablet & mobile: one-line horizontal scroll strip instead of wrapping —
     never a dropdown, select, or hamburger. Native scrollbar stays visible
     (no scrollbar-width/-ms-overflow-style overrides) and the strip is
     reachable by touch, mouse-drag-free swipe, and keyboard Tab (focusing a
     tab auto-scrolls it into view, a native browser behavior). */
  @media (max-width:899px){
    .faq-cat-tabs{
      flex-wrap:nowrap; overflow-x:auto; scroll-behavior:smooth;
      padding:var(--space-2) var(--space-4);
      -webkit-overflow-scrolling:touch;
    }
    .faq-cat-nav-wrap::after{
      content:""; position:absolute; top:0; right:0; bottom:0; width:36px;
      background:linear-gradient(to right, rgba(8,19,30,0), rgba(8,19,30,0.9));
      pointer-events:none;
    }
  }
  @media (prefers-reduced-motion: reduce){
    .faq-cat-tabs{ scroll-behavior:auto; }
  }

  /* ===== FAQ CHAPTER SECTIONS + ACCESSIBLE ACCORDION (grouped redesign) =====
     Progressive enhancement: panels render fully open/visible with no CSS
     collapse applied until the page's own inline script adds "has-js" to
     <html> — so all answers stay readable if JavaScript fails.
     scroll-margin-top clears both the sticky header (74px) and the sticky
     category tab strip beneath it, so a chapter heading is never hidden
     after a jump link (native anchor click or the tab strip's smooth
     scroll). */
  .faq-chapter{ margin-top:var(--space-13); padding-top:var(--space-8); border-top:1px solid var(--line); scroll-margin-top:var(--faq-scroll-offset, 260px); }
  .faq-chapter:first-of-type{ margin-top:var(--space-10); }
  .faq-chapter .faq-chapter-title{ font-size:30px; margin:var(--space-2) 0 var(--space-3); }
  .faq-chapter .faq-chapter-intro{ font-size:15px; color:var(--text-soft); max-width:640px; margin-bottom:var(--space-6); }
  .faq-back-to-cats{
    display:inline-block; margin-top:var(--space-5); font-size:12px; font-weight:600;
    letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); text-decoration:none;
  }
  .faq-back-to-cats:hover{ color:var(--brass); }
  .faq-back-to-cats:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }

  .faq-accordion{ border-top:1px solid var(--line); }
  .faq-q{ margin:0; border-bottom:1px solid var(--line); }
  .faq-toggle{
    display:flex; width:100%; align-items:baseline; justify-content:space-between; gap:var(--space-3);
    background:none; border:none; text-align:left; cursor:pointer; padding:var(--space-3) 0;
    font-family:var(--display); font-size:19px; font-weight:400; color:var(--text);
    min-height:44px;
  }
  .faq-toggle:hover{ color:var(--brass); }
  .faq-toggle:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }
  .faq-toggle[aria-expanded="true"]{ color:var(--brass); }
  .faq-toggle .faq-q-icon{ flex:none; color:var(--brass); font-size:20px; font-family:var(--body); line-height:1; }
  .faq-toggle[aria-expanded="true"] .faq-q-icon{ transform:rotate(45deg); }
  .faq-panel{ font-size:15.5px; color:var(--text-soft); line-height:1.7; }
  .faq-panel-inner{ max-width:640px; padding-top:2px; padding-bottom:var(--space-5); }
  .faq-panel-inner p{ max-width:none; }
  .faq-panel .faq-guide-link{ display:inline-block; margin-top:var(--space-2); font-size:12.5px; font-weight:600; letter-spacing:.02em; color:var(--brass); text-decoration:underline; text-underline-offset:3px; }
  .faq-panel .faq-guide-link:hover{ color:var(--text); }
  .faq-panel .faq-guide-link:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }

  .has-js .faq-panel{
    overflow:hidden; max-height:0; opacity:0;
    transition:max-height .35s ease, opacity .3s ease;
  }
  .has-js .faq-panel.is-open{ max-height:1400px; opacity:1; }
  .has-js .faq-toggle .faq-q-icon{ transition:transform .25s ease; }
  @media (prefers-reduced-motion: reduce){
    .has-js .faq-panel{ transition:none; }
    .has-js .faq-toggle .faq-q-icon{ transition:none; }
  }

  /* Mobile spacing — tighter gaps between chapters, comfortable question spacing kept */
  @media (max-width:640px){
    .faq-chapter{ margin-top:var(--space-8); padding-top:var(--space-5); }
    .faq-chapter:first-of-type{ margin-top:var(--space-6); }
    .faq-chapter .faq-chapter-title{ font-size:25px; }
  }

  /* ===== WEBSITE SEARCH — header search box + results panel framework ===== */
  .site-search-trigger{
    display:inline-flex; align-items:center; justify-content:center;
    width:36px; height:36px; border:1px solid rgba(244,241,235,0.28); border-radius:2px;
    color:var(--text-mute); background:transparent; cursor:pointer; transition:border-color .15s, color .15s;
    margin-right:var(--space-2);
  }
  .site-search-trigger:hover{ border-color:var(--brass); color:var(--brass); }
  .site-search-panel{
    position:fixed; inset:0; z-index:200; background:rgba(8,19,30,0.85); backdrop-filter:blur(6px);
    display:none; align-items:flex-start; justify-content:center; padding:var(--space-13) var(--space-4);
  }
  .site-search-panel.is-open{ display:flex; }
  .site-search-box{ width:100%; max-width:640px; background:var(--bg); border:1px solid var(--line); border-radius:4px; padding:var(--space-5); }
  .site-search-box input{
    width:100%; height:52px; padding:0 var(--space-3); background:transparent;
    border:1px solid var(--line); border-radius:2px; color:var(--text); font-family:var(--body); font-size:16px;
  }
  .site-search-box input:focus{ outline:none; border-color:var(--brass); }
  .site-search-close{ float:right; background:none; border:none; color:var(--text-mute); font-size:13px; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; margin-bottom:var(--space-3); }
  .site-search-close:hover{ color:var(--brass); }
  .site-search-results{ margin-top:var(--space-4); max-height:50vh; overflow-y:auto; }
  .site-search-result{ display:block; padding:var(--space-3) 0; border-bottom:1px solid var(--line); text-decoration:none; }
  .site-search-result:last-child{ border-bottom:none; }
  .site-search-result .r-title{ font-family:var(--display); font-size:18px; color:var(--text); }
  .site-search-result .r-desc{ font-size:13px; color:var(--text-mute); margin-top:2px; }
  .site-search-result:hover .r-title{ color:var(--brass); }
  .site-search-empty{ font-size:14px; color:var(--text-mute); padding:var(--space-4) 0; }
  .site-search-hint{ font-size:11px; color:var(--text-mute); margin-top:var(--space-3); }

  /* ===== EDITORIAL INSERT SYSTEM — reusable, sourced from assets/editorial-components.js =====
     A short editorial note meant to sit between sections of a page, the way a
     magazine editor drops in an aside between paragraphs — NOT a card, NOT a
     callout box, NOT a banner or popup. Same restrained language as the Our
     Philosophy page's pull-quotes: a thin centered rule, a small-caps kicker
     with icon, a serif headline, one paragraph, and at most one quiet link
     plus one quiet CTA. Not yet populated across the site; see
     assets/editorial-components.js for the sample data and the render helper. */
  .editorial-insert{
    max-width:600px; margin:var(--space-13) auto; padding:0 var(--space-4);
    text-align:center;
  }
  .editorial-insert .ei-rule{ width:40px; height:1px; background:var(--brass); margin:0 auto var(--space-5); }
  .editorial-insert .ei-kicker{
    font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--brass); display:flex; align-items:center; justify-content:center; gap:8px;
    margin-bottom:var(--space-3);
  }
  .editorial-insert .ei-icon{ font-size:14px; line-height:1; }
  .editorial-insert .ei-title{
    font-family:var(--display); font-weight:400; font-style:italic;
    font-size:clamp(20px,2.6vw,26px); line-height:1.4; color:var(--text); margin:0 0 var(--space-3);
  }
  .editorial-insert .ei-text{
    font-size:16px; line-height:1.8; color:var(--text-soft); max-width:520px; margin:0 auto;
  }
  .editorial-insert .ei-actions{
    margin-top:var(--space-5); display:flex; gap:var(--space-6); justify-content:center; flex-wrap:wrap;
  }
  .editorial-insert .ei-link{ font-size:12.5px; letter-spacing:.02em; color:var(--brass); text-decoration:underline; text-underline-offset:3px; }
  .editorial-insert .ei-cta{ font-size:12.5px; letter-spacing:.02em; color:var(--brass); text-decoration:none; border-bottom:1px solid var(--brass); padding-bottom:2px; }
  .editorial-insert.ei-notice .ei-kicker{ color:var(--marina); }
  .editorial-insert.ei-local .ei-kicker{ color:var(--caution); }
  .editorial-insert.ei-weekly .ei-kicker{ color:var(--brass); }

  /* Adapts to the light (cream) editorial section background, same pattern
     used by .editorial-pull on Our Philosophy. */
  .editorial-section.is-light .editorial-insert .ei-rule{ background:#8A642F; }
  .editorial-section.is-light .editorial-insert .ei-title{ color:var(--bg); }
  .editorial-section.is-light .editorial-insert .ei-text{ color:rgba(8,19,30,0.74); }

  /* ===== INSIGHT SYSTEM (v1) — reusable, sourced from data/insights.json =====
     Two pieces: a small inline "opening" card (.insight-card) and the
     slide-in panel it opens (.insight-panel-overlay / .insight-panel).
     Mounted sitewide via data-insight-card="<id>"; see
     assets/insight-panel.js. Distinct in purpose and markup from
     .editorial-insert above — an Insight is meant to feel like a small,
     clickable card rather than an inline aside. */
  .insight-card{
    max-width:480px; margin:var(--space-8) auto; padding:var(--space-5);
    border:1px solid var(--line); border-radius:4px; background:rgba(244,241,235,0.02);
  }
  .insight-card .ic-kicker{
    font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--brass); display:flex; align-items:center; gap:8px; margin-bottom:var(--space-3);
  }
  .insight-card .ic-icon{ font-size:15px; line-height:1; }
  .insight-card .ic-text{ font-size:15.5px; line-height:1.7; color:var(--text-soft); margin:0; }
  .insight-card .ic-learn-more{
    display:inline-flex; align-items:center; gap:6px; margin-top:var(--space-4);
    background:none; border:none; padding:0; cursor:pointer;
    font-family:var(--body); font-size:13px; letter-spacing:.02em; color:var(--brass);
    border-bottom:1px solid var(--brass); padding-bottom:2px;
  }
  .insight-card .ic-learn-more:hover{ color:#c39a63; border-color:#c39a63; }

  /* Overlay fades the page behind the panel; the panel itself slides in
     from the right. Both are position:fixed and never participate in
     document flow, so opening/closing causes zero layout shift. The global
     prefers-reduced-motion rule at the top of this file already zeroes out
     the transition below for anyone who has that preference set. */
  .insight-panel-overlay{
    position:fixed; inset:0; z-index:300;
    background:rgba(8,19,30,0); pointer-events:none;
    transition:background .3s ease;
  }
  .insight-panel-overlay.is-open{ background:rgba(8,19,30,0.55); pointer-events:auto; }
  .insight-panel{
    position:fixed; top:0; right:0; height:100%;
    width:44vw; min-width:520px; max-width:650px;
    background:var(--bg); border-left:1px solid var(--line);
    box-shadow:-24px 0 60px rgba(0,0,0,0.35);
    overflow-y:auto; -webkit-overflow-scrolling:touch;
    padding:var(--space-8) var(--space-6);
    transform:translateX(100%);
    transition:transform .35s cubic-bezier(.4,0,.2,1);
  }
  .insight-panel-overlay.is-open .insight-panel{ transform:translateX(0); }
  .insight-panel:focus{ outline:none; }
  @media (max-width:900px){
    .insight-panel{ width:80%; min-width:0; max-width:none; }
  }
  @media (max-width:600px){
    .insight-panel{ width:100%; padding:var(--space-6) var(--space-4); }
  }

  .insight-panel-close{
    position:absolute; top:var(--space-5); right:var(--space-5);
    background:none; border:none; color:var(--text-mute); cursor:pointer;
    font-family:var(--body); font-size:13px; letter-spacing:.06em; text-transform:uppercase;
  }
  .insight-panel-close:hover{ color:var(--brass); }
  .insight-panel-close:focus-visible{ outline:1px solid var(--brass); outline-offset:2px; }

  .insight-panel-body{ margin-top:var(--space-6); }
  .insight-panel-kicker{
    font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--brass); display:flex; align-items:center; gap:8px; margin-bottom:var(--space-3);
  }
  .insight-panel-kicker .ip-icon{ font-size:16px; line-height:1; }
  .insight-panel-headline{
    font-family:var(--display); font-weight:400; font-size:clamp(24px,2.6vw,30px);
    line-height:1.25; color:var(--text); margin:0 0 var(--space-5);
  }
  .insight-panel-image{
    margin-bottom:var(--space-5); border-radius:3px; overflow:hidden;
    aspect-ratio:4/3; background:rgba(255,255,255,0.03);
  }
  .insight-panel-image img{ width:100%; height:100%; object-fit:cover; display:block; }
  .insight-panel-copy p{ font-size:16px; line-height:1.8; color:var(--text-soft); margin:0 0 var(--space-4) 0; }
  .insight-panel-copy p:last-child{ margin-bottom:0; }
  .insight-questions{ margin:0 0 var(--space-4) 0; }
  .insight-questions:last-child{ margin-bottom:0; }
  .insight-questions-heading{
    font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
    color:var(--brass); margin-bottom:var(--space-2);
  }
  .insight-questions-list{ list-style:none; margin:0; padding:0; }
  .insight-questions-list li{
    font-size:16px; line-height:1.7; color:var(--text-soft);
    margin-bottom:6px; padding-left:16px; position:relative;
  }
  .insight-questions-list li:last-child{ margin-bottom:0; }
  .insight-questions-list li::before{ content:"–"; position:absolute; left:0; color:var(--brass); }

  .insight-panel-explore{ margin-top:var(--space-8); padding-top:var(--space-6); border-top:1px solid var(--line); }
  .insight-explore-eyebrow{
    font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--text-mute); margin-bottom:var(--space-4);
  }
  .insight-related-group{ margin-bottom:var(--space-4); }
  .insight-related-group:last-child{ margin-bottom:0; }
  .insight-related-label{ font-size:12px; color:var(--text-mute); margin-bottom:6px; }
  .insight-related-group ul{ list-style:none; margin:0; padding:0; }
  .insight-related-group li{ margin-bottom:4px; }
  .insight-related-link{
    font-size:14.5px; color:var(--brass); text-decoration:none;
    border-bottom:1px solid rgba(180,138,82,0.35); padding-bottom:1px;
  }
  .insight-related-link:hover{ border-color:var(--brass); }
  .insight-related-link:focus-visible{ outline:1px solid var(--brass); outline-offset:2px; }

  /* ===============================================================
     MAGAZINE PHOTOGRAPHY — Version 1.1 visual storytelling module
     ---------------------------------------------------------------
     Reusable presentation variants for inline editorial photography,
     built on the same tokens as the rest of the site (var(--line)
     borders, 2-3px radius, var(--text-mute) captions). Used inside
     .article-body / .editorial-body columns (max-width ~700-680px);
     the "wide" and "panoramic" variants intentionally break out past
     that column for visual rhythm, exactly like .editorial-photo
     already does elsewhere. All variants stack to full-width, static
     (non-floated) images on mobile — see the max-width:760px block.
     =============================================================== */
  .mag-photo{ margin:var(--space-8) 0; }
  .mag-photo img{
    display:block; width:100%; height:auto;
    border:1px solid var(--line); border-radius:2px; background:rgba(255,255,255,0.03);
  }
  .mag-photo figcaption{
    margin-top:var(--space-2); font-size:12.5px; letter-spacing:.02em;
    color:var(--text-mute); line-height:1.5;
  }

  /* Wide: breaks out of the narrow article column to ~920px, still
     inline in the reading flow (not full-bleed). Use for a section's
     single strongest photo. */
  .mag-photo--wide{
    max-width:920px; margin-left:calc(50% - 460px); margin-right:calc(50% - 460px);
  }
  .mag-photo--wide img{ aspect-ratio:16/9; object-fit:cover; }
  @media (max-width:980px){ .mag-photo--wide{ margin-left:0; margin-right:0; max-width:none; } }

  /* Panoramic: full-bleed band, same silhouette-free treatment as
     .editorial-photo but for a single photo with no SVG overlay —
     used when a page wants one strong horizontal "breather" image. */
  .mag-photo--panoramic{
    position:relative; width:100vw; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw;
    margin-top:var(--space-10); margin-bottom:var(--space-10);
  }
  .mag-photo--panoramic img{ border-left:none; border-right:none; border-radius:0; aspect-ratio:21/9; object-fit:cover; }
  .mag-photo--panoramic figcaption{ max-width:700px; margin-left:auto; margin-right:auto; padding:0 var(--space-4); text-align:center; }
  @media (max-width:700px){ .mag-photo--panoramic img{ aspect-ratio:4/3; } }

  /* Float left/right: a smaller card-style photo that text wraps
     around on desktop; becomes a plain stacked block on narrower
     screens so nothing ever feels cramped. */
  .mag-photo--float-left, .mag-photo--float-right{ max-width:340px; }
  .mag-photo--float-left img, .mag-photo--float-right img{ aspect-ratio:4/5; object-fit:cover; }
  @media (min-width:761px){
    .mag-photo--float-left{ float:left; margin:6px var(--space-6) var(--space-4) 0; }
    .mag-photo--float-right{ float:right; margin:6px 0 var(--space-4) var(--space-6); }
  }
  @media (max-width:760px){
    .mag-photo--float-left, .mag-photo--float-right{ float:none; max-width:none; margin:var(--space-6) 0; }
  }

  /* Card: small, self-contained, no text wrap — for a single
     supporting image inside a grid/CTA area rather than mid-paragraph. */
  .mag-photo--card{ max-width:420px; }
  .mag-photo--card img{ aspect-ratio:4/3; object-fit:cover; }

  /* Pull-photo-quote: a photo paired with a short standalone quote,
     side by side on desktop, stacked on mobile — reserved for a
     handful of flagship moments rather than every page. */
  .mag-pull{
    display:grid; grid-template-columns:1fr 1fr; gap:var(--space-8); align-items:center;
    margin:var(--space-10) 0; max-width:980px;
  }
  .mag-pull img{ width:100%; height:100%; aspect-ratio:4/5; object-fit:cover; border:1px solid var(--line); border-radius:2px; display:block; }
  .mag-pull blockquote{
    font-family:var(--display); font-weight:400; font-style:italic;
    font-size:clamp(22px,2.6vw,30px); line-height:1.4; color:var(--text); margin:0;
  }
  .mag-pull cite{ display:block; margin-top:var(--space-4); font-style:normal; font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-mute); }
  @media (max-width:760px){ .mag-pull{ grid-template-columns:1fr; gap:var(--space-4); } }
  .editorial-section.is-light .mag-photo figcaption{ color:rgba(8,19,30,0.55); }

  /* ===============================================================
     EDITORIAL LAYOUT SYSTEM — Version 1.2 Creative Director pass
     ---------------------------------------------------------------
     Extends (does not replace) the Version 1.1 .mag-photo/.mag-pull
     vocabulary above with "break the rectangles" layouts — overlapping
     pairs, photo strips, postcard framing, circular crops — plus a
     reusable Christina "trusted guide" component and the quote-strip /
     review-card components that give client testimonials a real home
     across the site instead of a single forgotten section. Same
     tokens throughout: var(--line) borders, var(--brass) accents,
     2px radius, the existing spacing scale. No new colors, no new
     typefaces, no navigation or brand changes.
     =============================================================== */

  /* ---- Break the rectangles: collage / strip / postcard / circle ---- */

  /* Collage: two images, offset and overlapping — the pair reads as
     one composition rather than two separate rectangles. Use for a
     "before/after" or "here/there" pairing (e.g. canal + open water,
     dock + boat). Stacks cleanly on mobile with the overlap removed. */
  .mag-collage{
    position:relative; max-width:640px; margin:var(--space-12) auto;
    padding-bottom:14%;
  }
  .mag-collage .mc-back, .mag-collage .mc-front{
    border:1px solid var(--line); border-radius:2px; background:rgba(255,255,255,0.03);
    box-shadow:0 18px 40px rgba(0,0,0,0.35);
  }
  .mag-collage .mc-back{ width:78%; }
  .mag-collage .mc-back img{ width:100%; height:100%; aspect-ratio:4/3; object-fit:cover; display:block; border-radius:2px; }
  .mag-collage .mc-front{
    position:absolute; right:0; bottom:0; width:52%; z-index:1;
    border-color:var(--bg); border-width:4px;
  }
  .mag-collage .mc-front img{ width:100%; height:100%; aspect-ratio:5/4; object-fit:cover; display:block; border-radius:1px; }
  .mag-collage figcaption{ margin-top:var(--space-3); font-size:12.5px; color:var(--text-mute); text-align:center; }
  @media (max-width:640px){
    .mag-collage{ padding-bottom:0; }
    .mag-collage .mc-back{ width:100%; box-shadow:none; }
    .mag-collage .mc-front{ position:static; width:70%; margin:calc(-1 * var(--space-8)) auto 0; display:block; box-shadow:none; }
  }

  /* Photo strip: three smaller frames in a row, like a scrapbook of
     one afternoon. Full width of the article column; on mobile it
     becomes a horizontal scroll-snap strip so nothing gets crushed. */
  .mag-strip{ margin:var(--space-12) 0; }
  .mag-strip .ms-row{
    display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3);
  }
  .mag-strip img{
    width:100%; aspect-ratio:3/4; object-fit:cover; display:block;
    border:1px solid var(--line); border-radius:2px; background:rgba(255,255,255,0.03);
  }
  .mag-strip .ms-row > *:nth-child(2){ transform:translateY(var(--space-4)); }
  .mag-strip figcaption{ margin-top:var(--space-3); font-size:12.5px; color:var(--text-mute); text-align:center; }
  @media (max-width:640px){
    .mag-strip .ms-row{ grid-auto-flow:column; grid-auto-columns:72%; grid-template-columns:none; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:var(--space-2); }
    .mag-strip .ms-row > *{ scroll-snap-align:center; }
    .mag-strip .ms-row > *:nth-child(2){ transform:none; }
  }

  /* Postcard: a single image with a white-bordered, slightly rotated
     "mailed postcard" treatment — an elegant break from the hard
     rectangle without being gimmicky. Reserve for one true "moment"
     photo per page at most. */
  .mag-postcard{ max-width:420px; margin:var(--space-12) auto; text-align:center; }
  .mag-postcard .mp-frame{
    display:inline-block; background:#F4F1EB; padding:10px 10px 34px; border-radius:1px;
    box-shadow:0 22px 44px rgba(0,0,0,0.4); transform:rotate(-2deg);
  }
  .mag-postcard .mp-frame img{ display:block; width:100%; max-width:340px; aspect-ratio:5/4; object-fit:cover; }
  .mag-postcard .mp-caption{ margin-top:14px; font-family:var(--display); font-style:italic; color:#08131E; font-size:14px; }
  .mag-postcard figcaption{ margin-top:var(--space-3); font-size:12.5px; color:var(--text-mute); }

  /* Circular crop: for a single small accent image — wildlife,
     detail shots, a moment — never used for large hero-scale photos. */
  .mag-circle{ display:inline-flex; flex-direction:column; align-items:center; text-align:center; margin:var(--space-6) var(--space-4); }
  .mag-circle img{
    width:132px; height:132px; border-radius:50%; object-fit:cover;
    border:1px solid var(--line); display:block;
  }
  .mag-circle figcaption{ margin-top:var(--space-2); font-size:11.5px; color:var(--text-mute); max-width:150px; }

  /* ---- Christina: the trusted guide, not a stock portrait ---- */

  /* Small recurring appearance — a circular portrait plus a short
     line in her voice, inline with the reading flow. Never a large
     rectangular photo. Use sparingly (one per page at most) so it
     reads as a companion presence, not another photo block. */
  .christina-note{
    display:flex; align-items:flex-start; gap:var(--space-4);
    margin:var(--space-8) 0; padding:var(--space-5) var(--space-6);
    border:1px solid var(--line); border-left:2px solid var(--brass); border-radius:2px;
    background:rgba(180,138,82,0.05);
  }
  .christina-note img{
    width:56px; height:56px; border-radius:50%; object-fit:cover; flex:none;
    border:1px solid var(--line);
  }
  .christina-note .cn-body{ min-width:0; }
  .christina-note .cn-label{
    font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--brass);
    font-weight:600; margin-bottom:6px; display:block;
  }
  .christina-note p{ margin:0; font-size:15px; line-height:1.6; color:var(--text-soft); max-width:none; }
  .christina-note p:not(:last-child){ margin-bottom:var(--space-2); }

  /* Author-profile style: a soft circular portrait beside her name and
     role, for byline-style placements (contact, FAQ) — replaces the
     earlier rectangular card treatment from Version 1.1. */
  .christina-byline{ display:flex; align-items:center; gap:var(--space-4); margin:var(--space-6) 0; }
  .christina-byline img{
    width:72px; height:72px; border-radius:50%; object-fit:cover; flex:none;
    border:1px solid var(--line);
  }
  .christina-byline .cb-name{ font-family:var(--display); font-size:20px; color:var(--text); }
  .christina-byline .cb-role{ font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-mute); margin-top:2px; }

  /* Organic framing: a soft-edged cut-out portrait for a slightly
     larger, but still non-rectangular, appearance — used once per
     page maximum (about.html, the philosophy close). */
  .christina-cutout{ text-align:center; margin:var(--space-10) auto; max-width:220px; }
  .christina-cutout img{
    width:100%; aspect-ratio:1/1; object-fit:cover; display:block;
    border-radius:50%; -webkit-mask-image:radial-gradient(circle,#000 68%,transparent 72%);
    mask-image:radial-gradient(circle,#000 68%,transparent 72%);
  }
  .christina-cutout figcaption{ margin-top:var(--space-3); font-size:12.5px; color:var(--text-mute); }

  /* ---- Reviews: quote-strip (woven into pages) + review cards (hub) ---- */

  /* Quote strip: a single real client review, dropped into any page
     where it reinforces the surrounding content — sized to sit
     comfortably at the close of a section, not compete with it. */
  .quote-strip{
    max-width:640px; margin:var(--space-10) auto; padding:var(--space-6) var(--space-7);
    border:1px solid var(--line); border-left:2px solid var(--brass); border-radius:2px;
    position:relative;
  }
  .quote-strip-mark{
    position:absolute; top:2px; left:var(--space-5); font-family:var(--display);
    font-size:48px; line-height:1; color:var(--brass); opacity:.35;
  }
  .quote-strip-text{
    font-family:var(--display); font-style:italic; font-weight:400;
    font-size:18px; line-height:1.55; color:var(--text); margin:0 0 var(--space-3);
    position:relative; z-index:1;
  }
  .quote-strip-by{ font-size:11.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--text-mute); }

  /* Review grid + card: the editorial Reviews / Client Stories hub. */
  .review-grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); }
  @media (max-width:760px){ .review-grid{ grid-template-columns:1fr; } }
  .review-card{
    border:1px solid var(--line); border-radius:2px; padding:var(--space-6);
    display:flex; flex-direction:column; gap:var(--space-4);
  }
  .review-card .rc-quote{
    font-family:var(--display); font-style:italic; font-size:17px; line-height:1.55;
    color:var(--text); margin:0; flex:1;
  }
  .review-card .rc-by{ font-size:11.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--brass); }
  .review-category-head{
    display:flex; align-items:baseline; gap:var(--space-3); margin:var(--space-14) 0 var(--space-6);
    border-top:1px solid var(--line); padding-top:var(--space-6);
  }
  .review-category-head:first-of-type{ border-top:none; padding-top:0; margin-top:var(--space-10); }
  .review-category-head h2{ font-family:var(--display); font-size:26px; font-weight:400; color:var(--text); margin:0; }
  .review-category-head .rc-count{ font-size:12px; color:var(--text-mute); }

  .editorial-section.is-light .quote-strip-text,
  .editorial-section.is-light .review-card .rc-quote{ color:var(--bg); }
  .editorial-section.is-light .christina-note{ background:rgba(180,138,82,0.08); }
  .editorial-section.is-light .christina-note p{ color:rgba(8,19,30,0.74); }