/* ============================================================
   TAMIR KFIR — Engineering Better Movement
   Design system inspired by landonorris.com aesthetics:
   bone/khaki ↔ deep olive themes · volt accent · serif×grotesk
   ============================================================ */

/* ---------- fonts ---------- */
@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces.woff2") format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces-italic.woff2") format("woff2");
  font-weight:100 900;font-style:italic;font-display:swap;
}
@font-face{
  font-family:"Archivo";
  src:url("../fonts/archivo.woff2") format("woff2");
  font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap;
}

/* ---------- tokens ---------- */
:root{
  --bone:#ECEAE1;
  --bone-2:#E2DFD3;
  --stone:#C7C3B2;
  --olive:#262A1F;
  --deep:#15170F;
  --ink:#1E2018;
  --volt:#D9FF3F;
  --volt-deep:#A8C71B;
  --violet:#7B6CFF;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Archivo",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(20px,4.5vw,76px);
  --hdr-h:84px;
  --ease:cubic-bezier(.65,.05,0,1);
  --ease-soft:cubic-bezier(.25,.1,.25,1);
}

/* theme palettes — body[data-theme] drives everything */
body[data-theme="light"]{--bg:var(--bone);--fg:var(--ink);--muted:rgba(30,32,24,.62);--line:rgba(30,32,24,.16);--card:rgba(30,32,24,.04);--accent:var(--volt-deep);}
body[data-theme="stone"]{--bg:var(--stone);--fg:var(--ink);--muted:rgba(30,32,24,.66);--line:rgba(30,32,24,.2);--card:rgba(30,32,24,.05);--accent:var(--volt-deep);}
body[data-theme="dark"]{--bg:var(--olive);--fg:var(--bone);--muted:rgba(236,234,225,.6);--line:rgba(236,234,225,.16);--card:rgba(236,234,225,.05);--accent:var(--volt);}
body[data-theme="deep"]{--bg:var(--deep);--fg:var(--bone);--muted:rgba(236,234,225,.55);--line:rgba(236,234,225,.14);--card:rgba(236,234,225,.045);--accent:var(--volt);}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto}
html,body{width:100%}
html{overflow-x:clip}
@supports not (overflow:clip){html,body{overflow-x:hidden}}
body{
  font-family:var(--sans);
  font-size:16px;line-height:1.6;
  background:var(--bg);color:var(--fg);
  transition:background-color .8s var(--ease-soft),color .8s var(--ease-soft);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:clip;
}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
em{font-style:normal}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.gutter{padding-left:var(--gutter);padding-right:var(--gutter)}
::selection{background:var(--volt);color:var(--ink)}

/* film grain */
.grain{
  position:fixed;inset:-40px;z-index:2000;pointer-events:none;
  background:url("../img/noise.png") repeat;background-size:132px;
  opacity:.055;mix-blend-mode:overlay;
  animation:grain 1.1s steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)}20%{transform:translate(-14px,8px)}40%{transform:translate(10px,-12px)}
  60%{transform:translate(-8px,-6px)}80%{transform:translate(12px,10px)}100%{transform:translate(0,0)}
}

/* custom cursor (fine pointers only) */
.cursor{display:none}
@media (pointer:fine){
  .cursor{
    display:block;position:fixed;top:0;left:0;z-index:3000;pointer-events:none;
    width:10px;height:10px;border-radius:50%;
    background:var(--volt);mix-blend-mode:difference;
    transform:translate(-50%,-50%);
    transition:width .25s var(--ease-soft),height .25s var(--ease-soft),opacity .25s;
    opacity:0;
  }
  body.cur-on .cursor{opacity:1}
  .cursor.is-hover{width:44px;height:44px}
}

/* ---------- logo system: masked tint + chrome sheen ---------- */
.logo-tint{
  display:block;background-color:currentColor;
  -webkit-mask:url("../img/logo-tk-mask.png") center/contain no-repeat;
  mask:url("../img/logo-tk-mask.png") center/contain no-repeat;
}
.sheen{
  position:absolute;inset:0;pointer-events:none;
  -webkit-mask:url("../img/logo-tk-mask.png") center/contain no-repeat;
  mask:url("../img/logo-tk-mask.png") center/contain no-repeat;
  background:linear-gradient(108deg,transparent 38%,rgba(255,255,255,.55) 47%,rgba(217,255,63,.85) 52%,rgba(255,255,255,.4) 57%,transparent 66%);
  background-size:300% 100%;background-repeat:no-repeat;
  animation:sheen 5.6s cubic-bezier(.55,.1,.3,1) infinite;
}
.sheen--slow{animation-duration:8.5s}
@keyframes sheen{
  0%{background-position:140% 0}
  32%{background-position:-45% 0}
  100%{background-position:-45% 0}
}
.hero__ghost{
  position:absolute;right:-3vw;top:13vh;
  width:min(44vw,720px);
  opacity:.34;mix-blend-mode:screen;
  pointer-events:none;
}
.hero__ghost img{width:100%;height:auto;display:block}
.sheen--ghost-a{animation-duration:7s}
.sheen--ghost-b{
  animation-duration:11s;animation-delay:3.2s;
  background:linear-gradient(108deg,transparent 40%,rgba(217,255,63,.9) 50%,rgba(123,190,255,.65) 55%,transparent 64%);
  background-size:300% 100%;background-repeat:no-repeat;
}
body.no-motion .sheen{animation:none;background:none}

/* ---------- typography helpers ---------- */
.serif-i{font-family:var(--serif);font-style:italic;font-weight:340;letter-spacing:-.01em}
.eyebrow{
  font-size:.72rem;font-weight:640;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);display:flex;align-items:center;gap:.75em;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--accent);flex:none}
h2{
  font-family:var(--sans);font-weight:790;font-stretch:112%;
  font-size:clamp(2rem,5vw,4.1rem);line-height:1.02;
  letter-spacing:-.015em;text-transform:uppercase;
  margin:.55em 0 .4em;
}
h2 .serif-i{font-weight:330;text-transform:none;font-size:1.04em}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:1.05em 1.9em;border-radius:999px;
  font-size:.8rem;font-weight:680;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid transparent;position:relative;overflow:hidden;
  transition:transform .3s var(--ease-soft),background-color .3s,color .3s,border-color .3s;
  will-change:transform;
}
.btn__t{position:relative;z-index:1}
.btn--volt{background:var(--volt);color:#161809;box-shadow:0 10px 34px -12px rgba(217,255,63,.55)}
.btn--volt:hover{background:#e6ff70}
.btn--ghost{border-color:var(--line);color:var(--fg);backdrop-filter:blur(6px)}
.btn--ghost:hover{border-color:var(--fg)}
.btn--dark{background:var(--ink);color:var(--bone)}
.btn--dark:hover{background:#000}
.btn--ink{background:#161809;color:var(--volt)}
.btn--big{padding:1.35em 2.6em;font-size:.92rem}
.linkline{
  display:inline-flex;gap:.5em;align-items:baseline;
  font-size:.78rem;font-weight:660;letter-spacing:.16em;text-transform:uppercase;
  border-bottom:1px solid var(--line);padding-bottom:.45em;
  transition:border-color .3s,color .3s;
}
.linkline:hover{border-color:var(--accent);color:var(--accent)}
.linkline i{font-style:normal;transition:transform .3s var(--ease-soft)}
.linkline:hover i{transform:translate(3px,2px)}

/* ============================================================
   PRELOADER
============================================================ */
.pre{
  position:fixed;inset:0;z-index:4000;
  background:var(--deep);color:var(--bone);
  display:flex;align-items:center;justify-content:center;
}
.pre__inner{display:flex;flex-direction:column;align-items:center;gap:18px;transform:translateY(6px)}
.pre__mark{width:116px;height:62px;color:var(--volt)}
.pre__word{font-weight:740;font-stretch:118%;letter-spacing:.42em;font-size:.82rem;text-indent:.42em}
.pre__line{width:180px;height:1px;background:rgba(236,234,225,.18);overflow:hidden}
.pre__bar{display:block;height:100%;width:100%;background:var(--volt);transform:scaleX(0);transform-origin:left}
.pre__count{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.05rem;color:var(--muted)}

/* ============================================================
   HEADER
============================================================ */
.hdr{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  height:var(--hdr-h);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(16px,2.6vw,40px);
  transition:transform .5s var(--ease);
}
.hdr.is-hidden{transform:translateY(-110%)}
.hdr__brand{display:flex;align-items:center;gap:12px}
.hdr__logo{position:relative;display:block;width:64px}
.hdr__logo img{width:100%;height:auto;display:block;filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}
body[data-theme="light"] .hdr__logo img,body[data-theme="stone"] .hdr__logo img{filter:drop-shadow(0 1px 4px rgba(15,17,9,.45)) contrast(1.15) brightness(.82)}
.hdr__right{display:flex;align-items:center;gap:14px}
.hdr__cta{padding:.95em 1.6em}
.burger{
  width:52px;height:52px;border-radius:14px;
  border:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  background:color-mix(in srgb,var(--bg) 55%,transparent);
  backdrop-filter:blur(10px);
  transition:border-color .3s,background-color .8s var(--ease-soft);
}
.burger span{display:block;width:20px;height:2px;background:var(--fg);transition:transform .4s var(--ease),translate .4s var(--ease)}
.burger span:first-child{width:14px;align-self:flex-start;margin-left:16px}
.burger:hover{border-color:var(--fg)}
body.menu-open .burger span:first-child{transform:translate(3px,4.5px) rotate(45deg);width:20px;margin-left:16px}
body.menu-open .burger span:last-child{transform:translateY(-4.5px) rotate(-45deg)}

/* ============================================================
   MENU OVERLAY
============================================================ */
.menu{position:fixed;inset:0;z-index:900;visibility:hidden;pointer-events:none}
.menu__bg{position:absolute;inset:0;background:var(--deep);transform:translateY(-102%)}
.menu__inner{
  position:relative;height:100%;display:flex;align-items:flex-end;justify-content:space-between;
  gap:6vw;padding:calc(var(--hdr-h) + 3vh) var(--gutter) 7vh;
  color:var(--bone);
}
.menu__list{display:flex;flex-direction:column;gap:.1em}
.menu__list a{
  display:flex;align-items:baseline;gap:.6em;
  font-family:var(--sans);font-weight:780;font-stretch:112%;text-transform:uppercase;
  font-size:clamp(1.9rem,5.4vh,3.4rem);line-height:1.16;letter-spacing:-.01em;
  transition:color .3s;
}
.menu__list a em{font-family:var(--serif);font-style:italic;font-weight:300;font-size:.38em;color:var(--volt);letter-spacing:.08em}
.menu__list a:hover{color:var(--volt)}
.menu__aside{display:flex;flex-direction:column;gap:1.6em;text-align:right;padding-bottom:.6em}
.menu__tag{font-family:var(--serif);font-weight:300;font-size:1.35rem;line-height:1.3}
.menu__tag i{color:var(--volt)}
.menu__mail{font-size:.85rem;letter-spacing:.12em;border-bottom:1px solid rgba(236,234,225,.25);padding-bottom:.4em;align-self:flex-end}
.menu__mail:hover{color:var(--volt);border-color:var(--volt)}
.menu__fly{font-size:.68rem;font-weight:660;letter-spacing:.3em;color:var(--muted)}

/* ============================================================
   HERO
============================================================ */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:clip}
.hero__media{position:absolute;inset:0;z-index:-1}
.hero__vid{
  width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1.2s var(--ease-soft);
  filter:saturate(.92);
}
.hero__vid.is-live{opacity:1}
.hero__vid--m{display:none}                 /* desktop: mobile clip hidden (mobile query re-shows it) */
.hero__media{background:url("../img/hero-poster-2026.jpg") center 38%/cover no-repeat #15170F}
.hero__shade{
  position:absolute;inset:0;
  background:
    linear-gradient(12deg,rgba(13,15,8,.88) 8%,rgba(13,15,8,.42) 42%,rgba(13,15,8,.18) 66%,rgba(13,15,8,.5) 100%);
}
.hero__content{position:relative;padding-bottom:clamp(200px,31vh,370px);width:100%}
.hero__title{
  text-transform:uppercase;color:var(--bone);
  line-height:.92;letter-spacing:-.018em;
  margin-bottom:.35em;
}
.hero__l{display:block;overflow:hidden}
.hero__l .hl-inner{display:inline-block;will-change:transform}
.hero__l--sans{font-weight:820;font-stretch:118%;font-size:clamp(3rem,9.6vw,9rem)}
.hero__l--serif{
  font-family:var(--serif);font-style:italic;font-weight:280;text-transform:none;
  font-size:clamp(2.6rem,8vw,7.6rem);color:var(--volt);
  margin:.02em 0 .02em .04em;
}
.hero__l--xl{font-size:clamp(3.2rem,10.6vw,10rem)}
.hero__sub{font-size:clamp(1rem,1.5vw,1.25rem);color:rgba(236,234,225,.82);max-width:34ch;margin-bottom:2.2em}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap}

/* HUD spec card */
.hud{
  position:absolute;right:clamp(16px,3vw,44px);bottom:clamp(96px,16vh,160px);
  width:min(300px,72vw);
  padding:18px 20px 14px;
  border:1px solid rgba(236,234,225,.22);
  background:rgba(13,15,8,.38);backdrop-filter:blur(12px);
  color:var(--bone);
}
.hud::before,.hud::after{
  content:"";position:absolute;width:14px;height:14px;border:1px solid var(--volt);
}
.hud::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.hud::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.hud__label{
  display:flex;align-items:center;gap:.7em;
  font-size:.62rem;font-weight:680;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(236,234,225,.66);margin-bottom:12px;
}
.hud__dot{width:7px;height:7px;border-radius:50%;background:var(--volt);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(217,255,63,.55)}55%{box-shadow:0 0 0 8px rgba(217,255,63,0)}}
.hud__rows li{
  display:flex;align-items:baseline;justify-content:space-between;gap:1em;
  padding:.55em 0;border-top:1px solid rgba(236,234,225,.14);
  font-size:.78rem;font-weight:560;letter-spacing:.1em;text-transform:uppercase;
}
.hud__rows em{color:var(--volt);font-weight:740;font-size:.85rem}
.hud__rows b{font-weight:790}

.hero__scroll{
  position:absolute;left:clamp(16px,3vw,44px);bottom:clamp(26px,4.5vh,42px);
  display:flex;align-items:center;gap:14px;
  font-size:.64rem;font-weight:660;letter-spacing:.3em;text-transform:uppercase;color:rgba(236,234,225,.7);
}
.hero__scroll i{width:64px;height:1px;background:rgba(236,234,225,.35);position:relative;overflow:hidden}
.hero__scroll i::after{content:"";position:absolute;inset:0;background:var(--volt);transform:translateX(-100%);animation:scrollhint 2.2s var(--ease) infinite}
@keyframes scrollhint{0%{transform:translateX(-100%)}55%{transform:translateX(0)}100%{transform:translateX(102%)}}

/* ============================================================
   MANIFESTO — word highlight sweep
============================================================ */
.manifesto{position:relative;min-height:250vh}
.manifesto__sticky{
  position:sticky;top:0;min-height:100vh;
  display:flex;flex-direction:column;justify-content:center;gap:7vh;
  padding-top:14vh;padding-bottom:10vh;
}
.manifesto__sticky::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(46% 38% at 36% 44%, rgba(217,255,63,.075), transparent 72%),
    radial-gradient(34% 30% at 64% 62%, rgba(123,108,255,.055), transparent 72%);
}
.manifesto__text{
  font-family:var(--sans);font-weight:730;font-stretch:110%;
  font-size:clamp(1.7rem,4.5vw,3.9rem);line-height:1.18;text-transform:uppercase;
  letter-spacing:-.012em;max-width:22ch;
}
.manifesto__text .w{position:relative;display:inline-block;white-space:pre}
.manifesto__text .w__bg{
  position:absolute;inset:-.06em -.08em;background:var(--volt);
  transform:scaleX(0);transform-origin:left;z-index:0;
}
.manifesto__text .w__t{position:relative;z-index:1;color:rgba(236,234,225,.22)}
.manifesto__text .w.kw .w__t{
  font-family:var(--serif);font-style:italic;font-weight:320;text-transform:none;
  font-size:1.08em;letter-spacing:0;
}
.manifesto__text .w.is-on .w__t{color:var(--bone)}
.manifesto__text .w.kw.is-on .w__t{color:var(--volt)}
.manifesto__foot{max-width:52ch;color:var(--muted);font-size:.95rem}

/* ============================================================
   PROOF — marquees + shrinking media + drawn mark
============================================================ */
.proof{position:relative;min-height:300vh}
.proof__sticky{
  position:sticky;top:0;height:100vh;overflow:clip;
  display:flex;flex-direction:column;justify-content:center;
}
.mq{white-space:nowrap;pointer-events:none;user-select:none}
.mq__inner{display:inline-flex;will-change:transform}
.mq--a{font-family:var(--serif);font-style:italic;font-weight:270;font-size:clamp(3rem,9vw,8.4rem);color:var(--bone);opacity:.92}
.mq--a .mq__inner{gap:0}
.mq--b{
  font-weight:830;font-stretch:120%;text-transform:uppercase;
  font-size:clamp(1.6rem,4.6vw,4rem);letter-spacing:.02em;
  color:transparent;-webkit-text-stroke:1.5px rgba(236,234,225,.8);
  margin-top:2vh;
}
.proof__media{
  position:absolute;inset:0;margin:auto;z-index:2;
  width:min(66vw,860px);height:min(66vh,640px);
  display:flex;align-items:center;justify-content:center;
  will-change:transform;
}
.proof__media img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(0) sepia(0);
}
.proof__mark{
  position:absolute;inset:0;margin:auto;width:44%;height:fit-content;
  filter:drop-shadow(0 10px 36px rgba(0,0,0,.5));
}
.proof__mark img{width:100%;height:auto;display:block}
.proof__cap{
  position:absolute;left:0;bottom:-2.6em;
  font-size:.68rem;font-weight:660;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);
}

