@font-face{font-family:'Manrope';src:url('/fonts/manrope-latin.woff2') format('woff2');font-weight:200 600;font-display:swap;font-style:normal;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--bg:#050505;--bg-elevated:#0c0c0d;--bg-glow:radial-gradient(ellipse 75% 600px at 50% -120px,#13110d 0%,#050505 100%);--accent:#CCB46C;--accent-bright:#E4CC84;--accent-dim:rgba(204,180,108,0.3);--accent-faint:rgba(204,180,108,0.08);--accent-leaf:linear-gradient(168deg,#F6EDCB 0%,#EFDCA0 34%,#D8BE74 70%,#C9AC60 100%);--text-heading:#F6F2E9;--text:#F2F2F2;--text-muted:#A8A8A8;--text-subtle:#949494;--border:rgba(255,255,255,0.12);--border-strong:rgba(255,255,255,0.22);--error:#ff5555;--success:#6ed084;--on-accent:#0A0A0A;--accent-text:var(--accent);--accent-shadow:rgba(204,180,108,0.40);--font-serif:'Cormorant Garamond','Iowan Old Style','Palatino Linotype',Georgia,serif;--font-sans:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--font-signature:'Signature','Snell Roundhand','Apple Chancery',cursive;--ease-luxury:cubic-bezier(0.19,1,0.22,1);--ease-quick:cubic-bezier(0.4,0,0.2,1);--space-xs:clamp(0.5rem,1vw,0.75rem);--space-sm:clamp(1rem,2vw,1.5rem);--space-md:clamp(2rem,4vw,3rem);--space-lg:clamp(4rem,8vw,6rem);--space-xl:clamp(5rem,10vw,9.5rem);color-scheme:dark;--hero-poster-fallback: url('https://res.cloudinary.com/dl4e3qclg/video/upload/w_1600,f_auto,q_auto:eco,so_auto/Splash_Desktop_bqnjls.webp');}
@font-face{font-family:'Cormorant Garamond';src:url('/fonts/cormorant-latin.woff2') format('woff2');font-weight:200 600;font-display:swap;font-style:normal;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:'Cormorant Garamond';src:url('/fonts/cormorant-italic-latin.woff2') format('woff2');font-weight:200 600;font-display:swap;font-style:italic;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:'Signature';src:url('/fonts/mr-de-haviland-signature.woff2') format('woff2');font-weight:400;font-display:swap;font-style:normal}

@media (prefers-reduced-motion:reduce){*,::before,::after{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-duration:0s!important;transition-delay:0s!important}#cursor,#cursor-follower{display:none!important}body{cursor:auto!important}.grain-overlay{animation:none!important}}
@media (prefers-reduced-data:reduce){.hero-video-wrapper video{display:none}.hero-video-wrapper{background-image:var(--hero-poster-fallback);background-size:cover;background-position:center}}
@media print{.grain-overlay,#cursor,#cursor-follower,#preloader,nav,.hero-video-wrapper,.play-btn,.video-facade video,.footer-action,#tcc-cmp,.cmp-reopen{display:none!important}body{background:#fff!important;color:#000!important}.hero{height:auto!important;min-height:unset!important}.hero-content{padding-top:2rem!important}.hero-title em{color:#000!important;background:none!important}a{color:#000!important;text-decoration:underline!important}.section-content{height:auto!important}.section-inner{opacity:1!important;transform:none!important}.capability{opacity:1!important;transform:none!important}}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth;font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-size-adjust:100%;text-rendering:optimizeLegibility;font-variant-ligatures:common-ligatures;font-optical-sizing:auto;font-kerning:normal;-webkit-tap-highlight-color:transparent}
body{background:var(--bg-glow) no-repeat;background-color:var(--bg);color:var(--text);font-family:var(--font-sans);font-weight:300;line-height:1.6;overflow-x:hidden;width:100%;min-height:100vh;min-height:100dvh}
::selection{background:rgba(204,180,108,0.22);color:#F6F2E9}
img,video{max-width:100%;height:auto;display:block;-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
:focus-visible{outline:2px dashed var(--accent);outline-offset:6px;border-radius:2px}
button{font:inherit;color:inherit}
.skip-link{position:absolute;top:-100%;left:1rem;background:var(--accent-leaf);color:var(--on-accent);padding:12px 22px;z-index:999999;font-family:var(--font-sans);font-size:0.85rem;font-weight:600;text-decoration:none;border-radius:0 0 4px 4px;transition:top 0.2s ease}
.skip-link:focus{top:0}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#222;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--accent)}
.grain-overlay{position:fixed;inset:-50%;width:200%;height:200%;background-image:url("https://res.cloudinary.com/dl4e3qclg/image/upload/w_200,f_auto,q_auto:low/Copilot_20260210_221209_gf05ui.png");opacity:0.045;pointer-events:none;z-index:9999;animation:noise-move 0.3s steps(4) infinite}
@keyframes noise-move{0%{transform:translate3d(0,0,0)}25%{transform:translate3d(-1%,-1%,0)}50%{transform:translate3d(1%,1%,0)}75%{transform:translate3d(-1%,1%,0)}100%{transform:translate3d(0,0,0)}}
#cursor{position:fixed;top:0;left:0;z-index:99999;pointer-events:none;width:6px;height:6px;background:var(--accent);border-radius:50%;transform:translate3d(-100px,-100px,0) translate(-50%,-50%);transition:width 0.3s var(--ease-luxury),height 0.3s var(--ease-luxury),opacity 0.3s var(--ease-luxury);will-change:transform,width,height,opacity}
#cursor-follower{position:fixed;top:0;left:0;z-index:99998;pointer-events:none;width:40px;height:40px;border:1px solid var(--accent-dim);border-radius:50px;transform:translate3d(-100px,-100px,0) translate(-50%,-50%);display:flex;justify-content:center;align-items:center;transition:width 0.3s var(--ease-luxury),height 0.3s var(--ease-luxury),border-color 0.3s var(--ease-luxury),background-color 0.3s var(--ease-luxury),padding 0.3s var(--ease-luxury);white-space:nowrap;will-change:transform,width,height,background-color}
#cursor-follower span{font-size:0.65rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--bg);font-weight:600;opacity:0;transition:opacity 0.3s var(--ease-luxury);pointer-events:none}
body.custom-cursor-active,body.custom-cursor-active a,body.custom-cursor-active button,body.custom-cursor-active input,body.custom-cursor-active select,body.custom-cursor-active textarea,body.custom-cursor-active [data-cursor-text],body.custom-cursor-active .ledger-row{cursor:none!important}
body.is-hovering #cursor{width:40px;height:40px;opacity:0.15}
body.is-hovering #cursor-follower{border-color:var(--accent);width:60px;height:60px}
body.is-hovering.has-text-active #cursor{opacity:0}
body.is-hovering #cursor-follower.has-text{width:auto;height:40px;padding:0 20px;background-color:var(--accent);border-color:var(--accent)}
body.is-hovering #cursor-follower.has-text span{opacity:1}
.magnetic{display:inline-block;will-change:transform;transition:transform 0.4s var(--ease-luxury)}
#preloader{position:fixed;inset:0;z-index:100000;background:var(--bg);display:flex;flex-direction:column;justify-content:center;align-items:center;transition:transform 0.8s var(--ease-luxury);will-change:transform}
#preloader.loaded{transform:translateY(-100%)}
/* Splash / preloader - "quiet Mayfair": warm off-white wordmark, with the brand
   gold pulled back to a single restrained hairline + a faint eyebrow whisper. */
.loader-content{text-align:center;position:relative}
.loader-eyebrow{display:block;font-family:var(--font-sans);font-size:0.6rem;font-weight:500;letter-spacing:0.4em;text-transform:uppercase;color:var(--accent);opacity:0.4;margin-bottom:1.35rem;padding-left:0.4em}
.loader-logo{font-family:var(--font-serif);font-weight:300;font-size:clamp(1.75rem,5.5vw,2.7rem);letter-spacing:-0.015em;line-height:1.05;color:#ECE6D9;margin-bottom:1.9rem}
.loader-logo em{font-style:italic;color:#ECE6D9}
.loader-bar-bg{width:130px;height:1px;background:rgba(255,255,255,0.08);margin:0 auto;position:relative;overflow:hidden}
.loader-bar{position:absolute;inset:0;background:var(--accent);opacity:0.9;transform:scaleX(0);transform-origin:left center;animation:tcc-load 360ms cubic-bezier(.4,0,.2,1) forwards;will-change:transform}
@keyframes tcc-load { to { transform: scaleX(1); } }
#preloader { transition: transform .6s var(--ease-luxury); }
#navbar{position:fixed;top:0;left:0;width:100%;height:90px;display:flex;justify-content:space-between;align-items:center;padding:0 6%;z-index:1000;opacity:0;transition:opacity 1s var(--ease-luxury) 0.5s,background 0.5s var(--ease-quick),backdrop-filter 0.5s var(--ease-quick)}
body.ready #navbar{opacity:1}
#navbar.scrolled{background:rgba(5,5,5,0.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.logo,.label{user-select:none;-webkit-user-select:none}
.logo{font-size:0.82rem;text-transform:uppercase;letter-spacing:0.2em;font-weight:600;color:#fff;text-decoration:none;transform-origin:left;display:flex;align-items:center;gap:12px;min-height:44px;text-shadow:0 1px 20px rgba(0,0,0,0.3)}
/* Slightly larger, warmer wordmark so the brand carries the top-left corner and draws the eye.
   The 64px crest asset stays crisp at 34px. Hover lifts the wordmark to gold as a home cue. */
.brand-mark{width:34px;height:34px;border-radius:2px}
.logo span{transition:color 0.4s var(--ease-luxury)}
.logo:hover span,.logo:focus-visible span{color:var(--accent-bright)}
.nav-cta{background:none;border:1px solid var(--border);color:var(--accent);text-transform:uppercase;font-size:0.65rem;letter-spacing:0.15em;padding:14px 26px;cursor:pointer;transition:background 0.6s var(--ease-luxury),color 0.6s var(--ease-luxury),border-color 0.6s var(--ease-luxury);position:relative;overflow:hidden;font-family:var(--font-sans);min-height:44px}
.nav-cta:hover,.nav-cta:focus-visible{background:var(--accent-leaf);color:var(--on-accent);border-color:var(--accent)}
.nav-cta::before{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(204,180,108,0.2),transparent)}
.nav-cta:hover::before{left:100%;transition:left 0.8s}
.section-nav{display:flex;gap:28px;align-items:center}
.section-nav a{font-size:0.6rem;text-transform:uppercase;letter-spacing:0.18em;color:var(--text-muted);text-decoration:none;font-weight:500;transition:color 0.4s var(--ease-luxury);position:relative;padding:6px 0;min-height:32px;display:inline-flex;align-items:center}
.section-nav a:hover,.section-nav a:focus-visible{color:#fff}
.section-nav a::after{content:'';position:absolute;left:0;bottom:0;width:0%;height:1px;background:var(--accent);transition:width 0.4s var(--ease-luxury)}
.section-nav a:hover::after,.section-nav a:focus-visible::after{width:100%}
@media (max-width:1200px){.section-nav{display:none}}
/* Client Login — a live door in the masthead: a real, gated product, visible to every visitor. */
.section-nav a.nav-login{display:inline-flex;align-items:center;color:var(--accent);font-weight:600}
.section-nav a.nav-login:hover,.section-nav a.nav-login:focus-visible{color:#fff}
.nav-login-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(204,180,108,0.16);margin-right:0.55em;flex:none}
@media (prefers-reduced-motion:no-preference){.nav-login-dot{animation:navLoginPulse 2.6s ease-in-out infinite}}
@keyframes navLoginPulse{0%,100%{opacity:1}50%{opacity:0.4}}
.menu-login{color:var(--accent)}
.container{width:88%;max-width:1200px;margin:0 auto;position:relative;z-index:2}
.section-pad{padding:var(--space-xl) 0}
.hero-title{font-family:var(--font-serif);font-weight:300;font-size:clamp(3.6rem,9.2vw,8.5rem);line-height:1.0;letter-spacing:-0.035em;color:var(--text-heading);margin-top:clamp(1.25rem,2.5vw,2.5rem)}
.hero-title span.line-wrap{display:block;overflow:hidden;padding-bottom:1.25em;margin-bottom:-1.25em}
.line-child{display:inline-block;will-change:transform;transform:translateY(40%);transition:transform 0.7s var(--ease-luxury);padding-bottom:0.1em}
.hero-title em{color:var(--accent-bright);font-style:italic;display:inline-block;padding-right:0.1em;padding-bottom:0.15em;margin-bottom:-0.15em;background:var(--accent-leaf);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-title.active .line-child{transform:translateY(0%)}
.reveal-up.active .line-child{transform:translateY(0%)}
/* LCP safety nets: the hero H1 (LCP) is gated behind JS (.active) + the opaque
   #preloader. Ensure it paints even if JS is absent/stalled or motion is reduced. */
.no-js .line-child{transform:none}
@media (prefers-reduced-motion:reduce){.line-child{transform:none}}
.no-js #preloader{display:none}
@media (prefers-reduced-motion:reduce){#preloader{display:none}}
/* CSS-drive the preloader dismissal + hero reveal so LCP does not wait on
   window.load (which, throttled, waits for fonts/video/3rd-parties). The JS
   path still runs and is faster when JS is ready; this is the floor, not a cap. */
@media (prefers-reduced-motion:no-preference){#preloader{animation:tcc-preloader-out .45s var(--ease-luxury) .5s forwards}}
@keyframes tcc-preloader-out{to{transform:translateY(-100%);visibility:hidden}}
@media (prefers-reduced-motion:no-preference){.hero-title .line-child{animation:heroLineUp .55s var(--ease-luxury) .05s both}}
@keyframes heroLineUp{from{transform:translateY(40%)}to{transform:translateY(0)}}
h1,h2,h3{font-family:var(--font-serif);font-weight:300;letter-spacing:-0.03em;color:var(--text-heading);font-optical-sizing:auto;font-feature-settings:"liga" 1,"dlig" 1,"calt" 1}
h2{font-size:clamp(2rem,5vw,4rem);line-height:1.1;margin-bottom:1.5rem;text-wrap:balance}
h3{font-size:clamp(1.5rem,3vw,2.5rem);text-wrap:balance}
p{font-size:clamp(1rem,1.2vw,1.15rem);color:var(--text-muted);font-weight:300;max-width:60ch;text-wrap:pretty}
/* Tabular lining figures wherever numerals carry meaning: the verdict score,
   chapter indices, the client ledger, legal identifiers. A practice that sells
   precision sets its numbers like a ledger, equal-width and aligned, no jitter. */
.chapter-no,.verdict-score,.commitment-num,.arch-counter,.section-index,.legal-line,.mandate-stamp .stamp-ref,.mandate-line{font-variant-numeric:tabular-nums lining-nums}
.label{font-size:0.7rem;text-transform:uppercase;letter-spacing:0.38em;color:var(--accent-bright);margin-top:clamp(2.5rem,6vw,5rem);margin-bottom:2rem;display:block;font-weight:400;opacity:0.92}
.label::before{content:'';display:inline-block;width:26px;height:1px;background:linear-gradient(90deg,var(--accent),transparent);vertical-align:middle;margin-right:1rem;position:relative;top:-0.12em}
.label.tight{margin-bottom:0.5rem}
.chapter-no{display:block;font-family:var(--font-serif);font-weight:300;font-size:clamp(2.75rem,5vw,4.25rem);line-height:1.08;padding-bottom:0.04em;color:var(--accent-bright);background:var(--accent-leaf);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;opacity:1;letter-spacing:-0.01em;margin-top:clamp(2.5rem,6vw,5rem);margin-bottom:1.1rem;user-select:none;-webkit-user-select:none}
.chapter-no+.label{margin-top:0}
.chapter-no--card{margin-top:0;font-size:clamp(2.1rem,3.4vw,2.85rem);opacity:1;margin-bottom:0.8rem}
.hero{position:relative;height:100vh;height:100dvh;min-height:640px;display:flex;align-items:center;overflow:hidden}
.hero-video-wrapper{position:absolute;inset:0;z-index:0;background:#000}
.hero-video-wrapper video{width:100%;height:100%;object-fit:cover;opacity:0.6;transform:translate3d(0,0,0) scale(1.05);transition:transform 0.1s ease-out;will-change:transform}
.hero-video-wrapper::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(5,5,5,0.85) 0%,rgba(5,5,5,0.55) 38%,rgba(5,5,5,0.12) 72%,rgba(5,5,5,0) 100%)}
@media(max-width:768px){.hero-video-wrapper::before{background:linear-gradient(180deg,rgba(5,5,5,0.18) 0%,rgba(5,5,5,0.4) 48%,rgba(5,5,5,0.84) 100%)}}
.hero-video-wrapper::after{content:'';position:absolute;inset:0;z-index:1;background:radial-gradient(circle at center,rgba(5,5,5,0.08) 0%,rgba(5,5,5,0.82) 100%)}
.hero-content{position:relative;z-index:2;padding-top:10vh}
/* Hero eyebrow (the PPC/AI-Search/SEO tagline) needs more presence than the generic .label,
   especially on tablet where the section-nav is hidden and it carries the positioning alone. */
#hero-heading{font-size:clamp(0.85rem,1.7vw,1.05rem);letter-spacing:0.24em;opacity:1;margin-bottom:1.4rem}
.hero-subhead{margin-top:2rem;color:var(--text);max-width:54ch;font-size:clamp(1.05rem,1.3vw,1.28rem);line-height:1.5;text-wrap:pretty}
#bespoke-target,[data-bespoke],[data-bespoke-template]{transition:color 1.1s var(--ease-luxury),letter-spacing 1.1s var(--ease-luxury)}
[data-bespoke].is-bespoke,[data-bespoke-template].is-bespoke,#bespoke-target.is-bespoke{color:var(--accent)}
.bespoke-prelude {
  display:none;
  font-size:0.7rem;
  text-transform:uppercase;
  letter-spacing:0.35em;
  color:var(--accent);
  opacity:0;
  transform:translateY(6px);
  transition:opacity 1.2s var(--ease-luxury),transform 1.2s var(--ease-luxury);
  margin-bottom:0.85rem;
  line-height:1.8;
  white-space:pre-line; /* Mobile gets the line break */
}

@media (min-width: 769px) {
  .bespoke-prelude {
    white-space: normal; /* Desktop turns the line break into a single space */
  }
}
.is-personalised .bespoke-prelude{display:block}
.is-personalised .bespoke-prelude.is-revealed{opacity:0.85;transform:translateY(0)}
.mandate-stamp{position:fixed;right:max(2.2vw,18px);bottom:max(2.2vh,18px);z-index:50;font-family:var(--font-sans);font-size:0.55rem;letter-spacing:0.32em;text-transform:uppercase;color:var(--text-subtle);background:rgba(5,5,5,0.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:1px;padding:9px 14px 8px;display:none;opacity:0;transform:translateY(8px);transition:opacity 1.4s var(--ease-luxury),transform 1.4s var(--ease-luxury),color 0.6s var(--ease-luxury),border-color 0.6s var(--ease-luxury);pointer-events:auto;line-height:1.4;max-width:min(78vw,360px);user-select:none;-webkit-user-select:none;cursor:default}
.mandate-stamp .stamp-label{display:block;color:var(--text-subtle);font-weight:500}
.mandate-stamp .stamp-name{display:block;color:var(--accent);margin-top:3px;font-weight:600;letter-spacing:0.2em;font-size:0.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.mandate-stamp .stamp-ref{display:block;color:var(--text-muted);margin-top:3px;font-family:'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:0.18em;font-size:0.5rem}
.mandate-stamp:hover{border-color:var(--accent-dim);color:var(--text-muted)}
.is-personalised .mandate-stamp{display:block}
.is-personalised .mandate-stamp.is-revealed{opacity:1;transform:translateY(0)}
/* Avoid collision with the cookie reopen button when both are visible */
body.cmp-reopen-visible .mandate-stamp{bottom:max(8.5vh,80px)}
@media (max-width:640px){.mandate-stamp{font-size:0.5rem;padding:7px 11px 6px;letter-spacing:0.25em;right:12px;bottom:12px}.mandate-stamp .stamp-name{font-size:0.55rem;max-width:160px}}
@media (max-width:380px){.mandate-stamp{display:none!important}}
.mandate-line{display:none;font-family:'SFMono-Regular',Menlo,Consolas,monospace;font-size:0.55rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--text-subtle);margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--border)}
.mandate-line .mandate-line-sep{margin:0 0.85em;color:var(--text-subtle);opacity:0.6}
.mandate-line .mandate-line-name{color:var(--accent);letter-spacing:0.18em}
.is-personalised .mandate-line{display:block}
.bespoke-print-letterhead{display:none}
@media print{
  .mandate-stamp,.bespoke-prelude{display:none!important}
  .is-personalised .bespoke-print-letterhead{display:block!important;margin:0 0 1.5cm 0;padding-bottom:0.75cm;border-bottom:1px solid #000;font-family:Georgia,serif;color:#000}
  .bespoke-print-letterhead .lh-row{display:flex;justify-content:space-between;align-items:baseline;font-size:9pt;letter-spacing:0.18em;text-transform:uppercase;color:#000}
  .bespoke-print-letterhead .lh-firm{font-family:'Cormorant Garamond',Georgia,serif;font-size:14pt;letter-spacing:0.05em;text-transform:none;font-weight:400;margin:0.4cm 0 0.2cm}
  .bespoke-print-letterhead .lh-recipient{font-family:'Cormorant Garamond',Georgia,serif;font-size:11pt;letter-spacing:0.04em;text-transform:none;font-style:italic;color:#222}
  .bespoke-print-letterhead .lh-meta{font-size:7.5pt;letter-spacing:0.12em;color:#444;margin-top:0.3cm}
}
.accreditations{margin-top:2rem;border-top:1px solid var(--border);padding-top:2.5rem}
.accreditations-label{font-size:0.6rem;text-transform:uppercase;letter-spacing:0.15em;color:rgba(255,255,255,0.65);display:block;margin-bottom:1.25rem}
.acc-links{display:flex;flex-wrap:wrap;gap:12px 30px;align-items:center}
.acc-link{font-size:0.65rem;text-transform:uppercase;letter-spacing:0.15em;color:var(--text-muted);text-decoration:none;transition:color 0.6s var(--ease-luxury);position:relative;padding-bottom:6px;display:inline-flex;align-items:center;min-height:20px}
@media (max-width:768px){.accreditations{margin-top:2.5rem;padding-top:2rem}}
.acc-link::after{content:'';position:absolute;left:0;bottom:0;width:0%;height:1px;background:var(--accent);transition:width 0.5s var(--ease-luxury)}
.acc-link:hover,.acc-link:focus-visible{color:#fff}
.acc-link:hover::after,.acc-link:focus-visible::after{width:100%}
.reveal-up{opacity:0;transform:translateY(10px);transition:opacity 0.7s var(--ease-luxury),transform 0.7s var(--ease-luxury);will-change:opacity,transform}
.reveal-up.active{opacity:1;transform:translateY(0)}
/* Above-the-fold hero is the LCP content: never gate it on JS. It renders
   immediately (the preloader provides the entrance), so it stays visible
   even if main.js is slow or fails to load. */
.hero .reveal-up{opacity:1;transform:none}
.ledger-row{display:flex;flex-direction:column;padding:2.5rem 0;border-bottom:1px solid var(--border);transition:0.6s var(--ease-luxury);cursor:pointer}
.ledger-row:first-child{border-top:1px solid var(--border)}
.ledger-row span{font-size:0.7rem;text-transform:uppercase;letter-spacing:0.15em;color:var(--text-muted);margin-top:0.5rem;transition:color 0.5s var(--ease-luxury)}
/* Touch devices never get the desktop hover that brightens this descriptor, so on tablet/phone
   the sub-line under each client name stayed too faint to read. Give it more size and contrast. */
@media (hover:none){.ledger-row span{color:var(--text);font-size:0.78rem}}
@media (min-width:769px){.ledger-row{flex-direction:row;justify-content:space-between;align-items:baseline}.ledger-row:hover h3,.ledger-row:focus-within h3{color:var(--accent);transform:translateX(10px);transition:0.5s var(--ease-luxury)}.ledger-row:hover span,.ledger-row:focus-within span{color:#fff}}
/* === Confidential client reveal - restored blur effect ===
   Direct h3 styling (no inner span wrapper) so font-size, family, weight
   and letter-spacing inherit identically from sibling ledger row h3s.
   Subtle gold tint while obscured for brand alignment. */
.obfuscate{filter:blur(8px);opacity:0.5;color:rgba(204,180,108,0.7);margin-left: -6px; /* Pulls the blurred text left to visually align it */transition:filter 0.9s var(--ease-luxury),opacity 0.9s var(--ease-luxury),color 0.9s var(--ease-luxury);user-select:none;will-change:filter,opacity}
.obfuscate.revealed{filter:blur(0);margin-left: 0; /* Snaps back to true zero when the hard edge returns */opacity:1;color:inherit}
@media (prefers-reduced-motion:reduce){.obfuscate{transition-duration:0.01ms}}
.impact-visual{width:100%;margin:80px 0;border:1px solid var(--border);position:relative;overflow:hidden;background:#111;aspect-ratio:16/9}
.impact-visual img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform 2.5s var(--ease-luxury)}
.lush-bw{filter:grayscale(100%) contrast(1.1)}
.lush-color{opacity:0;transition:opacity 0.5s ease,transform 2.5s var(--ease-luxury);-webkit-mask-image:radial-gradient(circle 250px at var(--x,50%) var(--y,50%),black 30%,transparent 100%);mask-image:radial-gradient(circle 250px at var(--x,50%) var(--y,50%),black 30%,transparent 100%)}
.impact-visual:hover img{transform:scale(1.03)}
.impact-visual:hover .lush-color{opacity:1}
/* Wraps the LUSH credential image with a clarifying footnote: it is the founder's prior
   agency-era track record, not a Crane Consultancy client. Figure keeps the outer rhythm. */
.impact-figure{margin:80px 0}
.impact-figure .impact-visual{margin:0}
.impact-caption{margin-top:0.95rem;font-family:var(--font-sans);font-size:0.8rem;line-height:1.5;color:var(--text-muted);letter-spacing:0.01em;max-width:64ch}
.video-facade{position:relative;width:100%;aspect-ratio:16/9;background:#000;overflow:hidden;cursor:pointer;border:1px solid var(--border);margin-top:40px}
.video-facade img{width:100%;height:100%;object-fit:cover;opacity:0.6;transition:opacity 0.5s ease}
.video-facade:hover img{opacity:0.4}
.play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border:1px solid rgba(255,255,255,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);transition:all 0.5s var(--ease-luxury);z-index:2;box-shadow:inset 0 0 0 0 transparent}
.play-btn::before{content:'';width:0;height:0;border-style:solid;border-width:8px 0 8px 14px;border-color:transparent transparent transparent #fff;margin-left:4px;transition:border-color 0.4s ease}
.video-facade:hover .play-btn{transform:translate(-50%,-50%) scale(1.1);border-color:var(--accent);box-shadow:inset 0 0 20px 0 rgba(204,180,108,0.2)}
.video-facade:hover .play-btn::before{border-color:transparent transparent transparent var(--accent)}
.video-facade video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:3;display:none}
.video-facade.playing video{display:block}
.video-facade.playing{cursor:auto}
.video-facade.playing .play-btn,.video-facade.playing img{display:none}
.competency-grid{display:grid;grid-template-columns:1fr;gap:60px;margin-top:60px;border-top:1px solid var(--border);padding-top:60px}
@media (min-width:769px){.competency-grid{grid-template-columns:repeat(3,1fr);gap:40px}}
@media (min-width:769px){.competency-grid.comp-grid-quad{grid-template-columns:repeat(2,1fr);gap:40px 56px}}
@media (min-width:1240px){.competency-grid.comp-grid-quad{grid-template-columns:repeat(4,1fr);gap:40px}}
.comp-col h3{font-family:var(--font-serif);font-size:1.8rem;color:#fff;margin-bottom:20px;display:flex;align-items:center;gap:10px}
.comp-col h3::before{content:'';display:block;width:20px;height:1px;background:var(--accent)}
.comp-list{list-style:none}
.comp-list li{font-size:0.85rem;color:var(--text-muted);border-bottom:1px solid rgba(255,255,255,0.05);padding:12px 0;display:flex;justify-content:space-between;align-items:center;transition:color 0.4s var(--ease-luxury),padding-left 0.4s var(--ease-luxury);cursor:default}
.comp-list li:last-child{border-bottom:none}
.comp-list li:hover{color:#fff;padding-left:10px}
.comp-list li::after{content:'+';font-size:9px;opacity:0;transition:opacity 0.3s}
.comp-list li:hover::after{opacity:1;color:var(--accent)}
/* Services: one-line discipline descriptor (each card reads as a standalone offer) */
.comp-intro{font-size:0.9rem;color:var(--text-muted);line-height:1.55;margin:-6px 0 20px;max-width:34ch;text-wrap:pretty}
/* Services: Data & Automation presented as the spine beneath the three disciplines */
.service-spine{margin-top:48px;border-top:1px solid var(--border);padding-top:36px}
@media (min-width:769px){.service-spine{display:grid;grid-template-columns:0.85fr 1.15fr;gap:48px;align-items:start}}
.spine-title{font-family:var(--font-serif);font-size:1.5rem;color:#fff;margin-bottom:12px;display:flex;align-items:center;gap:10px}
.spine-title::before{content:'';display:block;width:20px;height:1px;background:var(--accent);flex-shrink:0}
.spine-note{font-size:0.9rem;color:var(--text-muted);line-height:1.55;max-width:44ch;text-wrap:pretty}
.spine-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:22px}
@media (min-width:769px){.spine-list{margin-top:4px}}
.spine-list li{font-size:0.72rem;letter-spacing:0.03em;color:var(--text-muted);border:1px solid var(--border);border-radius:2px;padding:7px 12px;background:rgba(255,255,255,0.01);transition:border-color 0.4s var(--ease-luxury),color 0.4s var(--ease-luxury)}
.spine-list li:hover{border-color:var(--accent-dim);color:var(--text)}
/* ============================================================
   Dedicated service pages (src/services.njk)
   ============================================================ */
.hero-cta{margin-top:1.75rem}
.service-included{list-style:none;margin-top:1.5rem}
@media (min-width:600px){.service-included{display:grid;grid-template-columns:repeat(2,1fr);column-gap:56px}}
.service-included li{font-size:0.92rem;color:var(--text-muted);border-bottom:1px solid rgba(255,255,255,0.06);padding:13px 0;transition:color 0.4s var(--ease-luxury),padding-left 0.4s var(--ease-luxury)}
.service-included li:hover{color:#fff;padding-left:8px}
.proof-line{margin-top:2.25rem;padding-top:1.5rem;border-top:1px solid var(--border);font-size:0.85rem;line-height:1.6;color:var(--accent);letter-spacing:0.01em;max-width:62ch;text-wrap:pretty}
/* "Creator of the AI Search Readiness Scanner" credibility chip (key templates) */
.scanner-cred{display:inline-flex;align-items:center;gap:10px;margin-top:1.5rem;padding:9px 16px;border:1px solid var(--accent-dim);border-radius:2px;background:rgba(204,180,108,0.04);font-family:var(--font-sans);font-size:0.6rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--accent-bright);text-decoration:none;transition:background 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury)}
.scanner-cred:hover{background:rgba(204,180,108,0.1);border-color:var(--accent)}
.scanner-cred-mark{width:18px;height:18px;flex:0 0 auto}
/* Consultant vs Agency comparison table. Horizontal scroll on small screens
   keeps the two columns honestly side by side rather than stacking the verdict. */
.vs-wrap{margin-top:2.5rem;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:2px}
.vs-table{width:100%;min-width:620px;border-collapse:collapse;font-family:var(--font-sans)}
.vs-table thead th{text-align:left;padding:0 1.2rem 0.9rem;font-size:0.6rem;text-transform:uppercase;letter-spacing:0.2em;font-weight:600;color:var(--text-subtle);border-bottom:1px solid var(--border-strong);vertical-align:bottom}
.vs-table thead th.vs-us{color:var(--accent-bright)}
.vs-table tbody th{text-align:left;font-weight:600;font-size:0.6rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--text-muted);padding:1.05rem 1.2rem;vertical-align:top;width:22%}
.vs-table tbody td{font-size:0.9rem;line-height:1.5;color:var(--text-muted);padding:1.05rem 1.2rem;vertical-align:top;border-bottom:1px solid var(--border);width:39%}
.vs-table td.vs-us{color:var(--text);background:var(--accent-faint);border-left:1px solid var(--accent-dim);border-right:1px solid var(--accent-dim)}
.vs-table tbody tr:last-child td{border-bottom:1px solid var(--border-strong)}
.vs-table tbody tr:last-child td.vs-us{border-bottom:1px solid var(--accent-dim)}
/* Mobile: a 3-column comparison table cannot fit a phone, and horizontal scroll reads
   as a clipped/broken column. Stack each attribute into a card with its two values
   clearly labelled, so nothing is cut off and nothing needs sideways scrolling. */
@media (max-width:640px){
  .vs-wrap{overflow-x:visible}
  .vs-table{display:block;width:100%;min-width:0}
  .vs-table tbody{display:block}
  .vs-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .vs-table tbody tr{display:block;border:1px solid var(--border);border-radius:4px;margin-bottom:0.9rem;overflow:hidden}
  .vs-table tbody th[scope="row"]{display:block;width:auto;padding:0.85rem 1rem 0.55rem;color:var(--accent-bright);border:0;font-size:0.62rem}
  .vs-table tbody td{display:block;width:auto;padding:0.1rem 1rem 0.85rem;border:0;font-size:0.85rem}
  .vs-table tbody td::before{display:block;font-size:0.55rem;text-transform:uppercase;letter-spacing:0.14em;font-weight:700;margin-bottom:0.15rem;color:var(--text-subtle)}
  .vs-table tbody td.vs-us{background:var(--accent-faint);border-left:2px solid var(--accent-dim)}
  .vs-table tbody td.vs-us::before{content:"Senior Consultant";color:var(--accent-bright)}
  .vs-table tbody td:not(.vs-us)::before{content:"Traditional Agency"}
  .vs-table tbody tr:last-child td{border-bottom:0}
}
/* Case study meta strip (client / sector / discipline) and scope stats. */
.cs-meta{display:flex;flex-wrap:wrap;gap:16px 36px;margin:1.75rem 0 0;padding-top:1.5rem;border-top:1px solid var(--border);font-family:var(--font-sans)}
.cs-meta>div{display:flex;flex-direction:column;gap:5px}
.cs-meta dt{font-size:0.55rem;text-transform:uppercase;letter-spacing:0.2em;color:var(--text-subtle);font-weight:600}
.cs-meta dd{font-size:0.9rem;color:var(--text);margin:0;line-height:1.3}
.cs-note{margin-top:1.25rem;font-size:0.62rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--text-subtle)}
.cs-scope{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-top:2.5rem;border-radius:2px;overflow:hidden}
@media (min-width:769px){.cs-scope{grid-template-columns:repeat(3,1fr)}}
.cs-scope li{background:var(--bg);padding:1.6rem 1.4rem;display:flex;flex-direction:column;gap:8px}
.cs-scope-val{font-family:var(--font-serif);font-size:clamp(1.5rem,2.4vw,2.05rem);color:var(--accent-bright);line-height:1;font-variant-numeric:tabular-nums lining-nums}
.cs-scope-label{font-size:0.62rem;text-transform:uppercase;letter-spacing:0.14em;color:var(--text-muted);line-height:1.45}
.cs-built{list-style:none;margin-top:1.5rem}
.cs-built li{position:relative;padding:0.7rem 0 0.7rem 1.6rem;border-bottom:1px solid var(--border);font-size:0.95rem;color:var(--text-muted);line-height:1.5}
.cs-built li::before{content:"";position:absolute;left:0;top:1.15rem;width:8px;height:8px;border:1px solid var(--accent);border-radius:50%}
/* Experience brand grid (About page). Career brands worked with, set as an
   understated typographic wall rather than a logo soup. */
.brand-wall{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:2px;overflow:hidden;margin-top:2rem}
@media (min-width:600px){.brand-wall{grid-template-columns:repeat(3,1fr)}}
@media (min-width:900px){.brand-wall{grid-template-columns:repeat(4,1fr)}}
.brand-wall li{background:var(--bg);min-height:88px;padding:1.1rem 1rem;display:flex;align-items:center;justify-content:center;text-align:center;text-wrap:balance;font-family:var(--font-serif);font-size:1.05rem;line-height:1.2;color:var(--text-muted);transition:color 0.45s var(--ease-luxury),background 0.45s var(--ease-luxury)}
.brand-wall li:hover{color:var(--accent-bright);background:var(--accent-faint)}
/* Ask-an-AI proof panel: live-verify cards with per-engine deep links. */
.ai-ask-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--border);border:1px solid var(--border);border-radius:2px;overflow:hidden;margin-top:2.5rem}
@media (min-width:769px){.ai-ask-grid{grid-template-columns:repeat(3,1fr)}}
.ai-ask-card{background:var(--bg);padding:1.7rem 1.5rem;display:flex;flex-direction:column;gap:1.4rem;justify-content:space-between}
.ai-ask-q{font-family:var(--font-serif);font-size:1.2rem;line-height:1.32;color:#fff;margin:0;text-wrap:pretty}
.ai-ask-engines{display:flex;flex-wrap:wrap;gap:8px}
.ai-ask-engines a{font-family:var(--font-sans);font-size:0.62rem;text-transform:uppercase;letter-spacing:0.14em;font-weight:600;color:var(--accent);text-decoration:none;border:1px solid var(--accent-dim);border-radius:2px;padding:8px 14px;min-height:36px;display:inline-flex;align-items:center;transition:background 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury),color 0.4s var(--ease-luxury)}
.ai-ask-engines a:hover{background:var(--accent-faint);border-color:var(--accent);color:var(--accent-bright)}
/* The Forensic Method: numbered process steps. */
.method-list{list-style:none;margin-top:2rem}
.method-step{display:grid;grid-template-columns:auto 1fr;gap:1rem 1.5rem;padding:1.85rem 0;border-top:1px solid var(--border);align-items:start}
.method-step:last-child{border-bottom:1px solid var(--border)}
.method-num{font-family:var(--font-serif);font-size:clamp(1.9rem,3vw,2.7rem);line-height:0.85;color:var(--accent-bright);font-variant-numeric:tabular-nums lining-nums}
.method-body h3{font-family:var(--font-serif);font-size:clamp(1.3rem,2vw,1.7rem);color:#fff;margin:0 0 0.6rem;line-height:1.15}
.method-body p{margin:0;max-width:60ch;text-wrap:pretty}
.related-services{display:grid;grid-template-columns:1fr;gap:16px;margin-top:2rem}
@media (min-width:769px){.related-services{grid-template-columns:repeat(3,1fr)}}
.related-service{display:flex;flex-direction:column;gap:8px;padding:26px 24px;border:1px solid var(--border);border-radius:2px;text-decoration:none;background:rgba(255,255,255,0.01);transition:border-color 0.45s var(--ease-luxury),transform 0.45s var(--ease-luxury),background 0.45s var(--ease-luxury);box-shadow:inset 0 1px 0 rgba(255,255,255,0.05)}
.related-service:hover,.related-service:focus-visible{border-color:var(--accent-dim);background:var(--accent-faint);transform:translateY(-2px)}
.related-service-name{font-family:var(--font-serif);font-size:1.45rem;color:#fff;line-height:1.1}
.related-service-desc{font-size:0.6rem;text-transform:uppercase;letter-spacing:0.18em;color:var(--text-subtle);line-height:1.5}
.service-cta{border-top:1px solid var(--border);margin-top:1rem}
/* Homepage discipline cards: "Explore" link to the dedicated service page */
.comp-col{display:flex;flex-direction:column}
.comp-link{margin-top:auto;padding-top:22px;display:inline-flex;align-self:flex-start;align-items:center;gap:8px;font-family:var(--font-sans);font-size:0.7rem;text-transform:uppercase;letter-spacing:0.16em;font-weight:600;color:var(--accent);text-decoration:none;transition:color 0.4s var(--ease-luxury)}
.comp-link::after{content:'\2192';font-size:0.95rem;transition:transform 0.4s var(--ease-luxury)}
.comp-link:hover,.comp-link:focus-visible{color:var(--accent-bright)}
.comp-link:hover::after,.comp-link:focus-visible::after{transform:translateX(4px)}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 1000px var(--bg) inset;-webkit-text-fill-color:#fff;transition:background-color 5000s ease-in-out 0s}
::placeholder{color:rgba(255,255,255,0.3);opacity:1}
.field-group{position:relative;margin-bottom:40px}
.field-group:last-of-type{margin-bottom:50px}
.input-field{width:100%;background:transparent;border:none;border-bottom:1px solid var(--border);padding:15px 0;color:#fff;font-family:var(--font-serif);font-size:1.5rem;outline:none;border-radius:0;transition:border-color 0.5s var(--ease-luxury);min-height:48px}
.input-field:focus{border-color:var(--accent)}
.input-field[aria-invalid="true"]{border-color:var(--error)}
.input-field[aria-invalid="false"]:not(:placeholder-shown){border-color:var(--success)}
.field-error{display:block;font-family:var(--font-sans);font-size:0.72rem;color:var(--error);min-height:1.2em;margin-top:6px;opacity:0;transform:translateY(-4px);transition:opacity 0.4s var(--ease-quick),transform 0.4s var(--ease-quick);letter-spacing:0.04em}
.field-error.visible{opacity:1;transform:translateY(0)}
select.input-field{background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;color:rgba(255,255,255,0.3);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23CCB46C' d='M6 8L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center;padding-right:24px}
select.input-field.has-value{color:var(--text)}
select.input-field option{background:var(--bg);color:var(--text)}
textarea.input-field.challenge-textarea{resize:none;height:100px}
.submit-btn{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--accent-dim);color:var(--accent);-webkit-text-fill-color:var(--accent);font-family:var(--font-sans);font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.14em;cursor:pointer;width:max-content;opacity:1;transition:background 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury),color 0.4s var(--ease-luxury);min-height:50px;padding:15px 34px;border-radius:2px}
.submit-btn:hover,.submit-btn:focus-visible{background:rgba(204,180,108,0.08);border-color:var(--accent);color:var(--accent)}
.submit-btn:disabled{cursor:wait;opacity:0.6}
.form-status{font-family:var(--font-sans);font-size:0.85rem;color:var(--text-muted);margin-top:1rem;min-height:1.4em;transition:color 0.4s var(--ease-quick)}
.form-status.success{color:var(--success)}
.form-status.error{color:var(--error)}
.contact-image-container{position:relative;top:0;margin-bottom:50px}
@media (min-width:1025px){.contact-image-container{position:sticky;top:120px;margin-bottom:0}}
footer{border-top:1px solid var(--border);padding:clamp(2.75rem,7vw,5rem) 0 clamp(2rem,4vw,2.5rem);margin-top:clamp(3.5rem,9vw,6.25rem);font-size:0.7rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.15em;content-visibility:auto;contain-intrinsic-block-size:280px;position:relative;z-index:1;background-color:var(--bg)}
.footer-flex{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;margin-bottom:40px;align-items:flex-end}
.footer-nav-internal{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:30px;margin-bottom:30px;padding:24px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.footer-nav-internal a{color:var(--text-muted);text-decoration:none;transition:color 0.4s var(--ease-luxury);min-height:32px;display:inline-flex;align-items:center}
.footer-nav-internal a:hover,.footer-nav-internal a:focus-visible{color:var(--accent)}
.social-link{margin-right:20px;color:inherit;text-decoration:none;transition:color 0.4s var(--ease-luxury);transform-origin:center;display:inline-block;padding:8px 0;min-height:44px;line-height:28px}
.social-link:hover,.social-link:focus-visible{color:var(--accent)}
.whatsapp-link{color:var(--accent);text-decoration:none;transition:opacity 0.4s var(--ease-luxury);display:inline-block;transform-origin:center}
.whatsapp-link:hover,.whatsapp-link:focus-visible{opacity:0.7}
.address-link{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent-dim);text-underline-offset:4px;transition:color 0.4s var(--ease-luxury),text-decoration-color 0.4s var(--ease-luxury);display:inline-block}
.address-link:hover,.address-link:focus-visible{color:var(--accent);text-decoration-color:var(--accent)}
.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}
@media (max-width:768px){.desktop-br{display:none}}
.architecture-frame{font-family:var(--font-sans);background:rgba(17,17,17,0.4);border:1px solid rgba(204,180,108,0.15);border-radius:0;overflow:hidden;position:relative;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.architecture-frame.spacing-arch{margin-bottom:90px}
.architecture-frame::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(204,180,108,0.4) 50%,transparent);opacity:0.6}
.arch-header{padding:48px 44px 42px;border-bottom:1px solid rgba(255,255,255,0.08);position:relative;background:linear-gradient(180deg,rgba(204,180,108,0.02) 0%,transparent 100%)}
.arch-counter{font-size:10px;text-transform:uppercase;letter-spacing:0.2em;color:rgba(204,180,108,0.6);font-weight:600;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.arch-counter::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(204,180,108,0.3),transparent)}
.arch-title{font-family:var(--font-serif);font-size:clamp(1.5rem,2.7vw,1.9rem);font-weight:300;font-style:italic;color:#F2F2F2;line-height:1.3;letter-spacing:-0.02em;margin-bottom:12px;text-wrap:balance}
.arch-subtitle{font-size:14px;color:var(--text-muted);line-height:1.65;max-width:560px;font-weight:300}
.arch-section{border-bottom:1px solid rgba(255,255,255,0.06);position:relative}
.arch-section:last-of-type{border-bottom:none}
.arch-section::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,rgba(204,180,108,0.08),transparent);transition:width 0.6s var(--ease-luxury);pointer-events:none}
.arch-section:hover::before{width:100%}
.arch-section:hover{background:rgba(255,255,255,0.01)}
.section-trigger{appearance:none;-webkit-appearance:none;background:none;border:none;border-radius:0;font-family:var(--font-sans);text-align:left;width:100%;display:flex;align-items:center;gap:20px;padding:28px 44px;cursor:pointer;user-select:none;position:relative;transition:background 0.4s var(--ease-luxury);min-height:48px}
.section-index{font-size:10px;text-transform:uppercase;letter-spacing:0.18em;color:rgba(204,180,108,0.7);font-weight:600;min-width:24px;transition:color 0.4s ease}
.arch-section:hover .section-index,.arch-section.active .section-index{color:var(--accent)}
.section-label{font-size:16px;font-weight:500;color:#F2F2F2;flex:1;transition:transform 0.4s var(--ease-luxury),color 0.4s ease;line-height:1.4}
.arch-section:hover .section-label{transform:translateX(4px)}
.section-category{font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:rgba(168,168,168,0.85);border:0.5px solid rgba(255,255,255,0.1);padding:6px 16px;border-radius:2px;white-space:nowrap;font-weight:500;transition:all 0.4s ease}
.arch-section:hover .section-category{border-color:rgba(204,180,108,0.3);color:rgba(204,180,108,0.9)}
.section-icon{width:30px;height:30px;border:1px solid rgba(204,180,108,0.25);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;color:rgba(204,180,108,0.6);transition:all 0.5s var(--ease-luxury);flex-shrink:0}
.arch-section.active .section-icon{transform:rotate(45deg);background:rgba(204,180,108,0.1);border-color:rgba(204,180,108,0.5)}
.section-content{height:0;overflow:hidden;transition:height 0.55s var(--ease-luxury)}
.section-inner{padding:0 44px 36px 88px;border-top:1px solid rgba(255,255,255,0.04);opacity:0;transform:translateY(-10px);transition:opacity 0.5s var(--ease-luxury) 0.1s,transform 0.5s var(--ease-luxury) 0.1s}
.arch-section.active .section-inner{opacity:1;transform:translateY(0)}
.section-prose{font-size:14.5px;color:#B8B8B8;line-height:1.7;margin:24px 0 20px;font-weight:300}
.section-prose strong{color:#F2F2F2;font-weight:500}
.section-prose em{color:rgba(204,180,108,0.75);font-style:italic;font-weight:300}
.capabilities{display:flex;flex-wrap:wrap;gap:8px}
.capability{font-size:11.5px;color:var(--text-muted);border:0.5px solid rgba(255,255,255,0.1);padding:7px 14px;border-radius:2px;background:rgba(255,255,255,0.01);transition:all 0.3s var(--ease-luxury);font-weight:400;opacity:0;transform:translateY(8px)}
.arch-section.active .capability{animation:capabilityReveal 0.5s var(--ease-luxury) forwards}
@keyframes capabilityReveal{to{opacity:1;transform:translateY(0)}}
.capability:hover{border-color:var(--accent-dim);color:var(--text);background:var(--accent-faint)}
.capability:nth-child(1){animation-delay:0.05s}
.capability:nth-child(2){animation-delay:0.08s}
.capability:nth-child(3){animation-delay:0.11s}
.capability:nth-child(4){animation-delay:0.14s}
.capability:nth-child(5){animation-delay:0.17s}
.capability:nth-child(6){animation-delay:0.20s}
.capability:nth-child(7){animation-delay:0.23s}
.capability:nth-child(8){animation-delay:0.26s}
.capability:nth-child(9){animation-delay:0.29s}
.capability:nth-child(10){animation-delay:0.32s}
.capability:hover{background:rgba(204,180,108,0.04);border-color:rgba(204,180,108,0.25);color:rgba(204,180,108,0.95);transform:translateY(-1px)}
.capability.premium{color:rgba(204,180,108,0.9);border-color:rgba(204,180,108,0.35);background:rgba(204,180,108,0.08);font-weight:500}
.capability.premium:hover{background:rgba(204,180,108,0.14);border-color:rgba(204,180,108,0.55);color:var(--accent)}
.arch-footer{padding:32px 44px;background:rgba(17,17,17,0.6);border-top:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.footer-disclaimer{font-size:12.5px;color:rgba(168,168,168,0.9);line-height:1.6;flex:1;min-width:220px;font-weight:300}
.footer-disclaimer strong{color:#F2F2F2;font-weight:500}
.footer-action{appearance:none;-webkit-appearance:none;font-family:var(--font-sans);font-size:11px;text-transform:uppercase;letter-spacing:0.12em;color:var(--accent);border:1px solid rgba(204,180,108,0.4);padding:14px 28px;border-radius:2px;cursor:pointer;background:rgba(204,180,108,0.03);white-space:nowrap;transition:all 0.4s var(--ease-luxury);font-weight:500;position:relative;overflow:hidden;min-height:44px}
.footer-action::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(204,180,108,0.15),transparent);transition:left 0.6s ease}
.footer-action:hover::before,.footer-action:focus-visible::before{left:100%}
.footer-action:hover,.footer-action:focus-visible{background:rgba(204,180,108,0.1);border-color:rgba(204,180,108,0.65);transform:translateY(-1px)}
.footer-action:active{transform:translateY(0)}
body.custom-cursor-active .arch-section,body.custom-cursor-active .section-trigger,body.custom-cursor-active .section-inner,body.custom-cursor-active .capability,body.custom-cursor-active .arch-header,body.custom-cursor-active .arch-footer,body.custom-cursor-active .footer-action{cursor:none!important}
@media (max-width:768px){.arch-header{padding:36px 28px 32px}.arch-subtitle{font-size:13.5px}.section-trigger{padding:24px 28px;gap:16px}.section-label{font-size:15px}.section-inner{padding:0 28px 32px 28px}.section-prose{font-size:14px}.arch-footer{padding:28px 28px;flex-direction:column;align-items:flex-start}.section-category{display:none}.capability{font-size:11px}}
#contact{content-visibility:auto;contain-intrinsic-block-size:700px}
 
/* Utility classes (replacing inline styles for SEO/performance audits) */
.delay-2{transition-delay:0.1s}
.delay-3{transition-delay:0.2s}
.gtm-noscript{display:none;visibility:hidden}
.spaced-md{margin-top:clamp(2.75rem,5vw,5rem)}
.spaced-lg{margin-top:clamp(3.5rem,6vw,6.25rem)}
.spaced-xl{margin-top:clamp(4.5rem,7vw,7.5rem)}
.lede{margin-bottom:1.25rem}
.contact-grid{display:grid;grid-template-columns:1fr;gap:60px;align-items:start}
@media (min-width:1025px){.contact-grid{grid-template-columns:0.8fr 1.2fr;gap:100px}}
.location-frame{border:1px solid var(--border);background:#111;overflow:hidden;aspect-ratio:2/3}
.location-frame img{width:100%;height:100%;object-fit:cover;opacity:0.9}
.location-meta{margin-top:20px}
.fine-print{font-size:0.85rem;color:var(--text-muted)}
.form-container.lazy-reveal{transition-delay:0.2s}
.contact-heading{margin-bottom:40px}
.honeypot{position:absolute;left:-9999px;top:-9999px}
.form-actions{display:flex;flex-direction:column;gap:20px;align-items:flex-start;margin-top:20px}
.form-fallback{font-size:0.85rem;color:var(--text-muted)}
.footer-address{font-style:normal;margin-bottom:30px}
.copyright{color:var(--text-muted)}
.tm{font-size:0.58em;vertical-align:super;letter-spacing:0;margin-left:1px;color:var(--accent)}
.consent-note{margin:0.9rem 0 0;font-size:0.76rem;line-height:1.5;color:var(--text-muted)}
.scn-scope{margin:1rem auto 0;max-width:46ch;font-size:0.8rem;line-height:1.55;color:var(--text-muted);text-align:center}
.consent-note a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:from-font}
.scn-journey{margin:1.9rem auto 0;max-width:470px;text-align:center}
.scn-journey-cap{margin:0 0 1.2rem;font-size:0.78rem;letter-spacing:0.02em;color:var(--text-muted)}
.scn-journey-cap .scn-tm{color:var(--accent)}
.scn-track{display:flex;align-items:flex-start;justify-content:center;list-style:none;margin:0;padding:0}
.scn-tk{position:relative;flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;min-width:0}
.scn-tk:not(:first-child)::before{content:"";position:absolute;top:17px;right:50%;width:100%;height:1px;background:var(--border-strong,var(--border))}
.scn-tk a{display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none;color:inherit}
.scn-tk-dot{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:35px;height:35px;border-radius:50%;border:1px solid var(--border-strong,var(--border));background:var(--bg,#0a0a0a);font-size:0.86rem;font-weight:700;color:var(--text-muted);font-variant-numeric:tabular-nums}
.scn-tk-lb{font-size:0.78rem;letter-spacing:0.03em;color:var(--text-muted)}
.scn-tk.is-on .scn-tk-dot{border-color:var(--accent);background:var(--accent);color:#0a0a0a;box-shadow:0 0 0 4px rgba(204,180,108,0.12)}
.scn-tk.is-on .scn-tk-lb{color:var(--accent-bright,#E4CC84)}
.scn-tk:not(.is-on) a:hover .scn-tk-dot{border-color:var(--accent-dim,var(--accent));color:var(--text)}
.scn-tk:not(.is-on) a:hover .scn-tk-lb{color:var(--text)}
.legal-line{border-top:1px solid var(--border);padding-top:25px;font-size:0.58rem;color:#949494;letter-spacing:0.12em;text-transform:uppercase;line-height:1.9}
.vat-num{unicode-bidi:isolate;white-space:nowrap}
.legal-link{color:inherit;text-decoration:underline;text-underline-offset:4px}
.legal-btn{background:none;border:none;color:inherit;text-decoration:underline;text-underline-offset:4px;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;padding:0}
 
#tcc-cmp{position:fixed;inset:0;pointer-events:none;z-index:99990;font-family:var(--font-sans)}
#tcc-cmp[hidden]{display:none}
.cmp-banner{position:absolute;left:50%;bottom:24px;transform:translateX(-50%) translateY(calc(100% + 48px));width:min(92%,1080px);background:rgba(12,12,13,0.86);border:1px solid rgba(204,180,108,0.18);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);pointer-events:auto;opacity:0;transition:transform 1.1s var(--ease-luxury),opacity 0.9s var(--ease-luxury);will-change:transform,opacity;box-shadow:0 30px 80px -20px rgba(0,0,0,0.6),0 0 0 1px rgba(0,0,0,0.4)}
.cmp-banner::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(204,180,108,0.55) 50%,transparent)}
#tcc-cmp.is-open .cmp-banner{transform:translateX(-50%) translateY(0);opacity:1}
.cmp-banner-inner{display:grid;grid-template-columns:1fr;gap:28px;padding:36px 40px}
@media (min-width:880px){.cmp-banner-inner{grid-template-columns:1.5fr auto;align-items:center;gap:48px}}
.cmp-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:0.22em;color:rgba(204,180,108,0.7);font-weight:600;margin-bottom:12px;display:flex;align-items:center;gap:10px}
.cmp-eyebrow::after{content:'';flex:1;max-width:80px;height:1px;background:linear-gradient(90deg,rgba(204,180,108,0.35),transparent)}
.cmp-headline{font-family:var(--font-serif);font-style:italic;font-weight:300;font-size:clamp(1.4rem,2.4vw,1.85rem);line-height:1.25;color:#fff;letter-spacing:-0.015em;margin-bottom:10px}
.cmp-headline em{color:var(--accent);font-style:italic}
.cmp-body{font-size:13.5px;color:var(--text-muted);line-height:1.65;font-weight:300;max-width:60ch}
.cmp-body a{color:var(--accent);text-decoration:underline;text-decoration-color:var(--accent-dim);text-underline-offset:4px;transition:text-decoration-color 0.4s var(--ease-luxury)}
.cmp-body a:hover,.cmp-body a:focus-visible{text-decoration-color:var(--accent)}
.cmp-actions{display:flex;flex-direction:column;gap:10px;min-width:0}
@media (min-width:600px){.cmp-actions{flex-direction:row;flex-wrap:wrap}}
@media (min-width:880px){.cmp-actions{flex-direction:column;min-width:200px}}
.cmp-btn{appearance:none;-webkit-appearance:none;font-family:var(--font-sans);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.16em;padding:14px 26px;border-radius:2px;cursor:pointer;white-space:nowrap;position:relative;overflow:hidden;transition:all 0.5s var(--ease-luxury);min-height:44px}
.cmp-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(204,180,108,0.18),transparent);transition:left 0.7s ease}
.cmp-btn:hover::before,.cmp-btn:focus-visible::before{left:100%}
.cmp-btn--primary{background:var(--accent-leaf);color:var(--on-accent);border:1px solid var(--accent)}
.cmp-btn--primary:hover,.cmp-btn--primary:focus-visible{background:var(--accent-bright);border-color:var(--accent-bright);transform:translateY(-1px)}
.cmp-btn--ghost{background:rgba(204,180,108,0.04);color:var(--accent);border:1px solid rgba(204,180,108,0.4)}
.cmp-btn--ghost:hover,.cmp-btn--ghost:focus-visible{background:rgba(204,180,108,0.1);border-color:rgba(204,180,108,0.7);transform:translateY(-1px)}
.cmp-btn--text{background:transparent;color:var(--text-muted);border:1px solid transparent;padding-left:0;padding-right:0;letter-spacing:0.18em}
.cmp-btn--text:hover,.cmp-btn--text:focus-visible{color:#fff}
.cmp-btn--text::before{display:none}
.cmp-modal-backdrop{position:absolute;inset:0;background:rgba(5,5,5,0.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity 0.6s var(--ease-luxury)}
#tcc-cmp.modal-open .cmp-modal-backdrop{opacity:1;pointer-events:auto}
.cmp-modal{position:absolute;top:50%;left:50%;transform:translate(-50%,-45%) scale(0.96);width:min(92%,720px);max-height:86vh;background:rgba(12,12,13,0.95);border:1px solid rgba(204,180,108,0.2);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);opacity:0;pointer-events:none;transition:opacity 0.7s var(--ease-luxury),transform 0.9s var(--ease-luxury);display:flex;flex-direction:column;box-shadow:0 40px 100px -20px rgba(0,0,0,0.7)}
.cmp-modal::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(204,180,108,0.55) 50%,transparent)}
#tcc-cmp.modal-open .cmp-modal{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
.cmp-modal-header{padding:38px 40px 28px;border-bottom:1px solid rgba(255,255,255,0.06);background:linear-gradient(180deg,rgba(204,180,108,0.025) 0%,transparent 100%);flex-shrink:0}
.cmp-modal-title{font-family:var(--font-serif);font-style:italic;font-weight:300;font-size:1.75rem;line-height:1.25;color:#fff;letter-spacing:-0.02em;margin-bottom:10px}
.cmp-modal-sub{font-size:13px;color:var(--text-muted);line-height:1.65;font-weight:300;max-width:56ch}
.cmp-modal-body{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(204,180,108,0.3) transparent}
.cmp-modal-body::-webkit-scrollbar{width:6px}
.cmp-modal-body::-webkit-scrollbar-thumb{background:rgba(204,180,108,0.3);border-radius:3px}
.cmp-cat{padding:22px 40px;border-bottom:1px solid rgba(255,255,255,0.05);display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.cmp-cat>div:first-child{flex:1 1 0%;min-width:0}
.cmp-cat:last-child{border-bottom:none}
.cmp-cat-name{font-size:14px;font-weight:500;color:#F2F2F2;margin-bottom:6px;display:flex;align-items:center;gap:10px}
.cmp-cat-name .lock{font-size:9px;text-transform:uppercase;letter-spacing:0.15em;color:rgba(204,180,108,0.7);border:0.5px solid rgba(204,180,108,0.3);padding:3px 8px}
.cmp-cat-desc{font-size:12.5px;color:var(--text-muted);line-height:1.65;font-weight:300}
.cmp-toggle{position:relative;width:44px;height:24px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:24px;cursor:pointer;flex-shrink:0;transition:all 0.4s var(--ease-luxury)}
.cmp-toggle::after{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;background:#888;border-radius:50%;transition:all 0.4s var(--ease-luxury)}
.cmp-toggle[aria-checked="true"]{background:rgba(204,180,108,0.25);border-color:rgba(204,180,108,0.5)}
.cmp-toggle[aria-checked="true"]::after{left:calc(100% - 20px);background:var(--accent);box-shadow:0 0 12px rgba(204,180,108,0.4)}
.cmp-toggle[aria-disabled="true"]{cursor:not-allowed;opacity:0.7}
.cmp-toggle:focus-visible{outline:2px dashed var(--accent);outline-offset:4px}
.cmp-modal-footer{padding:24px 40px;flex-shrink:0;border-top:1px solid rgba(255,255,255,0.08);background:rgba(8,8,9,0.6);display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.cmp-reopen{position:fixed;right:24px;bottom:24px;z-index:99980;appearance:none;background:rgba(12,12,13,0.85);border:1px solid rgba(204,180,108,0.3);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;visibility:hidden;opacity:0;pointer-events:none;transition:opacity 0.6s var(--ease-luxury),visibility 0s linear 0.6s,transform 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury)}
.cmp-reopen.visible{visibility:visible;opacity:1;pointer-events:auto;transition:opacity 0.6s var(--ease-luxury),visibility 0s linear 0s,transform 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury)}
.cmp-reopen:hover,.cmp-reopen:focus-visible{transform:scale(1.08);border-color:var(--accent)}
.cmp-reopen svg{width:18px;height:18px;stroke:var(--accent);fill:none;stroke-width:1.4}
.cmp-reopen.near-footer,.cmp-reopen.near-section{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.4s var(--ease-luxury),visibility 0s linear 0.4s}
@media (max-width:768px){.cmp-banner-inner{padding:28px 24px}.cmp-modal{top:2dvh;bottom:calc(2dvh + env(safe-area-inset-bottom) + 20px);left:50%;transform:translateX(-50%) scale(0.96);width:min(94%,720px);max-height:none;height:auto;overflow:hidden;display:flex;flex-direction:column}#tcc-cmp.modal-open .cmp-modal{transform:translateX(-50%) scale(1)}.cmp-modal-header{padding:18px 24px 14px;flex:0 0 auto}.cmp-modal-title{font-size:1.3rem;margin-bottom:6px}.cmp-modal-sub{font-size:12px;line-height:1.5}.cmp-modal-body{flex:1 1 0;flex-grow:1;flex-shrink:1;flex-basis:0;min-height:0;height:auto;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;-webkit-mask-image:linear-gradient(to bottom,black 0%,black calc(100% - 8px),transparent 100%);mask-image:linear-gradient(to bottom,black 0%,black calc(100% - 8px),transparent 100%)}.cmp-modal-body .cmp-cat{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:16px;padding:12px 24px;width:100%}.cmp-modal-body .cmp-cat>div:first-child{flex:1 1 auto;min-width:0}.cmp-cat-name{font-size:13px;margin-bottom:3px}.cmp-cat-desc{font-size:11px;line-height:1.45}.cmp-modal-footer{padding:10px 24px 30px;gap:5px;flex:0 0 auto}.cmp-actions{flex-direction:column}.cmp-btn{width:100%;padding:12px 18px;font-size:10px;letter-spacing:0.14em}}
body.custom-cursor-active .cmp-banner,body.custom-cursor-active .cmp-modal,body.custom-cursor-active .cmp-btn,body.custom-cursor-active .cmp-toggle,body.custom-cursor-active .cmp-reopen{cursor:none!important}
@media print{#tcc-cmp,.cmp-reopen{display:none!important}}
 
/* === Yellow latch: Private London Estate stays gold once revealed === */
.ledger-row.revealed h3{color:var(--accent)}
@media (min-width:769px){.ledger-row.revealed:hover h3{transform:translateX(10px)}}
 
/* === Senior Mind / Founder section === */
.founder-section{margin-bottom:120px}
.founder-grid{display:grid;grid-template-columns:1fr;gap:50px;margin-top:60px;align-items:start}
@media (min-width:769px){.founder-grid{grid-template-columns:0.85fr 1fr;gap:80px}}
.founder-portrait{position:relative;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--border);background:#111}
.founder-portrait img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:grayscale(100%) contrast(1.05);transition:filter 1.2s var(--ease-luxury),transform 1.5s var(--ease-luxury);will-change:transform,filter}
.founder-portrait:hover img{filter:grayscale(0%) contrast(1);transform:scale(1.02)}
.founder-portrait::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(5,5,5,0.55) 100%);pointer-events:none}
.founder-tag{position:absolute;bottom:18px;left:18px;right:18px;z-index:2;font-size:0.6rem;text-transform:uppercase;letter-spacing:0.2em;color:var(--text);display:flex;justify-content:space-between;gap:12px;font-family:var(--font-sans)}
.founder-tag span:last-child{color:var(--accent)}
.founder-bio .name-line{font-family:var(--font-sans);font-size:0.7rem;text-transform:uppercase;letter-spacing:0.25em;color:var(--accent);margin-bottom:1.5rem;display:block}
.founder-bio h3{font-size:clamp(1.4rem,2.5vw,2rem);margin-bottom:1.5rem;line-height:1.15}
.founder-bio p+p{margin-top:1.25rem}
.founder-bio .pull-quote{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.05rem,1.5vw,1.35rem);color:#fff;line-height:1.4;max-width:none;padding-top:1.5rem;border-top:1px solid var(--border);margin-top:2rem;text-wrap:pretty}
.founder-signature{display:block;font-family:var(--font-signature);font-size:clamp(3rem,4.6vw,4.6rem);color:var(--accent-bright);line-height:0.9;margin-top:1.8rem}
/* The founder's sign-off outranks client testimonial signatures: grander
   scale, plus a tapered pen-stroke underline (a genuine signed-mark cue)
   that the client .verdict-sig names do not carry. */
.founder-signature::after{content:"";display:block;width:clamp(118px,15vw,176px);height:1px;margin-top:0.5rem;background:linear-gradient(90deg,var(--accent),var(--accent-dim) 55%,transparent);opacity:0.85}
/* The Verdict - client testimonials */
.verdict-rating{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0.5rem 0 3.5rem;padding-bottom:2.5rem;border-bottom:1px solid var(--border)}
.verdict-stars{display:inline-flex;gap:4px;color:var(--accent);font-size:1.05rem;letter-spacing:2px;line-height:1}
.verdict-g{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;flex-shrink:0}
.verdict-g svg{width:100%;height:100%;display:block}
.verdict-score{font-family:var(--font-serif);font-size:2rem;color:#fff;line-height:1;font-weight:500;letter-spacing:0.01em}
.verdict-source{font-size:0.7rem;text-transform:uppercase;letter-spacing:0.22em;color:var(--text-subtle)}
.verdict-rating a{font-size:0.7rem;text-transform:uppercase;letter-spacing:0.22em;color:var(--text-muted);text-decoration:none;border-bottom:1px solid var(--border-strong);padding-bottom:3px;margin-left:auto;transition:color 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury)}
.verdict-rating a:hover{color:var(--accent);border-color:var(--accent)}
.verdict-grid{display:grid;grid-template-columns:1fr;gap:3rem 4.5rem;align-items:start}
@media (min-width:769px){.verdict-grid{grid-template-columns:repeat(2,1fr)}}
.verdict-quote{margin:0;display:flex;flex-direction:column}
.verdict-quote blockquote{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.15rem,1.6vw,1.4rem);line-height:1.45;color:#fff;margin:0;text-wrap:pretty}
.verdict-quote blockquote::before{content:'';display:block;width:28px;height:1px;background:var(--accent);margin-bottom:1.6rem}
.verdict-quote .verdict-author{margin-top:1.7rem;display:flex;flex-direction:column;gap:0.55rem}
.verdict-sig{font-family:var(--font-signature);font-size:clamp(2.1rem,2.6vw,2.55rem);line-height:0.85;color:var(--accent-bright);font-weight:400;letter-spacing:0.01em}
.verdict-co{font-family:var(--font-sans);font-size:0.66rem;text-transform:uppercase;letter-spacing:0.24em;color:var(--accent);font-weight:600}
@media (min-width:769px){.verdict-quote.is-lead{grid-column:1 / -1;padding-bottom:1rem;border-bottom:1px solid var(--border)}}
.verdict-quote.is-lead blockquote{font-size:clamp(1.5rem,2.3vw,2.05rem);line-height:1.36}
.verdict-quote.is-lead blockquote::before{width:40px;margin-bottom:1.8rem}
 
/* === Operating Standards (commitments) band === */
.commitments-grid{display:grid;grid-template-columns:1fr;gap:1px;margin-top:50px;background:var(--border);border:1px solid var(--border)}
@media (min-width:600px){.commitments-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.commitments-grid{grid-template-columns:repeat(4,1fr)}}
.commitment{background:var(--bg);padding:36px 30px 38px;transition:background 0.5s var(--ease-luxury);position:relative;overflow:hidden}
.commitment::after{content:'';position:absolute;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-dim));transition:width 0.6s var(--ease-luxury)}
.commitment:hover{background:var(--bg-elevated)}
.commitment:hover::after{width:100%}
.commitment-num{font-family:var(--font-serif);font-style:italic;font-size:1.5rem;color:var(--accent);display:block;margin-bottom:18px;opacity:0.9;line-height:1}
.commitment-title{font-family:var(--font-serif);font-weight:300;font-size:1.3rem;color:#fff;margin:0 0 10px 0;line-height:1.2;letter-spacing:-0.01em}
.commitment p{font-size:0.85rem;line-height:1.55;max-width:none;color:var(--text-muted)}
 
/* === Ledger intro spacing === */
.ledger-intro{margin-bottom:60px;max-width:60ch}
.ledger-intro h2{margin-top:0.6rem;margin-bottom:1rem}

/* City page hero - tighter sizing to fit all content above fold */
.city-hero .hero-title{font-size:clamp(2.5rem,6vw,5.5rem)}
.city-hero .hero-content{padding-top:6vh}
.city-hero .hero-subhead{margin-top:1rem;font-size:clamp(0.85rem,1vw,1rem)}
.city-hero .accreditations{margin-top:1.5rem;padding-top:1.5rem}
.city-hero .label{margin-top:2rem;margin-bottom:1rem}
.city-hero .hero-proof{margin-top:1.25rem}
/* Region/city heroes: the subhead runs wider than the homepage's and crosses the
   brighter part of the background video, so add a directional scrim behind the text
   for guaranteed contrast without flattening the image. Scoped to .city-hero, so the
   homepage hero is untouched. Sits above the video, below .hero-content (z-index:2). */
.city-hero .hero-video-wrapper::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(95deg,rgba(5,5,5,0.9) 0%,rgba(5,5,5,0.6) 40%,rgba(5,5,5,0.3) 70%,rgba(5,5,5,0.18) 100%)}
@media (max-width:768px){.city-hero .hero-video-wrapper::before{background:linear-gradient(180deg,rgba(5,5,5,0.4) 0%,rgba(5,5,5,0.62) 55%,rgba(5,5,5,0.82) 100%)}}

/* City tier pill */
.city-tier-pill{display:inline-flex;align-items:center;gap:8px;font-size:0.6rem;text-transform:uppercase;letter-spacing:0.22em;color:var(--accent);border:1px solid var(--accent-dim);padding:7px 16px;margin-bottom:1.5rem;font-family:var(--font-sans);font-weight:500}
.city-tier-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);flex-shrink:0}
/* Service hero (services.njk): keep the positioning pill as a tight pair with the
   discipline eyebrow rather than stranded above it. Scoped to .service-hero so
   city heroes are untouched. ('Speak with Nic' lives in the nav, so the hero
   leads with the scanner-cred chip rather than duplicating the CTA above the fold.) */
.service-hero .city-tier-pill{margin-bottom:0}
.service-hero .label{margin-top:1.1rem}

.breadcrumb-nav{padding:1.5rem 0 0;margin-bottom:-1rem}
.breadcrumb{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 8px;list-style:none;font-size:0.65rem;text-transform:uppercase;letter-spacing:0.15em;color:var(--text-subtle);line-height:1.5}
.breadcrumb li+li::before{content:"›";margin-right:8px;opacity:0.5}
.breadcrumb a{color:var(--text-muted);text-decoration:none;white-space:nowrap;transition:color 0.4s var(--ease-luxury)}
.breadcrumb a:hover{color:var(--accent)}

/* Hero-less pages (hub, USA): clear the fixed 90px navbar */
.page-top-offset{padding-top:90px}

.container a:not(.acc-link):not(.whatsapp-link):not(.address-link):not(.nav-cta):not(.logo):not(.social-link):not(.footer-nav-internal a):not(.legal-link):not(.breadcrumb a){color:var(--accent);text-decoration:underline;text-decoration-color:var(--accent-dim);text-underline-offset:4px;transition:color 0.4s var(--ease-luxury),text-decoration-color 0.4s var(--ease-luxury)}
.container a:not(.acc-link):not(.whatsapp-link):not(.address-link):not(.nav-cta):not(.logo):not(.social-link):not(.footer-nav-internal a):not(.legal-link):not(.breadcrumb a):hover{text-decoration-color:var(--accent)}

.section-pad p+p,.spaced-md p+p,.spaced-lg p+p{margin-top:1.25rem}

/* ── Privacy Policy page ── */
html{scroll-padding-top:110px}
.nav-back{background:none;border:1px solid var(--border);color:var(--accent);text-transform:uppercase;font-size:0.65rem;letter-spacing:0.15em;padding:14px 26px;cursor:pointer;transition:background 0.6s var(--ease-luxury),color 0.6s var(--ease-luxury),border-color 0.6s var(--ease-luxury);text-decoration:none;display:inline-flex;align-items:center;font-family:var(--font-sans);min-height:44px}
.nav-back:hover,.nav-back:focus-visible{background:var(--accent-leaf);color:var(--on-accent);border-color:var(--accent)}
@media (max-width:768px){.nav-back{padding:10px 16px;font-size:0.6rem;letter-spacing:0.1em}}
.page-header{padding:110px 0 60px;border-bottom:1px solid var(--border)}
@media (max-width:768px){.page-header{padding:140px 0 60px}}
.page-header h1{font-family:var(--font-serif);font-weight:300;font-size:clamp(3rem,7vw,6rem);line-height:0.95;letter-spacing:-0.03em;color:#fff;margin-bottom:2rem}
.page-header h1 em{color:var(--accent);font-style:italic;display:inline-block;padding-right:0.05em;padding-bottom:0.2em;margin-bottom:-0.2em}
.page-header .meta{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.2em;color:var(--text-muted)}
.policy-body{display:grid;grid-template-columns:1fr;gap:0;padding:80px 0 120px}
@media (min-width:1025px){.policy-body{grid-template-columns:260px 1fr;gap:80px;align-items:start}}
.policy-nav{position:relative;margin-bottom:60px}
@media (min-width:1025px){.policy-nav{position:sticky;top:110px;margin-bottom:0}}
.policy-nav p{font-size:0.65rem;text-transform:uppercase;letter-spacing:0.2em;color:var(--text-muted);margin-bottom:1.5rem;max-width:none}
.policy-nav ol{list-style:none;counter-reset:nav-counter}
.policy-nav ol li{counter-increment:nav-counter;border-top:1px solid var(--border)}
.policy-nav ol li:last-child{border-bottom:1px solid var(--border)}
.policy-nav ol li a{display:flex;align-items:baseline;gap:12px;padding:12px 0;color:var(--text-muted);text-decoration:none;font-size:0.75rem;letter-spacing:0.05em;transition:color 0.4s var(--ease-luxury)}
.policy-nav ol li a::before{content:counter(nav-counter,decimal-leading-zero);font-size:0.6rem;color:var(--accent);opacity:0.7;flex-shrink:0}
.policy-nav ol li a:hover,.policy-nav ol li a:focus-visible{color:#fff}
.policy-content section{padding:60px 0;border-bottom:1px solid var(--border)}
.policy-content section:first-child{padding-top:0}
.policy-content section:last-child{border-bottom:none}
.policy-content h2{font-family:var(--font-serif);font-weight:300;font-size:clamp(1.8rem,3vw,2.8rem);letter-spacing:-0.03em;color:#fff;margin-bottom:1.5rem;line-height:1.1;display:flex;align-items:baseline;gap:16px}
@media (max-width:768px){.policy-content h2{font-size:1.6rem}}
.section-number{font-family:var(--font-sans);font-size:0.6rem;letter-spacing:0.2em;color:var(--accent);opacity:0.7;text-transform:uppercase;flex-shrink:0;padding-top:0.3em}
.policy-content p{font-size:1rem;color:var(--text-muted);font-weight:300;max-width:68ch;margin-bottom:1.25rem;line-height:1.8}
.policy-content p:last-child{margin-bottom:0}
.policy-content ul,.policy-content ol{margin:1rem 0 1.25rem 0;padding-left:0;list-style:none;max-width:68ch}
.policy-content ul li,.policy-content ol li{font-size:1rem;color:var(--text-muted);font-weight:300;padding:10px 0;border-bottom:1px solid rgba(255,255,255,0.05);display:flex;align-items:baseline;gap:12px;line-height:1.7}
.policy-content ul li:last-child,.policy-content ol li:last-child{border-bottom:none}
.policy-content ul li::before{content:'·';color:var(--accent);opacity:0.8;font-size:1.2rem;flex-shrink:0;line-height:1}
.policy-content ol{counter-reset:list-counter}
.policy-content ol li{counter-increment:list-counter}
.policy-content ol li::before{content:counter(list-counter,decimal-leading-zero);color:var(--accent);opacity:0.6;font-size:0.65rem;letter-spacing:0.1em;flex-shrink:0}
.policy-content a{color:var(--accent);text-decoration:underline;text-decoration-color:var(--accent-dim);text-underline-offset:4px;transition:opacity 0.3s var(--ease-luxury)}
.policy-content a:hover,.policy-content a:focus-visible{opacity:0.7}
.policy-content strong{color:#fff;font-weight:500}
.callout{border:1px solid var(--border);background:rgba(204,180,108,0.04);padding:30px 36px;margin:2rem 0;max-width:68ch;position:relative}
.callout::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent);opacity:0.5}
.callout p{margin-bottom:0;font-size:0.95rem}
.contact-block{margin-top:2rem;padding:36px;border:1px solid var(--border);max-width:68ch}
.contact-block .label{margin-bottom:1rem}
.contact-block p{margin-bottom:0.5rem}
.contact-block p:last-child{margin-bottom:0}
.nearby-row{text-decoration:none;color:inherit;display:flex} .nearby-row:hover{opacity:.85}
.faq-list{border-top:1px solid var(--border);margin-top:2rem}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item .faq-q{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;padding:1.4rem 0;font-family:var(--font-serif);font-size:1.35rem;color:var(--text);transition:color .3s ease}
.faq-item .faq-q::-webkit-details-marker{display:none}
.faq-item .faq-q::after{content:"+";font-family:var(--font-sans);font-size:1.5rem;color:var(--accent);transition:transform .3s ease;flex-shrink:0;line-height:1}
.faq-item[open] .faq-q,.faq-item .faq-q:hover{color:var(--accent)}
.faq-item[open] .faq-q::after{transform:rotate(45deg)}
.faq-a{padding:0 0 1.6rem;max-width:62ch}
.faq-a p{color:var(--text-muted);margin:0;line-height:1.7}
@media (prefers-reduced-motion:reduce){.faq-item .faq-q,.faq-item .faq-q::after{transition:none}}

/* Failsafe: reveal-up sections become visible even if the observer misses them.
   The .js path keeps the animation; this guarantees content can never be
   left permanently invisible on any device. */
.no-js .reveal-up{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .reveal-up{opacity:1;transform:none}
}
.no-js .reveal-up{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal-up{opacity:1;transform:none}}

/* ============================================================
   INSIGHTS
   Append this block to the END of src/_includes/partials/main.css
   It inherits your Cormorant headings, Manrope body, gold accent
   and dark theme. It sets only spacing, the meta row, the feature
   card and small ledger tweaks. No font-family or colour overrides.
   ============================================================ */

/* ---------- Article ---------- */
.post-article { padding-top: 6rem; padding-bottom: 4rem; }

.post-header { max-width: 46rem; margin: 0 auto; }
.post-title { margin: 0.5rem 0 1.25rem; }
.post-header .lede { margin-bottom: 1.5rem; }
/* Slim gold-leaf hairline closing the masthead — echoes the OG card's accent bar. */
.post-header::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 1.9rem;
  background: var(--accent-leaf, linear-gradient(120deg, #EFDCA0, #D8BE74, #B6984F));
  border-radius: 1px;
}

.post-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  opacity: 0.78;
}
.post-byline { color: var(--accent, #CCB46C); }
.post-dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.55;
}

.post-hero { margin: 2.5rem auto; max-width: 60rem; }
.post-hero img { width: 100%; height: auto; display: block; border-radius: 4px; }

/* Prose rendered from Markdown */
.post-body { max-width: 46rem; margin: 2.5rem auto 0; }
.post-body > * + * { margin-top: 1.4rem; }
.post-body h2 { margin-top: 2.75rem; }
.post-body h3 { margin-top: 2rem; }
.post-body p { line-height: 1.75; }
:where(.post-body) a {
  color: var(--accent, #CCB46C);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.post-body ul,
.post-body ol { padding-left: 1.25rem; }
.post-body li + li { margin-top: 0.5rem; }
.post-body blockquote {
  margin: 2.25rem 0;
  padding-left: 1.25rem;
  border-left: 2px solid var(--accent, #CCB46C);
  font-style: italic;
  opacity: 0.92;
}
.post-body img { max-width: 100%; height: auto; border-radius: 4px; }

.post-updated {
  max-width: 46rem;
  margin: 2.5rem auto 0;
  font-size: 0.85rem;
  opacity: 0.6;
}

/* Founder close on articles */
.post-founder {
  border-top: 1px solid rgba(204, 180, 108, 0.18);
  padding-top: 3rem;
  margin-top: 4rem;
}

/* ---------- Insights index ---------- */
.insights-hero { padding: 6rem 0 1.5rem; }
.insights-hero .lede { max-width: 40rem; }

/* Promoted latest piece */
.insights-feature {
  display: block;
  text-decoration: none;
  color: inherit;
  border: 1px solid rgba(204, 180, 108, 0.18);
  border-radius: 6px;
  overflow: hidden;
  margin: 2.5rem 0 3.5rem;
  transition: border-color 0.3s ease, transform 0.3s ease;
}
.insights-feature:hover {
  border-color: var(--accent, #CCB46C);
  transform: translateY(-2px);
}
.insights-feature-img img { width: 100%; height: auto; display: block; }
.insights-feature-meta { padding: 2.25rem; }
.insights-feature-meta h2 { margin: 0.5rem 0 1rem; }
.insights-feature-meta .lede { margin-bottom: 1.25rem; }

/* Ledger of remaining pieces (reuses your .ledger-row) */
.insights-ledger { margin-bottom: 2rem; }
.insights-ledger .ledger-row { align-items: center; }
.ledger-row-main { display: flex; flex-direction: column; }
.ledger-cat {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.7rem;
}

@media (max-width: 600px) {
  .insights-feature-meta { padding: 1.5rem; }
  .insights-hero { padding-top: 4.5rem; }
}

/* ============================================================
   PRIMARY NAV: mobile menu (toggle + full-screen overlay)
   Ported from the homepage so the navigation is identical on
   every templated page. .section-nav is defined above; this
   block adds the hamburger toggle and the overlay.
   ============================================================ */
.menu-toggle{display:none;position:relative;width:44px;height:44px;background:none;border:none;cursor:pointer;align-items:center;justify-content:center;z-index:1001}
.menu-toggle .bar{position:absolute;left:11px;width:22px;height:1.5px;background:var(--text);transition:transform .5s var(--ease-luxury),background-color .4s var(--ease-luxury)}
.menu-toggle .bar:nth-child(1){transform:translateY(-4px)}
.menu-toggle .bar:nth-child(2){transform:translateY(4px)}
body.menu-open .menu-toggle .bar{background:var(--accent)}
body.menu-open .menu-toggle .bar:nth-child(1){transform:translateY(0) rotate(45deg)}
body.menu-open .menu-toggle .bar:nth-child(2){transform:translateY(0) rotate(-45deg)}
.menu-overlay{position:fixed;inset:0;z-index:999;display:flex;flex-direction:column;justify-content:center;padding:120px 9% 60px;overflow-y:auto;overscroll-behavior:contain;background:rgba(5,5,5,0.96);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .7s var(--ease-luxury),visibility 0s linear .7s}
body.menu-open .menu-overlay{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .7s var(--ease-luxury),visibility 0s linear 0s}
.menu-inner{display:flex;flex-direction:column;gap:2px}
.menu-link{display:flex;align-items:baseline;gap:18px;font-family:var(--font-serif);font-weight:300;font-size:clamp(2rem,9vw,3.2rem);line-height:1.2;letter-spacing:-0.02em;color:var(--text);text-decoration:none;padding:10px 0;opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease-luxury),transform .6s var(--ease-luxury),color .4s var(--ease-luxury)}
body.menu-open .menu-link{opacity:1;transform:translateY(0)}
body.menu-open .menu-link:nth-child(1){transition-delay:.08s}
body.menu-open .menu-link:nth-child(2){transition-delay:.14s}
body.menu-open .menu-link:nth-child(3){transition-delay:.20s}
body.menu-open .menu-link:nth-child(4){transition-delay:.26s}
.menu-link:hover,.menu-link:focus-visible{color:var(--accent)}
.menu-index{font-family:var(--font-sans);font-size:0.7rem;font-weight:600;letter-spacing:0.15em;color:rgba(204,180,108,0.7);min-width:1.6em}
.menu-divider{height:1px;background:var(--border);margin:30px 0 26px;opacity:0;transition:opacity .6s var(--ease-luxury) .30s}
body.menu-open .menu-divider{opacity:1}
.menu-cta{align-self:flex-start;display:inline-block;background:none;border:1px solid var(--accent-dim);color:var(--accent);text-transform:uppercase;font-family:var(--font-sans);font-size:0.7rem;letter-spacing:0.18em;font-weight:600;padding:18px 40px;border-radius:2px;text-decoration:none;opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease-luxury) .34s,transform .6s var(--ease-luxury) .34s,background-color .5s var(--ease-luxury),color .5s var(--ease-luxury),border-color .5s var(--ease-luxury)}
body.menu-open .menu-cta{opacity:1;transform:translateY(0)}
.menu-cta:hover,.menu-cta:focus-visible{background:var(--accent-leaf);color:var(--on-accent);border-color:var(--accent)}
.menu-meta{display:flex;justify-content:space-between;align-items:center;margin-top:42px;font-family:var(--font-sans);font-size:0.6rem;text-transform:uppercase;letter-spacing:0.2em;color:var(--text-subtle);opacity:0;transition:opacity .6s var(--ease-luxury) .4s}
body.menu-open .menu-meta{opacity:1}
.menu-whatsapp{color:var(--accent);text-decoration:none}
body.menu-open{overflow:hidden}
.menu-link:focus-visible{outline:none;color:var(--accent)}
/* Tablet: swap the section-nav for the hamburger, but keep the "Speak with Nic" CTA up top
   (hiding it here was too aggressive — it left tablet users with no visible booking prompt). */
@media (max-width:1200px){.menu-toggle{display:flex}}
/* Phones: the CTA button crowds the logo, so it collapses into the hamburger menu (which carries its own). */
@media (max-width:600px){.nav-cta{display:none}}
@media (min-width:1201px){.menu-overlay{display:none}}
/* Hero proof line, mid-page diagnostic offer, contact offer (audit additions) */
.hero-proof{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-top:1.75rem}
.hero-proof-stars{color:var(--accent);font-size:0.95rem;letter-spacing:2px;line-height:1}
.hero-proof a{color:var(--text-muted);text-decoration:none;font-size:0.82rem;letter-spacing:0.03em;border-bottom:1px solid var(--border);padding-bottom:3px;transition:color 0.4s var(--ease-luxury),border-color 0.4s var(--ease-luxury)}
.hero-proof a:hover,.hero-proof a:focus-visible{color:var(--accent);border-color:var(--accent-dim)}
.hero-proof a strong{color:var(--text);font-weight:600;letter-spacing:0.02em}
.arch-cta-offer{font-family:var(--font-serif);font-style:italic;font-size:clamp(1.15rem,1.7vw,1.5rem);color:var(--text);line-height:1.4;max-width:34ch;margin:0 auto 2rem}
.contact-offer{color:var(--text-muted);font-size:clamp(0.95rem,1.2vw,1.05rem);line-height:1.55;max-width:46ch;margin:1.25rem 0 2.5rem}
.founder-video{margin-top:clamp(3rem,6vw,5rem)}
.founder-video .label{margin-top:0}
/* Primary booking CTA (main KPI) + secondary form divider */
.cta-book{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--accent-leaf);color:#050505;font-family:var(--font-sans);font-size:0.8rem;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;text-decoration:none;padding:18px 40px;border-radius:2px;border:1px solid var(--accent);transition:filter 0.45s var(--ease-luxury),border-color 0.45s var(--ease-luxury),transform 0.45s var(--ease-luxury);min-height:54px;margin-top:0.5rem}
.cta-book:hover,.cta-book:focus-visible{filter:brightness(1.06);border-color:var(--accent-bright);transform:translateY(-2px)}
.contact-heading + .contact-offer + .cta-book{margin-top:0.75rem}
.form-secondary-intro{margin:2.5rem 0 1.75rem;padding-top:2rem;border-top:1px solid var(--border);font-size:0.9rem;color:var(--text-muted);line-height:1.55;max-width:44ch}
@media print{.cta-book{display:none!important}}
/* Unified primary CTA - gold-leaf fill, dark label; harmonises nav/menu/mid-page/contact and forces the fill colour so the label can never inherit a transparent text-fill. The fill is the bright leaf, not flat gold: the flat #CCB46C read dark and lifeless next to the foil (Nic, 17 Jul 2026). */
.book-cta{background:var(--accent-leaf)!important;border:1px solid var(--accent)!important;color:#0A0A0A!important;-webkit-text-fill-color:#0A0A0A!important;text-decoration:none;font-weight:600}
.book-cta:hover,.book-cta:focus-visible{background:var(--accent-leaf)!important;filter:brightness(1.05);border-color:var(--accent-bright)!important;color:#0A0A0A!important;-webkit-text-fill-color:#0A0A0A!important}

/* ============================================================
   Mobile-first hardening - appended last so it wins the cascade
   without inflating selectors above. Three concerns:
   notch-safe insets, comfortable tap targets, and no sticky
   :hover left behind after a tap on touch devices.
   ============================================================ */

/* Safe-area insets for the viewport-fit=cover layout (notched phones).
   env() resolves to 0 where there is no inset, so these are no-ops elsewhere
   and identical to the previous values on non-notched devices. */
#navbar{padding-left:max(6%,env(safe-area-inset-left));padding-right:max(6%,env(safe-area-inset-right))}
.menu-overlay{padding-top:max(120px,calc(90px + env(safe-area-inset-top)));padding-bottom:calc(60px + env(safe-area-inset-bottom));padding-left:max(9%,env(safe-area-inset-left));padding-right:max(9%,env(safe-area-inset-right))}
.cmp-banner{bottom:calc(24px + env(safe-area-inset-bottom))}
.cmp-reopen{right:calc(24px + env(safe-area-inset-right));bottom:calc(24px + env(safe-area-inset-bottom))}

/* Comfortable footer tap target (WCAG 2.5.5). */
.footer-nav-internal a{min-height:44px}

/* Narrow-screen overflow guards for the content surface: long words/URLs wrap,
   and any future table or code block scrolls rather than breaking the layout. */
.container p,.container li,.container blockquote{overflow-wrap:break-word}
.container pre,.container table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Touchscreen devices only - a true coarse pointer with no real hover.
   Hybrid laptops (mouse + touch) report hover:hover, so their hovers are kept. */
@media (hover:none) and (pointer:coarse){
  /* Desktop cursor ornaments never apply on touch (the JS also skips them). */
  #cursor,#cursor-follower{display:none!important}
  /* Hold each button at its resting state so a tap doesn't leave a stuck :hover. */
  .book-cta:hover{background:var(--accent)!important;border-color:var(--accent)!important}
  .cta-book:hover{transform:none}
  .nav-back:hover{background:none;color:var(--accent);border-color:var(--border)}
  .footer-action:hover{background:rgba(204,180,108,0.03);border-color:rgba(204,180,108,0.4);transform:none}
  .cmp-btn--primary:hover{background:var(--accent);border-color:var(--accent);transform:none}
  .cmp-btn--ghost:hover{background:rgba(204,180,108,0.04);border-color:rgba(204,180,108,0.4);transform:none}
  .video-facade:hover .play-btn{transform:translate(-50%,-50%);border-color:rgba(255,255,255,0.3);box-shadow:inset 0 0 0 0 transparent}
  .video-facade:hover .play-btn::before{border-color:transparent transparent transparent #fff}
}

/* ============================================================
   Hero vertical-overflow guard (mobile).
   The hero is display:flex; align-items:center, so when the
   content stack is taller than the viewport - notably city pages,
   which add the .city-tier-pill above the title - the centred
   block overflows EQUALLY top and bottom. That pushed the top of
   the stack UP under the fixed 90px navbar, where the "Based in
   <city>" pill collided with the logo on shorter screens.
   Letting the hero grow to its content height (height:auto +
   min-height:100dvh) removes the upward overflow; padding-top
   reserves the navbar's height so the first line always clears
   it. Content still centres when it fits and scrolls when it
   does not. The 90px keeps the menu hamburger (shown <=900px)
   clear of the hero content too. */
@media (max-width:768px){
  .hero{height:auto;min-height:100dvh;padding-top:calc(90px + env(safe-area-inset-top));padding-bottom:2.5rem}
  .hero-content,.city-hero .hero-content{padding-top:1rem}
}

/* ============================================================
   LIGHT MODE — "letterhead" theme (parchment / brown-ink / gold)
   Purely additive: everything below is scoped to
   :root[data-theme="light"] / [data-theme="light"] …, so the
   default (dark) identity is byte-for-byte unchanged. Palette is
   the console's proven letterhead set (console.css) for one Crane
   identity across the app and the marketing site. The theme is
   chosen once and remembered via the shared 'crane:theme' key.
   The cinematic video hero stays dark in BOTH themes: its token
   scope is re-declared to the dark values so a light page opens
   on a dark hero-band and settles onto parchment below.
   ============================================================ */
:root[data-theme="light"]{
  --bg:#EFE9DB;--bg-elevated:#FDFBF6;
  --bg-glow:radial-gradient(ellipse 75% 600px at 50% -120px,#F6F0E2 0%,#EFE9DB 100%);
  /* Gold as TEXT on parchment must be deep enough to read: #B0933F was ~2.4:1 (fails). --accent is now
     the AA-large antique gold used for both decoration and emphasis text; --accent-text is deeper still
     for small gold text (links, labels). */
  --accent:#8A6D1F;--accent-bright:#8A6D1F;--accent-text:#795E1A;
  --accent-dim:rgba(138,109,31,0.42);--accent-faint:rgba(176,147,63,0.12);--accent-shadow:rgba(176,147,63,0.22);
  /* Buttons wear the SAME bright gold leaf in both themes (Nic, 17 Jul 2026: the deep parchment bronze
     read dark and lifeless). Gold as TEXT stays deep (--accent/--accent-text above, and the .chapter-no
     override below) — brightness is for FILLS, legibility rules the type. */
  --accent-leaf:linear-gradient(168deg,#F6EDCB 0%,#EFDCA0 34%,#D8BE74 70%,#C9AC60 100%);
  --text-heading:#1a1712;--text:#3a352b;--text-muted:#6b6456;--text-subtle:#6f6858;
  --border:rgba(176,147,63,0.32);--border-strong:rgba(176,147,63,0.62);
  /* Near-black text/icons on the bright leaf: ~9:1 on the deepest stop #C9AC60 (the old white-on-bronze
     managed only ~4.9:1). Every --on-accent use in this sheet sits on a gold fill. */
  --on-accent:#0A0A0A;
  color-scheme:light;
}
/* Every gold BUTTON fill across the estate is now var(--accent-leaf) at its base rule (Nic, 17 Jul
   2026: all buttons gold leaf, matching) — no theme-scoped fill overrides needed here; the deep gold
   stays on borders as an engraved edge. */
/* Gold as display TEXT (the text-clipped chapter numerals) must stay deep on parchment — the bright
   leaf clips to ~1.5:1 against cream and vanishes. Restate the clip: the background shorthand would
   otherwise reset it. */
[data-theme="light"] .chapter-no{background:linear-gradient(168deg,#B0933F 0%,#8A6D1F 46%,#6E5518 100%);-webkit-background-clip:text;background-clip:text}
/* Browser chrome + system surfaces */
[data-theme="light"] ::selection{background:rgba(176,147,63,0.28);color:#1a1712}
[data-theme="light"] ::-webkit-scrollbar-track{background:var(--bg)}
[data-theme="light"] ::-webkit-scrollbar-thumb{background:#cfc6b0}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:var(--accent)}
/* Film-grain is a dark-canvas texture — nearly disable it on cream */
[data-theme="light"] .grain-overlay{opacity:0.02}
/* The splash stays dark (brief, brand-consistent) so its cream wordmark reads */
[data-theme="light"] #preloader{background:#050505}

/* --- Headings, card titles, strong text (were literal #fff / #F2F2F2 / #B8B8B8) --- */
[data-theme="light"] .comp-col h3,
[data-theme="light"] .spine-title,
[data-theme="light"] .ai-ask-q,
[data-theme="light"] .method-body h3,
[data-theme="light"] .related-service-name,
[data-theme="light"] .cmp-headline,
[data-theme="light"] .cmp-modal-title,
[data-theme="light"] .cmp-cat-name,
[data-theme="light"] .arch-title,
[data-theme="light"] .section-label,
[data-theme="light"] .founder-bio .pull-quote,
[data-theme="light"] .verdict-score,
[data-theme="light"] .verdict-quote blockquote,
[data-theme="light"] .commitment-title,
[data-theme="light"] .page-header h1,
[data-theme="light"] .policy-content h2,
[data-theme="light"] .input-field,
[data-theme="light"] .section-prose strong,
[data-theme="light"] .footer-disclaimer strong,
[data-theme="light"] .policy-content strong{color:var(--text-heading)}
[data-theme="light"] .section-prose{color:var(--text-muted)}
[data-theme="light"] .accreditations-label{color:var(--text-muted)}
/* --- Subscribe / Ask inputs: their dark fill (rgba(0,0,0,.35-.4)) reads as a grey slab on parchment. Give
   them a clean white field with the gold hairline border; typed text is already --text-heading, and the
   placeholder moves to a legible muted brown instead of a near-invisible faint gold. Light theme only. --- */
[data-theme="light"] .askart-input,
[data-theme="light"] .brief-input,
[data-theme="light"] .brief-name-input,
[data-theme="light"] .isub-input{background:#FFFFFF}
[data-theme="light"] .askart-input::placeholder,
[data-theme="light"] .brief-input::placeholder,
[data-theme="light"] .brief-name-input::placeholder,
[data-theme="light"] .isub-input::placeholder{color:var(--text-subtle)}
/* Hover-to-bright states that flipped to #fff */
[data-theme="light"] .acc-link:hover,[data-theme="light"] .acc-link:focus-visible,
[data-theme="light"] .comp-list li:hover,
[data-theme="light"] .service-included li:hover,
[data-theme="light"] .cmp-btn--text:hover,[data-theme="light"] .cmp-btn--text:focus-visible,
[data-theme="light"] .policy-nav ol li a:hover,[data-theme="light"] .policy-nav ol li a:focus-visible{color:var(--text-heading)}
@media (min-width:769px){
  [data-theme="light"] .ledger-row:hover span,[data-theme="light"] .ledger-row:focus-within span{color:var(--text-heading)}
}

/* --- White hairlines / faint fills → warm gold-tinted lines on parchment --- */
[data-theme="light"] .arch-header,
[data-theme="light"] .arch-section,
[data-theme="light"] .arch-footer,
[data-theme="light"] .section-inner,
[data-theme="light"] .section-category,
[data-theme="light"] .capability,
[data-theme="light"] .comp-list li,
[data-theme="light"] .service-included li,
[data-theme="light"] .spine-list li,
[data-theme="light"] .related-service,
[data-theme="light"] .policy-content ul li,[data-theme="light"] .policy-content ol li,
[data-theme="light"] .cmp-modal-header,
[data-theme="light"] .cmp-cat,
[data-theme="light"] .cmp-modal-footer,
[data-theme="light"] .cmp-toggle{border-color:var(--border)}
[data-theme="light"] .spine-list li,
[data-theme="light"] .related-service,
[data-theme="light"] .capability,
[data-theme="light"] .arch-section:hover{background:rgba(176,147,63,0.05)}
[data-theme="light"] .cmp-toggle{background:rgba(176,147,63,0.10)}
[data-theme="light"] .cmp-toggle::after{background:#b8ad92}
[data-theme="light"] .play-btn{border-color:rgba(26,23,18,0.28)}

/* --- Media placeholder frames (#111 behind photos) → cream --- */
[data-theme="light"] .impact-visual,
[data-theme="light"] .location-frame,
[data-theme="light"] .founder-portrait{background:var(--bg-elevated)}

/* --- Form controls --- */
[data-theme="light"] input:-webkit-autofill,
[data-theme="light"] input:-webkit-autofill:hover,
[data-theme="light"] input:-webkit-autofill:focus,
[data-theme="light"] textarea:-webkit-autofill{-webkit-text-fill-color:var(--text-heading)}
[data-theme="light"] ::placeholder{color:rgba(26,23,18,0.42)}
[data-theme="light"] select.input-field{color:rgba(26,23,18,0.42);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238A6D1F' d='M6 8L0 0h12z'/%3E%3C/svg%3E")}

/* --- Glass panels + scrims (were near-black rgba) → warm parchment glass --- */
[data-theme="light"] .architecture-frame{background:rgba(247,243,232,0.55)}
[data-theme="light"] .arch-footer{background:rgba(240,234,220,0.6)}
[data-theme="light"] .mandate-stamp{background:rgba(247,243,232,0.72)}
[data-theme="light"] .cmp-banner,
[data-theme="light"] .cmp-modal,
[data-theme="light"] .cmp-reopen{background:rgba(253,251,246,0.94);border-color:var(--accent-dim)}
[data-theme="light"] .cmp-modal-footer{background:rgba(240,234,220,0.7)}
[data-theme="light"] .cmp-modal-backdrop{background:rgba(40,36,28,0.32)}
[data-theme="light"] .menu-overlay{background:rgba(239,233,219,0.97)}
[data-theme="light"] .menu-cta:hover,[data-theme="light"] .menu-cta:focus-visible{color:var(--on-accent)}

/* --- Navbar: light text over the dark hero (unscrolled), ink over parchment (scrolled) --- */
[data-theme="light"] #navbar.scrolled{background:rgba(253,251,246,0.85);border-bottom-color:var(--border)}
[data-theme="light"] #navbar:not(.scrolled) .logo{color:#F6F2E9}
[data-theme="light"] #navbar:not(.scrolled) .section-nav a{color:rgba(245,240,228,0.82)}
[data-theme="light"] #navbar:not(.scrolled) .section-nav a:hover{color:#fff}
[data-theme="light"] #navbar:not(.scrolled) .menu-toggle .bar{background:#F2F2F2}
[data-theme="light"] #navbar.scrolled .logo{color:var(--text-heading)}
[data-theme="light"] #navbar.scrolled .section-nav a{color:var(--text-muted)}
[data-theme="light"] #navbar.scrolled .section-nav a:hover{color:var(--text-heading)}
[data-theme="light"] #navbar.scrolled .menu-toggle .bar{background:var(--text)}

/* --- The cinematic hero stays dark in light mode: re-scope the dark tokens onto
       the hero content subtree so every token-driven descendant (title, subhead,
       eyebrow, accreditation links, proof, city pill, scanner chip) renders exactly
       as it does in dark mode over the dark video. --- */
[data-theme="light"] .hero-content,
[data-theme="light"] .city-hero .hero-content,
[data-theme="light"] .service-hero .hero-content{
  --text-heading:#F6F2E9;--text:#F2F2F2;--text-muted:#B9B4A6;--text-subtle:#9a9384;
  --accent:#CCB46C;--accent-bright:#E4CC84;--accent-text:#E4CC84;
  --accent-dim:rgba(204,180,108,0.3);--accent-faint:rgba(204,180,108,0.08);
  --accent-leaf:linear-gradient(168deg,#F6EDCB 0%,#EFDCA0 34%,#D8BE74 70%,#C9AC60 100%);
  --border:rgba(255,255,255,0.12);--border-strong:rgba(255,255,255,0.22);
  --on-accent:#0A0A0A;
}
[data-theme="light"] .hero-content .accreditations-label{color:rgba(245,240,228,0.62)}
/* The primary gold CTAs (.book-cta / .cta-book) carry the bright leaf with hardcoded near-black text in
   BOTH themes now — one gold button across hero band and parchment body, so no per-theme text or fill
   overrides remain here. (The old light-mode deep-gold/white unify was retired 17 Jul 2026: it read
   dark and lifeless. The bright leaf reads on the black hero AND the parchment ground, ~9:1 label.) */

/* --- Appearance toggle in the masthead --- */
.theme-toggle{background:none;border:1px solid var(--border);color:var(--accent);width:40px;height:40px;min-height:40px;border-radius:2px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .5s var(--ease-luxury),color .5s var(--ease-luxury),border-color .5s var(--ease-luxury);flex:none;margin-left:6px}
.theme-toggle:hover,.theme-toggle:focus-visible{background:var(--accent-leaf);color:var(--on-accent);border-color:var(--accent)}
.theme-toggle svg{width:17px;height:17px;display:block}
.theme-toggle .ico-sun{display:none}
[data-theme="light"] .theme-toggle .ico-sun{display:block}
[data-theme="light"] .theme-toggle .ico-moon{display:none}
[data-theme="light"] #navbar:not(.scrolled) .theme-toggle{color:#F6F2E9;border-color:rgba(245,240,228,0.3)}
[data-theme="light"] #navbar:not(.scrolled) .theme-toggle:hover{color:var(--on-accent);border-color:var(--accent)}
.menu-theme-toggle{display:inline-flex;align-items:center;gap:10px;background:none;border:1px solid var(--accent-dim);color:var(--accent);font-family:var(--font-sans);font-size:0.62rem;text-transform:uppercase;letter-spacing:0.18em;font-weight:600;padding:12px 18px;border-radius:2px;cursor:pointer;min-height:44px}
.menu-theme-toggle svg{width:15px;height:15px}
.menu-theme-toggle .ico-sun{display:none}
[data-theme="light"] .menu-theme-toggle .ico-sun{display:inline-block}
[data-theme="light"] .menu-theme-toggle .ico-moon{display:none}

/* Desktop toggle hides on mobile (the full-screen menu carries its own) */
@media (max-width:1200px){.theme-toggle{display:none}}
/* Hero-less pages (hub / locations / policy): no dark hero sits behind the nav,
   so its text must be ink over the parchment page at every scroll position.
   Higher specificity (class on <html> + type) so it wins over the hero :not(.scrolled)
   rules regardless of source order. Added by the end-of-body script. */
html[data-theme="light"].page-no-hero #navbar .logo{color:var(--text-heading)}
html[data-theme="light"].page-no-hero #navbar .section-nav a{color:var(--text-muted)}
html[data-theme="light"].page-no-hero #navbar .section-nav a:hover{color:var(--text-heading)}
html[data-theme="light"].page-no-hero #navbar .menu-toggle .bar{background:var(--text)}
html[data-theme="light"].page-no-hero #navbar .theme-toggle{color:var(--accent);border-color:var(--border)}

/* --- Light mode readability: literal golds/greys that never flipped (found via contrast audit) --- */
/* Low-alpha brand golds used as TEXT on parchment (~1.9:1) → the deep readable gold. */
[data-theme="light"] .cmp-eyebrow,
[data-theme="light"] .cmp-cat-name .lock,
[data-theme="light"] .arch-counter,
[data-theme="light"] .section-index,
[data-theme="light"] .arch-section:hover .section-index,
[data-theme="light"] .section-icon,
[data-theme="light"] .section-prose em,
[data-theme="light"] .capability.premium,
[data-theme="light"] .obfuscate{color:var(--accent-text)}
[data-theme="light"] .capability.premium:hover,[data-theme="light"] .arch-section.active .section-index{color:var(--accent-text)}
/* Literal light greys (#949494 / #A8A8A8) used as text on parchment → ink-muted. */
[data-theme="light"] .legal-line,
[data-theme="light"] .legal-line .vat-num,
[data-theme="light"] .legal-line .legal-link,
[data-theme="light"] .legal-line .legal-btn,
[data-theme="light"] .section-category,
[data-theme="light"] .arch-section:hover .section-category,
[data-theme="light"] .footer-disclaimer{color:var(--text-muted)}
[data-theme="light"] .footer-disclaimer strong{color:var(--text-heading)}

/* --- Scanner/readiness pages: content-section headings sit on parchment but were hardcoded #fff.
   The scanner STAGE (.scn-stage / .scn-verdict / .scn-title / gauge) stays dark by design, so only the
   light content sections flip. Higher specificity than the pages' inline `.scn-ev h2` rules, so it wins. --- */
[data-theme="light"] .scn-ev h2,
[data-theme="light"] .scn-cta h2{color:var(--text-heading)}

/* --- Scanner RESULT + capture/founder/error sections use var(--bg) (→ parchment in light) but hardcode
   #fff headings/values and dark form fields. Flip them to ink; the dark STAGE (.scn-title/.scn-console)
   is excluded — it keeps its cinematic video + dark scrim in both themes. --- */
[data-theme="light"] .scn-gauge-num,
[data-theme="light"] .scn-verdict h2,
[data-theme="light"] .scn-lockup-txt b,
[data-theme="light"] .scn-cmp-verdict,
[data-theme="light"] .scn-tile-label,
[data-theme="light"] .scn-tile-brandname,
[data-theme="light"] .scn-founder h2,
[data-theme="light"] .scn-capture h2,
[data-theme="light"] .scn-err-title,
[data-theme="light"] .pr-disc b{color:var(--text-heading)}
[data-theme="light"] .scn-email{color:var(--text-heading);background:rgba(26,23,18,0.03)}
[data-theme="light"] .scn-email::placeholder{color:rgba(26,23,18,0.42)}
[data-theme="light"] .scn-badge-code{color:var(--text);background:rgba(26,23,18,0.05)}
/* Briefing signup fields: the base style hardcodes a dark fill + gold text (dark-mode design). On
   parchment that reads as a muddy grey box, so flip to a recessed light field with ink text and a
   readable placeholder — matching the .scn-email treatment. The gold Subscribe button keeps its own
   near-black label on the bright leaf in both themes. The booking form's inputs get the same recessed
   light fill. */
[data-theme="light"] .brief-input,
[data-theme="light"] .brief-name-input{background:rgba(26,23,18,0.03);border-color:var(--border);color:var(--text-heading)}
[data-theme="light"] .brief-input::placeholder,
[data-theme="light"] .brief-name-input::placeholder{color:rgba(26,23,18,0.42)}
[data-theme="light"] .bk-field input,
[data-theme="light"] .bk-field textarea{background:rgba(26,23,18,0.03);color:var(--text)}

/* Badge FINISH picker (Auto / Light / Dark) on the result — lets an installer match the mark to their
   own site. Token-driven gold pills, so it reads on the result section in either theme. */
.scn-badge-theme{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0.2rem 0 1.1rem}
.scn-badge-theme-lb{font-family:var(--font-sans);font-size:0.55rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-subtle);margin-right:2px}
.scn-badge-theme button{appearance:none;-webkit-appearance:none;cursor:pointer;font-family:var(--font-sans);font-size:0.58rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent-text,var(--accent));background:transparent;border:1px solid var(--accent-dim);border-radius:100px;padding:6px 14px;min-height:34px;transition:background .3s var(--ease-luxury),color .3s var(--ease-luxury),border-color .3s var(--ease-luxury)}
.scn-badge-theme button:hover{border-color:var(--accent)}
.scn-badge-theme button.is-on{background:var(--accent-leaf);color:var(--on-accent,#0A0A0A);border-color:var(--accent)}

/* Certification plaques — the footer badge on EVERY page and the "Earn the mark" demos — are dark inline
   SVGs (charcoal field, light-on-dark text). In light mode flip them to the light-plaque palette
   (parchment field, ink text, warm metallic frame) so they sit on the page instead of punching a dark
   hole in it — matching the light finish of the real /api/badge mark. */
[data-theme="light"] .footer-badge rect[fill="#070707"],
[data-theme="light"] .air-badge-svg rect[fill="#070707"]{fill:#F4EFE3}
[data-theme="light"] .footer-badge [fill="#e8e4da"],
[data-theme="light"] .air-badge-svg [fill="#e8e4da"]{fill:#2b2720}
[data-theme="light"] .footer-badge [fill="#8a7f5f"],
[data-theme="light"] .air-badge-svg [fill="#8a7f5f"]{fill:#6f6656}
[data-theme="light"] .footer-badge [fill="#8b8478"],
[data-theme="light"] .air-badge-svg [fill="#8b8478"]{fill:#857b68}
[data-theme="light"] .footer-badge [fill="#E4CC84"],
[data-theme="light"] .air-badge-svg [fill="#E4CC84"]{fill:#8A6D1F}
[data-theme="light"] .footer-badge [fill="#EAEEF2"],
[data-theme="light"] .air-badge-svg [fill="#EAEEF2"]{fill:#5b636f}
[data-theme="light"] .footer-badge svg rect,[data-theme="light"] .footer-badge svg line,
[data-theme="light"] .air-badge-svg rect,[data-theme="light"] .air-badge-svg line{stroke:#9a8a5a}

/* Legibility: lift genuine reading copy a touch so it reads comfortably without reading glasses.
   Decorative uppercase micro-labels and the editorial type scale are deliberately left untouched. */
.comp-intro,.spine-note{font-size:0.95rem}
.proof-line{font-size:0.9rem}
.vs-table tbody td{font-size:0.95rem}
.cs-meta dd{font-size:0.95rem}
.hero-subhead{font-size:clamp(1.1rem,1.35vw,1.32rem)}
.legal-line{font-size:0.62rem}
.cs-scope-label{font-size:0.66rem}
.spine-list li{font-size:0.76rem}