/*
Theme Name: StoicByash Final
Theme URI: https://stoicbyash.com
Author: Yash
Description: The final StoicByash website as a native WordPress block theme. Activating it builds the site: pages, menu, images in the Media Library, case studies and articles. Every section is an editable block pattern; Insights use native Posts and Results use a lightweight Case Study post type.
Version: 3.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: stoicbyash
Tags: block-patterns, full-site-editing, blog, portfolio, one-column, editor-style, custom-colors, custom-menu, featured-images, translation-ready
*/

/* ---------- Tokens (driven by theme.json presets, so Styles in the editor change the design) ---------- */
:root{
  --black:var(--wp--preset--color--ink);--ivory:var(--wp--preset--color--ivory);--paper:var(--wp--preset--color--paper);--acc:var(--wp--preset--color--accent);
  --ink:var(--black);--bg:var(--ivory);
  --mute:rgba(11,11,10,.56);--line:rgba(11,11,10,.13);
  --f:var(--wp--preset--font-family--sans);--sig:var(--wp--preset--font-family--signature);
  --r:clamp(22px,2.6vw,40px);--g:clamp(16px,3.2vw,48px);--sec:clamp(88px,11vw,168px);--ease:cubic-bezier(.2,.7,.2,1);
}
.is-style-dark{--ink:var(--ivory);--bg:var(--black);--mute:rgba(244,242,236,.6);--line:rgba(244,242,236,.15);background:var(--bg);color:var(--ink)}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body:has(.wp-block-navigation__responsive-container.is-menu-open){overflow:hidden}
:where(.wp-site-blocks) :where(h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol){margin:0}
:where(.wp-site-blocks) :where(ul,ol){padding:0;list-style:none}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:var(--acc);color:var(--black)}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
:root p+p{margin-top:1em}
p,li{text-wrap:pretty}

/* ---------- Type (block style variations) ---------- */
.is-style-mega,.is-style-big,.is-style-title{font-weight:800;text-wrap:balance;isolation:isolate}
.is-style-mega{padding-bottom:.1em;font-size:var(--wp--preset--font-size--mega);line-height:.8;letter-spacing:-.07em;text-transform:lowercase}
.is-style-big{font-size:var(--wp--preset--font-size--big);line-height:.92;letter-spacing:-.055em}
.is-style-title{font-size:var(--wp--preset--font-size--title);line-height:1;letter-spacing:-.04em;font-style:italic}
.is-style-lead{font-size:var(--wp--preset--font-size--lead);line-height:1.45;max-width:38ch}
.is-style-small,.small{font-size:.84rem;line-height:1.45}
.is-style-kicker{display:inline-flex;align-items:center;gap:.6em;margin-bottom:1.4rem!important;font-size:.8rem;font-weight:500}
.is-style-kicker::before{content:"";width:.55em;height:.55em;border-radius:50%;background:var(--acc);flex:none}
.mute{color:var(--mute)}
.label{margin-bottom:.9rem!important;font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mute)}
mark{position:relative;z-index:-1;padding:0 .08em;background:linear-gradient(transparent 16%,var(--acc) 16%,var(--acc) 96%,transparent 96%)!important;color:var(--black)!important;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* ---------- Layout helpers ---------- */
.wrap{max-width:1440px;margin-inline:auto!important;padding-inline:var(--g)}
.sec{padding-block:var(--sec)}
.flush-top{padding-top:0!important}
.flush-bottom{padding-bottom:0!important}
.mt{margin-top:clamp(40px,5vw,72px)!important}.mt-s{margin-top:1.4rem!important}
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:1.5rem var(--g);margin-bottom:clamp(40px,5vw,80px)}
.head>p{max-width:34ch}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,88px);align-items:center}
.split.start{align-items:start}
.featured .split:not(:has(figure)){grid-template-columns:minmax(0,1fr)}
.phero{padding-block:clamp(112px,13vw,164px) clamp(40px,6vw,88px)}
.phero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--g);align-items:start;margin-top:clamp(1.6rem,3vw,2.8rem)}

