/* Vaga Assistente Executiva — v2. Paleta "50 tons de cinza" (Guilherme Polymath). */
@font-face{font-family:"Space Grotesk";src:url("fonts/space-grotesk-latin-wght-normal.woff2") format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Inter";src:url("fonts/inter-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root{--bg:#000;--g1:#070707;--g2:#0e0e0e;--g3:#161616;--g5:#2b2b2b;--g6:#3d3d3d;--g7:#5e5e5e;--g8:#8f8f8f;--g9:#bdbdbd;--g10:#e8e8e8;--w:#fff;--text:#f2f2f2;--err:#ff8a80;
--shades:linear-gradient(90deg,#1c1c1c,#2e2e2e 15%,#484848 30%,#636363 45%,#7d7d7d 55%,#979797 65%,#b3b3b3 78%,#d2d2d2 90%,#f5f5f5);
--fh:"Space Grotesk",system-ui,sans-serif;--fb:Inter,system-ui,sans-serif;--ease:cubic-bezier(.2,.7,.2,1);--px:clamp(20px,6vw,96px);--mx:50%;--my:30%}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color-scheme:dark;scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body{background:var(--bg);color:var(--text);font:400 17px/1.65 var(--fb);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.lock{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--w);outline-offset:3px}
h1,h2,h3,.mark,.btn,.eyebrow{font-family:var(--fh)}
.skip{position:absolute;left:-999px;top:8px;background:var(--w);color:#000;padding:10px 16px;border-radius:8px;z-index:99}.skip:focus{left:8px}

/* fundo global: grade + aura que segue o cursor */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(520px circle at var(--mx) var(--my),rgba(255,255,255,.09),transparent 70%)}
.bg::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000,transparent 85%);mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000,transparent 85%)}
main,footer,.top{position:relative;z-index:1}

/* topo */
.top{position:fixed;inset:0 0 auto;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:calc(14px + env(safe-area-inset-top)) var(--px) 14px;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.top.sc{background:rgba(0,0,0,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-color:var(--g5)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:34px;height:34px;border-radius:50%}
.mark{font-weight:600;letter-spacing:.3em;font-size:.72rem}
.nav{display:flex;gap:28px;align-items:center}
.nav a{font-size:.88rem;color:var(--g9);text-decoration:none;transition:color .2s}.nav a:hover{color:var(--w)}
@media(max-width:860px){.nav a:not(.btn){display:none}}

.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--w);color:#050505;font-weight:600;font-size:.95rem;padding:16px 32px;border-radius:999px;text-decoration:none;border:1px solid var(--w);transition:background .25s,color .25s,transform .25s var(--ease)}
.btn:hover{background:transparent;color:var(--w);transform:translateY(-2px)}
.btn-sm{padding:10px 20px;font-size:.82rem}
.btn.ghost{background:transparent;color:var(--g9);border-color:transparent;padding-inline:14px}.btn.ghost:hover{color:var(--w)}
.btn.line{background:transparent;color:var(--w);border-color:var(--g6)}.btn.line:hover{border-color:var(--w);background:var(--w);color:#000}

/* tipografia de seção */
.eyebrow{font-size:.78rem;font-weight:500;letter-spacing:.32em;color:var(--g8);text-transform:uppercase;margin-bottom:20px;display:block}
h2{font-weight:600;font-size:clamp(1.9rem,4.2vw,3.2rem);line-height:1.08;letter-spacing:-.03em;margin-bottom:22px}
h3{font-weight:600;font-size:1.12rem;letter-spacing:-.01em;margin-bottom:8px}
.rule{display:block;width:150px;height:5px;border-radius:2px;background:var(--shades);margin:0 0 30px}
.sec{padding:clamp(80px,11vw,150px) var(--px);max-width:1360px;margin:auto}
.intro{max-width:64ch;color:var(--g9);margin-bottom:56px}

/* hero */
.hero{min-height:100svh;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,80px);align-items:center;padding:130px var(--px) 90px;max-width:1360px;margin:auto}
.tag{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--g6);border-radius:999px;padding:8px 16px;font-size:.82rem;color:var(--g10);margin-bottom:30px}
.tag i{width:7px;height:7px;border-radius:50%;background:var(--w);animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.25}}
h1{font-weight:700;font-size:clamp(2.7rem,7.2vw,6.4rem);line-height:1;letter-spacing:-.045em}
h1 span{display:block;color:var(--g8)}
.lead{max-width:54ch;color:var(--g9);font-size:clamp(1.05rem,1.5vw,1.22rem);margin:32px 0 40px}
.acts{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.facts{display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:48px;padding-top:28px;border-top:1px solid var(--g5);color:var(--g9);font-size:.9rem}
.facts b{display:block;color:var(--w);font:600 1rem var(--fh)}
@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:110px}.stage{aspect-ratio:16/10}}