/* ============================================================
   DIARY — morphing collage + quote
============================================================ */
.diary{position:relative;padding:10vh 0 14vh}
.zone{display:block;height:1px}
.diary__grid{position:relative;display:flex;justify-content:space-between;gap:4vw;margin:8vh 0}
.diary__grid--b{align-items:flex-start}
.polaroid{
  --tilt:0deg;
  width:min(320px,38vw);
}
.polaroid img{
  width:100%;height:auto;
  filter:saturate(.92) contrast(1.04);
  box-shadow:0 34px 70px -30px rgba(15,17,9,.55);
}
.polaroid figcaption{
  display:block;
  padding-top:12px;
  font-size:.6rem;font-weight:470;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);
  line-height:1.7;
}
.polaroid figcaption strong{display:block;font-weight:790;color:var(--fg);margin-bottom:.15em}
.polaroid figcaption strong + br{display:none}
.diary__ph--1{margin-top:4vh}
.diary__ph--2{margin-top:14vh;width:min(280px,34vw)}
.diary__ph--3{width:min(360px,40vw)}
.diary__ph--4{margin-top:10vh;width:min(340px,40vw)}
.diary__ph--5{margin-top:-4vh;width:min(250px,30vw)}
.diary__quote{max-width:900px;margin:6vh auto;text-align:center}
.diary__quote p{
  font-family:var(--serif);font-weight:300;font-size:clamp(1.5rem,3.4vw,2.7rem);line-height:1.3;
  letter-spacing:-.01em;
}
.diary__quote cite{display:inline-flex;flex-direction:column;align-items:center;gap:2px;margin-top:2.4em;font-style:normal}
.diary__cite-name{font-family:var(--serif);font-style:italic;font-size:1.5rem;font-weight:340}
.diary__cite-scribble{width:150px;height:16px;color:var(--accent)}
.diary__cite-role{font-size:.62rem;font-weight:660;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.diary__foot{text-align:center;color:var(--muted);font-size:.95rem;letter-spacing:.04em}

/* ============================================================
   ON COURT / OFF COURT
============================================================ */
.onoff{padding:16vh 0 10vh;position:relative;overflow:clip}
.onoff__kicker{margin-bottom:9vh}
.onoff__h{margin-top:.5em}
.onoff__h .serif-i{font-size:1.05em}
.onoff__h-b{color:var(--muted)}
.onoff__grid{
  display:grid;grid-template-columns:1fr 1fr;gap:6vw;
  max-width:1100px;
}
.onoff__t{
  display:flex;align-items:baseline;gap:.35em;
  text-transform:uppercase;line-height:1;margin-bottom:.5em;
}
.onoff__t-serif{
  position:relative;font-family:var(--serif);font-style:italic;font-weight:300;text-transform:none;
  font-size:clamp(2.6rem,5.6vw,4.6rem);
}
.onoff__t-sans{font-weight:830;font-stretch:118%;font-size:clamp(2.4rem,5.2vw,4.4rem);letter-spacing:-.015em}
.onoff__scribble{
  position:absolute;left:-18%;top:-26%;width:136%;height:150%;
  color:var(--volt-deep);pointer-events:none;
}
body[data-theme="dark"] .onoff__scribble,body[data-theme="deep"] .onoff__scribble{color:var(--volt)}
.onoff__col p{color:var(--muted);max-width:34ch;margin-bottom:1.6em}
.onoff__faces{
  display:flex;justify-content:center;align-items:flex-end;gap:clamp(14px,3vw,44px);
  margin:11vh auto 0;padding:0 var(--gutter);
}
.onoff__face{width:min(500px,44vw);will-change:transform}
.onoff__face img{aspect-ratio:4/4.6;object-fit:cover;width:100%;height:auto;filter:grayscale(1) contrast(1.04)}
.onoff__face--r img{aspect-ratio:4/5.4}
.onoff__face figcaption{
  margin-top:.9em;font-size:.62rem;font-weight:680;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);
}
.onoff__face--r figcaption{text-align:right}
.principles{
  display:grid;grid-template-columns:repeat(3,1fr);gap:4vw;
  margin-top:12vh;padding-top:5vh;border-top:1px solid var(--line);
}
.principles em{
  font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.4rem;color:var(--accent);
}
.principles h4{
  font-size:.95rem;font-weight:740;letter-spacing:.06em;text-transform:uppercase;margin:.7em 0 .5em;
}
.principles p{font-size:.88rem;color:var(--muted);max-width:30ch}

/* ============================================================
   PRODUCT — exploded insole
============================================================ */
.product{position:relative}
.product__pin{position:relative;min-height:100vh;display:flex;align-items:center;overflow:clip}
.product__glow{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(46% 60% at 30% 55%,rgba(123,108,255,.16),transparent 70%),
    radial-gradient(30% 40% at 72% 30%,rgba(217,255,63,.05),transparent 70%);
}
.product__wrap{
  width:100%;display:grid;grid-template-columns:1.15fr .85fr;gap:5vw;align-items:center;
  padding-top:12vh;padding-bottom:12vh;
}
.product__stage{position:relative;aspect-ratio:16/10.5;will-change:transform}
.product__bodywrap{position:absolute;inset:0 0 8% 0;display:flex;align-items:center;justify-content:center;will-change:transform}
.product__body{max-width:90%;max-height:86%;width:auto;height:auto;filter:drop-shadow(0 40px 60px rgba(0,0,0,.5))}
.angles{position:absolute;left:0;bottom:0;display:flex;gap:8px;z-index:3}
.angle{
  display:flex;gap:.8em;align-items:baseline;
  padding:.62em 1.05em;border:1px solid rgba(242,239,231,.22);
  background:rgba(4,12,24,.05);backdrop-filter:blur(8px);
  font-size:.6rem;font-weight:680;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);
  cursor:pointer;transition:border-color .3s,color .3s;
}
.angle em{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.05em}
.angle:hover{border-color:rgba(242,239,231,.5);color:var(--fg)}
.angle.is-active{border-color:var(--volt);color:var(--fg)}
.angle.is-active em{color:var(--volt)}
.scanline{
  position:absolute;left:2%;right:2%;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--volt) 30%,var(--volt) 70%,transparent);
  box-shadow:0 0 18px rgba(217,255,63,.75);
  opacity:0;
}
.anno{position:absolute;display:flex;align-items:center;gap:0}
.anno__line{
  display:block;height:1px;width:clamp(40px,6vw,110px);
  background:var(--volt);transform-origin:left;position:relative;
}
.anno__line::before{
  content:"";position:absolute;left:-4px;top:-3.5px;width:8px;height:8px;border-radius:50%;
  background:var(--volt);box-shadow:0 0 12px rgba(217,255,63,.9);
}
.anno__label{
  padding:.55em .9em;border:1px solid rgba(236,234,225,.22);
  background:rgba(13,15,8,.55);backdrop-filter:blur(8px);
  font-size:.6rem;font-weight:680;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;
  display:flex;gap:.9em;align-items:baseline;
}
.anno__label em{color:var(--volt);font-weight:760}
.anno--1{left:2%;top:24%}
.anno--2{left:58%;top:12%}
.anno--3{right:-2%;top:58%;flex-direction:row-reverse}
.anno--3 .anno__line{transform-origin:right}
.anno--3 .anno__line::before{left:auto;right:-4px}
.anno--4{left:12%;top:82%}
.product__copy p{color:var(--muted);max-width:42ch;margin-bottom:1.3em}
.product__copy strong{color:var(--fg);font-weight:700}
.product__copy .serif-i{color:var(--accent)}
.chip{
  display:inline-flex;align-items:center;gap:.8em;
  padding:.8em 1.3em;border:1px solid var(--line);border-radius:999px;
  font-size:.68rem;font-weight:660;letter-spacing:.2em;text-transform:uppercase;color:var(--fg);
  margin-top:.6em;
}
.chip__dot{width:7px;height:7px;border-radius:50%;background:var(--violet);box-shadow:0 0 12px rgba(123,108,255,.9)}

