
/* Site tokens (site/app/globals.css): Fraunces 400 + Inter, claude-dark #1A1A2E, claude-orange #E07A3A.
   Orange = a person decides. Purple lives only inside the 3D world. No cream. Deliberately dark-first. */
:root{
  --ink:#1A1A2E; --ink-2:#23233A; --ink-3:#2C2C47; --deep:#12121F;
  --orange:#E07A3A; --orange-2:#F09A5E;
  --paper:#FFFFFF; --grey:#F3F2F7; --text-l:#2D2D3F; --muted-l:#565E6C; --line-l:#E4E2EC;
  --text-d:#EEEDF5; --muted-d:#AEACC3; --line-d:rgba(255,255,255,.12);
  --ok:#3FA37A; --pilot:#D9A43A; --idea:#9A98B0;
  --font-h:"Fraunces",Georgia,serif; --font-b:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --bg:var(--ink); --surf:var(--ink-2); --text:var(--text-d); --muted:var(--muted-d); --line:var(--line-d); --head:#fff; --eyebrow:var(--orange);
}
.light{--bg:#F7F6FB; --surf:#FFFFFF; --text:var(--text-l); --muted:var(--muted-l); --line:var(--line-l); --head:var(--ink); --eyebrow:#A5481A}
.grey{--bg:var(--grey); --surf:#FFFFFF; --text:var(--text-l); --muted:var(--muted-l); --line:var(--line-l); --head:var(--ink); --eyebrow:#A5481A}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--text-d);font:400 17px/1.6 var(--font-b);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:var(--font-h);font-weight:400;color:var(--head);margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,4vw,32px)}
.sec{background:var(--bg);color:var(--text);padding-block:clamp(56px,7vw,88px);position:relative}
.eyebrow{font:600 12px/1 var(--font-b);letter-spacing:.16em;text-transform:uppercase;color:var(--eyebrow)}
.h1{font-size:clamp(40px,5.4vw,60px);line-height:1.04}
.h2{font-size:clamp(32px,4vw,48px);line-height:1.08}
.lede{font-size:clamp(17px,1.5vw,19px);color:var(--muted);max-width:60ch}
.head{display:grid;gap:14px;margin-bottom:clamp(28px,3.5vw,48px);max-width:760px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:999px;font:600 15px/1 var(--font-b);text-decoration:none;border:0;cursor:pointer;white-space:nowrap}
.btn-o{background:var(--orange);color:var(--ink)} .btn-o:hover{background:var(--orange-2)}
.btn-g{border:1px solid var(--line);color:var(--head);background:transparent}
.chip{display:inline-flex;align-items:center;gap:6px;font:500 12px/1 var(--font-b);padding:6px 10px;border-radius:999px;background:color-mix(in srgb,var(--text) 9%,transparent);color:var(--text);white-space:nowrap}
.chip::before{content:"";width:7px;height:7px;border-radius:9px;background:var(--c,var(--idea))}
.live{--c:var(--ok)} .pilot{--c:var(--pilot)} .idea{--c:var(--idea)} .partner{--c:#6FA8DC}
.screen{border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:#0F0F1D;box-shadow:0 30px 70px -30px rgba(0,0,0,.75)}
.screen img{width:100%;height:100%;object-fit:cover;object-position:top left}

/* proposal notes (not part of the site) */
.chrome{position:sticky;top:env(safe-area-inset-top,0px);z-index:80;background:#0A0A12;color:#CFCDE0;font:500 12.5px/1.35 var(--font-b);border-bottom:1px solid #25253A}
.chrome .in{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding:8px clamp(16px,3vw,28px)}
.chrome b{color:#fff}
.chrome button{background:transparent;border:1px solid #3A3A55;color:#DAD8EA;border-radius:999px;padding:6px 12px;font:500 12.5px var(--font-b);cursor:pointer}
.chrome button[aria-pressed="true"]{background:var(--orange);color:var(--ink);border-color:var(--orange)}
.chrome span.n{color:#8E8CA6;flex:1 1 280px}
@media (max-width:700px){.chrome span.n{display:none}.chrome .in{flex-wrap:nowrap;padding-block:7px}.chrome b{font-size:12px}}
.note{display:none;font:500 12px/1.45 var(--font-b);color:#E9E7F3;background:#0A0A12;border:1px solid #3A3A55;border-left:3px solid var(--orange);border-radius:8px;padding:8px 12px;max-width:560px;margin-bottom:18px}
body.notes .note{display:block}

/* header */
.hdr{position:sticky;top:calc(env(safe-area-inset-top,0px) + 42px);z-index:70;background:#1A1A2E;border-bottom:1px solid rgba(255,255,255,.08)}
.hdr .in{display:flex;align-items:center;gap:26px;height:66px}
.logo{font:400 22px/1 var(--font-h);color:#fff;text-decoration:none;white-space:nowrap}
.logo i{font-style:normal;color:var(--orange)}
.nav{display:flex;gap:26px;margin-left:auto;font-size:15px}
.nav a{color:#D6D4E4;text-decoration:none} .nav a:hover{color:#fff}
.menu{display:none;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:999px;padding:8px 14px;font:500 14px var(--font-b)}
@media (max-width:920px){.nav{display:none}.menu{display:inline-block;margin-left:10px}.hdr .btn{margin-left:auto;padding:10px 14px;font-size:14px}}

/* hero (as live) */
.hero{background:radial-gradient(90% 120% at 50% 0%,#2A2346 0%,var(--ink) 60%);text-align:center;padding-block:clamp(72px,11vw,140px) clamp(56px,8vw,96px)}
.hero .wrap{display:grid;justify-items:center;gap:20px}
.hero .lede{margin-inline:auto;color:#CFCDE0}
.pill{font:500 12px/1 var(--font-b);padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.2);color:#E6E4F2}
.scrollhint{font:500 12px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d);margin-top:10px}

/* ---------- the world ---------- */
.track{height:calc(472svh - 43px);position:relative;background:var(--ink)}
.stage{position:sticky;top:calc(env(safe-area-inset-top,0px) + 108px);height:calc(100svh - 108px);overflow:hidden;background:var(--ink)}
#c{display:block;width:100%;height:100%}
.rail{position:absolute;top:14px;left:clamp(16px,3vw,28px);display:flex;gap:6px;z-index:4}
.rail b{width:22px;height:4px;border-radius:99px;background:rgba(255,255,255,.25)} .rail b.on{background:var(--orange)}
.side{position:absolute;top:10px;right:clamp(16px,3vw,28px);display:flex;gap:8px;z-index:4;font:600 10.5px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase}
.side b{padding:6px 10px;border-radius:99px;background:rgba(255,255,255,.08);color:#C9C7DA} .side b.on{background:var(--orange);color:var(--ink)}
.scrim{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(18,18,31,.18),rgba(18,18,31,.72) 40%,rgba(18,18,31,.93)),linear-gradient(to left,rgba(18,18,31,.55),rgba(18,18,31,0) 45%);opacity:0;transition:opacity .35s ease;pointer-events:none;z-index:2}
.stage.showing .scrim{opacity:1}
.show{position:absolute;left:0;right:0;bottom:clamp(18px,4vh,40px);z-index:3;display:grid;grid-template-columns:minmax(0,680px) minmax(0,400px);gap:40px;justify-content:center;align-items:end;padding-inline:clamp(16px,3vw,28px);
  opacity:0;transform:translateY(12px);transition:opacity .35s ease,transform .35s ease;pointer-events:none}
.show.on{opacity:1;transform:none;pointer-events:auto}
.show.full{grid-template-columns:minmax(0,1120px)}
.vis{height:min(52vh,470px);position:relative}
.panel{display:grid;gap:12px;align-content:end;color:var(--text-d)}
.seal{font:600 11px/1.3 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#C9C7DA;display:flex;gap:8px;align-items:center}
.seal::before{content:"";width:14px;height:14px;border-radius:4px;border:2px solid var(--orange)}
.panel h2{font-size:clamp(30px,3.2vw,46px);line-height:1.05;color:#fff;text-shadow:0 2px 16px rgba(10,10,20,.6)}
.panel .promise{font-size:clamp(16px,1.4vw,20px);color:#D8D6E6;line-height:1.45}
.promise.mob{display:none}@media (max-width:900px){.promise.mob{display:block}}
.rows{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:10px}
.rows li{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:baseline;padding-top:10px;border-top:1px solid rgba(255,255,255,.12)}
.rows b{font:600 17px/1.3 var(--font-b);color:#fff}
.rows span.d{grid-column:1/-1;font-size:15.5px;color:#C4C2D6;line-height:1.45}
.bul{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:9px}
.bul li{display:flex;gap:11px;font-size:17px;line-height:1.45;color:#E4E2EF}
.bul li::before{content:"";flex:none;width:8px;height:8px;margin-top:9px;border-radius:2px;background:#8E8AAE}
.bul li.h::before{background:var(--orange);border-radius:9px}
.more{font-weight:600;font-size:15px;color:#fff;text-decoration:none} .more::after{content:" →";color:var(--orange)}

/* station 1: the living org */
.org{height:100%;border-radius:14px;background:linear-gradient(160deg,rgba(35,35,58,.96),rgba(22,22,38,.96));border:1px solid rgba(255,255,255,.12);padding:18px 20px;display:grid;grid-template-rows:auto auto 1fr auto;gap:12px;box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.org .top{display:flex;justify-content:center}
.node-h{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:999px;border:2px solid var(--orange);color:#fff;font:600 14px var(--font-b);background:rgba(224,122,58,.12)}
.node-h i{width:22px;height:22px;border-radius:50%;background:var(--orange);display:block;position:relative}
.node-h i::after{content:"";position:absolute;left:50%;top:5px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#1A1A2E}
.dirs{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.dir{font:500 12px/1.2 var(--font-b);color:#DAD8EA;padding:8px 9px;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:6px;animation:lit 6s infinite;animation-delay:calc(var(--i)*.35s)}
.dir small{color:#9C9AB6;font-size:11px}
.dir.hot{border-color:rgba(224,122,58,.6);background:rgba(224,122,58,.12);color:#fff}
@keyframes lit{0%,70%,100%{box-shadow:none}78%{box-shadow:0 0 0 2px rgba(139,114,212,.55)}}
.line{position:relative;align-self:center;padding:22px 6px 8px}
.line .lbl{font:600 11px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#AEACC3;margin-bottom:14px;display:block}
.track-l{position:relative;height:36px;display:flex;justify-content:space-between;align-items:center}
.track-l::before{content:"";position:absolute;left:14px;right:14px;top:50%;height:2px;background:rgba(255,255,255,.18)}
.st{position:relative;z-index:1;width:30px;height:30px;border-radius:9px;background:#34345A;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;font:600 11px var(--font-b);color:#E6E4F2}
.st.gate{border-radius:50%;background:var(--orange);color:var(--ink);border-color:var(--orange);box-shadow:0 0 0 6px rgba(224,122,58,.18)}
.st-l{display:flex;justify-content:space-between;font-size:11.5px;color:#AEACC3;margin-top:8px}
.st-l span{width:72px;text-align:center;margin-inline:-21px} .st-l span:first-child{text-align:left;margin-left:0}.st-l span:last-child{text-align:right;margin-right:0}
.st-l span.g{color:#F4B489;font-weight:600}
.case{position:absolute;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:4px;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.7);left:8px;animation:walk 7s ease-in-out infinite;z-index:2}
@keyframes walk{0%{left:8px}14%{left:24%}28%{left:24%}42%{left:48%}52%{left:48%}64%{left:74%}92%{left:74%}100%{left:calc(100% - 22px)}}
.stats{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:#C9C7DA;border-top:1px solid rgba(255,255,255,.1);padding-top:10px}
.stats b{font:400 20px/1 var(--font-h);color:#fff;margin-right:6px}

/* station 2: solutions */
.sol{height:100%;position:relative}
.sol .main{position:absolute;left:0;top:0;width:62%;height:100%}
.sol .main img{object-position:top center}
.sol .second{position:absolute;right:0;top:6%;width:44%;height:46%}
.agents{position:absolute;right:0;bottom:0;width:44%;border-radius:12px;background:rgba(26,26,46,.95);border:1px solid rgba(255,255,255,.14);padding:12px 14px;display:grid;gap:8px}
.agents .t{font:600 11px/1 var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:#AEACC3}
.flow{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}
.flow .o{font:600 11.5px/1.2 var(--font-b);padding:7px 8px;border-radius:8px;background:#34345A;color:#fff;text-align:center}
.flow .o.out{background:rgba(63,163,122,.18);border:1px solid rgba(63,163,122,.5)}
.five{display:grid;gap:4px}
.five span{font:500 11px/1.2 var(--font-b);padding:4px 7px;border-radius:6px;background:rgba(255,255,255,.07);color:#E4E2EF;animation:pulse 4s infinite;animation-delay:calc(var(--i)*.18s)}
@keyframes pulse{0%,60%,100%{background:rgba(255,255,255,.07)}70%{background:rgba(139,114,212,.35)}}
.cap-s{position:absolute;left:10px;bottom:10px;font:600 11px/1 var(--font-b);padding:6px 9px;border-radius:999px;background:rgba(10,10,18,.8);color:#E6E4F2}

/* station 3: industry */
.ind{height:100%;display:grid}
.ind .big{position:relative;background:transparent;border:0;-webkit-mask-image:linear-gradient(to right,#000 84%,transparent);mask-image:linear-gradient(to right,#000 84%,transparent)}.ind .big img{object-fit:cover;object-position:top left}
.ind .ml{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;border:1px dashed rgba(255,255,255,.28);background:rgba(26,26,46,.9);font-size:14px;color:#DAD8EA}
.ind .ml b{color:#fff;font-weight:600}
.ind .ml img{width:56px;height:36px;object-fit:cover;border-radius:6px}

/* station 4: clareIA line */
.cla{height:100%;border-radius:14px;background:linear-gradient(160deg,rgba(35,35,58,.96),rgba(22,22,38,.96));border:1px solid rgba(255,255,255,.12);padding:22px 24px;display:grid;grid-template-rows:auto 1fr auto;gap:14px;box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.cla .brand{display:flex;align-items:center;gap:12px}
.cla .brand img{width:44px;height:44px;border-radius:10px}
.cla .brand b{font:400 26px/1 var(--font-h);color:#fff}
.cla .brand span{font-size:13px;color:#AEACC3}
.macro{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:stretch;align-self:center}
.macro::before{content:"";position:absolute;left:8%;right:8%;top:22px;height:2px;background:rgba(255,255,255,.18)}
.mstep{position:relative;display:grid;gap:8px;justify-items:center;text-align:center}
.mstep i{width:44px;height:44px;border-radius:12px;background:#34345A;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;font:600 13px var(--font-b);color:#fff;font-style:normal;position:relative;z-index:1}
.mstep.gate i{border-radius:50%;background:var(--orange);color:var(--ink);box-shadow:0 0 0 7px rgba(224,122,58,.18)}
.mstep b{font:600 15px/1.2 var(--font-b);color:#fff}
.mstep span{font-size:12.5px;color:#B9B7CC;line-height:1.35}
.piece{position:absolute;top:15px;width:16px;height:16px;border-radius:4px;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.7);left:10%;animation:piece 8s ease-in-out infinite;z-index:2}
@keyframes piece{0%{left:10%}20%{left:10%}35%{left:36%}45%{left:36%}58%{left:61%}82%{left:61%}100%{left:86%}}
.cla .foot{font-size:13px;color:#C4C2D6;border-top:1px solid rgba(255,255,255,.1);padding-top:10px}

.cla4{height:100%;display:grid;grid-template-columns:auto 1fr;gap:14px}
.piece-card{margin:0;height:100%;aspect-ratio:9/16;border-radius:14px;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.piece-card img{width:100%;height:100%;object-fit:cover}
.piece-card figcaption{position:absolute;left:8px;right:8px;bottom:8px;font:600 11px/1.3 var(--font-b);padding:6px 8px;border-radius:8px;background:rgba(10,10,18,.82);color:#F4B489}
.cla .macro{grid-template-columns:repeat(2,1fr);row-gap:22px}.cla .macro::before{display:none}.cla .piece{display:none}
/* station 5: continue */
.cont{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tile{border-radius:16px;padding:22px 24px;display:grid;gap:10px;align-content:start;background:rgba(26,26,46,.94);border:1px solid rgba(255,255,255,.14);min-height:250px}
.tile h3{font-size:clamp(26px,2.6vw,34px);color:#fff}
.tile p{color:#D2D0E1;font-size:16px}
.mods{display:flex;flex-wrap:wrap;gap:6px}
.mods span{font:600 11.5px/1 var(--font-b);padding:7px 8px;border-radius:7px;background:rgba(255,255,255,.08);color:#E6E4F2}
.mods span.hl{background:rgba(224,122,58,.2);color:#FFD2B3}
.links4{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.links4 a{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:#fff;text-decoration:none;font:500 15px var(--font-b)}
.links4 a::after{content:"→";color:var(--orange)}

/* mobile world */
@media (max-width:900px){
  .stage{top:calc(env(safe-area-inset-top,0px) + 108px)}
  .show,.show.full{grid-template-columns:1fr;gap:14px;bottom:12px;max-height:calc(100% - 40px)}
  .vis{height:min(31svh,260px)}
  .panel h2{font-size:30px}
  .panel .promise{font-size:16px}
  .bul li,.rows span.d{font-size:16px}
  .rows li.x,.bul li.x,.panel .promise.x{display:none}
  .sol .main{width:100%}.sol .second,.agents{display:none}.ind .big img{object-fit:cover;object-position:left top;width:170%;max-width:none}.cla{display:none}.cla4{grid-template-columns:1fr;justify-items:center}.piece-card{height:100%}
  .ind{grid-template-columns:1fr;grid-template-rows:1fr auto}.ind .big{grid-row:auto}.ind .sm{display:none}
  .dirs{grid-template-columns:repeat(3,1fr)}.dirs .dir:nth-child(n+7){display:none}
  .org{padding:12px;gap:8px}.stats{display:none}
  .macro{grid-template-columns:repeat(2,1fr);row-gap:16px}.macro::before{display:none}.piece{display:none}.mstep span{display:none}
  .cont{grid-template-columns:1fr}.tile{min-height:0;padding:16px}.tile p,.mods{display:none}
  .links4{grid-template-columns:1fr 1fr}
}

/* ---------- below the world ---------- */
.floor{height:64px;background:
  linear-gradient(to bottom,rgba(26,26,46,0),var(--deep)),
  repeating-conic-gradient(#2A2A48 0 25%,#23233A 0 50%) 0 0/48px 48px;}
.stn{display:inline-flex;align-items:center;gap:8px;font:600 11px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:var(--head)}
.stn i{width:12px;height:12px;border-radius:3px;background:var(--k)}
.pgroup{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(18px,2.4vw,32px);padding:clamp(20px,2.4vw,28px);border-radius:20px;background:#fff;border:1px solid var(--line-l);border-top:5px solid var(--k);margin-bottom:18px}
.pgroup.dk{background:var(--ink);border-color:rgba(255,255,255,.1);border-top-color:var(--k);--head:#fff;--muted:#C9C7DA;--text:#E4E2EF}
.feat{display:grid;gap:12px;align-content:start;text-decoration:none;color:var(--text)}
.feat .screen{aspect-ratio:16/9;border-color:rgba(0,0,0,.08)}
.feat h3{font-size:clamp(26px,2.6vw,34px)}
.feat p{color:var(--muted);font-size:16px}
.plist{list-style:none;margin:0;padding:0;display:grid;align-content:start}
.plist li{display:grid;grid-template-columns:64px 1fr;gap:4px 14px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.plist li:first-child{border-top:0;padding-top:4px}
.plist img{width:64px;height:44px;object-fit:cover;object-position:top left;border-radius:8px;grid-row:1/3}
.plist b{font:400 20px/1.2 var(--font-h);color:var(--head)}
.plist span.d{grid-column:2/3;font-size:14px;color:var(--muted)}
.gh2{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;grid-column:1/-1}
.gh2 h3{font-size:22px}
@media (max-width:900px){.pgroup{grid-template-columns:1fr}}
.facts{padding-block:30px;background:var(--deep);border-top:1px solid rgba(255,255,255,.06)}
.facts .g{display:grid;grid-template-columns:repeat(5,1fr)}
.fact{padding:4px 18px;border-left:1px solid rgba(255,255,255,.1);display:grid;gap:3px}
.fact:first-child{border-left:0;padding-left:0}
.fact b{font:400 30px/1.1 var(--font-h);color:#fff}
.fact span{font-size:14px;color:#DAD8EA}
.fact small{font-size:12px;color:#9C9AB6}
@media (max-width:900px){.facts .g{grid-template-columns:1fr 1fr;gap:16px 0}.fact:nth-child(odd){border-left:0;padding-left:0}}
.paths{display:grid;grid-template-columns:1.6fr 1fr;grid-template-rows:auto auto;gap:clamp(18px,2.4vw,32px)}
.paths article:first-child{grid-row:1/3;padding:22px;border-radius:18px;background:var(--ink);--head:#fff;--muted:#C9C7DA}
.paths article:first-child h3{font-size:30px}
.paths article:not(:first-child){grid-template-columns:160px 1fr;column-gap:16px;align-items:start}.paths article:not(:first-child) .screen{grid-row:1/5}
.paths article{display:grid;gap:12px;align-content:start}
.paths .screen{aspect-ratio:16/10;border-color:var(--line)}
.paths h3{font-size:24px}
.paths p{color:var(--muted);font-size:16px}
.paths a.m{font-weight:600;font-size:15px;text-decoration:none;color:var(--head)} .paths a.m::after{content:" →";color:var(--orange)}
@media (max-width:820px){.paths{grid-template-columns:1fr}.paths article:first-child{grid-row:auto}.paths article:not(:first-child){grid-template-columns:1fr}}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.duo{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.duo>div{padding:20px 22px;display:grid;gap:10px;align-content:start}
.duo>div+div{border-left:1px solid var(--line);background:rgba(224,122,58,.08)}
.duo h3{font-size:22px}
.duo ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;font-size:15.5px}
.duo li{display:flex;gap:10px}.duo li::before{content:"";flex:none;width:8px;height:8px;margin-top:8px;border-radius:2px;background:#8E8AAE}
.duo>div+div li::before{background:var(--orange);border-radius:9px}
@media (max-width:520px){.duo{grid-template-columns:1fr}.duo>div+div{border-left:0;border-top:1px solid var(--line)}}
.stack2{display:grid;gap:14px}.stack2 .screen{aspect-ratio:16/9}
.group{display:grid;grid-template-columns:220px 1fr;gap:24px;padding-block:22px;border-top:1px solid var(--line)}
.group:first-of-type{border-top:0}
.group .gh{display:grid;gap:6px;align-content:start}
.group .gh h3{font-size:22px}
.group .gh p{font-size:14px;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.card{border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--surf);text-decoration:none;color:var(--text);display:grid;grid-template-rows:auto 1fr}
.card .pic{aspect-ratio:16/10;overflow:hidden;background:#20203A;border-bottom:3px solid var(--k,var(--line))}
.card .pic img{width:100%;height:100%;object-fit:cover;object-position:top center}
.card .b{padding:12px 14px;display:grid;gap:6px;align-content:start}
.card b{font:400 19px/1.2 var(--font-h);color:var(--head)}
.card span{font-size:13.5px;color:var(--muted)}
.card.wide{grid-column:span 2}
@media (max-width:1000px){.group{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.cards{grid-template-columns:1fr}.card.wide{grid-column:auto}}
.journey{display:grid;grid-template-columns:repeat(11,1fr);gap:6px;margin-block:8px 26px}
.mod{padding:10px 8px;border-radius:10px;background:#fff;border:1px solid var(--line-l);display:grid;gap:4px;align-content:start;position:relative}
.mod b{font:600 12px/1 var(--font-b);color:#A5481A}
.mod span{font-size:12.5px;line-height:1.3;color:var(--text-l)}
.mod small{font-size:11px;color:var(--muted-l)}
.mod.core{border-color:rgba(224,122,58,.6);box-shadow:0 0 0 2px rgba(224,122,58,.12)}
@media (max-width:1000px){.journey{grid-template-columns:repeat(4,1fr)}}
@media (max-width:520px){.journey{grid-template-columns:repeat(2,1fr)}}
.instr{display:grid;grid-template-columns:300px 1fr auto;gap:clamp(20px,3vw,40px);align-items:center;padding:24px;border-radius:18px;background:var(--ink);color:var(--text-d)}
.instr img{width:100%;aspect-ratio:738/958;object-fit:cover;border-radius:12px}
.instr h3{font-size:28px;color:#fff}
.instr ul{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:8px;font-size:15.5px;color:#D6D4E4}
.instr li{display:flex;gap:10px}.instr li::before{content:"";flex:none;width:6px;height:6px;margin-top:9px;border-radius:9px;background:var(--orange)}
@media (max-width:900px){.instr{grid-template-columns:1fr}.instr img{max-width:260px}}
.offers{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.offers div{padding:16px;border-radius:12px;border:1px solid var(--line);display:grid;gap:6px;align-content:start}
.offers b{font:400 19px/1.2 var(--font-h);color:var(--head)}
.offers span{font-size:14px;color:var(--muted)}
@media (max-width:1000px){.offers{grid-template-columns:1fr 1fr}}
.form{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;max-width:560px}
.form input{flex:1 1 220px;min-width:0;padding:13px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--text-l);font:400 15px var(--font-b)}
.post{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,48px);align-items:center;padding:clamp(22px,3vw,34px);border-radius:18px;background:var(--ink-2);border:1px solid var(--line);text-decoration:none;color:var(--text)}
.quote{font:400 clamp(22px,2.3vw,28px)/1.3 var(--font-h);color:var(--head);border-left:3px solid var(--orange);padding-left:18px}
@media (max-width:800px){.post{grid-template-columns:1fr}}
.faq{display:grid;grid-template-columns:1fr 1.6fr;gap:clamp(24px,4vw,64px)}
details{border-bottom:1px solid var(--line);padding:16px 0}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;font-weight:500;font-size:17px;color:var(--head)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:300 24px/1 var(--font-b);color:var(--orange)}
details[open] summary::after{content:"–"}
details p{margin-top:10px;color:var(--muted);font-size:16px;max-width:64ch}
@media (max-width:800px){.faq{grid-template-columns:1fr}}
.cta{background:var(--orange);color:var(--ink);padding-block:clamp(60px,8vw,96px)}
.cta h2{color:var(--ink);max-width:22ch}
.cta p{color:#3A2414;max-width:60ch;font-size:18px;margin-top:14px}
.cta .row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px}
.cta .btn{background:var(--ink);color:#fff}
.cta small{font-size:14px;color:#3A2414}
.foot{background:var(--deep);color:#B7B5C9;padding-top:56px;overflow:hidden}
.foot .cols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.08)}
.foot h4{font:600 12px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:12px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:15px}
.foot a{text-decoration:none}.foot a:hover{color:#fff}
.foot .close{font:400 22px/1.3 var(--font-h);color:#fff;max-width:24ch;margin-top:14px}
.foot .legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-block:18px;font-size:13px}
.wm{font:400 clamp(60px,14vw,210px)/.8 var(--font-h);color:#1D1D31;white-space:nowrap;transform:translateY(14%)}
@media (max-width:800px){.foot .cols{grid-template-columns:1fr 1fr}.foot .cols>div:first-child{grid-column:1/-1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.track{height:auto}.stage{position:relative;height:auto;padding-block:20px}#c{height:50svh}.show{position:relative;opacity:1;transform:none;margin-top:18px}.show:not(.first){display:none}.scrim{display:none}}

/* ===== station windows (CEO 2026-09-22: open big, ~80% of the screen; real app screens in quadrants; no status badges) ===== */
.win{position:absolute;left:50%;top:50%;z-index:3;width:min(80vw,1560px);height:min(76%,940px);display:grid;grid-template-rows:auto minmax(0,1fr);
  border-radius:18px;overflow:hidden;background:rgba(16,16,28,.94);border:1px solid rgba(255,255,255,.14);box-shadow:0 50px 140px -30px rgba(0,0,0,.9);
  opacity:0;transform:translate(-50%,-46%) scale(.86);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.win.on{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
.wbar{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.1);font:600 12px/1 var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:#DAD8EA}
.wbar i{width:10px;height:10px;border-radius:50%;background:#3A3A5A}
.wbar i:first-child{background:var(--orange)}
.wbar span{margin-left:8px}
.wbar em{margin-left:auto;font-style:normal;color:#9C9AB6;display:flex;gap:8px;align-items:center}
.wbar em::before{content:"";width:12px;height:12px;border-radius:3px;border:2px solid var(--orange)}
.wbody{display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,21vw,380px);gap:clamp(14px,1.6vw,26px);padding:clamp(14px,1.6vw,24px);min-height:0}
.wbody.one{grid-template-columns:1fr}
.quads{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:clamp(10px,1vw,16px);min-height:0}
.quads.q3{grid-template-columns:.62fr 1fr;grid-template-rows:1fr 1fr}
.q{position:relative;margin:0;border-radius:12px;overflow:hidden;background:#fff;border:1px solid rgba(255,255,255,.12);min-height:0}
.q.dark{background:#1B1B30}
.q.tall{grid-row:span 2}
.q img{position:absolute;top:0;left:0;width:var(--z,122%);max-width:none;height:auto}
.q.pc img{width:100%;height:100%;object-fit:cover;object-position:top center}
.q figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;background:linear-gradient(to bottom,rgba(12,12,22,0),rgba(12,12,22,.94) 42%);color:#E6E4F2;font:400 clamp(13px,.95vw,15.5px)/1.4 var(--font-b)}
.q figcaption b{display:block;font:600 clamp(14px,1.05vw,17px)/1.3 var(--font-b);color:#fff;margin-bottom:2px}
.txt{display:grid;align-content:center;gap:16px;color:var(--text-d)}
.txt h2{font-size:clamp(30px,2.6vw,48px);line-height:1.04;color:#fff}
.txt p{font-size:clamp(16px,1.15vw,19px);line-height:1.5;color:#D2D0E1}
.txt .bul li{font-size:clamp(15.5px,1.05vw,17.5px)}
.txt .bul b{color:#fff;font-weight:600}
.org.mini{position:absolute;inset:0;border:0;border-radius:0;box-shadow:none;padding:12px 16px 104px;gap:8px;grid-template-rows:auto auto 1fr}
.org.mini .line{display:none}.org.mini .dirs{gap:8px}.org.mini .dir{font-size:13px;padding:10px 10px}.org.mini{padding-bottom:84px;align-content:center}
.org.mini .dir{font-size:11.5px;padding:7px 8px}
.agents.big{position:absolute;inset:0;border:0;border-radius:0;background:transparent;padding:16px 16px 80px;display:grid;align-content:center}
.agents.big .flow{grid-template-columns:auto auto 1fr auto;gap:10px}
.agents.big .five span{font-size:13px;padding:7px 10px}
.agents.big .o{font-size:13px;padding:10px}
.q.dark .macro{position:absolute;inset:0;padding:30px 18px 76px;display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:center}
.q.dark .macro::before{content:"";position:absolute;left:10%;right:10%;top:calc(50% - 38px);height:2px;background:rgba(255,255,255,.18)}
.piece-dot{position:absolute;top:calc(50% - 86px);width:16px;height:16px;border-radius:4px;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.7);left:9%;animation:pd 9s ease-in-out infinite;z-index:2}
@keyframes pd{0%,12%{left:9%}24%,30%{left:28%}42%,48%{left:47%}60%,82%{left:66%}100%{left:86%}}
.cont{height:100%}
.mods.big span{font-size:13px;padding:8px 10px}
@media (max-width:900px){
  .win{width:94vw;height:92%}
  .wbar em{display:none}
  .wbody{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:12px;padding:12px}
  .quads,.quads.q3{grid-template-columns:none;grid-template-rows:none;grid-auto-flow:column;grid-auto-columns:88%;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .q{scroll-snap-align:start}.q.tall{grid-row:auto}.q img{width:auto;height:100%;min-width:100%;object-fit:cover;object-position:top left}
  .q.dark .macro{grid-template-columns:repeat(3,1fr);row-gap:8px}.q.dark .macro::before,.piece-dot{display:none}.mstep span{display:none}
  .txt{gap:10px}.txt h2{font-size:28px}.txt p{font-size:15.5px}.txt .bul li.x,.txt .bul li:nth-child(n+3){display:none}
  .org.mini .dirs{grid-template-columns:repeat(3,1fr)}.org.mini .dir:nth-child(n+7){display:none}
  .agents.big .flow{grid-template-columns:1fr 1fr}.agents.big .five{grid-column:1/-1}
  .cont{grid-template-columns:1fr}.mods.big span:nth-child(n+5){display:none}
}
@media (prefers-reduced-motion:reduce){.win{position:relative;left:auto;top:auto;transform:none;opacity:1;width:auto;height:auto;margin:16px}.win:not(.first){display:none}}
.q.dark .macro .mstep span{display:none}.q.dark .macro .mstep b{font-size:14px}
.txt .bul li{display:block;position:relative;padding-left:20px}.txt .bul li::before{position:absolute;left:0;top:0;margin-top:9px}
.piece-dot{display:none!important}
.agents.big{padding:14px 16px 92px;align-content:center}.agents.big .five{gap:3px}.agents.big .five span{font-size:12.5px;padding:5px 9px}
@media (max-width:900px){.q figcaption{padding:16px 12px 10px;background:linear-gradient(to bottom,rgba(12,12,22,0),rgba(12,12,22,.94) 30%)}}
.agents.big .flow{display:grid;grid-template-columns:1fr;justify-items:center;gap:6px}
.agents.big .flow .o{min-width:150px}

.agents.big .five{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;width:100%}
.agents.big .five span{font-size:11.5px;padding:7px 5px;text-align:center}
@media (max-width:900px){.agents.big .five{grid-template-columns:repeat(3,1fr)}}
.agents.big{padding:12px 16px 62px}

/* management charts (inspired by the GPD tour; fictional data, generic units) */
.q.mg{background:#171729;display:grid;grid-template-rows:auto 1fr}
.mgt{font:600 12px/1 var(--font-b);letter-spacing:.1em;text-transform:uppercase;color:#C9C7DA;padding:14px 16px 6px}
.q.mg .chart{position:relative;min-height:0;padding:0 12px 70px}
.q.mg .chart svg{width:100%;height:100%;display:block}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:6px 16px}
.kp{border-radius:10px;border:1px solid rgba(255,255,255,.12);padding:10px 12px;display:grid;gap:2px;background:rgba(255,255,255,.04)}
.kp.good{background:rgba(63,163,122,.16);border-color:rgba(63,163,122,.5)}
.kp small{font:600 10.5px/1 var(--font-b);letter-spacing:.1em;text-transform:uppercase;color:#AEACC3}
.kp b{font:600 clamp(18px,1.7vw,28px)/1.1 var(--font-b);color:#fff}
.kp.good b{color:#7FD8AF}
.kp span{font-size:11.5px;color:#9C9AB6}
.units{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px 16px 72px;align-content:start}
.un{border-radius:8px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}
.un em{display:block;font:600 11px/1 var(--font-b);font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:#DAD8EA;background:rgba(255,255,255,.08);padding:7px 8px}
.un b{display:block;font:600 15px/1 var(--font-b);padding:9px 8px}
.un b.g{background:rgba(63,163,122,.22);color:#7FD8AF}.un b.r{background:rgba(211,93,75,.25);color:#F3A092}.un b.a{background:rgba(217,164,58,.2);color:#F1CD83}
@media (max-width:900px){.units{grid-template-columns:1fr 1fr}.kpis{gap:5px}.kp{padding:8px}}
.kp b{font-size:clamp(15px,1.35vw,26px)}.kp{padding:8px 10px}.kpis{gap:6px;padding:4px 14px}.units{padding:4px 14px 84px;gap:5px}.un b{font-size:13.5px;padding:7px 8px}.un em{padding:6px 8px}
.tile.img{padding:0;overflow:hidden;align-content:start}.tile.img>*:not(.art){margin-inline:22px}.tile.img>div:last-child{margin-bottom:20px}
.tile .art{height:clamp(140px,26vh,300px);overflow:hidden;margin:0 0 4px}.tile .art img{width:100%;height:100%;object-fit:cover}
.cont .tile p{display:none}
.links4 a{padding:10px 14px 10px 10px;gap:12px;justify-content:flex-start}.links4 a img{width:64px;height:40px;object-fit:cover;object-position:top left;border-radius:6px;flex:none}.links4 a::after{margin-left:auto}
.acad-art{border-radius:18px;overflow:hidden;margin-bottom:26px;aspect-ratio:21/7}.acad-art img{width:100%;height:100%;object-fit:cover}
.comm-art{border-radius:16px;overflow:hidden;margin-top:18px;aspect-ratio:16/8}.comm-art img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){.tile .art{height:120px}.links4 a img{display:none}}

/* ===== stations v4 — each stop its own format (CEO 2026-09-22 + Astra "the scene unfolds into a stage") ===== */
.stg{position:absolute;left:50%;top:50%;z-index:3;width:min(80vw,1560px);height:min(76%,920px);transform:translate(-50%,-50%);pointer-events:none;opacity:0;transition:opacity .35s ease}
.stg.on{opacity:1;pointer-events:auto}
.kick{font:600 12px/1 var(--font-b);letter-spacing:.16em;text-transform:uppercase;color:#C9C7DA;font-style:normal}
.kick.o{color:var(--orange)}
.stg h2{font-family:var(--font-h);font-weight:400;color:#fff;line-height:1.02;letter-spacing:-.01em}
.stg .pr{font:500 clamp(19px,1.6vw,27px)/1.3 var(--font-b);color:#fff}
.stg p{color:#D6D4E4;font-size:clamp(16px,1.15vw,19px);line-height:1.5}
/* s1 triptych */
.s1{display:grid;grid-template-columns:1fr 2.3fr 1fr;gap:14px;perspective:1600px}
.s1 .hero{margin:0;position:relative;border-radius:20px;overflow:hidden;background:#12121F;box-shadow:0 50px 120px -30px rgba(0,0,0,.9);transform:translateY(24px) scale(.6) rotateX(8deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.s1 .hero img{width:100%;height:100%;object-fit:cover}
.s1 .hero figcaption{position:absolute;left:0;right:0;bottom:0;padding:clamp(18px,2vw,32px);display:grid;gap:10px;justify-items:start;background:linear-gradient(to bottom,rgba(18,18,31,0),rgba(18,18,31,.88) 40%)}
.s1 h2{font-size:clamp(34px,3.4vw,62px);max-width:16ch}
.flap{border-radius:18px;background:rgba(22,22,38,.94);border:1px solid rgba(255,255,255,.12);padding:clamp(18px,1.8vw,28px);display:grid;align-content:center;gap:16px;transform:rotateY(80deg);opacity:0;transition:transform .55s cubic-bezier(.2,.8,.2,1) .18s,opacity .3s ease .18s}
.flap.fl{transform-origin:right center}.flap.fr{transform-origin:left center;transform:rotateY(-80deg);border-color:rgba(224,122,58,.45)}
.flap ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.flap li{font:500 clamp(16px,1.25vw,21px)/1.35 var(--font-b);color:#fff;padding-left:18px;position:relative}
.flap li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:2px;background:#8E8AAE}
.flap.fr li::before{background:var(--orange);border-radius:9px}
.s1.on .hero{transform:none}.s1.on .flap{transform:none;opacity:1}
/* s2 panorama with tabs */
.s2{display:grid;grid-template-rows:auto 1fr;border-radius:22px;overflow:hidden;background:#12121F;box-shadow:0 50px 120px -30px rgba(0,0,0,.9);clip-path:inset(0 50% 0 50% round 22px);transition:clip-path .7s cubic-bezier(.2,.8,.2,1),opacity .3s}
.s2.on{clip-path:inset(0 0 0 0 round 22px)}
.tabs{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.1);flex-wrap:wrap}
.tabs .kick{margin-right:auto}
.tabs button{font:600 15px/1 var(--font-b);color:#DAD8EA;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:10px 16px;cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.pane{display:none;grid-template-columns:1.7fr 1fr;min-height:0}
.pane.on{display:grid;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.pane img{width:100%;height:100%;object-fit:cover;min-height:0}
.say{padding:clamp(20px,2.4vw,40px);display:grid;align-content:center;gap:14px;justify-items:start}
.say h2,.say4 h2{font-size:clamp(34px,3.2vw,58px)}
/* s3 control wall */
.s3{display:grid;grid-template-rows:auto 1fr auto;gap:12px}
.wallhead{display:grid;gap:8px}
.wallhead h2{font-size:clamp(28px,2.6vw,46px);text-shadow:0 2px 20px rgba(0,0,0,.7)}
.wall{display:grid;grid-template-columns:1.25fr 1fr .9fr;grid-template-rows:1fr 1fr;gap:12px;min-height:0}
.wall .tile{margin:0;border-radius:16px;overflow:hidden;position:relative;opacity:0;transform:scale(.85) translateY(20px);transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .4s;box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.s3.on .wall .tile{opacity:1;transform:none}
.wall .t1{grid-row:1;grid-column:1}.wall .t2{grid-row:1;grid-column:2}.wall .t3{grid-row:2;grid-column:1/3}.wall .t4{grid-row:1;grid-column:3}.wall .t5{grid-row:2;grid-column:3}
.s3.on .t2{transition-delay:.08s}.s3.on .t3{transition-delay:.16s}.s3.on .t4{transition-delay:.24s}.s3.on .t5{transition-delay:.32s}
.wall .q.mg .chart{padding:0 12px 12px}.wall .units{padding:4px 14px 14px}
.card-img{display:block;text-decoration:none;background:#12121F}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-img span{position:absolute;left:0;right:0;bottom:0;padding:16px;background:linear-gradient(to bottom,rgba(12,12,22,0),rgba(12,12,22,.92) 45%);color:#D6D4E4;font:400 clamp(13.5px,1vw,16px)/1.4 var(--font-b)}
.card-img b{display:block;font:400 clamp(20px,1.6vw,28px)/1.15 var(--font-h);color:#fff;margin-bottom:4px}
.also{font-size:14px!important;color:#AEACC3!important;text-shadow:0 1px 10px rgba(0,0,0,.8)}
/* s4 giant phone */
.s4{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,56px);align-items:center}
.phones{position:relative;height:100%;display:grid;place-items:center}
.phone{position:absolute;height:100%;aspect-ratio:9/18.5;border-radius:36px;background:#0B0B14;border:8px solid #22223A;box-shadow:0 60px 140px -30px rgba(0,0,0,.95);overflow:hidden;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .4s}
.phone img{width:100%;height:100%;object-fit:cover;object-position:top center}
.phone.front{transform:translateY(60%) rotate(-4deg)}.phone.back{height:82%;transform:translate(10%,60%) rotate(8deg);opacity:.0;filter:saturate(.8)}
.s4.on .phone.front{transform:translateX(-12%) rotate(-4deg)}.s4.on .phone.back{transform:translate(36%,4%) rotate(8deg);opacity:.9}
.say4{display:grid;gap:14px;justify-items:start;opacity:0;transform:translateX(30px);transition:transform .6s cubic-bezier(.2,.8,.2,1) .15s,opacity .4s .15s}
.s4.on .say4{opacity:1;transform:none}
.steps4{list-style:none;margin:4px 0;padding:0;display:grid;gap:10px}
.steps4 li{display:flex;align-items:center;gap:12px;font:500 clamp(16px,1.2vw,20px)/1.3 var(--font-b);color:#fff}
.steps4 i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font:600 13px var(--font-b);font-style:normal;background:#2C2C47;border:1px solid rgba(255,255,255,.18)}
.steps4 li.g{color:#FFD2B3}.steps4 li.g i{border-radius:50%;background:var(--orange);color:var(--ink);border-color:var(--orange);box-shadow:0 0 0 6px rgba(224,122,58,.2)}
/* s5 two doors */
.s5{display:grid;grid-template-rows:1fr auto;gap:12px;perspective:1800px}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-height:0}
.door{position:relative;display:block;border-radius:20px;overflow:hidden;text-decoration:none;box-shadow:0 50px 120px -30px rgba(0,0,0,.9);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.door.dl{transform-origin:left center;transform:rotateY(35deg)}.door.dr{transform-origin:right center;transform:rotateY(-35deg)}
.s5.on .door{transform:none}
.door img{width:100%;height:100%;object-fit:cover}
.door span{position:absolute;left:0;right:0;bottom:0;padding:clamp(18px,2vw,30px);display:grid;gap:8px;justify-items:start;background:linear-gradient(to bottom,rgba(12,12,22,0),rgba(12,12,22,.92) 40%);color:#D6D4E4;font:400 clamp(15px,1.1vw,18px)/1.4 var(--font-b)}
.door b{font:400 clamp(28px,2.6vw,46px)/1.05 var(--font-h);color:#fff}
.door i.btn{font-style:normal;margin-top:6px}
.s5 .links4{grid-column:auto}
.s5 .links4 a{padding:10px 14px 10px 10px;gap:12px;justify-content:flex-start}.s5 .links4 a img{width:64px;height:40px;object-fit:cover;border-radius:6px;flex:none}.s5 .links4 a::after{margin-left:auto}
@media (max-width:900px){
  .stg{width:94vw;height:90%}
  .s1{grid-template-columns:1fr}.s1 .flap{display:none}.s1 h2{font-size:30px}
  .pane{grid-template-columns:1fr;grid-template-rows:42% 1fr}.say{padding:16px;gap:8px}.say h2,.say4 h2{font-size:30px}.say p:not(.pr){display:none}.tabs .kick{display:none}.tabs button{padding:8px 12px;font-size:13.5px}
  .wall{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.wall .t2,.wall .t3{display:none}.wall .t1{grid-column:1/-1;grid-row:1}.wall .t4{grid-row:2;grid-column:1}.wall .t5{grid-row:2;grid-column:2}.wallhead h2{font-size:26px}.also{display:none}
  .s4{grid-template-columns:1fr;grid-template-rows:48% auto;gap:12px}.phone.back{display:none}.s4.on .phone.front{transform:rotate(-3deg)}.steps4{display:none}
  .doors{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.door b{font-size:24px}.s5 .links4{display:none}
}
@media (prefers-reduced-motion:reduce){.stg{position:relative;left:auto;top:auto;transform:none;opacity:1;width:auto;height:70svh;margin:16px}.stg:not(.first){display:none}.stg *{transition:none!important;transform:none!important;opacity:1!important;clip-path:none!important}}
.s1{grid-template-columns:.78fr 2.7fr .78fr}
.s1 .hero img{object-position:center 58%}
.mseq{display:none;font:500 16px/1.4 var(--font-b)!important;color:#fff!important}.mseq b{color:#FFD2B3;font-weight:600}
.phone{height:86%}
.demo{font-style:normal;margin-left:10px;font:600 10px/1 var(--font-b);letter-spacing:.1em;color:#9C9AB6;border:1px solid rgba(255,255,255,.2);padding:3px 6px;border-radius:5px}
.q.mg .callout{position:absolute;right:14px;top:44px;width:min(260px,40%);display:grid;gap:4px;padding:12px 14px;border-radius:12px;background:rgba(224,122,58,.14);border:1px solid rgba(224,122,58,.55)}
.callout b{font:600 16px/1.25 var(--font-b);color:#fff}.callout span:last-child{font-size:13px;color:#E6E4F2}
.wall .q.mg.t3 .chart{padding-right:min(290px,42%)}
@media (max-width:900px){.s1 .hero img{object-position:center 62%;transform:scale(1.35)}.mseq{display:block}.wall .t1{grid-row:1}.phone{height:100%}}
@media (max-width:900px){.s1{grid-template-columns:1fr}.q.mg .callout{position:static;width:auto;margin:0 14px}}
.instr{grid-template-columns:auto 1fr auto}.instr img.av{width:96px;height:96px;aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:center 22%;border:3px solid rgba(224,122,58,.6)}
.about2{background:var(--deep)}.ab{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.ab .note{grid-column:1/-1}
.abph{margin:0;position:relative}.abph img{width:100%;aspect-ratio:738/958;object-fit:cover;border-radius:22px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.abph figcaption{position:absolute;left:16px;bottom:16px;font:600 12px/1 var(--font-b);letter-spacing:.1em;text-transform:uppercase;padding:8px 12px;border-radius:999px;background:rgba(10,10,18,.8);color:#fff}
.abtx{display:grid;gap:16px;justify-items:start}.abtx p{color:#C9C7DA;font-size:17px;max-width:62ch}
.abtx p.big{font:400 clamp(21px,1.8vw,27px)/1.35 var(--font-h);color:#fff;border-left:3px solid var(--orange);padding-left:18px}
.abfacts{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}.abfacts li{font:500 13.5px/1 var(--font-b);padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.16);color:#E6E4F2}
@media (max-width:820px){.ab{grid-template-columns:1fr}.abph{max-width:300px}.instr{grid-template-columns:1fr}}

/* ===== v5: real products, professional (CEO 2026-09-22 night) ===== */
.orgh{background:linear-gradient(160deg,#1E1E36,#141426)!important}
.og{position:absolute;inset:0 0 38% 0;padding:clamp(16px,2vw,30px);display:grid;grid-template-rows:auto 1fr auto;gap:14px}
.og-top{display:flex;flex-direction:column;align-items:center;gap:6px}
.og-h{display:flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;border:2px solid var(--orange);background:rgba(224,122,58,.12);color:#fff;font:600 clamp(14px,1.1vw,17px) var(--font-b)}
.og-h i{width:20px;height:20px;border-radius:50%;background:var(--orange)}
.og-sub{font-size:12.5px;color:#AEACC3;letter-spacing:.04em}
.og-dirs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;align-content:center}
.og-dirs span{font:500 clamp(11.5px,.85vw,13.5px)/1.2 var(--font-b);color:#DAD8EA;padding:10px 10px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:6px;animation:lit 6s infinite}
.og-dirs span:nth-child(3n){animation-delay:1.2s}.og-dirs span:nth-child(3n+1){animation-delay:2.4s}
.og-dirs b{color:#8E8CA6;font-weight:600}
.og-dirs span.hot{border-color:rgba(224,122,58,.5);color:#fff}
.og-dirs span.gh{visibility:hidden}
.og-line{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding-top:6px}
.og-line::before{content:"";position:absolute;left:6%;right:6%;top:calc(50% + 3px);height:2px;background:rgba(255,255,255,.16)}
.og-line .st{position:relative;z-index:1;text-align:center;font:600 12px/1.2 var(--font-b);color:#E6E4F2;padding:9px 6px;border-radius:9px;background:#2C2C47;border:1px solid rgba(255,255,255,.14)}
.og-line .st.gate{background:var(--orange);color:var(--ink);border-color:var(--orange);box-shadow:0 0 0 6px rgba(224,122,58,.18)}
.og-case{position:absolute;z-index:2;top:calc(50% - 4px);width:14px;height:14px;border-radius:4px;background:#fff;box-shadow:0 0 12px #fff;left:6%;animation:ogc 8s ease-in-out infinite}
@keyframes ogc{0%,8%{left:6%}20%,26%{left:26%}38%,44%{left:46%}56%,80%{left:66%}100%{left:88%}}
/* lab */
.lab{display:grid;grid-template-columns:1.45fr 1fr;gap:clamp(18px,2.4vw,40px);align-items:center}
.fan{position:relative;height:100%;perspective:2000px}
.bw{position:absolute;margin:0;width:82%;left:9%;top:10%;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 40px 100px -30px rgba(0,0,0,.9);transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .4s,filter .4s;transform-origin:center}
.bwbar{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#EDEBF3;border-bottom:1px solid #DAD8E6}
.bwbar i{width:9px;height:9px;border-radius:50%;background:#C9C6D6}.bwbar span{margin-left:10px;font:500 11.5px var(--font-b);color:#6B6880;background:#fff;padding:3px 10px;border-radius:6px}
.bw img{width:100%;display:block}
.bw.pos-l{transform:translateX(-18%) translateY(6%) rotateY(18deg) scale(.82);filter:brightness(.55);z-index:1}
.bw.pos-r{transform:translateX(18%) translateY(6%) rotateY(-18deg) scale(.82);filter:brightness(.55);z-index:1}
.bw.front{transform:none;filter:none;z-index:3}
.lab .fan .bw{opacity:0}.lab.on .fan .bw{opacity:1}
.labtx{display:grid;gap:14px;align-content:center}
.labtx h2{font-size:clamp(30px,2.6vw,46px)}
.picker{display:grid;gap:8px}
.picker button{display:flex;justify-content:space-between;align-items:baseline;gap:10px;text-align:left;padding:12px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#fff;cursor:pointer;font:inherit}
.picker button b{font:400 clamp(20px,1.6vw,26px)/1.1 var(--font-h)}.picker button span{font:500 12.5px var(--font-b);color:#AEACC3}
.picker button[aria-selected="true"]{border-color:var(--orange);background:rgba(224,122,58,.12)}
.bdesc{display:none;gap:10px}.bdesc.on{display:grid;animation:fadeIn .3s ease}
.inside{margin:0;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.14);position:relative;max-height:22vh}
.inside img{width:100%;display:block}
.inside figcaption{position:absolute;left:0;right:0;bottom:0;padding:18px 12px 8px;font:600 12.5px/1.3 var(--font-b);color:#fff;background:linear-gradient(transparent,rgba(12,12,22,.9) 50%)}
/* gpd light */
.gpd{display:grid;grid-template-columns:.8fr 1.4fr;gap:clamp(18px,2.4vw,40px);align-items:center}
.gtx{display:grid;gap:14px;justify-items:start}.gtx h2{font-size:clamp(30px,2.6vw,46px)}
.gl{list-style:none;margin:0;padding:0;display:grid;gap:8px}.gl li{font-size:clamp(14.5px,1vw,16.5px);color:#D6D4E4}.gl b{color:#fff;font-weight:600}
.gapp{height:100%;border-radius:18px;background:#F4F6FA;box-shadow:0 50px 120px -30px rgba(0,0,0,.9);padding:0 18px 18px;display:grid;grid-template-rows:auto auto auto auto 1fr;gap:12px;overflow:hidden;color:#1B2433;opacity:0;transform:translateY(30px) scale(.94);transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .4s}
.gpd.on .gapp{opacity:1;transform:none}
.gbar{display:flex;justify-content:space-between;align-items:center;margin:0 -18px;padding:10px 18px;background:#1F2A44;color:#fff;font:600 13px var(--font-b);letter-spacing:.08em}.gbar em{font-style:normal;font-weight:500;font-size:11px;color:#C6CEE0;letter-spacing:.06em}
.gpill{justify-self:center;background:#0B0F19;color:#fff;font:700 clamp(14px,1.2vw,19px)/1 var(--font-b);padding:10px 26px;border-radius:12px}
.gkpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:80%;justify-self:center;width:100%}
.gkpi .k{background:#fff;border:1px solid #DCE2EC;border-radius:10px;padding:10px;text-align:center;display:grid;gap:2px}
.gkpi .k.v{background:#E3F8EC;border-color:#9BD8B3}.gkpi small{font:600 10.5px var(--font-b);letter-spacing:.1em;text-transform:uppercase;color:#4A5568}.gkpi .k.v small,.gkpi .k.v b{color:#177A43}
.gkpi b{font:800 clamp(17px,1.6vw,26px)/1.1 var(--font-b)}.gkpi span{font-size:11px;color:#6B7485}
.gunits{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gu h4{margin:0 0 6px;font:700 11.5px/1 var(--font-b);letter-spacing:.14em;text-align:center;color:#fff;background:linear-gradient(#6E7890,#57617A);padding:9px;border-radius:8px}
.gu .r{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border:1px solid #DCE2EC;border-radius:8px;overflow:hidden}
.gu .r span{font:700 clamp(11px,.85vw,13.5px)/1 var(--font-b);text-align:center;padding:10px 4px}
.vg{background:#1FA85A;color:#fff}.vr{background:#E77D7D;color:#fff}.vg2{background:#8FD6AE;color:#0F4F2C}.vl{background:#FCE3E3;color:#9B2C2C}
.gbottom{display:grid;grid-template-columns:1.4fr 1fr;gap:10px;min-height:0}
.gch,.grank{background:#fff;border:1px solid #DCE2EC;border-radius:10px;padding:10px 12px;display:grid;grid-template-rows:auto 1fr;min-height:0}
.gch small,.grank small{font:700 11px var(--font-b);letter-spacing:.08em;text-transform:uppercase;color:#1B2433;text-align:center}
.grank ol{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px;align-content:start}
.grank li{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;font:500 clamp(11.5px,.85vw,13px)/1.2 var(--font-b);padding:6px 8px;border-radius:6px;background:#F7F9FC}
.grank li:nth-child(-n+3){background:#E3F8EC}
.grank em{font-style:normal;font:700 9.5px var(--font-b);color:#177A43;background:#C7EFD7;padding:3px 5px;border-radius:4px}.grank li:nth-child(n+4) em{display:none}.grank li:nth-child(n+4){grid-template-columns:1fr auto}
.grank b{font-weight:700}
.chart.light{position:relative;min-height:0}.chart.light svg{width:100%;height:100%}
/* doors editorial */
.door.ed{background:linear-gradient(160deg,#1E1E36,#131324);border:1px solid rgba(255,255,255,.12);padding:clamp(20px,2.4vw,36px);display:grid;gap:14px;align-content:center;justify-items:start;color:#D6D4E4}
.door.ed b{font:400 clamp(28px,2.6vw,44px)/1.05 var(--font-h);color:#fff}
.door.ed .dtx{font-size:clamp(15px,1.1vw,18px);max-width:44ch}
.jl{display:grid;grid-template-columns:repeat(11,1fr);gap:0;width:100%;position:relative;margin:6px 0}
.jl::before{content:"";position:absolute;left:4%;right:4%;top:50%;height:2px;background:rgba(255,255,255,.2)}
.jl i{position:relative;z-index:1;justify-self:center;font-style:normal;font:600 10.5px var(--font-b);color:#E6E4F2;background:#2C2C47;border:1px solid rgba(255,255,255,.18);border-radius:7px;padding:6px 4px}
.jl i.g{background:var(--orange);color:var(--ink);border-color:var(--orange)}
.by{display:flex;align-items:center;gap:10px;font:500 14px var(--font-b);color:#fff}.by img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center 20%;border:2px solid rgba(224,122,58,.7)}
.brief{display:grid;gap:8px;width:100%;background:#F7F6FB;color:#2D2D3F;border-radius:14px;padding:clamp(14px,1.6vw,22px);box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.brief em{font-style:normal;font:700 11px var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#A5481A;border-bottom:1px solid #E4E2EC;padding-bottom:8px}
.brief strong{font:400 clamp(22px,1.9vw,30px)/1.15 var(--font-h);color:#1A1A2E}
.brief span{font-size:clamp(13.5px,1vw,15.5px);color:#565E6C}.brief .bt{font:600 12px var(--font-b);color:#1A1A2E;padding-top:6px;border-top:1px solid #E4E2EC}
.s5 .links4 a{justify-content:space-between;padding:13px 16px}
@media (max-width:900px){
  .og{inset:0 0 44% 0;padding:12px}.og-dirs{grid-template-columns:repeat(3,1fr)}.og-dirs span:nth-child(n+7){display:none}.og-line{display:none}
  .lab{grid-template-columns:1fr;grid-template-rows:38% auto}.bw{width:92%;left:4%;top:4%}.inside{display:none}.labtx h2{font-size:24px}.picker button{padding:8px 12px}.picker button b{font-size:18px}
  .gpd{grid-template-columns:1fr;grid-template-rows:auto 1fr}.gtx .gl,.gtx p{display:none}.gtx h2{font-size:24px}.gunits{grid-template-columns:1fr 1fr}.gbottom{display:none}.gkpi{max-width:100%}
  .door.ed{padding:16px;gap:8px}.door.ed .dtx,.jl,.brief span:not(.bt){display:none}.brief strong{font-size:18px}
}
.door.ed span{position:static;background:none;padding:0}
.door.ed>span.kick{display:block}.door.ed .dtx{display:block;color:#D6D4E4}
.door.ed .brief{display:grid}.door.ed .brief span{display:block}
.door.ed .jl{display:grid}.door.ed .by{display:flex}
.door.ed{transform:none}
.bw{top:6%;width:84%;left:8%}.bw img{height:auto}
.fan{height:92%;align-self:center}
.og{inset:0 0 44% 0}.orgh figcaption{padding-top:10px}
@media (max-width:900px){.door.ed .dtx,.door.ed .jl,.door.ed .brief>span:not(.bt){display:none}}
.door.ed .brief{background:#F7F6FB;padding:clamp(14px,1.6vw,22px);border-radius:14px}
.door.ed .brief em{display:block}
.bw{aspect-ratio:16/10.4;display:grid;grid-template-rows:auto 1fr}.bw img{width:100%;height:100%;object-fit:cover;object-position:top center;min-height:0}
.stage.showing .scrim{opacity:1}.scrim{background:linear-gradient(to bottom,rgba(14,14,26,.55),rgba(14,14,26,.8) 45%,rgba(14,14,26,.94))!important}
.val{font:500 clamp(15px,1.1vw,18px)/1.45 var(--font-b)!important;color:#F4B489!important}
.inside{max-height:24vh}.inside img{object-fit:cover;object-position:top;max-height:24vh}.inside figcaption{font-size:14px}
.jl i{font-size:12px;padding:8px 5px}.by{font-size:15px}.by img{width:48px;height:48px}
@media (max-width:900px){
  .stg{height:auto;max-height:92%;top:52%}
  .s1 .hero{display:grid;grid-template-rows:auto auto}.og{position:static;padding:14px 12px 0}.og-dirs{gap:6px}.s1 .hero figcaption{position:static;background:none}
  .gapp{height:auto}.gunits{padding-bottom:8px}
  .s2{height:auto}.lab{grid-template-rows:auto auto}.fan{height:auto;aspect-ratio:16/11}
  .val{font-size:14.5px!important}
}

/* ===== v7: GPD modernised (elegant), twin station, links, lint fixes ===== */
.gapp{background:linear-gradient(180deg,#FFFFFF,#F6F7FB);border:1px solid rgba(255,255,255,.6);font-variant-numeric:tabular-nums}
.gbar{background:linear-gradient(90deg,#1A1A2E,#26264A);letter-spacing:.12em}
.gpill{justify-self:start;background:none;color:#1A1A2E;padding:0;display:grid;gap:2px;border-radius:0}
.gpill span{font:600 11px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#7A8196}
.gpill b{font:400 clamp(20px,1.7vw,28px)/1.1 var(--font-h);color:#1A1A2E}
.gkpi{max-width:none;justify-self:stretch}
.gkpi .k{background:#fff;border:1px solid #E6E8F0;border-radius:14px;padding:12px 14px;text-align:left;box-shadow:0 1px 2px rgba(20,20,40,.04)}
.gkpi .k.v{background:linear-gradient(135deg,#ECFDF5,#FFFFFF);border-color:#A7F3D0}
.gkpi small{color:#7A8196}.gkpi .k.v small{color:#047857}
.gkpi b{font:700 clamp(18px,1.7vw,28px)/1.1 var(--font-b);color:#111827;letter-spacing:-.01em}.gkpi .k.v b{color:#047857}
.gkpi .k.v b::before{content:"▲ ";font-size:.6em;vertical-align:.2em}
.gu h4{background:none;color:#4B5163;text-align:left;padding:0 2px 6px;border-bottom:1px solid #E6E8F0;margin-bottom:8px;font-size:11px}
.gu .r{background:none;border:0;gap:6px;display:flex;align-items:center}
.gu .r span{padding:0;background:none;color:#6B7280;font-weight:600;font-size:clamp(11px,.8vw,12.5px)}
.gu .r span:first-child{padding:5px 9px;border-radius:999px;font-weight:700}
.vg,.vg2{background:#ECFDF5!important;color:#047857!important}.vr{background:#FFF1F2!important;color:#BE123C!important}.vl{background:#FFF7ED!important;color:#C2410C!important}
.gch,.grank{border:1px solid #E6E8F0;border-radius:14px;box-shadow:0 1px 2px rgba(20,20,40,.04)}
.gch small,.grank small{text-align:left;color:#4B5163}
.grank li{background:none!important;grid-template-columns:22px 1fr auto!important;position:relative;padding:7px 4px 9px;border-radius:0;border-bottom:1px solid #F0F1F5}
.grank li::after{content:"";position:absolute;left:30px;bottom:3px;height:3px;border-radius:3px;width:calc((100% - 90px)*var(--w)/100%);background:linear-gradient(90deg,#10B981,#6EE7B7)}
.grank li:nth-child(n+4)::after{background:#CBD5E1}
.grank em{display:grid!important;place-items:center;width:20px;height:20px;border-radius:6px;background:#1A1A2E;color:#fff;font-size:10px;padding:0}
.grank li:nth-child(n+4) em{background:#E5E7EB;color:#4B5163}
/* twin */
.tw{position:absolute;inset:0 0 40% 0;padding:clamp(16px,2vw,30px);display:grid;grid-template-rows:auto 1fr auto;gap:0}
.tw-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;position:relative;padding-top:22px}
.tw-l{position:absolute;left:0;top:0;font:600 11px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#AEACC3}
.tw-n{text-align:center;font:600 clamp(12px,.95vw,14.5px)/1 var(--font-b);padding:12px 6px;border-radius:12px;color:#fff}
.tw-p .tw-n{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}
.tw-p .tw-n::before{content:"";display:block;width:14px;height:14px;margin:0 auto 7px;border-radius:50%;background:#F1C9A5}
.tw-a .tw-n{background:rgba(139,114,212,.14);border:1px dashed rgba(139,114,212,.6)}
.tw-a .tw-n::before{content:"";display:block;width:16px;height:12px;margin:0 auto 7px;border-radius:4px;background:#DCD6F2;box-shadow:inset 0 -4px 0 #6B4FBB}
.tw-links{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;min-height:44px}
.tw-links i{position:relative;justify-self:center;width:2px;height:100%;background:linear-gradient(#fff3,#8B72D4aa)}
.tw-links i::after{content:"";position:absolute;left:-3px;top:0;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff;animation:twd 3s ease-in-out infinite}
.tw-links i:nth-child(2)::after{animation-delay:.6s}.tw-links i:nth-child(3)::after{animation-delay:1.2s}.tw-links i:nth-child(4)::after{animation-delay:1.8s}.tw-links i:nth-child(5)::after{animation-delay:2.4s}
@keyframes twd{0%{top:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{top:calc(100% - 8px);opacity:0}}
.tw-links i.g b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);white-space:nowrap;font:700 10.5px/1 var(--font-b);padding:5px 8px;border-radius:999px;background:var(--orange);color:var(--ink);z-index:1}
/* links & misc */
.visit{display:inline-block;font:600 14px var(--font-b);color:var(--orange)!important;text-decoration:none;border-bottom:1px solid rgba(224,122,58,.5);padding-bottom:1px}
.plist b a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(224,122,58,.5)}
.facts .fl{font:600 12px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin:0 0 12px}
.jl.j5{grid-template-columns:repeat(5,1fr)}.jl.j5 i{font-size:11.5px;padding:8px 6px;white-space:nowrap}
.abtx p.lead2{font:400 clamp(19px,1.5vw,23px)/1.4 var(--font-h);color:#fff}
@media (max-width:900px){.tw{position:static;padding:14px 12px 0}.tw-row{grid-template-columns:repeat(3,1fr)}.tw-row .tw-n:nth-child(n+5),.tw-links i:nth-child(n+4){display:none}.tw-links{grid-template-columns:repeat(3,1fr);min-height:34px}.jl.j5{display:none!important}}
.s1 .hero.orgh{display:grid;grid-template-rows:auto auto;align-content:center}
.s1 .hero.orgh .tw{display:grid;grid-template-rows:auto auto auto}.s1 .hero.orgh .tw-links{min-height:40px}
.s1 .hero.orgh .tw{position:relative;inset:auto;padding:clamp(14px,1.6vw,26px) clamp(16px,2vw,30px) 4px}
.s1 .hero.orgh figcaption{position:relative;background:none;padding:6px clamp(16px,2vw,30px) clamp(16px,2vw,26px);gap:8px}
.s1 .hero.orgh h2{font-size:clamp(26px,2.3vw,42px);max-width:22ch}
.s1 .hero.orgh p{font-size:clamp(14.5px,1.05vw,17px);max-width:60ch}
.jl.j5::before{display:none}

/* ===== v8 stations (CEO critique 22/09 + Astra) ===== */
.stg.v8{border-radius:22px;background:linear-gradient(160deg,rgba(28,28,48,.96),rgba(16,16,28,.96));border:1px solid rgba(255,255,255,.12);box-shadow:0 50px 140px -30px rgba(0,0,0,.9);padding:clamp(20px,2.2vw,38px);display:grid;gap:clamp(18px,2.4vw,40px);align-items:center;transform:translate(-50%,-47%) scale(.97);transition:opacity .4s ease,transform .55s cubic-bezier(.2,.8,.2,1);overflow:hidden}
.stg.v8.on{transform:translate(-50%,-50%) scale(1)}
.v8 h2{font-size:clamp(28px,2.5vw,46px);line-height:1.05}
.v8 .pr{font:500 clamp(17px,1.35vw,22px)/1.35 var(--font-b)!important;color:#fff!important}
.v8 p{font-size:clamp(15px,1.05vw,17.5px)}
/* 1 twin */
.twin{grid-template-columns:1fr}
.twbox{display:grid;grid-template-columns:.85fr 1.35fr;gap:clamp(20px,2.6vw,44px);align-items:center;height:100%}
.twtx{display:grid;gap:16px;justify-items:start}
.twl{display:grid;gap:10px;width:100%}
.twl div{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:baseline;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.twl b{font:600 15px var(--font-b);color:#fff}.twl span{font-size:14.5px;color:#C9C7DA}
.twl .o{border-color:rgba(224,122,58,.55);background:rgba(224,122,58,.1)}.twl .o b{color:#F4B489}
.twvis{display:grid;grid-template-rows:auto auto auto;gap:14px;padding:clamp(16px,1.8vw,26px);border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
.pp{width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 50% 38%,#F1C9A5 32%,transparent 33%),radial-gradient(circle at 50% 110%,#2D2D3F 48%,transparent 49%);background-color:#E4E2EC}
.ag{width:30px;height:24px;border-radius:7px;background:#DCD6F2;box-shadow:inset 0 -6px 0 #6B4FBB}
/* 2 enterprise */
.ent{grid-template-columns:.78fr 1.42fr}
.entl{display:grid;gap:14px;align-content:center}
.etabs{display:grid;gap:8px}
.etabs button{display:flex;justify-content:space-between;align-items:baseline;gap:12px;text-align:left;padding:12px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#fff;cursor:pointer;font:inherit}
.etabs button b{font:400 clamp(18px,1.45vw,24px)/1.1 var(--font-h)}.etabs button span{font:500 12.5px var(--font-b);color:#AEACC3}
.etabs button[aria-selected="true"]{border-color:var(--orange);background:rgba(224,122,58,.12)}
.edesc{display:none;gap:6px}.edesc.on{display:grid;animation:fadeIn .3s}
.edesc ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}.edesc li{font-size:15px;color:#D6D4E4;padding-left:16px;position:relative}.edesc li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:2px;background:#10B981}
.edot{font:600 14px var(--font-b);color:#F4B489;text-decoration:none}
.entr{position:relative;height:100%;min-height:0}
.epane{display:none;height:100%}.epane.on{display:block;animation:fadeIn .35s}
.entr .gapp{height:100%;opacity:1;transform:none}
.mk{height:100%;border-radius:18px;background:linear-gradient(180deg,#fff,#F6F7FB);padding:0 18px 18px;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:12px;overflow:hidden;color:#1B2433;font-variant-numeric:tabular-nums}
.mkh{display:flex;justify-content:space-between;align-items:end;gap:10px}
.mkh small{font:600 11px var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:#7A8196;display:block}.mkh b{font:400 clamp(18px,1.5vw,26px)/1.15 var(--font-h);color:#1A1A2E}
.mkbtn{font:600 12.5px var(--font-b);padding:9px 14px;border-radius:999px;background:var(--orange);color:var(--ink);white-space:nowrap}
.mkt{width:100%;border-collapse:collapse;font-size:clamp(12px,.9vw,14px);background:#fff;border:1px solid #E6E8F0;border-radius:12px;overflow:hidden}
.mkt th{text-align:left;font:600 11px var(--font-b);letter-spacing:.08em;text-transform:uppercase;color:#6B7280;padding:9px 12px;background:#F7F8FB}
.mkt td{padding:9px 12px;border-top:1px solid #F0F1F5}.mkt tr.hi td{background:#ECFDF5}.mkt tr.bad td{background:#FFF7ED}
.mkt td.ok{color:#047857;font-weight:600}.mkt td.nk{color:#C2410C;font-weight:700}
.mkfoot{display:flex;gap:10px;align-items:center;font-size:13px;color:#475569;flex-wrap:wrap}.dot{width:8px;height:8px;border-radius:50%;background:#10B981;display:inline-block}
.mkflag{display:grid;gap:3px;padding:12px 14px;border-radius:12px;background:#FFF7ED;border:1px solid #FDBA74}.mkflag b{color:#9A3412}.mkflag span{font-size:13.5px;color:#7C2D12}
.meat{display:grid;grid-template-columns:1.5fr 1fr;gap:12px;min-height:0}.meat svg{width:100%;height:auto;border-radius:12px}
.mside{display:grid;gap:8px;align-content:start}.mside .k{background:#fff;border:1px solid #E6E8F0;border-radius:12px;padding:10px 12px;display:grid}.mside small{font:600 10.5px var(--font-b);letter-spacing:.1em;text-transform:uppercase;color:#7A8196}.mside b{font:700 20px var(--font-b);color:#111827}.mside span{font-size:12px;color:#6B7280}.mside .k.v{background:#ECFDF5;border-color:#A7F3D0}.mside .k.v b{color:#047857}
/* 3 lab */
.lab2{grid-template-columns:1.35fr 1fr}
.lbvis{position:relative;height:100%;min-height:0}
.bw2{position:absolute;inset:0;margin:0;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 40px 100px -30px rgba(0,0,0,.9);display:grid;grid-template-rows:auto 1fr;opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s}
.bw2.on{opacity:1;transform:none}.bw2 img{width:100%;height:100%;object-fit:cover;object-position:top center;min-height:0}
.lbtx{display:grid;gap:14px;align-content:center}
.lpick{display:grid;gap:2px;border-top:1px solid rgba(255,255,255,.12)}
.lpick button{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:14px;text-align:left;padding:14px 4px;border:0;border-bottom:1px solid rgba(255,255,255,.12);background:none;color:#8E8CA6;cursor:pointer;font:inherit}
.lpick em{font:600 12px var(--font-b);font-style:normal;color:#8E8CA6}
.lpick b{font:400 clamp(24px,2vw,36px)/1 var(--font-h);color:#8E8CA6;transition:color .2s}
.lpick span{font:500 12.5px var(--font-b);letter-spacing:.04em}
.lpick button[aria-selected="true"] b{color:#fff}.lpick button[aria-selected="true"] em{color:var(--orange)}.lpick button[aria-selected="true"] span{color:#F4B489}
.ldesc{display:none;gap:8px}.ldesc.on{display:grid;animation:fadeIn .3s}
/* 4 media */
.media{grid-template-columns:1fr 1.05fr}
.mdtx{display:grid;gap:14px;justify-items:start}
.mdpipe{list-style:none;margin:0;padding:0;display:grid;gap:8px;width:100%}
.mdpipe li{display:grid;grid-template-columns:34px auto 1fr;gap:12px;align-items:center;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.mdpipe i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font:600 12.5px var(--font-b);font-style:normal;background:#2C2C47;color:#fff}
.mdpipe b{font:600 15px var(--font-b);color:#fff;white-space:nowrap}.mdpipe span{font-size:13.5px;color:#B9B7CC}
.mdpipe li.h{border-color:rgba(224,122,58,.6);background:rgba(224,122,58,.1)}.mdpipe li.h i{background:var(--orange);color:var(--ink);border-radius:50%}
.wall2{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(0,auto);gap:10px;align-content:center;position:relative}
.wall2 img{width:100%;border-radius:10px;box-shadow:0 20px 40px -20px rgba(0,0,0,.8)}
.wall2 img.tall{grid-row:span 3}
.wcap{grid-column:1/-1;font:600 12.5px var(--font-b);color:#F4B489}
/* 5 community */
.comm{grid-template-columns:1.3fr 1fr}
.cmmain{display:grid;gap:14px;justify-items:start}
.cmgets{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.cmgets div{display:grid;gap:4px;padding:14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.cmgets b{font:400 clamp(18px,1.4vw,22px)/1.15 var(--font-h);color:#fff}.cmgets span{font-size:14px;color:#C9C7DA}
.cmform{display:flex;gap:10px;flex-wrap:wrap;width:100%}.cmform input{flex:1 1 220px;min-width:0;padding:13px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;font:400 15px var(--font-b)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.acnext{display:grid;gap:12px;align-content:center;justify-items:start;padding:clamp(18px,2vw,30px);border-radius:18px;background:#F7F6FB;color:#2D2D3F;text-decoration:none;box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.acnext .kick{color:#A5481A}.acnext b{font:400 clamp(24px,2.1vw,36px)/1.08 var(--font-h);color:#1A1A2E}.ac1{font-size:15.5px;color:#565E6C}
.acm{display:flex;flex-wrap:wrap;gap:6px}.acm i{font-style:normal;font:600 12px var(--font-b);padding:7px 10px;border-radius:999px;background:#fff;border:1px solid #E4E2EC;color:#2D2D3F}.acm i.g{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.acby{display:flex;align-items:center;gap:10px;font:500 14px var(--font-b);color:#2D2D3F}.acby img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center 20%}
.acnext i.btn{font-style:normal}
@media (max-width:900px){
  .stg.v8{padding:16px;gap:12px;align-items:start;overflow:auto}
  .twbox,.ent,.lab2,.media,.comm{grid-template-columns:1fr}
  .twbox{gap:12px}.twl,.twtx p{display:none}
  .etabs{grid-template-columns:1fr 1fr}.etabs button{padding:8px 10px}.etabs button b{font-size:16px}.etabs button span{display:none}.edesc ul,.edot,.ent h2{display:none}.entr{height:44vh}
  .lbvis{height:30vh;order:-1}.lpick button{padding:8px 2px}.lpick b{font-size:22px}.ldesc p:not(.pr){display:none}
  .mdpipe span{display:none}.wall2{grid-template-columns:repeat(4,1fr)}.wall2 img.tall{grid-row:auto}.wall2 img:nth-child(n+5){display:none}.mdtx p{display:none}
  .cmgets{grid-template-columns:1fr 1fr}.cmgets span{display:none}.acnext .acm,.acnext .ac1{display:none}
}
@media (prefers-reduced-motion:reduce){.stg.v8{transform:none}}
.wall2{grid-template-columns:1fr 1fr 1.15fr;grid-template-rows:minmax(0,1fr) auto;height:100%;align-content:stretch}
.wall2 img.tall{grid-row:1;height:100%;object-fit:cover;object-position:top center}
.hls{display:grid;grid-template-rows:repeat(4,1fr);gap:8px;min-height:0}.hls img{height:100%;object-fit:cover;object-position:center}
.bw2 img{object-position:top left}
@media (max-width:900px){.wall2{grid-template-columns:repeat(3,1fr);height:auto}.wall2 .hls{display:none}.wall2 img.tall{height:180px}}
.wall2{grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1.25fr) minmax(0,1fr) auto;height:100%;gap:8px}
.wall2 img.tall{grid-row:1;height:100%;object-fit:cover;object-position:top center}
.wall2 .hls{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;min-height:0}
.wall2 .hls img{width:100%;height:100%;object-fit:contain;background:#0E1B2D;border-radius:10px}
.wall2 .wcap{grid-row:3}
.stg.v8.media{align-items:stretch;grid-template-rows:minmax(0,1fr)}
.media .mdtx{align-content:center;min-height:0;gap:11px}.media h2{font-size:clamp(26px,2.2vw,40px)}
.mdpipe{gap:6px}.mdpipe li{padding:6px 10px}.mdpipe span{font-size:12.5px}.mdpipe i{width:26px;height:26px}
.media .wall2{height:auto;min-height:0;max-height:100%;overflow:hidden}
@media (max-width:900px){.cmgets div:nth-child(n+3){display:none}.stg.v8.media{grid-template-rows:auto}}
.wall2{grid-template-rows:minmax(0,1.25fr) minmax(0,1fr)}
@media (max-width:900px){.wall2 .hls{display:none!important}.wall2{grid-template-rows:auto;height:auto!important}.wall2 img.tall{height:170px!important}.media .mdtx{gap:8px}}

/* ===== Part H: chapters ===== */
.chap{padding-block:clamp(56px,7vw,96px) clamp(28px,3.5vw,44px)}
.chin{display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,3vw,44px);align-items:end}
.chn{font:400 clamp(72px,10vw,150px)/.8 var(--font-h);color:var(--orange);letter-spacing:-.03em}
.chq{font:600 12px/1 var(--font-b);letter-spacing:.16em;text-transform:uppercase}
.chname{font-size:clamp(38px,5vw,64px);line-height:1;margin:10px 0 12px}
.chp{font-size:clamp(17px,1.5vw,21px);max-width:52ch}
.t-light{background:#F7F6FB;color:#2D2D3F}.t-light .chname{color:#1A1A2E}.t-light .chq{color:#A5481A}.t-light .chp{color:#565E6C}.t-light .chn{color:#E07A3A}
.t-dark{background:var(--ink)}.t-dark .chname{color:#fff}.t-dark .chq{color:var(--orange)}.t-dark .chp{color:#C9C7DA}
.t-grey{background:#EDECF3}.t-grey .chname{color:#1A1A2E}.t-grey .chq{color:#A5481A}.t-grey .chp{color:#565E6C}
.t-deep{background:var(--deep)}.t-deep .chname{color:#fff}.t-deep .chq{color:var(--orange)}.t-deep .chp{color:#C9C7DA}
.chap + .sec{padding-top:clamp(12px,2vw,24px)}
#ch1 + .sec{background:#F7F6FB}#ch3 ~ #community,#ch3 ~ #academy{background:#EDECF3}
.toc{background:var(--deep)}.tocg{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tocg a{display:grid;gap:6px;padding:18px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);text-decoration:none;color:#fff}
.tocg em{font:400 32px/1 var(--font-h);font-style:normal;color:var(--orange)}.tocg b{font:400 22px/1.15 var(--font-h)}.tocg span{font-size:14px;color:#AEACC3}
.tocg a:hover{border-color:var(--orange)}
.quad{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.qd{display:grid;grid-template-rows:auto 1fr;border-radius:20px;overflow:hidden;background:#fff;border:1px solid #E4E2EC;text-decoration:none;color:#2D2D3F;box-shadow:0 20px 50px -30px rgba(20,20,40,.35);transition:transform .25s}
.qd:hover{transform:translateY(-3px)}
.qi{aspect-ratio:16/9;overflow:hidden;background:#EDECF3}.qi img{width:100%;height:100%;object-fit:cover;object-position:top left}
.qi.dk{background:#0E1B2D;display:flex;justify-content:center;gap:12px;padding:14px}.qi.dk img.c{width:auto;height:100%;border-radius:10px;object-fit:cover}
.qb{display:grid;gap:8px;padding:20px 22px 22px;align-content:start}
.qk{font:600 11.5px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#A5481A}
.qb b{font:400 clamp(26px,2.3vw,34px)/1.05 var(--font-h);color:#1A1A2E}.qb p{font-size:16px;color:#565E6C}
.qb .visit{color:#A5481A!important}
.more{margin:clamp(34px,4vw,52px) 0 16px;color:#1A1A2E}
.minis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.minis a{display:grid;gap:6px;text-decoration:none;color:#2D2D3F}.minis img{aspect-ratio:4/3;width:100%;object-fit:cover;object-position:top left;border-radius:12px;border:1px solid #E4E2EC}
.minis b{font:600 14.5px var(--font-b)}.minis span{font-size:13px;color:#565E6C}
.nav a[aria-current="true"]{color:#fff;box-shadow:inset 0 -2px 0 var(--orange)}
.chbar{display:none}
@media (max-width:900px){
  .tocg{grid-template-columns:1fr 1fr}.quad{grid-template-columns:1fr}.minis{grid-template-columns:1fr 1fr}
  .chin{grid-template-columns:1fr;gap:6px}.chn{font-size:64px}
  .chbar{display:block;position:sticky;top:calc(env(safe-area-inset-top,0px) + 108px);z-index:45;background:#12121F;color:#fff;font:600 12px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.1)}
  .chbar:empty{display:none}
}
.mk,.mk td,.mk th{color:#1B2433}
.mkt td{color:#1B2433}.mkt td b{color:#1A1A2E}.mkt td:last-child{color:#475569}
.mk .mkflag{align-self:start}
.mk{grid-template-rows:auto auto auto auto 1fr}
.meat{align-items:start}.meat svg{max-height:100%}
/* legibility pass (Astra): secondary text floor */
.mdpipe span{font-size:13.5px!important}.edesc li{font-size:15.5px}.lpick span{font-size:13.5px}.mkt{font-size:clamp(13px,.95vw,14.5px)}.twl span{font-size:15px}

/* ===== monthly result vs goal — dataviz spec (bullet columns, sized to its box, never stretched) ===== */
.gch.mv{grid-template-rows:auto 1fr;position:relative}
.mvh{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.mvl{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap;font:500 11.5px var(--font-b);color:#475569}
.mvl .sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-left:4px}
.mvl .sw.up{background:#059669}.mvl .sw.dn{background:#D9622B}.mvl .sw.gl{width:14px;height:2px;border-radius:2px;background:#1A1A2E}
.mvc{position:relative;min-height:0;height:100%}
.mvc svg{display:block;width:100%;height:100%}
.mvc .hit{cursor:default}.gu .r span{white-space:nowrap}
.mvtip{position:absolute;z-index:5;pointer-events:none;background:#1A1A2E;color:#fff;border-radius:10px;padding:8px 10px;font:500 12px/1.4 var(--font-b);box-shadow:0 10px 24px -10px rgba(0,0,0,.5);white-space:nowrap}
.mvtip b{font-weight:700}.mvtip .g{color:#6EE7B7}.mvtip .a{color:#FDBA8C}

/* ===== TYPE SCALE (ratio 1.25, base 17px): hero H1 is always the largest; decoration never outranks content ===== */
:root{--t-h1:clamp(40px,4.4vw,60px);--t-ch:clamp(30px,3.1vw,44px);--t-chn:clamp(36px,3.9vw,56px);--t-h2:clamp(26px,2.4vw,34px);--t-h3:clamp(21px,1.8vw,26px);--t-lead:clamp(17px,1.3vw,19px);--t-body:17px}
.hero .h1{font-size:var(--t-h1)!important}
.chin{align-items:center;gap:clamp(14px,2vw,28px)}
.chn{font-size:var(--t-chn)!important;line-height:1;opacity:.55;letter-spacing:0}
.chname{font-size:var(--t-ch)!important;margin:6px 0 8px!important}
.chp{font-size:var(--t-lead)!important}
.chap{padding-block:clamp(44px,5vw,72px) clamp(16px,2vw,28px)}
.sec .h2,.toc .h2,.cta h2,#orch .h2,#ch3 ~ .sec .h2{font-size:var(--t-h2)!important;line-height:1.12}
.cta h2{font-size:clamp(28px,2.8vw,40px)!important}
.qb b,.tocg b{font-size:var(--t-h3)!important}
.abtx p.big{font-size:clamp(19px,1.55vw,22px)!important}.abtx p.lead2{font-size:clamp(18px,1.4vw,20px)!important}
.fact b{font-size:clamp(24px,2vw,28px)!important}
.lede{font-size:var(--t-lead)!important}
@media (max-width:900px){:root{--t-ch:32px;--t-h2:24px;--t-lead:18px}.sec .h2{max-width:22ch}}
.soon{align-self:center;font:600 11px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;padding:7px 10px;border-radius:999px;border:1px solid rgba(224,122,58,.6);color:#F4B489}
/* anchor targets clear the sticky header (+ proposal bar + mobile chapter bar) */
:root{--anchor-gap:124px}
[id]{scroll-margin-top:var(--anchor-gap)}
@media (max-width:900px){:root{--anchor-gap:168px}}
.wm{font-size:clamp(40px,4.2vw,58px)!important;transform:none!important;margin:10px 0 18px}

/* ===== Impeccable pass (2026-09-22): contrast, tracking, heading order, sizes ===== */
h1,h2,h3,.h1,.h2,.h3,.chname,.qb b,.tocg b{letter-spacing:-0.01em!important}
.chn{line-height:1.1!important}
.side b{font-size:11.5px!important}
.light .eyebrow,.grey .eyebrow,.t-light .chq,.t-grey .chq,.qk,.acnext .kick,.qb .visit,[data-dir="B"] .sec:not(.dark) .eyebrow{color:#A5481A!important}
.gkpi small,.gpill span,.mkh small,.mside small,.gkpi span,.mside span,.gch small,.grank small{color:#565E6C!important}
.fh{font:600 12px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#fff;margin:0 0 12px}


/* ===== 2026-09-23: mobile + projects hierarchy (CEO) ===== */
.allp{display:flex;justify-content:center;margin:26px 0 8px}.allp .btn{font-size:16px;padding:14px 22px}
@media (max-width:760px){.qi img{object-fit:contain;object-position:top center;background:#fff}}
@media (max-width:520px){.hdr .in{gap:10px}.hdr .logo{font-size:21px}.hdr .btn{padding:9px 12px;font-size:13.5px}.menu{padding:8px 12px;margin-left:6px}}

/* ===== 2026-09-23 QA fixes: home menu + flagship card ===== */
.hdr .in{position:relative}
@media (max-width:920px){.hdr.open .nav{display:grid;gap:0;position:absolute;top:100%;left:0;right:0;background:#1A1A2E;border-bottom:1px solid rgba(255,255,255,.1);padding:8px 16px 14px;z-index:80}.hdr.open .nav a{padding:12px 0;border-top:1px solid rgba(255,255,255,.06);color:#fff}}
.quad .qd.big{grid-column:1/-1;grid-template-columns:1.3fr 1fr;grid-template-rows:auto}.quad .qd.big .qi{aspect-ratio:auto;min-height:260px;background:#fff}.quad .qd.big .qi img{object-fit:cover;object-position:top center}
.quad .qd.big .qb b{font-size:var(--t-h2,30px)}
@media (max-width:760px){.quad .qd.big{grid-template-columns:1fr}.quad .qd.big .qi{min-height:0;aspect-ratio:16/11}.quad .qd.big .qi img{object-fit:cover}}
/* ===== 2026-09-24 revisão 2: formulários enviam de verdade (contato + listas de espera) ===== */
input.kk-hp{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;border:0!important;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;opacity:0}
.msg:empty{position:absolute;margin:0}
.cmform .msg{flex-basis:100%;margin:0;font-size:14.5px;font-weight:500;color:#EEEDF5}.cmform .msg.err{color:#FDBA8C}.cmform input[aria-invalid="true"]{border-color:#FDBA8C}
.form .msg{flex-basis:100%;margin:0;font-size:14.5px;font-weight:500;color:var(--text)}.form .msg.ok{color:#2E7D5B}.form .msg.err{color:#B03A2E}.form input[aria-invalid="true"]{border-color:#C0392B}
.cta .kk-cf{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px;max-width:760px;margin-top:36px;padding-top:32px;border-top:1px solid rgba(26,26,46,.2)}
.kk-cf .kk-f{display:grid;gap:7px;min-width:0}
.kk-cf .kk-w,.kk-cf .kk-go,.kk-cf .msg{grid-column:1/-1}
.kk-cf label{flex-basis:auto;font:500 14px/1.3 var(--font-b);color:var(--ink)}
.kk-cf input,.kk-cf textarea{width:100%;min-width:0;box-sizing:border-box;padding:13px 18px;border-radius:999px;border:1px solid rgba(26,26,46,.24);background:#fff;color:var(--text-l);font:400 15px/1.45 var(--font-b)}
.kk-cf textarea{border-radius:18px;min-height:118px;resize:vertical;display:block}
.kk-cf input[aria-invalid="true"],.kk-cf textarea[aria-invalid="true"]{border-color:#7A1E12;box-shadow:inset 0 0 0 1px #7A1E12}
.kk-cf .kk-go{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;margin-top:4px}
.kk-cf .kk-go a{color:var(--ink);text-underline-offset:3px}
.cta .kk-cf .msg,.cta .kk-cf .msg.ok,.cta .kk-cf .msg.err{margin:0;max-width:none;font:500 15.5px/1.45 var(--font-b);color:var(--ink)}
@media (max-width:620px){.cta .kk-cf{grid-template-columns:1fr;gap:14px}.kk-cf .kk-go .btn{width:100%;justify-content:center}}

/* ===== revisão 4 · estações claras (D no desktop, B no celular) + 3 estações (CEO 2026-09-24) ===== */
/* o véu sobre o mundo sai: a fábrica fica visível quando a estação abre */
.stage.showing .scrim{opacity:0}
/* D · desktop: sem caixa; uma camada separada escurece e desfoca só o lado do texto e some em direção ao produto */
.stg.v8{background:none;border-color:transparent;box-shadow:none}
.stg.v8::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:22px;pointer-events:none;
  background:linear-gradient(90deg,rgba(18,18,32,.86) 0%,rgba(18,18,32,.7) 34%,rgba(18,18,32,.2) 56%,rgba(18,18,32,0) 72%);
  -webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15);
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 44%,transparent 74%);mask-image:linear-gradient(90deg,#000 0%,#000 44%,transparent 74%)}
/* os cartões de produto flutuam sobre a fábrica */
.stg.v8 .gapp,.stg.v8 .mk,.stg.v8 .bw2,.stg.v8 .acnext,.mgcap{box-shadow:0 40px 90px -30px rgba(0,0,0,.72)}
/* estação 1: o quadro das duas camadas é translúcido → vidro fumê próprio */
.twvis{background:rgba(20,20,38,.6)!important;-webkit-backdrop-filter:blur(12px) saturate(1.1);backdrop-filter:blur(12px) saturate(1.1);border-color:rgba(255,255,255,.16)!important;box-shadow:0 40px 90px -30px rgba(0,0,0,.72)}
/* estação 2 (M2): à esquerda dois grupos de escolha, à direita um visor e uma legenda */
.stg.v8.mg{grid-template-columns:minmax(330px,.95fr) 1.5fr;align-items:stretch}
.mgnav{display:grid;gap:6px;align-content:center;min-width:0}
.mgnav h2{font-size:clamp(24px,1.85vw,32px)!important;line-height:1.1!important;margin:2px 0 4px}
.mgseg{display:none}
.mggl{font:600 11.5px/1 var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:#C9C7DA;margin-top:8px}
.mg .etabs{grid-template-columns:1fr;gap:6px}
.mg .etabs button{padding:8px 14px}
.mg .lpick{display:grid;gap:6px;border-top:0}
.mg .lpick button{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 14px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.04);color:#fff}
.mg .lpick em{display:none}
.mg .lpick b{font:400 clamp(18px,1.45vw,24px)/1.1 var(--font-h);color:#fff}
.mg .lpick span{font:500 12.5px var(--font-b);color:#AEACC3;letter-spacing:0}
.mg .lpick button[aria-selected="true"]{border-color:var(--orange);background:rgba(224,122,58,.12)}
.mg .lpick button[aria-selected="true"] span{color:#F4B489}
.mg .lpick button:hover,.mg .lpick button:focus-visible{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.08)}
.mg .lpick button[aria-selected="true"]:hover{border-color:var(--orange);background:rgba(224,122,58,.18)}
.mg .etabs button:hover,.mg .etabs button:focus-visible{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.08)}
.mg .etabs button[aria-selected="true"]:hover{border-color:var(--orange);background:rgba(224,122,58,.18)}
.mgview{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:14px;min-width:0;min-height:0}
.mg .entr,.mg .lbvis{height:auto;min-height:0}
.mg .lbvis{display:none}.mg.show-p .lbvis{display:block}.mg.show-p .entr{display:none}
.mgcap{display:grid;gap:6px;background:#F7F6FB;border-radius:14px;padding:14px 18px}
.mg .edesc,.mg .ldesc{display:none}.mg .edesc.on,.mg .ldesc.on{display:grid;gap:4px}
.mgcap .pr{color:#1A1A2E!important;font:600 17px/1.3 var(--font-b)!important}
.mgcap p,.mgcap li{color:#3F4557!important;font-size:14.5px!important;line-height:1.45}
.mgcap .edesc ul{display:flex;flex-wrap:wrap;gap:4px 18px}
.mgcap .edot,.mgcap .visit{color:#A5481A!important;border-bottom-color:rgba(165,72,26,.45)!important;font:600 14px var(--font-b);text-decoration:none}
.mg.show-p .edot{display:none}
@media (max-width:900px){
  /* B · celular: vidro fumê com base escura mínima (o desfoque sozinho não garante contraste) */
  .stg.v8::before{display:none}
  .stg.v8{background:rgba(22,22,40,.66);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);border:1px solid rgba(255,255,255,.2);box-shadow:0 30px 80px -40px rgba(0,0,0,.6)}
  /* estação 2 no celular: um alternador de dois segmentos escolhe o grupo */
  .stg.v8.mg{grid-template-columns:1fr}
  .mgnav{gap:8px}
  .mg .kick,.mggl{display:none}
  .mgnav h2{font-size:24px!important}
  .mgseg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.08)}
  .mgseg button{min-height:40px;border:0;border-radius:999px;background:none;color:#D6D4E4;font:600 13.5px var(--font-b);cursor:pointer}
  .mgseg button[aria-pressed="true"]{background:#fff;color:#1A1A2E}
  .mg .lpick{display:none}.mg.show-p .lpick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.mg.show-p .etabs{display:none}
  .mg .etabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mg .lpick button{flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px}
  .mg .lpick b{font-size:16px!important}.mg .lpick span{font-size:12px}
  .mgview{grid-template-rows:auto auto}
  .mg .entr,.mg .lbvis{height:38svh!important;order:0}
  .mgcap{padding:12px 14px}
  .mgcap .pr{font-size:15.5px!important}
  .mgcap .edesc ul,.mgcap .ldesc p:not(.pr){display:none!important}
}

/* ===== revisão 4.1 · correções da verificação independente (27 defeitos confirmados, wf_7ba0e438-45a) ===== */
/* C2/C22 · rail e rótulos FACTORY/OFFICE: base escura própria, sem voltar o véu */
.rail{padding:6px 8px;border-radius:99px;background:rgba(18,18,32,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);left:calc(clamp(16px,3vw,28px) - 8px)}
.rail b:not(.on){background:rgba(255,255,255,.45)}
.side b:not(.on){background:rgba(18,18,32,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
/* C3 · estação 1: vidro do quadro mais denso para os rótulos cinza */
.twvis{background:rgba(20,20,38,.78)!important}
/* C4/C27 · rótulos secundários das abas legíveis quando a cena passa por trás */
.mg .etabs span,.mg .lpick span{color:#D6D4E4}
.mg .etabs button[aria-selected="true"] span{color:#F4B489}
/* C15/C25 · a legenda fica por cima da sombra do visor */
.mgcap{position:relative;z-index:1}
@media (min-width:901px){
  /* C23 · a camada esmaece nas quatro bordas; a estação deixa de recortá-la em forma de caixa */
  .stg.v8{overflow:visible}
  .stg.v8::before{inset:-56px -72px;border-radius:0;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 46%,transparent 72%),linear-gradient(180deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 46%,transparent 72%),linear-gradient(180deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);mask-composite:intersect}
  /* C1/C21 · Community: o gradiente cobre também a coluna da direita; laranja claro sobre fundo escuro */
  .stg.v8.comm::before{background:linear-gradient(90deg,rgba(18,18,32,.86) 0%,rgba(18,18,32,.8) 40%,rgba(18,18,32,.74) 58%,rgba(18,18,32,0) 72%);
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 62%,transparent 76%),linear-gradient(180deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent 0,#000 72px,#000 62%,transparent 76%),linear-gradient(180deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);mask-composite:intersect}
  .stg.v8.comm .kick.o,.stg.v8.comm .cmmain>a.visit{color:#F4B489!important}
  .stg.v8.comm .cmmain>a.visit{border-bottom-color:rgba(244,180,137,.5)}
  /* C9/C13/C14/C24 · estação 2: as colunas encolhem sem vazar; o visor não muda de largura entre as abas */
  .stg.v8.mg{grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr);height:min(86%,920px)}
  .mgview{grid-template-columns:minmax(0,1fr)}
  .mg .entr,.mg .lbvis,.mgcap,.mg .gapp,.mg .gkpi .k,.mg .gu{min-width:0}
  .mg .gkpi{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mg .gunits{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mg .gu .r{flex-wrap:wrap;gap:4px 6px}
  /* C8/C12/C20 · o SM-GPD cabe: gráfico com altura mínima, cartões compactos */
  .mg .gapp{gap:8px}.mg .gpill{padding:0}.mg .gkpi .k{padding:6px 8px}.mg .gkpi .k span{display:none}
  .mg .gbottom{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);min-height:176px}
  .mg .gch.mv .mvc{min-height:150px}
  .mg .mk{grid-template-rows:auto auto auto minmax(0,1fr) auto}.mg .mkt{display:block;overflow:hidden;min-height:0}
}
@media (min-width:901px) and (max-width:1100px){.mg .gbottom .gch{display:none}.mg .gbottom{grid-template-columns:1fr}}
@media (min-width:901px) and (max-height:1000px){
  .mgcap{padding:10px 16px;gap:2px}.mgcap .edesc ul,.mgcap .ldesc p:not(.pr){display:none}.mgcap .pr{font-size:15.5px!important}
  .mg .grank li:nth-child(n+4){display:none}.mg .mkt tbody tr:nth-child(n+4){display:none}.mg .mkt td,.mg .mkt th{padding-top:6px;padding-bottom:6px}
}
@media (min-width:901px) and (max-height:960px){.mg .gapp .gunits{display:none}}
@media (min-width:901px) and (max-height:860px){
  .mgnav{gap:4px}.mgnav h2{font-size:clamp(20px,1.6vw,26px)!important;margin:0 0 2px}.mggl{margin-top:4px}
  .mg .etabs,.mg .lpick{gap:4px}.mg .etabs button,.mg .lpick button{padding:6px 12px}
  .mg .etabs button b,.mg .lpick b{font-size:clamp(16px,1.25vw,20px)}.mgview{gap:10px}
}
/* estações 1 e 3 em telas baixas (o corte já existia no aprovado; corrigido junto) */
@media (min-width:901px) and (max-height:800px){
  .stg.v8:not(.mg){height:min(84%,920px)}
  .twtx{gap:12px}.twtx p{display:none}
  .twvis{gap:10px;padding:14px 16px}
  .cmmain{gap:10px}.cmgets div{padding:10px 12px}
}
@media (max-width:900px){
  /* C5 · vidro B mais denso e laranja claro sobre ele */
  .stg.v8{background:rgba(22,22,40,.78)}
  .stg.v8 .kick.o,.stg.v8 .cmmain>a.visit{color:#F4B489;border-bottom-color:rgba(244,180,137,.5)}
  /* C17/C18 · estação 2: o visor cede a sobra de altura em vez de prender o dedo */
  .stg.v8.mg{grid-template-rows:auto minmax(0,1fr)}
  .mg .mgview{grid-template-rows:minmax(0,1fr) auto;min-height:0}
  .mg .entr,.mg .lbvis{max-height:100%}
  /* C19/C26 · o visor mostra só o que cabe; o que sobrar esmaece em vez de cortar seco */
  .mg .gunits .gu:nth-child(n+3){display:none}
  .mg .entr .gapp{-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 28px),transparent)}
  /* C10 · a legenda das necessidades volta a ter o link */
  .mg:not(.show-p) .mgcap .edot{display:inline-block}
}
@media (max-width:900px) and (max-height:720px){.mgnav h2{font-size:19px!important}}

/* ===== revisão 4.2 · efeitos colaterais da 4.1 apontados na reverificação (wf_f8f0c0e7-678); correções testadas por injeção ===== */
@media (min-width:901px){
  /* R9/R16 · tabelas voltam a ocupar a largura do cartão */
  .stg.v8.mg .mkt{display:table;width:100%}
  /* R1/R20 · estação 1: cartões da lista com base escura própria */
  .stg.v8 .twl div{background:rgba(18,18,32,.5)}
  .stg.v8 .twl .o{background:linear-gradient(rgba(224,122,58,.1),rgba(224,122,58,.1)),rgba(18,18,32,.5)}
}
/* R4 · laranja da aba selecionada mais claro */
.mg .etabs button[aria-selected="true"] span{color:#F7C49E}
/* R7/R10/R15 · onde há altura, o conteúdo da demo volta (unidades, gaps 4–5, linhas, tópicos da legenda) */
@media (min-width:901px) and (min-height:861px){.stg.v8.mg .grank li:nth-child(n+4){display:grid}.stg.v8.mg .mkt tbody tr:nth-child(n+4){display:table-row}.stg.v8.mg .gapp .gunits{display:grid}.stg.v8.mg .mgcap .edesc ul{display:flex}}
@media (min-width:901px) and (min-height:760px) and (max-height:860px){.stg.v8.mg .grank li:nth-child(n+4){display:grid}.stg.v8.mg .mkt tbody tr:nth-child(n+4){display:table-row}}
/* unidades: até 1599px mostram variação + realizado (as 3 cifras não cabem lado a lado) */
@media (min-width:901px) and (max-width:1599px){.stg.v8.mg .gu .r{flex-wrap:nowrap;gap:5px}.stg.v8.mg .gu .r span:first-child{padding:4px 6px}.stg.v8.mg .gu .r span:nth-child(3){display:none}}
/* cartões de demo mais curtos que o visor: o cartão abraça o conteúdo (sem área branca vazia) */
@media (min-width:901px){.stg.v8.mg .mk{height:auto!important;align-self:start}}
/* R10 · a linha "Detention" (2ª cobrança do alerta) aparece sempre */
@media (min-width:901px) and (min-height:700px) and (max-height:1000px){#ep2 .mkt tbody tr:nth-child(4){display:table-row}}
@media (min-width:901px) and (max-height:700px){.stg.v8.mg{padding-top:12px;padding-bottom:12px}}
@media (max-width:900px){
  /* R2 · link da Community em laranja claro (a regra antiga .visit tinha !important) */
  .stg.v8 .cmmain>a.visit{color:#F4B489!important}
  /* R18/C26 · as grades encolhem sem vazar para a direita; a legenda acompanha o visor */
  .stg.v8.mg{grid-template-columns:minmax(0,1fr)}
  .mg .mgview,.mg .gapp,.mg .mk{grid-template-columns:minmax(0,1fr)}
  .mg .entr,.mg .lbvis,.mgcap,.mg .gapp,.mg .mk,.mg .gkpi,.mg .gkpi .k,.mg .gpill,.mg .gunits,.mg .gu{min-width:0}
  .mg .gkpi{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mg .gkpi .k{padding:8px}.mg .gkpi b{font-size:clamp(15px,4.6vw,18px)}
  .mg .gbar{gap:8px;letter-spacing:.06em}.mg .gbar span,.mg .gbar em{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mg .mkh{flex-wrap:wrap}.mg .mkh>div{min-width:0}
  .mg .mkt{table-layout:fixed;width:100%}.mg .mkt th,.mg .mkt td{padding:7px 6px;overflow-wrap:anywhere}
  /* R13 · o link da legenda quebra linha em vez de ser cortado */
  .mgcap .edot{white-space:normal}
  /* R12/R17/C19 · o visor nunca some; o esmaecimento é curto e não cobre os números */
  .mg .entr,.mg .lbvis{min-height:min(140px,24svh)}
  .mg .gapp{gap:8px}
  .mg .entr .gapp,.mg .entr .mk{-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 14px),transparent)}
}
@media (max-width:480px){.mg .gu .r span:nth-child(3){display:none}.mg .gu .r{flex-wrap:nowrap}}
@media (max-width:900px) and (max-height:760px){.mg .gkpi .k{padding:6px 8px}.mg .gkpi .k span{display:none}.mg .gkpi .k.v b{white-space:nowrap}.mg .gapp .gunits{display:none}}
@media (max-width:900px) and (max-height:700px){.mgnav h2{font-size:17px!important;line-height:1.15!important}.mg .etabs button{padding:6px 10px}.mg .etabs button b{font-size:15px!important}.mgseg button{min-height:36px}.mgcap{padding:10px 12px}.mgcap .pr{font-size:14px!important}}
@media (max-width:900px) and (max-height:600px){.mgcap .pr{display:none!important}.mgnav h2{font-size:16px!important}}

/* ===== revisão 5 · fluidez + fluir entre estações (CEO 2026-09-30) ===== */
/* sem desfoque ao vivo sobre o 3D animado (dobrava o custo de cada quadro); o gradiente e as bases escuras fazem o papel */
.stg.v8,.stg.v8::before,.twvis,.rail,.side b{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.twvis{background:rgba(20,20,38,.9)!important}
.rail,.side b:not(.on){background:rgba(18,18,32,.9)}
@media (min-width:901px){
  .stg.v8::before{background:linear-gradient(90deg,rgba(18,18,32,.92) 0%,rgba(18,18,32,.84) 36%,rgba(18,18,32,.3) 56%,rgba(18,18,32,0) 72%)}
  .stg.v8.comm::before{background:linear-gradient(90deg,rgba(18,18,32,.92) 0%,rgba(18,18,32,.88) 40%,rgba(18,18,32,.82) 58%,rgba(18,18,32,0) 74%)}
  .stg.v8 .twl div{background:rgba(18,18,32,.72)}
  .stg.v8 .twl .o{background:linear-gradient(rgba(224,122,58,.12),rgba(224,122,58,.12)),rgba(18,18,32,.72)}
}
/* o conteúdo da estação entra em sequência: texto, depois o produto */
@media (prefers-reduced-motion:no-preference){
  .stg.v8 .twtx,.stg.v8 .twvis,.stg.v8 .mgnav,.stg.v8 .mgview,.stg.v8 .cmmain,.stg.v8 .acnext{opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
  .stg.v8.on .twtx,.stg.v8.on .mgnav,.stg.v8.on .cmmain{opacity:1;transform:none;transition-delay:.05s}
  .stg.v8.on .twvis,.stg.v8.on .mgview,.stg.v8.on .acnext{opacity:1;transform:none;transition-delay:.16s}
}
.jnext,.railn{display:none}
@media (max-width:900px){
  .stg.v8{background:rgba(22,22,40,.92)}
  /* o painel fica entre o indicador e o botão de continuar; nada rola por dentro */
  .stg.v8,.stg.v8.on{top:auto;bottom:calc(62px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);max-height:calc(100% - 62px - 40px - env(safe-area-inset-bottom,0px));overflow:hidden}
  .twtx .kick{display:none}
  .cmgets{display:none!important}
  .stage .jnext{display:flex;position:absolute;left:50%;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:5;align-items:center;gap:10px;
    min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(16,16,28,.94);color:#fff;
    font:600 14px/1 var(--font-b);white-space:nowrap;cursor:pointer;opacity:0;pointer-events:none;transform:translate(-50%,8px);transition:opacity .3s,transform .3s}
  .stage.showing .jnext{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
  .jnext .ar{color:var(--orange);font-size:17px}
  .jnext em{font-style:normal;font-weight:500;color:#AEACC3}
  .stage .railn{display:block;position:absolute;top:13px;left:calc(clamp(16px,3vw,28px) + 96px);z-index:4;font:600 12px/1 var(--font-b);color:#fff;letter-spacing:.06em;padding:3px 0}
  .rail b{position:relative;cursor:pointer}
  .rail b::before{content:"";position:absolute;left:-3px;right:-3px;top:-20px;bottom:-20px}
}
@media (max-width:900px) and (max-height:760px){
  .stg.v8 .twtx h2{font-size:24px!important}
  .twvis{padding:10px!important;gap:8px!important}
  .cmmain p{display:none!important}
  .acnext .acby,.acnext .ac1,.acnext .acm{display:none!important}
  .acnext{padding:14px 16px!important;gap:6px!important}
}
@media (prefers-reduced-motion:reduce){.stage .jnext,.stage .railn{display:none!important}}
@media (max-width:900px) and (max-height:660px){.stg.v8 .twtx h2{font-size:22px!important}}

/* ===== revisão 6 · frente st1 · estação 1: duas pistas sobre uma grade única de 4 passos ===== */
/* --- a caixa: 4 colunas = 4 passos; linhas = passos · rótulo · pessoas · rótulo · agentes --- */
.twin .twvis.r6a{--g:8px;position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(5,auto);
  gap:0 var(--g)!important;padding:16px 16px 18px!important;border-radius:18px;border:1px solid rgba(255,255,255,.16);box-shadow:none;
  font-family:var(--font-b);counter-reset:r6a;text-align:left}
.r6a>*{position:relative;z-index:1;min-width:0}
.r6a-c1{grid-column:1}.r6a-c2{grid-column:2}.r6a-c3{grid-column:3}.r6a-c4{grid-column:4}
/* passos (cabeçalho das colunas) */
.r6a-fs{grid-row:1;display:flex;align-items:flex-start;gap:7px;padding:0 2px 12px 1px;font:600 12px/1.3 var(--font-b);letter-spacing:.08em;text-transform:uppercase;color:#AEACC3;counter-increment:r6a}
.r6a-fs::before{content:counter(r6a);color:#fff;flex:none}
.r6a-fs.r6a-h{color:#F4B489}.r6a-fs.r6a-h::before{color:#F4B489}
/* trilho: a linha sob os passos; o token anda sobre ela */
.r6a .r6a-rail{grid-column:1/-1;grid-row:1;align-self:end;height:1px;background:rgba(255,255,255,.2);z-index:2}
.r6a-tkw{position:absolute;inset:0;animation:r6a-tok 8s linear infinite paused} /* do tamanho do trilho: translate em % anda em fração do trilho, sem container queries */
.r6a-tok{position:absolute;top:-5px;left:calc(75% + var(--g)*.75 + 1px);width:11px;height:11px;border-radius:3px;background:#fff;box-shadow:0 0 12px rgba(255,255,255,.85)}
/* realce da coluna ativa e zona da decisão humana */
.r6a .r6a-col,.r6a .r6a-zone{grid-row:1/-1;z-index:0;pointer-events:none;margin:-9px calc(var(--g)/-2) -10px;border-radius:12px}
.r6a-col{background:rgba(255,255,255,.09);opacity:0;animation:8s linear infinite paused}
.r6a-col.r6a-c1{animation-name:r6a-c1}.r6a-col.r6a-c2{animation-name:r6a-c2}.r6a-col.r6a-c3{animation-name:r6a-c3}.r6a-col.r6a-c4{animation-name:r6a-c4;opacity:1}
.r6a .r6a-zone{grid-column:4;background:rgba(224,122,58,.1);border:1px solid rgba(224,122,58,.5)}
/* rótulos das pistas */
.r6a-lt,.r6a-smp{font:600 12px/1.3 var(--font-b);letter-spacing:.08em;text-transform:uppercase;color:#AEACC3}
.r6a-lt{grid-column:1/4;grid-row:2;padding:14px 0 8px}
.r6a-lt.r6a-la{grid-row:4;padding-top:16px}
.r6a .r6a-smp{position:absolute;right:0;top:-30px;line-height:12px;padding:4px 8px;border-radius:999px;background:rgba(26,26,46,.82);white-space:nowrap;color:#C9C7DA;font-weight:500} /* acima da caixa, na linha do sobretítulo: não é rótulo de nenhuma coluna; fundo próprio (como o pill FACTORY/OFFICE) porque ali atrás é a cena 3D — a 1024x768 cai na escada lilás clara */
/* células: as 6 iguais; só a cor muda */
.r6a-fn{display:grid;grid-template-rows:auto auto 1fr;gap:4px;align-content:start;justify-items:start;padding:10px 7px 9px;border-radius:12px} /* 7 px dos lados: o rótulo do documento cabe numa linha a 12 px */
.r6a-fn.r6a-p{grid-row:3;background:#F7F6FB;color:#1A1A2E}
.r6a-fn.r6a-a{grid-row:5;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);color:#fff}
.r6a-fn.r6a-o{box-shadow:inset 0 0 0 2px var(--orange);animation:r6a-ring 8s linear infinite paused}
.r6a-fnh{display:flex;flex-direction:column;align-items:flex-start;gap:5px;max-width:100%}
.r6a-fnh .pp,.r6a-av{width:22px;height:22px;flex:none;display:block}
.r6a-fn b{font:600 13px/1.25 var(--font-b);letter-spacing:-.01em}
.r6a-fn em{font:500 12.5px/1.3 var(--font-b);font-style:normal;min-height:2.6em;color:#565E6C}
.r6a-fn.r6a-a em{color:#C9C7DA}
.r6a-doc{width:100%;align-self:end;display:grid;gap:3px;margin-top:4px;font:500 12px/1.3 var(--font-b)}
.r6a-p .r6a-doc{padding:8px 7px;border-radius:9px;background:#fff;border:1px solid #E1E4EC;color:#1B2433}
.r6a-a .r6a-doc{padding:0 0 2px;color:#E6E4F2}
.r6a-doc{position:relative}.r6a-nw{white-space:nowrap}
.r6a-doc small{font:600 12px/1.3 var(--font-b);letter-spacing:0;color:#5F6878}
.r6a-a .r6a-doc small{color:#AEACC3}
.r6a-doc strong{font:600 clamp(13px,1.05vw,15px)/1.25 var(--font-b);font-variant-numeric:tabular-nums;white-space:nowrap}
.r6a-st{min-height:2.6em;color:#565E6C}
.r6a-a .r6a-st{color:#E6E4F2;min-height:0}
.r6a-st.r6a-dot::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#E6E4F2;margin:0 6px 1px 0}
.r6a-st.r6a-ok{color:#A5481A;font-weight:600}
.r6a-chk{position:absolute;right:9px;bottom:calc(8px + 2.6em * 1 + 5px);width:16px;height:16px;border-radius:50%;border:2px solid var(--orange)}
.r6a-chk::after{content:"";position:absolute;left:4px;top:1.5px;width:3px;height:6.5px;border:solid #A5481A;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}

/* --- animação: um laço de 8 s, só transform/opacity, 6 nós; parada por padrão, roda só com a estação aberta --- */
.stg.v8.twin.on .r6a-tkw,.stg.v8.twin.on .r6a-col,.stg.v8.twin.on .r6a-fn.r6a-o{animation-play-state:running}
@keyframes r6a-tok{
  0%{transform:translateX(calc(-75% - var(--g)*.75));opacity:0}4%{opacity:1}
  25%{transform:translateX(calc(-75% - var(--g)*.75));animation-timing-function:cubic-bezier(.4,0,.2,1)}
  31%,50%{transform:translateX(calc(-50% - var(--g)*.5));animation-timing-function:cubic-bezier(.4,0,.2,1)}
  56%,75%{transform:translateX(calc(-25% - var(--g)*.25));animation-timing-function:cubic-bezier(.4,0,.2,1)}
  81%{transform:translateX(0)}97%{transform:translateX(0);opacity:1}100%{transform:translateX(0);opacity:0}}
@keyframes r6a-tokv{
  0%{transform:translateY(calc(-75% - var(--g)*.75));opacity:0}4%{opacity:1}
  25%{transform:translateY(calc(-75% - var(--g)*.75));animation-timing-function:cubic-bezier(.4,0,.2,1)}
  31%,50%{transform:translateY(calc(-50% - var(--g)*.5));animation-timing-function:cubic-bezier(.4,0,.2,1)}
  56%,75%{transform:translateY(calc(-25% - var(--g)*.25));animation-timing-function:cubic-bezier(.4,0,.2,1)}
  81%{transform:translateY(0)}97%{transform:translateY(0);opacity:1}100%{transform:translateY(0);opacity:0}}
@keyframes r6a-c1{0%{opacity:0}4%,25%{opacity:1}31%,100%{opacity:0}}
@keyframes r6a-c2{0%,25%{opacity:0}31%,50%{opacity:1}56%,100%{opacity:0}}
@keyframes r6a-c3{0%,50%{opacity:0}56%,75%{opacity:1}81%,100%{opacity:0}}
@keyframes r6a-c4{0%,75%{opacity:0}81%,97%{opacity:1}100%{opacity:0}}
@keyframes r6a-ring{0%,82%{transform:scale(1)}86%{transform:scale(1.035)}91%,100%{transform:scale(1)}}
/* sem movimento: a regra global da página desliga as animações e fica o estilo-base = estado final:
   token no passo 4, realce só na coluna 4 (c1–c3 têm opacidade-base 0), anel do Finance em escala 1 */

/* --- computador: texto e caixa com topo e base comuns --- */
@media (min-width:901px){
  .twin .twbox{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch;gap:0 clamp(28px,3vw,48px);height:auto;align-self:center;padding-top:26px}
  .twin .twtx{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:0}
  .twin .twtx .kick{position:absolute;left:0;top:-26px;white-space:nowrap;line-height:12px}
  .twin .twtx h2{font-size:clamp(36px,3.4vw,56px);line-height:1.04;margin:-.07em 0 20px}
  .twin .twtx p{margin:0 0 28px;max-width:42ch;font-size:clamp(16px,1.25vw,19px);line-height:1.55}
  .stg.v8.twin .twl{margin:0 0 28px;gap:0;border-bottom:1px solid rgba(255,255,255,.14)}
  .stg.v8.twin .twl div{grid-template-columns:96px 1fr;gap:16px;padding:12px 0;border:0;border-top:1px solid rgba(255,255,255,.14);border-radius:0;background:none}
  .stg.v8.twin .twl .o b{color:#F4B489}
  .twin .twtx .btn{margin-top:auto}
}
@media (min-width:901px) and (prefers-reduced-motion:no-preference){
  .stg.v8.twin{width:max(min(80vw,1560px),min(1152px,92vw))}
}
@media (min-width:901px){
  .stg.v8.twin{align-content:center}
}
/* telas baixas no computador (<= 800 px): o parágrafo FICA — a base o escondia; medido a 1280x720, cabe com a base do botão = base da caixa;
   sai só o rótulo do documento (Quote/Delivery…), o estado do trabalho fica. O parágrafo só sai abaixo de 680 px (regra seguinte) */
@media (min-width:901px) and (max-height:800px){
  .twin .twtx p{display:block}
  .twin .twvis.r6a{padding:14px 18px 16px!important}
  .r6a-fs{padding-bottom:9px}
  .r6a-lt{padding-top:10px;padding-bottom:6px}.r6a-lt.r6a-la{padding-top:12px}
  .r6a-fn{padding:8px 7px}
  .r6a-doc small{display:none}
  .r6a-p .r6a-doc{padding:6px 7px}
}
@media (min-width:901px) and (max-height:680px){.twin .twtx p{display:none}}
@media (min-width:901px) and (max-width:1200px){
  .twin .twbox{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:24px}
  .twin .twvis.r6a{--g:6px;padding-left:14px!important;padding-right:14px!important}
  .r6a-fn{padding-left:6px;padding-right:6px} /* 1024: o rótulo mais longo ('Quote Q-2291 · draft', 118 px a 12 px) ainda cabe numa linha */
  .r6a-a .r6a-st{min-height:2.6em}
}

/* --- celular: a grade gira — 4 linhas (passos) x 3 colunas (passo · pessoa · agente) --- */
@media (max-width:900px){
  .twin .twvis.r6a{--g:6px;grid-template-columns:min-content minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto repeat(4,minmax(48px,1fr));gap:var(--g)!important;padding:10px!important}
  .r6a-fs{grid-column:1;align-self:center;gap:5px;padding:0 2px 0 9px;font:600 12px/1.2 var(--font-b);letter-spacing:0;text-transform:none;color:#D6D4E4}
  .r6a-fs.r6a-c1{grid-row:2}.r6a-fs.r6a-c2{grid-row:3}.r6a-fs.r6a-c3{grid-row:4}.r6a-fs.r6a-c4{grid-row:5}
  .r6a .r6a-rail{grid-column:1;grid-row:2/-1;align-self:stretch;justify-self:start;width:2px;height:auto;border-radius:1px}
  .r6a-tok{left:-3px;top:calc(87.5% + var(--g)*.375 - 4px);width:8px;height:8px;border-radius:2px}.r6a-tkw{animation-name:r6a-tokv}
  .r6a-lt,.r6a-lt.r6a-la{grid-row:1;grid-column:2;align-self:end;padding:0 0 1px 2px;letter-spacing:0;text-transform:none;line-height:1.2}
  .r6a-lt.r6a-la{grid-column:3}
  .r6a .r6a-smp{top:-26px} /* celular: fica ACIMA da caixa, à direita (na altura do botão, que ocupa só a esquerda) — dentro da grade lia como título da coluna de passos */
  .twin .twtx .btn{min-height:44px}
  .r6a-fn.r6a-p{grid-column:2}.r6a-fn.r6a-a{grid-column:3}
  .r6a-fn.r6a-c1{grid-row:2}.r6a-fn.r6a-c2{grid-row:3}.r6a-fn.r6a-c3{grid-row:4}.r6a-fn.r6a-c4{grid-row:5}
  .r6a .r6a-col,.r6a .r6a-zone{grid-column:1/-1;margin:-3px -5px;border-radius:10px}
  .r6a .r6a-col.r6a-c1{grid-row:2}.r6a .r6a-col.r6a-c2{grid-row:3}.r6a .r6a-col.r6a-c3{grid-row:4}.r6a .r6a-col.r6a-c4,.r6a .r6a-zone{grid-row:5}
  .r6a-fn{grid-template-rows:auto auto;gap:2px;align-content:center;padding:5px 6px;border-radius:9px}
  .r6a-fnh{flex-direction:row;align-items:flex-start;gap:5px}
  .r6a-fnh .pp,.r6a-av{width:16px;height:16px;margin-top:-1px}
  .r6a-fn b{font-size:12px;line-height:1.2;letter-spacing:0}
  .r6a-fn em,.r6a-doc small,.r6a-st,.r6a-st.r6a-ok,.r6a-chk{display:none}
  .r6a-doc,.r6a-p .r6a-doc,.r6a-a .r6a-doc{margin:0;padding:0;border:0;background:none;align-self:start}
  .r6a-doc strong{font-size:12px;font-weight:500;line-height:1.2}
  .r6a-p .r6a-doc strong{color:#3A4150}.r6a-a .r6a-doc strong{color:#C9C7DA}
}
@media (max-width:379px){.r6a-fnh .pp,.r6a-av{display:none}.r6a-fn{padding:5px}}
@media (max-width:900px) and (max-height:700px){.twin .twvis.r6a{--g:4px}} /* 375x667: 4 vãos x 2 px = 8 px, sem rolagem interna */
@media (max-width:900px) and (max-height:660px){.r6a-doc,.r6a .r6a-smp{display:none}} /* sem os valores, o selo não tem o que rotular */

/* ===== R6 · frente gpd · SM-GPD (#ep0): escuro marinho, verde acima / vermelho abaixo da meta, laço de 8,6 s ===== */
#ep0 .gapp{position:relative;height:100%;display:flex;flex-direction:column;gap:10px;padding:0 16px 14px;background:#313D5C;border:1px solid rgba(255,255,255,.12);color:#E8ECF5;font-family:var(--font-b);--r6g-rh:36px}
#ep0 .gapp>*{flex:none;min-width:0}
#ep0 .gbar{margin:0 -16px;background:#0E1320;border-bottom:1px solid rgba(255,255,255,.1);color:#E8ECF5}
#ep0 .gbar em{font-size:12px;color:#BCC4D5}
#ep0 .gpill{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:end;gap:10px;justify-self:stretch;align-self:stretch}
#ep0 .r6g-ttl{display:grid;gap:3px;min-width:0}
#ep0 .gpill span{font-size:12px;letter-spacing:.1em;color:#BCC4D5!important}
#ep0 .gpill b{font:600 clamp(17px,1.35vw,21px)/1.15 var(--font-b);color:#E8ECF5;letter-spacing:-.005em}
#ep0 .r6g-btn{font:600 12.5px/1 var(--font-b);font-style:normal;padding:9px 14px;border-radius:999px;background:#E07A3A;color:#1A1A2E;white-space:nowrap;transform-origin:50% 50%}
#ep0 .r6g-cur{position:absolute;right:12px;bottom:3px;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.26),0 2px 6px rgba(0,0,0,.5);pointer-events:none}
/* KPIs */
#ep0 .gkpi{gap:10px}
#ep0 .gkpi .k{background:#3A4868;border:1px solid rgba(255,255,255,.1);box-shadow:none;border-radius:12px;padding:9px 12px}
#ep0 .gkpi .k.v{background:#234F46;border-color:rgba(16,185,129,.5)}
#ep0 .gkpi small{font-size:12px;letter-spacing:.06em;color:#BCC4D5!important}
#ep0 .gkpi .k.v small{color:#6EE7B7!important}
#ep0 .gkpi span{font-size:12px;color:#BCC4D5!important}
#ep0 .gkpi b{position:relative;justify-self:start;color:#E8ECF5}
#ep0 .gkpi .k.v b{color:#34D399}
/* unidades */
#ep0 .gu .r6g-un{display:block;margin:0 0 8px;padding:0 2px 6px;font:700 12px/1 var(--font-b);letter-spacing:.1em;text-align:left;color:#BCC4D5;border-bottom:1px solid rgba(255,255,255,.1)}
#ep0 .gu .r span{font-size:12px;color:#BCC4D5}
#ep0 .gu .vg,#ep0 .gu .vg2{background:rgba(16,185,129,.16)!important;color:#34D399!important}
#ep0 .gu .vr,#ep0 .gu .vl{background:rgba(240,82,82,.16)!important;color:#FF8A8A!important}
/* gráfico + ranking */
#ep0 .gbottom{flex:1 1 auto;min-height:0}
#ep0 .gch,#ep0 .grank{background:#3A4868;border:1px solid rgba(255,255,255,.1);box-shadow:none;border-radius:12px;min-width:0}
#ep0 .gch small,#ep0 .grank small{font-size:12px;letter-spacing:.06em;color:#BCC4D5!important}
#ep0 .mvl{font-size:12px;color:#BCC4D5;gap:4px 8px}#ep0 .mvh{margin-bottom:5px}
#ep0 .mvl .sw.up{background:#10B981}#ep0 .mvl .sw.dn{background:#F05252}#ep0 .mvl .sw.gl{background:#E8ECF5}
#ep0 .mvc text{font-family:Inter,system-ui,sans-serif;font-variant-numeric:tabular-nums}
#ep0 .mvc .r6g-q{transform-box:view-box}
#ep0 .mvtip{background:#0B0F19;border:1px solid rgba(255,255,255,.14)}#ep0 .mvtip .a{color:#FF8A8A}
#ep0 .r6g-tip{position:absolute;z-index:2;left:0;top:50%;font:600 12px/1 var(--font-b);padding:5px 8px;border-radius:7px;background:#2B1720;border:1px solid #F05252;color:#FFC2C2;white-space:nowrap;pointer-events:none;font-variant-numeric:tabular-nums}
#ep0 .r6g-tip::before{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;margin-left:-4px;background:#2B1720;border-left:1px solid #F05252;border-top:1px solid #F05252;transform:rotate(45deg)}
#ep0 .gapp.r6g-noch .gch{visibility:hidden}/* sem espaço o cartão sai inteiro, nada de caixa vazia; visibility (não display) para a caixa seguir medida */#ep0 .gapp.r6g-noch .r6g-tip,#ep0 .gapp.r6g-notip .r6g-tip{display:none}#ep0 .r6g-tip.r6g-abv::before{top:auto;bottom:-4px;border-top:0;border-left:0;border-right:1px solid #F05252;border-bottom:1px solid #F05252}#ep0 .r6g-tip.r6g-side::before{left:-4px;top:4px;margin-left:0;border-top:0;border-bottom:1px solid #F05252}
#ep0 .grank ol{position:relative;gap:4px;margin-top:4px}
#ep0 .grank li{height:var(--r6g-rh);box-sizing:border-box;grid-template-columns:22px minmax(0,1fr) auto!important;padding:0 4px 8px;align-items:center;font-size:clamp(12px,.85vw,13px);line-height:1.15;color:#E8ECF5;border-bottom:1px solid rgba(255,255,255,.08)}
#ep0 .grank li b{color:#E8ECF5}
#ep0 .grank li::after{bottom:4px;background:#7F8FB0}
#ep0 .grank li:first-child::after{background:#F05252}
#ep0 .grank li:nth-child(n+4)::after{background:rgba(255,255,255,.22)}
#ep0 .grank em{font-size:12px;background:#E8ECF5;color:#1B2238}
#ep0 .grank li:nth-child(n+4) em{background:rgba(255,255,255,.14);color:#E8ECF5}
/* computador estreito ou baixo: nomes do ranking em 2 linhas; sem a legenda de cores quando falta altura */
@media (min-width:901px) and (max-width:1380px){#ep0 .gapp{--r6g-rh:46px}}
@media (min-width:901px) and (max-height:800px){#ep0 .mvl{display:none}#ep0 .gkpi .k{padding:7px 12px}}
/* 901–1100 px: o gráfico é o protagonista (antes sobrava só o ranking) */
@media (min-width:901px) and (max-width:1100px){#ep0 .gbottom .gch{display:grid}#ep0 .gbottom .grank{display:none}}
/* celular: recorte próprio — barra, botão, 3 KPIs e o gráfico; sem máscara */
@media (max-width:900px){
  #ep0 .gapp{padding:0 10px 10px;gap:5px;-webkit-mask-image:none;mask-image:none}
  #ep0 .gbar{margin:0 -10px;padding:7px 10px}
  #ep0 .gpill{align-items:center}
  #ep0 .gpill span{display:none}#ep0 .gpill b{font-size:14px}
  #ep0 .r6g-btn{font-size:12px;padding:7px 11px}#ep0 .r6g-tip{padding:4px 6px}
  #ep0 .r6g-cur{width:8px;height:8px;box-shadow:0 0 0 3px rgba(255,255,255,.26),0 2px 5px rgba(0,0,0,.5)}
  #ep0 .gkpi .k{padding:5px 8px;gap:1px;border-radius:10px}
  #ep0 .gkpi .k span{display:none}
  #ep0 .gkpi small{letter-spacing:.02em}
  #ep0 .gkpi b{font-size:clamp(14px,4.2vw,17px);white-space:nowrap}
  #ep0 .gapp .gunits{display:none}
  #ep0 .gbottom{display:grid;grid-template-columns:minmax(0,1fr)}
  #ep0 .grank,#ep0 .mvh{display:none}
  #ep0 .gch.mv{grid-template-rows:minmax(0,1fr);padding:2px 8px}
  #ep0 .gch.mv .mvc{min-height:0}
}
/* celular baixo (360x640, 320x568): faixa de cima = Variance + o botão da decisão humana (o título sai; o botão fica);
   embaixo, o gráfico em largura total ocupa todo o resto do visor */
@media (max-width:900px) and (max-height:700px){
  #ep0 .gapp{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto minmax(0,1fr);align-content:stretch;gap:6px;padding:0 8px 8px}
  #ep0 .gbar{grid-column:1/-1;margin:0 -8px;padding:3px 8px}
  #ep0 .gkpi{grid-column:1;grid-row:2}
  #ep0 .gpill{grid-column:2;grid-row:2;justify-content:stretch}#ep0 .r6g-ttl{display:none}
  #ep0 .r6g-btn{flex:1;text-align:center;padding:6px 9px}
  #ep0 .gbottom{grid-column:1/-1;grid-row:3;grid-template-rows:minmax(0,1fr);min-height:0;contain:size}
  #ep0 .gkpi .k:not(.v){display:none}
  #ep0 .gkpi{grid-template-columns:minmax(0,1fr)}#ep0 .gkpi .k{align-content:center;padding:4px 8px}
  #ep0 .gch.mv{padding:3px 5px}
}
/* iPhone com a barra do Safari recolhida (390x730–840): aqui as abas ainda ocupam 2 linhas e o visor do mockup tem só ~110–200 px;
   empilhado, o gráfico ficaria com < 48 px (caixa vazia); até 840 porque o recorte normal só dá gráfico legível a partir de ~844. Variance + botão numa coluna à esquerda e o gráfico na altura toda à direita */
@media (max-width:900px) and (min-height:701px) and (max-height:840px) and (prefers-reduced-motion:no-preference){ /* só com o visor fixo; em movimento reduzido a estação é página comum */
  #ep0 .gapp{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);align-content:stretch;gap:6px 8px;padding:0 8px 8px}
  #ep0 .gbar{grid-column:1/-1;margin:0 -8px;padding:3px 8px}
  #ep0 .gkpi{grid-column:1;grid-row:2;grid-template-columns:minmax(0,1fr)}
  #ep0 .gkpi .k:not(.v){display:none}#ep0 .gkpi .k{align-content:center;padding:4px 8px}
  #ep0 .gpill{grid-column:1;grid-row:3;align-self:start;justify-content:stretch}#ep0 .r6g-ttl{display:none}
  #ep0 .r6g-btn{flex:1;text-align:center;padding:6px 9px}
  #ep0 .gbottom{grid-column:2;grid-row:2/4;grid-template-rows:minmax(0,1fr);min-height:0;contain:size}
  #ep0 .gch.mv{padding:3px 5px}
}
/* nos dois recortes baixos o cursor em repouso fica no centro vertical do botão (antes pousava na quina de baixo) */
@media (max-width:900px) and (max-height:840px) and (prefers-reduced-motion:no-preference){#ep0 .r6g-cur{top:50%;bottom:auto;margin-top:-4px;right:14px}}
/* 320x568: a faixa de cima encolhe para o gráfico (largura total) continuar visível embaixo */
@media (max-width:900px) and (max-height:600px){
  #ep0 .gapp{gap:3px;padding-bottom:6px}
  #ep0 .gbar{padding:0 8px}
  #ep0 .gkpi .k{padding:2px 8px;gap:0}
  #ep0 .gkpi small,#ep0 .gkpi b{line-height:1}
  #ep0 .gch.mv{padding:1px 5px}
}
/* laço: pausado por padrão; roda só com a estação aberta e nesta aba. O estilo base acima é o estado final. */
#ep0 .r6g-a{animation-duration:8.6s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.2,.8,.2,1);animation-play-state:paused}
.stg.v8.on #ep0.on .r6g-a{animation-play-state:running}
#ep0 .r6g-q1{animation-name:r6g-q1}#ep0 .r6g-q2{animation-name:r6g-q2}#ep0 .r6g-q3{animation-name:r6g-q3}
#ep0 .r6g-lab{animation-name:r6g-lab}
#ep0 .r6g-tip{animation-name:r6g-tip}
#ep0 .r6g-cur{animation-name:r6g-cur}
#ep0 .r6g-btn{animation-name:r6g-btn}
#ep0 .grank li:nth-child(-n+2)::after{transform-origin:0 50%;animation:r6g-bar 8.6s cubic-bezier(.2,.8,.2,1) infinite paused}
.stg.v8.on #ep0.on .grank li:nth-child(-n+2)::after{animation-play-state:running}
@media (prefers-reduced-motion:reduce){#ep0 .grank li::after{animation:none!important}}
@keyframes r6g-q1{0%{transform:scaleY(0);opacity:1}9%,94%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
@keyframes r6g-q2{0%,5%{transform:scaleY(0);opacity:1}15%,94%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
@keyframes r6g-q3{0%,10%{transform:scaleY(0);opacity:1}21%,94%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
@keyframes r6g-lab{0%,21%{opacity:0}26%,94%{opacity:1}100%{opacity:0}}
@keyframes r6g-tip{0%,34%{opacity:0}39%,94%{opacity:1}100%{opacity:0}}
@keyframes r6g-cur{0%,22%{opacity:0;transform:translate(calc(var(--r6g-jx,-180px) + 46px),calc(var(--r6g-jy,190px) + 40px))}25%{opacity:1;transform:translate(calc(var(--r6g-jx,-180px) + 46px),calc(var(--r6g-jy,190px) + 40px))}34%{opacity:1;transform:translate(var(--r6g-jx,-180px),var(--r6g-jy,190px))}60%{opacity:1;transform:translate(var(--r6g-jx,-180px),var(--r6g-jy,190px));animation-timing-function:cubic-bezier(.4,0,1,1)}70%{opacity:1;transform:translate(0,0) scale(1)}72%{transform:translate(0,0) scale(.7)}75%,94%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(0,0)}}
@keyframes r6g-bar{0%,51%{transform:scaleX(0)}60%,100%{transform:scaleX(1)}}
@keyframes r6g-btn{0%,70%{transform:scale(1)}72%{transform:scale(.95)}76%,100%{transform:scale(1)}}

/* ===== R6 · frente shift · Shift Optimizer (#ep1): quadro de turno claro frio, trilho escuro, laço de 6 s ===== */
/* rodada final: o mockup preenche o visor (a base força .stg.v8.mg .mk{height:auto!important} no computador) */
#ep1 .mk{height:100%!important;box-sizing:border-box;position:relative;display:flex;flex-direction:column;gap:10px;padding:0 16px 14px;background:#EEF2F7;border:1px solid #D5DDE9;color:#1B2433;font-family:var(--font-b);font-variant-numeric:tabular-nums}
#ep1 .mk>*{flex:none;min-width:0}
#ep1 .mk>.r6s-board{flex:1 0 auto}
#ep1 .gbar{margin:0 -16px;background:#1F2A44;color:#fff}
#ep1 .gbar em{font-size:12px;color:#C6CEE0}
#ep1 .mkh{position:relative;z-index:3;align-items:end}
#ep1 .mkh small{font-size:12px;letter-spacing:.1em;color:#56627A!important}
#ep1 .mkh b{font:600 clamp(17px,1.35vw,21px)/1.15 var(--font-b);color:#1F2A44;letter-spacing:-.005em}
#ep1 .r6s-btn{position:relative;line-height:1;background:#E07A3A;color:#1A1A2E;transform-origin:50% 50%}
#ep1 .r6s-ring{position:absolute;inset:-4px;border-radius:999px;border:2px solid #E07A3A;opacity:0;pointer-events:none}
#ep1 .r6s-cur{position:absolute;right:5px;bottom:-7px;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 1.5px #1F2A44,0 0 0 6px rgba(31,42,68,.16),0 2px 6px rgba(0,0,0,.4);pointer-events:none}
/* KPIs */
#ep1 .gkpi{gap:10px}
#ep1 .gkpi .k{position:relative;background:#fff;border:1px solid #D5DDE9;box-shadow:none;border-radius:12px;padding:8px 12px}
#ep1 .gkpi .k.v{background:#E6F6EE;border-color:#8FD3B5}
#ep1 .gkpi small{font-size:12px;letter-spacing:.06em;color:#56627A!important;white-space:nowrap}
#ep1 .gkpi .k.v small{color:#047857!important}
#ep1 .gkpi span{font-size:12px;color:#56627A!important}
#ep1 .gkpi b{color:#1F2A44;font-size:clamp(18px,1.55vw,24px)}#ep1 .gkpi .k.v b{color:#047857}
#ep1 .r6s-old{position:absolute;inset:-1px;display:grid;align-content:start;gap:2px;padding:8px 12px;border-radius:12px;background:#FBEEF1;border:1px solid #E3A3B1;font-style:normal;opacity:0;transform-origin:20% 60%}
#ep1 .gkpi .k.v .r6s-old small,#ep1 .gkpi .k.v .r6s-old b{color:#9F1239!important}
#ep1 .gkpi .k.v .r6s-old b::before{content:"▼ "}
/* 'Positions filled' e total da Line 2 no estado-problema (117 / 118 · 41/42): somem junto com o 99% */
#ep1 .gkpi .r6s-o2{background:#fff;border-color:#D5DDE9}#ep1 .gkpi .r6s-o2 b{color:#9F1239}
#ep1 .r6s-tot{position:relative}
#ep1 .r6s-tb{position:absolute;inset:0 -3px 0 0;display:flex;align-items:center;gap:inherit;padding-left:inherit;background:#fff;color:#9F1239;font-style:normal}
/* ▲/▼ herdam .6em da base (10,4 px no celular): .7em fica >= 12 px */
#ep1 .gkpi .k.v b::before{font-size:.7em}
/* quadro: trilho escuro + 3 linhas x 10 postos + banco de reserva */
#ep1 .r6s-board{position:relative;display:grid;grid-template-columns:calc(var(--r6s-rail) + 6px) repeat(10,minmax(0,1fr)) auto;grid-auto-rows:minmax(var(--r6s-rh),1fr);column-gap:var(--r6s-cg);row-gap:var(--r6s-rg);padding:10px 12px 10px 0;background:#fff;border:1px solid #D5DDE9;border-radius:12px;overflow:hidden;--r6s-rail:70px;--r6s-rh:24px;--r6s-cg:4px;--r6s-rg:6px}
#ep1 .r6s-board::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--r6s-rail);background:#1F2A44}
#ep1 .r6s-ln{position:relative;z-index:1;display:flex;align-items:center;padding-left:12px;font:600 12px/1 var(--font-b);letter-spacing:.02em;color:#E8ECF5;white-space:nowrap}
#ep1 .r6s-ln.r6s-sb{grid-row:4;grid-column:1;color:#AEB9CF}
#ep1 .r6s-s{position:relative;display:block;border-radius:5px;background:#DCE3EE}
#ep1 .r6s-hole{background:none}
#ep1 .r6s-hole::before{content:"";position:absolute;inset:0;border-radius:5px;border:1px solid #9F1239;background:repeating-linear-gradient(135deg,#F1C9D2 0 3px,#fff 3px 7px);opacity:0}
#ep1 .r6s-in{position:absolute;inset:0;z-index:3;border-radius:5px;background:#0E7490}
#ep1 .r6s-w1{z-index:2;background:#1F2A44}
#ep1 .r6s-w2{z-index:2;background:#7C8AA5}
#ep1 .r6s-lk{background:#fff;border:2px solid #1F2A44}
#ep1 .r6s-lk::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:2px;background:#1F2A44}
#ep1 .r6s-gh{grid-row:4;grid-column:10;background:none;border:1.5px dashed #B3BFD2}
#ep1 .r6s-sb2{grid-row:4;grid-column:11}
#ep1 .r6s-tot{display:flex;align-items:center;gap:6px;padding-left:8px;font:600 12.5px/1 var(--font-b);color:#334155;white-space:nowrap}
#ep1 .r6s-dot{position:relative;flex:none;width:9px;height:9px;border-radius:50%;border:1.5px solid #94A3B8;box-sizing:border-box}
#ep1 .r6s-ok{position:absolute;inset:-1.5px;border-radius:50%;background:#059669}
/* legenda das trocas: os 4 trabalhadores e os motivos da tabela anterior */
#ep1 .r6s-mv{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 8px}
#ep1 .r6s-mv li{display:grid;grid-template-columns:12px minmax(0,1fr);column-gap:8px;row-gap:2px;align-items:center;padding:6px 10px;border-radius:9px;background:#fff;border:1px solid #D5DDE9;margin:0}
#ep1 .r6s-mv li::before,#ep1 .r6s-mv li::marker{content:none}
#ep1 .r6s-mv i{width:12px;height:12px;border-radius:3px;box-sizing:border-box}
#ep1 .r6s-mv p{margin:0;font:400 13px/1.2 var(--font-b);color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ep1 .r6s-mv p b{font-weight:600;color:#1F2A44}
#ep1 .r6s-mv em{grid-column:2;font:400 12px/1.2 var(--font-b);font-style:normal;color:#56627A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ep1 .r6s-k1{background:#E4F2F6!important;border-color:#8CC3D1!important}
#ep1 .r6s-k1 i{background:#0E7490}#ep1 .r6s-k1 em{color:#0B5C73}
#ep1 .r6s-k2 i{background:#1F2A44}#ep1 .r6s-k3 i{background:#7C8AA5}
#ep1 .r6s-k4 i{background:#fff;border:2px solid #1F2A44}
@media (min-width:901px){#ep1 .gkpi{grid-template-columns:minmax(0,.8fr) minmax(0,1.1fr) minmax(0,1.1fr)}}
@media (min-width:901px) and (max-width:1366px){#ep1 .gkpi small{letter-spacing:.03em}#ep1 .gkpi .k,#ep1 .r6s-old{padding:8px 10px}}
/* computador baixo: a legenda perde os motivos, depois some */
@media (min-width:901px) and (max-height:800px){#ep1 .r6s-mv em{display:none}#ep1 .gkpi .k span{display:none}}
@media (min-width:901px) and (max-height:700px){#ep1 .r6s-mv{display:none}}
@media (min-width:901px) and (max-width:1100px){#ep1 .r6s-ln{padding-left:9px}#ep1 .r6s-tot{padding-left:4px}#ep1 .r6s-mv p span{display:none}}
/* celular: recorte próprio — barra, botão, Coverage e o quadro; sem máscara */
@media (max-width:900px){
  #ep1 .mk{display:grid;grid-template-columns:88px minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);align-content:start;gap:7px;padding:0 10px 10px;-webkit-mask-image:none;mask-image:none}
  #ep1 .gbar{grid-column:1/-1;margin:0 -10px;padding:7px 10px}
  #ep1 .mkh{grid-column:1/-1;flex-wrap:nowrap;align-items:center}
  #ep1 .mkh small{display:none}#ep1 .mkh b{font-size:14px}
  #ep1 .r6s-btn{font-size:12px;padding:7px 11px}
  #ep1 .gkpi{grid-template-columns:minmax(0,1fr);gap:0}
  #ep1 .gkpi .k:not(.v){display:none}
  #ep1 .gkpi .k,#ep1 .r6s-old{padding:6px 8px;align-content:center;gap:2px;border-radius:10px}
  /* pilhas iguais (small+b) nas duas camadas: sem o span, o crossfade 92%->100% fica alinhado; a animação já conta o "was 92%" */
  #ep1 .gkpi .k span{display:none}
  #ep1 .gkpi small{letter-spacing:.02em}
  #ep1 .gkpi .k b{font-size:clamp(16px,4.8vw,19px);white-space:nowrap}
  #ep1 .r6s-mv,#ep1 .r6s-sb{display:none}
  #ep1 .r6s-board{--r6s-rail:48px;--r6s-rh:22px;--r6s-cg:2px;--r6s-rg:5px;padding:8px 8px 8px 0;border-radius:10px;grid-template-columns:calc(var(--r6s-rail) + 4px) repeat(10,minmax(0,1fr)) auto}
  #ep1 .r6s-ln{padding-left:8px}
  #ep1 .r6s-s,#ep1 .r6s-in,#ep1 .r6s-hole::before{border-radius:3px}
  #ep1 .r6s-tot{padding-left:4px}#ep1 .r6s-tot span{display:none}
  #ep1 .r6s-lk::after{width:4px;height:4px;margin:-2px 0 0 -2px}
  #ep1 .r6s-in{animation-name:r6s-inm}
  #ep1 .r6s-cur{animation-name:r6s-curm}
}
/* celular alto: sobra altura para a troca ativa (W-0217) numa linha de legenda */
@media (max-width:900px) and (min-height:800px){
  #ep1 .mk{grid-template-rows:auto auto minmax(0,1fr) auto}
  #ep1 .r6s-mv{display:block;grid-column:1/-1}
  #ep1 .r6s-mv li:not(.r6s-k1){display:none}
  #ep1 .r6s-mv li{padding:5px 9px}#ep1 .r6s-mv p{font-size:12.5px}
}
/* celular baixo (360x640): some só o título; o botão da pessoa (com anel e cursor) sobe para a coluna do quadro,
   e o Coverage ocupa a altura das duas linhas — nada ganha altura, a história termina na decisão */
@media (max-width:900px) and (max-height:700px){
  #ep1 .mk{row-gap:4px}#ep1 .gbar{padding:5px 10px}
  #ep1 .mkh{grid-column:2;grid-row:2;justify-content:flex-end}#ep1 .mkh>div{display:none}
  #ep1 .gkpi{grid-column:1;grid-row:2/span 2}
  #ep1 .r6s-board{grid-column:2;grid-row:3;--r6s-rh:22px;--r6s-rg:12px;padding:4px 8px 4px 0;grid-auto-rows:var(--r6s-rh);align-content:center}
  #ep1 .r6s-lk{border-width:1.5px}
  #ep1 .r6s-btn{padding:4px 10px}
  #ep1 .gkpi .k span{display:none}
}
/* rodada final — preencher o visor SEM distorcer: a linha do quadro cresce no máximo até a largura do posto (posto quadrado)
   e para; a altura que sobra vira respiro em volta do bloco centrado. Largura do posto = (largura útil do .mk − partes fixas)/10:
   computador 194 px (trilho 76 + total ~62 + vãos 44 + borda 12) · celular 190 px (Coverage 88+7, trilho 52, ponto 13, vãos 22, borda 8).
   Sem container queries (Safari antigo) fica a regra anterior. align-content:center não abre vão entre linhas: as trocas W-0142/W-0175
   continuam deslocando exatamente 100% + var(--r6s-rg). */
@supports (width:1cqw){
  #ep1 .mk{container-type:inline-size}
  /* base 0 + piso = 4 linhas no mínimo (o que o 'auto' dava antes): sem isto a base 'auto' mede as linhas já no teto e empurra a legenda */
  #ep1 .mk>.r6s-board{flex:1 0 0;min-height:calc(4*var(--r6s-rh) + 3*var(--r6s-rg))}
  #ep1 .r6s-board{--r6s-fx:194px;grid-auto-rows:minmax(var(--r6s-rh),calc((100cqw - var(--r6s-fx))/10));align-content:center}
  @media (max-width:900px){#ep1 .r6s-board{--r6s-fx:190px}}
}
/* celular muito baixo (320x568): o piso de 4 linhas não cabe no visor de ~117 px; linhas de 14 px e vão de 4 px,
   sem altura mínima forçada — o quadro inteiro (Line 1-3) cabe e a troca continua deslocando 100% + var(--r6s-rg) */
@media (max-width:900px) and (max-height:600px){
  #ep1 .r6s-board{--r6s-rh:14px;--r6s-rg:4px;padding:2px 6px 2px 0;grid-auto-rows:var(--r6s-rh)}
  #ep1 .mk>.r6s-board{min-height:0;flex:0 0 auto}
}
/* laço: pausado por padrão; roda só com a estação aberta e nesta aba. O estilo base acima é o estado final. */
#ep1 .r6s-a{animation-duration:6s;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(.4,0,.2,1);animation-play-state:paused}
#ep1 .r6s-hole::before{animation:r6s-hole 6s cubic-bezier(.4,0,.2,1) infinite paused}
/* reinício: o mockup inteiro esmaece (não só o quadro) — nada fica em 100% com o quadro apagado */
#ep1 .mk{animation:r6s-mk 6s cubic-bezier(.4,0,.2,1) infinite paused}
.stg.v8.on #ep1.on .r6s-a,.stg.v8.on #ep1.on .r6s-hole::before,.stg.v8.on #ep1.on .mk{animation-play-state:running}
/* reduce: a base força .stg *{opacity:1} — sem isto o 99%, o 117 / 118, o 41/42 e o anel ficariam por cima do estado final */
@media (prefers-reduced-motion:reduce){#ep1 .r6s-old,#ep1 .r6s-o2,#ep1 .r6s-ring{display:none}}
#ep1 .r6s-in{animation-name:r6s-in}
#ep1 .r6s-w1{animation-name:r6s-w1}#ep1 .r6s-w2{animation-name:r6s-w2}
#ep1 .r6s-g1{animation-name:r6s-g1}#ep1 .r6s-g3{animation-name:r6s-g3}
#ep1 .r6s-old{animation-name:r6s-old}
#ep1 .r6s-o2{animation-name:r6s-o2}
#ep1 .r6s-cur{animation-name:r6s-cur}
#ep1 .r6s-ring{animation-name:r6s-ring}
@media (max-width:900px){#ep1 .r6s-in{animation-name:r6s-inm}#ep1 .r6s-cur{animation-name:r6s-curm}}
@keyframes r6s-mk{0%{opacity:.4}3.5%,96%{opacity:1}100%{opacity:.4}}
@keyframes r6s-o2{0%,53.3%{opacity:1}57%,99.9%{opacity:0}100%{opacity:1}}
@keyframes r6s-hole{0%,2%{opacity:1}5.5%{opacity:.3}9%{opacity:1}12.5%{opacity:.3}16%,33.3%{opacity:1}38.3%,100%{opacity:0}}
@keyframes r6s-in{0%,20%{transform:translate(calc(200% + 2*var(--r6s-cg)),calc(200% + 2*var(--r6s-rg))) scale(1)}27%{transform:translate(calc(170% + 2*var(--r6s-cg)),calc(60% + var(--r6s-rg))) scale(1.2)}33.3%{transform:translate(0,0) scale(1.2)}38.3%,100%{transform:translate(0,0) scale(1)}}
@keyframes r6s-inm{0%,20%{opacity:0;transform:translate(0,230%) scale(1)}23%{opacity:1;transform:translate(0,190%) scale(1.2)}33.3%{opacity:1;transform:translate(0,0) scale(1.2)}38.3%,100%{opacity:1;transform:translate(0,0) scale(1)}}
@keyframes r6s-w1{0%,37%{transform:translate(0,calc(100% + var(--r6s-rg)))}43.5%{transform:translate(-62%,calc(50% + var(--r6s-rg)/2))}50%,100%{transform:translate(0,0)}}
@keyframes r6s-w2{0%,37%{transform:translate(0,calc(-100% - var(--r6s-rg)))}43.5%{transform:translate(62%,calc(-50% - var(--r6s-rg)/2))}50%,100%{transform:translate(0,0)}}
@keyframes r6s-g1{0%,50%{opacity:0;transform:scale(.3)}53.3%,100%{opacity:1;transform:scale(1)}}
@keyframes r6s-g3{0%,53.3%{opacity:0;transform:scale(.3)}56.7%,100%{opacity:1;transform:scale(1)}}
@keyframes r6s-old{0%,13.3%{opacity:1;transform:scale(1)}16.6%{opacity:1;transform:scale(1.05)}20%,53.3%{opacity:1;transform:scale(1)}57%,99.9%{opacity:0;transform:scale(1)}100%{opacity:1;transform:scale(1)}}
@keyframes r6s-cur{0%,61%{opacity:0;transform:translate(34px,84px) scale(1)}63%{opacity:1;transform:translate(34px,84px) scale(1)}67%{opacity:1;transform:translate(22px,14px) scale(1)}70%{opacity:1;transform:translate(0,0) scale(1)}72%{opacity:1;transform:translate(0,0) scale(.7)}74.5%,94%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(0,0)}}
@keyframes r6s-curm{0%,61%{opacity:0;transform:translate(22px,40px) scale(1)}63%{opacity:1;transform:translate(22px,40px) scale(1)}67%{opacity:1;transform:translate(16px,10px) scale(1)}70%{opacity:1;transform:translate(0,0) scale(1)}72%{opacity:1;transform:translate(0,0) scale(.7)}74.5%,94%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(0,0)}}
@keyframes r6s-ring{0%,70.5%{opacity:0;transform:scale(.92)}72%{opacity:1;transform:scale(.96)}81%,100%{opacity:0;transform:scale(1.22)}}

/* ===== R6 · frente freight · Freight Invoice Control (#ep2): mesa de ardósia + duas folhas; tijolo na divergência, verde no OK ===== */
#ep2 .mk{min-height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;padding:0 16px 16px;background:#313A4B;border:1px solid rgba(255,255,255,.16);color:#E8ECF5;font-family:var(--font-b)}
#ep2 .mk>*{flex:none;min-width:0}
/* a sobra de altura do visor fica em volta das folhas (cabeçalho colado na barra, aviso no pé) */
#ep2 .r6f-cmp{margin-top:auto;margin-bottom:auto}
#ep2 .gbar{margin:0 -16px;padding-left:16px;padding-right:16px;background:#1C212C;border-bottom:1px solid rgba(255,255,255,.1);color:#E8ECF5}
#ep2 .gbar em{font-size:12px;color:#AEB6C8}
#ep2 .mkh{position:relative;z-index:3;align-items:end}
#ep2 .mkh small{font-size:12px;letter-spacing:.08em;color:#AEB6C8!important}
#ep2 .mkh b{display:block;margin-top:3px;font:600 clamp(17px,1.35vw,21px)/1.15 var(--font-b);color:#F1F3F8;letter-spacing:-.005em}
#ep2 .mkbtn{font:600 12.5px/1 var(--font-b);padding:9px 14px;background:#E07A3A;color:#1A1A2E}
#ep2 .r6f-cur{position:absolute;right:5px;bottom:-7px;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.24),0 2px 6px rgba(0,0,0,.5);pointer-events:none;--r6f-cx:-150px;--r6f-cy:150px}
/* as duas folhas: uma grade só (rótulo · valor | veredito | rótulo · valor); as folhas são o fundo das colunas */
#ep2 .r6f-cmp{position:relative;margin-right:12px;color:#E8ECF5;font-size:13.5px;line-height:1.2;
  --r6f-rh:34px;--r6f-hh:30px;--r6f-sx:6px;--r6f-pad:12px;--r6f-cols:minmax(0,1.12fr) 78px 42px minmax(0,1fr) 102px}
#ep2 .r6f-bg,#ep2 .r6f-hd,#ep2 .r6f-row{display:grid;grid-template-columns:var(--r6f-cols)}
#ep2 .r6f-bg{position:absolute;inset:0}
/* as divisórias da 2ª linha em diante são desenhadas também na própria folha (estática): quando a linha ruim desliza, a divisória continua até a borda */
#ep2 .r6f-bg i{background:repeating-linear-gradient(to bottom,#E9ECF2 0 1px,transparent 1px var(--r6f-rh)) 0 calc(var(--r6f-hh) + var(--r6f-rh))/100% calc(100% - var(--r6f-hh) - var(--r6f-rh)) no-repeat #fff;border-radius:8px;box-shadow:0 6px 16px -8px rgba(0,0,0,.5)}
#ep2 .r6f-bg i:first-child{grid-column:1/3}#ep2 .r6f-bg i:last-child{grid-column:4/6}
#ep2 .r6f-hd{position:relative;height:var(--r6f-hh);align-items:center}
#ep2 .r6f-hd span{padding:0 var(--r6f-pad);font:600 12px/1 var(--font-b);letter-spacing:.08em;text-transform:uppercase;color:#5B6475}
#ep2 .r6f-hd span:first-child{grid-column:1/3}#ep2 .r6f-hd span:last-child{grid-column:4/6}
#ep2 .r6f-row{position:relative;height:var(--r6f-rh)}
#ep2 .r6f-row>*{line-height:calc(var(--r6f-rh) - 1px);min-width:0;white-space:nowrap}
#ep2 .r6f-l,#ep2 .r6f-i,#ep2 .r6f-l2,#ep2 .r6f-k{border-top:1px solid #E9ECF2}
#ep2 .r6f-l,#ep2 .r6f-l2{padding-left:var(--r6f-pad);overflow:hidden;text-overflow:ellipsis}
#ep2 .r6f-l{grid-column:1;color:#1B2433}#ep2 .r6f-l2{grid-column:4;color:#5B6475}
#ep2 .r6f-i,#ep2 .r6f-k{padding-right:var(--r6f-pad);text-align:right;font-weight:600;color:#1B2433}
#ep2 .r6f-i{grid-column:2}#ep2 .r6f-k{grid-column:5}
/* veredito: selo redondo na coluna do meio */
#ep2 .r6f-v{grid-column:3;position:relative;display:grid;place-items:center}
#ep2 .r6f-v svg{width:22px;height:22px;border-radius:50%;border:2px solid #fff;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
#ep2 .r6f-ok svg{background:#047857}#ep2 .r6f-no svg{background:#C2410C;position:relative;left:calc(var(--r6f-sx)*-.5)}
/* sublinhado tijolo sob o valor cobrado a mais (entra junto com o ✗ da linha) */
#ep2 .r6f-u{position:absolute;right:calc(100% + var(--r6f-pad));bottom:calc(50% - .78em);width:5.45ch;height:2px;border-radius:2px;background:#C2410C;font-weight:600}
#ep2 .r6f-k{display:flex;justify-content:flex-end;align-items:center;gap:7px}
#ep2 .r6f-chip{font:600 12px/1 var(--font-b);font-style:normal;padding:4px 7px;border-radius:999px;background:#C2410C;color:#fff}
/* as duas divergências saem da folha (repouso = estado final) */
#ep2 .r6f-bad{z-index:1;transform:translateX(var(--r6f-sx))}
#ep2 .r6f-bad>:not(.r6f-v){background:#fff}
#ep2 .r6f-bad .r6f-i{border-radius:0 6px 6px 0}
/* na folha do contrato a célula encolhe o mesmo deslocamento: a borda direita repousa na borda da folha, e o valor alinha com as outras linhas */
#ep2 .r6f-bad .r6f-k{margin-right:var(--r6f-sx);border-radius:0 8px 8px 0}#ep2 .r6f-bad .r6f-l,#ep2 .r6f-bad .r6f-l2{border-bottom-left-radius:8px}
/* régua de leitura */
#ep2 .r6f-bar{position:absolute;z-index:2;left:-5px;right:-5px;top:var(--r6f-hh);height:var(--r6f-rh);border-radius:7px;background:rgba(42,49,64,.12);box-shadow:inset 0 0 0 1.5px rgba(42,49,64,.55);opacity:0;pointer-events:none}
/* aviso: é aqui que uma pessoa entra */
#ep2 .mkflag{align-self:stretch;gap:3px;padding:10px 14px;background:rgba(244,180,137,.1);border:1px solid rgba(244,180,137,.45)}
#ep2 .mkflag b{font-size:14px;color:#F4B489}#ep2 .mkflag span{font-size:13px;line-height:1.35;color:#D5DAE5}
/* laço: só transform/opacity; pausado fora da estação aberta; ao abrir a aba recomeça do zero (o painel sai de display:none) */
#ep2 .r6f-a{animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused}
.stg.v8.on #ep2.on .r6f-a{animation-play-state:running}
@keyframes r6f-in5{0%{opacity:0;transform:translateY(8px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}5.56%{opacity:1;transform:none}94.44%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes r6f-bar5{0%{opacity:0;transform:translateY(0)}5.56%{opacity:0;transform:translateY(0)}7.22%{opacity:1;transform:translateY(0)}11.11%{opacity:1;transform:translateY(calc(var(--r6f-rh)*0));animation-timing-function:cubic-bezier(.45,0,.25,1)}13.89%{opacity:1;transform:translateY(calc(var(--r6f-rh)*1))}19.44%{opacity:1;transform:translateY(calc(var(--r6f-rh)*1));animation-timing-function:cubic-bezier(.45,0,.25,1)}22.22%{opacity:1;transform:translateY(calc(var(--r6f-rh)*2))}27.78%{opacity:1;transform:translateY(calc(var(--r6f-rh)*2));animation-timing-function:cubic-bezier(.45,0,.25,1)}30.56%{opacity:1;transform:translateY(calc(var(--r6f-rh)*3))}36.11%{opacity:1;transform:translateY(calc(var(--r6f-rh)*3));animation-timing-function:cubic-bezier(.45,0,.25,1)}38.89%{opacity:1;transform:translateY(calc(var(--r6f-rh)*4))}45.14%{opacity:1;transform:translateY(calc(var(--r6f-rh)*4))}47.22%{opacity:0;transform:translateY(calc(var(--r6f-rh)*4))}47.5%{opacity:0;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes r6f-v50{0%{opacity:0;transform:scale(.6)}7.78%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}10.83%{opacity:1;transform:none}99.86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v51{0%{opacity:0;transform:scale(.6)}16.11%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}19.17%{opacity:1;transform:none}99.86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v52{0%{opacity:0;transform:scale(.6)}24.44%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}27.5%{opacity:1;transform:none}99.86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v53{0%{opacity:0;transform:scale(.6)}32.78%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}35.83%{opacity:1;transform:none}99.86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v54{0%{opacity:0;transform:scale(.6)}41.11%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}44.17%{opacity:1;transform:none}99.86%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-chip5{0%{opacity:0;transform:translateX(6px)}34.17%{opacity:0;transform:translateX(6px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}37.64%{opacity:1;transform:none}99.86%{opacity:1;transform:none}100%{opacity:0;transform:translateX(6px)}}
@keyframes r6f-out5{0%{transform:translateX(0)}50%{transform:translateX(0);animation-timing-function:cubic-bezier(.2,.8,.2,1)}61.11%{transform:translateX(var(--r6f-sx))}99.86%{transform:translateX(var(--r6f-sx))}100%{transform:translateX(0)}}
@keyframes r6f-flag5{0%{opacity:.3;transform:translateY(4px)}61.11%{opacity:.3;transform:translateY(4px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}66.67%{opacity:1;transform:none}94.44%{opacity:1;transform:none}100%{opacity:.3;transform:translateY(4px)}}
@keyframes r6f-cur5{0%{opacity:0;transform:translate(var(--r6f-cx),var(--r6f-cy))}64.58%{opacity:0;transform:translate(var(--r6f-cx),var(--r6f-cy))}66.67%{opacity:1;transform:translate(var(--r6f-cx),var(--r6f-cy));animation-timing-function:cubic-bezier(.45,0,.25,1)}73.61%{opacity:1;transform:none}74.86%{opacity:1;transform:scale(.62)}76.39%{opacity:1;transform:none}94.44%{opacity:1;transform:none}100%{opacity:0;transform:none}}
#ep2 .r6f-cmp>:nth-child(3) .r6f-v{animation-name:r6f-v50}#ep2 .r6f-cmp>:nth-child(4) .r6f-v{animation-name:r6f-v51}#ep2 .r6f-cmp>:nth-child(5) .r6f-v{animation-name:r6f-v52}#ep2 .r6f-cmp>:nth-child(6) .r6f-v{animation-name:r6f-v53}#ep2 .r6f-cmp>:nth-child(7) .r6f-v{animation-name:r6f-v54}#ep2 .r6f-a{animation-duration:7.2s}#ep2 .r6f-cmp{animation-name:r6f-in5}#ep2 .r6f-bar{animation-name:r6f-bar5}#ep2 .r6f-chip{animation-name:r6f-chip5}#ep2 .r6f-bad{animation-name:r6f-out5}#ep2 .r6f-flag{animation-name:r6f-flag5}#ep2 .r6f-cur{animation-name:r6f-cur5}@keyframes r6f-in3{0%{opacity:0;transform:translateY(8px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}6.67%{opacity:1;transform:none}93.33%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes r6f-bar3{0%{opacity:0;transform:translateY(0)}6.67%{opacity:0;transform:translateY(0)}8.67%{opacity:1;transform:translateY(0)}13.33%{opacity:1;transform:translateY(calc(var(--r6f-rh)*0));animation-timing-function:cubic-bezier(.45,0,.25,1)}16.67%{opacity:1;transform:translateY(calc(var(--r6f-rh)*1))}23.33%{opacity:1;transform:translateY(calc(var(--r6f-rh)*1));animation-timing-function:cubic-bezier(.45,0,.25,1)}26.67%{opacity:1;transform:translateY(calc(var(--r6f-rh)*2))}34.17%{opacity:1;transform:translateY(calc(var(--r6f-rh)*2))}36.67%{opacity:0;transform:translateY(calc(var(--r6f-rh)*2))}37%{opacity:0;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes r6f-v30{0%{opacity:0;transform:scale(.6)}9.33%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}13%{opacity:1;transform:none}99.83%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v31{0%{opacity:0;transform:scale(.6)}19.33%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}23%{opacity:1;transform:none}99.83%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v32{0%{opacity:0;transform:scale(.6)}29.33%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}33%{opacity:1;transform:none}99.83%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-chip3{0%{opacity:0;transform:translateX(6px)}31%{opacity:0;transform:translateX(6px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}35.17%{opacity:1;transform:none}99.83%{opacity:1;transform:none}100%{opacity:0;transform:translateX(6px)}}
@keyframes r6f-out3{0%{transform:translateX(0)}40%{transform:translateX(0);animation-timing-function:cubic-bezier(.2,.8,.2,1)}53.33%{transform:translateX(var(--r6f-sx))}99.83%{transform:translateX(var(--r6f-sx))}100%{transform:translateX(0)}}
@keyframes r6f-flag3{0%{opacity:.3;transform:translateY(4px)}53.33%{opacity:.3;transform:translateY(4px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}60%{opacity:1;transform:none}93.33%{opacity:1;transform:none}100%{opacity:.3;transform:translateY(4px)}}
@keyframes r6f-cur3{0%{opacity:0;transform:translate(var(--r6f-cx),var(--r6f-cy))}57.5%{opacity:0;transform:translate(var(--r6f-cx),var(--r6f-cy))}60%{opacity:1;transform:translate(var(--r6f-cx),var(--r6f-cy));animation-timing-function:cubic-bezier(.45,0,.25,1)}68.33%{opacity:1;transform:none}69.83%{opacity:1;transform:scale(.62)}71.67%{opacity:1;transform:none}93.33%{opacity:1;transform:none}100%{opacity:0;transform:none}}

@media (min-width:901px) and (min-height:861px){#ep2 .r6f-cmp{font-size:14px;--r6f-rh:40px;--r6f-hh:34px}}
/* computador estreito: a folha do contrato fica só com os valores (os rótulos cabem inteiros na da fatura) */
@media (min-width:901px) and (max-width:1100px){#ep2 .r6f-l2{display:none}#ep2 .r6f-cmp{--r6f-cols:minmax(0,1fr) 78px 42px 0 108px}#ep2 .r6f-hd span:last-child{grid-column:5}}
/* janelas baixas: linhas mais justas; abaixo de 700 px de altura, o recorte de 3 cobranças */
@media (min-width:901px) and (max-height:760px){#ep2 .r6f-cmp{--r6f-rh:30px;--r6f-hh:28px}#ep2 .mkflag{padding:8px 14px}}
@media (min-width:901px) and (max-height:699px){#ep2 .r6f-cmp>:nth-child(5),#ep2 .r6f-cmp>:nth-child(7){display:none}#ep2 .r6f-cmp>:nth-child(3) .r6f-v{animation-name:r6f-v30}#ep2 .r6f-cmp>:nth-child(4) .r6f-v{animation-name:r6f-v31}#ep2 .r6f-cmp>:nth-child(6) .r6f-v{animation-name:r6f-v32}#ep2 .r6f-a{animation-duration:6.0s}#ep2 .r6f-cmp{animation-name:r6f-in3}#ep2 .r6f-bar{animation-name:r6f-bar3}#ep2 .r6f-chip{animation-name:r6f-chip3}#ep2 .r6f-bad{animation-name:r6f-out3}#ep2 .r6f-flag{animation-name:r6f-flag3}#ep2 .r6f-cur{animation-name:r6f-cur3}}
@media (max-width:900px){
  #ep2 .r6f-cmp>:nth-child(5),#ep2 .r6f-cmp>:nth-child(7){display:none}#ep2 .r6f-cmp>:nth-child(3) .r6f-v{animation-name:r6f-v30}#ep2 .r6f-cmp>:nth-child(4) .r6f-v{animation-name:r6f-v31}#ep2 .r6f-cmp>:nth-child(6) .r6f-v{animation-name:r6f-v32}#ep2 .r6f-a{animation-duration:6.0s}#ep2 .r6f-cmp{animation-name:r6f-in3}#ep2 .r6f-bar{animation-name:r6f-bar3}#ep2 .r6f-chip{animation-name:r6f-chip3}#ep2 .r6f-bad{animation-name:r6f-out3}#ep2 .r6f-flag{animation-name:r6f-flag3}#ep2 .r6f-cur{animation-name:r6f-cur3}
  /* celular: o visor muda de altura de aparelho para aparelho (113 a 345 px medidos) — o recorte é escolhido pela altura do próprio painel */
  #ep2{container:r6f/size}
  #ep2 .mk{height:auto;max-height:100%;gap:8px;padding:0 10px 10px;-webkit-mask-image:none!important;mask-image:none!important}
  #ep2 .gbar{margin:0 -10px;padding:7px 10px}
  #ep2 .mkh{flex-wrap:nowrap;align-items:center;gap:8px}
  #ep2 .mkh b,#ep2 .r6f-cb,#ep2 .r6f-d,#ep2 .r6f-l2,#ep2 .mkflag span{display:none}
  #ep2 .mkh small{letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #ep2 .mkbtn{font-size:12px;padding:8px 11px}
  #ep2 .r6f-cur{--r6f-cx:-96px;--r6f-cy:104px}
  #ep2 .r6f-cmp{margin-right:8px;font-size:12px;--r6f-rh:26px;--r6f-hh:calc(var(--r6f-rh) - 4px);--r6f-pad:8px;--r6f-cols:minmax(0,1fr) 60px 28px 0 86px}
  #ep2 .r6f-hd span{letter-spacing:.04em}#ep2 .r6f-hd span:last-child{grid-column:5}
  #ep2 .r6f-bad .r6f-k{border-bottom-left-radius:8px}
  #ep2 .r6f-v svg{width:20px;height:20px}
  #ep2 .r6f-k{gap:5px}#ep2 .r6f-chip{padding:4px 6px}
  #ep2 .mkflag{padding:7px 10px}#ep2 .mkflag b{font-size:13px;line-height:1.3}
  @supports (height:1cqh){#ep2 .r6f-cmp{--r6f-rh:clamp(22px,calc((100cqh - 128px)/4),34px)}}
  /* painel alto: o aviso ganha a frase inteira */
  @container r6f (min-height:300px){
    #ep2 .mk{gap:10px}#ep2 .gbar{padding:9px 10px}
    #ep2 .r6f-cmp{--r6f-rh:clamp(26px,calc((100cqh - 191px)/4),36px)}
    #ep2 .mkflag span{display:block;font-size:12.5px}
  }
  /* painel baixo: sai o aviso (a história termina no botão) */
  @container r6f (max-height:215px){
    #ep2 .mkflag{display:none}
    #ep2 .r6f-cmp{--r6f-rh:clamp(22px,calc((100cqh - 83px)/4),32px)}
    #ep2 .r6f-cur{--r6f-cy:76px}
  }
  /* painel mínimo (a legenda cobre o pé do visor): 2 cobranças — uma que confere, uma que não */
  @container r6f (max-height:175px){
    #ep2 .r6f-cmp>:nth-child(2),#ep2 .r6f-cmp>:nth-child(6){display:none}
    @keyframes r6f-in2{0%{opacity:0;transform:translateY(8px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}7.41%{opacity:1;transform:none}92.59%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes r6f-bar2{0%{opacity:0;transform:translateY(0)}7.41%{opacity:0;transform:translateY(0)}9.63%{opacity:1;transform:translateY(0)}14.81%{opacity:1;transform:translateY(calc(var(--r6f-rh)*0));animation-timing-function:cubic-bezier(.45,0,.25,1)}18.52%{opacity:1;transform:translateY(calc(var(--r6f-rh)*1))}26.85%{opacity:1;transform:translateY(calc(var(--r6f-rh)*1))}29.63%{opacity:0;transform:translateY(calc(var(--r6f-rh)*1))}30%{opacity:0;transform:translateY(0)}100%{opacity:0;transform:translateY(0)}}
@keyframes r6f-v20{0%{opacity:0;transform:scale(.6)}10.37%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}14.44%{opacity:1;transform:none}99.81%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-v21{0%{opacity:0;transform:scale(.6)}21.48%{opacity:0;transform:scale(.6);animation-timing-function:cubic-bezier(.3,1.5,.5,1)}25.56%{opacity:1;transform:none}99.81%{opacity:1;transform:none}100%{opacity:0;transform:scale(.6)}}
@keyframes r6f-chip2{0%{opacity:0;transform:translateX(6px)}23.33%{opacity:0;transform:translateX(6px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}27.96%{opacity:1;transform:none}99.81%{opacity:1;transform:none}100%{opacity:0;transform:translateX(6px)}}
@keyframes r6f-out2{0%{transform:translateX(0)}33.33%{transform:translateX(0);animation-timing-function:cubic-bezier(.2,.8,.2,1)}48.15%{transform:translateX(var(--r6f-sx))}99.81%{transform:translateX(var(--r6f-sx))}100%{transform:translateX(0)}}
@keyframes r6f-flag2{0%{opacity:.3;transform:translateY(4px)}48.15%{opacity:.3;transform:translateY(4px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}55.56%{opacity:1;transform:none}92.59%{opacity:1;transform:none}100%{opacity:.3;transform:translateY(4px)}}
@keyframes r6f-cur2{0%{opacity:0;transform:translate(var(--r6f-cx),var(--r6f-cy))}52.78%{opacity:0;transform:translate(var(--r6f-cx),var(--r6f-cy))}55.56%{opacity:1;transform:translate(var(--r6f-cx),var(--r6f-cy));animation-timing-function:cubic-bezier(.45,0,.25,1)}64.81%{opacity:1;transform:none}66.48%{opacity:1;transform:scale(.62)}68.52%{opacity:1;transform:none}92.59%{opacity:1;transform:none}100%{opacity:0;transform:none}}
#ep2 .r6f-cmp>:nth-child(3) .r6f-v{animation-name:r6f-v20}#ep2 .r6f-cmp>:nth-child(4) .r6f-v{animation-name:r6f-v21}#ep2 .r6f-a{animation-duration:5.4s}#ep2 .r6f-cmp{animation-name:r6f-in2}#ep2 .r6f-bar{animation-name:r6f-bar2}#ep2 .r6f-chip{animation-name:r6f-chip2}#ep2 .r6f-bad{animation-name:r6f-out2}#ep2 .r6f-flag{animation-name:r6f-flag2}#ep2 .r6f-cur{animation-name:r6f-cur2}
    #ep2 .mk{gap:5px}#ep2 .gbar{padding:5px 10px}
    #ep2 .mkbtn{padding:7px 10px}
    #ep2 .r6f-cmp{--r6f-rh:20px;--r6f-hh:0px}
    #ep2 .r6f-bg i{box-shadow:none}
    #ep2 .r6f-v svg{width:18px;height:18px}
    #ep2 .r6f-cmp>.r6f-row:nth-child(3)>*{border-top:0}
    #ep2 .r6f-cur{--r6f-cx:-84px;--r6f-cy:40px}
  }
}
/* sem movimento: a página zera transform/opacity dentro da estação — a régua some e o destaque das linhas vira deslocamento de layout */
@media (prefers-reduced-motion:reduce){#ep2 .r6f-bar{display:none}#ep2 .r6f-bad{left:var(--r6f-sx)}}

/* ===== R6 · frente meat · Meat Recognition (#ep3): visor de câmera em carvão; HUD menta nas medições, laranja na apara, verde no "In spec" ===== */
#ep3 .mk{display:flex;flex-direction:column;gap:12px;padding:0 16px 16px;background:#1B1E25;border:1px solid rgba(255,255,255,.1);color:#E8ECF5;font-family:var(--font-b)}
#ep3 .mk>*{flex:none;min-width:0}
#ep3 .gbar{margin:0 -16px;padding-left:16px;padding-right:16px;background:#111318;border-bottom:1px solid rgba(255,255,255,.1);color:#E8ECF5}
#ep3 .gbar em{font-size:12px;color:#AEB6C8}
#ep3 .mkh{position:relative;z-index:3;align-items:end}
#ep3 .mkh small{font-size:12px;letter-spacing:.08em;color:#AEB6C8!important}
#ep3 .mkh b{display:block;margin-top:3px;font:600 clamp(17px,1.35vw,21px)/1.15 var(--font-b);color:#F1F3F8;letter-spacing:-.005em}
#ep3 .mkbtn{font:600 12.5px/1 var(--font-b);padding:9px 14px;background:#E07A3A;color:#1A1A2E}
#ep3 .r6m-cur{position:absolute;right:10px;bottom:-4px;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.24),0 2px 6px rgba(0,0,0,.5);pointer-events:none;--r6m-cx:-170px;--r6m-cy:120px}
#ep3 .meat{grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:12px;align-items:stretch}
/* visor: grade de terços, cantos em L, REC */
#ep3 .r6m-view{position:relative;display:grid;place-items:center;overflow:hidden;border-radius:10px;background-color:#0E1014;
  background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:33.34% 33.34%;background-position:-1px -1px}
#ep3 .r6m-view::before{content:"";position:absolute;inset:8px;pointer-events:none;--c:rgba(255,255,255,.72);background:
  linear-gradient(var(--c),var(--c)) 0 0/14px 2px,linear-gradient(var(--c),var(--c)) 0 0/2px 14px,
  linear-gradient(var(--c),var(--c)) 100% 0/14px 2px,linear-gradient(var(--c),var(--c)) 100% 0/2px 14px,
  linear-gradient(var(--c),var(--c)) 0 100%/14px 2px,linear-gradient(var(--c),var(--c)) 0 100%/2px 14px,
  linear-gradient(var(--c),var(--c)) 100% 100%/14px 2px,linear-gradient(var(--c),var(--c)) 100% 100%/2px 14px;background-repeat:no-repeat}
#ep3 .r6m-rec,#ep3 .r6m-st,#ep3 .r6m-hud,#ep3 .r6m-tl{position:absolute;z-index:2;font:600 12px/1 var(--font-b);white-space:nowrap}
#ep3 .r6m-rec{left:19px;top:17px;display:flex;align-items:center;gap:6px;letter-spacing:.12em;color:#E8ECF5}
#ep3 .r6m-rec::before{content:"";width:8px;height:8px;border-radius:50%;background:#F05252}
#ep3 .r6m-st{right:19px;bottom:16px;font-weight:500;color:#AEB6C8}
#ep3 .r6m-hud{left:19px;bottom:16px;font-weight:500;color:#9FE8D2}
#ep3 .r6m-cut{position:relative;width:100%;aspect-ratio:420/220}
/* iOS < 15 não tem aspect-ratio: sem isto a peça fica com altura 0 e some. Altura pela largura (220/420 = 52,38 %); lá também não há container queries, então a largura é sempre 100 % do visor */
@supports not (aspect-ratio:1){#ep3 .r6m-cut{height:0;padding-top:52.38%}}
#ep3 .r6m-cut svg{position:absolute;inset:0;width:100%;height:100%;max-height:none;border-radius:0;overflow:visible}
#ep3 .r6m-trim{position:absolute;inset:0}
#ep3 .r6m-tl{left:calc(78.57% + 7px);top:9.5%;color:#F4B489}
/* visor estreito (celular e 901–1150 px): à direita da linha tracejada cabem < 58 px — o rótulo empilha em duas linhas (26 px) e sobe acima da cunha, sem cruzar a linha nem a borda */
@media (max-width:1150px){#ep3 .r6m-tl{left:calc(78.57% + 6px);top:2.5%;width:min-content;white-space:normal;line-height:1.05}}
/* cota: etiqueta, linha-guia e paquímetro sobre a capa de gordura */
#ep3 .r6m-dim{position:absolute;left:52.48%;top:4.0%;height:23.64%;width:0}
#ep3 .r6m-dim b{position:absolute;left:-29px;top:0;width:58px;text-align:center;font:600 12px/18px var(--font-b);color:#0E1014;background:#9FE8D2;border-radius:4px}
#ep3 .r6m-dim::before{content:"";position:absolute;left:-1px;top:18px;bottom:0;width:2px;background:#9FE8D2}
#ep3 .r6m-dim::after,#ep3 .r6m-dim i{content:"";position:absolute;left:-6px;width:12px;height:2px;background:#9FE8D2}
#ep3 .r6m-dim::after{bottom:0}#ep3 .r6m-dim i{top:59.4%}
/* varredura */
#ep3 .r6m-scan{position:absolute;inset:0;z-index:1;opacity:0;pointer-events:none}
#ep3 .r6m-scan::before{content:"";position:absolute;right:100%;top:0;bottom:0;width:58px;background:linear-gradient(90deg,rgba(159,232,210,0),rgba(159,232,210,.24));border-right:2px solid #9FE8D2}
/* leituras */
#ep3 .mside{gap:8px;grid-auto-rows:1fr;align-content:stretch}
#ep3 .mside .k{position:relative;align-content:center;background:#242832;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px 12px}
#ep3 .mside small{font-size:12px;letter-spacing:.08em;color:#AEB6C8!important}
#ep3 .mside b{font:600 20px/1.25 var(--font-b);color:#9FE8D2}
#ep3 .mside span{font-size:12.5px;color:#AEB6C8!important}
/* "After trim": cartão cinza como os outros (legível desde 0 %); o overlay verde opaco cruza por cima quando a apara fica pronta */
#ep3 .mside .k.v{background:#242832;border-color:rgba(255,255,255,.1)}#ep3 .mside .k.v b{color:#AEB6C8}
#ep3 .r6m-ok{position:absolute;inset:-1px;z-index:1;display:inherit;align-content:inherit;align-items:inherit;justify-content:inherit;gap:inherit;padding:inherit;white-space:inherit;
  font-style:normal;background:#1A3231;border:1px solid rgba(16,185,129,.55);border-radius:10px;pointer-events:none}
#ep3 .mside .k.v .r6m-ok b{color:#10B981}#ep3 .mside .r6m-ok span{color:#10B981!important}
#ep3 .r6m-pulse{position:absolute;inset:-1px;border-radius:10px;border:2px solid #9FE8D2;opacity:0;pointer-events:none}
/* chip "In spec" do visor: o fim da história no celular quando as leituras saem; no computador o cartão "After trim" já conta isso */
#ep3 .r6m-chip{display:none;position:absolute;z-index:2;right:14px;bottom:12px;padding:5px 9px;border-radius:999px;background:#1A3231;border:1px solid rgba(16,185,129,.55);color:#10B981;font:600 12px/1 var(--font-b);white-space:nowrap}
/* laço: só transform/opacity; pausado fora da estação aberta; ao abrir a aba recomeça do zero (o painel sai de display:none) */
#ep3 .r6m-a{animation-duration:6s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused}
.stg.v8.on #ep3.on .r6m-a{animation-play-state:running}
#ep3 .r6m-scan{animation-name:r6m-scan}#ep3 .r6m-dim{animation-name:r6m-dim}#ep3 .r6m-pulse{animation-name:r6m-pulse}#ep3 .r6m-trim{animation-name:r6m-trim}#ep3 .r6m-ok,#ep3 .r6m-chip{animation-name:r6m-ok}#ep3 .r6m-cur{animation-name:r6m-cur}
#ep3 .r6m-m0{animation-name:r6m-m0}#ep3 .r6m-m1{animation-name:r6m-m1}#ep3 .r6m-m2{animation-name:r6m-m2}#ep3 .r6m-m3{animation-name:r6m-m3}#ep3 .r6m-m4{animation-name:r6m-m4}#ep3 .r6m-m5{animation-name:r6m-m5}
@keyframes r6m-scan{0%{opacity:0;transform:translateX(0)}1%{opacity:1;transform:translateX(0)}23.33%{opacity:1;transform:translateX(calc(100% + 60px))}25%{opacity:0;transform:translateX(calc(100% + 60px))}100%{opacity:0;transform:translateX(calc(100% + 60px))}}
@keyframes r6m-m0{0%{opacity:0}3.73%{opacity:0}6.39%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-m1{0%{opacity:0}5.1%{opacity:0}7.76%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-m2{0%{opacity:0}6.91%{opacity:0}9.58%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-m3{0%{opacity:0}8.82%{opacity:0}11.49%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-m4{0%{opacity:0}15.91%{opacity:0}18.58%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-m5{0%{opacity:0}18.03%{opacity:0}20.69%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-dim{0%{opacity:0;transform:translateY(-7px)}26.67%{opacity:0;transform:translateY(-7px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}36.67%{opacity:1;transform:none}93.33%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes r6m-pulse{0%{opacity:0}36.67%{opacity:0}39.33%{opacity:1}45%{opacity:0}100%{opacity:0}}
@keyframes r6m-trim{0%{opacity:0;transform:translateX(-12px)}43.33%{opacity:0;transform:translateX(-12px);animation-timing-function:cubic-bezier(.2,.8,.2,1)}53.33%{opacity:1;transform:none}93.33%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes r6m-ok{0%{opacity:0}53.33%{opacity:0}60%{opacity:1}93.33%{opacity:1}100%{opacity:0}}
@keyframes r6m-cur{0%{opacity:0;transform:translate(var(--r6m-cx),var(--r6m-cy))}57.5%{opacity:0;transform:translate(var(--r6m-cx),var(--r6m-cy))}60%{opacity:1;transform:translate(var(--r6m-cx),var(--r6m-cy));animation-timing-function:cubic-bezier(.45,0,.25,1)}66.67%{opacity:1;transform:none}68.17%{opacity:1;transform:scale(.62)}70%{opacity:1;transform:none}93.33%{opacity:1;transform:none}100%{opacity:0;transform:none}}

/* computador: o mockup vai até a legenda (a base força .mk{height:auto!important}); o visor, via .meat, fica com a sobra */
@media (min-width:901px){#ep3 .mk{height:100%!important;box-sizing:border-box}#ep3 .meat{flex:1 1 auto;min-height:0}}
@media (min-width:901px) and (max-width:1150px){#ep3 .r6m-hud{display:none}}
@media (min-width:901px) and (max-width:1100px){#ep3 .mside b{font-size:18px}}
@media (min-width:901px) and (max-height:760px){#ep3 .mside .k{padding:6px 12px}#ep3 .mside b{font-size:18px}}
@media (max-width:900px){
  /* celular: o visor muda de altura de aparelho para aparelho — o recorte é escolhido pela altura do próprio painel */
  #ep3{container:r6m/size}
  #ep3 .mk{position:relative;height:auto;max-height:100%;gap:8px;padding:0 10px 10px;-webkit-mask-image:none!important;mask-image:none!important}
  #ep3 .gbar{margin:0 -10px;padding:7px 10px}
  #ep3 .mkh{flex-wrap:nowrap;align-items:center;gap:8px}
  #ep3 .mkh b,#ep3 .r6m-hud,#ep3 .r6m-st,#ep3 .mside .k:nth-child(2),#ep3 .mside span{display:none}
  #ep3 .mkh small{letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #ep3 .mkbtn{font-size:12px;padding:8px 11px}
  /* o cursor pousa dentro do "Confirm trim" (centro vertical, sobre o fim da palavra), não na borda de baixo */
  #ep3 .r6m-cur{right:20px;bottom:auto;top:calc(50% - 5px);--r6m-cx:-110px;--r6m-cy:80px}
  #ep3 .meat{grid-template-columns:minmax(0,1fr);gap:8px}
  #ep3 .r6m-view::before{inset:6px}#ep3 .r6m-rec{left:14px;top:13px}
  /* 8 px de respiro no topo do visor: a etiqueta "24 mm" não encosta na borda (e o L de cima fica livre) */
  #ep3 .r6m-view{padding-top:8px}
  #ep3 .r6m-cut{width:min(100%,calc((100cqh - 140px)*1.909))}
  #ep3 .r6m-dim{top:1.0%;height:26.64%}#ep3 .r6m-dim b{line-height:14px}#ep3 .r6m-dim::before{top:14px}#ep3 .r6m-dim i{top:64.0%}
  #ep3 .mside{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-auto-rows:auto}
  #ep3 .mside .k{display:flex;align-items:baseline;justify-content:space-between;gap:6px;padding:5px 9px;white-space:nowrap}
  #ep3 .mside small{letter-spacing:0;text-transform:none;font-weight:500}
  #ep3 .mside b{font-size:14px;line-height:1.3}
  #ep3 .r6m-pulse{border-radius:10px}
  /* painel baixo: saem as leituras (a história termina no botão) */
  @container r6m (max-height:235px){
    #ep3 .mside{display:none}
    /* sem as leituras, o "In spec" vira chip no canto do visor; a peça recua para a esquerda e deixa a faixa da direita para ele */
    #ep3 .r6m-chip{display:block}
    #ep3 .r6m-view{padding-right:64px}
    #ep3 .r6m-cut{width:min(100%,calc((100cqh - 101px)*1.909))}
  }
  /* painel mínimo (a legenda cobre o pé do visor): só a barra e o visor; o botão pousa no canto do visor */
  @container r6m (max-height:175px){
    #ep3 .mk{gap:0;padding:0}
    #ep3 .gbar{margin:0;padding:6px 10px}
    #ep3 .mkh{position:absolute;right:8px;top:37px}
    /* o botão ocupa o canto superior direito: some o L de lá (3ª e 4ª camadas) */
    #ep3 .r6m-view::before{background-size:14px 2px,2px 14px,0 0,0 0,14px 2px,2px 14px,14px 2px,2px 14px}
    #ep3 .mkh>div,#ep3 .r6m-tl,#ep3 .r6m-dim{display:none}
    #ep3 .mkbtn{padding:7px 10px}
    /* a legenda cobre os últimos 26 px do painel: o visor termina acima dela, com os quatro cantos à vista */
    #ep3 .r6m-view{border-radius:0;place-items:start;padding-left:40px;height:calc(100cqh - 31px - 26px);padding-top:0}
    #ep3 .r6m-rec{left:12px;top:11px}
    #ep3 .r6m-cut{width:min(100%,calc((100cqh - 61px)*1.909))}
    #ep3 .r6m-cur{--r6m-cx:-90px;--r6m-cy:34px}
    /* o botão ocupa o alto da faixa direita: o chip desce para baixo dele, mais baixo, e fica dentro do L de baixo */
    #ep3 .mkh{top:35px}
    #ep3 .r6m-chip{right:22px;bottom:4px;padding:3px 8px}
  }
}
/* sem movimento: a página força opacity:1 e transform:none dentro da estação — saem a varredura, o pulso e o cursor; o resto já está no estado final */
@media (prefers-reduced-motion:reduce){#ep3 .r6m-scan,#ep3 .r6m-pulse,#ep3 .r6m-cur{display:none}}

/* ===== revisão 6 · frente prints (r6p-): prints reais, legenda escura e alvos de toque da estação 2 ===== */
/* 1 · moldura de navegador escura; nada é desenhado sobre o print além de um anel num elemento que existe nele */
.mg .bw2{background:#12121F}
.mg .bw2 .bwbar{background:#23233A;border-bottom:1px solid rgba(255,255,255,.08)}
.mg .bw2 .bwbar i{background:rgba(255,255,255,.3)}
.mg .bw2 .bwbar span{display:inline-flex;align-items:center;gap:7px;min-width:0;background:#12121F;color:#C9C7DA;font-size:12px;line-height:1.35}
.mg .bw2 .bwbar span::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:#10B981}
/* o realce CONTORNA um elemento real inteiro (centro rx/ry, tamanho rw/rh em % da imagem): nunca cobre um glifo e,
   por ser medido na imagem, acompanha a escala em qualquer tela. Medidas tiradas dos próprios prints (px da imagem). */
.mg .bw2[data-b="0"]{--r6p-ar:1.8947;--r6p-d:10s;--r6p-x:-8.3333%;--r6p-ww:.38889;--r6p-rx:19.03%;--r6p-ry:29.8%;--r6p-rw:15.28%;--r6p-rh:5.92%;--r6p-rr:999px;--r6p-tail:11%} /* selo da oferta "Análise gratuita · 2 min" (170-378 × 210-243 de 1440×760) */
.mg .bw2[data-b="1"]{--r6p-ar:1.6;--r6p-d:14s;--r6p-x:-10%;--r6p-rx:24.38%;--r6p-ry:65%;--r6p-rw:18.61%;--r6p-rh:7.11%;--r6p-rr:999px}     /* CTA principal "Book a free strategy call →" (224-478 × 560-610 de 1440×900) */
.mg .bw2[data-b="2"]{--r6p-ar:1.6;--r6p-d:8s;--r6p-x:-5%;--r6p-rx:17.67%;--r6p-ry:61.22%;--r6p-rw:21.88%;--r6p-rh:11.33%;--r6p-rr:12px}      /* CTA "Experimente o Chico AI! · 5 dias grátis" (104-405 × 507-595 de 1440×900) */
.r6p-vp{position:relative;min-width:0;min-height:0;overflow:hidden;container-type:size;background:#12121F}
/* revisão 11 · capturas de sites em português, mostradas traduzidas (decisão do CEO 2026-10-09) */
.trn-c{display:block;font:500 12px/1.4 var(--font-b);color:inherit;opacity:.68;margin-top:8px}
.qi{position:relative}
/* sem unidades de contêiner (navegador antigo): o print cobre a moldura inteira, parado, sem faixa vazia; o realce some
   porque o recorte deixa de ser proporcional à imagem */
.r6p-roll{position:absolute;inset:0}
.mg .bw2 .r6p-roll img{display:block;width:100%;height:100%;object-fit:cover;object-position:10% 0;min-height:0}
.r6p-ring{display:none}
/* a camada cobre a moldura e sobra 25% na altura (--r6p-k): é essa sobra que rola. Onde sobra largura, o corte sai da margem vazia do print */
@supports (width:1cqw){
  .r6p-roll{inset:auto;left:0;top:0;aspect-ratio:var(--r6p-ar);width:max(100cqw,calc(var(--r6p-k,1.25) * 100cqh * var(--r6p-ar)));translate:max(var(--r6p-x),calc(100cqw - 100%)) 0}
  .mg .bw2 .r6p-roll img{object-fit:fill}
  .r6p-ring{display:block}
  /* Contrato Claro: a janela é a coluna da esquerda INTEIRA (px 120-680 do print: selo, título, texto, garantias; no
     topo, logo + "Início · Como Funciona"). As duas bordas caem em espaço vazio da página, então nenhuma palavra é
     cortada em tela nenhuma; o formulário (x >= 748) fica fora em vez de cortado. Vale no computador e no celular. */
  .mg .bw2[data-b="0"] .r6p-roll{width:max(calc(100cqw / var(--r6p-ww)),calc(var(--r6p-k,1.25) * 100cqh * var(--r6p-ar)))}
}
.r6p-ring{position:absolute;left:var(--r6p-rx);top:var(--r6p-ry);width:var(--r6p-rw);height:var(--r6p-rh);translate:-50% -50%;border-radius:var(--r6p-rr);border:2px solid #E07A3A;box-shadow:0 0 0 2px rgba(255,255,255,.8);pointer-events:none}
.r6p-ring::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:2px solid #E07A3A;opacity:0}
/* fim do curso = onde o conteúdo real do print termina (--r6p-tail = faixa final sem tinta, em % da altura do rolo; a custom
   property resolve no próprio elemento e a animação continua só em transform). Lumen e Chico têm conteúdo até a borda: 0 */
@keyframes r6p-roll{from{transform:translateY(0)}to{transform:translateY(calc(100cqh - 100% + var(--r6p-tail,0%)))}}
@keyframes r6p-ring{0%,10%{opacity:0;transform:scale(.6)}20%,92%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
@keyframes r6p-ping{0%,20%{opacity:0;transform:scale(1)}22%{opacity:.75;transform:scale(1)}46%,100%{opacity:0;transform:scale(1.1,1.4)}}
@keyframes r6p-live{0%,100%{opacity:1}50%{opacity:.3}}
/* parado por padrão; só anda com a estação aberta e na aba aberta (4 nós por print) */
.r6p-roll,.r6p-ring,.r6p-ring::after,.mg .bw2 .bwbar span::before{animation-play-state:paused}
@supports (width:1cqw){.stg.v8.mg.on .bw2.on .r6p-roll{animation:r6p-roll var(--r6p-d) ease-in-out infinite alternate running}}
.stg.v8.mg.on .bw2.on .r6p-ring{animation:r6p-ring 6s cubic-bezier(.2,.8,.2,1) infinite running}
.stg.v8.mg.on .bw2.on .r6p-ring::after{animation:r6p-ping 6s ease-out infinite running}
.stg.v8.mg.on .bw2.on .bwbar span::before{animation:r6p-live 2.4s ease-in-out infinite running}

/* 2 · legenda escura (some o cartão quase branco sob o visor); contraste AA sobre #121220 */
.mgcap{background:rgba(18,18,32,.92);border:1px solid rgba(255,255,255,.12)}
.mgcap .pr{color:#fff!important}
.mgcap p,.mgcap li{color:#D6D4E4!important}
.mgcap .edesc li::before{background:#10B981}
.mgcap .edot,.mgcap .visit{color:#F4B489!important;border-bottom-color:rgba(244,180,137,.5)!important}
/* computador: o link é item de grade (vira bloco); sem justify-self o sublinhado laranja cruzava a legenda inteira */
.mgcap .visit,.mgcap .edot{justify-self:start;width:max-content;max-width:100%}
.mgcap .edot:hover,.mgcap .visit:hover,.mgcap .edot:focus-visible,.mgcap .visit:focus-visible{color:#F7C49E!important;border-bottom-color:#F7C49E!important}
/* rótulo dos grupos no computador: 12 px */
.mggl{font-size:12px}

/* 3 · celular: alvos de toque >= 44 px e textos >= 12 px; quem cede a altura é o visor */
@media (max-width:900px){
  .mgseg button{min-height:44px}
  .mg .etabs button,.mg .lpick button{min-height:44px}
  .mg .etabs button{align-items:center}
  .mg .lpick span{font-size:12px}
  .mg .entr,.mg .lbvis{min-height:0}
  /* o link da legenda ganha 44 px de área de toque sem custar 44 px de altura (a área invade a folga do cartão) */
  .mgcap .visit,.mg:not(.show-p) .mgcap .edot{display:inline-flex;align-items:center;justify-self:start;min-height:44px;margin:-11px 0;padding:0;border-bottom:0;text-decoration:underline;text-decoration-color:rgba(244,180,137,.55);text-underline-offset:4px}
  .mgcap .pr{position:relative;z-index:1;pointer-events:none}
  /* o print fica ampliado (texto do site legível) e o anel acompanha a escala */
  @supports (width:1cqw){.r6p-roll{width:max(150cqw,calc(var(--r6p-k,1.25) * 100cqh * var(--r6p-ar)))}}
  .mg .bw2 .bwbar{padding:6px 10px}
}
@media (max-width:900px) and (max-height:700px){
  .mgseg{padding:0}.mgseg button{min-height:44px}
  .mgnav{gap:6px}
  .mg .etabs button{padding:4px 10px}.mg .etabs button b{font-size:14px!important;line-height:1.15}
  .mg .lpick button{padding:6px 8px}.mg .lpick b{font-size:15px!important}
}
/* celular: o anel só aparece se o texto do elemento realçado ficar >= 10 px efetivos (fonte no print x escala do rolo).
   Fonte medida no print por canvas: selo CC ~12 px, CTA Lumen ~16 px, CTA Chico ~18 px => rolo mínimo 1200/900/800 px.
   Largura do rolo no celular: CC max(100cqw/.38889, 150cqw, 2,368 x 100cqh) · Lumen/Chico max(150cqw, 2 x 100cqh).
   A consulta é ao próprio visor (.r6p-vp, contêiner de tamanho), então vale em qualquer tela sem JS. */
@media (max-width:900px){
  @container (max-width:466px) and (max-height:506px){.mg .bw2[data-b="0"] .r6p-ring{display:none}}
  @container (max-width:599px) and (max-height:449px){.mg .bw2[data-b="1"] .r6p-ring{display:none}}
  @container (max-width:533px) and (max-height:399px){.mg .bw2[data-b="2"] .r6p-ring{display:none}}
}
/* movimento reduzido: pseudo-elementos também param (a regra global da página só alcança os elementos);
   o estado base já é o final legível: print no topo, realce visível, ponto verde aceso, eco apagado */
@media (prefers-reduced-motion:reduce){
  .r6p-roll,.r6p-ring,.r6p-ring::after,.mg .bw2 .bwbar span::before{animation:none!important}
  .r6p-ring::after{opacity:0}
}
@media (max-width:400px){.mgcap .edot,.mgcap .visit{font-size:13px;letter-spacing:-.005em}.mgcap{padding-left:12px;padding-right:12px}}

/* ===== revisão 6 · celulares baixos: o visor do mockup recupera altura ===== */
@media (max-width:900px) and (max-height:700px){
  .stg.v8.mg:not(.show-p) .etabs{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;gap:6px;scrollbar-width:none;overscroll-behavior-x:contain}
  .stg.v8.mg .etabs::-webkit-scrollbar{display:none}
  .stg.v8.mg .etabs.r6-mais{-webkit-mask-image:linear-gradient(90deg,#000 78%,transparent);mask-image:linear-gradient(90deg,#000 78%,transparent)}
  .stg.v8.mg .etabs button{flex:0 0 auto;min-height:44px;white-space:nowrap;scroll-snap-align:start}
  .stg.v8.mg .etabs button span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap} /* some da vista, fica no nome acessível */
  .stg.v8.mg .etabs button{position:relative}
  .stg.v8.mg .mgcap p,.stg.v8.mg .mgcap ul{display:none!important}
  .stg.v8.mg .mgcap{padding:4px 14px!important}
  .stg.v8.mg .mgcap a{min-height:44px;align-items:center}
  .stg.v8.mg:not(.show-p) .mgcap a.edot,.stg.v8.mg.show-p .mgcap .ldesc.on a{display:inline-flex}
}
@media (max-width:900px) and (max-height:600px){
  .stg.v8.mg .lpick button span{display:none}
  .stg.v8.mg .mgcap .ldesc.on{gap:0}.stg.v8.mg .mgcap .ldesc.on a{min-height:36px}.stg.v8.mg .mgcap .trn-c{margin-top:0;line-height:1.2}
  .twin .twvis.r6a{padding-top:12px!important;padding-bottom:12px!important}
}
@media (max-width:350px){.stage .railn{display:none}}
/* revisão 6 · movimento reduzido: pseudo-elementos também param; a estação 1 fica no fluxo da página (antes saía da tela no computador); só a coluna da decisão humana acesa */
@media (prefers-reduced-motion:reduce){
  *::before,*::after{animation:none!important}
  .stg.v8,.stg.v8.on{transform:none!important;left:auto!important;top:auto!important;bottom:auto!important;max-height:none!important}
  .r6a-col.r6a-c1,.r6a-col.r6a-c2,.r6a-col.r6a-c3{display:none}
  .r6g-cur,.r6s-cur,.r6f-cur,.r6m-cur{display:none!important}
}

/* ===== revisão 7 · primeira tela do celular: a fábrica aparece embaixo do texto ===== */
@media (max-width:900px){
  .hero{padding-block:clamp(24px,6svh,52px) clamp(18px,3svh,28px)}
  .hero .wrap{gap:14px}
  .hero .h1{font-size:clamp(31px,8.4vw,38px)!important;line-height:1.08}
  .hero .lede{font-size:16px;line-height:1.5;max-width:34ch}
  .hero .scrollhint{margin-top:2px}
}
@media (max-width:900px) and (max-height:700px){
  .hero{padding-block:14px 14px}
  .hero .wrap{gap:11px}
  .hero .h1{font-size:clamp(29px,7.8vw,34px)!important}
  .hero .lede{font-size:15px;line-height:1.45}
  .hero .scrollhint{display:none}
}
@media (max-width:900px) and (max-height:600px){.mgnav .mgh2b{display:none}} /* celular minúsculo: o seletor abaixo já diz For your business */
@media (max-width:900px) and (max-height:700px){#ep0 .r6g-cur{display:none}} /* revisão 7: sem espaço para o trajeto do cursor; o botão segue marcando a decisão */

/* ===== revisão 7 · Direção C — A pessoa no comando (estação 1) ===== */
.stg.v8.twin.first{--r7c-bg:#14171D;--r7c-s2:#20242C;--r7c-t1:#F7F8FA;--r7c-t2:#B8C0CC;--r7c-hr:rgba(255,255,255,.1);
  --r7c-ln:rgba(247,248,250,.62);--r7c-or:#E07A3A;--r7c-or2:#F4B489;--r7c-lw:2px;
  display:block;background:var(--r7c-bg);border:1px solid rgba(255,255,255,.1);border-radius:20px;
  box-shadow:0 28px 64px -36px rgba(0,0,0,.7);-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.stg.v8.twin.first::before{display:none!important}
.r7c{position:relative;font-family:var(--font-b);color:var(--r7c-t1)}
.r7c-kick{display:block;font:600 12px/16px var(--font-b);letter-spacing:.14em;text-transform:uppercase;color:var(--r7c-t2);margin:0 0 14px}
.stg.v8.twin .r7c-h{font:400 56px/59px var(--font-h);letter-spacing:-.015em;color:var(--r7c-t1);margin:0;text-wrap:initial}
.r7c-h>span{display:block}
.r7c-br{display:none}

/* --- o circuito: geometria em variáveis (pessoa no topo, três agentes embaixo) --- */
.r7c-fig{margin:32px 0 0}
.r7c-ib{display:none}
.r7c-hd{position:relative} /* o selo mora no cabeçalho: entra junto com ele, sem saltar quando a figura termina a entrada */
.r7c-ill{position:absolute;right:0;top:-5px;z-index:2;display:inline-flex;align-items:center;gap:7px;font:500 12px/16px var(--font-b);color:var(--r7c-t2);
  padding:4px 10px;border:1px solid rgba(255,255,255,.14);border-radius:999px;white-space:nowrap}
.r7c-dg{--ph:80px;--hm:40px;--ay:140px;position:relative;padding-top:var(--ay)}
.r7c-hu{position:absolute;left:39%;width:22%;top:0;height:var(--ph);z-index:1;display:flex;align-items:center;gap:14px;padding:0 20px;border-radius:14px;
  border:1.5px solid var(--r7c-or);background:linear-gradient(rgba(224,122,58,.12),rgba(224,122,58,.12)),var(--r7c-bg)}
.r7c-pi{flex:none;width:34px;height:34px;fill:none;stroke:var(--r7c-or2);stroke-width:1.5;stroke-linecap:round}
.r7c-pi>circle:first-child{stroke:rgba(244,180,137,.45)}
.r7c-hut{display:grid;gap:2px;min-width:0}
.r7c-hul{font:600 12px/16px var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:var(--r7c-or2)}
.r7c-hut b{font:600 18px/24px var(--font-b);color:var(--r7c-t1);white-space:nowrap;letter-spacing:-.005em}

/* ligações: cotovelo de ida (pessoa → Sales) e de volta (Reviewer → pessoa), 2 px e firmes */
.r7c-go,.r7c-bk{position:absolute;top:var(--hm);height:calc(var(--ay) - var(--hm));width:26%}
.r7c-go{left:11%;border-top:var(--r7c-lw) solid var(--r7c-ln);border-left:var(--r7c-lw) solid var(--r7c-ln);border-top-left-radius:16px}
.r7c-bk{left:63%;border-top:var(--r7c-lw) solid var(--r7c-or);border-right:var(--r7c-lw) solid var(--r7c-or);border-top-right-radius:16px}
.r7c-st{display:none}
/* rótulos colados ao nó humano, logo abaixo da ligação: o que entra e o que volta */
.r7c-lb{position:absolute;top:12px;display:grid;gap:2px;white-space:nowrap}
.r7c-go .r7c-lb{right:18px;text-align:right}
.r7c-bk .r7c-lb{left:18px;text-align:left}
.r7c-lk{font:500 14px/20px var(--font-b);color:var(--r7c-t2)}
.r7c-lv{font:500 14px/20px var(--font-b);color:var(--r7c-t1)}
.r7c-lbo .r7c-lk{color:var(--r7c-or2);font-weight:600}
.r7c-ah{position:absolute;width:12px;height:12px;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.r7c-go .r7c-dn{left:-7px;bottom:-3px;stroke:var(--r7c-t1)}
.r7c-bk .r7c-lf{left:-3px;top:-7px;stroke:var(--r7c-or)}
/* marcador que percorre a ligação: dois embrulhos do tamanho do cotovelo (translate em % = fração do trajeto) */
.r7c-mx,.r7c-my,.r7c-mz{position:absolute;inset:0;pointer-events:none}
/* o marcador passa POR CIMA do nó humano: nasce na borda dele em vez de surgir meio escondido */
.r7c-mx{z-index:2}
.r7c-mk{position:absolute;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.14);opacity:0}
.r7c-go .r7c-mk{right:-5px;top:-6px}
.r7c-bk .r7c-mk{right:-6px;bottom:-5px;background:#F4B489;box-shadow:0 0 0 4px rgba(224,122,58,.2)}

/* os três agentes: papel · verbo · o que produziu */
.r7c-ags{position:relative;display:grid;grid-template-columns:22fr 17fr 22fr 17fr 22fr;align-items:stretch}
.r7c-ag{position:relative;display:flex;flex-direction:column;padding:16px 18px 15px;border-radius:12px;background:var(--r7c-s2);border:1px solid rgba(255,255,255,.08);min-width:0}
.r7c-ag>*{position:relative;z-index:1}
.r7c-hl{position:absolute!important;inset:-1px;z-index:0!important;border-radius:12px;border:1px solid rgba(247,248,250,.72);
  background:rgba(247,248,250,.05);box-shadow:0 0 0 4px rgba(247,248,250,.07);opacity:0;pointer-events:none}
.r7c-ix{position:absolute!important;left:18px;top:16px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);
  font:600 12px/1 var(--font-b);color:var(--r7c-t2);font-variant-numeric:tabular-nums;background:var(--r7c-bg)}
.r7c-who{padding-left:32px;min-height:22px;display:flex;align-items:center;font:500 16px/21px var(--font-b);color:var(--r7c-t2);white-space:nowrap}
.r7c-vb{margin-top:8px;font:600 20px/26px var(--font-b);letter-spacing:-.01em;color:var(--r7c-t1)}
.r7c-rec{margin-top:auto;padding-top:15px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  font:400 13px/18px var(--font-b);color:var(--r7c-t2);white-space:nowrap}
.r7c-rec::before{content:"";position:absolute;left:0;right:0;top:6px;height:1px;background:var(--r7c-hr)}
.r7c-rec{position:relative}
.r7c-rv{font-weight:600;color:var(--r7c-t1);font-variant-numeric:tabular-nums}
.r7c-cn{position:relative;align-self:center;height:12px}
.r7c-cn::before{content:"";position:absolute;left:12px;right:13px;top:5px;height:var(--r7c-lw);background:var(--r7c-ln)}
.r7c-cn .r7c-rt{right:7px;top:0;stroke:var(--r7c-t1)}

/* rodapé: parágrafo + CTA neutro */
.r7c-ft{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:40px;margin-top:32px;padding-top:24px;border-top:1px solid var(--r7c-hr)}
.stg.v8.twin .r7c-p{grid-column:1;max-width:700px;font:400 16px/24px var(--font-b);color:var(--r7c-t2);margin:0}
.stg.v8.twin .r7c-short{display:none;margin:0}
.stg.v8.twin .r7c-cta{grid-column:2;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:999px;
  background:var(--r7c-t1);color:#14171D;font:600 15px/1 var(--font-b);text-decoration:none;white-space:nowrap;border:0}
.stg.v8.twin .r7c-cta:hover{background:#fff}
.stg.v8.twin .r7c-cta:focus-visible{outline:2px solid var(--r7c-t1);outline-offset:3px}
.r7c-ar{font-size:17px;line-height:1}

/* --- movimento: uma vez ao abrir; o estilo-base é o estado final --- */
@media (prefers-reduced-motion:no-preference){
  .stg.v8 .r7c-hd,.stg.v8 .r7c-fig,.stg.v8 .r7c-ft{opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
  .stg.v8.on .r7c-hd{opacity:1;transform:none;transition-delay:.05s}
  .stg.v8.on .r7c-fig{opacity:1;transform:none;transition-delay:.12s}
  .stg.v8.on .r7c-ft{opacity:1;transform:none;transition-delay:.2s}
  /* 500–1100 ms: o marcador desce da pessoa para Sales */
  .stg.v8.twin.on .r7c-go .r7c-mk{animation:r7c-mk1 .75s linear .45s both}
  .stg.v8.twin.on .r7c-go .r7c-mx{animation:r7c-mxl .3s cubic-bezier(.45,0,.55,1) .5s both}
  .stg.v8.twin.on .r7c-go .r7c-my{animation:r7c-myd .3s cubic-bezier(.45,0,.55,1) .8s both}
  /* 1100–3200 ms: Sales, Operations e Reviewer recebem destaque neutro, um de cada vez */
  .stg.v8.twin.on .r7c-hl{animation:r7c-hl .7s ease both}
  .stg.v8.twin.on .r7c-a1 .r7c-hl{animation-delay:1.1s}
  .stg.v8.twin.on .r7c-a2 .r7c-hl{animation-delay:1.8s}
  .stg.v8.twin.on .r7c-a3 .r7c-hl{animation-delay:2.5s}
  /* 3200–4000 ms: o marcador volta à pessoa; aparece "For your decision" */
  .stg.v8.twin.on .r7c-bk .r7c-mk{animation:r7c-mk1 .8s linear 3.15s both}
  .stg.v8.twin.on .r7c-bk .r7c-my{animation:r7c-myu .32s cubic-bezier(.45,0,.55,1) 3.2s both}
  .stg.v8.twin.on .r7c-bk .r7c-mx{animation:r7c-mxl .32s cubic-bezier(.45,0,.55,1) 3.52s both}
  .stg.v8.twin.on .r7c-lbo{animation:r7c-in .45s cubic-bezier(.2,.8,.2,1) 3.55s both}
}
@keyframes r7c-mk1{0%{opacity:0}8%,86%{opacity:1}100%{opacity:0}}
@keyframes r7c-mxl{from{transform:none}to{transform:translateX(-100%)}}
@keyframes r7c-myd{from{transform:none}to{transform:translateY(100%)}}
@keyframes r7c-myu{from{transform:none}to{transform:translateY(-100%)}}
@keyframes r7c-hl{0%{opacity:0}25%,72%{opacity:1}100%{opacity:0}}
@keyframes r7c-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* movimento reduzido: a página força opacity:1 e transform:none — o que é transitório some */
@media (prefers-reduced-motion:reduce){
  .r7c-mx,.r7c-hl{display:none!important}
}

/* --- computador --- */
@media (min-width:901px){
  .stg.v8.twin.first{width:min(1200px,calc(100vw - 48px));height:auto;max-height:none;padding:44px 48px 40px;overflow:visible}
}
@media (min-width:901px) and (max-width:1200px){
  .stg.v8.twin.first{padding:36px 36px 32px}
  .stg.v8.twin .r7c-h{font-size:50px;line-height:53px}
  .r7c-ag{padding:12px 14px 12px}
  .r7c-ix{left:14px;top:12px}
  .r7c-who{font-size:15px;line-height:20px}
  .r7c-hu{gap:8px;padding:0 10px}.r7c-pi{width:30px;height:30px}
  .r7c-hut b{font-size:16px;line-height:22px}
  .r7c-lk,.r7c-lv{font-size:13px;line-height:18px}
  .r7c-go .r7c-lb{right:14px}.r7c-bk .r7c-lb{left:14px}
  .r7c-rec{font-size:12px;line-height:16px;gap:6px}
}
/* computador baixo: o painel inteiro cabe no palco */
@media (min-width:901px) and (max-height:820px){
  .stg.v8.twin.first{padding-top:30px;padding-bottom:28px}
  .r7c-kick{margin-bottom:10px}
  .stg.v8.twin .r7c-h{font-size:46px;line-height:49px}
  .r7c-fig{margin-top:22px}
  .r7c-dg{--ph:68px;--hm:34px;--ay:124px}
  .r7c-lb{top:9px}
  .r7c-vb{margin-top:6px}
  .r7c-ft{margin-top:24px;padding-top:18px}
}
@media (min-width:901px) and (max-height:820px) and (max-width:1200px){
  .stg.v8.twin .r7c-h{font-size:44px;line-height:47px}
}
@media (min-width:901px) and (max-height:740px){
  .stg.v8.twin.first{padding-top:26px;padding-bottom:24px}
  .stg.v8.twin .r7c-h{font-size:40px;line-height:44px}
  .r7c-fig{margin-top:18px}
  .r7c-dg{--ph:64px;--hm:32px;--ay:116px}
  .r7c-lb{top:8px;gap:0}
  .r7c-ag{padding-top:12px;padding-bottom:12px}
  .r7c-ft{margin-top:20px;padding-top:16px}
}
@media (min-width:901px) and (max-height:680px){
  .stg.v8.twin .r7c-p{font-size:15px;line-height:22px}
}

/* --- celular: o circuito fica vertical; nada rola por dentro --- */
@media (max-width:900px){
  .stg.v8.twin.first,.stg.v8.twin.first.on{width:calc(100% - 24px);top:46px;bottom:auto;max-height:calc(100% - 46px - 62px - env(safe-area-inset-bottom,0px));
    padding:20px;border-radius:16px;overflow:hidden}
  .r7c-kx,.stg.v8.twin .r7c-p,.r7c-cn .r7c-ah,.r7c-lv{display:none}
  .r7c-kick{margin:0 0 8px;letter-spacing:.12em}
  .stg.v8.twin .r7c-h{font-size:34px!important;line-height:36px}
  .r7c-br{display:inline}
  .r7c-fig{position:relative;margin-top:16px;max-width:none}
  /* o selo vira nota de figura: caixa normal, sem espaçamento, alinhado à direita na altura da última linha do título
     (não disputa com o kicker, que é o único texto em caixa alta e espaçado) */
  .r7c-ill{position:absolute;right:0;top:auto;bottom:-3px;display:block;padding:0;border:0;border-radius:0;
    font:400 12px/14px var(--font-b);letter-spacing:0;text-transform:none;text-align:right;color:var(--r7c-t2);white-space:nowrap}
  .r7c-ib{display:inline}
  /* vertical: pessoa (ph) · vão das setas (gg) · três linhas (rh) separadas por rg; a volta sobe pela direita e entra por baixo do nó */
  .r7c-dg{--ph:64px;--gg:44px;--rh:56px;--rg:10px;--sx:23px;--rw:36px;--ax:44px;padding-top:0;display:block;
    height:calc(var(--ph) + var(--gg) + var(--rh) * 3 + var(--rg) * 2)}
  .r7c-hu{position:relative;left:auto;width:calc(100% - var(--rw));height:var(--ph);padding:0 14px;gap:12px;border-radius:12px}
  .r7c-pi{width:28px;height:28px}
  .r7c-hut{display:grid;gap:1px}
  .r7c-hul{font-size:12px;line-height:16px;letter-spacing:.1em}
  .r7c-hut b{font-size:16px;line-height:21px}
  /* ida: desce do nó para Sales, com "Your goal" ao lado da seta */
  .r7c-go{left:calc(var(--sx) - 1px);width:0;top:var(--ph);height:var(--gg);border-top:0;border-radius:0}
  .r7c-go .r7c-dn{bottom:-4px}
  .r7c-go .r7c-mk{top:-5px}
  .r7c-lb{top:0;height:var(--gg);display:flex;align-items:center}
  .r7c-lk{font-size:12px;line-height:16px}
  .r7c-go .r7c-lb{left:14px;right:auto;text-align:left}
  /* volta: sobe pela calha da direita até o meio do vão e entra por baixo do nó; a ponta para 5 px antes da borda do nó */
  .r7c-bk{left:calc(100% - var(--rw));right:auto;width:calc(var(--rw) - 14px);top:calc(var(--ph) + var(--gg) / 2);
    height:calc(var(--gg) / 2 + var(--rh) * 2.5 + var(--rg) * 2);border-bottom:var(--r7c-lw) solid var(--r7c-or);border-radius:0 12px 12px 0}
  .r7c-bk::before{content:"";position:absolute;right:100%;top:calc(var(--r7c-lw) * -1);width:var(--ax);height:var(--r7c-lw);background:var(--r7c-or);border-top-left-radius:2px}
  .r7c-st{display:block;position:absolute;right:calc(100% + var(--ax) - var(--r7c-lw));bottom:100%;width:var(--r7c-lw);height:calc(var(--gg) / 2 - 6px);background:var(--r7c-or)}
  .r7c-st .r7c-up{left:-5px;top:-3px;stroke:var(--r7c-or)}
  .r7c-bk .r7c-lf{display:none}
  .r7c-bk .r7c-lb{left:auto;right:calc(100% + var(--ax) + 10px);top:calc(var(--gg) / -2 - var(--r7c-lw));text-align:right}
  /* marcador da volta: sobe a calha (my), anda para a esquerda até a seta (mx, alongado pelo trecho ax) e sobe o último trecho (mz) */
  .r7c-bk .r7c-mx{left:calc(var(--ax) * -1)}
  .r7c-bk .r7c-mz{top:auto;height:calc(var(--gg) / 2 - 6px)}
  .r7c-bk .r7c-mk{bottom:-6px;right:-6px}
  .r7c-ags{position:absolute;left:0;right:var(--rw);top:calc(var(--ph) + var(--gg));display:grid;grid-template-columns:1fr;grid-template-rows:var(--rh) var(--rg) var(--rh) var(--rg) var(--rh)}
  /* linha do agente espelha o cartão do computador: papel (secundário) sobre o VERBO (principal, branco); entrega à direita */
  .r7c-ag{display:grid;grid-template-columns:22px minmax(0,1fr) auto;grid-template-rows:auto auto;align-content:center;column-gap:10px;row-gap:1px;padding:0 14px 0 12px;border-radius:10px}
  .r7c-ix{position:relative!important;left:auto;top:auto;grid-column:1;grid-row:1/3;align-self:center}
  .r7c-who{grid-column:2;grid-row:1;padding:0;min-height:0;font-size:13px;line-height:16px;color:var(--r7c-t2);font-weight:500}
  .r7c-vb{grid-column:2;grid-row:2;margin:0;font:600 17px/22px var(--font-b);letter-spacing:-.01em;color:var(--r7c-t1)}
  .r7c-rec{grid-column:3;grid-row:1/3;align-self:center;display:grid;justify-items:end;gap:1px;margin:0;padding:0;text-align:right;font-size:12px;line-height:16px}
  .r7c-rec::before{display:none}
  .r7c-rv{font-size:14px;line-height:19px}
  .r7c-hl{border-radius:10px}
  .r7c-cn{height:auto;align-self:stretch}
  .r7c-cn::before{left:calc(var(--sx) - 1px);right:auto;width:var(--r7c-lw);height:auto;top:0;bottom:0}
  .r7c-ft{display:block;margin-top:0;padding-top:0;border-top:0}
  .stg.v8.twin .r7c-short{display:block;margin:16px 0 0;font:400 15px/21px var(--font-b);color:var(--r7c-t2)}
  .r7c-short>span{white-space:nowrap}
  .stg.v8.twin .r7c-cta{width:100%;margin-top:16px;min-height:48px}
}
/* celular: a volta também é contada pelo marcador (três trechos), e só então aparece "For your decision" */
@media (max-width:900px) and (prefers-reduced-motion:no-preference){
  .stg.v8.twin.on .r7c-bk .r7c-mk{animation:r7c-mk1 1s linear 3.15s both}
  .stg.v8.twin.on .r7c-bk .r7c-my{animation:r7c-myu .45s cubic-bezier(.45,0,.55,1) 3.2s both}
  .stg.v8.twin.on .r7c-bk .r7c-mx{animation:r7c-mxl .22s cubic-bezier(.45,0,.55,1) 3.65s both}
  .stg.v8.twin.on .r7c-bk .r7c-mz{animation:r7c-myu .16s cubic-bezier(.45,0,.55,1) 3.87s both}
  .stg.v8.twin.on .r7c-lbo{animation-delay:3.9s}
}
@media (max-width:374px){
  .stg.v8.twin.first,.stg.v8.twin.first.on{padding:16px}
  .r7c-ag{column-gap:8px;padding:0 12px 0 10px}
  .r7c-dg{--sx:21px;--ax:38px}
  .r7c-hu{padding:0 12px}
  .stg.v8.twin .r7c-h{font-size:32px!important;line-height:35px}
}
/* celular baixo (375x667, 360x640): tudo fica — título menor, circuito mais compacto, frase em uma linha */
@media (max-width:900px) and (max-height:760px){
  .stg.v8.twin.first,.stg.v8.twin.first.on{padding:14px 16px}
  .stg.v8.twin .r7c-h{font-size:26px!important;line-height:27px}
  .r7c-kick{margin-bottom:4px}
  .r7c-fig{margin-top:8px}
  .r7c-ill{bottom:-2px}
  .r7c-dg{--ph:40px;--gg:26px;--rh:40px;--rg:6px}
  .r7c-hu{gap:10px}.r7c-pi{width:24px;height:24px}
  .r7c-hut{gap:0}
  .r7c-hul{line-height:14px}
  .r7c-hut b{font-size:14px;line-height:18px}
  .r7c-who{font-size:12px;line-height:14px}
  .r7c-vb{font-size:15px;line-height:19px}
  .r7c-rec{gap:0;line-height:14px}
  .r7c-rv{font-size:13px;line-height:17px}
  .stg.v8.twin .r7c-short{margin-top:8px;font-size:12px;line-height:16px;letter-spacing:-.005em;white-space:nowrap;text-wrap:initial}
  .stg.v8.twin .r7c-cta{margin-top:8px;min-height:44px}
}
/* movimento reduzido: a estação fica no fluxo da página, centrada, com folga antes da próxima */
@media (prefers-reduced-motion:reduce){
  .stg.v8.twin.first{height:auto!important;margin:16px auto 56px}
}
@media (prefers-reduced-motion:reduce) and (max-width:900px){
  .stg.v8.twin.first{width:calc(100% - 24px);margin:12px auto 36px}
}
/* revisão 8 · cabeçalho sem laranja: o laranja fica reservado à decisão humana (CEO 2026-10-07) */
.hdr .btn-o{background:#F4F3FA;color:#1A1A2E}.hdr .btn-o:hover{background:#FFFFFF}
.side b.on{background:#F4F3FA;color:#1A1A2E}

/* revisão 8 · prints reais nítidos e inteiros: foto nova em alta resolução, ajustada à largura da moldura,
   sem ampliação nem rolagem (antes: ampliada até 2,35x, borrada, só 39% da largura visível) */
.mg .bw2 .r6p-vp{container-type:normal;background:#fff}
.mg .bw2 .r6p-roll,.stg.v8.mg.on .bw2.on .r6p-roll{position:absolute!important;inset:0 0 auto 0!important;width:100%!important;height:auto!important;aspect-ratio:auto!important;translate:none!important;transform:none!important;animation:none!important}
.mg .bw2 .r6p-roll picture{display:block}
.mg .bw2 .r6p-roll img{display:block;width:100%!important;height:auto!important;object-fit:initial!important;min-height:0}
.mg .bw2 .r6p-ring{display:none!important}
@media (max-width:900px) and (max-height:700px){ /* revisão 8 · celular baixo: a moldura é baixa; a foto começa no título de cada site (medido: CC 70/433, Lumen 125/433, Chico 80/433 da página) */
  .mg .bw2[data-b="0"] .r6p-roll,.stg.v8.mg.on .bw2.on[data-b="0"] .r6p-roll{translate:0 -16.2%!important}
  .mg .bw2[data-b="1"] .r6p-roll,.stg.v8.mg.on .bw2.on[data-b="1"] .r6p-roll{translate:0 -28.9%!important}
  .mg .bw2[data-b="2"] .r6p-roll,.stg.v8.mg.on .bw2.on[data-b="2"] .r6p-roll{translate:0 -18.5%!important}
}