/* ---------- Buttons (default = outline pill; styles: Fill, Accent; add class "lg" for large, "no-arrow") ---------- */
.wp-block-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem}
.wp-block-buttons.actions{margin-top:2.2rem}
.wp-block-button .wp-block-button__link,.pill,.wp-block-read-more,.post-nav a{display:inline-flex;align-items:center;gap:.55em;min-height:2.7rem;padding:.6rem 1.25rem;border:1px solid var(--ink);border-radius:99px;background:none;color:var(--ink);font:500 .84rem/1.2 var(--f);white-space:nowrap;text-decoration:none;transition:background .3s,color .3s,border-color .3s}
.wp-block-button .wp-block-button__link:hover,.pill:hover,.wp-block-read-more:hover,.post-nav a:hover{background:var(--ink);color:var(--bg)}
.wp-block-button.is-style-fill .wp-block-button__link{background:var(--ink);color:var(--bg)}
.wp-block-button.is-style-fill .wp-block-button__link:hover{background:var(--acc);border-color:var(--acc);color:var(--black)}
.wp-block-button.is-style-accent .wp-block-button__link{background:var(--acc);border-color:var(--acc);color:var(--black)}
.wp-block-button.is-style-accent .wp-block-button__link:hover{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.wp-block-button.lg .wp-block-button__link{min-height:3.5rem;padding-inline:1.9rem;font-size:.95rem}
.wp-block-button .wp-block-button__link::after,.wp-block-read-more::after{content:"↗";transition:transform .3s var(--ease)}
.wp-block-button .wp-block-button__link:hover::after,.wp-block-read-more:hover::after{transform:translate(2px,-2px)}
.wp-block-button.no-arrow .wp-block-button__link::after{content:none}
.wp-block-button.off .wp-block-button__link{opacity:.45;pointer-events:none}
.wp-block-button.dot .wp-block-button__link::before{content:"";width:.55em;height:.55em;border-radius:50%;background:var(--acc)}
.wp-block-button.orb .wp-block-button__link{justify-content:center;width:3.3rem;height:3.3rem;min-height:0;padding:0;border:0;border-radius:50%;background:var(--black);color:var(--ivory);font-size:1.2rem;transition:transform .4s var(--ease),background .3s,color .3s}
.wp-block-button.orb .wp-block-button__link::after{content:none}
.wp-block-button.orb .wp-block-button__link:hover{transform:rotate(45deg);background:var(--acc);color:var(--black)}
.soc{gap:0!important}
.soc .wp-block-button__link{justify-content:center;width:2.4rem;height:2.4rem;min-height:0;margin-right:-.35rem;padding:0!important;background:var(--bg)!important;color:var(--ink)!important;font-size:.7rem;font-weight:600}
.soc .wp-block-button__link::after{content:none}
.soc .wp-block-button__link:hover{position:relative;background:var(--ink)!important;color:var(--bg)!important}

/* ---------- Photography: rounded frames, one monochrome grade; yellow carries the colour ---------- */
figure.frame{position:relative;margin:0;overflow:hidden;border-radius:var(--r);background:#d9d6ce}
figure.frame img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.06);transition:transform 1.4s var(--ease)}
figure.frame:hover img{transform:scale(1.04)}
figure.frame.color img{filter:none}
figure.frame.acc{background:var(--acc)}
figure.frame a{display:block;height:100%}
figure.frame figcaption{position:absolute;inset:auto 0 0;margin:0;padding:clamp(1rem,2vw,1.6rem);background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff;font-size:1rem;font-weight:700;line-height:1.2;letter-spacing:-.02em;text-align:left;pointer-events:none}