/* ============================================================
   METHOD — horizontal steps
============================================================ */
.method{position:relative;padding-top:14vh}
.method__head{max-width:980px;margin-bottom:7vh}
.method__lede{color:var(--muted);max-width:56ch}
.method__wrap{overflow:clip}
.method__track{
  display:flex;gap:clamp(16px,2.4vw,34px);
  padding:0 var(--gutter) 14vh;
  will-change:transform;
}
.step{
  flex:none;width:clamp(300px,34vw,460px);
  border:1px solid var(--line);background:var(--card);
  padding:clamp(22px,2.6vw,38px);
  display:flex;flex-direction:column;min-height:clamp(360px,52vh,480px);
  position:relative;
}
.step--intro{
  justify-content:flex-end;gap:1.4em;background:transparent;border-style:dashed;
  width:clamp(280px,30vw,420px);
}
.step--intro img{width:100%;height:auto;aspect-ratio:4/3.1;object-fit:cover;filter:grayscale(1) contrast(1.06)}
.step--intro p{
  font-family:var(--sans);font-weight:740;font-stretch:112%;text-transform:uppercase;
  font-size:1.25rem;line-height:1.3;
}
.step--intro p .serif-i{text-transform:none;color:var(--accent);font-size:1.05em}
.step__n{
  font-family:var(--serif);font-style:italic;font-weight:280;
  font-size:clamp(3rem,5vw,4.6rem);line-height:1;color:var(--accent);
}
.step h3{
  font-size:1.05rem;font-weight:760;letter-spacing:.08em;text-transform:uppercase;
  margin:.9em 0 .7em;
}
.step p{font-size:.92rem;color:var(--muted);max-width:36ch}
.step__meta{
  margin-top:auto;padding-top:1.6em;
  font-size:.6rem;font-weight:660;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);
  border-top:1px solid var(--line);
}

/* ============================================================
   SOLUTIONS — spec-card grid
============================================================ */
.sol{padding:6vh 0 12vh}
.sol__head{max-width:900px;margin-bottom:6vh}
.sol__lede{color:var(--muted);max-width:52ch}
.sol__grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,22px);
}
.card{
  position:relative;border:1px solid var(--line);background:var(--card);
  padding:10px;display:flex;flex-direction:column;gap:12px;
  transition:border-color .35s,transform .35s var(--ease-soft),background-color .35s;
  will-change:transform;
}
.card::after{
  content:"";position:absolute;top:10px;right:10px;width:10px;height:10px;
  border-top:1px solid var(--accent);border-right:1px solid var(--accent);
  opacity:0;transition:opacity .35s;
}
.card:hover{border-color:rgba(217,255,63,.5);transform:translateY(-6px)}
.card:hover::after{opacity:1}
.card figure{overflow:hidden;aspect-ratio:4/3.4;background:#0E100A}
.card img{
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.05) brightness(.92);
  transition:filter .5s var(--ease-soft),transform .8s var(--ease-soft);
}
.card:hover img{filter:grayscale(0) contrast(1);transform:scale(1.05)}
.card__meta{padding:2px 6px 10px;display:flex;flex-direction:column;gap:4px}
.card__meta em{font-family:var(--serif);font-style:italic;font-weight:300;color:var(--accent);font-size:.85rem}
.card__meta h3{font-size:.92rem;font-weight:760;letter-spacing:.1em;text-transform:uppercase}
.card__meta p{font-size:.72rem;color:var(--muted);letter-spacing:.02em}
.sol__cta{margin-top:7vh;font-size:1rem;color:var(--muted);display:flex;gap:1.2em;align-items:baseline;flex-wrap:wrap}

/* arc divider deep→light */
.arc{
  height:clamp(70px,12vh,130px);
  background:var(--deep);
  clip-path:ellipse(74% 100% at 50% 0%);
  margin-bottom:-1px;
}

/* ============================================================
   FOUNDER
============================================================ */
.founder{padding:14vh 0 12vh;overflow:clip}
.founder__wrap{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center}
.founder__media{position:relative;min-height:460px}
.founder__main{width:min(520px,100%);position:relative;z-index:2}
.founder__mini{position:absolute;width:180px;z-index:3}
.founder__mini img{box-shadow:0 0 0 6px var(--bg),0 30px 60px -24px rgba(15,17,9,.6);transition:box-shadow .8s var(--ease-soft)}
.founder__mini--1{right:4%;top:-6%}
.founder__mini--2{right:-2%;bottom:-8%;width:160px}
.founder__copy p{color:var(--muted);max-width:46ch;margin-bottom:1.3em}
.founder__copy .serif-i{color:var(--fg)}
.founder__principle{
  font-family:var(--serif);font-weight:320;font-style:italic;
  font-size:1.5rem;line-height:1.35;color:var(--fg)!important;
  border-left:2px solid var(--accent);padding-left:1em;margin:1.6em 0 2em!important;
}
.founder__copy .btn{margin-top:.4em}

/* ============================================================
   FINALE — volt wall
============================================================ */
.finale{position:relative}
.finale__statement{padding-top:8vh;padding-bottom:12vh;max-width:1000px}
.finale__lede{
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.5rem,3.2vw,2.6rem);line-height:1.32;letter-spacing:-.008em;
  margin-top:1em;
}
.finale__lede .serif-i{color:var(--volt-deep)}
.wall{
  position:relative;overflow:clip;
  min-height:130svh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4vh;
  text-align:center;
  background:
    radial-gradient(48% 26% at 50% 64%,rgba(217,255,63,.18),transparent 72%),
    linear-gradient(180deg,var(--bone) 0%,var(--stone) 9%,#70745A 20%,var(--olive) 36%,#101207 60%,var(--deep) 100%);
}
.wall__fly{
  position:relative;z-index:2;
  text-transform:uppercase;color:var(--bone);
  line-height:.92;letter-spacing:-.02em;
  padding-top:26vh;
}
.wall__fly-a{display:block;font-family:var(--serif);font-style:italic;font-weight:300;text-transform:none;font-size:clamp(3rem,9vw,8.6rem);color:var(--volt)}
.wall__fly-b{display:block;font-weight:840;font-stretch:120%;font-size:clamp(3.6rem,12vw,11.4rem)}
.wall__fly-b em{color:var(--volt)}
.wall__insole{
  position:relative;z-index:1;width:min(820px,86vw);margin-top:-2vh;
  filter:drop-shadow(0 60px 80px rgba(0,0,0,.65)) drop-shadow(0 0 70px rgba(217,255,63,.22));
  will-change:transform;
}
.wall__cta{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.4em;padding-bottom:10vh}
.wall__note{font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(236,234,225,.66)}

/* ============================================================
   FOOTER
============================================================ */
.foot{background:var(--deep);color:var(--bone);padding-top:2vh}
.foot__grid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:5vw;
  padding-top:6vh;padding-bottom:6vh;
  border-top:1px solid rgba(236,234,225,.12);
}
.foot__mark{width:74px;height:40px;color:var(--volt)}
.foot__name{font-weight:790;font-stretch:118%;letter-spacing:.34em;margin:14px 0 10px;font-size:.9rem}
.foot__tag{font-size:.88rem;color:rgba(236,234,225,.55);max-width:36ch}
.foot__col{display:flex;flex-direction:column;gap:.7em}
.foot__col h4{
  font-size:.62rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase;
  color:rgba(236,234,225,.45);margin-bottom:.6em;
}
.foot__col a{font-size:.92rem;color:rgba(236,234,225,.85);width:fit-content;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.foot__col a:hover{color:var(--volt);border-color:var(--volt)}
.foot__legal{
  display:flex;justify-content:space-between;gap:2em;flex-wrap:wrap;
  padding-top:2.4vh;padding-bottom:3.4vh;
  border-top:1px solid rgba(236,234,225,.1);
  font-size:.72rem;color:rgba(236,234,225,.45);letter-spacing:.06em;
}
.foot__fly{letter-spacing:.3em}

/* ============================================================
   REVEAL PRIMITIVES (JS sets initial states; CSS = final state)
============================================================ */
.split-line{display:block;overflow:hidden}
.split-line>div{will-change:transform}

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width:1100px){
  .sol__grid{grid-template-columns:repeat(3,1fr)}
  .product__wrap{grid-template-columns:1fr;gap:7vh}
  .product__stage{max-width:720px;margin:0 auto;width:100%}
  .founder__wrap{grid-template-columns:1fr;gap:9vh}
}
@media (max-width:820px){
  :root{--hdr-h:70px}
  .hdr__cta{display:none}
  .hdr__mark{width:34px;height:37px}
  .menu__inner{flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:7vh}
  .menu__aside{text-align:left;align-items:flex-start}
  .menu__mail{align-self:flex-start}
  .hero{flex-direction:column;align-items:stretch;justify-content:flex-end}
  .hero__content{padding-top:calc(var(--hdr-h) + 16px)}
  .hero__media{position:absolute}
  .hud{position:static;width:auto;margin:10px var(--gutter) 72px}
  .hero__l--sans{font-size:clamp(2.2rem,10vw,3.4rem);font-stretch:110%}
  .hero__l--serif{font-size:clamp(2rem,9vw,3rem)}
  .hero__l--xl{font-size:clamp(2.5rem,11.6vw,3.9rem)}
  .hero__content{padding-bottom:28px}   /* was 64 — tighter gap to the strip (client 2026-07-10) */
  .hero__scroll{display:none}
  .manifesto{min-height:210vh}
  .manifesto__text{max-width:100%}
  .proof{min-height:260vh}
  .proof__media{width:82vw;height:56vh}
  .proof__cap{bottom:-3.2em}
  .diary__grid{flex-wrap:wrap;justify-content:center;gap:44px 26px}
  .polaroid{width:min(300px,72vw)!important;margin:0!important}
  .onoff__grid{grid-template-columns:1fr;gap:7vh}
  .onoff__faces{flex-direction:column;align-items:center;gap:30px}
  .onoff__face{width:min(440px,86vw)!important}
  .principles{grid-template-columns:1fr;gap:6vh}
  .method__track{flex-direction:column;padding-bottom:8vh}
  .step{width:100%;min-height:0}
  .step--intro{width:100%;min-height:0;flex-direction:row;align-items:center;justify-content:center;text-align:center;gap:18px;border-style:dashed;padding:26px 18px}
  .step--intro img{display:none}
  .sol__grid{grid-template-columns:repeat(2,1fr)}
  .founder__media{min-height:0;padding:0 0 90px}
  .founder__main{margin:0 auto}
  .founder__mini{width:140px}
  .founder__mini--1{right:-2%;top:-5%}
  .founder__mini--2{right:6%;bottom:0}
  .foot__grid{grid-template-columns:1fr;gap:5vh}
  .wall{min-height:110svh}
  .angles{position:static;justify-content:center;margin-top:16px}
  .anno__label{font-size:.5rem;letter-spacing:.16em}
  .anno__line{width:26px}
  .anno--3{right:0}
}
@media (max-width:480px){
  .sol__grid{grid-template-columns:1fr 1fr;gap:10px}
  .card__meta h3{font-size:.78rem}
  .card__meta p{display:none}
  .btn{padding:1em 1.5em}
}

/* ============================================================
   QA MODE + REDUCED MOTION — everything visible, no motion
============================================================ */
body.no-motion .grain{animation:none}
body.no-motion .hero__scroll i::after{animation:none}
body.no-motion .hud__dot{animation:none}
body.no-motion .manifesto{min-height:0}
body.no-motion .manifesto__text .w__t{color:var(--fg)}
body.no-motion .manifesto__text .w.kw .w__t{color:var(--accent)}
body.no-motion .proof{min-height:0}
body.no-motion .proof__sticky{position:relative;height:auto;padding:10vh 0}
body.no-motion .proof__media{position:relative;inset:auto;margin:5vh auto}
body.no-motion .pre{display:none}
@media (prefers-reduced-motion:reduce){
  .grain,.hero__scroll i::after,.hud__dot{animation:none!important}
}