/* faixa */
.strip{border-block:1px solid var(--g5);overflow:hidden;padding:20px 0;background:var(--g1)}
.strip div{display:flex;gap:56px;width:max-content;animation:mq 38s linear infinite;font:500 .9rem var(--fh);letter-spacing:.22em;color:var(--g8);text-transform:uppercase}
@keyframes mq{to{transform:translateX(-50%)}}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.card{background:var(--g1);border:1px solid var(--g5);border-radius:20px;padding:30px;transition:border-color .3s,transform .3s var(--ease),background .3s}
.card:hover{border-color:var(--g8);background:var(--g2);transform:translateY(-3px)}
.card p{color:var(--g9);font-size:.97rem}
.card .n{font:600 .8rem var(--fh);color:var(--g8);letter-spacing:.2em;margin-bottom:18px;display:block}

/* abas */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.tabs button{border:1px solid var(--g6);border-radius:999px;padding:10px 20px;font-size:.9rem;color:var(--g9);transition:all .2s}
.tabs button:hover{border-color:var(--w);color:var(--w)}
.tabs button[aria-selected=true]{background:var(--w);color:#000;border-color:var(--w)}
.panel{display:none;border:1px solid var(--g5);border-radius:24px;padding:clamp(24px,4vw,48px);background:linear-gradient(160deg,var(--g2),var(--bg))}
.panel.on{display:block;animation:rise .5s var(--ease)}
.panel ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:0 44px;margin-top:22px}
.panel li{padding:15px 0 15px 26px;border-bottom:1px solid var(--g5);color:#d6d6d6;position:relative;font-size:.98rem}
.panel li::before{content:"";position:absolute;left:0;top:27px;width:12px;height:2px;background:var(--shades)}
.panel>p{color:var(--g9);max-width:70ch}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}

/* dia a dia */
.tl{list-style:none;border-left:1px solid var(--g6);margin-left:8px}
.tl li{position:relative;padding:0 0 38px 36px;display:grid;grid-template-columns:90px 1fr;gap:20px}
.tl li::before{content:"";position:absolute;left:-5px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--w);box-shadow:0 0 0 5px var(--bg),0 0 0 6px var(--g6)}
.tl time{font:600 1rem var(--fh);color:var(--w)}
.tl p{color:var(--g9)}
@media(max-width:600px){.tl li{grid-template-columns:1fr;gap:4px}}