/* Portrait: a cut-out silhouette on yellow until you add an Image block inside */
.portrait{position:relative;overflow:hidden;min-height:12rem;border-radius:var(--r);background:var(--acc)}
.portrait::before{content:"";position:absolute;inset:auto 6% 0;height:80%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 220'%3E%3Cg fill='%230B0B0A'%3E%3Cellipse cx='100' cy='70' rx='38' ry='44'/%3E%3Cpath d='M84 106h32v26H84z'/%3E%3Cpath d='M6 220c4-60 38-94 94-94s90 34 94 94z'/%3E%3C/g%3E%3C/svg%3E") center bottom/contain no-repeat;opacity:.9}
.portrait .ph-label{position:absolute;left:1.2rem;bottom:1.2rem;z-index:1;margin:0;padding:.45em .9em;border-radius:99px;background:rgba(252,251,248,.85);color:var(--black);font-size:.7rem;font-weight:600}
.portrait:has(img)::before,.portrait:has(img) .ph-label{display:none}
.portrait .wp-block-image{position:absolute;inset:0;margin:0}
.portrait .wp-block-image img{width:100%;height:100%;object-fit:cover}

/* ---------- Header / navigation ---------- */
.nav{position:fixed;inset:var(--wp-admin--admin-bar--height,0px) 0 auto;z-index:50;transition:background .4s,box-shadow .4s}
.nav.solid{background:var(--ivory);box-shadow:0 1px 0 rgba(11,11,10,.08)}
.nav-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:76px}
.nav-in>.logo{justify-self:start}
.nav-in>.nav-cta{justify-self:end}
.logo a,.foot .logo a{display:inline-flex;align-items:center;gap:.55rem;font-size:1.25rem;font-weight:800;letter-spacing:-.06em;text-transform:lowercase}
.logo a::before{content:"";width:2rem;height:1.1rem;flex:none;background:radial-gradient(circle at 27% 50%,var(--black) .5rem,transparent .53rem),radial-gradient(circle at 73% 50%,var(--acc) .5rem,transparent .53rem)}
.nav .wp-block-navigation{justify-content:center;font-size:.86rem;font-weight:500}
.nav .wp-block-navigation__container{gap:clamp(1rem,2.4vw,2.4rem)}
.wp-block-navigation .wp-block-navigation-item__content{position:relative}
.nav .wp-block-navigation-item__content:is([aria-current],:hover)::after,.nav .current-menu-item>.wp-block-navigation-item__content::after{content:"";position:absolute;left:50%;bottom:-9px;width:5px;height:5px;border-radius:50%;background:var(--acc);transform:translateX(-50%)}
.nav .wp-block-navigation__responsive-container-open,.nav .wp-block-navigation__responsive-container-close{color:var(--ink)}
.nav .wp-block-navigation__responsive-container.is-menu-open{padding:var(--g);background:var(--ivory)!important;color:var(--black)!important}
.nav .wp-block-navigation__responsive-container.is-menu-open{padding:0!important}
.nav .is-menu-open :is(.wp-block-navigation__responsive-close,.wp-block-navigation__responsive-dialog){height:100%;max-width:none}
.nav .is-menu-open .wp-block-navigation__responsive-dialog{margin:0!important;padding:0 var(--g)!important}
.nav .is-menu-open .wp-block-navigation__responsive-container-close{top:26px;right:var(--g)}
.nav .is-menu-open .wp-block-navigation__responsive-container-content{display:flex;flex-direction:column;align-items:flex-start!important;justify-content:center;height:100%;padding:0!important}
.nav .is-menu-open .wp-block-navigation__container{align-items:flex-start!important;gap:.6rem!important;flex:none!important;height:auto!important}
.nav .is-menu-open .wp-block-navigation-item__content{font-size:3rem;font-weight:800;letter-spacing:-.06em;line-height:1.05}
.nav .is-menu-open .wp-block-navigation-item__content::after{display:none}
.nav-book{display:none!important}
.nav .is-menu-open .nav-book{display:flex!important;margin-top:1.4rem}
.nav .is-menu-open .nav-book .wp-block-navigation-item__content{display:inline-flex;align-items:center;gap:.55em;height:2.7rem;padding:0 1.25rem;border-radius:99px;background:var(--acc);color:var(--black);font-size:.84rem;font-weight:500;letter-spacing:0;line-height:1}
.nav .is-menu-open .nav-book .wp-block-navigation-item__content::after{content:"↗";display:inline!important;position:static;width:auto;height:auto;background:none;transform:none}

