/* Frame 1 preview: hook, LED ribbon, three digital screens, logos */
:root{--led:#ff6a4d;--led-soft:rgba(255,90,60,.55);--led-amber:#ffb347;--bezel:#0a0a0b}


/* hook */
.hero.f1{min-height:auto;padding:150px 0 clamp(40px,6vw,80px)}
.hero.f1 h1{font-size:clamp(46px,9.4vw,152px);line-height:.9;margin:0 0 clamp(24px,3vw,40px)}
.hero.f1 .hero-row{padding-bottom:0}
.hero.f1 p{max-width:34em}
.btn.wa{gap:10px}
.btn.wa svg{width:18px;height:18px;fill:currentColor;flex:none}
.nav .btn.wa{padding:12px 18px;font-size:12px;white-space:nowrap}

/* three digital screens */
.proof-screens{padding:clamp(72px,10vw,150px) 0}
.proof-screens h2{margin:22px 0 clamp(36px,5vw,64px)}
.screens{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
.screen{opacity:.0;transform:translateY(28px) scale(.98);transition:opacity .6s,transform .8s cubic-bezier(.2,.7,.2,1)}
.screen.on{opacity:1;transform:none}
.bezel{position:relative;background:var(--bezel);border:1px solid #2a2a2e;border-radius:6px;padding:clamp(22px,2.4vw,34px);box-shadow:0 0 0 6px #111113,0 0 0 7px #26262a,0 30px 60px rgba(0,0,0,.5);overflow:hidden}
.screen:not(.on) .bezel{filter:brightness(.35)}
.s-tag{font:600 12px/1.3 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin-bottom:clamp(12px,2vw,24px)}
.s-num{font-family:var(--display);font-weight:800;font-size:clamp(60px,7.2vw,104px);line-height:.85;white-space:nowrap;color:var(--led);text-shadow:0 0 24px rgba(255,90,60,.22);font-variant-numeric:tabular-nums;letter-spacing:0;min-height:.9em}
.s-label{margin-top:16px;color:#f4f0e8;font-size:clamp(16px,1.4vw,19px);line-height:1.35}
.s-label em{font-style:normal;color:var(--mute);font-size:.82em;letter-spacing:.02em}
.s-save{display:flex;align-items:baseline;gap:10px;margin-top:clamp(20px,2.4vw,32px);padding-top:18px;border-top:1px solid #26262a;color:var(--led-amber);font-family:var(--display);font-weight:800;font-size:clamp(36px,3.8vw,54px);line-height:.9;text-shadow:none;font-variant-numeric:tabular-nums}
.s-save .down{font-size:.7em;color:var(--led-amber)}
.s-save small{font:600 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:rgba(244,240,232,.75);text-shadow:none;margin-left:2px}

/* trusted */
.trusted{border-top:0}
.trusted .eyebrow{max-width:34em}

/* placeholder for the frames not yet agreed */
.next{background:var(--ink);color:var(--paper);padding:clamp(48px,6vw,90px) 0}
.next-txt{margin-top:16px;color:var(--mute);max-width:40em}

/* sticky WhatsApp button */
.sticky.wa-s{display:none}

@media (max-width:960px){
  .hero.f1{padding-top:96px}
  .screens{grid-template-columns:1fr}
  .s-num{font-size:clamp(80px,24vw,120px)}
  .sticky.wa-s{display:inline-flex}
  .hero.f1 .hero-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
  .hero.f1 .hero-cta .btn{width:100%;justify-content:center;padding:15px 10px;font-size:12.5px;letter-spacing:.06em}
}
@media (prefers-reduced-motion:reduce){.screen{opacity:1;transform:none}.screen:not(.on) .bezel{filter:none}}

/* arrows: up for results, down for savings */
.s-num{display:flex;align-items:center;gap:clamp(10px,1.2vw,18px)}
.s-num .ar{width:.46em;height:.46em;flex:none;fill:currentColor;margin-top:.04em}
.s-save .ar{width:.62em;height:.62em;flex:none;fill:currentColor;align-self:center}
.s-save small{font-size:12px}

.screen{min-width:0}
.bezel{min-width:0}

/* Frame 2: trusted by brands and agencies */
.trust2{padding:clamp(48px,6vw,88px) 0;background:var(--paper-2)}
.trust2 .eyebrow{margin-bottom:clamp(24px,3vw,40px)}
.logo-grid{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(24px,3vw,44px) clamp(12px,2vw,28px);align-items:center;justify-items:center}
.logo-grid li{display:flex;align-items:center;justify-content:center;width:100%;height:64px}
.logo-grid img{height:var(--h);width:auto;max-width:100%;object-fit:contain;mix-blend-mode:multiply;filter:grayscale(1) contrast(1.6);opacity:.92}
.agency-tier{margin-top:clamp(28px,4vw,48px);padding-top:clamp(24px,3.4vw,40px);border-top:1px solid var(--line)}
.logo-grid.agencies{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:clamp(16px,2vw,24px) clamp(18px,2.4vw,32px)}
.logo-grid.agencies li{width:auto;height:84px}
.logo-grid.agencies img{height:calc(var(--h)*.92);opacity:.9}
@media (max-width:960px){
  .logo-grid{grid-template-columns:repeat(3,1fr)}
  .logo-grid li{height:56px}
  .logo-grid img{height:calc(var(--h)*.8)}
  .logo-grid.agencies{gap:16px 28px}
  .logo-grid.agencies li{height:56px}
  .logo-grid.agencies img{height:calc(var(--h)*.85)}
}

.sectors{margin-top:clamp(20px,2.4vw,32px);text-align:center;font:500 11px/1.4 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}

/* Frame 4: why we are different */
.why{padding:clamp(72px,10vw,150px) 0}
.why .eyebrow{margin-bottom:22px}
.why-h{font-size:clamp(46px,8vw,124px);line-height:.92;margin:0 0 clamp(20px,3vw,36px);max-width:12em}
.why-h span{color:var(--red)}
.why-lede{font:500 clamp(20px,2.3vw,32px)/1.3 var(--body);letter-spacing:-.01em;max-width:28em;color:var(--paper)}
.why-lede b{font-weight:600;color:var(--red)}
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,36px);margin-top:clamp(40px,6vw,88px)}
@media (max-width:960px){.reasons{grid-template-columns:1fr;gap:28px}}

/* Frame 4 cards: light up on hover */
.reasons{align-items:stretch}
.reason{position:relative;display:flex;flex-direction:column;background:#1b1b1d;border:1px solid #2c2c30;border-radius:10px;padding:clamp(22px,2.4vw,34px);overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s,background .35s,box-shadow .35s}
.reason::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--red);transform:scaleX(.18);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.reason::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 0% 0%,rgba(232,68,58,.30),rgba(232,68,58,0) 62%);opacity:0;transition:opacity .4s;pointer-events:none}
.reason h3{position:relative;z-index:1;font-size:clamp(30px,3.2vw,46px);line-height:.98;margin-bottom:clamp(12px,1.6vw,20px);transition:color .35s}
.reason p{position:relative;z-index:1;color:rgba(244,240,232,.78);font-size:clamp(16px,1.3vw,18px);max-width:24em;transition:color .35s}
@media (min-width:961px){.reason h3{min-height:2em}}
@media (hover:hover){
  .reason:hover{transform:translateY(-6px);border-color:var(--red);background:#201c1c;box-shadow:0 18px 50px rgba(232,68,58,.22),0 0 0 1px rgba(232,68,58,.35)}
  .reason:hover::before{transform:scaleX(1)}
  .reason:hover::after{opacity:1}
  .reason:hover h3{color:#fff}
  .reason:hover p{color:#f4f0e8}
}
@media (hover:none){.reason:active::after{opacity:1}.reason:active::before{transform:scaleX(1)}}

/* Frame 5: how we connect the dots */
.how{padding:clamp(72px,10vw,150px) 0;background:var(--paper)}
.how .eyebrow{margin-bottom:22px}
.how-h{font-size:clamp(40px,6.6vw,100px);line-height:.94;max-width:13em;margin-bottom:clamp(32px,5vw,64px)}
.how-h span{color:var(--red)}
.insight{background:#fff;border:1px solid var(--line);border-radius:12px;padding:clamp(22px,2.6vw,38px)}
.i-tag{font:600 12px var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.i-line{font:700 clamp(26px,3vw,44px)/1.05 var(--display);text-transform:uppercase;letter-spacing:.005em;color:var(--ink)}
.i-line b{color:var(--red);font-weight:800}
.i-sub{margin-top:14px;color:#6a655b;font-size:clamp(15px,1.2vw,17px)}
.insight.wide{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,3vw,48px);align-items:center}
.slider{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-top:22px;font:600 12px var(--body);letter-spacing:.12em;text-transform:uppercase;color:#6a655b}
.slider output{min-width:3.2em;text-align:right;font:800 22px var(--display);letter-spacing:.02em;color:var(--ink)}
.slider input{width:100%;accent-color:var(--red);height:32px;cursor:pointer}
.bars24{display:flex;align-items:flex-end;gap:4px;height:clamp(150px,18vw,230px)}
.bars24 i{flex:1;height:0;min-height:2px;border-radius:2px 2px 0 0;background:#d4cec1;transition:height .6s cubic-bezier(.2,.7,.2,1),background .25s,outline .25s}
.bars24 i.grow{height:var(--h)}
.bars24 i.prime{background:#f1b9b3}
.bars24 i.peak{background:var(--red)}
.bars24 i.sel{outline:2px solid var(--ink);outline-offset:2px}
.ticks24{display:flex;justify-content:space-between;margin-top:10px;font:500 11px var(--body);letter-spacing:.08em;text-transform:uppercase;color:#8a857b}
.insights2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,28px);margin-top:clamp(16px,2vw,28px)}
.hbars{margin:22px 0 4px;display:grid;gap:12px}
.hbars>div{display:grid;grid-template-columns:96px 1fr 44px;align-items:center;gap:12px;font-size:14px;color:#6a655b}
.hbars>div>i{display:block;height:16px;border-radius:99px;background:#d4cec1;width:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
.hbars.go>div>i{width:var(--w)}
.hbars>div:first-child>i{background:var(--red)}
.hbars>div>b{font:800 22px var(--display);color:var(--ink);text-align:right}
.hbars>div:first-child>b{color:var(--red)}
.how-cta{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;margin-top:clamp(36px,5vw,64px);padding-top:28px;border-top:1px solid var(--line)}
.cta-h{font:800 clamp(30px,3.6vw,52px)/1 var(--display);text-transform:uppercase}
.cta-s{margin-top:8px;color:#6a655b;font-size:clamp(16px,1.4vw,19px)}
.tools-line{margin-top:28px;font:500 13px var(--body);letter-spacing:.1em;text-transform:uppercase;color:#6a655b}
.tools-line b{color:var(--ink);font-weight:600}
.sample-note{margin-top:10px;font-size:12px;color:#8a857b}
@media (max-width:960px){
  .insight.wide{grid-template-columns:1fr}
  .insights2{grid-template-columns:1fr}
  .hbars>div{grid-template-columns:84px 1fr 40px}
  .how-cta .btn{width:100%;justify-content:center}
}

/* Frame 5: movement (origin and destination) */
.insights2.od{margin-top:clamp(16px,2vw,28px)}
.flow-svg{display:block;width:100%;max-width:340px;height:auto;margin:18px 0 6px}
.flow-svg line{stroke-linecap:round;stroke-dasharray:150;stroke-dashoffset:150;transition:stroke-dashoffset 1.1s cubic-bezier(.2,.7,.2,1)}
.flow-svg.go line{stroke-dashoffset:0}
.hbars>div.grey>i{background:#d4cec1}
.hbars>div.grey>b{color:var(--ink)}
.od .hbars>div>i{background:var(--red)}
.od .hbars>div.grey>i{background:#d4cec1}
.od .hbars>div:first-child>b{color:var(--red)}
.hbars>div.west>i{background:var(--red)}
.hbars>div.west>b{color:var(--red)}
.hbars>div>span{white-space:nowrap}
@media (prefers-reduced-motion:reduce){.flow-svg line{stroke-dashoffset:0;transition:none}}
@media (max-width:960px){.hbars>div{grid-template-columns:96px 1fr 44px}}

/* Frame 5: PiScore and PiMotion */
.i-tag .toolbadge{font-style:normal;margin-left:8px;padding:3px 8px;border-radius:99px;background:var(--ink);color:#fff;letter-spacing:.06em;font-size:11px}
.ringwrap{display:flex;align-items:center;gap:clamp(14px,2vw,26px);margin:18px 0 8px}
.ring{width:clamp(96px,10vw,124px);height:auto;flex:none}
.ring-fill{transition:stroke-dashoffset 1.4s cubic-bezier(.2,.7,.2,1)}
.ringwrap.go .ring-fill{stroke-dashoffset:48.3}
.ring-num{font:800 44px var(--display);fill:var(--ink)}
.scale{flex:1;min-width:0}
.scale-bar{position:relative;display:flex;height:12px;border-radius:99px;overflow:visible}
.scale-bar i{display:block;height:100%}
.scale-bar .s-red{width:60%;background:#e8695f;border-radius:99px 0 0 99px}
.scale-bar .s-amb{width:20%;background:#f0b24a}
.scale-bar .s-grn{width:20%;background:#4cae6b;border-radius:0 99px 99px 0}
.scale-bar .marker{position:absolute;top:-6px;width:4px;height:24px;margin-left:-2px;border-radius:2px;background:var(--ink)}
.hbars.score{margin-top:16px}
.hbars.score>div>i{background:#d4cec1}
.hbars.score>div:first-child>i{background:var(--red)}
.hbars.score>div.low>i{background:#f0b24a}
.hbars.score>div.low>b{color:#b07a14}
.stacks{display:grid;gap:14px;margin:18px 0 6px}
.stk>p:first-child{font:600 11px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#8a857b;margin-bottom:6px}
.stack{display:flex;height:16px;border-radius:99px;overflow:hidden;background:#ece7db}
.stack i{display:block;height:100%;width:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
.stacks.go .stack i{width:var(--w)}
.stack .c1{background:var(--red)}.stack .c2{background:#f08e85}.stack .c3{background:#d4cec1}.stack .c4{background:#b3ad9f}
.stk .leg{margin-top:6px;font-size:12px;color:#6a655b;line-height:1.4}
.aff-h{margin-top:16px;font:600 11px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#8a857b}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chips span{padding:6px 12px;border-radius:99px;background:#f1ece1;border:1px solid var(--line);font:600 12px var(--body);letter-spacing:.04em;color:var(--ink)}
@media (prefers-reduced-motion:reduce){.ringwrap .ring-fill{stroke-dashoffset:48.3;transition:none}.stack i{width:var(--w);transition:none}}


.scale-leg{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font:500 11px/1.2 var(--body);letter-spacing:.03em;color:#6a655b}
.scale-leg span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.scale-leg i{display:inline-block;width:9px;height:9px;border-radius:50%}
.d-red{background:#e8695f}.d-amb{background:#f0b24a}.d-grn{background:#4cae6b}

/* Frame 5, part 8: sized tags for interests and purchases */
.insight.wide2{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(20px,3vw,48px);align-items:start;margin-top:clamp(16px,2vw,28px)}
.cloud-wrap{display:grid;gap:22px}
.cloud-h{font:600 11px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#8a857b;margin-bottom:10px}
.chipcloud{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chipcloud span{display:inline-flex;align-items:baseline;gap:6px;padding:calc(5px + (var(--s) - 9) * .9px) calc(10px + (var(--s) - 9) * 1.6px);border-radius:99px;background:#f1ece1;border:1px solid var(--line);color:var(--ink);font:600 calc(12px + (var(--s) - 9) * 1.1px)/1 var(--body);letter-spacing:.01em;opacity:0;transform:scale(.88);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.chipcloud span b{font-weight:700;color:#8a857b;font-size:.78em}
.chipcloud.go span{opacity:1;transform:none}
.chipcloud span.top{background:var(--red);border-color:var(--red);color:#fff}
.chipcloud span.top b{color:rgba(255,255,255,.85)}
@media (max-width:960px){.insight.wide2{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.chipcloud span{opacity:1;transform:none;transition:none}}

/* Frame 6: who we are */
.who{padding:clamp(72px,10vw,150px) 0}
.who .eyebrow{margin-bottom:22px}
.who-h{font-size:clamp(42px,7vw,108px);line-height:.94;max-width:13em;margin-bottom:clamp(18px,2.4vw,28px)}
.who-lede{font:500 clamp(19px,2vw,28px)/1.35 var(--body);max-width:30em;color:rgba(244,240,232,.85)}
.pp-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.2vw,32px);margin-top:clamp(36px,5vw,64px)}
.pp{background:#1b1b1d;border:1px solid #2c2c30;border-radius:10px;padding:clamp(20px,2.2vw,30px);transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s}
@media (hover:hover){.pp:hover{transform:translateY(-4px);border-color:var(--red)}}

.pp h3{font-size:clamp(34px,3.6vw,52px)}
.pp-role{margin:8px 0 12px;color:var(--red);font:600 12px var(--body);letter-spacing:.16em;text-transform:uppercase}
.pp p:last-child{color:rgba(244,240,232,.78);font-size:clamp(15px,1.3vw,17px);max-width:30em}
.q3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,36px);margin-top:clamp(36px,5vw,64px)}
.q3 blockquote{border-top:2px solid var(--red);padding-top:22px}
.q3 p{font:700 clamp(20px,2vw,28px)/1.12 var(--display);text-transform:uppercase;letter-spacing:.005em}
.q3 cite{display:block;margin-top:16px;font-style:normal;font-size:14px;color:var(--mute)}
.q3 cite b{display:block;color:var(--paper);letter-spacing:.06em;text-transform:uppercase;font-size:13px}

/* Frame 7: contact */
.contact7{background:var(--paper);padding:clamp(72px,10vw,150px) 0 0}
.contact7 .eyebrow{margin-bottom:22px}
.c7-h{font-size:clamp(46px,8vw,124px);line-height:.92;margin-bottom:clamp(16px,2vw,24px)}
.c7-sub{font-size:clamp(17px,1.6vw,21px);color:#5a554c;max-width:34em}
.sits{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.8vw,24px);margin-top:clamp(32px,4.5vw,56px)}
.sit{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:170px;padding:clamp(22px,2.4vw,34px);background:#fff;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s,box-shadow .35s,background .35s}
.sit span{font:800 clamp(28px,3vw,44px)/1 var(--display);text-transform:uppercase;letter-spacing:.005em;max-width:14em}
.sit b{display:inline-flex;align-items:center;gap:8px;font:600 13px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.sit b i{font-style:normal;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
@media (hover:hover){.sit:hover{transform:translateY(-5px);border-color:var(--red);background:var(--red);box-shadow:0 20px 50px rgba(232,68,58,.28)}.sit:hover span,.sit:hover b{color:#fff}.sit:hover b i{transform:translateX(6px)}}
.sit:active{background:var(--red)}.sit:active span,.sit:active b{color:#fff}
.c7-alt{margin-top:clamp(24px,3vw,36px);color:#5a554c;font-size:16px}
.c7-alt a{color:var(--ink);text-underline-offset:4px}
.c7-foot{margin-top:clamp(56px,8vw,110px);background:var(--ink);color:var(--mute);padding:28px 0;font-size:13px;line-height:1.7}
.c7-foot .wrap{display:flex;justify-content:space-between;gap:16px 40px;flex-wrap:wrap}
.c7-foot address{font-style:normal;max-width:50em}
.c7-foot address b{color:var(--paper);letter-spacing:.1em;text-transform:uppercase;font-size:12px;margin-right:8px}
.c7-foot a{color:var(--paper)}
@media (max-width:960px){
  .pp-grid,.q3,.sits{grid-template-columns:1fr}
  .sit{min-height:0}
}

.pp{display:grid;grid-template-columns:clamp(110px,14vw,170px) 1fr;gap:0 clamp(16px,2vw,26px);align-items:start}
.pp-ph{grid-row:1 / span 3;aspect-ratio:4/5;border-radius:8px;background:repeating-linear-gradient(135deg,#1f1f22 0 12px,#252528 12px 24px);display:grid;place-items:center;text-align:center;padding:8px;color:#6f6a62;font:600 10px/1.4 var(--body);letter-spacing:.12em;text-transform:uppercase;margin:0}
.pp h3{grid-column:2}
.pp-role{grid-column:2}
.pp>p:last-child{grid-column:2}
@media (max-width:560px){.pp{grid-template-columns:96px 1fr}}

.pp-img{grid-row:1 / span 3;width:100%;height:auto;aspect-ratio:4/5;align-self:start;object-fit:cover;object-position:50% 20%;border-radius:8px;display:block;background:#222}

/* Frame 6: engineers of attention */
.eng{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,64px);align-items:center;margin-top:clamp(28px,4vw,56px)}
.eng-fig{margin:0}
.eng-fig img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:12px;background:#222}
.eng-fig figcaption{margin-top:12px;font:500 13px var(--body);letter-spacing:.04em;color:var(--mute)}
.eng-fig figcaption b{color:var(--paper);font-weight:600;margin-right:4px}
.eng-fig figcaption i{font-style:normal;margin:0 8px;color:#5a564f}
.eng-awards{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;margin-bottom:clamp(20px,2.4vw,30px)}
.eng-awards b{padding:9px 14px;border-radius:99px;background:linear-gradient(135deg,#e7c779,#b98a2f);color:#1a1405;font:700 12px var(--body);letter-spacing:.1em;text-transform:uppercase}
.eng-awards span{padding:8px 13px;border-radius:99px;border:1px solid #6b5a2e;color:#e7c779;font:600 12px var(--body);letter-spacing:.08em;text-transform:uppercase}
.eng-list{list-style:none;display:grid;gap:clamp(14px,1.8vw,22px)}
.eng-list li{position:relative;padding-left:26px;font:500 clamp(18px,1.9vw,26px)/1.3 var(--body);letter-spacing:-.01em;color:var(--paper)}
.eng-list li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:10px;background:var(--red)}
.eng-bios{display:grid;gap:12px;margin-top:clamp(22px,2.8vw,34px);padding-top:clamp(18px,2.4vw,28px);border-top:1px solid #2c2c30}
.eng-bios p{font-size:clamp(14px,1.2vw,16px);line-height:1.55;color:rgba(244,240,232,.7)}
.eng-bios b{color:var(--paper);margin-right:8px;font-weight:600}
@media (max-width:960px){.eng{grid-template-columns:1fr}.eng-fig{max-width:420px}}

/* solo portraits + one-line awards */
.eng{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
.eng-duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.4vw,18px)}
.eng-duo figure{margin:0}
.eng-duo img,.duo-ph{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:12px;background:#222}
.duo-ph{display:grid;place-items:center;background:repeating-linear-gradient(135deg,#1f1f22 0 12px,#252528 12px 24px);color:#6f6a62;font:600 11px var(--body);letter-spacing:.14em;text-transform:uppercase}
.eng-duo figcaption{margin-top:10px;font:500 13px var(--body);letter-spacing:.04em;color:var(--mute)}
.eng-duo figcaption b{display:block;color:var(--paper);font-weight:600;font-size:15px;margin-bottom:2px}
.aw-sub{color:#e7c779;font:600 12px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase}
.aw-sub i{font-style:normal;margin:0 6px;color:#8a7338}
.eng-awards span:not(.aw-sub){display:none}
@media (max-width:960px){.eng{grid-template-columns:1fr}.eng-duo{max-width:460px}}

/* Frame 6 v2: people cards, awards row, scrolling testimonials */
.folks{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,32px);margin-top:clamp(32px,4.5vw,60px)}
.folk{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(16px,2vw,28px);align-items:center;padding:clamp(14px,1.6vw,22px);border:1px solid #2c2c30;border-radius:16px;background:#1a1a1d}
.folk img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:10px;background:#222}
.folk h3{font:800 clamp(28px,3vw,42px)/1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.folk-r{margin:6px 0 14px;font:600 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.folk-t p:last-child{font-size:clamp(14px,1.2vw,16px);line-height:1.55;color:rgba(244,240,232,.75)}
.awrow{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(28px,4vw,48px)}
.awrow li{padding:9px 15px;border-radius:99px;border:1px solid #6b5a2e;color:#e7c779;font:600 12px var(--body);letter-spacing:.09em;text-transform:uppercase}
.awrow li.gold{border:0;background:linear-gradient(135deg,#e7c779,#b98a2f);color:#1a1405;font-weight:700}
.qscroll{display:flex;gap:clamp(16px,2vw,28px);margin-top:clamp(28px,4vw,48px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px;scrollbar-width:thin;scrollbar-color:#555 transparent}
.qscroll blockquote{flex:0 0 min(380px,82%);scroll-snap-align:start;border-top:2px solid var(--red);padding-top:22px}
.qscroll p{font:700 clamp(20px,2vw,28px)/1.12 var(--display);text-transform:uppercase;letter-spacing:.005em}
.qscroll cite{display:block;margin-top:16px;font-style:normal;font-size:14px;color:var(--mute)}
.qscroll cite b{display:block;color:var(--paper);letter-spacing:.06em;text-transform:uppercase;font-size:13px}
.qhint{margin-top:6px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
@media (min-width:1100px){.qscroll blockquote{flex-basis:calc((100% - 56px)/3)}.qhint{display:none}}
@media (max-width:900px){.folks{grid-template-columns:1fr}}
@media (max-width:480px){.folk{grid-template-columns:1fr}.folk img{max-width:300px}}

.s-note{margin-top:clamp(18px,2.4vw,28px);font:500 13px var(--body);letter-spacing:.04em;color:var(--mute)}

/* Part 8 v2: two ranked bar lists, bars to scale from zero (axis 0-15%) */
.cloud-wrap.pcols{grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,40px);align-items:start}
.pbars{margin:0;gap:10px}
.pbars>div{grid-template-columns:minmax(70px,96px) 1fr 38px;gap:10px;font-size:13px}
.pbars>div>span{white-space:normal;line-height:1.15}
.pbars>div>i{height:12px}
.pbars>div>b{font-size:19px}
@media (max-width:560px){.cloud-wrap.pcols{grid-template-columns:1fr}}
.pbars>div:nth-child(-n+3)>i{background:var(--red)}
.pbars>div:nth-child(-n+3)>b{color:var(--red)}
/* Frame 5 close: tools line leads into the ask, note last */
.tools-line{margin-top:clamp(36px,5vw,64px)}
.tools-line+.how-cta{margin-top:20px}
.how-cta+.sample-note{margin-top:22px}

/* Selling-point lines under the data */
.i-sub.hot{margin-top:20px;padding:2px 0 2px 14px;border-left:4px solid var(--red);color:var(--ink);font:700 clamp(18px,1.7vw,24px)/1.2 var(--body);letter-spacing:-.01em}

/* Tools line now sits under the Frame 5 headline */
.how-h+.tools-line,.tools-line{margin-top:0;margin-bottom:clamp(24px,3vw,40px);display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px}
.tl-pills{display:inline-flex;flex-wrap:wrap;gap:8px}
.tl-pills .toolbadge{font-style:normal;padding:5px 12px;border-radius:99px;background:var(--ink);color:#fff;font:600 12px var(--body);letter-spacing:.06em}

/* Part 0: PiHorizon map */
.insight.pmap-card{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(20px,3vw,48px);align-items:center}
.pmap{background:#fbf9f4;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 18px 40px -22px rgba(20,20,20,.35)}
.pm-bar{display:flex;align-items:center;gap:14px;padding:10px 14px;background:#ece7db;border-bottom:1px solid var(--line)}
.pm-dots{display:flex;gap:6px}.pm-dots i{width:9px;height:9px;border-radius:50%;background:#c9c2b2}
.pm-search{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:99px;background:#fff;border:1px solid var(--line);font:500 13px var(--body);color:#6a655b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pm-search svg{flex:none;width:15px;height:15px;fill:none;stroke:#6a655b;stroke-width:2.4;stroke-linecap:round}
.pm-chips{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px 0}
.pm-chips button{font:600 12px var(--body);letter-spacing:.04em;padding:6px 13px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.pm-chips button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pm-chips button:hover:not(.on){border-color:var(--ink)}
.pm-svg{display:block;width:100%;height:auto;padding:6px 8px 0}
.pm-land circle{fill:#d9d3c6}
.pm-svg .bub{fill:var(--red);fill-opacity:.82;stroke:#fff;stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.2);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1.2),fill .3s,fill-opacity .3s}
.pmap.go .bub{opacity:1;transform:scale(1)}
.pmap.go .bub.dim{fill:#b9b2a3;fill-opacity:.35;transition-delay:0ms!important}
.pm-note{padding:2px 14px 12px;font:500 11px var(--body);letter-spacing:.03em;color:#8a857b}
@keyframes pmping{0%{stroke-opacity:.7;stroke-width:1.2}100%{stroke-opacity:0;stroke-width:14}}
.pmap.go .bub.hub:not(.dim){stroke:var(--red);animation:pmping 2.4s ease-out 1.6s infinite}
@media (max-width:960px){.insight.pmap-card{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.pm-svg .bub{opacity:1;transform:none;transition:none}.pmap.go .bub.hub{animation:none}}

/* Part 0 -> final card: dense coverage map */
.pm-land circle{fill:#d3ccbd}
.pm-svg .st{opacity:0;transition:opacity .45s ease,fill .3s;stroke:#fbf9f4;stroke-width:.8}
.pm-svg .st.k-d{fill:var(--red)}
.pm-svg .st.k-s{fill:#141414}
.pm-svg .st.k-h{fill:#f0a63a}
.pm-svg .st.k-t{fill:#2f7f8f}
.pm-svg .st.k-m{fill:#8b5cc4}
.pmap.go .pm-svg .st{opacity:.92}
.pmap.go .pm-svg .st.dim{opacity:.1;transition-delay:0ms!important}
.pm-labels text{font:700 11px var(--body);letter-spacing:.08em;text-transform:uppercase;fill:#141414;paint-order:stroke;stroke:#fbf9f4;stroke-width:3px}
.pm-ring{fill:none;stroke:var(--red);stroke-width:1.2;opacity:0}
.pmap.go .pm-ring:not(.off){animation:pmping 2.6s ease-out 1.2s infinite}
.pm-chips button i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.pm-chips button i.k-d{background:var(--red)}.pm-chips button i.k-s{background:#141414}.pm-chips button i.k-h{background:#f0a63a}
.pm-chips button.on i{box-shadow:0 0 0 1.5px #fff}
.pm-svg{padding:8px 10px 0}
@keyframes pmping{0%{stroke-opacity:.8;stroke-width:1.2;r:10}100%{stroke-opacity:0;stroke-width:1;r:34}}
.pm-svg .st.k-o{fill:#8a857b}

.cta-alt{margin-top:12px;font-size:14px;color:#6a655b}
.cta-alt a{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.cta-alt a:hover{color:var(--red)}

/* Tools line v2: weight first, sources second */
div.tools-line{display:block}
.tl-main{font:700 clamp(17px,1.6vw,22px)/1.25 var(--body);letter-spacing:-.01em;text-transform:none;color:var(--ink);margin-bottom:12px}
div.tools-line .tl-pills{display:flex}
.tl-src{margin-top:12px;font:500 13px var(--body);letter-spacing:.02em;text-transform:none;color:#6a655b}
/* Tools line: clean stack (overrides earlier flex rule) */
.how .tools-line.rv,.how div.tools-line{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin:0 0 clamp(28px,3.4vw,44px)}
.how .tl-main{margin:0 0 14px}
.how .tl-pills{margin:0}
.how .tl-src{margin:12px 0 0;line-height:1.3}
.insight+.sample-note{margin:14px 0 clamp(16px,2vw,28px)}
.sample-note+.pmap-card{margin-top:0}

/* Testimonials v2: featured quote + card carousel */
.tm{margin-top:clamp(40px,6vw,84px)}
.tq{display:block;font:800 clamp(64px,8vw,120px)/.7 var(--display);color:var(--red)}
.tm-feat{max-width:1000px}
.tm-feat blockquote p{margin-top:12px;font:700 clamp(30px,4.4vw,64px)/1.02 var(--display);text-transform:uppercase;letter-spacing:.005em;color:var(--paper)}
.tm-by{margin-top:20px;font-size:14px;color:var(--mute)}
.tm-by b{color:var(--paper);letter-spacing:.08em;text-transform:uppercase;font-size:13px;margin-right:6px}
.tm-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:clamp(36px,5vw,64px);padding-top:20px;border-top:1px solid #2c2c30}
.tm-lbl{font:600 12px var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.tm-nav{display:flex;gap:8px}
.tm-nav button{width:42px;height:42px;border-radius:50%;border:1px solid #3a3a3f;background:transparent;color:var(--paper);font-size:18px;cursor:pointer;transition:background .2s,border-color .2s}
.tm-nav button:hover{background:var(--red);border-color:var(--red)}
.tscroll{display:flex;gap:20px;margin-top:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;scrollbar-width:none}
.tscroll::-webkit-scrollbar{display:none}
.tcard{flex:0 0 min(380px,84%);scroll-snap-align:start;margin:0;display:flex;flex-direction:column;gap:14px;padding:26px 26px 24px;border:1px solid #2c2c30;border-radius:16px;background:#1a1a1d;transition:border-color .25s,box-shadow .25s,transform .25s}
.tcard:hover{border-color:var(--red);box-shadow:0 0 0 1px var(--red),0 18px 44px -18px rgba(232,68,58,.45);transform:translateY(-3px)}
.tcard .tq{font-size:56px;height:28px}
.tcard blockquote p{font:500 clamp(16px,1.3vw,18px)/1.5 var(--body);color:var(--paper)}
.tcard figcaption{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid #2c2c30}
.tav{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(232,68,58,.16);color:var(--red);font:700 13px var(--body);letter-spacing:.04em}
.tcard figcaption b{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper)}
.tcard figcaption em{font-style:normal;font-size:13px;color:var(--mute)}
@media (max-width:600px){.tm-nav{display:none}}

/* Frame 5 tabs */
.ttabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;position:sticky;top:64px;z-index:6;margin:0 0 clamp(18px,2.4vw,28px);padding:10px 0;background:var(--paper)}
.ttabs::-webkit-scrollbar{display:none}
.ttabs button{flex:none;min-height:44px;padding:0 20px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink);font:600 14px var(--body);letter-spacing:.04em;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.ttabs button[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.ttabs button:hover:not([aria-selected=true]){border-color:var(--ink)}
.tpanel[hidden]{display:none}
.tpanel{animation:tpin .35s ease}
@keyframes tpin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.insights2.one{grid-template-columns:1fr}
.tp-next{display:inline-flex;align-items:center;gap:8px;margin-top:20px;min-height:44px;padding:0 22px;border-radius:99px;border:1px solid var(--ink);background:transparent;color:var(--ink);font:600 14px var(--body);cursor:pointer;transition:background .2s,color .2s}
.tp-next:hover{background:var(--ink);color:#fff}
@media (prefers-reduced-motion:reduce){.tpanel{animation:none}}
@media (max-width:480px){.ttabs{gap:6px}.ttabs button{padding:0 14px;font-size:13px}}
@media (max-width:480px){.ttabs button{padding:0 12px}}

/* Results cards: outdoor format pill */
.s-fmt{display:inline-flex;align-items:center;gap:8px;margin:-6px 0 clamp(10px,1.6vw,18px);padding:6px 12px;border-radius:99px;border:1px solid rgba(244,240,232,.22);font:600 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--paper)}
.s-fmt svg{width:15px;height:15px;fill:none;stroke:var(--red);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.s-fmt{margin:-4px 0 clamp(20px,2.6vw,30px)}


/* Logo grid: centred rows, so a short last row sits in the middle */
.logo-grid{display:flex;flex-wrap:wrap;justify-content:center;--gx:clamp(12px,2vw,28px);gap:clamp(24px,3vw,44px) var(--gx)}
.logo-grid li{flex:0 0 calc((100% - 5*var(--gx))/6);width:auto}
@media (max-width:960px){.logo-grid li{flex-basis:calc((100% - 2*var(--gx))/3)}}
.pm-chips button{min-height:42px;padding:0 15px;display:inline-flex;align-items:center}

/* Safari-safe logos: transparency is baked into the PNGs, so no blend mode */
.logo-grid img{mix-blend-mode:normal}
/* Tag rows: let the tool pill wrap cleanly under the label */
.i-tag{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.i-tag .toolbadge{margin-left:0}

/* Map panel on phones: calmer search bar, compact chips */
@media (max-width:600px){
  .pm-bar{padding:8px 12px;gap:10px}
  .pm-search{font-size:13px;padding:7px 12px;gap:7px}
  .pm-chips{gap:6px;padding:10px 12px 0}
  .pm-chips button{position:relative;min-height:34px;padding:0 12px;font-size:12.5px;letter-spacing:.02em}
  .pm-chips button::after{content:"";position:absolute;inset:-4px -2px}
  .pm-chips button i{width:7px;height:7px;margin-right:5px}
}
@media (max-width:600px){
  .pm-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px;-webkit-mask-image:linear-gradient(to right,#000 90%,transparent);mask-image:linear-gradient(to right,#000 90%,transparent)}
  .pm-chips::-webkit-scrollbar{display:none}
  .pm-chips button{flex:none}
  .pm-chips button:last-child{margin-right:28px}
}
/* Short headline on phones: scale it up so it matches the big numbers below */
@media (max-width:700px){.proof-screens h2{font-size:clamp(52px,15vw,100px);line-height:.9}}
/* Section headlines on phones: big, one scale for all */
@media (max-width:700px){.why-h,.how-h,.who-h,.c7-h{font-size:clamp(52px,15.5vw,96px);line-height:.92}}
/* Hero headline on phones: the biggest on the page */
@media (max-width:700px){.hero h1,.hero.f1 h1{font-size:clamp(58px,18vw,150px);line-height:.9}}

.how-sub{margin:-6px 0 clamp(20px,2.6vw,32px);font:500 clamp(17px,1.6vw,22px)/1.35 var(--body);color:#6a655b}
.how-h{margin-bottom:clamp(14px,1.6vw,20px)}
.how-sub{margin:0 0 clamp(24px,3vw,40px)}

/* Side-by-side cards: pin the highlighted line to the bottom so both align */
.insights2:not(.one)>.insight{display:flex;flex-direction:column}
.insights2:not(.one)>.insight .i-sub.hot{margin-top:auto}
.insights2:not(.one)>.insight>.hbars,.insights2:not(.one)>.insight>.flow-svg,.insights2:not(.one)>.insight>.ringwrap{margin-bottom:22px}
@media (min-width:961px){.insights2:not(.one)>.insight .i-line{min-height:2.1em}}