/* ============================================================
   INNER PAGES LAYER
============================================================ */
/* page transition veil */
.veil{position:fixed;inset:-1px 0;z-index:1200;background:var(--deep);pointer-events:auto}
.veil::after{content:"";position:absolute;left:50%;top:50%;width:64px;height:34px;transform:translate(-50%,-50%);background:url("../img/logo-tk-silver.png") center/contain no-repeat;opacity:.5}
body.no-motion .veil{display:none}

/* breadcrumbs */
.crumbs{display:flex;flex-wrap:wrap;gap:.7em;align-items:center;font-size:.72rem;font-weight:660;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:clamp(1.2rem,3vh,2.2rem)}
.crumbs a:hover{color:var(--accent)}
.crumbs i{font-style:normal;color:var(--accent)}

/* page hero */
.phero{position:relative;min-height:82svh;display:flex;align-items:flex-end;overflow:clip;padding-top:calc(var(--hdr-h) + 6vh);padding-bottom:clamp(2.6rem,7vh,5rem)}
.phero__media{position:absolute;inset:0;z-index:0}
.phero__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.9)}
/* --- about hero (2026-07-10): the 4:3 trophy photo centered vertically in the
   ultra-wide cover frame, cropping Tamir's head (top ~quarter of the image) —
   bias the crop window toward the top so the face survives any frame ratio;
   tall/mobile frames show the full height, where the bias is a no-op --- */
body.page-id-336 .phero__media img{object-position:center 25%}
.phero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,23,15,.42) 0%,rgba(21,23,15,.18) 42%,rgba(21,23,15,.86) 100%)}
.phero__content{position:relative;z-index:1;width:100%}
.phero__title{font-weight:800;font-stretch:112%;text-transform:uppercase;letter-spacing:-.028em;line-height:.95;font-size:clamp(2.35rem,9vw,8.2rem)}
.phero__title .pl{display:block;overflow:clip}
.phero__title .hl-inner{display:inline-block;will-change:transform}
.phero__title .serif-i{text-transform:none;font-weight:320;letter-spacing:-.015em}
.phero__sub{max-width:58ch;color:var(--muted);font-size:clamp(1.02rem,1.5vw,1.3rem);line-height:1.55;margin-top:clamp(1.1rem,2.6vh,1.9rem)}
.phero--media .phero__sub{color:rgba(236,234,225,.78)}
.phero__scroll{position:absolute;right:var(--gutter);bottom:clamp(2.6rem,7vh,5rem);z-index:1;display:flex;align-items:center;gap:.7em;font-size:.68rem;font-weight:660;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.phero__scroll i{width:1px;height:44px;background:var(--line);position:relative;overflow:hidden}
.phero__scroll i::after{content:"";position:absolute;left:0;top:-50%;width:100%;height:50%;background:var(--accent);animation:drip 1.8s var(--ease-soft) infinite}
@keyframes drip{to{top:110%}}

/* generic content section */
.sect{padding-top:clamp(4rem,11vh,8.5rem);padding-bottom:clamp(4rem,11vh,8.5rem);position:relative}
.sect--tight{padding-top:clamp(2.4rem,6vh,4.5rem);padding-bottom:clamp(2.4rem,6vh,4.5rem)}
.sect--line{border-top:1px solid var(--line)}
.sect__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.2rem,6vw,7rem);align-items:start}
.sect__aside{position:sticky;top:calc(var(--hdr-h) + 2.2rem)}
.sect__h{font-weight:760;font-stretch:108%;letter-spacing:-.02em;line-height:1.04;font-size:clamp(1.9rem,3.8vw,3.6rem);max-width:16ch;text-wrap:balance}
.sect__h .serif-i{font-weight:330}
.sect__body>p{max-width:62ch;color:var(--muted);font-size:clamp(1rem,1.35vw,1.18rem);margin-bottom:1.2em}
.sect__body>p strong{color:var(--fg);font-weight:680}
.sect__body>p em.serif-i{color:var(--fg)}
.lead{font-size:clamp(1.25rem,2.2vw,1.9rem);line-height:1.4;font-weight:540;letter-spacing:-.012em;color:var(--fg)!important;max-width:38ch!important}

/* poetic stacked lines */
.flow{display:grid;gap:.35em;margin:1.6em 0 2em;padding-left:1.4em;border-left:2px solid var(--accent)}
.flow li{font-family:var(--serif);font-style:italic;font-weight:330;font-size:clamp(1.15rem,1.9vw,1.6rem);line-height:1.35;color:var(--fg)}
.flow li b{font-weight:640}

/* numbered / bulleted rows */
.rows{border-top:1px solid var(--line);margin-top:1.4em}
.rows li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1rem,2.6vw,2.4rem);align-items:baseline;padding:clamp(1rem,2.4vh,1.6rem) 0;border-bottom:1px solid var(--line)}
.rows em{font-family:var(--serif);font-style:italic;font-weight:300;color:var(--accent);font-size:.95rem;min-width:2ch}
.rows h4{font-weight:720;font-size:clamp(1.05rem,1.6vw,1.35rem);letter-spacing:-.01em}
.rows p{color:var(--muted);font-size:.98rem;max-width:58ch;margin-top:.25em}

/* full-bleed media band w/ parallax img */
.band{position:relative;height:clamp(320px,68vh,720px);overflow:clip}
.band img{width:100%;height:126%;object-fit:cover;will-change:transform}
.band__cap{position:absolute;left:var(--gutter);bottom:1.4rem;z-index:1;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(236,234,225,.85);background:rgba(21,23,15,.55);padding:.55em 1em;backdrop-filter:blur(6px)}

/* stats strip */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,3vw,3rem);margin-top:clamp(2rem,5vh,3.4rem)}
.stats li{border-top:1px solid var(--line);padding-top:1rem}
.stats b{display:block;font-weight:800;font-stretch:112%;font-size:clamp(2.2rem,5vw,4.4rem);letter-spacing:-.03em;line-height:1;color:var(--fg)}
.stats b i{font-style:normal;color:var(--accent)}
.stats span{display:block;margin-top:.4em;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* fame / talents grid */
.fame-head{display:flex;align-items:baseline;gap:1.2rem;margin:clamp(2.6rem,7vh,4.6rem) 0 clamp(1.2rem,3vh,2rem)}
.fame-head em{font-family:var(--serif);font-style:italic;font-weight:300;color:var(--accent);font-size:1rem}
.fame-head h3{font-weight:780;font-stretch:110%;text-transform:uppercase;letter-spacing:-.015em;font-size:clamp(1.5rem,3.4vw,2.8rem)}
.fame-head i{flex:1;height:1px;background:var(--line)}
.fame{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,42vw),1fr));gap:clamp(14px,2.2vw,28px)}
.fame .polaroid{margin:0}
.fame .polaroid img{aspect-ratio:4/5;object-fit:cover;object-position:center top}

/* end CTA band */
.endcta{text-align:center;padding-top:clamp(5rem,15vh,10rem);padding-bottom:clamp(5rem,15vh,10rem);position:relative;overflow:clip}
.endcta__k{margin-bottom:1.2rem;justify-content:center;display:inline-flex}
.endcta__h{font-weight:800;font-stretch:112%;text-transform:uppercase;letter-spacing:-.03em;line-height:.96;font-size:clamp(2.4rem,7.4vw,6.6rem);margin-bottom:clamp(1.6rem,4vh,2.6rem)}
.endcta__h .serif-i{text-transform:none;font-weight:320}
.endcta__sub{color:var(--muted);max-width:52ch;margin:0 auto clamp(1.8rem,4.5vh,2.8rem);font-size:clamp(1rem,1.4vw,1.2rem)}
.endcta__row{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* mini next-page footer nav */
.nextp{display:flex;justify-content:space-between;align-items:center;gap:2rem;border-top:1px solid var(--line);padding-top:clamp(1.6rem,4vh,2.6rem);padding-bottom:clamp(1.6rem,4vh,2.6rem)}
.nextp span{font-size:.72rem;font-weight:660;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.nextp a{font-weight:780;font-stretch:110%;text-transform:uppercase;letter-spacing:-.015em;font-size:clamp(1.3rem,3.2vw,2.4rem);transition:color .3s}
.nextp a:hover{color:var(--accent)}
.nextp a i{font-style:normal;color:var(--accent)}

/* menu with page links (11 items) */
.menu__list--pages a{font-size:clamp(1.15rem,4.2vh,2.5rem);line-height:1.22}

/* responsive */
@media (max-width:900px){
  .sect__grid{grid-template-columns:minmax(0,1fr)}
  .sect__aside{position:static;margin-bottom:.4rem}
  .stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
  .phero{min-height:66svh}
  .phero__scroll{display:none}
  .fame .polaroid{width:auto!important}
  .fame .polaroid figcaption{font-size:.55rem;letter-spacing:.12em}
}
@media (min-width:901px){.foot__grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}

/* ============================================================
   RTL LAYER — Hebrew pages (html[dir=rtl])
   English display headlines stay LTR; Hebrew body flows RTL
   ============================================================ */
[dir=rtl] body{font-family:var(--sans)}
[dir=rtl] .hero__line,[dir=rtl] .phero__title,[dir=rtl] .endcta__h,[dir=rtl] .manifesto__text,
[dir=rtl] .wall__word,[dir=rtl] .mq__inner,[dir=rtl] .stats b,[dir=rtl] .fame-head h3,
[dir=rtl] .sect__h,[dir=rtl] .sol__cardtitle,[dir=rtl] .flow,[dir=rtl] .founder__h,
[dir=rtl] .nextp a,[dir=rtl] .brandline,[dir=rtl] .wall__fly,[dir=rtl] .menu__fly,[dir=rtl] .foot__fly{direction:ltr}
[dir=rtl] .phero__title,[dir=rtl] .sect__h,[dir=rtl] .endcta__h,[dir=rtl] .fame-head h3{text-align:right}
[dir=rtl] .phero--media .phero__title,[dir=rtl] .phero__title{text-align:right}
[dir=rtl] .eyebrow,[dir=rtl] .crumbs,[dir=rtl] .band__cap,[dir=rtl] .stats span,
[dir=rtl] .hud__label,[dir=rtl] .polaroid figcaption,[dir=rtl] .foot__tag,[dir=rtl] .menu__label,
[dir=rtl] .nextp span,[dir=rtl] .btn{letter-spacing:.05em}
[dir=rtl] .flow{border-left:0;border-right:2px solid var(--accent);padding-left:0;padding-right:clamp(1.2rem,3vw,2.4rem)}
[dir=rtl] .band__cap{left:auto;right:var(--gutter)}
[dir=rtl] .phero__scroll{right:auto;left:var(--gutter)}
[dir=rtl] .method__track{direction:ltr}
[dir=rtl] .step{direction:rtl;text-align:right}
[dir=rtl] .step--intro{direction:ltr}
[dir=rtl] .rows li{text-align:right}
[dir=rtl] .menu__list--pages a{letter-spacing:0}
[dir=rtl] .hud{direction:rtl}
@media (min-width:901px){
  [dir=rtl] .hero__hud{right:auto;left:clamp(16px,3vw,44px)}
}
[dir=rtl] .linkline i,[dir=rtl] .nextp a i{transform:scaleX(-1);display:inline-block}
[dir=rtl] .linkline:hover i{transform:scaleX(-1) translate(-3px,2px)}
[dir=rtl] .ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}

/* ---------- mobile founder photo deck ---------- */
@media (max-width:820px){
  .founder__media.deck{padding:0 0 54px}
  .deck .polaroid{
    position:absolute!important;left:50%!important;right:auto!important;top:0!important;bottom:auto!important;
    width:min(330px,84vw)!important;margin:0!important;
    touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;
  }
  /* uniform 4/3 cards: the founder shot is a wide two-person frame — a
     square-ish crop can never hold both faces (they span 58% of its width).
     Portrait cards top-anchor so heads survive; the founder card left-anchors
     to keep Tamir in frame */
  .deck .polaroid img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 10%;-webkit-user-drag:none}
  .deck .polaroid.founder__main img{object-position:10% 50%}
  .deck .founder__mini img{box-shadow:0 26px 60px -26px rgba(15,17,9,.6)}
  .deck .polaroid figcaption{opacity:0;transition:opacity .35s}
  .deck .polaroid.is-front figcaption{opacity:1}
  .deck__dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:8px}
  .deck__dots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:background .3s,transform .3s}
  .deck__dots i.on{background:var(--accent);transform:scale(1.3)}
}
@media (min-width:821px){.deck__dots{display:none}}