/* split / listas */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(36px,6vw,90px)}
.list{list-style:none}
.list li{padding:16px 0 16px 28px;border-bottom:1px solid var(--g5);color:#d6d6d6;position:relative}
.list li::before{content:"";position:absolute;left:0;top:28px;width:12px;height:2px;background:var(--shades)}
.langs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:34px}
.lang{border:1px solid var(--g5);border-radius:18px;padding:22px 16px;text-align:center;background:var(--g1)}
.lang b{display:block;font:700 1.5rem var(--fh)}.lang span{font-size:.8rem;color:var(--g8)}
.lang.hi{border-color:var(--w);background:var(--g3)}
.photo{min-height:340px;border-radius:24px;border:1px solid var(--g5);background-image:linear-gradient(180deg,transparent,rgba(0,0,0,.85)),url(img/escritorio.jpg),radial-gradient(circle at 30% 20%,#2b2b2b,#050505 70%);background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:26px;font-size:.88rem;color:var(--g9)}
.steps{list-style:none;counter-reset:s}
.steps li{counter-increment:s;position:relative;padding:0 0 30px 62px;border-left:1px solid var(--g6);margin-left:17px}
.steps li:last-child{border-color:transparent}
.steps li::before{content:counter(s);position:absolute;left:-18px;top:-4px;width:35px;height:35px;border-radius:50%;background:var(--bg);border:1px solid var(--g8);display:grid;place-items:center;font:600 .85rem var(--fh)}
.steps b{display:block;font-family:var(--fh)}.steps span{color:var(--g9);font-size:.95rem}

/* faq */
details{border-bottom:1px solid var(--g5)}
summary{list-style:none;cursor:pointer;padding:22px 40px 22px 0;font:500 1.08rem var(--fh);position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:6px;top:18px;font-size:1.6rem;color:var(--g8);transition:transform .3s}
details[open] summary::after{transform:rotate(45deg);color:var(--w)}
details p{padding:0 0 24px;color:var(--g9);max-width:70ch}

/* cta */
.cta{margin:0 var(--px) 100px;border:1px solid var(--g5);border-radius:32px;padding:clamp(56px,9vw,120px) 24px;text-align:center;background-image:linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,.9)),url(img/cta.jpg),radial-gradient(ellipse at 50% 0,#2b2b2b,#000 70%);background-size:cover;background-position:center}
.cta .rule{margin:0 auto 30px}.cta p{color:var(--g9);max-width:52ch;margin:0 auto 38px}

footer{border-top:1px solid var(--g5);padding:44px var(--px) 36px;display:grid;gap:26px}
.fl{display:flex;gap:10px 30px;flex-wrap:wrap}
.fl a,.fl button{color:var(--g9);font-size:.88rem;text-decoration:none}.fl a:hover,.fl button:hover{color:var(--w)}
footer small{color:var(--g7);font-size:.8rem;max-width:80ch}

/* reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.rv.in{opacity:1;transform:none}
.js-off .rv{opacity:1;transform:none}

/* formulário em etapas */
.tf{position:fixed;inset:0;z-index:50;background:var(--bg);display:flex;flex-direction:column;overflow:auto;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.tf[hidden],.tf-done[hidden],form[hidden]{display:none}
.tf::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 50% at 70% 10%,rgba(255,255,255,.07),transparent 70%)}
.tf-bar{position:sticky;top:0;height:4px;background:var(--g5);z-index:3;flex:none}
.tf-bar i{display:block;height:100%;width:0;background:var(--shades);transition:width .5s var(--ease)}
.tf-head{display:flex;justify-content:space-between;align-items:center;padding:22px var(--px);flex:none;position:relative}
.x{color:var(--g8);font-size:.88rem}.x:hover{color:var(--w)}
.tf form{flex:1;display:flex;flex-direction:column;justify-content:center;padding:20px var(--px) 40px;max-width:1040px;width:100%;margin:auto;position:relative}
.q{animation:rise .5s var(--ease)}.q.back{animation-name:riseb}
@keyframes riseb{from{opacity:0;transform:translateY(-16px)}}
.qn{font:600 .82rem var(--fh);color:var(--g8);letter-spacing:.2em;margin-bottom:14px}
.q h2{font-size:clamp(1.6rem,4vw,2.9rem)}
.sub{color:var(--g8);margin-bottom:32px;max-width:62ch}
.in{width:100%;background:none;border:0;border-bottom:1px solid var(--g6);color:var(--w);font:400 clamp(1.3rem,3vw,2rem) var(--fh);padding:10px 0;border-radius:0;transition:border-color .25s}
.in:focus{outline:0;border-color:var(--w)}.in::placeholder{color:var(--g6)}
textarea.in{font:400 1.1rem/1.6 var(--fb);min-height:160px;resize:vertical;border:1px solid var(--g6);padding:16px;border-radius:14px}
.opts{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr))}
.op{display:flex;gap:14px;align-items:center;text-align:left;border:1px solid var(--g6);border-radius:14px;padding:16px 18px;transition:all .2s}
.op:hover{border-color:var(--g9)}
.op kbd{font:600 .75rem var(--fh);border:1px solid var(--g6);border-radius:6px;padding:2px 8px;color:var(--g8);flex:none}
.op[aria-pressed=true]{border-color:var(--w);background:var(--g3)}.op[aria-pressed=true] kbd{background:var(--w);color:#000;border-color:var(--w)}
.err{color:var(--err);font-size:.92rem;margin-top:14px;min-height:1.4em}
.tf-nav{display:flex;gap:12px;align-items:center;margin-top:20px;flex-wrap:wrap}
.hint{color:var(--g7);font-size:.82rem;margin-left:8px}
.tf-done{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:40px var(--px);max-width:1040px;margin:auto;width:100%;position:relative;animation:rise .6s var(--ease)}
.tf-done p{color:var(--g9);max-width:56ch;margin:0 0 34px}
.tf.sending .btn{opacity:.5;pointer-events:none}
@media(max-width:600px){.hint{display:none}}

/* cookies */
.ck{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:60;width:min(420px,calc(100vw - 32px));background:rgba(10,10,10,.96);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--g6);border-radius:20px;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.7);animation:rise .6s var(--ease)}
.ck[hidden]{display:none}
.ck h3{font-size:1rem}.ck p{font-size:.85rem;color:var(--g9);line-height:1.55}.ck p a{color:var(--w)}
.ck .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.ck .btn{padding:11px 18px;font-size:.82rem;flex:1 1 auto}
.ck-opts{margin-top:14px;display:grid;gap:10px}.ck-opts[hidden]{display:none}
.ck-opts label{display:flex;gap:12px;align-items:flex-start;font-size:.82rem;color:var(--g9);border:1px solid var(--g5);border-radius:12px;padding:12px;cursor:pointer}
.ck-opts input{accent-color:#fff;margin-top:3px;width:16px;height:16px;flex:none}.ck-opts b{display:block;color:var(--w);font-family:var(--fh);font-size:.85rem}

/* páginas legais */
.doc{max-width:820px;margin:auto;padding:150px var(--px) 80px;position:relative;z-index:1}
.doc h1{font-size:clamp(2.2rem,5vw,3.6rem);margin-bottom:14px}
.doc .upd{color:var(--g8);font-size:.88rem;margin-bottom:44px}
.doc h2{font-size:1.4rem;margin:44px 0 14px;letter-spacing:-.02em}
.doc p,.doc li{color:var(--g9);margin-bottom:14px}
.doc ul{padding-left:22px}.doc li::marker{color:var(--g7)}
.doc table{width:100%;border-collapse:collapse;font-size:.9rem;margin:10px 0 20px;display:block;overflow-x:auto}
.doc th,.doc td{border:1px solid var(--g5);padding:12px 14px;text-align:left;color:var(--g9);vertical-align:top}.doc th{color:var(--w);background:var(--g2);font-family:var(--fh)}
.doc a{color:var(--w)}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}