/* ---------- Marquee headings ---------- */
.marquee{overflow-x:clip;overflow-y:visible;padding-bottom:.14em;white-space:nowrap;font-size:clamp(3.6rem,10vw,9.5rem);font-weight:800;line-height:.86;letter-spacing:-.065em}
.marquee>p{display:inline-block;white-space:nowrap;text-wrap:nowrap;animation:mq 45s linear infinite}
.marquee em{font-style:normal;color:var(--acc)}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- Home: hero ---------- */
.hero{padding-block:clamp(104px,10vw,132px) clamp(48px,6vw,88px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:var(--g) clamp(24px,4vw,64px)}
.hero-grid>:first-child{container-type:inline-size}
.hero .is-style-mega{font-size:clamp(4rem,31cqi,15.5rem);text-indent:.95em}
.hero-copy{display:flex;justify-content:flex-end;margin-top:clamp(1.4rem,2.6vw,2.4rem);text-align:right}
.hero-copy p{max-width:31ch}
.hero-row{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;margin-block:clamp(1.6rem,3vw,2.8rem)}
.hero-row .wp-block-separator{flex:1;min-width:2rem;margin:0;border:0;border-top:1px solid var(--line);opacity:1}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--g)}
.stat-b{font-size:clamp(2.4rem,4.4vw,4.4rem)!important;font-weight:800;line-height:1;letter-spacing:-.06em}
.stat .small{margin-top:.6rem!important}
.stats .small{max-width:24ch}
.mosaic.set .type .is-style-kicker{width:auto}
.wp-block-button.orb .wp-block-button__link{font-weight:400}
.hero-media{position:relative;min-height:clamp(440px,48vw,700px);padding-left:clamp(58px,6vw,86px)}
.hero-media>.portrait{height:100%}
.sig{position:absolute;top:1.2rem;left:calc(clamp(58px,6vw,86px) + 1.6rem);z-index:2;margin:0;color:#fff;font:400 clamp(3.4rem,5.6vw,5.2rem)/1 var(--sig);transform:rotate(-8deg);pointer-events:none}
.corner{position:absolute;top:-6px;right:-6px;z-index:2}
.corner .wp-block-button__link,.side .wp-block-button__link{box-shadow:0 0 0 10px var(--bg)}
.orb.globe .wp-block-button__link{font-size:0}
.orb.globe .wp-block-button__link::before{content:"";width:22px;height:22px;background:currentColor;-webkit-mask:var(--globe) center/contain no-repeat;mask:var(--globe) center/contain no-repeat;--globe:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c3.2 3.6 3.2 14.4 0 18M12 3c-3.2 3.6-3.2 14.4 0 18'/%3E%3C/svg%3E")}
.side{position:absolute;left:0;bottom:clamp(20px,3vw,44px);z-index:2;display:grid;gap:.7rem}
.side figure.frame{width:clamp(46px,4.8vw,66px);aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 5px var(--bg)}
.side .wp-block-button__link{box-shadow:0 0 0 5px var(--bg)}

/* ---------- Home: about stage (burst + crosshairs are decoration in CSS, so editing can't break them) ---------- */
.about{overflow:hidden;padding-bottom:var(--sec)}
.about>.marquee{margin-top:-.13em}
.stage{position:relative;display:grid;place-items:center;height:clamp(420px,56vw,740px);isolation:isolate}
.stage::before{content:"";position:absolute;top:0;bottom:0;left:50%;z-index:-1;aspect-ratio:1;translate:-50% 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-100 -100 200 200'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23F4F2EC'/%3E%3Cstop offset='1' stop-color='%239E998F'/%3E%3C/linearGradient%3E%3Crect id='p' x='-10' y='-99' width='20' height='52' rx='10' fill='url(%23g)'/%3E%3C/defs%3E%3Cuse href='%23p'/%3E%3Cuse href='%23p' transform='rotate(30)'/%3E%3Cuse href='%23p' transform='rotate(60)'/%3E%3Cuse href='%23p' transform='rotate(90)'/%3E%3Cuse href='%23p' transform='rotate(120)'/%3E%3Cuse href='%23p' transform='rotate(150)'/%3E%3Cuse href='%23p' transform='rotate(180)'/%3E%3Cuse href='%23p' transform='rotate(210)'/%3E%3Cuse href='%23p' transform='rotate(240)'/%3E%3Cuse href='%23p' transform='rotate(270)'/%3E%3Cuse href='%23p' transform='rotate(300)'/%3E%3Cuse href='%23p' transform='rotate(330)'/%3E%3C/svg%3E") center/contain no-repeat;animation:spin 90s linear infinite}
.stage::after{content:"";position:absolute;inset:4% 0;z-index:-1;pointer-events:none;--x:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23F4F2EC'%3E%3Cpath d='M20 0v40M0 20h40'/%3E%3Ccircle cx='20' cy='20' r='8' fill='%230B0B0A'/%3E%3Ccircle cx='20' cy='20' r='2' fill='%23F4F2EC'/%3E%3C/svg%3E");--p:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 120' stroke='%23F4F2EC'%3E%3Cpath d='M13 0v120M0 48h26'/%3E%3C/svg%3E");background:var(--x) left top/40px no-repeat,var(--x) right top/40px no-repeat,var(--x) left bottom/40px no-repeat,var(--x) right bottom/40px no-repeat,var(--p) left 7px center/26px clamp(70px,9vw,120px) no-repeat,var(--p) right 7px center/26px clamp(70px,9vw,120px) no-repeat}
@keyframes spin{to{rotate:360deg}}
.stage>.portrait{align-self:end;width:clamp(230px,30vw,430px);height:92%;min-height:0;border-radius:0;background:none}
.stage>.portrait::before{inset:auto 0 0;height:100%;opacity:1;filter:invert(.62)}
.about-copy{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--g);align-items:start;padding-top:clamp(32px,4vw,56px);border-top:1px solid var(--line)}
.about-copy .is-style-big{font-size:clamp(2.5rem,5vw,5.4rem)}
.about-copy .is-style-lead{max-width:36ch;padding-top:.3em}

/* ---------- Mosaics ---------- */
.mosaic{position:relative;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,clamp(180px,22vw,340px));gap:clamp(8px,1vw,14px)}
.mosaic>figure.frame{height:100%}
.mosaic .tall{grid-row:span 2}
.mosaic .word{position:absolute;inset:0;z-index:2;display:grid;place-items:center;margin:0;font-size:clamp(4rem,17.5vw,17rem);font-weight:800;line-height:.8;letter-spacing:-.075em;pointer-events:none}
.mosaic.set{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,clamp(210px,21vw,330px))}
.mosaic.set .type{grid-column:1/span 2;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;container-type:inline-size}
.mosaic.set .word{position:static;display:block;margin:0 0 0 -.04em;padding-bottom:.1em;font-size:27cqi;line-height:.98}
.mosaic.set .tall{grid-column:4;grid-row:1/span 2}

/* ---------- Editorial list rows ---------- */
.rows{border-top:1px solid var(--line)}
.row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:.9rem var(--g);align-items:center;padding-block:clamp(1.4rem,2.6vw,2.3rem);border-bottom:1px solid var(--line)}
.row .is-style-title{transition:transform .5s var(--ease)}
.row:hover .is-style-title{transform:translateX(.6rem)}
.row .small strong,.row .cat{display:block;color:var(--ink);font-weight:600}
.row .wp-block-post-excerpt__excerpt{margin:0}
.rows .wp-block-post-template{margin:0;padding:0;list-style:none}