/* ---------- solutions zigzag ---------- */
.sect--flip .sect__grid{direction:rtl}
.sect--flip .sect__grid>*{direction:ltr}
[dir="rtl"] .sect--flip .sect__grid{direction:ltr}
[dir="rtl"] .sect--flip .sect__grid>*{direction:rtl}

/* solution hero videos */
.phero__media video{width:100%;height:100%;object-fit:cover;filter:saturate(.9)}

/* ---------- solutions index: hover video preview / mobile snap strip ---------- */
.solx{position:relative}
.solx__list{display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-template-rows:repeat(var(--rows,10),auto);column-gap:5vw}
.solx__row{
  position:relative;display:flex;align-items:baseline;gap:1em;
  padding:1.02em 4px;border-bottom:1px solid var(--line);
}
.solx__row::after{
  content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;
  background:var(--accent);transition:width .55s var(--ease);
}
.solx__row:hover::after{width:100%}
.solx__row em{font-family:var(--serif);font-style:italic;font-weight:300;color:var(--accent);font-size:.85rem;min-width:2.2ch}
.solx__row h3{
  font-size:clamp(1rem,1.45vw,1.4rem);font-weight:780;font-stretch:112%;
  text-transform:uppercase;letter-spacing:.02em;
  transition:transform .35s var(--ease-soft),color .35s;
}
.solx__row:hover h3{transform:translateX(8px);color:var(--fg)}
[dir="rtl"] .solx__row:hover h3{transform:translateX(-8px)}
.solx__tag{margin-inline-start:auto;font-size:.66rem;color:var(--muted);letter-spacing:.03em;max-width:22ch;text-align:end}
.solx__arrow{font-style:normal;color:var(--muted);transition:transform .35s var(--ease-soft),color .35s}
.solx__row:hover .solx__arrow{color:var(--accent);transform:translateX(4px)}
[dir="rtl"] .solx__row:hover .solx__arrow{transform:translateX(-4px)}
.solx__preview{
  position:fixed;left:0;top:0;z-index:80;width:min(400px,27vw);aspect-ratio:16/9;
  pointer-events:none;opacity:0;transform:scale(.92);overflow:hidden;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.75);
  transition:opacity .28s var(--ease-soft),transform .28s var(--ease-soft);
  will-change:transform;
}
.solx__preview.on{opacity:1;transform:scale(1)}
.solx__preview video{width:100%;height:100%;object-fit:cover;filter:saturate(.9)}
@media (max-width:820px){
  .solx__list{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;
    padding:4px var(--gutter) 20px;margin:0 calc(var(--gutter)*-1);
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .solx__list::-webkit-scrollbar{display:none}
  .solx.gutter{padding-left:0;padding-right:0}
  .solx__row{
    flex:0 0 70vw;scroll-snap-align:center;
    flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:.4em;
    aspect-ratio:4/4.7;padding:18px;border:1px solid var(--line);border-bottom:1px solid var(--line);
    background:linear-gradient(185deg,rgba(10,12,6,.05) 30%,rgba(10,12,6,.82) 82%),var(--bg) center/cover no-repeat;
  }
  .solx__row::after{display:none}
  .solx__row h3{font-size:1.15rem;color:var(--bone)}
  .solx__row em{font-size:.9rem}
  .solx__tag{margin-inline-start:0;text-align:start;color:rgba(242,239,231,.72)}
  .solx__arrow{display:none}
  .solx__preview{display:none}
}

/* mobile menu overflow fix: never clip items above the viewport */
@media (max-width:820px){
  .menu__inner{
    justify-content:flex-start;
    gap:4vh;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding-top:calc(var(--hdr-h) + 1.5vh);
    padding-bottom:max(5vh, env(safe-area-inset-bottom));
  }
  .menu__list a{font-size:clamp(1.05rem,3vh,1.55rem);line-height:1.3}
  .menu__list a em{font-size:.45em}
  .menu__tag{font-size:1.15rem}
  .menu__aside{gap:1.1em;padding-bottom:0}
}

/* mobile: compact the on/off faces, the portrait was eating a full screen of scroll */
@media (max-width:820px){
  .onoff{padding:10vh 0 8vh}
  .onoff__kicker{margin-bottom:6vh}
  .onoff__faces{gap:22px}
  .onoff__face{width:min(320px,72vw)!important}
  .onoff__face img{aspect-ratio:4/4.2}
  .onoff__face--r img{aspect-ratio:4/4.6;object-position:50% 18%}
}

/* solutions zigzag: image + title are links; solution hero eyebrow = breadcrumbs */
.sect__hlink,.sect__medialink{display:block;color:inherit}
.phero__eyebrow a{color:inherit;transition:color .3s}
.phero__eyebrow a:hover{color:var(--accent)}

/* ============================================================
   WP THEME OVERRIDES (2026-07-05) — post-launch design tweaks.
   Appended after the static baseline; edit here, not above.
   ============================================================ */

/* --- generic small trademark mark --- */
.tm{font-size:.42em;vertical-align:super;letter-spacing:.02em;font-style:normal;font-weight:600}

/* --- hero ticker strip (marquee under the hero) --- */
.hero-ticker{
  position:relative;z-index:2;overflow:clip;white-space:nowrap;
  pointer-events:none;user-select:none;
  background:var(--deep);
  border-top:1px solid rgba(236,234,225,.12);
  border-bottom:1px solid rgba(236,234,225,.12);
  padding:.9em 0;
}
.hero-ticker .mq__inner{display:inline-flex}
.hero-ticker span{font-size:.82rem;font-weight:660;letter-spacing:.28em;text-transform:uppercase;color:var(--bone)}
.hero-ticker span b{font-weight:790;color:var(--volt)}
.hero-ticker span i{font-style:normal;color:var(--volt);margin:0 1.15em}

/* --- header: bigger logo + tagline next to it --- */
.hdr__logo{width:86px}
.hdr__tagline{
  font-size:.72rem;font-weight:680;letter-spacing:.3em;text-transform:uppercase;
  color:var(--fg);opacity:.85;white-space:nowrap;
}
/* mobile: keep the "It's Time To Fly™" slogan visible (CTA is hidden here, so there's
   room next to the logo) — just size it down so it fits beside the burger on small phones */
@media (max-width:760px){.hdr__tagline{font-size:.58rem;letter-spacing:.14em}}
@media (max-width:360px){.hdr__tagline{font-size:.52rem;letter-spacing:.1em}}

/* --- diary foot quote: larger --- */
.diary__foot{font-size:1.3rem}

/* --- "+28%" bump for the site's smallest text styles --- */
.eyebrow{font-size:.92rem}
.linkline{font-size:1rem}
.menu__mail{font-size:1.09rem}
.menu__fly{font-size:.87rem}
.hud__label{font-size:.79rem}
.hud__rows li{font-size:1rem}
.hud__rows em{font-size:1.09rem}
.hero__scroll{font-size:.82rem}
.phero__scroll{font-size:.87rem}
.proof__cap{font-size:.87rem}
.polaroid figcaption{font-size:.77rem}
.diary__cite-role{font-size:.79rem}
.onoff__face figcaption{font-size:.79rem}
.onoff__col p{font-size:1.28em;max-width:36ch}
.principles p{font-size:1.13rem;max-width:32ch}
.angle{font-size:.77rem}
.anno__label{font-size:.77rem}
.chip{font-size:.87rem}
.step__meta{font-size:.77rem}
.solx__tag{font-size:.84rem}
.wall__note{font-size:1.02rem}
.foot__tag{font-size:1.13rem;max-width:38ch}
.foot__col h4{font-size:.79rem}
.foot__legal{font-size:.92rem}
.crumbs{font-size:.92rem}
.band__cap{font-size:.96rem}
@media (max-width:900px){.anno__label{font-size:.64rem}}

/* --- method heading: keep "Dynamic Motion Control™" on one line --- */
.method__head h2 .serif-i{white-space:nowrap}
@media (max-width:640px){.method__head h2 .serif-i{white-space:normal}}

/* --- solutions heading: “you” sized to match the sans words --- */
.sol__head h2 .serif-i{font-size:1.18em}

/* --- wall finale: fonts swapped between the two lines --- */
.wall__fly-a{
  font-family:var(--sans);font-style:normal;font-weight:840;font-stretch:120%;
  text-transform:uppercase;
}
.wall__fly-b{
  font-family:var(--serif);font-style:italic;font-weight:300;font-stretch:100%;
  text-transform:none;
}

/* --- manifesto foot: larger (2026-07-05) --- */
.manifesto__foot{font-size:1.3rem;max-width:56ch}

/* --- solutions hub: orbital explorer + jump menu (2026-07-05) --- */
@property --oa{syntax:'<angle>';inherits:false;initial-value:0deg}
.solhub-orbit{position:relative;padding:clamp(3rem,9vh,6.5rem) 0 clamp(2.4rem,6vh,4.5rem);display:flex;flex-direction:column;align-items:center;gap:2.4rem;overflow:clip}
.orbit{--rA:clamp(96px,15vw,150px);--rB:clamp(160px,25vw,250px);--chip:clamp(44px,6.6vw,62px);position:relative;width:calc(var(--rB)*2 + var(--chip) + 18px);aspect-ratio:1;flex:none}
.orbit::before,.orbit::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid rgba(236,234,225,.11);border-radius:50%;pointer-events:none}
.orbit::before{width:calc(var(--rA)*2);height:calc(var(--rA)*2)}
.orbit::after{width:calc(var(--rB)*2);height:calc(var(--rB)*2)}
.orbit__chip{position:absolute;left:50%;top:50%;width:var(--chip);aspect-ratio:1;border-radius:50%;z-index:1;
  transform:translate(-50%,-50%) rotate(var(--oa)) translateY(calc(var(--r)*-1)) rotate(calc(var(--oa)*-1));
  animation:tk-orbit var(--dur,90s) linear infinite}
.orbit__chip--a{--r:var(--rA);--dur:70s}
.orbit__chip--b{--r:var(--rB);--dur:115s;animation-direction:reverse}
@keyframes tk-orbit{from{--oa:var(--a0,0deg)}to{--oa:calc(var(--a0,0deg) + 360deg)}}
.orbit:hover .orbit__chip,.orbit:focus-within .orbit__chip{animation-play-state:paused}
.orbit__chip img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:1px solid rgba(236,234,225,.28);filter:saturate(.8) contrast(1.02);box-shadow:0 10px 26px rgba(0,0,0,.45);transition:transform .35s var(--ease-soft),filter .35s,border-color .35s}
.orbit__chip:hover img,.orbit__chip:focus-visible img{transform:scale(1.16);filter:saturate(1.05);border-color:var(--volt)}
.orbit__tip{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%) translateY(4px);white-space:nowrap;font-size:.68rem;font-weight:680;letter-spacing:.18em;text-transform:uppercase;color:var(--bone);background:rgba(13,15,8,.94);border:1px solid rgba(236,234,225,.16);padding:.5em .95em;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:6}
.orbit__chip:hover .orbit__tip,.orbit__chip:focus-visible .orbit__tip{opacity:1;transform:translateX(-50%) translateY(0)}
.orbit__core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(96px,13vw,130px);aspect-ratio:1;border-radius:50%;z-index:2;cursor:pointer;border:1px solid rgba(217,255,63,.4);background:radial-gradient(circle at 34% 30%,rgba(236,234,225,.1),rgba(13,15,8,.94) 62%);box-shadow:0 24px 60px rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;transition:transform .35s var(--ease-soft),border-color .35s,box-shadow .35s}
.orbit__core:hover,.orbit__core:focus-visible{transform:translate(-50%,-50%) scale(1.06);border-color:var(--volt);box-shadow:0 24px 70px rgba(0,0,0,.6),0 0 44px rgba(217,255,63,.26)}
.orbit__mark{width:56%;aspect-ratio:527/280;color:var(--volt)}
.orbit__core::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px solid rgba(217,255,63,.35);animation:tk-pulse 2.6s var(--ease-soft) infinite}
@keyframes tk-pulse{0%{transform:scale(.86);opacity:0}30%{opacity:1}100%{transform:scale(1.24);opacity:0}}
.orbit__hint{font-size:.87rem;font-weight:660;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);text-align:center;padding:0 1rem}