/* ===== v3: camada premium ===== */
html{font-feature-settings:"ss01","cv11"}
body{font-size:17px;line-height:1.72;letter-spacing:-.003em}
h1,h2,h3{text-wrap:balance}
h1{font-weight:600;letter-spacing:-.055em;line-height:.98;background:linear-gradient(180deg,#fff 30%,#9a9a9a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-bottom:.08em}
h1 span{-webkit-text-fill-color:transparent;background:linear-gradient(90deg,#8f8f8f,#4a4a4a);-webkit-background-clip:text;background-clip:text}
h2{font-weight:500;letter-spacing:-.045em;line-height:1.04}
h3{font-weight:500;letter-spacing:-.02em}
.eyebrow{font-weight:500;letter-spacing:.34em;font-size:.72rem;display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--g7)}
.lead,.intro{font-weight:300;color:var(--g9);line-height:1.7}
.lead{font-size:clamp(1.1rem,1.5vw,1.3rem)}
.sec{padding-block:clamp(90px,12vw,170px)}
.btn{box-shadow:0 0 0 0 rgba(255,255,255,.0);letter-spacing:-.005em}
.btn:not(.ghost):not(.line):hover{box-shadow:0 10px 40px rgba(255,255,255,.12)}
.nav a:not(.btn){position:relative}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--w);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:not(.btn):hover::after{transform:scaleX(1)}
.tag{background:rgba(255,255,255,.03);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.facts b{font-size:1.15rem;font-weight:500;letter-spacing:-.02em}

/* painel do hero com animação de rede (como no site temporário) */
.stage{position:relative;aspect-ratio:4/5;max-height:78vh;width:100%;justify-self:end;border-radius:32px;border:1px solid var(--g5);overflow:hidden;background:radial-gradient(ellipse 70% 55% at 50% 45%,#1d1d1d,#050505 75%);box-shadow:0 40px 120px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06)}
.stage::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse 65% 60% at 50% 45%,#000,transparent 85%);mask-image:radial-gradient(ellipse 65% 60% at 50% 45%,#000,transparent 85%)}
.stage::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 45% 38% at 50% 45%,rgba(255,255,255,.16),transparent 70%);animation:aura 5s ease-in-out infinite;pointer-events:none}
@keyframes aura{0%,100%{opacity:.35}50%{opacity:1}}
#fx{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.orb{--p:0;position:absolute;inset:0;margin:auto;width:clamp(120px,40%,200px);aspect-ratio:1;height:auto;border-radius:50%;z-index:2;pointer-events:none;filter:drop-shadow(0 0 calc(8px + 30px*var(--p)) rgba(255,255,255,calc(.14 + .5*var(--p)))) brightness(calc(1 + .2*var(--p)));animation:pop .9s var(--ease) .2s both}
.orb .avatar{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;background:var(--g1)}
@keyframes pop{from{opacity:0;scale:.88}to{opacity:1;scale:1}}
.stage figcaption{position:absolute;z-index:3;left:26px;right:26px;bottom:22px;display:flex;justify-content:space-between;gap:10px;font:500 .72rem var(--fh);letter-spacing:.22em;text-transform:uppercase;color:var(--g8);pointer-events:none}
@media(max-width:900px){.stage{aspect-ratio:1/1;max-height:none;justify-self:stretch}}

/* cards com luz que segue o cursor */
.card,.panel,.lang{position:relative;overflow:hidden}
.card::before,.panel::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--sx,50%) var(--sy,0),rgba(255,255,255,.08),transparent 60%)}
.card:hover::before,.panel:hover::before{opacity:1}
.card{border-radius:24px;padding:34px;background:linear-gradient(180deg,#0c0c0c,#050505)}
.card .n{font-weight:500;color:var(--g7)}
.panel{border-radius:28px}
.tabs button{font-weight:500;font-size:.88rem;letter-spacing:-.005em}
.lang{border-radius:20px}.lang b{font-weight:500;letter-spacing:-.03em}
.tl time{font-weight:500;letter-spacing:-.02em}
.photo,.cta{border-radius:28px}
summary{font-weight:400;letter-spacing:-.02em;font-size:1.15rem}
.cta h2{font-size:clamp(2rem,5vw,3.8rem)}
footer{padding-top:56px}
.ck{border-radius:22px}

/* ===== v4: correção do título (texto sumia com background-clip no h1) ===== */
h1{background:none;color:#fff;-webkit-text-fill-color:currentColor;-webkit-background-clip:border-box;background-clip:border-box}
h1 .g1,h1 .g2{display:block;padding-bottom:.12em;color:#fff;-webkit-text-fill-color:currentColor}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  h1 .g1{background-image:linear-gradient(180deg,#fff 25%,#b3b3b3);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
  h1 .g2{background-image:linear-gradient(90deg,#9a9a9a,#5a5a5a);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
}
h1 .g2{color:#8f8f8f}

/* ===== v6: endurecimento de responsividade ===== */
html,body{max-width:100%;overflow-x:clip}
img,canvas,video,svg{max-width:100%}
.top{gap:12px}
.brand{min-width:0}
.brand .mark{white-space:nowrap}
.tf form{justify-content:flex-start}
#stage{margin-top:auto}
.tf-nav{margin-bottom:auto}
.q h2,.sub{overflow-wrap:anywhere}
h1,h2,h3,p,li,summary{overflow-wrap:break-word}
.ck{max-height:calc(100svh - 32px);overflow:auto}

@media (max-width:1100px){.hero{gap:40px}h1{font-size:clamp(2.6rem,8vw,5rem)}}
@media (max-width:900px){
  .hero{min-height:auto;padding:112px var(--px) 70px}
  .stage{max-width:560px;justify-self:center}
  .split{gap:48px}
}
@media (max-width:640px){
  body{font-size:16px}
  .brand .mark{font-size:.62rem;letter-spacing:.2em}
  .brand img{width:30px;height:30px}
  .btn-sm{padding:9px 16px}
  .hero{padding-top:100px}
  .acts .btn{width:100%}
  .acts .ghost{justify-content:flex-start}
  .facts{gap:18px 26px}
  .tabs{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--px)*-1);padding-inline:var(--px);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:none;white-space:nowrap}
  .panel{padding:24px 20px}
  .card{padding:26px 22px}
  .lang{padding:18px 8px}.lang b{font-size:1.25rem}
  .cta{margin-inline:calc(var(--px)*.6);border-radius:24px}
  .cta .btn{width:100%}
  .tf-head{padding-block:16px}
  .tf-nav .btn:not(.ghost){flex:1}
  .op{padding:14px 14px}
  .ck{left:10px;right:10px;width:auto;bottom:calc(10px + env(safe-area-inset-bottom));padding:18px}
  .ck .btn{flex:1 1 100%}
  .doc{padding-top:120px}
  footer{padding-bottom:calc(36px + env(safe-area-inset-bottom))}
}
@media (max-width:380px){
  .brand .mark{display:none}
  h1{font-size:2.35rem}
  .langs{grid-template-columns:1fr}
}
@media (max-height:520px) and (orientation:landscape){
  .hero{padding-top:90px}
  .tf form{padding-top:8px}
  .q h2{font-size:1.5rem}.sub{margin-bottom:16px}
}
@media (hover:none){
  .card:hover,.btn:hover{transform:none}
  .card::before,.panel::before{display:none}
}