/* ---------- Proof panel (yellow) ---------- */
.proof{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--g);padding:clamp(28px,5vw,76px);border-radius:var(--r);background:var(--acc);color:var(--black);--ink:var(--black);--bg:var(--acc);--mute:rgba(11,11,10,.62);--line:rgba(11,11,10,.2)}
.proof .stat{padding-top:1rem;border-top:1px solid var(--line)}
.proof .stat+.stat{margin-top:1.6rem}
.proof .is-style-kicker::before{background:var(--black)}

/* ---------- Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(16px,2vw,32px)}
.steps.three{grid-template-columns:repeat(3,1fr)}
.steps.four{grid-template-columns:repeat(4,1fr)}
.steps>*{padding-top:1.2rem;border-top:2px solid var(--ink)}
.steps>:first-child{border-color:var(--acc)}
.steps h3{margin-bottom:.6rem!important;font-size:clamp(1.3rem,2vw,1.8rem);font-weight:800;letter-spacing:-.04em}
.steps.three h3{font-size:clamp(1.8rem,3.4vw,3.2rem);font-style:italic}
.ticks li{padding:.95rem 0 .95rem 1.4rem;border-top:1px solid var(--line);font-weight:600;text-indent:-1.4rem}
.ticks li::before{content:"";display:inline-block;width:.55em;height:.55em;margin-right:calc(1.4rem - .55em);border-radius:50%;background:var(--acc);vertical-align:.08em}

/* ---------- Layered image stack ---------- */
.stack{position:relative;margin:0 0 8% 12%}
.stack>:first-child{aspect-ratio:4/5}
.stack .ph-label{left:auto;right:1.2rem}
.stack>:nth-child(2){position:absolute;left:-16%;bottom:-8%;width:46%;aspect-ratio:1;box-shadow:0 0 0 8px var(--bg)}

/* ---------- Commitments / testimonials slider ----------
   Every card can become active: the card snapped into view (or hovered) turns yellow — nothing is hardcoded. */