.solnav{position:fixed;inset:0;z-index:120;visibility:hidden;pointer-events:none}
.solnav.is-open{visibility:visible;pointer-events:auto}
.solnav__bg{position:absolute;inset:0;background:rgba(8,9,5,.74);backdrop-filter:blur(14px);opacity:0;transition:opacity .35s}
.solnav.is-open .solnav__bg{opacity:1}
.solnav__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) translateY(18px);width:min(880px,92vw);max-height:86vh;max-height:86svh;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:linear-gradient(180deg,rgba(21,23,15,.98),rgba(13,15,8,.98));border:1px solid rgba(236,234,225,.14);padding:clamp(1.6rem,4vw,2.8rem);opacity:0;transition:opacity .35s,transform .45s var(--ease-soft)}
.solnav.is-open .solnav__panel{opacity:1;transform:translate(-50%,-50%)}
.solnav__head{display:flex;align-items:center;gap:1.4em;margin-bottom:1.6rem}
.solnav__head h3{font-weight:760;font-stretch:110%;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(1.3rem,2.6vw,2rem)}
.solnav__close{margin-left:auto;flex:none;width:44px;height:44px;border-radius:50%;border:1px solid rgba(236,234,225,.25);color:var(--bone);background:transparent;cursor:pointer;font-size:1rem;transition:border-color .3s,color .3s,transform .3s}
.solnav__close:hover{border-color:var(--volt);color:var(--volt);transform:rotate(90deg)}
.solnav__list{list-style:none;display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-template-rows:repeat(var(--rows,10),auto);gap:.15rem 2.4rem;padding:0;margin:0}
@media (max-width:640px){.solnav__list{grid-template-columns:1fr;grid-auto-flow:row;grid-template-rows:none}}
/* phone: the big "Jump to your game" heading wraps to 4 lines and crowds the panel — hide it, keep the SOLUTIONS eyebrow + close */
@media (max-width:640px){.solnav__head h3{display:none}}
.solnav__list a{display:flex;align-items:center;gap:1em;padding:.55em .4em;border-bottom:1px solid rgba(236,234,225,.08);color:var(--bone);transition:color .25s}
.solnav__list em{font-family:var(--serif);font-style:italic;font-weight:300;color:var(--accent);font-size:.95rem;min-width:2.2ch}
.solnav__list span{font-weight:640;letter-spacing:.04em;font-size:.98rem;text-transform:uppercase}
.solnav__list img{width:40px;height:40px;border-radius:50%;object-fit:cover;margin-left:auto;flex:none;filter:saturate(.8);border:1px solid rgba(236,234,225,.18);transition:transform .3s,filter .3s,border-color .3s}
.solnav__list a:hover{color:var(--volt)}
.solnav__list a:hover img{transform:scale(1.12);filter:saturate(1.05);border-color:var(--volt)}
html.solnav-lock,html.solnav-lock body{overflow:hidden!important}

.solfab{position:fixed;right:clamp(14px,2.6vw,30px);bottom:clamp(14px,3vh,30px);z-index:110;width:62px;height:62px;border-radius:50%;border:1px solid rgba(217,255,63,.45);background:radial-gradient(circle at 34% 30%,rgba(236,234,225,.1),rgba(13,15,8,.96) 62%);box-shadow:0 16px 40px rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .35s,transform .35s var(--ease-soft),border-color .3s}
.solfab.is-show{opacity:1;transform:none;pointer-events:auto}
.solfab:hover{border-color:var(--volt)}
.solfab__mark{width:52%;aspect-ratio:527/280;color:var(--volt)}
.solhub-sect{scroll-margin-top:70px}
@media (prefers-reduced-motion:reduce){
  .orbit__chip{animation:none}
  .orbit__core::after{animation:none}
}

/* --- hub hero: orbit beside the title on desktop (2026-07-05) --- */
.solhub-orbit--hero{padding:clamp(2.4rem,6vh,4rem) 0 0;gap:1.7rem}
.solhub-orbit--hero .orbit{--rA:clamp(84px,9.5vw,124px);--rB:clamp(142px,16vw,212px);--chip:clamp(40px,4.4vw,54px)}
.solhub-orbit--hero .orbit__core{width:clamp(84px,9vw,112px)}
.solhub-orbit--hero .orbit__hint{font-size:.74rem;letter-spacing:.22em}
@media (max-width:999px){
  .solhub-orbit--hero{margin-inline:auto}
}
@media (min-width:1000px){
  .phero--hub__grid{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:clamp(1.5rem,4vw,4rem)}
  .solhub-orbit--hero{padding:0;margin-bottom:clamp(.4rem,3vh,2rem)}
}

/* --- desktop: ticker visible inside the first viewport (2026-07-05) --- */
@media (min-width:1000px){
  /* hero + solutions strip share the first viewport; strip is 3 rows here, 2 rows ≥1200 */
  .hero{min-height:calc(100svh - 112px)}
  /* solutions hero: keep the orbit hint clear of the SCROLL indicator */
  .solhub-orbit--hero{margin-bottom:clamp(2.8rem,5vh,3.8rem)}
}

/* --- hero film button + full-film lightbox (2026-07-05) --- */
.hero__film{position:absolute;right:clamp(16px,3vw,44px);bottom:clamp(26px,4.5vh,42px);z-index:3;display:flex;align-items:center;gap:1em;background:transparent;border:0;cursor:pointer;color:var(--bone)}
.hero__film-disc{position:relative;width:clamp(56px,6vw,72px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(217,255,63,.5);background:rgba(13,15,8,.42);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;color:var(--volt);transition:transform .35s var(--ease-soft),border-color .3s,background .3s;flex:none}
.hero__film-disc svg{width:34%;margin-left:6%}
.hero__film-disc::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(217,255,63,.35);animation:tk-pulse 2.6s var(--ease-soft) infinite}
.hero__film:hover .hero__film-disc,.hero__film:focus-visible .hero__film-disc{transform:scale(1.08);border-color:var(--volt);background:rgba(13,15,8,.6)}
.hero__film-label{font-size:.8rem;font-weight:680;letter-spacing:.28em;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.5)}

