/* ============================================================
   BE THE CHANGE FITNESS — Website v2 · Brand System v5.0
   Home kit · Atmosphere stack · One light (22% 0%) · 8pt grid
   ============================================================ */
:root{
  --charcoal:#141414; --raised:#1E1E1E; --hairline:#2A2A2A; --hover:#242424; --deep:#0F0F0F;
  --bone:#F2EEE3; --bone-60:rgba(242,238,227,.6); --bone-38:rgba(242,238,227,.38);
  --gold:#C9A84C; --gold-bright:#EFD489; --gold-deep:#8A6F2C;
  --signal:#FF4B1F;
  --ease:cubic-bezier(.22,1,.36,1);
  --kit:linear-gradient(168deg,#181818,#141414 45%,#0F0F0F);
  --metal:linear-gradient(135deg,#73591A 0%,#E5C158 42%,#FFF6D1 50%,#E5C158 58%,#73591A 100%);
  --cta:linear-gradient(180deg,#EFD489,#C9A84C);
  --gold-rule:linear-gradient(90deg,#8A6F2C,#C9A84C 40%,#FFF6D1 52%,#C9A84C 64%,#8A6F2C);
  --one-light:radial-gradient(ellipse 60% 55% at 22% 0%, rgba(201,168,76,.16), transparent 66%);
  --wash:linear-gradient(90deg,rgba(201,168,76,.06),transparent 70%);
  --scrim:linear-gradient(100deg,#0F0F0F 26%,rgba(15,15,15,.85) 48%,rgba(15,15,15,.35) 74%,rgba(15,15,15,.12) 100%);
  --grade:saturate(.72) contrast(1.15) brightness(.95) sepia(.07);
}
*{margin:0;padding:0;box-sizing:border-box}
html{background:#141414;color-scheme:dark;scroll-behavior:smooth}
body{background:#141414 !important;color:var(--bone);font-family:'Sora',sans-serif;font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::after{content:'';position:fixed;inset:0;z-index:-4;background:#141414}

/* ---- Atmosphere (Home A "wall"): kit gradient + one light/vignette + plaster + grain ---- */
.atmo{position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 55% at 22% 0%, rgba(201,168,76,.2), transparent 66%),
    radial-gradient(ellipse 110% 90% at 50% 45%, transparent 40%, rgba(10,9,8,.78) 100%),
    linear-gradient(168deg,#1C1A17,#141414 45%,#0E0D0C)}
.vignette{position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.55;mix-blend-mode:overlay;
  box-shadow:inset 0 -120px 140px -80px rgba(0,0,0,.9);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.014' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E")}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='1' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---- Type ---- */
.display{font-family:'Archivo',sans-serif;font-weight:900;font-variation-settings:'wdth' 125;text-transform:uppercase;line-height:.9;letter-spacing:.01em}
.hero-lockup{font-size:clamp(48px,8vw,128px);line-height:.84}
.sec-head{font-size:clamp(32px,5.4vw,60px)}
.metal-text{background:var(--metal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.kicker{font-family:'Sora';font-weight:600;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.micro{font-family:'Sora';font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-38)}
.lead{font-size:clamp(17px,2vw,22px);line-height:1.55;max-width:58ch;color:var(--bone)}
.body-dim{color:var(--bone-60);font-size:16px;line-height:1.6;max-width:64ch}
.fraunces{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:400;line-height:1.4}

/* ---- Layout / 8pt ---- */
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
section{padding:96px 0;position:relative}
section.major{padding:128px 0}
.hr{border:0;border-top:1px solid var(--hairline)}
.gold-rule{height:3px;border:0;background:var(--gold-rule);width:96px;margin:24px 0 0}

/* ---- Header ---- */
header{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:16px 32px;background:rgba(20,20,20,.55);backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%);border-bottom:1px solid rgba(42,42,42,.7)}
.lockup{display:flex;align-items:center;gap:16px;text-decoration:none;color:var(--bone)}
.lockup img{height:26px;width:auto;display:block}
.lockup .lk{font-family:'Archivo';font-weight:900;font-variation-settings:'wdth' 125;text-transform:uppercase;font-size:13px;letter-spacing:.06em;line-height:1}
.lockup .lk span{display:block;font-size:8px;letter-spacing:.52em;color:var(--gold);margin-top:3px}
nav.main{display:flex;align-items:center;gap:32px}
.navlinks{display:flex;gap:24px}
.navlinks a{font-family:'Sora';font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--bone-60);text-decoration:none;transition:color .3s var(--ease);padding:8px 0}
.navlinks a:hover{color:var(--gold-bright)}
.navlinks a.active{color:var(--gold)}
.menu-btn{display:none;background:none;border:1px solid var(--hairline);color:var(--bone);font-size:18px;padding:8px 16px;border-radius:4px;cursor:pointer}
@media(max-width:1020px){
  .navlinks{display:none;position:fixed;top:64px;left:0;right:0;flex-direction:column;gap:0;background:rgba(15,15,15,.97);border-bottom:1px solid var(--hairline);padding:16px 32px}
  .navlinks.open{display:flex}
  .navlinks a{padding:16px 0;border-bottom:1px solid var(--hairline)}
  .menu-btn{display:block}
  header .btn{display:none}
}

/* ---- Buttons (V5) ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:'Sora';font-weight:700;font-size:13px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;padding:16px 32px;border-radius:4px;transition:transform .12s var(--ease),box-shadow .4s var(--ease),background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease);min-height:44px;white-space:nowrap}
.btn:active{transform:translateY(2px)}
.btn-primary{background:var(--cta);color:#141414;box-shadow:0 16px 40px -12px rgba(201,168,76,.55)}
.btn-primary:hover{box-shadow:0 24px 56px -12px rgba(201,168,76,.7)}
.btn-ghost{background:transparent;color:var(--gold);border:1px solid var(--gold);font-weight:600}
.btn-ghost:hover{color:var(--gold-bright);border-color:var(--gold-bright);background:rgba(201,168,76,.08)}
.btn-sm{padding:12px 24px;font-size:11px}
.cta-row{display:flex;gap:16px;flex-wrap:wrap}
.textlink{color:var(--gold);text-decoration:none;font-weight:600;border-bottom:1px solid var(--gold);padding-bottom:2px;transition:color .3s,border-color .3s}
.textlink:hover{color:var(--gold-bright);border-color:var(--gold-bright)}

/* ---- Cards / surfaces ---- */
.card{background:var(--raised);border:1px solid var(--hairline);border-radius:8px;padding:32px;box-shadow:0 32px 48px -32px rgba(0,0,0,.6);transition:border-color .4s var(--ease),background .4s var(--ease),transform .4s var(--ease)}
.card:hover{border-color:rgba(201,168,76,.45);background:var(--hover);transform:translateY(-4px)}
.card h3{font-family:'Archivo';font-weight:900;font-variation-settings:'wdth' 100;text-transform:uppercase;font-size:17px;letter-spacing:.03em;margin-bottom:16px;line-height:1.1}
.card p{color:var(--bone-60);font-size:15px;line-height:1.6}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:1fr 1fr}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:960px){.g3,.g4{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}
a.card{display:block;text-decoration:none;color:var(--bone)}
.card .arw{color:var(--gold);font-size:20px;margin-top:24px;display:inline-block;transition:transform .3s var(--ease)}
a.card:hover .arw{transform:translateX(8px)}

/* ---- Imagery: grade + blend ---- */
img.graded, .graded img{filter:var(--grade);display:block;width:100%;height:100%;object-fit:cover}
.frame{border:1px solid var(--hairline);border-radius:8px;overflow:hidden;box-shadow:0 32px 56px -32px rgba(0,0,0,.7);position:relative}
.frame::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 80px rgba(0,0,0,.35);pointer-events:none;border-radius:8px}
.blend-r{-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%)}
.blend-l{-webkit-mask-image:linear-gradient(270deg,transparent 0%,#000 30%);mask-image:linear-gradient(270deg,transparent 0%,#000 30%)}
.blend-b{-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}

/* ---- Stat plate ---- */
.stats{display:flex;gap:48px;flex-wrap:wrap;padding-top:32px;border-top:1px solid var(--hairline)}
.stat .num{font-family:'Archivo';font-weight:900;font-variation-settings:'wdth' 125;font-size:clamp(32px,4vw,48px);line-height:1;color:var(--gold)}
.stat .lbl{margin-top:8px;font-family:'Sora';font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-38)}

/* ---- Quote block ---- */
.quote-block{border-left:3px solid var(--gold);background:var(--wash);padding:24px 32px;border-radius:0 8px 8px 0}
.quote-block .q{font-family:'Fraunces',serif;font-style:italic;font-size:clamp(19px,2.6vw,26px);line-height:1.4}
.quote-block .attr{margin-top:16px;font-family:'Sora';font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-38)}

/* ---- Chips ---- */
.chip{display:inline-flex;align-items:center;gap:8px;border-radius:100px;padding:8px 16px;font-family:'Sora';font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.chip-gold{border:1px solid var(--gold);color:var(--gold)}
.chip-signal{background:rgba(255,75,31,.12);border:1px solid var(--signal);color:var(--signal)}

/* ---- Pain grid (PT design profile): numbered hairline grid ---- */
.pain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1px;background:var(--hairline);border:1px solid var(--hairline);border-radius:8px;overflow:hidden}
.pgcell{background:var(--raised);padding:30px 26px;display:flex;gap:16px;align-items:flex-start;transition:background .2s ease}
.pgcell:hover{background:var(--hover)}
.pgcell .n{font-family:'Archivo';font-variation-settings:'wdth' 125;font-weight:900;font-size:13px;color:var(--gold);flex-shrink:0;margin-top:3px}
.pgcell .t{font-family:'Sora';font-weight:500;font-size:16px;line-height:1.5;color:rgba(242,238,227,.88)}
.pain-intro{font-family:'Sora';font-weight:700;font-style:italic;font-size:17px;line-height:1.6;color:var(--bone);max-width:52ch;margin:0 auto 64px;text-align:center}

/* ---- Performance kit band (petrol + volt, gold dropped) ---- */
.petrol{background:linear-gradient(168deg,#123F3D,#0E4D4A 55%,#0B3230);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.petrol .kicker{color:#CCFF00}
.petrol-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:rgba(242,238,227,.14)}
.petrol-cell{background:#0E4D4A;padding:32px}
.petrol-cell .n{font-family:'Archivo';font-variation-settings:'wdth' 125;font-weight:900;font-size:44px;line-height:1;color:#CCFF00;margin-bottom:18px}
.petrol-cell .t{font-family:'Archivo';font-variation-settings:'wdth' 125;font-weight:900;text-transform:uppercase;font-size:19px;color:var(--bone);margin-bottom:12px}
.petrol-cell .b{font-family:'Sora';font-weight:300;font-size:14px;line-height:1.6;color:rgba(242,238,227,.8)}
.petrol .close-line{font-family:'Sora';font-weight:600;font-size:16px;line-height:1.6;color:var(--bone);margin-top:44px;text-align:center}
.petrol .close-line span{color:#CCFF00}

/* ---- Story cards (PT design profile): photo | name+stars+pull | story+review ---- */
.story-card{border:1px solid var(--hairline);border-radius:8px;background:var(--raised);overflow:hidden}
.story-grid{display:grid;grid-template-columns:1fr 1fr 1.6fr}
.story-media{position:relative;min-height:320px;background:#0F0F0F}
/* before/after composites must NEVER be cropped — show the full photo, letterboxed on deep charcoal */
.story-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;filter:var(--grade)}
.story-mid{padding:36px;border-right:1px solid var(--hairline);display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:radial-gradient(ellipse 90% 60% at 50% 0%, rgba(201,168,76,.07), transparent 70%)}
.story-mid .nm{font-family:'Archivo';font-variation-settings:'wdth' 125;font-weight:900;text-transform:uppercase;font-size:clamp(24px,3vw,34px);line-height:.95;margin-bottom:12px}
.story-mid .strs{font-family:'Sora';font-weight:600;font-size:13px;letter-spacing:.2em;color:var(--gold)}
.story-mid .pull{font-family:'Fraunces',serif;font-style:italic;font-weight:400;font-size:clamp(17px,1.9vw,21px);line-height:1.35;color:var(--gold-bright);margin:0}
.story-body{padding:36px}
.story-body p{font-family:'Sora';font-weight:300;font-size:15px;line-height:1.65;color:rgba(242,238,227,.75);margin:0 0 12px;max-width:64ch}
.story-body p.strong{font-weight:500;color:var(--bone);margin-bottom:22px}
.tp-review{border-left:2px solid var(--gold);padding:4px 0 4px 18px;background:linear-gradient(90deg,rgba(201,168,76,.06),transparent 70%)}
.tp-review .lbl{font-family:'Sora';font-weight:600;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.tp-review .txt{font-family:'Sora';font-weight:500;font-size:14px;line-height:1.5;color:rgba(242,238,227,.86);margin-bottom:6px}
.tp-review .who{font-family:'Sora';font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,238,227,.5)}
@media(max-width:960px){.story-grid{grid-template-columns:1fr}.story-media{min-height:380px}.story-mid{border-right:0;border-bottom:1px solid var(--hairline)}}

/* ---- VSL frame ---- */
.vsl-frame{position:relative;border:1px solid var(--hairline);border-radius:8px;overflow:hidden;aspect-ratio:16/9;background:#0F0F0F;box-shadow:0 48px 96px -48px rgba(0,0,0,.8)}
.vsl-frame video,.vsl-poster{position:absolute;inset:0;width:100%;height:100%}
.vsl-poster img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;filter:var(--grade) brightness(.7)}
.play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:88px;height:88px;border-radius:50%;border:0;cursor:pointer;background:var(--cta);display:flex;align-items:center;justify-content:center;box-shadow:0 16px 48px -8px rgba(201,168,76,.6);transition:transform .3s var(--ease)}
.play-btn:hover{transform:translate(-50%,-50%) scale(1.08)}
.play-btn svg{margin-left:5px}

/* ---- Photo caption device (ported from live site) ---- */
.photo-cap{position:absolute;bottom:0;left:0;right:0;z-index:2;display:flex;justify-content:space-between;gap:16px;padding:12px 16px;background:linear-gradient(180deg,transparent,rgba(15,15,15,.88) 60%)}
.photo-cap span{font-family:'Sora';font-weight:600;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,238,227,.9)}
.photo-cap span:last-child{color:var(--gold)}
.photo-cap.single{justify-content:center}

/* ---- Qualifications card (PT design profile) ---- */
.quals-card{border:1px solid var(--hairline);border-top:3px solid var(--gold);border-radius:8px;background:var(--raised);padding:28px}
.quals-card .row{display:flex;gap:14px;align-items:baseline;margin-bottom:12px}
.quals-card .row:last-of-type{margin-bottom:0}
.quals-card .row .dash{color:var(--gold);font-weight:600}
.quals-card .row .q{font-family:'Sora';font-weight:500;font-size:15px;line-height:1.5;color:rgba(242,238,227,.86)}
.quals-card .note{font-family:'Sora';font-weight:300;font-size:14px;line-height:1.6;color:var(--bone-60);margin-top:20px}

/* ---- Reviews ---- */
.review{background:var(--raised);border:1px solid var(--hairline);border-radius:8px;padding:32px}
.review .strs{color:var(--gold);letter-spacing:4px;font-size:14px;margin-bottom:16px}
.review p{font-size:15px;line-height:1.6;color:var(--bone)}
.review .who{margin-top:16px;font-family:'Sora';font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}

/* ---- Case studies ---- */
.case{display:grid;grid-template-columns:0.9fr 1.1fr;gap:48px;align-items:center;margin-bottom:96px}
.case:last-child{margin-bottom:0}
.case.flip .case-media{order:2}
.case-media{aspect-ratio:4/5;position:relative}
.case .bignum{font-family:'Archivo';font-weight:900;font-variation-settings:'wdth' 125;font-size:clamp(40px,6vw,72px);line-height:.9;background:var(--metal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media(max-width:860px){.case{grid-template-columns:1fr}.case.flip .case-media{order:0}}

/* ---- Deliverables ---- */
.deliver{display:flex;gap:24px;padding:24px 0;border-bottom:1px solid var(--hairline);align-items:flex-start}
.deliver:last-child{border-bottom:0}
.tick{flex:0 0 auto;width:32px;height:32px;border-radius:50%;background:var(--cta);display:flex;align-items:center;justify-content:center}
.deliver h3{font-family:'Archivo';font-weight:900;font-variation-settings:'wdth' 100;text-transform:uppercase;font-size:16px;letter-spacing:.03em;margin-bottom:8px}
.deliver p{color:var(--bone-60);font-size:15px}

/* ---- FAQ ---- */
.faq details{border-bottom:1px solid var(--hairline)}
.faq summary{list-style:none;cursor:pointer;padding:24px 0;font-family:'Sora';font-weight:600;font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:24px;transition:color .3s}
.faq summary:hover{color:var(--gold-bright)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--gold);font-size:24px;font-weight:300;transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--bone-60);font-size:15px;line-height:1.7;padding:0 0 24px;max-width:70ch}

/* ---- Page hero (subpages) ---- */
.page-hero{padding:192px 0 96px}
.page-hero .display{font-size:clamp(40px,6.5vw,88px);line-height:.86}

/* ---- Ident load overlay (Home A spec) ---- */
#ident-overlay{position:fixed;inset:0;z-index:200;background:#141414;display:flex;align-items:center;justify-content:center;transition:opacity .9s var(--ease)}
#ident-overlay video{width:min(70vw,900px);aspect-ratio:16/9;object-fit:cover}

/* ---- Hero media panel (Home A spec): ident video 66% + founder banner 40% feathered — one composition ---- */
.ident-banner{position:relative;border-radius:8px;overflow:hidden;border:1px solid var(--hairline);box-shadow:0 48px 96px -48px rgba(0,0,0,.8);height:clamp(300px,42vh,480px);background:#0F0F0F}
.ident-banner video{position:absolute;top:0;bottom:0;left:0;width:66%;height:100%;object-fit:cover}
.ident-julian{position:absolute;top:0;bottom:0;right:0;width:40%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 22%);mask-image:linear-gradient(90deg,transparent 0%,#000 22%)}
.ident-julian img{width:100%;height:100%;object-fit:cover;object-position:50% 8%}
.ident-caption{position:absolute;right:28px;bottom:24px;z-index:3}
@media(max-width:760px){.ident-banner video{width:100%}.ident-julian{width:58%}}

/* ---- Bleeding background images (V5: 30-40% brightness, scrim toward text) ---- */
.bleed-section{position:relative;overflow:hidden}
.bleed-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.bleed-bg img{width:100%;height:100%;object-fit:cover;filter:var(--grade) brightness(.38)}
.bleed-bg::after{content:'';position:absolute;inset:0;background:var(--scrim)}
.bleed-bg.right{left:auto;width:62%;-webkit-mask-image:linear-gradient(270deg,#000 40%,transparent 100%);mask-image:linear-gradient(270deg,#000 40%,transparent 100%)}
.bleed-bg.right::after{background:linear-gradient(280deg,transparent 0%,rgba(15,15,15,.55) 55%,#141414 100%)}
.bleed-bg.right img{object-position:top center}
.bleed-section>.wrap{position:relative;z-index:2}

/* ---- Results swipe wall ---- */
.wall-scroll{display:flex;gap:12px;overflow-x:auto;padding:0 0 24px;scroll-snap-type:x proximity}
.wall-scroll::-webkit-scrollbar{height:8px}
.wall-scroll::-webkit-scrollbar-thumb{background:var(--hairline);border-radius:4px}
.wall-scroll::-webkit-scrollbar-track{background:transparent}
.wall-cell{flex:0 0 auto;width:280px;aspect-ratio:4/5;border-radius:8px;overflow:hidden;border:1px solid var(--hairline);scroll-snap-align:start;background:#0F0F0F}
.wall-cell img{object-fit:contain !important;object-position:center}
/* full-photo frame: never crops, centres on deep charcoal */
.frame.fit{background:#0F0F0F}
.frame.fit img{object-fit:contain;object-position:center}
@media(max-width:640px){.wall-cell{width:220px}}

/* ---- Motion: fade-rise (IO-gated), settle, plant ---- */
.reveal{opacity:0;transform:translate3d(0,26px,0);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}
.settle{transform:scale(1.04);transition:transform .6s var(--ease)}
.settle.in{transform:scale(1)}
@keyframes plant{from{font-variation-settings:'wdth' 70;opacity:0}to{font-variation-settings:'wdth' 125;opacity:1}}
.plant{animation:plant 1.1s var(--ease) both}
@keyframes glowbreathe{0%,100%{box-shadow:0 16px 40px -12px rgba(201,168,76,.45)}50%{box-shadow:0 16px 48px -10px rgba(201,168,76,.7)}}
.breathe{animation:glowbreathe 4s ease-in-out infinite}

/* ---- Footer ---- */
footer{border-top:1px solid var(--hairline);padding:64px 32px 48px;position:relative}
footer .frow{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-start;gap:48px;flex-wrap:wrap}
footer .fnav{display:flex;gap:48px;flex-wrap:wrap}
footer .fnav div{display:flex;flex-direction:column;gap:12px}
footer .fnav b{font-family:'Sora';font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--bone-38);margin-bottom:4px}
footer .fnav a{color:var(--bone-60);text-decoration:none;font-size:14px;transition:color .3s}
footer .fnav a:hover{color:var(--gold-bright)}
footer .sig{font-family:'Sora';font-weight:300;font-size:13px;letter-spacing:.18em;color:var(--gold);margin-top:32px}
footer .legal{max-width:1200px;margin:48px auto 0;padding-top:24px;border-top:1px solid var(--hairline);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;color:var(--bone-38);font-size:12px}
footer .legal a{color:var(--bone-38);text-decoration:none}
footer .legal a:hover{color:var(--bone-60)}

/* ============================================================
   MOBILE / TOUCH FAST PATH — iOS compositing is the bottleneck.
   Phones drop: blend-mode overlays, backdrop blur, image filters,
   background bleeds, big shadows, infinite glow. Keeps: atmosphere
   gradient, reveals (transform/opacity), all content.
   ============================================================ */
@media (pointer:coarse), (max-width:920px){
  .vignette,.grain{display:none}
  header{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(18,18,18,.96)}
  .bleed-bg{display:none}
  img.graded,.graded img,.story-media img,.vsl-poster img,.wall-cell img,.vt-poster img,.ident-julian img{filter:none !important}
  .card,.frame,.story-card,.ident-banner,.vsl-frame,.quals-card{box-shadow:none}
  .frame::after{display:none}
  .breathe{animation:none}
  .settle{transform:none}
  .btn-primary{box-shadow:0 8px 24px -10px rgba(201,168,76,.45)}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .reveal,.settle{opacity:1;transform:none}
  #ident-overlay{display:none !important}
}

/* ---- Client video testimonials ---- */
.vt-card{position:relative;border:1px solid var(--hairline);border-radius:8px;overflow:hidden;aspect-ratio:4/5;background:#0F0F0F}
.vt-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.vt-poster{position:absolute;inset:0}
.vt-poster img{width:100%;height:100%;object-fit:cover;filter:var(--grade) brightness(.72)}
.vt-name{position:absolute;left:16px;bottom:16px;z-index:2;font-family:'Archivo';font-weight:900;font-variation-settings:'wdth' 125;text-transform:uppercase;font-size:18px;color:var(--bone);text-shadow:0 2px 12px rgba(0,0,0,.6)}
.vt-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;border:0;cursor:pointer;background:var(--cta);display:flex;align-items:center;justify-content:center;box-shadow:0 12px 36px -8px rgba(201,168,76,.6);transition:transform .3s cubic-bezier(.22,1,.36,1);z-index:3}
.vt-play:hover{transform:translate(-50%,-50%) scale(1.1)}
.vt-play svg{margin-left:4px}

/* ---- Editorial paper kit section (bone canvas, ink text, oxblood accent) ---- */
.paper-section{background:linear-gradient(168deg,#F6F2E7,#EDE7D8);color:#141414;border-top:3px solid var(--gold);border-bottom:1px solid var(--hairline)}
.paper-section .kicker{color:#7A1F2B}
.paper-section .display{color:#141414}
.paper-section .lead,.paper-section .body-dim{color:rgba(20,20,20,.78)}
.paper-section .pain-grid{background:rgba(20,20,20,.16);border-color:rgba(20,20,20,.16)}
.paper-section .pgcell{background:#FBF8F0}
.paper-section .pgcell:hover{background:#F3EEE0}
.paper-section .pgcell .n{color:#7A1F2B}
.paper-section .pgcell .t{color:rgba(20,20,20,.85)}
.paper-section .quote-block{border-left-color:#7A1F2B;background:linear-gradient(90deg,rgba(122,31,43,.06),transparent 70%)}
.paper-section .quote-block .q{color:#141414}
.paper-section .quote-block .attr{color:rgba(20,20,20,.55)}

/* ---- Volt button (Performance kit only — the one volt element) ---- */
.btn-volt{background:#CCFF00;color:#141414;box-shadow:0 16px 40px -12px rgba(204,255,0,.4)}
.btn-volt:hover{box-shadow:0 24px 56px -12px rgba(204,255,0,.55)}
.petrol .micro{color:rgba(242,238,227,.6)}
.petrol .body-dim{color:rgba(242,238,227,.72)}
.petrol .display{color:var(--bone)}
.petrol .card{background:rgba(15,50,48,.72);border-color:rgba(242,238,227,.14)}
.petrol .card p{color:rgba(242,238,227,.75)}
.petrol .card .kicker{color:#CCFF00}

/* ---- Centered full bleed (subject in middle, even darkening — no directional mask) ---- */
.bleed-bg.center{-webkit-mask-image:none;mask-image:none;width:100%}
.bleed-bg.center img{filter:var(--grade) brightness(.3);object-position:50% 35%}
.bleed-bg.center::after{background:radial-gradient(ellipse 90% 80% at 50% 50%, transparent 30%, rgba(15,15,15,.85) 100%)}

/* ---- Natural frame: image keeps its own aspect, never cropped ---- */
.frame.natural{aspect-ratio:auto}
.frame.natural img{position:static;width:100%;height:auto;display:block;object-fit:unset}

/* ---- Clear bleed variant: subject stays visible (MOT etc.) ---- */
.bleed-bg.clear img{filter:var(--grade) brightness(.68)}
.bleed-bg.clear::after{background:linear-gradient(280deg,transparent 0%,rgba(15,15,15,.25) 60%,rgba(15,15,15,.7) 100%)}