.track{display:grid;grid-auto-flow:column;grid-auto-columns:min(86%,clamp(300px,38vw,520px));gap:clamp(12px,1.6vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.track::-webkit-scrollbar{display:none}
.tcard{display:flex;flex-direction:column;justify-content:space-between;gap:2rem;min-height:clamp(300px,28vw,400px);padding:clamp(24px,3vw,40px);border:1px solid rgba(11,11,10,.08);border-radius:var(--r);background:var(--paper);color:var(--black);scroll-snap-align:start;transition:background .45s var(--ease)}
.tcard.is-active{background:var(--acc)}
@media (hover:hover){
  .tcard:hover{background:var(--acc)}
  .track:hover .tcard.is-active:not(:hover){background:var(--paper)}
  .track:hover .tcard.is-active:not(:hover) .quote-text::before{color:var(--acc)}
}
.tcard .quote-text{font-size:clamp(1.1rem,1.5vw,1.38rem);font-weight:700;line-height:1.32;letter-spacing:-.025em}
.tcard .quote-text::before{content:"“";display:block;height:.42em;margin-bottom:.6rem;color:var(--acc);font-size:4.4em;line-height:.9;transition:color .45s}
.tcard.is-active .quote-text::before{color:var(--black)}
@media (hover:hover){.tcard:hover .quote-text::before{color:var(--black)}}
.who{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;font-size:.85rem;line-height:1.3}
.who p{margin:0!important}
.who .avatar{display:grid;place-items:center;flex:none;width:2.8rem;height:2.8rem;border-radius:50%;background:var(--black);color:var(--acc);font-size:.78rem;font-weight:800}
.who .person p+p{margin:0!important;color:inherit;font-size:smaller;opacity:.6}
.who .tag{margin-left:auto;padding:.35em .8em;border:1px solid rgba(11,11,10,.25);border-radius:99px;font-size:.7rem;font-weight:600;white-space:nowrap}
.slider-ui{display:flex;align-items:center;gap:.7rem;margin-top:1.6rem}
.slider-ui button{display:grid;place-items:center;flex:none;width:3.3rem;height:3.3rem;border:1px solid var(--ink);border-radius:50%;background:none;color:var(--ink);font:inherit;font-size:1.2rem;cursor:pointer;transition:background .3s,color .3s,border-color .3s,opacity .3s}
.slider-ui button:hover:not(:disabled){background:var(--acc);border-color:var(--acc);color:var(--black)}
.slider-ui button:disabled{opacity:.3;cursor:default}
.slider-ui .bar{flex:1;height:2px;margin-left:.8rem;background:var(--line)}
.slider-ui .bar i{display:block;width:0;height:100%;background:var(--acc);transition:width .3s}

/* ---------- The System: stage blocks ---------- */
.jump{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2rem}
.svc{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,88px);padding-block:clamp(56px,7vw,104px);border-top:1px solid var(--line);scroll-margin-top:70px}
.svc-head{position:sticky;top:100px;align-self:start}
.svc-head .is-style-lead{margin-block:1.2rem 1.6rem}
.svc-head>.wp-block-buttons{display:block}
.svc-head figure.frame{aspect-ratio:16/10;margin-top:2rem}
.svc-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,3vw,44px) clamp(20px,3vw,40px);align-content:start}
.svc-body>*{padding-top:1rem;border-top:2px solid var(--ink)}
.svc-body>:first-child{border-color:var(--acc)}
.svc-body h3{margin-bottom:.7rem!important;font-size:.76rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.svc-body p{font-size:.95rem;color:var(--mute)}
.svc-body .ticks li{padding-block:.5rem;font-size:.92rem;font-weight:500}
.svc-body .full{grid-column:1/-1}

/* ---------- Results: case stories ---------- */
.case{padding-block:var(--sec);scroll-margin-top:60px}
.case-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,5vw,88px);align-items:end}
.case-head>figure.frame{aspect-ratio:4/5}
.case-head .is-style-lead{margin-top:1.4rem}
.meta{margin-top:2.2rem;border-top:1px solid var(--line)}
.meta>*{display:grid;grid-template-columns:minmax(7rem,.4fr) 1fr;gap:1rem;padding-block:.85rem;border-bottom:1px solid var(--line);font-size:.92rem}
.meta p{margin:0!important}
.meta .dt{font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mute)}
.case-block{margin-top:clamp(64px,8vw,120px)!important}
.beats{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,24px)}
.beats>*{padding:clamp(24px,3vw,44px);border:1px solid var(--line);border-radius:var(--r)}
.beats>.hl{border-color:var(--acc);background:var(--acc);color:var(--black);--mute:rgba(11,11,10,.6)}
.beats p:not(.label){font-size:clamp(1.12rem,1.6vw,1.45rem);font-weight:600;line-height:1.35;letter-spacing:-.02em}
.shift li{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:var(--g);align-items:center;padding-block:1.15rem;border-top:1px solid var(--line)}
.shift li:last-child{border-bottom:1px solid var(--line)}
.shift s{color:var(--mute);text-decoration-thickness:1px}
.shift em{font-style:normal;font-weight:700;color:var(--acc)}
.case .proof .is-style-big{font-size:clamp(2rem,4vw,3.6rem)}

/* ---------- Tiles strip ---------- */
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(8px,1vw,14px)}
.strip figure.frame{aspect-ratio:4/5}

