/* Henrico — engenharia em camadas. Grafite + luz âmbar, do retrato ao produto. */
:root { --bg:#090b0e; --fg:#f2f1ed; --mut:#a1a6ae; --acc:#e8b04a; --acc-fg:#111317; --line:#ffffff1c; --card:#ffffff04; --card-h:#ffffff08; --chip:#e8b04a0d; --glow:#e8b04a0c; --max:1440px; --pad:clamp(22px,5vw,72px); --r:8px; --mono:'SFMono-Regular',Consolas,monospace; color-scheme:dark; }
html { scroll-behavior:smooth; }
body { background:var(--bg); font-size:18px; }
.topo { background:#090b0eab; backdrop-filter:blur(18px); border-bottom:1px solid #ffffff0b; }
.topo-in { height:76px; }.marca { font-size:24px; letter-spacing:-.06em; }.marca i { color:var(--acc); }
.menu { font-size:13px; gap:28px; }.menu a { color:#c6c8cd; }.menu a:hover { color:var(--acc); }.menu .idioma { border-radius:5px; }
.kicker { font:11px/1.6 var(--mono); color:var(--acc); letter-spacing:.12em; }
.sec { padding:clamp(80px,10vw,144px) 0; }.sec-c { padding:42px 0; }
.titulo { font-size:clamp(42px,5.5vw,80px); font-weight:550; letter-spacing:-.055em; line-height:1.05; }
.btn { border-radius:6px; font-size:15px; padding:14px 21px; }.btn-2 { background:#ffffff03; }.btn:hover { box-shadow:0 0 30px #e8b04a14; }
/* A mesma luz acompanha os projetos. As cores de cada produto ficam na interface. */
.produtos { border-top:1px solid var(--line); background:linear-gradient(#0c0f14,var(--bg) 35%); }
.section-head { display:flex; justify-content:space-between; gap:24px; align-items:baseline; }.section-note { color:#737c88; font:10px/1.5 var(--mono); text-transform:uppercase; letter-spacing:.08em; }
.produtos .titulo { margin-top:28px; max-width:none; }
.selected-list { margin-top:65px; }.selected-project { position:relative; }.selected-project+.selected-project { margin-top:110px; }
.project-stage { position:relative; display:block; aspect-ratio:1.8; overflow:hidden; background:radial-gradient(ellipse at 50% 65%,#e8b04a13,transparent 60%),#11151c; border:1px solid #ffffff12; border-radius:10px; isolation:isolate; }
.project-stage::after { content:''; position:absolute; inset:0; pointer-events:none; border-radius:inherit; box-shadow:inset 0 0 70px #0005; }
.stage-label { position:absolute; top:24px; left:28px; z-index:3; color:#e1e3e6; text-shadow:0 1px 8px #000; font:10px/1.5 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.stage-arrow { position:absolute; top:20px; right:24px; z-index:3; width:44px; height:44px; display:grid; place-items:center; color:var(--fg); background:#090b0e70; backdrop-filter:blur(12px); border:1px solid #ffffff22; border-radius:50%; font-size:23px; transition:background .3s,transform .3s; }
.project-stage:hover .stage-arrow { background:var(--acc); color:#101216; transform:rotate(45deg); }
.project-desktop { position:absolute; width:74%; top:15%; left:9%; border:1px solid #ffffff40; box-shadow:0 30px 60px #0008; border-radius:5px; transform:perspective(1000px) rotateY(-7deg); }
.project-mobile { position:absolute; width:17%; right:8%; top:28%; border:5px solid #242932; border-radius:18px; box-shadow:0 30px 60px #0008; }
.project-artwork { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease),filter .6s; transform:scale(calc(1.03 + var(--media-shift,0) * .035)); }
.project-stage:hover .project-artwork { filter:brightness(1.08); }
.project-caption { display:grid; grid-template-columns:1fr 1.2fr auto; gap:5%; padding:28px 0 0; align-items:start; }
.project-caption h3 { font-size:clamp(28px,3vw,43px); font-weight:500; letter-spacing:-.04em; line-height:1.1; margin-top:12px; }.project-caption h3 a { text-decoration:none; }
.produto-meta { font:10px/1.6 var(--mono); gap:10px; }.status { font-size:10px; padding:5px 8px; }
.project-description { font-size:20px; line-height:1.3; letter-spacing:-.02em; }.project-summary { color:var(--mut); font-size:14px; line-height:1.6; margin-top:12px; max-width:49ch; }
.project-case { font-size:12px; text-underline-offset:7px; white-space:nowrap; padding:6px 0 12px; }.project-case span { margin-left:12px; color:var(--acc); }
.all-work { display:flex; justify-content:space-between; border-top:1px solid var(--line); margin-top:65px; padding-top:28px; font-size:clamp(24px,3vw,40px); letter-spacing:-.04em; text-decoration:none; }.all-work:hover { color:var(--acc); }
/* Autoria: a foto original ganha espaço e mantém rosto e enquadramento. */
.resumo { border-top:1px solid var(--line); }.about-intro { display:grid; grid-template-columns:320px 1fr; align-items:center; gap:9%; }
.about-portrait img { width:100%; border-radius:8px; }.about-portrait figcaption { margin-top:12px; color:var(--mut); font:10px/1.5 var(--mono); }
.about-intro .titulo { font-size:clamp(36px,4.5vw,66px); max-width:20ch; }.about-intro .sub { max-width:42ch; }
.specs { gap:0; border-top:1px solid var(--line); margin-top:70px; }.spec { background:none; border:0; border-radius:0; border-bottom:1px solid var(--line); padding:32px 32px 32px 0; }.spec-papeis { grid-column:span 2; grid-row:span 2; padding-right:45px; }.spec-num { font-weight:500; }.spec-papeis b { font-size:21px; }.spec-papeis span { font-size:14px; }.spec-largo { display:none; }.spec-link { font-weight:400; }
.trabalho { padding-top:10px; }.cards { grid-template-columns:1fr 1fr; gap:0 50px; }.card { border:0; border-top:1px solid var(--line); border-radius:0; background:none; padding:28px 0 35px; min-height:0; }.card:hover { background:none; transform:translateX(5px); }.card h3 { font-weight:500; font-size:28px; letter-spacing:-.035em; }.card:hover h3 { color:var(--acc); }.card p { font-size:15px; max-width:54ch; }.card .card-meta { font:10px/1.5 var(--mono); }.card .card-num { margin-top:12px; }.card-ir { font-weight:400; }
/* Ensino continua no mesmo universo visual; o enquadramento espera o arquivo real. */
.ensino { background:radial-gradient(ellipse at 25% 90%,#e8b04a0a,transparent 70%),#0e1116; border-block:1px solid var(--line); }
.ensino-in { gap:8%; }.ensino .titulo { font-size:clamp(50px,6.2vw,86px); font-weight:550; letter-spacing:-.055em; }.ensino-curso { color:var(--acc); font-size:21px; }
.ensino-reserva { background:linear-gradient(135deg,#191f27,#0b0e12); border:1px solid #e8b04a35; border-radius:8px; }
.ensino-reserva::before,.ensino-reserva::after { content:''; position:absolute; width:24px; height:24px; border-style:solid; border-color:#e8b04a77; }
.ensino-reserva::before { top:16px; right:16px; border-width:1px 1px 0 0; }.ensino-reserva::after { bottom:16px; left:16px; border-width:0 0 1px 1px; }
.ensino-placeholder { color:#d5d9df; }.ensino-original { width:100%; aspect-ratio:16/9; object-fit:contain; border-radius:8px; }.ensino-case { max-width:1120px; }
.teclado { background:linear-gradient(#262b34,#11151b); box-shadow:0 50px 90px -35px #000b; }.tecla { background:linear-gradient(#343b46,#232a34); color:#e8e9ec; box-shadow:0 5px 0 #080a0e,inset 0 1px #ffffff0e; }.tecla:hover { color:#fff; }.tecla[aria-pressed=true] { color:#e8b04a; box-shadow:0 1px 0 #080a0e,inset 0 0 0 1px #e8b04a; }.key-short { display:none; }
.tecla-painel { border-radius:8px; background:#10141a; }.teclas { border-bottom:1px solid var(--line); }
.processo .titulo { max-width:none; }.tese p { font-weight:400; max-width:26ch; }.processo-visual { max-width:1040px; margin-inline:auto; }.processo-visual img { border-radius:8px; }.passos { gap:0 40px; }.passos li { padding:26px 0; border-radius:0; border-width:1px 0 0; background:none; }.passos h3 { font-weight:500; }
.arco { border-top:1px solid var(--line); }
.contato { background:radial-gradient(ellipse at 50% 100%,#e8b04a16,transparent 62%),#0e1116; padding-block:130px; }.contato .titulo { font-size:clamp(54px,9vw,130px); color:var(--fg); letter-spacing:-.065em; font-weight:500; }.contato .email { font-size:clamp(24px,4vw,52px); letter-spacing:-.035em; }.redes-destaque a { border-radius:6px; background:none; }
.rodape { background:#090b0e; padding:32px 0; }.titulo-pag { font-weight:550; letter-spacing:-.05em; }.metricas>div,.pilar { background:#ffffff03; border-radius:8px; }.cap-tit { font-weight:500; }
@media (max-width:1100px) {.project-caption { grid-template-columns:1fr 1fr; gap:24px; }.project-case { grid-column:2; }.spec-papeis { grid-column:span 2; grid-row:auto; }.about-intro { grid-template-columns:260px 1fr; gap:7%; } }
@media (max-width:760px) {
  .topo-in { height:64px; }.marca { font-size:22px; }.menu { gap:17px; font-size:12px; }.menu .m-github { display:none; }
  .section-head { display:block; }.section-note { display:block; margin-top:10px; font-size:9px; }.produtos .titulo { margin-top:22px; }.selected-list { margin-top:35px; }.selected-project+.selected-project { margin-top:65px; }
  .project-stage { aspect-ratio:1.32; }.project-artwork { object-fit:contain; background:#090b0e; }.stage-label { top:16px; left:16px; font-size:9px; }.stage-arrow { top:10px; right:12px; width:32px; height:32px; font-size:19px; }.project-desktop { top:24%; width:88%; left:6%; }.project-mobile { width:25%; right:6%; top:36%; border-width:3px; border-radius:12px; }
  .project-caption { grid-template-columns:1fr; gap:18px; padding-top:22px; }.project-case { grid-column:auto; justify-self:start; }.project-caption h3 { font-size:34px; }.project-description { font-size:19px; }.project-summary { font-size:14px; }
  .about-intro { grid-template-columns:1fr; gap:35px; }.about-portrait { width:min(78%,300px); }.about-intro .titulo { font-size:42px; }.specs { margin-top:40px; }.spec { padding:25px 0; }.spec-papeis { grid-column:1/-1; }
  .cards { grid-template-columns:1fr; }.card h3 { font-size:27px; }.ensino-in { gap:42px; }.ensino .titulo { font-size:58px; }.ensino-curso { font-size:20px; }.ensino-placeholder { font-size:26px; }
  .teclas .titulo { font-size:42px; }.contato { padding-block:90px; }.contato .titulo { font-size:clamp(50px,13vw,85px); }.contato .email { overflow-wrap:anywhere; }
}
@media (max-width:480px) {.teclado { grid-template-columns:repeat(3,minmax(0,1fr)); }.tecla { font-size:12px; overflow-wrap:anywhere; }.key-full { display:none; }.key-short { display:inline; }.tecla:last-child { grid-column:1/-1; } }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }.project-artwork { transform:none; }
}
.project-stage:has(.project-artwork) { aspect-ratio:1.6; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.section-note { color:#8e96a2; }
/* Apresentação direta: identidade, atuação e caminhos para as evidências. */
.intro { padding:145px 0 0; }
.intro-grid { display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);gap:9%;align-items:center; }
.intro h1 { font-size:clamp(48px,5.6vw,82px);line-height:1.04;letter-spacing:-.055em;font-weight:550;max-width:14ch;margin:25px 0; }
.intro h1 em { color:var(--acc);font-style:normal; }
.intro-description { font-size:clamp(16px,1.4vw,20px);line-height:1.65;color:#b8bdc5;max-width:49ch; }
.intro .acoes { margin-top:28px;gap:25px;align-items:center; }
.intro-contact { font-size:14px;text-underline-offset:6px; }
.intro-portrait { max-width:365px;justify-self:end; }
.intro-portrait img { width:100%;border-radius:8px; }
.intro-portrait figcaption { display:grid;gap:6px;font-size:12px;color:var(--mut);line-height:1.5;margin-top:16px; }
.intro-portrait figcaption span:first-child { color:var(--fg); }
.intro-now { display:grid;grid-template-columns:.7fr repeat(3,1fr);gap:28px;align-items:center;padding:32px 0;margin-top:55px;border-top:1px solid var(--line); }
.intro-now div { display:grid;gap:7px; }.intro-now b { font-size:16px;font-weight:500; }.intro-now div span { font-size:13px;color:var(--mut);line-height:1.5; }
.produtos .titulo { max-width:20ch; }.selected-list { margin-top:40px; }.selected-project+.selected-project { margin-top:75px; }
.project-caption { padding:26px 0 30px;border-top:1px solid var(--line);grid-template-columns:.9fr 1.4fr auto;gap:5%; }
.project-caption h3 { margin-top:12px; }.project-description { font-size:22px;line-height:1.4; }.project-summary { font-size:14px; }.project-summary b { color:var(--fg);font-weight:500; }
.project-proof { color:var(--acc);font-size:13px;margin-top:14px; }.project-stage:has(.project-artwork) { aspect-ratio:2.05; }.project-artwork { object-fit:cover;transform:none; }.stage-label { display:none; }
.trabalho { padding-top:100px; }.trabalho .specs { margin:40px 0 60px; }.trabalho .spec-papeis { display:none; }
.ensino .titulo { font-size:clamp(42px,5vw,70px); }
.product-explorer { margin-top:16px;border:1px solid var(--line);border-radius:6px; }
.product-explorer summary { font-size:14px;cursor:pointer;padding:20px; }.product-explorer summary span { float:right;color:var(--acc); }.product-explorer[open] summary { border-bottom:1px solid var(--line); }
.explorer-content { padding:24px; }.explorer-content>p { color:var(--mut);font-size:14px; }
.interface-model { position:relative;width:100%;height:clamp(200px,40vw,500px);margin:20px 0; }
.interface-model canvas { display:block;width:100%;height:100%;visibility:hidden; }.model-fallback { position:absolute;width:100%;height:100%;object-fit:contain; }.model-ready canvas { visibility:visible; }.model-ready .model-fallback { visibility:hidden; }
.model-control { display:flex;align-items:center;gap:20px;font-size:14px;max-width:480px;margin:auto; }.model-control input { flex:1;min-width:0;accent-color:var(--acc);height:44px; }.model-control output { min-width:4ch;text-align:right; }
@media(max-width:900px) {
 .intro-grid { gap:6%;grid-template-columns:1.3fr .8fr; }.intro h1 { font-size:58px; }.intro-now { grid-template-columns:repeat(3,1fr); }.intro-now>.kicker { grid-column:1/-1; }.project-caption { grid-template-columns:1fr 1.4fr; }.project-case { grid-column:2; }
}
@media(max-width:600px) {
 .intro { padding-top:98px; }.intro-grid { grid-template-columns:1fr;gap:35px; }.intro h1 { font-size:clamp(43px,10.5vw,62px);margin:20px 0; }.intro .kicker { font-size:10px;letter-spacing:.07em; }.intro-description { font-size:16px; }.intro .acoes { gap:20px; }.intro .btn { font-size:14px; }.intro-contact { font-size:13px; }
 .intro-portrait { display:grid;grid-template-columns:88px 1fr;gap:20px;max-width:none;justify-self:stretch;align-items:center; }.intro-portrait figcaption { margin:0; }.intro-now { margin-top:35px;gap:20px;grid-template-columns:1fr; }.intro-now div { grid-template-columns:1fr 1.1fr;gap:12px;align-items:baseline; }.intro-now b { font-size:14px; }.intro-now div span { font-size:12px; }
 .project-caption { grid-template-columns:1fr;gap:20px; }.project-case { grid-column:auto; }.project-description { font-size:20px; }.project-stage:has(.project-artwork) { aspect-ratio:1.6; }.project-artwork { object-fit:contain; }.selected-project+.selected-project { margin-top:55px; }.trabalho { padding-top:75px; }.explorer-content { padding:15px; }.menu { gap:14px; }.menu .m-ensino { display:none; }
}

.trabalho .specs { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:600px) { .trabalho .specs { grid-template-columns:1fr; } }

/* Tipografia de leitura. */
.project-summary,.card p { font-size:16px;line-height:1.7;color:#b9bec6; }
.produto-meta,.status,.card .card-meta { font-size:12px; }
.section-note { font-size:12px;color:#aeb5bf;text-transform:none;letter-spacing:.02em; }
.project-case,.ensino-link { font-size:15px; }
.trabalho .specs>.spec { grid-column:auto; }
.tecla-painel { min-height:300px; }
@media(max-width:600px) {
 .project-summary,.card p { font-size:15px; }
 .produto-meta { flex-wrap:wrap; }
 .project-caption h3 { font-size:32px; }
}

/* Escala compacta e mockups originais, conforme preferência do usuário. */
:root { --max:1200px;--pad:clamp(22px,4vw,48px); }
.sec { padding:64px 0; }
.titulo,.ensino .titulo,.teclas .titulo { font-size:clamp(30px,3.5vw,44px);letter-spacing:-.04em;line-height:1.15; }
.intro { padding-top:112px; }
.intro-grid { grid-template-columns:1.5fr .8fr;gap:9%; }
.intro h1 { font-size:clamp(38px,4.5vw,60px);max-width:17ch;margin:18px 0; }
.intro-description { font-size:17px;line-height:1.65; }
.intro-portrait { max-width:280px; }
.intro-now { margin-top:36px;padding:24px 0; }
.intro .acoes { margin-top:22px; }
.selected-list { margin-top:30px; }
.selected-project { display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr);gap:24px 7%;align-items:center;padding:32px 0;border-top:1px solid var(--line); }
.selected-project+.selected-project { margin-top:8px; }
.project-caption { display:block;border:0;padding:0; }
.project-caption h3 { font-size:29px;margin:14px 0 16px; }
.project-description { font-size:18px;line-height:1.55; }
.project-summary { font-size:14px;margin-top:12px; }
.project-case { display:inline-block;margin-top:18px; }
.project-stage { aspect-ratio:auto;padding:30px 22px 12px;background:#101318;border:1px solid #ffffff0c; }
.project-stage::after { display:none; }
.project-stage .palco { margin:0; }.project-stage .fone { min-width:0; }
.stage-arrow { width:30px;height:30px;font-size:18px;right:10px;top:10px; }
.product-explorer { grid-column:2;margin:0; }.product-explorer summary { padding:14px;font-size:13px; }
.interface-model { height:290px; }
.all-work { margin-top:24px;padding-top:20px;font-size:24px; }
.trabalho .specs { margin:28px 0 34px; }.spec-num { font-size:40px; }.spec { padding:24px 24px 24px 0; }
.cards { margin-top:30px; }.card h3 { font-size:24px; }.card { padding:22px 0; }
.ensino-in { gap:6%; }.ensino-curso { font-size:18px; }.ensino .sub { font-size:16px; }.ensino-frame figcaption { font-size:12px;line-height:1.6; }
.teclado { margin-top:28px;border-radius:12px; }.tecla { height:50px;border-radius:7px; }
.contato { padding-block:70px; }.contato .titulo { font-size:clamp(36px,5vw,60px); }.contato .email { font-size:clamp(23px,3vw,36px); }
.titulo-pag { font-size:clamp(36px,5vw,60px); }.case-hero .titulo-pag { font-size:clamp(36px,5vw,60px); }
@media(max-width:700px) {
 .intro-grid { grid-template-columns:1fr;gap:26px; }.intro h1 { font-size:clamp(36px,7vw,46px); }.intro { padding-top:96px; }.intro-portrait { max-width:none;display:grid;grid-template-columns:78px 1fr;gap:18px;justify-self:stretch;align-items:center; }.intro-portrait figcaption { margin:0; }
 .selected-project { grid-template-columns:1fr;gap:20px;padding-block:26px; }.project-stage { max-width:500px;width:100%;justify-self:center; }.product-explorer { grid-column:1; }.sec { padding:48px 0; }.project-caption h3 { font-size:27px; }
 .ensino .titulo,.teclas .titulo { font-size:32px; }.project-stage .note-tampa { border-radius:8px 8px 3px 3px; }.project-stage .note-base { height:8px; }.interface-model { height:220px; }
}
/* Composição editorial com exploração ativa dos projetos. */
.studio-intro { position:relative;overflow:hidden;padding-top:126px;background:radial-gradient(ellipse at 83% 38%,#e8b04a0a,transparent 42%); }
.intro-name { font-size:18px;font-weight:550;letter-spacing:-.025em;display:flex;align-items:center;gap:18px; }
.intro-name span { font:10px/1.5 var(--mono);color:var(--mut);letter-spacing:.02em;border-left:1px solid var(--line);padding-left:18px; }
.studio-intro h1 { font-size:clamp(40px,4.7vw,62px);line-height:1.07;letter-spacing:-.045em;margin:28px 0 24px;max-width:none; }
.studio-intro h1 em { font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;letter-spacing:-.055em;color:#e4c184; }
.studio-intro .intro-description { max-width:48ch;font-size:16px; }
.studio-intro .intro-portrait { position:relative;max-width:265px;transform:rotate(2deg);margin-right:15px; }
.studio-intro .intro-portrait::before { content:'';position:absolute;inset:-14px 14px 65px -14px;border:1px solid #e8b04a38;border-radius:5px;transform:rotate(-5deg);pointer-events:none; }
.studio-intro .intro-portrait img { position:relative;z-index:1;border-radius:4px; }
.portrait-index { position:absolute;z-index:2;right:-15px;top:24px;writing-mode:vertical-rl;font:10px var(--mono);letter-spacing:.2em;color:var(--acc); }
.studio-intro .intro-portrait figcaption { transform:rotate(-2deg);padding-top:7px; }
.studio-intro .intro-now { border:0;margin-top:38px;gap:28px;padding-bottom:28px; }.intro-now>.kicker { max-width:12ch; }
.btn { border-radius:3px; }.btn:hover { background:#f1c56f;box-shadow:none; }
.produtos { background:#0d1014;border-top:0; }.produtos .section-head { align-items:center; }.produtos .titulo { margin-top:14px; }
.work-selector { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:34px;border-bottom:1px solid #ffffff26; }
.work-selector[hidden],.selected-project[hidden] { display:none!important; }
.work-selector button { appearance:none;position:relative;display:grid;grid-template-columns:22px 1fr 20px;gap:6px 10px;align-items:center;text-align:left;padding:18px 20px 20px 0;background:none;border:0;color:#949ca8;font:500 18px/1.3 var(--f);cursor:pointer; }
.work-order { font:10px var(--mono);grid-row:1/3;align-self:start;margin-top:4px;color:#697382; }.work-kind { grid-column:2;font-size:12px;font-weight:400;color:#909aa8; }.work-select-arrow { grid-column:3;grid-row:1/3;font-size:22px;transform:rotate(45deg);transition:transform .25s,color .25s; }
.work-selector button::after { content:'';position:absolute;bottom:-1px;left:0;right:24px;height:2px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .3s; }
.work-selector button[aria-selected=true] { color:var(--fg); }.work-selector button[aria-selected=true]::after { transform:scaleX(1); }.work-selector button[aria-selected=true] .work-order { color:var(--acc); }.work-selector button[aria-selected=true] .work-select-arrow { transform:rotate(0);color:var(--acc); }
.work-selector button:hover { color:var(--fg); }
.work-enhanced { margin-top:0;position:relative; }.work-enhanced .selected-project { border:0;min-height:390px;margin:0;padding:26px 0 12px;grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr);gap:7%; }
.work-enhanced .project-caption h3 { font-size:32px; }.work-enhanced .project-description { max-width:35ch; }.work-enhanced .project-summary { max-width:43ch; }
.work-enhanced .project-stage { position:relative;background:radial-gradient(ellipse at 50% 57%,#ffffff08,transparent 68%);border:0;overflow:visible;padding:28px 12px 8px;min-height:330px;display:flex;align-items:center; }
.work-enhanced .project-stage>.palco { width:100%; }.work-enhanced .stage-arrow { bottom:0;right:0;top:auto;background:transparent;border:1px solid #ffffff35; }
.work-enhanced .project-stage:hover .stage-arrow { background:var(--acc);border-color:var(--acc);color:var(--bg); }
#product-scene { position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity .25s; }
.has-live-mockup #product-scene { opacity:1; }.has-live-mockup>.palco { opacity:0;pointer-events:none; }
.project-case { text-decoration:none;border-bottom:1px solid #ffffff40;padding:8px 0; }.project-case span { display:inline-block;transition:transform .2s; }.project-case:hover span { transform:translate(3px,-3px); }
.all-work { font-size:18px;margin-top:25px;padding-top:18px;border-top-color:#ffffff16; }.all-work span { font-size:24px; }
.trabalho .cards { display:block;margin-top:24px; }.trabalho .card { display:grid;grid-template-columns:1fr 1.3fr;column-gap:7%;row-gap:8px;padding:24px 0;transition:border-color .2s; }.trabalho .card .card-meta { grid-column:1; }.trabalho .card h3 { grid-column:1;grid-row:2; }.trabalho .card>p:not(.card-meta):not(.card-num) { grid-column:2;grid-row:1/4;align-self:center; }.trabalho .card .card-num { grid-column:1;font-size:13px; }.trabalho .card-ir { display:none; }.trabalho .card:hover { border-color:var(--acc); }.trabalho .card h3::after { content:' ↗';color:var(--acc);font-size:18px;opacity:0;transition:opacity .2s; }.trabalho .card:hover h3::after,.trabalho .card:focus-visible h3::after { opacity:1; }
.ensino { background:#121619; }.ensino-original { border-radius:3px; }.ensino-copy .kicker { margin-bottom:20px; }.ensino .titulo { font-family:Georgia,'Times New Roman',serif;letter-spacing:-.035em;font-weight:400;font-size:44px; }
.teclado { background:#161b21;box-shadow:none;border:1px solid #ffffff15; }.tecla { transition:background .15s,color .15s,box-shadow .15s; }.tecla:active { transform:translateY(2px); }.tecla[aria-pressed=true] { background:#2c2b25; }
@media(min-width:701px) { .work-enhanced .project-stage { height:360px; } }
@media(max-width:700px) {
 .studio-intro { padding-top:98px; }.intro-name { flex-wrap:wrap;gap:6px 12px;font-size:17px; }.intro-name span { font-size:9px;padding-left:12px; }.studio-intro h1 { font-size:clamp(34px,6.2vw,46px);margin:22px 0 18px; }.studio-intro .intro-portrait { transform:none;max-width:none;margin:0; }.studio-intro .intro-portrait::before,.portrait-index { display:none; }.studio-intro .intro-portrait figcaption { transform:none;padding:0; }.studio-intro .intro-now { margin-top:16px; }.intro-now>.kicker { max-width:none; }
 .work-selector { margin-top:24px; }.work-selector button { display:flex;flex-wrap:wrap;gap:8px;padding:14px 10px 17px 0;font-size:14px;align-content:start; }.work-selector button::after { right:10px; }.work-order { display:block;width:100%;font-size:10px;margin:0; }.work-kind,.work-select-arrow { display:none; }
 .work-enhanced .selected-project { grid-template-columns:1fr;gap:8px;padding-top:22px;min-height:0; }.work-enhanced .project-caption h3 { font-size:28px; }.work-enhanced .project-stage { min-height:0;padding:20px 18px 12px;width:min(100%,470px); }.has-live-mockup>.palco { opacity:1;pointer-events:auto; }#product-scene { display:none; }
 .trabalho .card { display:flex;gap:10px; }.ensino .titulo { font-size:36px; }.work-enhanced .project-case { margin-top:12px; }
}
@media(prefers-reduced-motion:reduce) { #product-scene,.work-selector button::after,.work-select-arrow { transition:none; } }
.studio-intro .intro-portrait { margin-bottom:35px; }
.portrait-story { position:relative;display:block;text-decoration:none; }
.portrait-story>span { position:absolute;z-index:2;left:14px;top:14px;background:#090b0ec9;padding:6px 9px;font-size:11px;opacity:0;transition:opacity .2s; }
.portrait-story:hover>span,.portrait-story:focus-visible>span { opacity:1; }
.studio-intro .portrait-class { position:absolute;z-index:3;left:-100px;bottom:-32px;width:190px;background:#191d22;padding:5px;text-decoration:none;transform:rotate(-7deg);box-shadow:0 12px 28px #0006;transition:transform .25s; }
.studio-intro .portrait-class img { border-radius:1px; }.portrait-class>span { display:block;font:9px/1.6 var(--mono);padding:8px 3px 4px;color:#d2d7dd; }.studio-intro .portrait-class:hover,.studio-intro .portrait-class:focus-visible { transform:rotate(-3deg) translateY(-5px); }
.studio-intro .intro-portrait figcaption { padding-left:105px;font-size:10px; }
@media(max-width:900px) and (min-width:701px) { .studio-intro .portrait-class { left:-40px;width:160px; }.studio-intro .intro-portrait figcaption { padding-left:125px; } }
@media(max-width:700px) { .studio-intro .intro-portrait { margin-bottom:0; }.studio-intro .portrait-class { display:none; }.studio-intro .intro-portrait figcaption { padding-left:0;font-size:12px; }.portrait-story>span { display:none; } }
@media(prefers-reduced-motion:reduce) { .studio-intro .portrait-class { transition:none; }.studio-intro .portrait-class:hover { transform:rotate(-7deg); } }
/* Movimento pontual da composição visual, sem deslocar texto. */
.portrait-story { transform:perspective(900px) rotateY(calc(var(--portrait-x,0) * 7deg)) rotateX(calc(var(--portrait-y,0) * -5deg));transition:transform .18s ease-out; }
.studio-intro .portrait-class { translate:calc(var(--portrait-x,0) * -8px) calc(var(--portrait-y,0) * -5px); }
.studio-intro h1 em { font-family:var(--f);font-style:normal;font-weight:450;letter-spacing:-.055em; }
.ensino .titulo { font-family:var(--f);font-weight:500;font-size:clamp(32px,3.5vw,44px); }
.intro-now>.kicker { max-width:16ch; }
@media(prefers-reduced-motion:reduce) { .portrait-story { transform:none;transition:none; }.studio-intro .portrait-class { translate:none; } }
/* Experiência: empresa → papel → entrega, com resultados de clientes separados. */
.experience-intro { color:#b6bdc6;font-size:17px;line-height:1.6;margin-top:14px; }
.experience-group { font-size:16px;font-weight:500;letter-spacing:-.01em;margin:30px 0 16px; }
.experience-companies { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }
.experience-company { display:flex;flex-direction:column;padding:24px;border:1px solid #ffffff18;border-radius:7px;background:#101419; }
.experience-period { color:#aab3c0;font:11px/1.5 var(--mono); }
.experience-company h4 { font-size:25px;line-height:1.2;letter-spacing:-.035em;font-weight:550;margin:18px 0 10px; }
.experience-role { color:var(--acc);font-size:14px;line-height:1.5;min-height:42px; }
.experience-scope { color:#c0c6cf;font-size:15px;line-height:1.6;margin:16px 0 22px; }
.experience-delivery { margin-top:auto;border-top:1px solid var(--line);padding-top:16px; }
.experience-delivery>span { display:block;color:#aab3c0;font-size:11px;margin-bottom:6px; }
.experience-delivery p { font-size:15px;line-height:1.5;color:var(--fg); }
.experience-company>a { margin-top:22px;font-size:13px;text-decoration:none;display:flex;justify-content:space-between;align-items:center;min-height:32px; }
.experience-company>a span,.experience-result>a span { color:var(--acc); }
.experience-company>a:hover,.experience-result>a:hover { color:var(--acc); }
.experience-group-line { display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-top:14px; }
.experience-group-line>p { color:#aab3c0;font-size:12px; }
.experience-result { display:grid;grid-template-columns:210px 1fr auto;align-items:center;gap:32px;padding:26px 0;border-top:1px solid var(--line); }
.experience-metric { display:flex;flex-direction:column;gap:7px; }
.experience-metric strong { font-size:34px;line-height:1.15;color:var(--acc);letter-spacing:-.04em;font-weight:500;white-space:nowrap; }
.experience-metric>span { font-size:13px;line-height:1.5;max-width:23ch;color:#b6bdc6; }
.experience-client { color:#aab3c0;font-size:12px;line-height:1.5;margin-bottom:8px; }
.experience-result h4 { font-size:21px;line-height:1.3;font-weight:500;margin:0 0 8px;letter-spacing:-.02em; }
.experience-result-copy { color:#c0c6cf;font-size:15px;line-height:1.6;max-width:60ch; }
.experience-result>a { font-size:13px;white-space:nowrap;text-underline-offset:6px; }
@media(max-width:900px) { .experience-companies { gap:12px; }.experience-company { padding:18px; }.experience-company h4 { font-size:22px; }.experience-result { grid-template-columns:170px 1fr;gap:22px; }.experience-result>a { grid-column:2;justify-self:start; }.experience-metric strong { font-size:30px; } }
@media(max-width:850px) { .experience-companies { grid-template-columns:1fr;gap:14px; }.experience-company { padding:22px; }.experience-role { min-height:0; }.experience-scope { margin:12px 0 18px; }.experience-group-line { display:block;margin-top:28px; }.experience-group-line .experience-group { margin-bottom:8px; }.experience-group-line>p { margin-bottom:18px; }.experience-result { grid-template-columns:1fr;gap:18px;padding:24px 0; }.experience-result>a { grid-column:1; }.experience-metric { flex-direction:row;align-items:center;gap:18px; }.experience-metric>span { max-width:22ch; } }
@media(min-width:851px) { .experience-delivery { min-height:96px; } }
/* Cases: mesma identidade da home, com síntese e navegação de leitura. */
.case-editorial .case-topo { padding:116px 0 48px; }
.case-editorial .migalha { display:flex;justify-content:space-between;gap:20px;font-size:12px;margin-bottom:42px; }
.case-editorial .migalha a { text-decoration:none; }.case-editorial .migalha a:hover { color:var(--acc); }
.case-opening { display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:9%;align-items:start; }
.case-editorial .titulo-pag { font-size:clamp(35px,4.7vw,60px);line-height:1.08;margin:20px 0;max-width:19ch; }
.case-summary { color:#c0c6cf;font-size:18px;line-height:1.7;max-width:53ch; }
.case-actions { display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:25px;font-size:14px; }.case-topo .case-actions .btn { margin:0; }.case-actions>a:not(.btn) { text-underline-offset:6px; }
.case-facts { border-left:1px solid var(--line);padding-left:28px;display:grid;gap:20px;margin-top:7px; }.case-facts dt { font-size:11px;letter-spacing:.04em;color:#9da8b7;margin-bottom:5px; }.case-facts dd { font-size:15px;line-height:1.55; }
.case-results { padding:30px 0 38px;background:#101419;border-block:1px solid var(--line); }
.case-results h2 { font-size:13px;font-weight:500;color:#b5bdc8;margin:0 0 22px; }
.case-editorial .metricas { grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:22px; }
.case-editorial .metricas>div { border:0;border-left:1px solid #ffffff18;padding:0 0 0 20px;background:none;border-radius:0; }.case-editorial .metricas>div:first-child { border:0;padding-left:0; }
.case-editorial .metricas dt { font-size:clamp(28px,3vw,38px);font-weight:500;color:var(--acc);line-height:1.2; }.case-editorial .metricas dd { font-size:14px;line-height:1.5;max-width:26ch;margin-top:9px; }
.case-reading { display:grid;grid-template-columns:210px minmax(0,1fr);gap:7%;padding-top:50px;padding-bottom:50px; }
.case-index { align-self:start;position:sticky;top:105px; }.case-index>p { font-size:11px;color:#99a5b5;margin-bottom:16px; }.case-index nav { display:grid;gap:3px; }.case-index a { display:flex;gap:12px;font-size:13px;line-height:1.4;padding:11px 0;text-decoration:none;color:#aeb7c4;border-bottom:1px solid #ffffff0b; }.case-index a span { color:#697586;font:10px/1.8 var(--mono); }.case-index a:hover,.case-index a[aria-current] { color:var(--acc); }.case-index a[aria-current] span { color:var(--acc); }
.case-section { padding:28px 0 36px;border-bottom:1px solid var(--line);scroll-margin-top:95px; }.case-section:first-child { padding-top:0; }.case-section-heading { display:flex;gap:15px;align-items:baseline;margin-bottom:18px; }.case-section-heading>span { font:11px var(--mono);color:var(--acc); }.case-section h2 { font-size:27px;line-height:1.25;font-weight:500;letter-spacing:-.03em; }.case-section>p { font-size:17px;line-height:1.8;color:#bec6d0;max-width:68ch; }
.case-flow { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }.case-flow li { padding:21px;background:#101419;border:1px solid #ffffff12;border-radius:6px; }.case-step { display:block;color:var(--acc);font:11px var(--mono);margin-bottom:16px; }.case-flow b { display:block;font-size:18px;font-weight:500; }.case-flow p { margin-top:7px;font-size:15px;color:#b4becb;line-height:1.6; }
.case-decisions li { padding:20px 0;border-top:1px solid var(--line); }.case-decisions li:first-child { padding-top:0;border:0; }.case-decisions h3 { font-size:19px;font-weight:500;margin:0 0 9px;line-height:1.4; }.case-decisions p { font-size:16px;line-height:1.7;color:#b4becb; }.case-highlights li { padding:15px 0 15px 20px;border-top:1px solid var(--line);font-size:16px;line-height:1.7;color:#bec6d0;position:relative; }.case-highlights li::before { content:'↗';position:absolute;left:0;color:var(--acc); }
.case-section .chips { gap:8px; }.case-section .chips li { font-size:13px;padding:8px 12px;border-radius:4px; }.case-section .provas a { font-size:16px;font-weight:400; }
.case-editorial .case-img { max-width:960px;padding-block:10px 38px; }.case-editorial .case-nav { border-top:1px solid var(--line);padding-top:28px;padding-bottom:45px;font-size:12px; }.case-editorial .case-nav b { font-size:17px;line-height:1.4;max-width:34ch; }
@media(max-width:850px) { .case-opening { grid-template-columns:1fr;gap:30px; }.case-facts { grid-template-columns:1fr 1fr;border-left:0;border-top:1px solid var(--line);padding:24px 0 0; }.case-reading { grid-template-columns:1fr;gap:25px; }.case-index { position:static; }.case-index nav { display:flex;flex-wrap:wrap;gap:8px 22px; }.case-index a { border:0;padding:7px 0; }.case-editorial .metricas { grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px; }.case-editorial .metricas>div:nth-child(odd) { border:0;padding-left:0; } }
@media(max-width:480px) { .case-editorial .case-topo { padding-top:94px;padding-bottom:30px; }.case-editorial .migalha { margin-bottom:28px;font-size:11px; }.case-editorial .titulo-pag { font-size:36px; }.case-summary { font-size:16px; }.case-facts { grid-template-columns:1fr;gap:16px; }.case-facts dt { margin-bottom:3px; }.case-reading { padding-top:30px; }.case-section h2 { font-size:24px; }.case-section>p { font-size:16px; }.case-flow { grid-template-columns:1fr; }.case-editorial .metricas dt { font-size:27px; }.case-editorial .metricas dd { font-size:13px; }.case-results { padding:25px 0; }.case-actions { gap:18px; } }

/* ---------- Movimento com intenção (18/09/2026): revelação curta ao entrar na tela, profundidade só nas imagens,
   texto parado durante a leitura. Tudo desliga com prefers-reduced-motion. */
html { scroll-behavior:smooth; }
main { position:relative; z-index:1; }
.ambiente { position:fixed; inset:0; z-index:0; width:100%; height:100%; pointer-events:none; opacity:0; transition:opacity 1.6s ease; }
.ambiente[data-pronto] { opacity:.85; }
.js [data-revelar] { opacity:0; transform:translateY(18px); transition:opacity .8s var(--ease),transform .8s var(--ease); transition-delay:calc(var(--i,0) * 90ms); }
.js [data-revelar].visto { opacity:1; transform:none; }
.btn { transition:transform .25s var(--ease),background .2s,box-shadow .2s; }.btn:hover { transform:translateY(-2px); }
.experience-company { transition:transform .4s var(--ease),border-color .4s,background .4s; }
.experience-company:hover { transform:translateY(-4px); border-color:#e8b04a55; background:#12171e; }
.experience-result h4,.linha h3,.traj h3 { transition:color .25s; }.experience-result:hover h4 { color:var(--acc); }
.linha { transition:transform .35s var(--ease); }.linha:hover { transform:translateX(6px); }
.pilar { transition:transform .35s var(--ease),border-color .35s; }.pilar:hover { transform:translateY(-3px); border-color:#e8b04a45; }
.teclado { transform:perspective(1400px) rotateX(0deg); transition:transform 1s var(--ease); }.js .teclado:not(.visto) { transform:perspective(1400px) rotateX(16deg) translateY(24px); }
.tecla { transition:transform .12s var(--ease),background .15s,color .15s,box-shadow .15s; }.tecla:hover { transform:translateY(-1px); }.tecla:active,.tecla[aria-pressed=true] { transform:translateY(2px); }
.tecla-painel.troca>* { animation:troca .35s var(--ease); }
.atos li::after { transition:transform 1.1s var(--ease); }.atos li.visto::after { transform:none; }
.stage-arrow { transition:background .25s,color .25s,transform .35s var(--ease); }.project-stage:hover .stage-arrow { transform:rotate(45deg); }
.project-stage { overflow:clip; }
.work-enhanced .project-stage { overflow:visible; }
.case-flow li,.passos li { transition:border-color .3s,background .3s; }.case-flow li:hover { border-color:#e8b04a45; background:#12171e; }
.pagina-topo { padding:clamp(118px,14vw,168px) 0 clamp(36px,5vw,56px); }
/* Os três atos da home carregam os registros da história. */
.ato-foto { position:relative; margin:0 0 22px; aspect-ratio:4/3; overflow:clip; border-radius:5px; border:1px solid #ffffff1a; background:#11151c; }
.ato-foto img { width:100%; height:100%; object-fit:cover; object-position:50% 20%; transition:transform 1s var(--ease); }
.atos li:hover .ato-foto img { transform:scale(1.04); }
/* Profundidade dirigida pela rolagem, sem JavaScript, onde o navegador suporta. */
@supports (animation-timeline: view()) {
  .cap-foto>img { animation:deslize linear both; animation-timeline:view(); animation-range:entry 0% exit 100%; }
  @keyframes deslize { from { transform:translateY(-5%) scale(1.12); } to { transform:translateY(5%) scale(1.12); } }
  .palco .note { animation:endireita linear both; animation-timeline:view(); animation-range:entry 0% entry 90%; }
  @keyframes endireita { from { transform:rotateX(20deg) scale(.95); opacity:.55; } to { transform:none; opacity:1; } }
  .palco .fone { animation:sobe linear both; animation-timeline:view(); animation-range:entry 0% entry 90%; }
  @keyframes sobe { from { transform:translateY(48px); opacity:.55; } to { transform:none; opacity:1; } }
  .has-live-mockup .palco .note,.has-live-mockup .palco .fone { animation:none; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }.ambiente { display:none; }
  .js [data-revelar] { opacity:1; transform:none; transition:none; }.js .teclado:not(.visto) { transform:none; }
  .cap-foto>img,.palco .note,.palco .fone { animation:none; }
  .btn:hover,.experience-company:hover,.linha:hover,.pilar:hover,.tecla:hover,.atos li:hover .ato-foto img { transform:none; }
}

/* ---------- História (18/09/2026): um registro por capítulo, texto e imagem em colunas alternadas. */
.hist-topo .sub { max-width:52ch; }
.hist-indice { display:flex; flex-wrap:wrap; gap:6px 24px; margin-top:34px; padding-top:22px; border-top:1px solid var(--line); }
.hist-indice a { display:flex; gap:10px; align-items:baseline; padding:6px 0; font-size:13px; color:#aeb5bf; text-decoration:none; transition:color .2s; }
.hist-indice a span { font:10px var(--mono); color:var(--acc); letter-spacing:.1em; }.hist-indice a:hover { color:var(--fg); }
.cap { min-height:auto; overflow:clip; border-top:1px solid var(--line); }
.cap-in { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,420px); gap:40px clamp(40px,7vw,110px); align-items:center; padding:clamp(64px,9vh,104px) var(--pad); }
.cap-in.cap-inv { grid-template-columns:minmax(280px,420px) minmax(0,1fr); }.cap-inv .cap-copy { order:2; }
.cap-in.cap-larga { grid-template-columns:minmax(0,1fr) minmax(320px,580px); }.cap-in.cap-larga.cap-inv { grid-template-columns:minmax(320px,580px) minmax(0,1fr); }
.cap-n { position:absolute; top:50%; left:calc(var(--pad) - .06em); right:auto; transform:translateY(-50%); font-size:clamp(150px,22vw,300px); font-weight:700; letter-spacing:-.06em; color:transparent; -webkit-text-stroke:1px #ffffff17; z-index:0; }
.cap-inv .cap-n { left:auto; right:calc(var(--pad) - .06em); }
.cap-copy { position:relative; z-index:1; max-width:560px; }
.cap-copy .kicker { display:flex; gap:12px; align-items:center; }.cap-copy .kicker::before { content:''; width:26px; height:1px; background:var(--acc); }
.cap-tit { font-size:clamp(32px,4vw,54px); font-weight:500; letter-spacing:-.04em; line-height:1.06; margin-top:18px; max-width:16ch; }
.cap-txt { font-size:clamp(17px,1.4vw,19px); line-height:1.72; color:#c4c9d0; max-width:52ch; margin-top:22px; }
.cap-media { position:relative; z-index:1; margin:0; }.cap-fotos { position:relative; }
.cap-foto { position:relative; overflow:clip; aspect-ratio:4/5; border-radius:6px; background:#11151c; border:1px solid #ffffff1f; box-shadow:0 50px 90px -50px #000d; }
.cap-foto::after { content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(205deg,#e8b04a1c,transparent 38%),linear-gradient(0deg,#090b0e55,transparent 35%); pointer-events:none; }
.cap-foto>img { width:100%; height:100%; object-fit:cover; display:block; }
.cap-larga .cap-foto { aspect-ratio:16/10; }
.cap-foto-2 { position:absolute; z-index:2; width:54%; aspect-ratio:4/3; right:-11%; bottom:6%; padding:5px; background:#191d22; border:0; border-radius:3px; box-shadow:0 22px 44px #0009; transform:rotate(4deg); transition:transform .4s var(--ease); }
.cap-foto-2::after { display:none; }.cap-foto-2>img { border-radius:1px; }
.cap-inv .cap-foto-2 { right:auto; left:-11%; transform:rotate(-4deg); }
.cap-media:hover .cap-foto-2 { transform:rotate(1deg) translateY(-6px); }
.cap-media figcaption { display:flex; gap:14px; align-items:baseline; margin-top:14px; font-size:12.5px; line-height:1.55; color:#9aa2ad; max-width:46ch; }
.cap-idx { flex:none; font:10px var(--mono); color:var(--acc); letter-spacing:.14em; }
/* Cena em Three.js no lugar da foto: o fundo técnico já fica de pé sem WebGL e o canvas entra por cima. */
.cap-cena,.ato-cena { position:relative; background:#0d1117 radial-gradient(120% 92% at 50% 10%,#ffffff0b,transparent 62%); }
.cap-cena::before,.ato-cena::before { content:''; position:absolute; inset:0; opacity:.55; background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px); background-size:34px 34px; }
.cap-cena>canvas,.ato-cena>canvas { position:relative; display:block; width:100%; height:100%; opacity:0; transition:opacity .8s var(--ease); }
.cap-cena>canvas[data-pronto],.ato-cena>canvas[data-pronto] { opacity:1; }
.hist-nav { right:14px; }
@media(max-width:900px) {
  .cap-in,.cap-in.cap-inv,.cap-in.cap-larga,.cap-in.cap-larga.cap-inv { grid-template-columns:1fr; gap:28px; padding-block:60px; }
  .cap-inv .cap-copy { order:0; }.cap-media { order:-1; max-width:440px; }.cap-larga .cap-media { max-width:none; }
  .cap-n,.cap-inv .cap-n { display:none; }
  .cap-foto-2,.cap-inv .cap-foto-2 { width:46%; right:-4%; left:auto; bottom:6%; transform:rotate(3deg); }
  .cap-tit { font-size:clamp(30px,7vw,40px); }.cap-txt { font-size:17px; }
  .hist-indice { gap:2px 18px; margin-top:26px; }.hist-indice a { font-size:12px; }
}
@media(max-width:480px) { .cap-in { padding-block:46px; }.cap-media figcaption { font-size:12px; }.ato-foto { aspect-ratio:3/2; } }

/* ---------- Revisão de venda (18/09/2026): o que sobrou é o que convence; movimento onde a leitura ganha. */
.js body { animation:surgir .7s ease both; }@keyframes surgir { from { opacity:0; } }
.progresso { position:fixed; top:0; left:0; z-index:60; width:100%; height:2px; background:var(--acc); transform:scaleX(0); transform-origin:left; pointer-events:none; }
@supports (animation-timeline: scroll()) { .progresso { animation:progredir linear both; animation-timeline:scroll(root); } }
@keyframes progredir { from { transform:scaleX(0); } to { transform:scaleX(1); } }
.js [data-revelar="blur"] { filter:blur(10px); transform:translateY(14px); transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease); }
.js [data-revelar="blur"].visto { filter:blur(0); }
.menu a { position:relative; }.menu a::after { content:''; position:absolute; left:0; right:0; bottom:-5px; height:1px; background:var(--acc); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease); }
.menu a:hover::after,.menu a[aria-current]::after { transform:scaleX(1); }
.brilho { position:relative; overflow:clip; }
.brilho::before { content:''; position:absolute; inset:0; z-index:0; background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),#e8b04a1a,transparent 45%); opacity:0; transition:opacity .4s; pointer-events:none; }
.brilho:hover::before { opacity:1; }.brilho>* { position:relative; z-index:1; }
[data-contar] { font-variant-numeric:tabular-nums; }
/* Números que vendem, na abertura. */
.intro-numeros { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); }
.intro-numeros li { border-left:1px solid var(--line); padding:24px 18px 26px 24px; }.intro-numeros li:first-child { border-left:0; padding-left:0; }
.intro-numeros a { display:grid; gap:10px; text-decoration:none; }
.intro-numeros b { font-size:clamp(28px,2.7vw,40px); font-weight:500; letter-spacing:-.045em; line-height:1; color:var(--acc); white-space:nowrap; }
.intro-numeros span { font-size:13px; line-height:1.5; color:#aeb5bf; max-width:26ch; transition:color .2s; }.intro-numeros a:hover span { color:var(--fg); }
.studio-intro .intro-now { padding-bottom:26px; }
/* Processo: diagrama real ao lado do título, sem controle de abrir e fechar. */
.processo-cabeca { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,540px); gap:36px 7%; align-items:center; }
.processo-visual { margin:0; }.processo-visual a { display:block; overflow:clip; border-radius:6px; border:1px solid #ffffff1a; background:#101318; }
.processo-visual img { border:0; border-radius:0; box-shadow:none; filter:saturate(.72) contrast(1.02); transition:filter .5s,transform .8s var(--ease); }
.processo-visual a:hover img { filter:saturate(1); transform:scale(1.02); }
.processo-visual figcaption { font-size:12.5px; line-height:1.55; color:#9aa2ad; margin-top:12px; }
.passos { margin-top:44px; }
/* Selo de gravação no frame da aula. */
.ensino-frame { position:relative; }
.rec { position:absolute; z-index:2; top:14px; left:14px; display:flex; gap:8px; align-items:center; padding:6px 9px; border-radius:3px; font:10px var(--mono); letter-spacing:.16em; color:var(--fg); background:#090b0eb0; backdrop-filter:blur(8px); }
.rec i { width:7px; height:7px; border-radius:50%; background:var(--acc); animation:pulsar 1.5s ease-in-out infinite; }@keyframes pulsar { 50% { opacity:.2; } }
.ensino-frame .ensino-original { transition:transform .8s var(--ease); }.ensino-frame:hover .ensino-original { transform:scale(1.015); }
@media(max-width:900px) { .intro-numeros { grid-template-columns:1fr 1fr; }.intro-numeros li { padding:18px 14px 20px 18px; }.intro-numeros li:nth-child(odd) { border-left:0; padding-left:0; }.intro-numeros li:nth-child(n+3) { border-top:1px solid var(--line); }.processo-cabeca { grid-template-columns:1fr; } }
@media(max-width:480px) { .intro-numeros { grid-template-columns:1fr; }.intro-numeros li,.intro-numeros li:nth-child(odd) { border-left:0; padding:14px 0; border-top:1px solid var(--line); }.intro-numeros li:first-child { border-top:0; }.intro-numeros b { font-size:30px; } }
@media(prefers-reduced-motion:reduce) { .js body { animation:none; }.progresso { display:none; }.js [data-revelar="blur"] { filter:none; }.rec i { animation:none; }.brilho::before { display:none; }.processo-visual a:hover img,.ensino-frame:hover .ensino-original { transform:none; } }
