/* ==========================================================================
The Boardroom Edit, version three additions.
Reuses the existing tokens only (cream, latte, surface, dark green, clay).
Every animation here is wrapped in prefers-reduced-motion:no-preference or
is gated by the .v3-motion class, which v3.js only adds when motion is OK.
========================================================================== */
/* ---- Spacing after the edition labels were removed -------------------- */
.prose.nlp-section>h2:first-child{margin-top:0}
.nlp-chapter>h2:first-child{margin-top:var(--s-2)}
.nlp-about__body>h2:first-child{margin-top:0}
/* ---- 1. Scroll reveals (content stays visible without JS) -------------- */
.v3-motion .v3-reveal{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0) * 90ms)}
.v3-motion .v3-reveal.is-in{opacity:1;transform:none}
/* Skyline divider draws itself left to right; side rules grow from the middle */
.v3-motion .city-divider.v3-reveal{opacity:1;transform:none}
.v3-motion .city-divider.v3-reveal svg{clip-path:inset(0 100% 0 0);transition:clip-path 1.8s cubic-bezier(.45,.05,.2,1) .15s}
.v3-motion .city-divider.v3-reveal::before,.v3-motion .city-divider.v3-reveal::after{transform:scaleX(0);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.v3-motion .city-divider.v3-reveal::before{transform-origin:100% 50%}
.v3-motion .city-divider.v3-reveal::after{transform-origin:0 50%}
.v3-motion .city-divider.v3-reveal.is-in svg{clip-path:inset(0 0 0 0)}
.v3-motion .city-divider.v3-reveal.is-in::before,.v3-motion .city-divider.v3-reveal.is-in::after{transform:none}
/* Slow zoom (Ken Burns) on the Canary Wharf photo band */
.nlp-band--skyline{overflow:hidden;border-radius:1.25rem}
.nlp-band--skyline img{display:block;transform-origin:60% 55%}
@media (prefers-reduced-motion:no-preference){
.nlp-band--skyline img{animation:v3-kenburns 32s ease-in-out infinite alternate;will-change:transform}
}
@keyframes v3-kenburns{from{transform:scale(1)}to{transform:scale(1.07) translate(-1.2%,-.8%)}}
/* ---- 3. Living dusk hero (home only) ------------------------------------ */
.v3-dusk{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.9;
background:
radial-gradient(ellipse 60% 55% at 22% 100%,rgba(236,150,96,.38),transparent 70%),
radial-gradient(ellipse 70% 45% at 80% 100%,rgba(196,98,45,.18),transparent 72%),
linear-gradient(180deg,rgba(252,240,226,0) 30%,rgba(240,186,140,.28) 100%)}
@media (prefers-reduced-motion:no-preference){
.v3-home .v3-dusk{animation:v3-dusk-deepen 16s cubic-bezier(.3,.1,.3,1) both}
.v3-home .city-scene--home::before{animation:v3-sunset 16s cubic-bezier(.3,.1,.3,1) both}
/* windows switch on floor by floor (delay set per window as --d) */
.v3-home .cw-lit rect{animation:v3-light-on 1.1s ease-out var(--d,0s) both}
.v3-home .cw-lit rect.cw-t0{animation:v3-light-on 1.1s ease-out var(--d,0s) both,cw-twinkle 9s ease-in-out calc(var(--d,0s) + 2s) infinite}
.v3-home .cw-lit rect.cw-t1{animation:v3-light-on 1.1s ease-out var(--d,0s) both,cw-twinkle 11s ease-in-out calc(var(--d,0s) + 2s) infinite}
.v3-home .cw-lit rect.cw-t2{animation:v3-light-on 1.1s ease-out var(--d,0s) both,cw-twinkle 13s ease-in-out calc(var(--d,0s) + 2s) infinite}
.v3-home .cw-lit rect.cw-t3{animation:v3-light-on 1.1s ease-out var(--d,0s) both,cw-twinkle 8s ease-in-out calc(var(--d,0s) + 2s) infinite}
}
@keyframes v3-sunset{from{transform:translateY(-70%) scale(1.12);opacity:.85}to{transform:none;opacity:1}}
@keyframes v3-dusk-deepen{from{opacity:0}to{opacity:.9}}
@keyframes v3-light-on{0%{opacity:0}60%{opacity:1}75%{opacity:.55}100%{opacity:1}}
/* ---- 2. Video background section (warm-graded, cream wash) ------------- */
.v3-videohero{position:relative;isolation:isolate;overflow:hidden;
margin-inline:calc(50% - 50vw);padding-inline:calc(50vw - 50%);
min-height:clamp(380px,46vw,600px);display:flex;align-items:center;
background:var(--c-latte)}
.v3-videohero__media{position:absolute;inset:0;z-index:-2}
.v3-videohero__media img,.v3-videohero__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.v3-videohero__media video{opacity:0;transition:opacity 1.2s ease}
.v3-videohero__media video.is-playing{opacity:1}
/* cream/beige wash for legibility, dark green tone settling into the base */
.v3-videohero__wash{position:absolute;inset:0;z-index:-1;pointer-events:none;
background:
linear-gradient(90deg,rgba(247,243,236,.62) 0%,rgba(247,243,236,.84) 22%,rgba(247,243,236,.8) 48%,rgba(241,227,208,.38) 72%,rgba(241,227,208,.12) 100%),
linear-gradient(0deg,rgba(27,56,45,.34) 0%,rgba(27,56,45,0) 42%),
linear-gradient(180deg,rgba(247,243,236,.5) 0%,rgba(247,243,236,0) 16%)}
.v3-videohero__wash::after{content:"";position:absolute;inset:0;background:rgba(214,150,96,.14);mix-blend-mode:multiply}
.v3-videohero__content{position:relative;max-width:34rem;padding-block:var(--s-8)}
.v3-videohero__content .fp-price-label{margin:0 0 var(--s-3)}
.v3-videohero__line{margin:0;font-family:var(--font-serif);font-size:clamp(1.6rem,1.15rem + 1.6vw,2.6rem);line-height:1.15;letter-spacing:-.018em;color:var(--c-ink);font-weight:400}
.v3-videohero__toggle{position:absolute;right:max(var(--pad-x,1.25rem),calc(50vw - 50% + var(--s-4)));bottom:var(--s-4);z-index:2;display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.5rem 1rem;border:1px solid rgba(35,71,58,.35);border-radius:999px;background:rgba(255,253,249,.88);color:var(--c-accent);font:600 var(--fs-small)/1 var(--font-sans);cursor:pointer;backdrop-filter:blur(4px)}
.v3-videohero__toggle:hover{background:var(--c-card)}
.v3-videohero__toggle:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px}
.v3-videohero__toggle svg{width:14px;height:14px;fill:currentColor}
.nlp-photos--video{margin-top:var(--s-7)}
.nlp-photos--video .nlp-mosaic{margin-top:var(--s-6)}
@media (max-width:640px){
.v3-videohero{min-height:440px;align-items:flex-end}
.v3-videohero__wash{background:
linear-gradient(0deg,rgba(247,243,236,.95) 0%,rgba(247,243,236,.88) 48%,rgba(241,227,208,.35) 100%),
linear-gradient(180deg,rgba(27,56,45,.25) 0%,rgba(27,56,45,0) 40%)}
.v3-videohero__content{padding-block:var(--s-6) calc(var(--s-8) + var(--s-2))}
.v3-videohero__toggle{left:var(--pad-x,1.25rem);right:auto}
}
/* ---- Client-voice concerns (illustrations, not testimonials) ----------- */
.v3-voices{margin:var(--s-7) 0 var(--s-6)}
.v3-voices__note{margin:0 0 var(--s-4);color:var(--c-muted);font-size:var(--fs-small);max-width:42rem}
.v3-voices__list{display:grid;gap:var(--s-3);grid-template-columns:1fr;margin:0;padding:0;list-style:none}
@media (width>=700px){.v3-voices__list{grid-template-columns:repeat(2,1fr)}}
@media (width>=1000px){.v3-voices__list{grid-template-columns:repeat(3,1fr)}}
.v3-voice{margin:0;padding:var(--s-4) var(--s-4) var(--s-4) var(--s-5);background:var(--c-card);border:1px solid var(--c-rule);border-left:3px solid var(--c-clay);border-radius:var(--r-sm) var(--r-lg) var(--r-lg) var(--r-sm)}
.v3-voice p{margin:0 0 var(--s-2);font-family:var(--font-serif);font-style:italic;font-size:1.15rem;line-height:1.4;color:var(--c-ink)}
.v3-voice footer{font-size:var(--fs-eyebrow);letter-spacing:.1em;text-transform:uppercase;color:var(--c-clay);font-weight:600}
/* ---- Named method (three steps) ---------------------------------------- */
.v3-method{margin:var(--s-7) 0 var(--s-6);padding:clamp(1.5rem,3vw,2.75rem);background:var(--c-surface);border-radius:24px}
.v3-method h2{margin:0 0 var(--s-2);font-family:var(--font-serif);font-weight:400;font-size:var(--fs-h2);line-height:1.1;letter-spacing:-.02em}
.v3-method__intro{margin:0 0 var(--s-5);max-width:40rem}
.v3-method__steps{display:grid;gap:var(--s-4);grid-template-columns:1fr;margin:0;padding:0;list-style:none;counter-reset:step}
@media (width>=800px){.v3-method__steps{grid-template-columns:repeat(3,1fr)}}
.v3-method__steps li{position:relative;padding:var(--s-5) var(--s-4) var(--s-4);background:var(--c-card);border-radius:var(--r-lg);border:1px solid var(--c-rule)}
.v3-method__steps li::before{counter-increment:step;content:counter(step);display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin-bottom:var(--s-3);border-radius:50%;background:var(--c-accent);color:var(--c-paper);font:600 .95rem/1 var(--font-sans)}
.v3-method__steps h3{margin:0 0 var(--s-2);font-family:var(--font-serif);font-weight:500;font-size:var(--fs-h3)}
.v3-method__steps p{margin:0;font-size:var(--fs-small);line-height:1.55}
/* ---- Career-level signposting ------------------------------------------ */
.v3-levels{margin:var(--s-6) 0}
.v3-levels__list{display:grid;gap:var(--s-3);grid-template-columns:1fr;margin:0 0 var(--s-3);padding:0;list-style:none}
@media (width>=700px){.v3-levels__list{grid-template-columns:repeat(3,1fr)}}
.v3-levels__list a{display:flex;flex-direction:column;gap:.25rem;height:100%;padding:var(--s-4);border:1px solid var(--c-rule);border-radius:var(--r-lg);background:var(--c-card);color:var(--c-ink);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.v3-levels__list a:hover{border-color:var(--c-accent);box-shadow:0 10px 24px -18px rgba(30,26,22,.45)}
.v3-levels__list a:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px}
.v3-levels__level{font-size:var(--fs-eyebrow);letter-spacing:.1em;text-transform:uppercase;color:var(--c-clay);font-weight:600}
.v3-levels__name{font-family:var(--font-serif);font-size:1.35rem;line-height:1.2}
.v3-levels__who{font-size:var(--fs-small);color:var(--c-muted)}
.v3-levels__go{margin-top:auto;padding-top:var(--s-2);font-size:var(--fs-small);font-weight:600;color:var(--c-accent)}
.v3-levels__unsure{margin:0;font-size:var(--fs-small)}
.fp-tier-more--level{margin-top:var(--s-3)}
/* ---- 4. "Which room are you in?" check -------------------------------- */
.v3-check{margin:var(--s-7) 0 var(--s-6);padding:clamp(1.5rem,3.5vw,3rem);background:var(--c-latte);border-radius:24px}
.v3-check h2{margin:0 0 var(--s-2);font-family:var(--font-serif);font-weight:400;font-size:var(--fs-h2);line-height:1.1;letter-spacing:-.02em}
.v3-check__intro{margin:0 0 var(--s-5);max-width:40rem}
.v3-check__app{max-width:44rem}
.v3-check__progress{display:flex;gap:.4rem;margin:0 0 var(--s-2);padding:0;list-style:none}
.v3-check__progress li{flex:1;height:5px;border-radius:999px;background:rgba(35,71,58,.15);transition:background-color .3s}
.v3-check__progress li.is-done{background:var(--c-accent)}
.v3-check__progress li.is-current{background:var(--c-clay)}
.v3-check__count{margin:0 0 var(--s-3);font-size:var(--fs-small);color:var(--c-muted)}
.v3-check fieldset{margin:0;padding:0;border:0;min-width:0}
.v3-check legend{margin:0 0 var(--s-4);padding:0;font-family:var(--font-serif);font-size:clamp(1.35rem,1.15rem + .7vw,1.75rem);line-height:1.2}
.v3-check__opts{display:grid;gap:var(--s-2);margin:0;padding:0;list-style:none}
.v3-check__opt{display:flex;align-items:flex-start;gap:.75rem;min-height:48px;padding:.8rem 1rem;border:1px solid var(--c-rule);border-radius:var(--r-lg);background:var(--c-card);cursor:pointer;transition:border-color .15s,background-color .15s}
.v3-check__opt:hover{border-color:var(--c-accent)}
.v3-check__opt input{flex:none;width:1.15rem;height:1.15rem;margin:.15rem 0 0;accent-color:var(--c-accent)}
.v3-check__opt:has(input:checked){border-color:var(--c-accent);background:var(--c-tint)}
.v3-check__opt:has(input:focus-visible){outline:2px solid var(--c-accent);outline-offset:2px}
.v3-check__nav{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;margin-top:var(--s-5)}
.v3-check__nav .btn{width:auto;margin:0}
.v3-check .btn[disabled]{opacity:.45;cursor:not-allowed}
.v3-btn-quiet{min-height:44px;padding:.6rem 1rem;border:1px solid var(--c-rule-strong);border-radius:var(--r-md);background:transparent;color:var(--c-ink);font:500 1rem/1.2 var(--font-sans);cursor:pointer}
.v3-btn-quiet:hover{border-color:var(--c-ink)}
.v3-check__result{padding:var(--s-5);background:var(--c-card);border-top:3px solid var(--c-accent);border-radius:0 0 var(--r-lg) var(--r-lg);box-shadow:0 20px 40px -32px rgba(30,26,22,.5)}
.v3-check__result:focus{outline:none}
.v3-check__result h3{margin:0 0 var(--s-2);font-family:var(--font-serif);font-weight:400;font-size:clamp(1.6rem,1.3rem + 1vw,2.2rem);line-height:1.1}
.v3-check__result .btn-row{margin-top:var(--s-4);align-items:center}
.v3-check__result .btn-row .btn{width:auto;margin:0}
.v3-check__small{margin:var(--s-4) 0 0;font-size:var(--fs-small);color:var(--c-muted)}
.v3-check__small button{padding:0;border:0;background:none;color:var(--c-accent);font:inherit;font-weight:600;text-decoration:underline;cursor:pointer;min-height:44px}
/* ---- Placeholders (clearly marked) -------------------------------------- */
.v3-ph-tag{display:inline-block;margin:0 0 var(--s-2);padding:.2rem .6rem;border:1px dashed var(--c-rule-strong);border-radius:999px;font-size:var(--fs-eyebrow);letter-spacing:.08em;text-transform:uppercase;color:var(--c-muted);font-weight:600}
.v3-press{margin:var(--s-6) 0;padding:var(--s-5) 0;border-block:1px solid var(--c-rule);text-align:center}
.v3-press .fp-price-label{margin-bottom:var(--s-3)}
.v3-press__list{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-3) var(--s-6);margin:0 0 var(--s-3);padding:0;list-style:none}
.v3-press__list li{font-family:var(--font-serif);font-style:italic;font-size:1.2rem;color:var(--c-muted);opacity:.8}
.v3-press .nlp-note{margin:0 auto;max-width:40rem}
.v3-panel{margin:var(--s-7) 0 var(--s-6);padding:clamp(1.5rem,3vw,2.75rem);border-radius:24px;background:var(--c-card);border:1px solid var(--c-rule)}
.v3-panel--latte{background:var(--c-latte);border:0}
.v3-panel h2{margin:0 0 var(--s-3);font-family:var(--font-serif);font-weight:400;font-size:var(--fs-h2);line-height:1.1;letter-spacing:-.02em}
.v3-panel .btn{width:auto}
.v3-guide{display:grid;gap:var(--s-5);grid-template-columns:1fr}
@media (width>=800px){.v3-guide{grid-template-columns:1.1fr .9fr;align-items:start}}
.v3-guide__cover{aspect-ratio:3/4;max-width:15rem;margin:0 auto;padding:var(--s-5) var(--s-4);border-radius:var(--r-lg);background:linear-gradient(160deg,var(--c-green) 0%,var(--c-green-deep) 100%);color:var(--c-on-green);display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 30px 50px -34px rgba(20,16,12,.7)}
.v3-guide__cover span{font-size:var(--fs-eyebrow);letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.v3-guide__cover strong{font-family:var(--font-serif);font-weight:400;font-size:1.6rem;line-height:1.1}
.v3-newsletter{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:flex-end;margin-top:var(--s-4)}
.v3-newsletter label{flex:1 1 100%;font-size:var(--fs-small);font-weight:600}
.v3-newsletter input{flex:1 1 16rem;min-height:48px;padding:.6rem .9rem;border:1px solid var(--c-rule-strong);border-radius:var(--r-md);background:var(--c-card);font:inherit;color:var(--c-ink)}
.v3-newsletter input:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}
.v3-newsletter .btn{margin:0;width:auto}
/* ---- FAQ accordion (native details/summary) ----------------------------- */
.nlp-faq__item{border-top:1px solid var(--c-rule);padding:var(--s-3) 0}
.nlp-faq__item:last-of-type{border-bottom:1px solid var(--c-rule)}
.nlp-faq summary{cursor:pointer;font-family:var(--font-serif);font-size:1.2rem;color:var(--c-ink);list-style:none;display:flex;justify-content:space-between;gap:var(--s-3);align-items:baseline;min-height:44px;padding-top:.35rem}
.nlp-faq summary::-webkit-details-marker{display:none}
.nlp-faq summary::after{content:"+";flex:none;font-family:var(--font-sans);font-size:1.3rem;color:var(--c-clay);transition:transform .2s}
.nlp-faq details[open] summary::after{transform:rotate(45deg)}
.nlp-faq summary:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px}
.nlp-faq__a{padding-top:var(--s-2)}
.nlp-faq__a p{margin:0 0 var(--s-2)}
.nlp-faq h3{margin:var(--s-6) 0 var(--s-2);font-family:var(--font-sans);font-size:var(--fs-eyebrow);letter-spacing:.1em;text-transform:uppercase;color:var(--c-clay);font-weight:600}
/* ---- The Unwritten Rules page -------------------------------------------- */
.v3-filters{display:flex;flex-wrap:wrap;gap:var(--s-2);margin:0 0 var(--s-3);padding:0;list-style:none}
.v3-filters button{min-height:44px;padding:.5rem 1rem;border:1px solid var(--c-rule-strong);border-radius:999px;background:var(--c-card);color:var(--c-ink);font:500 var(--fs-small)/1 var(--font-sans);cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.v3-filters button:hover{border-color:var(--c-accent)}
.v3-filters button[aria-pressed="true"]{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-paper)}
.v3-filters button:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}
.v3-filter-count{margin:0 0 var(--s-4);font-size:var(--fs-small);color:var(--c-muted)}
.v3-rules{display:grid;gap:var(--s-4);grid-template-columns:1fr;margin:0 0 var(--s-6);padding:0;list-style:none}
@media (width>=700px){.v3-rules{grid-template-columns:repeat(2,1fr)}}
@media (width>=1100px){.v3-rules{grid-template-columns:repeat(3,1fr)}}
.v3-rule{display:flex;flex-direction:column;padding:var(--s-5) var(--s-4) var(--s-4);background:var(--c-card);border:1px solid var(--c-rule);border-radius:var(--r-lg)}
.v3-rule[hidden]{display:none}
.v3-rule .fp-tier-label{margin-bottom:var(--s-3)}
.v3-rule__phrase{margin:0 0 var(--s-4);font-family:var(--font-serif);font-weight:400;font-style:italic;font-size:1.45rem;line-height:1.2;color:var(--c-accent)}
.v3-rule dl{margin:0;font-size:var(--fs-small);line-height:1.55}
.v3-rule dt{margin:0 0 .2rem;font-weight:600;color:var(--c-ink)}
.v3-rule dd{margin:0 0 var(--s-3)}
.v3-rule dd:last-child{margin-bottom:0}
/* ---- Stories page placeholders ------------------------------------------- */
.v3-stories{display:grid;gap:var(--s-4);grid-template-columns:1fr;margin:0 0 var(--s-6);padding:0;list-style:none}
@media (width>=900px){.v3-stories{grid-template-columns:repeat(3,1fr)}}
.v3-story{display:flex;flex-direction:column;padding:var(--s-5) var(--s-4);background:var(--c-card);border:1px dashed var(--c-rule-strong);border-radius:var(--r-lg)}
.v3-story h3{margin:0 0 var(--s-1);font-family:var(--font-serif);font-weight:400;font-size:1.4rem}
.v3-story__meta{margin:0 0 var(--s-4);font-size:var(--fs-small);color:var(--c-muted)}
.v3-story dl{margin:0;font-size:var(--fs-small);line-height:1.55}
.v3-story dt{font-weight:600;margin:0 0 .2rem}
.v3-story dd{margin:0 0 var(--s-3);color:var(--c-muted)}
.v3-story blockquote{margin:auto 0 0;padding:var(--s-3) 0 0 var(--s-4);border-left:3px solid var(--c-clay);font-family:var(--font-serif);font-style:italic;color:var(--c-muted)}
/* Seven nav items: tighten spacing a touch on mid-size desktops */
@media (min-width:1100px) and (max-width:1320px){.hh-cats{gap:0}.hh-cat-link{padding-inline:.55rem}}
/* ==========================================================================
Premium polish (version three, carried into version four)
========================================================================== */
:root{
--v3-hair:rgba(160,82,45,.18);
--v3-shadow:0 1px 1px rgba(30,26,22,.03),0 2px 4px rgba(30,26,22,.035),0 10px 24px -14px rgba(30,26,22,.16);
--v3-shadow-lg:0 2px 3px rgba(30,26,22,.04),0 8px 16px -6px rgba(30,26,22,.08),0 26px 44px -22px rgba(30,26,22,.28);
--v3-ease:cubic-bezier(.2,.7,.2,1);
--v3-grain:url("data:image/svg+xml;utf8,");
}
.v3-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Elegant page-load fade */
@media (prefers-reduced-motion:no-preference){
body{animation:v3-page-in .7s var(--v3-ease) both}
@keyframes v3-page-in{from{opacity:0}to{opacity:1}}
}
/* Refined focus states */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px;box-shadow:0 0 0 6px rgba(35,71,58,.12);border-radius:4px}
/* Typography: tighter display tracking, larger editorial hero, better measure */
.page-header h1{letter-spacing:-.032em;line-height:1.03;text-wrap:balance}
.city-scene--home .page-header{max-width:46rem}
.city-scene--home .page-header h1{font-size:clamp(2.75rem,1.55rem + 3.9vw,4.75rem)}
.page-lede{max-width:36rem;text-wrap:pretty}
.prose p,.prose li{text-wrap:pretty}
.prose h2,.v3-check h2,.v3-method h2,.v3-panel h2{letter-spacing:-.024em;text-wrap:balance}
.prose{max-width:var(--w-text,39rem)}
/* Pull quote: centred, hairline-ruled, oversized clay quote mark */
.nlp-pullquote{position:relative;max-width:44rem;margin:var(--s-8) auto;padding:var(--s-7) var(--s-4) var(--s-6);border-left:0;border-block:1px solid var(--v3-hair);text-align:center}
.nlp-pullquote::before{content:"\201C";position:absolute;left:50%;top:-.62em;transform:translateX(-50%);padding:0 .2em;background:var(--c-paper);font-family:var(--font-serif);font-size:4.5rem;line-height:1;color:var(--c-clay);opacity:.75}
.nlp-pullquote-text{letter-spacing:-.015em;text-wrap:balance}
/* Drop cap on the opening paragraph of the About story */
.page>.nlp-chapter:first-of-type>p:first-of-type::first-letter{float:left;margin:.08em .12em 0 0;font-family:var(--font-serif);font-size:3.6em;line-height:.8;color:var(--c-accent);font-weight:500}
/* Subtle depth: layered shadows, hairline clay borders, faint grain on cream panels */
.fp-tier,.v3-rule,.v3-levels__list a,.v3-method__steps li,.v3-voice,.v3-story,.v3-check__opt,.v3-check__result{box-shadow:var(--v3-shadow)}
.fp-tier,.v3-rule,.v3-levels__list a,.v3-method__steps li,.v3-story{border-color:var(--v3-hair)}
.page-header,.nlp-about,.v3-check,.v3-method,.v3-panel--latte,.fp-price{background-image:var(--v3-grain)}
.nlp-about,.v3-check,.v3-method,.v3-panel{border:1px solid var(--v3-hair);box-shadow:0 1px 0 rgba(255,255,255,.65) inset,var(--v3-shadow)}
.nlp-mosaic img,.nlp-band img,.nlp-portrait,.nlp-about__photo{box-shadow:var(--v3-shadow)}
/* Refined hover lifts (cards and buttons) */
@media (prefers-reduced-motion:no-preference) and (hover:hover){
.fp-tier,.v3-rule,.v3-levels__list a,.v3-method__steps li,.v3-voice,.v3-story{transition:transform .45s var(--v3-ease),box-shadow .45s var(--v3-ease),border-color .3s}
.fp-tier:hover,.v3-rule:hover,.v3-levels__list a:hover,.v3-method__steps li:hover,.v3-voice:hover{transform:translateY(-4px);box-shadow:var(--v3-shadow-lg)}
.btn{transition:transform .3s var(--v3-ease),box-shadow .3s var(--v3-ease),background-color .15s,border-color .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px -12px rgba(27,56,45,.6)}
.nlp-mosaic img{transition:transform .8s var(--v3-ease),box-shadow .8s var(--v3-ease)}
.nlp-mosaic img:hover{transform:scale(1.015);box-shadow:var(--v3-shadow-lg)}
}
.btn{box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 6px 16px -10px rgba(27,56,45,.55)}
/* Animated underline on desktop nav links */
@media (min-width:1100px){
html .hh-cat-link{position:relative}
html .hh-cat-link::after{content:"";position:absolute;left:0;right:0;bottom:9px;height:1.5px;border-radius:2px;background:var(--c-clay);transform:scaleX(0);transform-origin:0 50%;transition:transform .4s var(--v3-ease)}
html .hh-cat-link:hover::after,html .hh-cat-link:focus-visible::after{transform:scaleX(1)}
html .hh-cat-link[aria-current=page]::after{display:none}
}
/* Figures strip with count-up */
.v3-stats{margin:var(--s-7) auto var(--s-6);max-width:60rem}
.v3-stats ul{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-5) var(--s-4);margin:0;padding:var(--s-5) 0;list-style:none;border-block:1px solid var(--v3-hair)}
@media (width>=800px){.v3-stats ul{grid-template-columns:repeat(4,1fr)}}
.v3-stats li{text-align:center;padding-inline:var(--s-2)}
@media (width>=800px){.v3-stats li+li{border-left:1px solid var(--v3-hair)}}
.v3-stat__num{display:block;font-family:var(--font-serif);font-size:clamp(2.4rem,1.8rem + 2vw,3.4rem);line-height:1;letter-spacing:-.03em;color:var(--c-accent);font-variant-numeric:lining-nums tabular-nums}
.v3-stat__label{display:block;margin-top:var(--s-2);font-size:var(--fs-small);line-height:1.4;color:var(--c-muted)}
/* Generous whitespace between major blocks */
@media (width>=900px){
.page>.prose.nlp-section,.page>.fp-price,.page>.v3-voices,.page>.v3-method,.page>.v3-check,.page>.v3-levels{margin-top:var(--s-8)}
}
/* Hero parallax (JS sets --v3-py; only when motion is allowed) */
.v3-parallax .city-scene{overflow:hidden}
.v3-parallax .city-skyline{transform:translate3d(0,calc(var(--v3-py,0) * 1px),0);will-change:transform}
.v3-parallax .city-scene--page .city-skyline--wide{transform:translate3d(-50%,calc(var(--v3-py,0) * 1px),0)}
/* wrappers keep the original grid and layout */
.v3-pic{display:contents}
.v3-pic source{display:none}
@media (width<=599px){.nlp-mosaic .v3-pic:first-child img{grid-column:1/-1;aspect-ratio:16/10;object-position:50% 10%}}
/* Centre the hairline under the centred "As seen in" label */
.v3-press .fp-price-label{display:inline-block}
/* ---- Version four: About credentials block (sits below the story) ---- */
.page>.nlp-chapter.v3-credentials{margin-top:var(--s-8);padding:clamp(1.5rem,3vw,2.5rem);background-color:var(--c-card);background-image:var(--v3-grain);border:1px solid var(--v3-hair);border-radius:24px;box-shadow:0 1px 0 rgba(255,255,255,.65) inset,var(--v3-shadow)}
.v3-credentials>.kicker{margin-bottom:var(--s-3)}
.v3-credentials>h2{margin-top:0}
.v3-credentials .nlp-list{columns:2 14rem;column-gap:var(--s-6)}
.v3-credentials .nlp-list li{break-inside:avoid}