/* ---------- Closing call to action ---------- */
.cta{overflow:hidden;text-align:center}
.cta .is-style-mega{font-size:clamp(4.4rem,19vw,19rem)}
.cta .is-style-kicker{margin-inline:auto!important}
.cta .is-style-lead{margin:1.8rem auto 0}
.cta .wp-block-buttons{justify-content:center}

/* ---------- Booking form ---------- */
.card{padding:clamp(24px,3.4vw,52px);border-radius:var(--r);background:var(--paper);color:var(--black)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem 1.1rem}
.form .full{grid-column:1/-1}
.form label{display:grid;gap:.45rem;font-size:.78rem;font-weight:600}
.form :is(input,select,textarea){width:100%;padding:.85rem 1rem;border:1px solid transparent;border-radius:14px;background:#F1EEE6;color:var(--black);font:inherit;font-size:.95rem;appearance:none;transition:border-color .2s}
.form select{background:#F1EEE6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%230B0B0A' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 1rem center}
.form :focus{outline:0;border-color:var(--black)}
.form textarea{min-height:8rem;resize:vertical}
.form button{width:100%;justify-content:center;min-height:3.5rem;background:var(--black);color:var(--ivory);font-size:.95rem;cursor:pointer}
.form button::after{content:"↗";transition:transform .3s var(--ease)}
.form button:hover::after{transform:translate(2px,-2px)}
.form-note{margin-top:.9rem!important}
.form button:hover{background:var(--acc);border-color:var(--acc);color:var(--black)}
.form-msg{padding:1rem 1.2rem;border:1px solid var(--acc);border-radius:14px;font-size:.95rem}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- FAQ ---------- */
.wp-block-details{border-bottom:1px solid var(--line)}
.wp-block-details:first-of-type{border-top:1px solid var(--line)}
.wp-block-details summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-block:1.4rem;list-style:none;cursor:pointer;font-size:clamp(1.08rem,1.6vw,1.35rem);font-weight:700;letter-spacing:-.025em}
.wp-block-details summary::-webkit-details-marker{display:none}
.wp-block-details summary::after{content:"+";display:grid;place-items:center;flex:none;width:2rem;height:2rem;border:1px solid;border-radius:50%;font-weight:400;transition:transform .3s}
.wp-block-details[open] summary::after{transform:rotate(45deg)}
.wp-block-details p{max-width:62ch;padding-bottom:1.4rem;color:var(--mute)}

/* ---------- Filters (built by main.js from each item's category) ---------- */
.filters{display:flex;flex-wrap:wrap;gap:.5rem}
.filters button{height:2.4rem;padding:0 1.1rem;border:1px solid var(--line);border-radius:99px;background:none;color:var(--ink);font:500 .8rem var(--f);cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.filters button:hover{border-color:var(--ink)}
.filters [aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:var(--bg)}

/* ---------- Articles (single post) ---------- */
.post-meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.4rem;font-size:.9rem;color:var(--mute)}
.post-meta>*{margin:0!important}
.post-meta>*+*::before{content:"·";margin-right:.4rem}
.post-hero figure.frame{aspect-ratio:21/9;margin-top:clamp(32px,5vw,64px)}
.post-hero .is-style-big{max-width:16ch}
.post-hero .is-style-kicker .wp-block-post-terms__separator{color:inherit}
.post-body+.post-nav{margin-top:clamp(48px,6vw,80px)}
.prose{max-width:42rem;margin-inline:auto!important;padding-inline:var(--g);font-size:1.15rem;line-height:1.75}
.prose>*+*{margin-top:1em}
.prose>p:first-child{font-size:1.4rem;font-weight:500;line-height:1.5;letter-spacing:-.01em}
.prose :is(h2,h3){margin:2em 0 .6em!important;font-weight:800;line-height:1.1;letter-spacing:-.04em}
.prose h2{font-size:clamp(1.6rem,2.4vw,2rem)}
.prose h3{font-size:1.35rem}
.prose :is(ul,ol){padding-left:1.2em}
.prose ul{list-style:disc}.prose ol{list-style:decimal}
.prose a{border-bottom:1px solid var(--acc)}
.prose .wp-block-quote,.prose blockquote{margin-block:1.8em!important;padding:1.4em 1.6em;border:0;border-radius:22px;background:var(--acc);color:var(--black);font-size:1.35em;font-weight:700;line-height:1.25;letter-spacing:-.03em}
.prose .wp-block-image img{border-radius:22px}
.prose figcaption{margin-top:.6rem;font-size:.85rem;color:var(--mute)}
.post-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;padding-block:2rem;border-top:1px solid var(--line)}
.post-nav a{white-space:normal}