.filmbox{position:fixed;inset:0;z-index:130;visibility:hidden;pointer-events:none}
.filmbox.is-open{visibility:visible;pointer-events:auto}
.filmbox__bg{position:absolute;inset:0;background:rgba(5,6,3,.86);backdrop-filter:blur(10px);opacity:0;transition:opacity .35s}
.filmbox.is-open .filmbox__bg{opacity:1}
.filmbox__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.97);width:min(1100px,94vw);opacity:0;transition:opacity .35s,transform .45s var(--ease-soft)}
.filmbox.is-open .filmbox__panel{opacity:1;transform:translate(-50%,-50%) scale(1)}
.filmbox__panel video{width:100%;aspect-ratio:16/9;display:block;background:#000;border:1px solid rgba(236,234,225,.16);box-shadow:0 40px 120px rgba(0,0,0,.65)}
.filmbox__close{position:absolute;right:0;top:-56px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(236,234,225,.3);color:var(--bone);background:rgba(13,15,8,.5);cursor:pointer;font-size:1rem;transition:border-color .3s,color .3s,transform .3s}
.filmbox__close:hover{border-color:var(--volt);color:var(--volt);transform:rotate(90deg)}
html.filmbox-lock,html.filmbox-lock body{overflow:hidden!important}

/* --- align "Watch the film" with the hero CTA row (2026-07-05) ---
   CTA row bottom sits clamp(88px,15vh,150px) above the hero bottom
   (.hero__content padding). Match centers: + half CTA height (~25px)
   − half disc height. */
.hero__film{bottom:calc(clamp(88px,15vh,150px) + 25px - clamp(56px,6vw,72px)/2)}

/* --- mobile solutions deck: video cards (2026-07-05) --- */
.solx__vid{display:none}
@media (max-width:820px){
  .solx__row{overflow:clip}
  .solx__vid{
    display:block;position:absolute;inset:0;z-index:0;
    width:100%;height:100%;object-fit:cover;
    pointer-events:none;filter:saturate(.9);
  }
  /* legibility gradient above the video (the desktop hover-underline ::after
     is display:none here, so it is free to reuse) */
  .solx__row::after{
    content:"";display:block;position:absolute;inset:0;z-index:1;
    height:auto;width:auto;background:linear-gradient(185deg,rgba(10,12,6,.05) 30%,rgba(10,12,6,.82) 82%);
    pointer-events:none;transition:none;
  }
  .solx__row>em,.solx__row>h3,.solx__row>.solx__tag{position:relative;z-index:2}
}

/* --- per-card caption position on mobile deck + contact box (2026-07-05) --- */
@media (max-width:820px){
  .solx__row--captop{justify-content:flex-start}
  .solx__row--captop::after{background:linear-gradient(5deg,rgba(10,12,6,.05) 30%,rgba(10,12,6,.82) 82%)}
}
.cbox{
  border:1px solid var(--line);background:var(--card);
  padding:clamp(1.6rem,3.5vw,2.6rem);
  display:flex;flex-direction:column;gap:1.4rem;max-width:560px;
}
.cbox__text{color:var(--muted);max-width:44ch}
.cbox__mail{
  font-weight:680;letter-spacing:.06em;font-size:1.15rem;color:var(--fg);
  width:fit-content;border-bottom:1px solid var(--line);padding-bottom:.35em;
  transition:color .3s,border-color .3s;
}
.cbox__mail:hover{color:var(--volt);border-color:var(--volt)}
.cbox__mail i{font-style:normal}
.cbox__row{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.cbox__icons{display:flex;gap:.8rem}
.cbox__icon{
  width:52px;height:52px;border-radius:50%;
  border:1px solid var(--line);color:var(--fg);
  display:flex;align-items:center;justify-content:center;
  transition:color .3s,border-color .3s,transform .3s;
}
.cbox__icon svg{width:46%;height:46%}
.cbox__icon:hover{color:var(--volt);border-color:var(--volt);transform:translateY(-3px)}

/* --- remarks-doc round (2026-07-06): bigger headings/copy, 4-up diary,
       mobile refinements --- */
h2{font-size:clamp(2.3rem,5.6vw,4.7rem)}
.sect__h{font-size:clamp(2.1rem,4.2vw,4rem)}
.method__lede{font-size:1.15rem}
.step p{font-size:1.05rem}
.founder__copy>p{font-size:1.12rem}

.diary__grid--quad{justify-content:center;gap:2.4vw}
.diary__grid--quad .diary__ph{margin-top:0;width:min(255px,20vw)}
.diary__grid--quad .diary__ph:nth-child(2){margin-top:7vh}
.diary__grid--quad .diary__ph:nth-child(4){margin-top:5vh}

.solfab__toc{display:none}
@media (max-width:820px){
  .diary__grid--quad{gap:20px}
  .diary__grid--quad .diary__ph{width:min(300px,42vw)}
  /* hero film button: icon only on mobile */
  .hero__film-label{display:none}
  /* solutions hub: skip the orbit, keep a persistent pill launcher (TK + list) */
  .solhub-orbit--hero{display:none}
  .solfab{opacity:1;transform:none;pointer-events:auto;width:auto;height:56px;border-radius:999px;padding:0 16px;gap:10px}
  .solfab__mark{width:40px}
  .solfab__toc{display:flex;align-items:center;justify-content:center;width:22px;height:22px;color:var(--bone)}
}

/* mobile fab pill: explicit geometry (no overflow past viewport) */
@media (max-width:820px){
  .solfab{right:14px;bottom:16px;width:auto;min-width:0;max-width:calc(100vw - 28px);height:56px;display:inline-flex;align-items:center;justify-content:center}
}

/* --- founder minis: no bone ring, larger (2026-07-06) --- */
.founder__mini{width:240px}
.founder__mini--2{width:220px}
.founder__mini img{box-shadow:0 30px 60px -24px rgba(15,17,9,.6)}
@media (max-width:900px){.founder__mini{width:185px}.founder__mini--2{width:170px}}

/* --- fame grids: captions must never overflow their column (2026-07-06) --- */
.fame .polaroid{min-width:0}
.fame .polaroid figcaption{
  font-size:.66rem;letter-spacing:.14em;line-height:1.6;
  flex-wrap:wrap;overflow-wrap:anywhere;
}

/* --- founder media: room for the enlarged minis (2026-07-06) --- */
.founder__media{min-height:640px}
.founder__mini--1{right:2%;top:-4%}
.founder__mini--2{right:-2%;bottom:-6%}
@media (max-width:900px){.founder__media{min-height:0}}

/* --- orbit chips: sport pictograms instead of photo crops (2026-07-06) --- */
.orbit__ico{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;border-radius:50%;
  background:radial-gradient(circle at 36% 32%,rgba(236,234,225,.09),rgba(13,15,8,.92) 64%);
  border:1px solid rgba(236,234,225,.28);color:var(--bone);
  box-shadow:0 10px 26px rgba(0,0,0,.45);
  transition:transform .35s var(--ease-soft),color .35s,border-color .35s,background .35s;
}
.orbit__ico svg{width:52%;height:52%}
.orbit__chip:hover .orbit__ico,.orbit__chip:focus-visible .orbit__ico{
  transform:scale(1.16);color:var(--volt);border-color:var(--volt);
}

/* --- proof marquee: team logos ride the line (2026-07-06) --- */
.mq--a .mq__logo{height:.82em;width:auto;display:inline-block;vertical-align:middle;margin:0 .12em;filter:drop-shadow(0 4px 14px rgba(0,0,0,.35))}

/* --- hero video framing: the hero is ~54px shorter than a 16:9 screen (the
   ticker strip), so cover-fit overflows and must crop somewhere. Anchoring to
   the bottom dumped the whole overflow on TOP and clipped figures' heads.
   Bias slightly toward the top so heads stay safe while the lower-third baked
   subtitles still clear the crop. */
.hero__vid{object-position:center 38%}

/* --- footer: contact icons instead of words (2026-07-06) --- */
.foot__social{display:flex;gap:.7rem;margin:.15em 0 .3em}
.foot__icon{
  width:42px;height:42px;border-radius:50%;flex:none;
  border:1px solid rgba(236,234,225,.25);color:rgba(236,234,225,.85);
  display:flex;align-items:center;justify-content:center;
  transition:color .3s,border-color .3s,transform .3s;
}
.foot__icon svg{width:46%;height:46%}
.foot__icon:hover{color:var(--volt);border-color:var(--volt);transform:translateY(-2px)}

/* --- solutions launcher: TK + TOC pill on all viewports (2026-07-06) --- */
.solfab{width:auto;height:60px;border-radius:999px;padding:0 18px;gap:11px}
.solfab__mark{width:40px}
.solfab__toc{display:flex;align-items:center;justify-content:center;width:21px;height:21px;color:var(--bone);transition:color .3s}
.solfab:hover .solfab__toc{color:var(--volt)}

/* --- footer icons: win over .foot__col a{width:fit-content}, larger (2026-07-06) --- */
.foot__col a.foot__icon{
  width:48px;height:48px;flex:none;border-bottom:0;
  display:flex;align-items:center;justify-content:center;
}
.foot__icon svg{width:50%;height:50%}

/* --- overlay menu: dark blurred glass instead of a solid slab (2026-07-06) --- */
.menu__bg{
  background:rgba(13,15,8,.8);
  -webkit-backdrop-filter:blur(16px) saturate(.9);
  backdrop-filter:blur(16px) saturate(.9);
}

/* glass backdrop must never carry a transform (iOS orders transformed
   backdrop-filter layers under composited content); it fades instead.
   isolate keeps the whole overlay one atomic layer above the page. */
.menu{isolation:isolate}
.menu__bg{transform:none;opacity:0;z-index:0}
.menu__inner{z-index:1}

/* --- solutions hub: sections play their card video in place of the photo --- */
.solhub-sect .polaroid .solhub-vid{
  display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  background:#0d0f08;
}

/* --- wall finale: single floating insole, pure CSS, TRANSPARENT (no video/box) ---
   just the transparent insole cutout hovering with a gentle 3D tilt and a volt
   light-sweep. One object only, so there is no shoe-orientation problem, and the
   background is genuinely transparent — the section + its volt glow show through. */
.wall__flyer{
  position:relative; z-index:1;
  width:min(440px,78vw);
  margin-top:-3vh;                 /* tighter gap under the "It's time to fly" slogan */
  perspective:1500px;
  will-change:transform;
}
.wall__flyer-3d{
  position:relative;
  transform-style:preserve-3d;
  animation:tkFlyerFloat 8.5s ease-in-out infinite;
  will-change:transform;
}
.wall__flyer-img{
  display:block; width:100%; height:auto;
  filter:drop-shadow(0 36px 46px rgba(0,0,0,.55)) drop-shadow(0 8px 30px rgba(217,255,63,.16));
}
/* volt light-sweep, clipped to the insole shape, mixing additively */
.wall__flyer-sheen{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(107deg, transparent 43%, rgba(217,255,63,.5) 49%, rgba(236,234,225,.32) 52%, transparent 59%);
  background-size:300% 100%; background-repeat:no-repeat;
  -webkit-mask:url(../img/insole-flyer.webp) center/contain no-repeat;
          mask:url(../img/insole-flyer.webp) center/contain no-repeat;
  mix-blend-mode:screen;
  animation:tkFlyerSheen 8.5s ease-in-out infinite;
}
@keyframes tkFlyerFloat{
  0%,100%{ transform:translateY(0)     rotateX(6deg) rotateY(-8deg) rotateZ(-.6deg); }
  50%    { transform:translateY(-3.6%) rotateX(3deg) rotateY(6deg)  rotateZ(.6deg); }
}
@keyframes tkFlyerSheen{
  0%,22%   { background-position:190% 0; }
  50%,100% { background-position:-90% 0; }
}
@media (max-width:760px){ .wall__flyer{ width:min(310px,74vw); margin-top:-2vh; } }
@media (prefers-reduced-motion:reduce){
  .wall__flyer-3d{ animation:none; transform:rotateX(5deg) rotateY(-6deg); }
  .wall__flyer-sheen{ animation:none; opacity:0; }
}

/* --- hero solutions strip: static TWO-ROW grid of all solutions (replaces the
   scrolling slogan ticker) — very clear icon + short label, all visible at once,
   no motion. Column count steps down on narrow screens so nothing scrolls.
   Row-major everywhere (client, 2026-07-10): on phones only the first row(s)
   peek above the fold, and the priority solutions (menu_order 1..6) must be
   the ones visible there — row order = list order. --- */
.hero-solx{
  position:relative;z-index:2;
  background:var(--deep);
  border-top:1px solid rgba(236,234,225,.12);
  border-bottom:1px solid rgba(236,234,225,.12);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.24rem;
  padding:.5rem clamp(8px,3vw,40px);
  align-content:center;
}
.hero-solx__item{
  display:flex;align-items:center;gap:.5em;min-width:0;
  padding:.32rem .55rem;border-radius:999px;
  color:var(--bone);text-decoration:none;border:1px solid transparent;
  transition:background .25s var(--ease-soft),border-color .25s,color .25s;
}
.hero-solx__item:hover,.hero-solx__item:focus-visible{
  background:rgba(236,234,225,.06);border-color:rgba(217,255,63,.45);color:var(--volt);outline:none;
}
.hero-solx__ico{flex:none;width:18px;height:18px;display:flex;color:var(--volt)}
.hero-solx__ico svg{width:100%;height:100%}
.hero-solx__label{
  font-size:.72rem;font-weight:650;letter-spacing:.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
/* Padel ("Padel-Pickleball") and Everyday ("Everyday Recovering") carry two-word
   labels — let them wrap to two lines on every breakpoint (scoped so no other label
   loses its nowrap). Higher specificity than the base + phone rules via the
   attribute selector, so it wins regardless of source order. */
.hero-solx__item[data-sol="padel"] .hero-solx__label,
.hero-solx__item[data-sol="everyday-movement"] .hero-solx__label{
  white-space:normal;line-height:1.05;
}
@media (min-width:560px){ .hero-solx{grid-template-columns:repeat(5,minmax(0,1fr))} }
@media (min-width:860px){ .hero-solx{grid-template-columns:repeat(7,minmax(0,1fr))} }
@media (min-width:1200px){
  .hero-solx{grid-template-columns:repeat(10,minmax(0,1fr))}   /* exactly two rows for 20 */
  .hero{min-height:calc(100svh - 82px)}
  /* Wide desktops are wider than the 16:9 video, so object-fit:cover must trim it
     vertically. Anchor to the top so the trim comes off the BOTTOM only — the top
     is never cropped, and the busy broadcast captions at the bottom get hidden. */
  .hero__vid{object-position:center top}
}
/* phones incl. Samsung "screen zoom" viewports (~480px): compact items, and
   labels may wrap at the soft hyphens tk_solution_short() embeds
   ("Basket-/ball") — comfortable font, no word is ever ellipsized, survives
   Android font scaling. MUST come after the base __item/__ico/__label rules —
   media queries add no specificity, so if this block sits earlier in the file
   the base rules silently win (that bug shipped 2026-07-10). */
@media (max-width:559px){
  /* column-major on phones (client 2026-07-11): each of the 4 columns is a
     themed group read top-to-bottom (team ball / racket / endurance / lifestyle)
     — menu_order 1-5 fill column 1, 6-10 column 2, etc. */
  .hero-solx{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:column;grid-template-rows:repeat(5,auto);gap:.18rem .1rem;padding:.5rem 6px}
  .hero-solx__item{padding:.28rem .2rem;gap:.34em}
  .hero-solx__ico{width:14px;height:14px}
  .hero-solx__label{font-size:.68rem;letter-spacing:0;font-stretch:94%;white-space:normal;line-height:1.08}
}
@media (prefers-reduced-motion:reduce){ .hero-solx__item{transition:none} }

/* --- proof "trusted" image: full landscape shot fills the landscape frame;
   slight top bias keeps Tamir's head safe if the frame goes wide on short screens --- */
.proof__media img{object-position:center 35%}

/* --- hero lead line above the CTAs: refined letter-spaced kicker, small
   enough to never cover the video's own text/faces (2026-07-07) --- */
.hero__lead{
  font-size:clamp(.95rem,1.5vw,1.3rem);
  font-weight:740;letter-spacing:.22em;line-height:1.5;
  text-transform:uppercase;color:var(--bone);
  margin:0 0 1.1em;max-width:none;
  text-shadow:0 2px 18px rgba(0,0,0,.55);
}
@media (max-width:760px){ .hero__lead{font-size:clamp(.8rem,3.4vw,1rem);letter-spacing:.18em} }

/* --- solutions hub: solutions-at-a-glance grid (icon + label), same style as
   the homepage strip but relaxed into a centered 5-column board on the page --- */
.hero-solx--hub{
  background:none;border:0;
  max-width:1120px;margin:clamp(1.4rem,4vh,3rem) auto 0;
  grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem 1rem;
}
.hero-solx--hub .hero-solx__ico{width:20px;height:20px}
.hero-solx--hub .hero-solx__label{font-size:.84rem;letter-spacing:.02em}
@media (max-width:900px){ .hero-solx--hub{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:600px){ .hero-solx--hub{grid-template-columns:repeat(3,minmax(0,1fr))} }

/* --- proof "trusted": square portrait with championship logos orbiting it
   (replaces the horizontal logo marquees; the ✦ stars are gone) --- */
.proof__media--sq{--sz:min(52vh,460px);width:var(--sz)!important;height:var(--sz)!important;overflow:visible;border-radius:8px}
.proof__media--sq>img{border-radius:8px}
.proof__ring{
  --r:calc(var(--sz)*0.86);
  position:absolute;inset:0;margin:auto;pointer-events:none;z-index:3;
  animation:proofSpin 48s linear infinite;
}
.proof__logo{
  position:absolute;top:50%;left:50%;
  width:clamp(42px,4.8vw,62px);height:clamp(42px,4.8vw,62px);
  display:grid;place-items:center;border-radius:50%;
  background:rgba(21,23,15,.82);border:1px solid rgba(236,234,225,.16);
  box-shadow:0 10px 26px rgba(0,0,0,.45);
  transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-1*var(--r))) rotate(calc(-1*var(--a)));
}
.proof__logo img{width:64%;height:64%;object-fit:contain;animation:proofSpin 48s linear infinite reverse}
@keyframes proofSpin{to{transform:rotate(360deg)}}
@media (max-width:760px){ .proof__media--sq{--sz:min(74vw,330px)} }
@media (prefers-reduced-motion:reduce){ .proof__ring,.proof__logo img{animation:none} }

/* --- solutions hub: hero shrinks so the homepage-style solutions strip lands at
   the bottom of the FIRST viewport (heights match the strip's rows per breakpoint).
   The title is ALSO capped by viewport HEIGHT (min(..,13vh)) and the top padding
   trimmed, so on short/wide windows the tall content can't push the 2nd strip row
   below the fold. --- */
@media (min-width:1000px){
  .phero--hub{min-height:calc(100svh - 112px);padding-top:calc(var(--hdr-h) + 3vh);padding-bottom:clamp(1.6rem,3.5vh,3rem)}
  .phero--hub .phero__title{font-size:min(clamp(2.7rem,9vw,8.2rem), 13vh)}
  .phero--hub .phero__sub{margin-top:clamp(.8rem,2vh,1.5rem)}
}
@media (min-width:1200px){ .phero--hub{min-height:calc(100svh - 82px)} }

/* --- homepage "Meet Tamir" founder: the main photo is LANDSCAPE, so the
   portrait-tuned overlapping minis collided with it + their captions. Flow the
   two minis in a tidy row BELOW the main instead of scattering over it. --- */
#tamir .founder__media{min-height:0}
#tamir .founder__mini{position:relative;display:inline-block;vertical-align:top;width:min(46%,232px);top:auto;right:auto;bottom:auto;left:auto;margin:2rem 0 0}
#tamir .founder__mini--1{margin-right:5%}

/* --- header tagline "IT'S TIME TO FLY™": loads white; each letter takes the
   green tone one after another (JS adds .is-volt per letter), holds, then all
   reset to white — looping on the same 5.6s cycle as the TK logo sheen --- */
.hdr__tagline{color:var(--bone);opacity:1}
.hdr__tagline .tg-l{transition:color .3s ease}
.hdr__tagline .tg-l.is-volt{color:var(--volt)}
body[data-theme="light"] .hdr__tagline,body[data-theme="stone"] .hdr__tagline{color:var(--ink)}
body[data-theme="light"] .hdr__tagline .tg-l.is-volt,body[data-theme="stone"] .hdr__tagline .tg-l.is-volt{color:var(--volt-deep)}

/* --- DMC chip dot: brand green instead of purple --- */
.chip__dot{background:var(--volt);box-shadow:0 0 12px rgba(217,255,63,.9)}

/* --- tagline ™: the global .tm (.42em) is too small at this size --- */
.hdr__tagline .tm{font-size:.72em;font-weight:700}

/* --- wall finale: the TK mark ascends (replaces the insole) — rises with the
   existing scroll tween on #wallInsole (outer), levitates gently (inner), and
   carries the logo's light sweep. --- */
.wall__mark{position:relative;z-index:1;width:min(460px,68vw);margin-top:-2vh;will-change:transform}
.wall__mark-float{position:relative;animation:tkMarkFloat 7s ease-in-out infinite;will-change:transform}
.wall__mark-float img{
  width:100%;height:auto;display:block;
  filter:drop-shadow(0 44px 70px rgba(0,0,0,.55)) drop-shadow(0 0 64px rgba(217,255,63,.16));
}
@keyframes tkMarkFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3.2%)}}
@media (max-width:760px){ .wall__mark{width:min(320px,72vw)} }
@media (prefers-reduced-motion:reduce){ .wall__mark-float{animation:none} }

/* --- mobile hero: the 16:9 montage read as a narrow slice on phones. Show the
   dedicated 4:3 reframe as a full-width cinematic band under the header, with
   the copy flowing right below it — NOT pinned to the bottom of a 100svh
   section, which left a dead gap between video and text on tall phones. --- */
@media (max-width:820px){
  .hero{min-height:0;justify-content:flex-start}
  .hero__media{
    position:relative;inset:auto;z-index:0;
    /* exactly the header height — the gap under the menu is then just the
       header's own internal padding, matching the gap above it (client 2026-07-10) */
    margin-top:var(--hdr-h);
    background:#15170F;
  }
  .hero__vid{
    position:relative;left:auto;top:auto;display:block;
    width:100%;height:auto;aspect-ratio:4/3;
    object-fit:cover;object-position:center;
  }
  .hero__vid--d{display:none}   /* mobile: desktop clip hidden, mobile 4:3 clip shown */
  .hero__vid--m{display:block}
  .hero__content{padding-top:clamp(24px,4.5vh,44px)}
}

/* --- ™ inside the serif italic headings (Dynamic Motion Control™): superscript
   BESIDE the final letter — the italic lean of "l" needs the extra left gap,
   otherwise the mark visually hovers above the word --- */
.serif-i .tm{font-size:.32em;vertical-align:baseline;position:relative;top:-1.05em;margin-left:.55em}

/* --- solution gallery slider: basketball / soccer / tennis (2026-07-07) ---
   mobile: snap cards like the homepage solutions strip · desktop: editorial
   filmstrip — fixed height, natural widths, drag/arrows ------------------- */
.solgal{position:relative;padding:clamp(2.4rem,7vh,4.6rem) 0}
.solgal__track{
  display:flex;align-items:center;gap:clamp(14px,1.8vw,26px);
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding:0 var(--gutter) 6px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.solgal__track::-webkit-scrollbar{display:none}
.solgal__track:focus-visible{outline:2px solid var(--volt);outline-offset:4px}
.solgal__slide{
  position:relative;flex:0 0 auto;margin:0;overflow:hidden;
  height:clamp(340px,56vh,590px);
  scroll-snap-align:center;
  background:#101208;
}
.solgal__slide img,.solgal__slide video{
  height:100%;width:auto;max-width:82vw;object-fit:cover;display:block;-webkit-user-drag:none;
}
.solgal__slide--video video{aspect-ratio:9/16}
.solgal__slide--wide video{aspect-ratio:16/9}
/* sound video: click-to-play affordance — play button centred over the poster.
   Hidden once started (native controls take over); reappears when the clip ends. */
.solgal__slide--sound .solgal__play{
  position:absolute;inset:0;margin:auto;width:66px;height:66px;z-index:2;
  display:grid;place-items:center;
  border:0;border-radius:50%;cursor:pointer;
  background:rgba(16,18,8,.55);color:var(--bone);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  transition:background .3s var(--ease-soft),color .3s var(--ease-soft),transform .3s var(--ease-soft),opacity .3s;
}
.solgal__slide--sound .solgal__play svg{width:26px;height:26px;margin-left:3px}
.solgal__slide--sound .solgal__play:hover,
.solgal__slide--sound .solgal__play:focus-visible{background:var(--volt);color:#12130f;transform:scale(1.06);outline:none}
.solgal__slide--sound.has-started .solgal__play{opacity:0;pointer-events:none}
.solgal__cap{
  position:absolute;left:0;right:0;bottom:0;margin:0;
  padding:2.6rem 1rem .85rem;
  background:linear-gradient(180deg,transparent,rgba(10,12,6,.8));
  color:var(--bone);font-size:.68rem;font-weight:680;letter-spacing:.16em;text-transform:uppercase;
}
.solgal__nav{display:flex;gap:10px;justify-content:flex-end;padding:16px var(--gutter) 0}
.solgal__nav[hidden]{display:none}   /* JS toggles [hidden] — arrows show only when the strip overflows */
.solgal__btn{
  width:52px;height:52px;border:1px solid var(--line);border-radius:50%;
  display:grid;place-items:center;
  background:transparent;color:var(--fg);font-size:1.05rem;line-height:1;cursor:pointer;
  transition:background .3s var(--ease-soft),color .3s var(--ease-soft),border-color .3s;
}
.solgal__btn:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
@media (min-width:821px){
  .solgal__track{scroll-snap-type:x proximity;cursor:grab}
  .solgal__track.is-drag{scroll-snap-type:none;cursor:grabbing;user-select:none}
}
@media (max-width:820px){
  .solgal__track{gap:14px;padding-bottom:12px}
  .solgal__slide{height:auto;flex:0 0 74vw;aspect-ratio:4/5}
  .solgal__slide--wide{flex-basis:88vw;aspect-ratio:16/9}
  /* top-biased crop: tall 9:16 shots (Avdija & co.) lose ~30% of height in the
     4/5 box — keep faces, sacrifice shins */
  .solgal__slide img,.solgal__slide video{width:100%;height:100%;max-width:none;aspect-ratio:auto;object-position:top}
}

/* --- TRUSTED v2 (2026-07-07): static split layout — slogan left, sharp
   full-color portrait right with the TK mark ABOVE it, championship-logo
   marquee below (replaces the shrinking grayscale photo + orbit chips) --- */
.pr2{position:relative;padding:clamp(4.5rem,13vh,8.5rem) 0 0;overflow:hidden}
.pr2__grid{display:grid;grid-template-columns:1.05fr min(42vw,540px);gap:clamp(2.4rem,6vw,6.5rem);align-items:center}
.pr2__h{font-weight:820;font-stretch:112%;text-transform:uppercase;letter-spacing:-.01em;line-height:.98;font-size:clamp(2.7rem,5vw,4.8rem)}
.pr2__h .serif-i{display:block;margin-top:.1em}
.pr2__body{margin-top:1.8em;font-size:clamp(1rem,1.12vw,1.14rem);line-height:1.72;max-width:46ch}
.pr2__body .serif-i{color:var(--volt);font-size:1.05em}
.pr2__cap{margin-top:2em;font-size:.7rem;font-weight:660;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);max-width:38ch}
.pr2__media{margin:0;position:relative}
.pr2__mark{position:absolute;right:clamp(14px,2.2vw,26px);bottom:clamp(14px,2.2vw,26px);display:block;width:min(150px,30%)}
.pr2__mark img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 26px rgba(0,0,0,.55))}
.pr2__media>img{
  width:100%;height:auto;border-radius:10px;
  box-shadow:0 42px 90px -32px rgba(0,0,0,.72);
  border:1px solid rgba(236,234,225,.1);
}
.pr2__logos{margin-top:clamp(3rem,8vh,5.5rem);padding:clamp(1.2rem,3vh,2rem) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pr2__strip{display:inline-flex;align-items:center;gap:clamp(2.4rem,5.5vw,5rem);padding-inline-end:clamp(2.4rem,5.5vw,5rem)}
.pr2__strip img{height:clamp(44px,7.2vh,62px);width:auto;display:block}
@media (max-width:820px){
  .pr2__grid{grid-template-columns:1fr;gap:2.6rem}
  .pr2__media{order:2}
  .pr2__cap{margin-top:1.4em}
  .pr2__logos{margin-top:2.8rem}
  .pr2__strip img{height:44px}
}

/* --- jump menu: all 20 rows must be reachable (2026-07-07) — compress the
   panel on shorter windows so both columns fit without internal scrolling;
   when it still can't fit (tiny/landscape screens) the panel scrolls --- */
@media (max-height:860px){
  .solnav__panel{padding:clamp(1.2rem,2.6vw,1.8rem)}
  .solnav__head{margin-bottom:1rem}
  .solnav__head h3{font-size:clamp(1.15rem,2.2vw,1.6rem)}
  .solnav__close{width:38px;height:38px}
  .solnav__list a{padding:.38em .4em;gap:.8em}
  .solnav__list span{font-size:.9rem}
  .solnav__list img{width:32px;height:32px}
}
@media (max-height:700px){
  .solnav__list a{padding:.3em .4em}
  .solnav__list span{font-size:.84rem}
  .solnav__list em{font-size:.85rem}
  .solnav__list img{width:28px;height:28px}
}

/* --- wall mark vs CTA breathing room on phones (2026-07-07) --- */
@media (max-width:760px){
  .wall__mark{margin-top:0}
  .wall{gap:5vh}
}

/* --- hall-of-fame grid: polaroids must fill their grid cell, not their
   fixed 320px width — at mid viewports the fixed width overflowed the
   column, ate the grid gap and ran captions across neighbours (2026-07-07) */
.fame .polaroid{width:auto}
.fame{row-gap:clamp(26px,4vh,44px)}

/* --- trusted logo marquee: forbid flex shrinking entirely (2026-07-07).
   The text marquees are protected by white-space:nowrap, but images are not —
   when the inline-flex inner clamps to the viewport, strips/images could be
   squeezed into each other. max-content + flex:none makes overlap impossible. */
.pr2__logos .mq__inner{width:max-content;flex-wrap:nowrap}
.pr2__strip{flex:none}
.pr2__strip img{flex:none;max-width:none}

/* --- trusted marquee: stop logo flicker during the scroll (2026-07-07).
   The 6700px animated inner is tiled by the compositor; re-rasterized tiles
   can commit before an async-decoded image is ready — one logo "blinks".
   Own layer per logo + sync decode = painted once, never re-rastered. --- */
.pr2__strip img{transform:translateZ(0);backface-visibility:hidden}

/* --- phone hero polish (2026-07-08): 2.35rem title floor is the largest that
   fits the widest page words (MOTORSPORT 8.21em, HEALTHCARE 7.84em) on 360px
   screens; eyebrow returns to base size on phones so the longest breadcrumb
   (SOLUTIONS · AMERICAN FOOTBALL) holds a single line --- */
@media (max-width:480px){
  .phero .phero__eyebrow{font-size:.72rem;letter-spacing:.18em}
}
@media (max-width:359px){
  .phero__title{font-size:10vw}
}

/* --- sect eyebrow breadcrumbs (2026-07-08): solution pages moved the linked
   crumb from the hero into the body sect — give the links a hover state --- */
.eyebrow a{transition:color .3s}
.eyebrow a:hover{color:var(--accent)}