/* ---------- Footer ---------- */
.foot{padding-top:clamp(64px,8vw,112px);overflow:hidden;border-top:1px solid var(--line)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.7fr) repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px)}
.foot-brand .small{max-width:32ch;margin-block:1rem 1.6rem}
.foot-h{margin-bottom:1rem!important;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.foot-links,.foot .wp-block-navigation__container{display:grid!important;gap:.6rem!important;font-size:.95rem;font-weight:500}
.foot-links a,.foot .wp-block-navigation-item__content{display:block;width:fit-content;background:linear-gradient(var(--acc),var(--acc)) 0 100%/0 2px no-repeat;transition:background-size .3s var(--ease)}
.foot-links a:hover,.foot .wp-block-navigation-item__content:is(:hover,[aria-current]){background-size:100% 2px}
.foot-note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.5rem;margin-top:clamp(48px,6vw,80px);padding-block:1.4rem;border-top:1px solid var(--line);font-size:.78rem;color:var(--mute)}
.foot-note p{margin:0!important}
.wordmark{padding-bottom:.22em;text-wrap:nowrap;text-align:center;font-size:19.4vw!important;font-weight:800;line-height:.8;letter-spacing:-.075em;white-space:nowrap}

/* ---------- Motion ---------- */
@media (scripting:enabled) and (prefers-reduced-motion:no-preference){
  .r{opacity:0;transform:translateY(40px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
  .r.in{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){.marquee>p,.stage::before{animation:none}.tcard,.frame img{transition:none}}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .hero-grid,.split,.proof,.about-copy,.phero-grid,.svc,.case-head{grid-template-columns:1fr}
  .case-head>figure.frame{aspect-ratio:16/11}
  .steps,.steps.four{grid-template-columns:1fr 1fr}
  .steps.three{grid-template-columns:1fr}
  .svc-head{position:static}
  .row{grid-template-columns:minmax(0,1fr) auto}
  .row>:nth-child(2){grid-row:2;grid-column:1/-1}
  .strip{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
}
@media (max-width:860px){
  .nav .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex}
  .nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none}
  .nav-in{grid-template-columns:1fr auto}
  .nav .wp-block-navigation{justify-self:end}
  .nav-cta{display:none!important}
  .hero .is-style-mega{text-indent:.5em}
  .hero-copy{justify-content:flex-start;text-align:left}
  .hero-media{min-height:125vw}
  .mosaic{grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,42vw);grid-auto-flow:dense}
  .mosaic .tall{grid-row:span 1;grid-column:span 2}
  .mosaic.set{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:auto}
  .mosaic.set .type{grid-column:1/-1;height:auto}
  .mosaic.set>figure.frame{aspect-ratio:1}
  .mosaic.set>figure.tall{grid-column:1/-1;grid-row:auto;aspect-ratio:16/10}
  .beats{grid-template-columns:1fr}
  .shift li{grid-template-columns:1fr;gap:.35rem}
  .shift em{width:fit-content;transform:rotate(90deg)}
}
@media (max-width:560px){
  .form,.svc-body{grid-template-columns:1fr}
  .steps,.steps.four{grid-template-columns:1fr}
  .who .tag{margin-left:0}
  .stats{gap:1.2rem}
}

/* ---------- Results: every case study in full, alternating dark / light ---------- */
.case-stories .wp-block-post-template{margin:0;padding:0;list-style:none}
.case-stories .wp-block-post-template>li{scroll-margin-top:60px}
.case-stories .wp-block-post-template>li:nth-child(odd) .case{--ink:var(--ivory);--bg:var(--black);--mute:rgba(244,242,236,.6);--line:rgba(244,242,236,.15);background:var(--bg);color:var(--ink)}
.case-stories .case .proof{--ink:var(--black);--bg:var(--acc);--mute:rgba(11,11,10,.62);--line:rgba(11,11,10,.2);color:var(--black)}

/* ---------- Small details from the design ---------- */
.gap-2{margin-top:2rem!important}
.wp-block-read-more.fill{background:var(--ink);color:var(--bg)}
.wp-block-read-more.fill:hover{border-color:var(--acc);background:var(--acc);color:var(--black)}
.wp-block-read-more.actions{margin-top:2.2rem}
figure.frame figcaption small{display:block;margin-bottom:.4rem;font-size:.72rem;font-weight:500;opacity:.8}
.foot .nav-book{display:none!important}