/* UHXI_lab · index.html — estilos da página.
   Gerado a partir de UHXI-publicar/deploy/index.html (26/10/2026). Depende de ../tokens.css (carregado antes).
   Secção «Estilos inline extraídos»: classes s-index-N substituem os antigos atributos style="" (especificidade reforçada com :not(#\#)×3 para manter a precedência do inline; JS que escreve element.style continua a vencer). */
/* UHXI_lab · Proposta visual — sítio principal (hub) — CSS original do ficheiro Uhxilab_NEW_index.html.
   Mantido em folha de estilo por depender de temas via CSS vars (dark/light/hc), media queries,
   pseudo-elementos e keyframes que não são exprimíveis inline. */
:root{ --grey:var(--c-5f6b6a); --brand:var(--c-f85400); /* laranja do logótipo */
  --ok:var(--c-57b98c); --err:var(--c-e08a7a); --nav-h:76px; --fig-a:var(--c-0a1414); --fig-b:var(--c-9fe8dd); }

/* html[data-hc="1"]: tokens do tema → tokens.css */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0}
body{ background:var(--ink); color:var(--tx); font-family:var(--font-body); font-size:calc(16px * var(--fs-scale, 1)); line-height:1.65; overflow-x:clip; -webkit-font-smoothing:antialiased; }
@media (max-width:680px){ body{font-size:calc(18px * var(--fs-scale, 1))} } /* leitura maior no mobile */
::selection{background:var(--acc); color:var(--ink)}
img,svg{max-width:100%; display:block}
a{color:var(--acc); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
:focus-visible{outline:2px solid var(--acc); outline-offset:3px; border-radius:var(--r-2)}
.skip{position:absolute; left:-9999px; top:0; background:var(--acc); color:var(--ink); padding:var(--sp-10) var(--sp-16); z-index:200; font-weight:600}
.skip:focus{left:12px; top:12px}
.wrap{width:min(1180px, 100% - 40px); margin-inline:auto}
@media (max-width:480px){ .wrap{width:calc(100% - 32px)} }
.mono{font-family:var(--font-mono)}
.eyebrow{ font-family:var(--font-mono); font-size:var(--fs-r072); letter-spacing:.22em; text-transform:uppercase; color:var(--mut); display:flex; align-items:center; gap:var(--sp-14); margin:0 0 var(--sp-26); }
.eyebrow::before{content:""; width:34px; height:1px; background:var(--acc); flex:none}
.hero .eyebrow{white-space:nowrap}
@media (max-width:700px){ .hero .eyebrow{white-space:normal} }
h1,h2,h3{font-family:var(--font-display); font-weight:700; line-height:1.04; letter-spacing:-.02em; margin:0}
h2{font-size:clamp(1.9rem, 4.4vw, 3.4rem); margin-bottom:var(--sp-22)}
h3{font-size:var(--fs-r112); letter-spacing:0; line-height:1.3}
p{margin:0 0 1em; max-width:62ch}
.lead{font-size:clamp(1.02rem, 1.6vw, 1.2rem); color:var(--mut)}
#principio .lead, #idi .lead, #conformidade .lead, #tecnologias .lead{max-width:none} /* introduções à largura do layout */
.stroke{color:transparent; -webkit-text-stroke:1.6px var(--acc)}
@supports not (-webkit-text-stroke:1px black){ .stroke{color:var(--acc)} }
html[data-hc="1"] .stroke{color:var(--acc); -webkit-text-stroke:0}
.enav{ position:fixed; inset:0 0 auto 0; height:var(--nav-h); z-index:60; display:flex; align-items:center; background:var(--ink); border-bottom:1px solid var(--line); }
.enav .wrap{display:flex; align-items:center; gap:var(--sp-22)}
.enav{transition:height .3s ease}
.enav .brand span, .enav .tbrand span{max-height:3em; transition:opacity .2s ease, max-height .3s ease}
.enav .brand, .enav .tbrand{transition:gap .3s ease, margin .3s ease}
html.scrolled .enav{height:52px} /* ao descer: cabeçalho compacto */
html.scrolled .enav .brand span, html.scrolled .enav .tbrand span{opacity:0; max-height:0; overflow:hidden; pointer-events:none}
html.scrolled .enav .brand, html.scrolled .enav .tbrand{gap:0}
html.scrolled .enav .brand{margin-top:var(--sp-4)}
@media (max-width:680px){ html.scrolled .enav{height:3.6rem} html.scrolled .enav nav{top:3.6rem} }
.brand{display:flex; flex-direction:column; gap:8pt; color:var(--tx); line-height:1}
.brand b{font-family:var(--font-display); font-size:var(--fs-r156); letter-spacing:.01em}
.brand{flex:none}
.brand span{font-family:var(--font-mono); font-size:var(--fs-r073); letter-spacing:.14em; text-transform:uppercase; color:var(--mut); white-space:nowrap}
.brand:hover{text-decoration:none}
.enav .brand{margin-top:var(--sp-10)}
.enav nav{display:flex; gap:clamp(6px, 1.6vw, 22px); margin-inline:auto; flex-wrap:nowrap; align-items:center}
.enav nav a{ color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r083); letter-spacing:.1em; text-transform:uppercase; font-weight:400; white-space:nowrap; position:relative; padding:var(--sp-8) var(--sp-4); transition:color .2s ease; animation:navin .55s cubic-bezier(.2,.7,.2,1) backwards; }
.enav nav a:nth-child(1){animation-delay:.05s}.enav nav a:nth-child(2){animation-delay:.12s}.enav nav a:nth-child(3){animation-delay:.19s}.enav nav a:nth-child(4){animation-delay:.26s}.enav nav a:nth-child(5){animation-delay:.33s}.enav nav a:nth-child(6){animation-delay:.4s}
@keyframes navin{from{opacity:0; transform:translateY(-12px)}}
.enav nav a .nidx{font-family:var(--font-mono); font-size:var(--fs-r067); letter-spacing:.08em; color:var(--acc); vertical-align:super; margin-right:var(--sp-5); opacity:.85; transition:opacity .2s}
.enav nav a::after{content:""; position:absolute; left:4px; right:100%; bottom:2px; height:2px; background:var(--acc); transition:right .28s cubic-bezier(.2,.7,.2,1)}
.enav nav a:hover{color:var(--tx); text-decoration:none}
.enav nav a:hover::after{right:4px}
.enav nav a:hover .nidx{opacity:1}
.ntip{ position:absolute; top:calc(100% + 12px); left:50%; transform:translate(-50%, -6px); opacity:0; pointer-events:none; font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.14em; text-transform:uppercase; font-weight:400; color:var(--mut); background:color-mix(in srgb, var(--ink2) 94%, transparent); border:1px solid var(--line2); border-radius:var(--r-4); padding:var(--sp-6) var(--sp-10); white-space:nowrap; transition:opacity .22s ease, transform .22s ease; z-index:81; }
.ntip::before{content:""; position:absolute; top:-4px; left:50%; width:7px; height:7px; transform:translateX(-50%) rotate(45deg); background:var(--ink2); border-left:1px solid var(--line2); border-top:1px solid var(--line2)}
.ntip::after{content:""; position:absolute; top:-1px; left:-1px; width:8px; height:8px; border-left:1.5px solid var(--acc); border-top:1.5px solid var(--acc)}
.enav nav a:hover .ntip, .enav nav a:focus-visible .ntip{opacity:1; transform:translate(-50%, 0)}
.enav nav a:first-child .ntip{left:4px; transform:translate(0, -6px)}
.enav nav a:first-child:hover .ntip, .enav nav a:first-child:focus-visible .ntip{transform:translate(0, 0)}
.enav nav a:first-child .ntip::before{left:22px}
.enav nav a:last-child .ntip{left:auto; right:4px; transform:translate(0, -6px)}
.enav nav a:last-child:hover .ntip, .enav nav a:last-child:focus-visible .ntip{transform:translate(0, 0)}
.enav nav a:last-child .ntip::before{left:auto; right:22px}
@media (prefers-reduced-motion:reduce){ .enav nav a{animation:none} .ntip{transition:none} }
.langdd{position:relative; flex:none}
.enav .wrap{align-items:flex-start}
.enav nav{flex:none; margin-left:auto; margin-right:0; margin-top:0}
.langdd{ position:absolute; right:max(20px, calc((100% - 1180px) / 2)); bottom:0; transform:translateY(50%); margin:0; }
.storefly{ position:absolute; right:calc(max(20px, (100% - 1180px) / 2) + 5.5rem); bottom:0; transform:translateY(50%); display:inline-flex; align-items:center; gap:var(--sp-10); font-family:var(--font-mono); font-size:var(--fs-r088); letter-spacing:.14em; text-transform:uppercase; background:linear-gradient(var(--ink), var(--ink)) center / calc(100% - 34px) 3px no-repeat, color-mix(in srgb, var(--ink) 42%, transparent); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); color:var(--tx); border-radius:var(--r-pill); padding:var(--sp-6) var(--sp-14); min-height:30px; font-weight:700; z-index:61; }
.storefly::before{content:""; width:7px; height:7px; border-radius:var(--r-round); background:var(--acc2); flex:none}
.storefly:hover{color:var(--acc); text-decoration:none}
.langbtn{ display:inline-flex; align-items:center; gap:var(--sp-10); font-family:var(--font-mono); font-size:var(--fs-r088); letter-spacing:.14em; text-transform:uppercase; background:linear-gradient(var(--ink), var(--ink)) center / calc(100% - 34px) 3px no-repeat, color-mix(in srgb, var(--ink) 42%, transparent); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); color:var(--tx); border:0; border-radius:var(--r-pill); padding:var(--sp-6) var(--sp-14); min-height:30px; cursor:pointer; font-weight:700; transition:color .2s ease; }
.langbtn::before{content:""; width:7px; height:7px; border-radius:var(--r-round); background:var(--acc); flex:none}
.langbtn .lcar{display:none}
.langdd:hover .langbtn, .langdd:focus-within .langbtn{color:var(--acc)}
.langmenu{ position:absolute; top:100%; right:0; padding-top:var(--sp-8); opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .22s ease, transform .22s ease, visibility .22s; z-index:80; }
.langdd:hover .langmenu, .langdd:focus-within .langmenu{opacity:1; visibility:visible; transform:none}
.langmenu>div{ display:grid; gap:0; width:max-content; margin-left:auto; background:color-mix(in srgb, var(--ink2) 92%, transparent); backdrop-filter:blur(10px); border:0; border-radius:var(--r-8); padding:var(--sp-2); box-shadow:var(--sh-1); }
.langmenu button{ display:flex; align-items:center; justify-content:flex-end; gap:var(--sp-10); background:none; border:0; border-radius:var(--r-6); color:var(--mut); padding:var(--sp-6) var(--sp-10); min-height:32px; cursor:pointer; text-align:right; }
.langmenu button i{font-style:normal; font-family:var(--font-body-alt); font-size:var(--fs-r106)}
.langmenu button:hover{background:var(--acc); color:var(--ink)}
@media (max-width:1460px){ .enav nav a.np3{display:none} }
@media (max-width:1200px){ .enav nav a.np2{display:none} }
@media (min-width:681px) and (max-width:980px){ .enav nav a{font-size:var(--fs-r074); letter-spacing:.08em} } /* entre tablet e mobile o menu compacta para caber */
@media (min-width:681px) and (max-width:900px){ .enav nav a.np1{display:none} } /* abaixo de 800px só fica o essencial até o menu mobile entrar */
/* com aumento de leitura, o menu de secções liberta espaço mais cedo para caber no layout */
@media (max-width:1600px){ html[data-fs="1"] .enav nav a.np3{display:none} }
@media (max-width:1320px){ html[data-fs="1"] .enav nav a.np2{display:none} }
@media (max-width:1740px){ html[data-fs="2"] .enav nav a.np3{display:none} }
@media (max-width:1430px){ html[data-fs="2"] .enav nav a.np2{display:none} }
.menubtn{display:none; flex-direction:column; justify-content:center; gap:var(--sp-4); margin-left:auto; margin-top:var(--sp-14); width:42px; height:38px; padding:var(--sp-9) var(--sp-10); background:none; border:1px solid var(--line2); border-radius:var(--r-8); cursor:pointer; flex:none}
.menubtn i{display:block; height:2px; background:var(--tx); border-radius:var(--r-2); transition:transform .22s ease, opacity .22s ease}
.menubtn[aria-expanded="true"] i:nth-child(1){transform:translateY(.54rem) rotate(45deg)}
.menubtn[aria-expanded="true"] i:nth-child(2){opacity:0}
.menubtn[aria-expanded="true"] i:nth-child(3){transform:translateY(-.54rem) rotate(-45deg)}
@media (max-width:680px){
  :root{--nav-h:6.2rem} /* cabeçalho mobile acompanha o tamanho de leitura */
  .enav{align-items:flex-start; padding-top:var(--sp-12)} /* respiro entre o topo e o conteúdo */
  .ntip{display:none}
  .menubtn{display:inline-flex; margin-top:0; margin-right:15pt; border:0; border-radius:0; padding:var(--sp-5) 4pt 0 var(--sp-10); justify-content:flex-start; gap:.4rem; width:3rem; height:2.6rem} /* a 15pt do limite direito */
  .menubtn i{height:.14rem}
  .enav .brand{margin-top:0; flex:1 1 auto; min-width:0} /* a marca encolhe; o botão mantém a distância à direita */
  .enav .brand b{font-size:var(--fs-r178)} /* UHXI_lab maior no mobile */
  .enav .brand span{white-space:normal; max-width:none; line-height:1.4; font-size:var(--fs-r109)} /* slogan em duas linhas, maior */
  .storefly, .langbtn{font-size:var(--fs-r101)} /* pills loja + idioma maiores */
  .storefly{right:calc(max(20px, (100% - 1180px) / 2) + 6.5rem)}
  .langmenu button i{font-size:var(--fs-r120)}
  .enav nav{position:fixed; top:var(--nav-h); left:0; right:0; margin:0; flex-direction:column; align-items:stretch; gap:0; padding:var(--sp-6) 0 var(--sp-10); background:var(--ink); border-bottom:1px solid var(--line); opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity .22s ease, transform .22s ease, visibility .22s}
  .enav nav.open{opacity:1; visibility:visible; transform:none}
  .enav nav a, .enav nav a.np1, .enav nav a.np2, .enav nav a.np3{display:flex; align-items:baseline; gap:var(--sp-2); padding:var(--sp-14) var(--sp-24); font-size:var(--fs-r105); color:var(--tx); font-weight:700; animation:none}
  .enav nav a .nidx{font-size:var(--fs-r091)}
  .enav nav a::after{display:none}
  footer .cols .brand span{white-space:normal; line-height:1.5}
}
@media (max-width:374px){ .enav .brand span{font-size:var(--fs-r072)} } /* ecrãs muito estreitos: slogan cabe na mesma */
html{scroll-padding-top:calc(var(--nav-h) - 36px)} /* âncoras param bem juntas ao cabeçalho */
html,body{overflow-x:clip} /* nenhuma secção pode alargar a página (evita «zoom» no mobile com leitura ampliada) */
.hero{ position:relative; min-height:auto; display:flex; align-items:flex-start; padding-top:calc(var(--nav-h) + 28px); padding-bottom:104px; overflow:clip; isolation:isolate; }
.aurora{position:absolute; inset:-20%; z-index:-2; filter:blur(70px); opacity:.5; pointer-events:none}
.aurora i{position:absolute; border-radius:var(--r-round)}
.aurora i:nth-child(1){width:52vw;height:52vw;left:46%;top:-6%;background:radial-gradient(circle at 40% 40%, var(--acc), transparent 62%); animation:drift 26s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:44vw;height:44vw;left:60%;top:38%;background:radial-gradient(circle at 60% 40%, var(--acc2), transparent 60%); animation:drift 32s ease-in-out infinite alternate-reverse}
@keyframes drift{from{transform:translate(0,0) scale(1)} to{transform:translate(-9%,7%) scale(1.12)}}
html[data-theme="light"] .aurora{opacity:.34}
.hero .wrap{display:grid; grid-template-columns:minmax(0,6fr) minmax(0,6fr); gap:var(--sp-40); align-items:center}
.hero h1{font-size:clamp(2.7rem, 7.6vw, 6.4rem)}
.hero .lead{margin-top:var(--sp-26); max-width:46ch}
.sig{font-family:var(--font-mono); font-size:calc(.95rem + 2pt); color:var(--acc2); letter-spacing:.08em; margin-top:var(--sp-18)}
.ctas{display:flex; flex-wrap:wrap; gap:var(--sp-14); margin-top:var(--sp-36)}
.btn{ display:inline-flex; align-items:center; gap:var(--sp-10); min-height:48px; padding:var(--sp-12) var(--sp-24); border-radius:var(--r-pill); font-weight:600; font-size:var(--fs-r094); cursor:pointer; border:1px solid var(--acc); transition:transform .18s ease, background .18s ease; }
.btn:hover{text-decoration:none; transform:translateY(-2px)}
.btn-solid{background:var(--acc); color:var(--ink)}
.btn-ghost{background:transparent; color:var(--tx)}
.btn-ghost:hover{background:color-mix(in srgb, var(--acc) 14%, transparent)}
.btn .ar{font-family:var(--font-mono)}
.lens{position:relative; max-width:none; width:100%; justify-self:end; align-self:start; margin-top:var(--sp-28); display:flex; flex-direction:column; align-items:flex-end; gap:var(--sp-12)}
@media (min-width:901px){ .lens{width:calc(100% + 96px)} } /* ancorado à direita, cresce para a esquerda */
.lens .stage{position:relative; aspect-ratio:16/10; width:100%}
.lens svg{height:100%; width:auto; display:block; margin:auto}
.storefly .soon{position:absolute; left:50%; top:calc(100% + 8px); transform:translate(-50%, -4px); white-space:nowrap; padding:var(--sp-4) var(--sp-9); background:var(--ink); border:1px solid color-mix(in srgb, var(--acc) 55%, var(--line)); border-radius:var(--r-3); font-family:var(--font-mono); font-size:var(--fs-r058); letter-spacing:.14em; text-transform:uppercase; color:var(--acc); opacity:0; pointer-events:none; transition:opacity .25s, transform .25s; z-index:5}
.storefly:hover .soon, .storefly:focus-visible .soon{opacity:1; transform:translate(-50%, 0)} /* mensagem só ao passar o rato */
.lens .cta, .lens .cap{font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.16em; text-transform:uppercase; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.lens .cta{color:var(--brand); opacity:0; margin-top:var(--sp-15); margin-bottom:-9px; transition:opacity .5s ease}
.lens .cta[data-on="true"]{opacity:.72; transition-duration:1.8s} /* surge devagar, só depois do esboço */
.lens .cap{color:var(--tx); min-height:1.6em}
.lens .lensfb{position:absolute; inset:0; transition:opacity .9s ease}
.lens[data-ready="1"] .lensfb{opacity:0}
.lens uhxi-hero-reveal{z-index:0}
.lens .hcp{background:transparent; filter:drop-shadow(0 30px 40px var(--c-rgba-0-0-0-35))}
html:not([data-theme="light"]) .lens .hcp{filter:drop-shadow(0 0 40px var(--c-rgba-31-184-172-10))}
.lens uhxi-hero-reveal:focus-visible .hcp{outline:2px solid var(--acc); outline-offset:4px}
.lens .legend{display:flex; flex-direction:column; align-items:flex-end; gap:var(--sp-10); max-width:100%}
.lens .sw{display:flex; gap:var(--sp-6); margin-top:var(--sp-10)}
.lens .swb{font-family:var(--font-mono); font-size:var(--fs-r064); letter-spacing:.16em; text-transform:uppercase; color:var(--mut); background:var(--ink); border:1px solid var(--line); padding:var(--sp-8) var(--sp-12); min-height:34px; border-radius:var(--r-3); cursor:pointer; display:flex; gap:var(--sp-8); align-items:center; transition:color .2s, border-color .2s, background .2s, transform .15s}
.lens .swb .n{color:var(--acc)}
.lens .swb:hover{color:var(--tx); border-color:color-mix(in srgb, var(--acc) 40%, var(--line)); transform:translateY(-1px)}
.lens .swb:active{transform:translateY(0)}
.lens .swb[aria-pressed="true"]{color:var(--tx); border-color:var(--acc); background:color-mix(in srgb, var(--acc) 12%, var(--ink))}
.lens .swb:focus-visible{outline:2px solid var(--acc); outline-offset:2px}
/* laboratório (César, 14/10 noite): a caixa de temas/conteúdos ocupa a largura do layout; a torre fica à direita, ao nível do título (grid de 2 colunas × 2 linhas: texto | torre, temas a toda a largura) */
#lab .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 clamp(28px,4vw,60px); align-items:start}
#lab .split > .rv:nth-child(2){display:flex; flex-direction:column; align-self:stretch; position:relative; z-index:1; min-height:0; height:0} /* a coluna não conta para a altura da linha: a torre (altura dada por _fitLab) transborda e pousa sobre a linha dos temas */
@media (max-width:900px){ #lab .split > .rv:nth-child(2){height:auto} }
#lab .split > .reads{grid-column:1 / -1}
@media (max-width:900px){ #lab .split{grid-template-columns:1fr} #lab .split > .reads{grid-column:1} }
#lab .rx dl{padding-left:164px; /* = coluna do título (150px, em #lab .read) + gap 14px */ padding-top:0; padding-bottom:var(--sp-16); grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-14) var(--sp-24)}
#lab .rx dd{max-width:none}
@media (max-width:900px){ #lab .rx dl{grid-template-columns:1fr} }
@media (max-width:520px){ #lab .read{grid-template-columns:1fr} #lab .rx dl{padding-left:0} }
/* equipa altamente eficaz (recuperada do site antigo, 15/10): cartões foto + nome + função, a toda a largura, por baixo dos temas */
.team{grid-column:1 / -1; margin-top:var(--sp-44); padding-top:var(--sp-28); border-top:1px solid var(--line)}
.team .thead{display:grid; gap:0; margin-bottom:var(--sp-26)} /* César, 15/10: título com a formatação do h2 da secção («Menos tecnologia…») */
.team .thead p{margin:0; color:var(--mut); max-width:56ch; text-wrap:pretty}
.team h3{font-size:clamp(1.9rem, 4.4vw, 3.4rem); letter-spacing:-.02em; line-height:1.04; color:inherit; margin:0 0 var(--sp-22); max-width:none}
.tgrid{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:var(--sp-18) var(--sp-12)} /* 19/10: 8 cartões (7 pessoas, uma sem nome, + co-worker digital) */ /* 18/10: 7 cartões (6 pessoas + co-worker digital) */ /* César, 18/10: os 6 cartões numa só linha sempre que couber; 3+3 em ecrãs médios; 2 por linha no telemóvel */
@media (max-width:1100px){ .tgrid{grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--sp-18) var(--sp-20)} }
.tcard{display:grid; gap:var(--sp-10); margin:0}
.tph{position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--ink2); border:1px solid var(--line)}
.tph img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.9)}
.tph .tvid{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.9)} /* retrato animado (team.N.video), por cima da foto; mostra-se mesmo com «reduzir movimento» (César, 17/10 — o SO dele tem a preferência ativa) */
.tph img[src=""], .tph img[data-missing="1"]{display:none}
.tph::after{content:attr(data-ini); position:absolute; inset:0; display:grid; place-items:center; font-family:var(--font-display); font-weight:700; font-size:var(--fs-r220); letter-spacing:-.02em; color:var(--mut); opacity:.55} /* iniciais enquanto não há foto (ficheiro em falta ou src vazio) */
.tph:has(img:not([src=""]):not([data-missing="1"]))::after{content:none}
.tcard figcaption{display:grid; gap:var(--sp-2)}
.tcard b{font-family:var(--font-display); font-size:clamp(.92rem, 1.1vw, 1.02rem); letter-spacing:-.01em; text-wrap:balance}
.tcard figcaption > span{font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.12em; text-transform:uppercase; color:var(--mut)} /* só a função — os spans internos das interpolações herdam */
.tcard .tfun{display:grid; gap:var(--sp-1)} .tcard .tfun em{font-style:normal; display:block} /* 19/10 (César): função em duas linhas — área / especialidade, separadas pelo «·» do texto */
.tcard small{display:block; font-size:clamp(.78rem, .95vw, .88rem); color:var(--mut); line-height:1.45; margin-top:var(--sp-4); text-wrap:pretty}
.tcard .tlink{justify-self:start; margin-top:var(--sp-6); font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.12em; text-transform:uppercase; color:var(--acc)} /* 18/10: ligação do cartão do co-worker digital à carta de orientação */
@media (max-width:520px){ .tgrid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-14)} }
/* laboratório: torre de televisores — corpo fixo (lab/tv-body.webp); cada ecrã é uma janela independente que troca entre 10 conjuntos (lab/tv-s1..9.webp) com interferência só no ecrã; cada janela é recortada e ajustada à posição real do ecrã no corpo */
.tv{width:80%; margin-left:0; display:flex; justify-content:flex-end; max-width:none; flex:none; align-self:flex-end} /* sem margin-left:auto — um item que transborda ignora as margens auto e ficaria encostado à esquerda */ /* pode ser mais larga do que a coluna: alinhada à direita, transborda para o intervalo, à esquerda */
@media (max-width:900px){ .tv{width:100%; justify-content:center} }
.tvstack{position:relative; width:100%; aspect-ratio:1122/1402}
.tvbody{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; filter:brightness(1.06) contrast(.92)}
html[data-theme="light"] .tvbody{filter:brightness(1.02) contrast(.94)}
.slot{position:absolute; overflow:hidden; border-radius:0; transform-origin:50% 50%; background:var(--c-0b141a); animation:tvflick 9s linear infinite}
.slot .tvfx{inset:2.5% 2%; border-radius:7% / 10%; overflow:hidden} /* recortes já na proporção de cada janela (lab/tv-c{janela}-{conjunto}.webp) */ /* cada janela = vidro do televisor na imagem base (lab/tv-map.json); os ecrãs são recortes lab/tv-c{janela}-{conjunto}.webp */
.slot:nth-child(3){animation-delay:-2.3s} .slot:nth-child(4){animation-delay:-4.1s} .slot:nth-child(5){animation-delay:-6.2s} .slot:nth-child(6){animation-delay:-7.7s}
.tvf{position:absolute; inset:0; width:100%; height:100%; object-fit:fill; opacity:0; transition:opacity .18s linear; filter:brightness(1.22) contrast(1.02) saturate(1.1)}
html[data-theme="light"] .tvf{filter:brightness(1.14) contrast(1)}
.slot::after{content:""; position:absolute; inset:3% 2.5%; border-radius:9% / 13%; pointer-events:none; background:radial-gradient(ellipse at 50% 42%, var(--c-rgba-200-230-255-34), var(--c-rgba-200-230-255-08) 55%, var(--c-rgba-200-230-255-0) 78%); mix-blend-mode:screen; animation:tvglow 7s ease-in-out infinite}
.slot:nth-child(3)::after{animation-delay:-2.1s} .slot:nth-child(4)::after{animation-delay:-4.4s} .slot:nth-child(5)::after{animation-delay:-1.3s} .slot:nth-child(6)::after{animation-delay:-5.6s} /* brilho do tubo */
.slot:nth-child(2) .tvf[data-on="true"]{animation:tvbright2 23s ease-in-out infinite -5s}
.slot:nth-child(4) .tvf[data-on="true"]{animation:tvbright2 31s ease-in-out infinite -12s}
.slot:nth-child(6) .tvf[data-on="true"]{animation:tvbright2 27s ease-in-out infinite -19s}
.tvf[data-on="true"]{opacity:1}
.tvfx{position:absolute; inset:0; pointer-events:none}
.tvnoise{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:180px 180px; opacity:.08; mix-blend-mode:screen; animation:tvsnow .4s steps(1) infinite; transition:opacity .15s}
html[data-theme="light"] .tvnoise{mix-blend-mode:multiply; opacity:.06}
.tvscan{background:repeating-linear-gradient(to bottom, var(--c-rgba-0-0-0-0) 0 2px, var(--c-rgba-0-0-0-16) 2px 3px); opacity:.5}
.tvroll{background:linear-gradient(to bottom, var(--c-rgba-255-255-255-0), var(--c-rgba-255-255-255-14) 45%, var(--c-rgba-255-255-255-2) 50%, var(--c-rgba-255-255-255-14) 55%, var(--c-rgba-255-255-255-0)); background-size:100% 26%; background-repeat:no-repeat; mix-blend-mode:screen; animation:tvroll 7s linear infinite}
.slot:nth-child(3) .tvroll{animation-delay:-1.7s} .slot:nth-child(4) .tvroll{animation-delay:-3.1s} .slot:nth-child(5) .tvroll{animation-delay:-4.6s} .slot:nth-child(6) .tvroll{animation-delay:-5.9s}
.tvflash{background:var(--c-ffffff); opacity:0; mix-blend-mode:screen}
html[data-theme="light"] .tvflash{background:var(--c-dff6f2); mix-blend-mode:normal}
.tvspots{position:absolute; inset:0; pointer-events:none; -webkit-mask-image:url(lab/tv-body.webp); mask-image:url(lab/tv-body.webp); -webkit-mask-size:contain; mask-size:contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:center; mask-position:center; background-image:radial-gradient(ellipse at center, var(--c-rgba-255-255-255-5), var(--c-rgba-255-255-255-0) 68%), radial-gradient(ellipse at center, var(--c-rgba-255-255-255-38), var(--c-rgba-255-255-255-0) 68%), radial-gradient(ellipse at center, var(--c-rgba-255-255-255-3), var(--c-rgba-255-255-255-0) 68%); background-size:46% 22%, 34% 16%, 56% 20%; background-repeat:no-repeat; background-position:10% 8%, 85% 48%, 30% 92%; mix-blend-mode:screen; opacity:.6; animation:tvspots 13s ease-in-out infinite alternate}
html[data-theme="light"] .tvspots{mix-blend-mode:overlay; opacity:.5}
/* interferência por janela: data-g liga, data-fx escolhe o efeito */
.slot[data-g="true"] .tvnoise{opacity:.7}
.slot[data-fl="true"] .tvf[data-on="true"]{animation:tvflk .32s steps(4,end) both}
.slot[data-fl="true"] .tvnoise{opacity:.45}
@keyframes tvflk{0%{opacity:1} 25%{opacity:.15} 50%{opacity:1} 75%{opacity:.4} 100%{opacity:1}}
.slot[data-g="true"][data-fx="slice"] .tvf[data-on="true"]{animation:tvtear .55s steps(1,end) both, tvsplit .55s steps(1,end) both}
.slot[data-g="true"][data-fx="snow"] .tvnoise{opacity:1; animation-duration:.1s}
.slot[data-g="true"][data-fx="snow"] .tvf[data-on="true"]{opacity:.22}
.slot[data-g="true"][data-fx="roll"] .tvf[data-on="true"]{animation:tvvroll .6s cubic-bezier(.2,.9,.3,1) both}
.slot[data-g="true"][data-fx="flash"] .tvflash{animation:tvflash .7s steps(1,end) both}
.slot[data-g="true"][data-fx="flash"] .tvf[data-on="true"]{animation:tvzoom .7s ease-out both}
.slot[data-g="true"][data-fx="blink"] .tvf[data-on="true"]{animation:tvblink .6s steps(1,end) both}
.slot[data-g="true"][data-fx="punch"] .tvf[data-on="true"]{animation:tvpunch .6s cubic-bezier(.3,1.5,.4,1) both, tvsplit .6s steps(1,end) both}
.slot[data-g="true"][data-fx="tune"] .tvnoise{opacity:.9; animation-duration:.08s}
.slot[data-g="true"][data-fx="tune"] .tvf[data-on="true"]{animation:tvtune 1.1s linear both}
.slot[data-g="true"][data-fx="off"] .tvf[data-on="true"]{animation:tvoff 1s cubic-bezier(.7,0,.3,1) both}
.slot[data-g="true"][data-fx="off"] .tvflash{animation:tvdot 1s ease-out both}
.slot[data-g="true"][data-fx="wave"] .tvf[data-on="true"]{animation:tvwave .8s steps(6,end) both}
@keyframes tvtune{0%{clip-path:inset(0 0 0 0); filter:brightness(1.08) contrast(.9)} 20%{clip-path:inset(0 0 70% 0); filter:brightness(1.6) contrast(1.4)} 45%{clip-path:inset(30% 0 30% 0); filter:brightness(1.3)} 70%{clip-path:inset(60% 0 0 0); filter:brightness(1.6) contrast(1.4)} 100%{clip-path:inset(0 0 0 0); filter:brightness(1.08) contrast(.9)}}
@keyframes tvoff{0%{transform:scale(1,1); filter:brightness(1.08)} 35%{transform:scale(1,.03); filter:brightness(2)} 55%{transform:scale(.02,.03); filter:brightness(3)} 70%{transform:scale(.02,.03); filter:brightness(0)} 100%{transform:scale(1,1); filter:brightness(1.08) contrast(.9)}}
@keyframes tvdot{0%,50%{opacity:0} 56%{opacity:.9} 72%{opacity:.15} 100%{opacity:0}}
@keyframes tvwave{0%{transform:skewX(0)} 17%{transform:skewX(6deg) translateX(3%)} 34%{transform:skewX(-5deg) translateX(-3%)} 51%{transform:skewX(4deg) translateX(2%)} 68%{transform:skewX(-2deg) translateX(-1%)} 85%{transform:skewX(1deg)} 100%{transform:none}}
@keyframes tvglow{0%,100%{opacity:.85} 50%{opacity:1.1}}
@keyframes tvbright{0%,100%{filter:brightness(1)} 8%{filter:brightness(1)} 11%{filter:brightness(1.45)} 14%{filter:brightness(1.1)} 17%{filter:brightness(1.55)} 22%{filter:brightness(1)} 58%{filter:brightness(1)} 61%{filter:brightness(.72)} 64%{filter:brightness(1.3)} 67%{filter:brightness(.85)} 72%{filter:brightness(1)}}
@keyframes tvbright2{0%,8%,22%,58%,72%,100%{filter:brightness(1.22) contrast(1.02) saturate(1.1)} 11%{filter:brightness(1.7) contrast(1.02) saturate(1.1)} 14%{filter:brightness(1.3) contrast(1.02) saturate(1.1)} 17%{filter:brightness(1.85) contrast(1.02) saturate(1.1)} 61%{filter:brightness(.8) contrast(1.02) saturate(1.1)} 64%{filter:brightness(1.55) contrast(1.02) saturate(1.1)} 67%{filter:brightness(.95) contrast(1.02) saturate(1.1)}}
@keyframes tvflick{0%,100%{opacity:1} 41%{opacity:1} 42%{opacity:.94} 43%{opacity:1} 77%{opacity:1} 78%{opacity:.9} 79%{opacity:1}}
@keyframes tvsnow{0%{background-position:0 0} 20%{background-position:-37px 51px} 40%{background-position:63px -22px} 60%{background-position:-88px -64px} 80%{background-position:41px 97px} 100%{background-position:-12px 29px}}
@keyframes tvroll{0%{background-position:0 -40%} 100%{background-position:0 140%}}
@keyframes tvspots{0%{background-position:10% 8%, 85% 48%, 30% 92%; opacity:.4} 35%{background-position:70% 22%, 20% 60%, 75% 80%; opacity:.7} 70%{background-position:35% 40%, 90% 15%, 15% 70%; opacity:.45} 100%{background-position:80% 5%, 40% 75%, 60% 98%; opacity:.65}}
@keyframes tvtear{0%{clip-path:inset(0 0 0 0); transform:none} 30%{clip-path:polygon(0 0,100% 0,100% 38%,0 41%,0 46%,100% 44%,100% 100%,0 100%); transform:translateX(-4%)} 60%{clip-path:polygon(0 0,100% 0,100% 71%,0 69%,0 75%,100% 73%,100% 100%,0 100%); transform:translateX(3%)} 100%{clip-path:inset(0 0 0 0); transform:none}}
@keyframes tvsplit{0%{filter:url(#tvsplitA) brightness(1.08)} 30%{filter:url(#tvsplitB) brightness(1.08)} 60%{filter:url(#tvsplitA) brightness(1.08)} 100%{filter:brightness(1.08) contrast(.9)}}
@keyframes tvvroll{0%{transform:translateY(0)} 30%{transform:translateY(-38%)} 55%{transform:translateY(26%)} 80%{transform:translateY(-8%)} 100%{transform:translateY(0)}}
@keyframes tvflash{0%{opacity:0} 8%{opacity:.85} 16%{opacity:.15} 24%{opacity:.6} 40%{opacity:0} 100%{opacity:0}}
@keyframes tvzoom{0%{transform:scale(1)} 12%{transform:scale(1.06)} 100%{transform:scale(1)}}
@keyframes tvpunch{0%{transform:scale(1)} 35%{transform:scale(1.14)} 100%{transform:scale(1)}}
@keyframes tvblink{0%{opacity:1} 15%{opacity:0} 25%{opacity:1} 35%{opacity:0} 50%{opacity:1} 60%{opacity:.2} 70%{opacity:1; transform:scaleY(.04)} 78%{transform:scaleY(1.04)} 100%{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){ .slot,.tvnoise,.tvroll,.tvspots,.tvflash,.slot[data-g="true"] .tvf[data-on="true"]{animation:none !important} .tvroll,.tvflash{display:none} .tvnoise{opacity:.05 !important} .slot[data-g="true"] .tvf[data-on="true"]{opacity:1} }
@media (max-width:900px){ .hero .wrap{grid-template-columns:minmax(0,1fr)} .hero .wrap>*{min-width:0} .lens{max-width:none; width:100%; margin-top:var(--sp-10); align-self:auto} }
.ticker{ position:absolute; left:0; right:0; bottom:0; border-top:1px solid var(--line); overflow:hidden; padding:var(--sp-12) 0; background:color-mix(in srgb, var(--ink) 72%, transparent); }
.ticker .rail{display:flex; width:max-content; gap:0; animation:rail 46s linear infinite}
.ticker span{ font-family:var(--font-mono); font-size:var(--fs-r072); letter-spacing:.2em; text-transform:uppercase; color:var(--mut); white-space:nowrap; padding-right:var(--sp-56); }
.ticker b{color:var(--acc); font-weight:400}
@keyframes rail{to{transform:translateX(-50%)}}
.sec{padding-block:clamp(42px, 5.6vw, 72px); border-top:0; position:relative}
.split{display:grid; grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:clamp(34px,5vw,80px); align-items:start}
@media (max-width:900px){ .split{grid-template-columns:1fr} }
#contacto .split{grid-template-columns:minmax(0,3.4fr) minmax(0,7.6fr)}
@media (max-width:900px){ #contacto .split{grid-template-columns:1fr} }
#contacto .read{padding:var(--sp-12) 0; margin:0; width:auto} /* 20/10 (César): sem margens negativas — os rótulos ficam alinhados com o texto e não são cortados */
#contacto .read p{min-width:0; container-type:inline-size}
#contacto .read a[href^="mailto:"]{font-size:min(1em, 100cqi / 12.9); overflow-wrap:anywhere} /* o email reduz o corpo para caber na coluna (≈12,3 em de largura em Inter) */
@media (min-width:901px){ #contacto .reads{grid-template-columns:minmax(max-content, clamp(0px, 20vw - 140px, 120px)) minmax(0,1fr)} #contacto .read{grid-column:1 / -1; grid-template-columns:subgrid; gap:clamp(10px, 1.4vw, 18px)} } /* coluna dos rótulos: 120px em ecrã largo, encolhe até ao rótulo mais comprido (partilhada pelas linhas) */
#contacto .split{align-items:stretch}
#contacto .form{display:flex; flex-direction:column; gap:var(--sp-20)}
#contacto .mrow{flex:1; display:grid; grid-template-columns:1.6fr 1fr; grid-template-rows:auto minmax(0,1fr); gap:var(--sp-8) var(--sp-20); min-height:0} /* alinha com a coluna Empresa; topo do consentimento = topo da caixa */
#contacto .mrow .mlbl{grid-column:1; grid-row:1; display:flex; justify-content:space-between; align-items:baseline; gap:var(--sp-12); font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.16em; text-transform:uppercase; color:var(--mut)}
#contacto .fgrow{grid-column:1; grid-row:2; grid-template-rows:minmax(0,1fr); min-height:0}
#contacto .fgrow textarea{height:100%; min-height:220px}
#contacto .mside{grid-column:2; grid-row:2; display:flex; flex-direction:column; gap:var(--sp-8); min-width:0}
#contacto .mside .btn{margin-top:auto; align-self:stretch; margin-left:var(--sp-32); justify-content:center; text-align:center} /* mesma largura do texto do consentimento */
#contacto .mcnt{font-variant-numeric:tabular-nums}
#contacto .mcnt.max{color:var(--acc)}
#contacto .mside .fmsg{margin:auto 0 0; padding-left:var(--sp-32)} /* erro por cima do botão, alinhado com o texto do consentimento */
#contacto .mside .fmsg.on + .btn{margin-top:0}
@media (max-width:640px){ #contacto .mrow{grid-template-columns:1fr; grid-template-rows:auto auto auto} #contacto .fgrow{grid-column:1; grid-row:2} #contacto .mside{grid-column:1; grid-row:3} }
.cnets{display:flex; gap:var(--sp-18); flex-wrap:wrap; align-items:center}
.cbtn{font-family:inherit; font-size:var(--fs-r095); letter-spacing:0; text-transform:none; padding:0; border:0; background:none; color:var(--mut); cursor:pointer; text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--line2)}
.cbtn:hover{color:var(--acc); text-decoration-color:var(--acc)}
.pgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:var(--sp-12); padding:var(--sp-18); overflow:auto}
.pcard{display:grid; gap:var(--sp-6); text-align:left; padding:var(--sp-18); background:var(--ink2); border:1px solid var(--line2); border-radius:var(--r-10); cursor:pointer; color:var(--tx)}
.pcard b{font-family:var(--font-display); font-size:var(--fs-r102)}
.pcard span{font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.14em; text-transform:uppercase; color:var(--mut)}
.pcard:hover{border-color:var(--acc)}
.pdet{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); gap:var(--sp-22); padding:var(--sp-18); overflow:auto; min-height:0}
.pdet h3{font-size:var(--fs-r150); margin:var(--sp-10) 0 var(--sp-14)}
.pback{background:none; border:0; color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.14em; text-transform:uppercase; cursor:pointer; padding:0}
.pback:hover{color:var(--acc)}
.plabel{font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--acc); margin:var(--sp-16) 0 var(--sp-6)}
.ptext{color:var(--mut); margin:0}
.plist{margin:0; padding-left:var(--sp-18); color:var(--mut); display:grid; gap:var(--sp-6)}
.pdet-r{display:flex; flex-direction:column; min-height:0}
.pframe{width:100%; min-height:380px; flex:1; border:1px solid var(--line2); border-radius:var(--r-8); background:var(--ink2)}
.pout{margin-top:var(--sp-10); font-size:var(--fs-r064); letter-spacing:.14em; text-transform:uppercase}
.pholder{border:1px dashed var(--line2); border-radius:var(--r-8); min-height:380px; display:grid; place-items:center; color:var(--mut); font-size:var(--fs-r066); letter-spacing:.14em; text-transform:uppercase; background:repeating-linear-gradient(-45deg, transparent 0 14px, color-mix(in srgb, var(--line) 40%, transparent) 14px 15px)}
@media (max-width:820px){ .pdet{grid-template-columns:1fr} }
.fig{position:relative; border:1px solid var(--line); background:var(--ink2)}
.fig::before,.fig::after,.fig .ck::before,.fig .ck::after{ content:""; position:absolute; width:14px; height:14px; border:1.5px solid var(--acc); z-index:2; }
.fig::before{top:-1px; left:-1px; border-right:0; border-bottom:0}
.fig::after{top:-1px; right:-1px; border-left:0; border-bottom:0}
.fig .ck::before{bottom:-1px; left:-1px; border-right:0; border-top:0}
.fig .ck::after{bottom:-1px; right:-1px; border-left:0; border-top:0}
.fig .art{display:block; width:100%; height:auto; filter:url(#duoUHXI)}
.cyc{position:relative}
#metodo .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} /* infografia um pouco maior (César, 15/10); os rótulos mantêm o tamanho (clamp) */
@media (max-width:900px){ #metodo .split{grid-template-columns:1fr} }
.cycimg{position:relative; aspect-ratio:1; container-type:inline-size}
.cycimg img{display:block; width:100%; height:100%; object-fit:contain; padding:2.5%}
.cybase{filter:brightness(.98) contrast(.84) saturate(.78)} /* infografia esbatida; o anel ativo é uma cópia tingida de laranja (lab/ciclo3-hN.webp, máscara por anel que respeita o entrelaçado; gerar com tmp/ciclo-realce.js) */
.cyh{position:absolute; inset:0; opacity:0; transition:opacity .7s ease; pointer-events:none}
.cyh[data-on="true"]{opacity:.72; animation:cyin 1.1s cubic-bezier(.2,.8,.2,1) both}
@keyframes cyin{0%{opacity:0; transform:scale(1.015); filter:brightness(1.75) saturate(1.3)} 38%{opacity:.98; transform:scale(1.004); filter:brightness(1.25) saturate(1.1)} 100%{opacity:.72; transform:none; filter:none}}
.cymov{position:absolute; left:0; top:0; width:8.5%; height:8.5%; border-radius:var(--r-round); pointer-events:none; opacity:0; transform:translate(-50%,-50%); background:radial-gradient(closest-side, var(--c-rgba-255-170-70-95), var(--c-rgba-248-84-0-55) 48%, var(--c-rgba-248-84-0-0) 100%); filter:blur(1.5px); will-change:left,top,opacity} /* mancha laranja do avanço automático (_cyRun) */
.cyl{position:absolute; width:21%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:var(--sp-2); background:none; border:0; padding:var(--sp-8) var(--sp-4); cursor:pointer; color:inherit; font-family:var(--font-mono); letter-spacing:.08em; text-transform:uppercase; text-align:center; border-radius:var(--r-round); transition:transform .35s ease}
.cyl i{font-style:normal; color:var(--acc); font-size:clamp(.58rem, 2.18cqw, .76rem)}
.cyl b{font-weight:400; color:var(--tx); font-size:clamp(.52rem, 2.36cqw, .83rem); letter-spacing:.02em; line-height:1.2; white-space:nowrap; transition:color .3s}
.cyl small{font-family:var(--font-display); text-transform:lowercase; letter-spacing:0; font-size:clamp(.7rem, 3cqw, 1.05rem); color:var(--tx); font-style:italic; opacity:.85}
.cyl:hover b, .cyl[data-on="true"] b{color:var(--acc)}
.cyl[data-on="true"]{transform:translate(-50%,-50%) scale(1.06)}
.cyl:focus-visible{outline:2px solid var(--acc); outline-offset:2px}
.mex{margin:var(--sp-28) 0 0; padding:var(--sp-18) 0 0; border-top:1px solid var(--line)}
.mexk{display:flex; flex-wrap:wrap; column-gap:.6em; row-gap:var(--sp-4); font-family:var(--font-mono); font-size:var(--fs-r064); letter-spacing:.16em; text-transform:uppercase; color:var(--acc); margin:0 0 var(--sp-10)}
.mexk span{white-space:nowrap}
.mexk .k2::before, .mexk .k3::before{content:"· "}
.mexk span[data-nl="1"]::before{content:none} /* sem separador quando o segmento abre a linha */
.mexk .k3{flex:1 0 auto}
.mexq{margin:0; font-size:var(--fs-r102); line-height:1.55; color:var(--tx); font-style:italic; max-width:56ch}
@keyframes mexin{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
@keyframes mexin2{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
.mex[data-anim="a"] .mexq, .mex[data-anim="a"] .k3{animation:mexin .5s ease both} .mex[data-anim="b"] .mexq, .mex[data-anim="b"] .k3{animation:mexin2 .5s ease both}
.move{cursor:pointer; transition:background .35s}
.move[data-on="true"]{background:color-mix(in srgb, var(--acc) 8%, transparent)}
.move[data-on="true"] h3{color:var(--acc)}
.move[data-on="true"]::after{width:calc(100% - 44px); transition:width .6s ease}
.move::after{transition:width .4s ease}
.figcap{ display:flex; gap:var(--sp-12); align-items:baseline; border-top:1px solid var(--line); font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.14em; text-transform:uppercase; color:var(--mut); padding:var(--sp-10) var(--sp-12); }
.figcap b{color:var(--acc); font-weight:400; flex:none}
.reads{display:grid; gap:0; margin-top:var(--sp-34); border-top:1px solid var(--line)}
.read{display:grid; grid-template-columns:120px 1fr; gap:var(--sp-18); padding:var(--sp-18) var(--sp-12); margin:0 -12px; width:calc(100% + 24px); text-align:left; background:none; border:0; border-bottom:1px solid var(--line); border-radius:0; color:inherit; font:inherit; cursor:pointer; transition:background .25s}
.read:hover b, .read[aria-pressed="true"] b{color:var(--tx)}
.read[aria-pressed="true"]{background:color-mix(in srgb, var(--acc) 8%, transparent)}
.read:focus-visible{outline:2px solid var(--acc); outline-offset:-2px}
.read b{font-family:var(--font-mono); font-size:var(--fs-r072); letter-spacing:.18em; text-transform:uppercase; color:var(--acc); font-weight:400; padding-top:var(--sp-3)}
#lab .read{grid-template-columns:150px 1fr; padding:var(--sp-12) var(--sp-12); gap:var(--sp-14)} #lab .read b{font-size:var(--fs-r095); letter-spacing:.08em; text-transform:lowercase; color:var(--acc2); font-weight:700; padding-top:0; line-height:1.3} /* mesma expressão da assinatura do rodapé; caixas mais pequenas (César, 14/10) */
#lab .read .rp{font-size:var(--fs-r090)}
.readrow{display:flex; align-items:center; gap:var(--sp-10); margin:0 -12px; padding-right:var(--sp-12); transition:background .25s} /* a cor de seleção cobre a linha toda, incluindo o «+» */
.readrow:hover, .readrow:has(:focus-visible){background:color-mix(in srgb, var(--acc) 8%, transparent)} /* César, 17/10: sem fundo fixo no tema escolhido; aparece ao passar o rato; clicar no tema abre o conteúdo */
.readrow .read{flex:1; min-width:0; width:auto; margin:0}
.readrow .read[aria-pressed="true"]{background:none}
.rxbtn{flex:none; background:none; cursor:pointer; padding:0; font:inherit; font-family:var(--font-mono); font-size:var(--fs-r090); line-height:1}
.rxbtn[aria-expanded="true"]{transform:rotate(45deg); border-color:var(--acc); color:var(--acc)}
.rxbtn:hover,.rxbtn:focus-visible{border-color:var(--acc); color:var(--acc); outline:none}
.read .rp{display:block; margin:0; color:var(--mut); font-size:var(--fs-r095); line-height:1.5}
/* laboratório: o tema escolhido estende-se (instrumentos · métodos pragmáticos · cultura de investigação aplicada); o separador passa do botão para a extensão */
#lab .read{border-bottom:0}
.rx{display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; border-bottom:1px solid var(--line)}
.rx[data-on="true"]{grid-template-rows:1fr}
.rx > div{overflow:hidden; min-height:0}
.rx dl{margin:0; padding:var(--sp-2) 0 var(--sp-20) 168px; display:grid; gap:var(--sp-12)}
.rx dl > div{display:grid; gap:var(--sp-3)}
.rx dt{font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--acc)}
.rx dd{margin:0; color:var(--mut); font-size:var(--fs-r090); line-height:1.5; max-width:52ch; text-wrap:pretty}
@media (max-width:520px){ .rx dl{padding-left:0} }
@media (prefers-reduced-motion:reduce){ .rx{transition:none} }
@media (max-width:520px){ .read{grid-template-columns:1fr; gap:var(--sp-6)} }
.filters{display:flex; flex-wrap:wrap; gap:var(--sp-10); margin:var(--sp-30) 0 var(--sp-6)}
.chip{ font-family:var(--font-mono); font-size:var(--fs-r070); letter-spacing:.12em; text-transform:uppercase; border:1px solid var(--line2); background:transparent; color:var(--mut); padding:var(--sp-9) var(--sp-16); border-radius:var(--r-pill); cursor:pointer; min-height:38px; }
.chip[aria-pressed="true"]{background:var(--tx); color:var(--ink); border-color:var(--tx)}
.chip:hover{border-color:var(--acc); color:var(--tx)}
.chip[aria-pressed="true"]:hover{color:var(--ink)}
.reg{border-top:1px solid var(--line2); margin-top:var(--sp-22)}
.prow{border-bottom:1px solid var(--line)}
.phead{ display:grid; grid-template-columns:74px minmax(0,3fr) minmax(0,3fr) minmax(0,2fr) 40px; gap:var(--sp-18); align-items:center; width:100%; text-align:left; background:none; border:0; color:var(--tx); cursor:pointer; padding:var(--sp-20) var(--sp-4); font:inherit; }
.phead:hover .pname{color:var(--acc)}
.pcode{font-family:var(--font-mono); font-size:var(--fs-r072); color:var(--mut); letter-spacing:.06em}
.pname{font-family:var(--font-display); font-weight:700; font-size:clamp(1.15rem,2vw,1.5rem); letter-spacing:-.01em; line-height:1.15; display:flex; align-items:center; gap:var(--sp-10); flex-wrap:wrap}
.pnew{font-family:var(--font-mono); font-size:var(--fs-r056); letter-spacing:.16em; color:var(--ink); background:var(--acc2); border-radius:var(--r-3); padding:var(--sp-3) var(--sp-6); text-transform:uppercase}
.parea{color:var(--mut); font-size:var(--fs-r090)}
.pstate{font-family:var(--font-mono); font-size:var(--fs-r068); letter-spacing:.1em; text-transform:uppercase; color:var(--acc2)}
.pmark{ width:34px; height:34px; border:1px solid var(--line2); border-radius:var(--r-round); display:grid; place-items:center; color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r090); transition:transform .25s ease; justify-self:end; }
.prow.open .pmark{transform:rotate(45deg); border-color:var(--acc); color:var(--acc)}
.pbody{display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease}
.prow.open .pbody{grid-template-rows:1fr}
.pbody>div{overflow:hidden}
.pinner{padding:var(--sp-2) var(--sp-4) var(--sp-26); display:grid; grid-template-columns:74px minmax(0,1fr); gap:var(--sp-18)}
.pinner .fambadge{font-family:var(--font-mono); font-size:var(--fs-r062); color:var(--mut); letter-spacing:.1em; text-transform:uppercase; line-height:1.5}
.ptag{font-family:var(--font-mono); font-size:var(--fs-r078); color:var(--acc); margin:0 0 var(--sp-8)}
.pteaser{color:var(--mut); max-width:70ch; margin-bottom:var(--sp-16)}
.pacts{display:flex; flex-wrap:wrap; gap:var(--sp-12)}
.pacts .btn{min-height:42px; padding:var(--sp-9) var(--sp-18); font-size:var(--fs-r086)}
/* o que fazemos: as frentes como áreas de intervenção (setor · mercado · organização) e casos de aplicação por tipo de organização dentro de cada frente; a frente abre ao passar o rato (rato fino) e ao clicar (toque) */
.svcnote{color:var(--mut); max-width:72ch; margin:var(--sp-18) 0 0}
.areas{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-18) clamp(20px,3vw,40px); margin-top:var(--sp-22); padding-top:var(--sp-18); border-top:1px solid var(--line)}
.area b{display:block; font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.16em; text-transform:uppercase; color:var(--acc); font-weight:400; margin-bottom:var(--sp-6)}
.area p{margin:0; color:var(--mut); font-size:var(--fs-r094); max-width:40ch; text-wrap:pretty}
@media (max-width:820px){ .areas{grid-template-columns:1fr} }
.pck{font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--acc); margin:0 0 var(--sp-10)}
.pcases{list-style:none; margin:0 0 var(--sp-20); padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:var(--sp-14) var(--sp-22)}
.pcases li{display:grid; gap:var(--sp-5); align-content:start; border-top:1px solid var(--line); padding-top:var(--sp-10); color:var(--mut); font-size:var(--fs-r090); line-height:1.5; text-wrap:pretty}
.pcases b{font-family:var(--font-mono); font-size:var(--fs-r064); letter-spacing:.12em; text-transform:uppercase; color:var(--tx); font-weight:400}
@media (max-width:820px){
  .phead{grid-template-columns:minmax(0,1fr) 34px; gap:var(--sp-8); row-gap:var(--sp-4)}
  .pcode{order:1; grid-column:1 / -1}
  .pname{order:2}
  .pmark{order:3}
  .parea{order:4; grid-column:1 / -1}
  .pstate{order:5; grid-column:1 / -1}
  .pinner{grid-template-columns:1fr}
  .pinner .fambadge{display:none}
}
.moves{display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); border-radius:var(--r-4); overflow:hidden; margin-top:var(--sp-38)}
.move{padding:var(--sp-26) var(--sp-22) var(--sp-30); border-left:1px solid var(--line); position:relative}
.move:first-child{border-left:0}
.move i{font-family:var(--font-mono); font-style:normal; font-size:var(--fs-r064); letter-spacing:.18em; color:var(--mut); text-transform:uppercase}
.move h3{margin:var(--sp-12) 0 var(--sp-10); font-size:var(--fs-r130)}
.move p{margin:0; color:var(--mut); font-size:var(--fs-r092)}
.move::after{content:""; position:absolute; left:22px; top:0; width:34px; height:2px; background:var(--acc)}
@media (max-width:900px){ .moves{grid-template-columns:1fr 1fr} .move:nth-child(3){border-left:0} .move:nth-child(n+3){border-top:1px solid var(--line)} }
@media (max-width:540px){ .moves{grid-template-columns:1fr} .move{border-left:0} .move:nth-child(n+2){border-top:1px solid var(--line)} }
/* princípio de validação: figura que cresce com o scroll (cabeça → pés = eu → todos → dinheiro) + personas */
#principio .prgrid{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:clamp(28px,4vw,60px); margin-top:var(--sp-34); align-items:start; container-type:inline-size}
/* figura à escala do homem de gravata (--k:1 = altura total da coluna, 2:3); pode ser mais alta que o ecrã: fixa-se com os pés em baixo e revela-se ao descer */
.pfigw{position:sticky; top:min(72px, calc(100vh - 85cqw - 80px)); display:flex; flex-direction:column; gap:var(--sp-14)}
.pfig{position:relative; width:100%; aspect-ratio:1024/1536; --px:-9%} /* --px: figura puxada para a esquerda do layout */
.pfig > img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:bottom center; filter:brightness(1.04); transform:translateX(var(--px,0%)) scale(var(--k,1)); transform-origin:50% 100%} /* --k: estatura relativa ao homem de gravata (p-09 = 1); pés no mesmo chão */ /* todas as personagens no mesmo enquadramento 1024×1536 → mesma escala */
.pfig > img[data-on="false"]{display:none}
/* cabeça de televisores: 9 vidros medidos por personagem (lab/head-fit.json). .pwd = espaço da imagem (720×1080 px) levado à figura por ResizeObserver (--s, --ox, --oy); cada .tvq projeta a textura no quadrilátero do vidro (matrix3d); o slot recorta pelo contorno real (barril) */
.pwall{position:absolute; inset:0; overflow:hidden; pointer-events:none; transform:translateX(var(--px,0%)) scale(var(--k,1)); transform-origin:50% 100%}
.pwd{position:absolute; left:0; top:0; width:720px; height:1080px; transform-origin:0 0; transform:translate(var(--ox,0px),var(--oy,0px)) scale(var(--s,1))}
.pwd[data-fit="false"]{display:none}
.pwd .slot{background:var(--c-070b10); border-radius:0}
.pwd .tvq{position:absolute; left:0; top:0; width:100%; height:100%; transform-origin:0 0; will-change:transform}
.pwd .tvf{inset:0; width:100%; height:100%; filter:brightness(1.05)}
.pwd .slot .tvfx{inset:0; border-radius:0}
.prname{display:block; border-top:1px solid var(--line); padding-top:var(--sp-12); font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--mut)}
.prname b{display:block; font-family:var(--font-display); font-size:var(--fs-r105); letter-spacing:0; text-transform:none; color:var(--tx); margin-top:var(--sp-4)}
.prname small{display:block; font-family:var(--font-display); font-size:var(--fs-r082); letter-spacing:0; text-transform:none; color:var(--mut); margin-top:var(--sp-4); line-height:1.4}
.plevels{display:grid}
.plv{padding:clamp(30px,6vh,72px) 0; opacity:.42; transition:opacity .4s} /* 14/10: níveis mais próximos; a figura (7fr, 2:3) mantém a escala */
.plv:first-child{padding-top:var(--sp-6)}
.plv[data-on="true"]{opacity:1}
.plv i{display:block; font-family:var(--font-mono); font-style:normal; font-size:var(--fs-r064); letter-spacing:.18em; text-transform:uppercase; color:var(--acc); margin-bottom:var(--sp-12)}
.plv h3{font-size:clamp(1.5rem,3vw,2.2rem); line-height:1.1; letter-spacing:-.015em; margin:0 0 var(--sp-14)}
.plv p{color:var(--mut); max-width:56ch; margin:0 0 .9em; text-wrap:pretty}
.plv .pq{color:var(--tx); margin:0; border-left:2px solid var(--acc); padding-left:var(--sp-14)}
/* começar a validação na própria página: a ideia numa frase → simulador abre na janela (iframe embed=1) já com o nome preenchido */
.pwin{border:1px solid var(--acc); border-radius:var(--r-4); padding:var(--sp-22) var(--sp-24); display:flow-root} /* César, 17/10: a máquina em ponto pequeno flutua à esquerda; o texto, alinhado à direita, acompanha a silhueta da imagem */
.pwin > p, .plevels .pwin p{margin:0; color:var(--mut); max-width:none; text-align:right; text-wrap:pretty} /* texto à direita (César, 17/10) */
/* silhueta direita de lab/maquina.webp (alpha, em % da caixa; se a imagem mudar, medir de novo) */
.pwin .simfig.mini{float:left; width:40%; margin:0 var(--sp-18) var(--sp-10) 0; shape-outside:polygon(0% 0%, 63% 0%, 63% 4.5%, 69% 7.5%, 74% 10%, 76% 17%, 77% 23%, 79% 26%, 81% 32%, 87.5% 36%, 89.5% 39%, 92.5% 42%, 93.5% 45%, 95% 48%, 98.5% 51%, 99.3% 56%, 99.4% 93%, 98.9% 96%, 93% 99%, 90% 100%, 0% 100%); shape-margin:14px}
.pwin .simfig.mini::before{inset:16% 12%; filter:blur(14px)}
.pwin .simfig.mini .simimg{filter:drop-shadow(0 10px 14px var(--c-rgba-0-0-0-4))}
.pwin .vstart{clear:both; padding-top:var(--sp-16)}
@media (max-width:520px){ .pwin .simfig.mini{float:none; width:100%; max-width:260px; margin:0 auto var(--sp-14); shape-outside:none} .pwin > p{text-align:left} }
.vstart{display:grid; gap:var(--sp-8); margin:0}
.vstart label{font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.16em; text-transform:uppercase; color:var(--acc)}
/* caixa da ideia com o botão de envio embutido (como numa mensagem) e legenda com a duração (César, 17/10) */
.vrow{display:flex; position:relative}
.vrow input{flex:1 1 auto; width:100%; min-width:0; min-height:48px; padding:var(--sp-10) var(--sp-54) var(--sp-10) var(--sp-14); background:var(--ink2); color:var(--tx); border:1px solid var(--line2); border-radius:var(--r-4); font:inherit; font-size:var(--fs-r100)}
.vrow input::placeholder{color:var(--mut); opacity:.8}
.vrow input:focus{outline:2px solid var(--acc); outline-offset:2px; border-color:var(--acc)}
.vsend{position:absolute; right:6px; top:50%; transform:translateY(-50%); width:36px; height:36px; border-radius:var(--r-round); border:0; padding:0; background:var(--acc); color:var(--ink); display:grid; place-items:center; cursor:pointer; transition:transform .2s, filter .2s}
.vsend:hover{filter:brightness(1.08); transform:translateY(-50%) scale(1.06)}
.vsend:focus-visible{outline:2px solid var(--acc); outline-offset:2px}
.vtime{display:block; font-family:var(--font-mono); font-size:var(--fs-r070); letter-spacing:.04em; color:var(--mut); margin-top:var(--sp-14); padding-top:var(--sp-12); border-top:1px solid var(--line)} /* legenda no fim do cartão, afastada do resto (César, 17/10) */
.vfoot{display:flex; flex-wrap:wrap; gap:var(--sp-6) var(--sp-18); align-items:baseline; justify-content:space-between; font-size:var(--fs-r084); color:var(--mut)}
.vfoot a{color:var(--acc)}
.ppick{margin-top:var(--sp-28); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:var(--sp-22) 0 var(--sp-18); display:flex; flex-wrap:wrap; gap:var(--sp-18) clamp(28px,5vw,64px); align-items:flex-start}
.knob{display:grid; grid-template-columns:auto auto; gap:var(--sp-6) var(--sp-18); align-items:center}
.knob .pk{grid-column:1 / -1; font-family:var(--font-mono); font-size:var(--fs-r080); letter-spacing:.16em; text-transform:uppercase; color:var(--mut)} /* títulos maiores (César, 14/10); as opções mantêm o tamanho */
.kd{position:relative; width:72px; height:72px; border-radius:var(--r-round); border:1px solid var(--line2); background:radial-gradient(circle at 38% 32%, color-mix(in srgb, var(--tx) 10%, var(--ink2)), var(--ink2) 55%, color-mix(in srgb, var(--ink) 70%, var(--ink2))); box-shadow:var(--sh-2); cursor:pointer; transition:transform .28s cubic-bezier(.3,1.4,.4,1), border-color .16s}
.kd::after{content:""; position:absolute; inset:14px; border-radius:var(--r-round); background:repeating-conic-gradient(from 0deg, var(--line) 0 3deg, transparent 3deg 15deg); opacity:.5}
.kd i{position:absolute; left:50%; top:8px; width:4px; height:27px; margin-left:-2px; border-radius:var(--r-2); background:var(--acc); box-shadow:var(--sh-3)}
.kd:hover,.kd:focus-visible{border-color:var(--acc); outline:none}
/* o traço aponta para a opção escolhida, à direita: ângulo = atan(desvio vertical da opção / 65px do centro do botão ao traço da opção); passo das opções = 26px (altura 26, sem intervalo — César, 14/10: menos espaço entre as opções) */
/* as três listas de opções têm a mesma altura (4 × 26px) e alinham em cima e em baixo (César, 17/10): as de 3 opções distribuem-se (centros a 13, 52 e 91px); o botão fica centrado em altura com a lista (centro a 52px; César, 17/10) → ângulos 90 ± atan(39/65) */
.knob{align-items:center} .knob .kd{margin-top:0}
.kd[data-pos="0"]{transform:rotate(59deg)} .kd[data-pos="1"]{transform:rotate(90deg)} .kd[data-pos="2"]{transform:rotate(121deg)}
/* 4 opções: centros a 13, 39, 65 e 91px → 90 + atan(−39/65), atan(−13/65), atan(13/65), atan(39/65) */
.knob[data-n="4"] .kd[data-pos="0"]{transform:rotate(59deg)} .knob[data-n="4"] .kd[data-pos="1"]{transform:rotate(78.7deg)} .knob[data-n="4"] .kd[data-pos="2"]{transform:rotate(101.3deg)} .knob[data-n="4"] .kd[data-pos="3"]{transform:rotate(121deg)}
.kt{display:grid; gap:0; height:104px; align-content:space-between}
.knob[data-n="4"] .kt{align-content:start}
.kt button{background:none; border:0; padding:0; height:26px; white-space:nowrap; text-align:left; font:inherit; font-size:var(--fs-r086); line-height:1; color:var(--mut); cursor:pointer; display:flex; align-items:center; gap:var(--sp-10)}
.kt button::before{content:""; width:14px; height:1px; background:currentColor; opacity:.5}
.kt button:hover{color:var(--tx)}
.kt button[aria-pressed="true"]{color:var(--acc)} .kt button[aria-pressed="true"]::before{opacity:1; width:22px}
.kt button:disabled{opacity:.38; cursor:default} .kt button:disabled:hover{color:var(--mut)} /* indiferenciado: só «adulto» existe; as outras idades ficam mais claras e o botão não roda */
.kd[aria-disabled="true"]{cursor:default} .kd[aria-disabled="true"]:hover{border-color:var(--line2)}
@media (max-width:900px){ .ppick{gap:var(--sp-16) var(--sp-28)} }
@media (prefers-reduced-motion:reduce){ .kd{transition:none} }
.pfig.pswap > img{animation:pglitch .5s steps(2,end) both}
@keyframes pglitch{0%{filter:none} 25%{filter:hue-rotate(70deg) contrast(1.5); transform:translateX(calc(var(--px,0%) - 6px)) scale(var(--k,1)) skewX(-1deg)} 50%{filter:invert(.12) saturate(2.2); transform:translateX(calc(var(--px,0%) + 6px)) scale(var(--k,1))} 75%{filter:hue-rotate(-70deg) contrast(1.3); transform:translateX(calc(var(--px,0%) - 3px)) scale(var(--k,1))} 100%{filter:brightness(1.04); transform:translateX(var(--px,0%)) scale(var(--k,1))}}
@media (max-width:900px){ #principio .prgrid{grid-template-columns:1fr; gap:var(--sp-24)} .pfigw{position:relative; top:auto} .pfig{max-height:78vh; --px:0%} }
@media (prefers-reduced-motion:reduce){ .pfig.pswap > img{animation:none} }
.principle{margin-top:var(--sp-44); border:1px solid var(--line); border-left:3px solid var(--acc); background:var(--ink2); padding:var(--sp-32) clamp(22px,4vw,48px) var(--sp-34)}
.principle .eyebrow{margin-bottom:var(--sp-12)}
.principle h3{font-size:clamp(1.5rem,3.4vw,2.4rem); line-height:1.1; margin:0 0 var(--sp-12); letter-spacing:-.015em}
.principle p:last-child{color:var(--mut); max-width:72ch; margin:0}
.copromo{margin-top:var(--sp-30); display:flex; flex-wrap:wrap; gap:var(--sp-18); align-items:center; justify-content:space-between; border:1px dashed var(--line2); border-radius:var(--r-4); padding:var(--sp-22) var(--sp-24)}
.copromo p{margin:0; color:var(--mut); max-width:56ch}
/* Demonstrador · Validação Nível Zero (#simulador): máquina que processa a ideia, para que servem os dados, ato de assinatura */
#simulador{overflow:hidden}
.simhero{display:grid; grid-template-columns:minmax(0,8fr) minmax(0,3.4fr); gap:var(--sp-10) clamp(22px,3.4vw,52px); align-items:start} /* César, 17/10: topo do título alinhado com o topo da coluna de texto */
.simhero > .eyebrow{grid-column:1 / -1; margin:0 0 var(--sp-10); white-space:nowrap} /* título da secção numa só linha, por cima da animação (César, 17/10) */
.simmain{display:flow-root}
.simmain h2{margin:0; text-wrap:pretty}
.simmain .simsub{margin:var(--sp-16) 0 0; font-size:clamp(1rem, 1.5vw, 1.15rem); line-height:1.5; color:var(--mut); max-width:none; text-wrap:pretty} /* legenda por baixo do título, letra mais pequena (César, 17/10) */
/* a máquina flutua à direita e o título acompanha o contorno da imagem: shape-outside = silhueta esquerda de lab/maquina.webp (medida no alpha, em % da caixa). César, 18/10: um pouco mais baixa (margin-top) e mais à direita (margem direita negativa; #simulador tem overflow:hidden) */
.simmain .simfig{float:right; width:62.5%; margin:clamp(24px,4vw,56px) calc(-1 * clamp(0px, (100vw - 1180px) / 2 - 20px, 40px)) 0 0; shape-outside:polygon(44% 0%, 100% 0%, 100% 100%, 50% 100%, 33% 96%, 12% 93%, 3% 88.5%, .6% 84%, .8% 72%, 1.6% 58%, 2.4% 46%, 3% 41%, 5% 38.5%, 14% 36.3%, 23.5% 34.5%, 24.3% 24%, 25.5% 15%, 28% 11.5%, 35% 8.5%, 39% 5.5%, 41% 2.5%); shape-margin:clamp(34px,4.5vw,64px)}
#simulador .lead{max-width:none; margin:0}
.simtext{display:grid; gap:var(--sp-14); justify-items:end; text-align:right} /* César, 17/10: texto à direita, pergunta isolada num parágrafo, botão à direita */
.simq{color:var(--tx)}
.simctas{display:flex; flex-wrap:wrap; flex-direction:row-reverse; gap:var(--sp-14); margin-top:var(--sp-14)}
.simfig{position:relative; width:100%}
/* ecrãs animados da máquina: espaço fixo 1400×795 (tamanho do webp) escalado por --ms (ResizeObserver em _fitMaq) */
.mwall{position:absolute; inset:0; overflow:hidden; pointer-events:none}
.mwd{position:absolute; left:0; top:0; width:1400px; height:795px; transform-origin:0 0; transform:scale(var(--ms,1))}
.mslot{background:var(--c-07100f); isolation:isolate} /* quadros já projetados e recortados ao vidro (lab/maqp-*.webp, tmp/maq-bake.js): sem matrix3d no DOM */
.mslot .tvf{filter:brightness(1.08) contrast(1.04) saturate(1.05)}
.mslot .tvscan{opacity:.32}
.mlamp{position:absolute; border-radius:var(--r-round); pointer-events:none; background:radial-gradient(closest-side, var(--c-rgba-255-200-120-92), var(--c-rgba-255-138-24-5) 42%, var(--c-rgba-255-96-0-0) 100%); filter:blur(4px); animation:mlamp 3.4s ease-in-out infinite; opacity:.55; transition:opacity .35s} /* halos sobre as luzes reais da máquina (tmp/maq-lamps.json) */
.mlamp[data-k="tube"]{animation-name:mtube; animation-timing-function:steps(1,end)}
/* intensidade de processamento (César, 17/10): data-load em .mwd sobe quando um ecrã muda e decai em patamares (ver _maqLoad); as luzes respiram devagar em repouso e cintilam depressa e mais fortes sob carga */
.mwd[data-load="1"] .mlamp{animation-duration:1.6s !important; opacity:.8}
.mwd[data-load="2"] .mlamp{animation-duration:.9s !important; opacity:.95}
.mwd[data-load="3"] .mlamp{animation-name:mburst; animation-duration:.42s !important; opacity:1; filter:blur(3px) brightness(1.25)}
.mwd[data-load="3"] .mlamp[data-k="tube"]{animation-name:mtube; animation-duration:.5s !important; animation-timing-function:steps(1,end)}
@keyframes mlamp{0%,100%{opacity:.45; transform:scale(.94)} 50%{opacity:1; transform:scale(1.12)}}
@keyframes mburst{0%,100%{opacity:.6; transform:scale(1)} 30%{opacity:1; transform:scale(1.28)} 55%{opacity:.75; transform:scale(1.05)} 75%{opacity:1; transform:scale(1.2)}}
@keyframes mtube{0%,100%{opacity:.85} 6%{opacity:.45} 9%{opacity:1} 30%{opacity:.75} 33%{opacity:.3} 36%{opacity:.95} 58%{opacity:.7} 61%{opacity:1} 80%{opacity:.55}}
@media (prefers-reduced-motion:reduce){ .mlamp:not([data-k="vu"]),.cyh[data-on="true"]{animation:none !important} }
/* fita LED da máquina como medidor de som/processamento (César, 19/10): .mled sobre a barra vertical ao lado do ecrã central (medida em lab/maquina.webp: centro 552.7,244 · 17×95 · 3.8°); 14 segmentos, nível em degraus com ataque instantâneo e queda gradual + segmento de pico; mvuA = repouso, mvuB = carga 2–3 (data-load); o halo data-k="vu" segue o mesmo nível. Corre mesmo com «reduzir movimento» (como o retrato da equipa e as tecnologias). Sequências geradas por PRNG (sementes 7/11). */
.mled{position:absolute; pointer-events:none; border-radius:var(--r-8)}
.mledoff{position:absolute; inset:0; border-radius:inherit; background:repeating-linear-gradient(to top, var(--c-rgba-110-46-10-6) 0 5.14%, var(--c-rgba-0-0-0-55) 5.14% 7.14%), linear-gradient(90deg, var(--c-1a0c05), var(--c-2e1509) 50%, var(--c-1a0c05)); opacity:.95}
.mledglow{position:absolute; inset:0; filter:drop-shadow(0 0 2px var(--c-rgba-255-170-60-95)) drop-shadow(0 0 7px var(--c-rgba-255-110-0-75))}
.mledon{position:absolute; inset:0; border-radius:var(--r-8); background:linear-gradient(to top, var(--c-ff5a00), var(--c-ff8a1c) 40%, var(--c-ffb347) 72%, var(--c-ffe9b8)); -webkit-mask:repeating-linear-gradient(to top, var(--c-000000) 0 5.14%, transparent 5.14% 7.14%); mask:repeating-linear-gradient(to top, var(--c-000000) 0 5.14%, transparent 5.14% 7.14%); animation:mvuA 4.2s steps(1,end) infinite}
.mledpk{position:absolute; left:1px; right:1px; height:5.14%; border-radius:var(--r-2); background:var(--c-fff3d6); animation:mpkA 4.2s steps(1,end) infinite}
.mwd[data-load="1"] .mledon, .mwd[data-load="1"] .mledpk{animation-duration:3.4s}
.mwd[data-load="2"] .mledon{animation-name:mvuB; animation-duration:3s} .mwd[data-load="2"] .mledpk{animation-name:mpkB; animation-duration:3s}
.mwd[data-load="3"] .mledon{animation-name:mvuB; animation-duration:2.4s} .mwd[data-load="3"] .mledpk{animation-name:mpkB; animation-duration:2.4s}
.mlamp[data-k="vu"]{animation:mvhA 4.2s steps(1,end) infinite !important}
.mwd[data-load="1"] .mlamp[data-k="vu"]{animation:mvhA 3.4s steps(1,end) infinite !important}
.mwd[data-load="2"] .mlamp[data-k="vu"]{animation:mvhB 3s steps(1,end) infinite !important}
.mwd[data-load="3"] .mlamp[data-k="vu"]{animation:mvhB 2.4s steps(1,end) infinite !important}
@keyframes mvuA{0%{clip-path:inset(50% 0 0 0)}2.5%{clip-path:inset(57.14% 0 0 0)}5%{clip-path:inset(71.43% 0 0 0)}7.5%{clip-path:inset(57.14% 0 0 0)}10%{clip-path:inset(64.29% 0 0 0)}12.5%{clip-path:inset(57.14% 0 0 0)}15%{clip-path:inset(57.14% 0 0 0)}17.5%{clip-path:inset(64.29% 0 0 0)}20%{clip-path:inset(42.86% 0 0 0)}22.5%{clip-path:inset(35.71% 0 0 0)}25%{clip-path:inset(42.86% 0 0 0)}27.5%{clip-path:inset(50% 0 0 0)}30%{clip-path:inset(28.57% 0 0 0)}32.5%{clip-path:inset(35.71% 0 0 0)}35%{clip-path:inset(42.86% 0 0 0)}37.5%{clip-path:inset(50% 0 0 0)}40%{clip-path:inset(64.29% 0 0 0)}42.5%{clip-path:inset(71.43% 0 0 0)}45%{clip-path:inset(78.57% 0 0 0)}47.5%{clip-path:inset(21.43% 0 0 0)}50%{clip-path:inset(35.71% 0 0 0)}52.5%{clip-path:inset(42.86% 0 0 0)}55%{clip-path:inset(50% 0 0 0)}57.5%{clip-path:inset(57.14% 0 0 0)}60%{clip-path:inset(64.29% 0 0 0)}62.5%{clip-path:inset(21.43% 0 0 0)}65%{clip-path:inset(35.71% 0 0 0)}67.5%{clip-path:inset(21.43% 0 0 0)}70%{clip-path:inset(28.57% 0 0 0)}72.5%{clip-path:inset(42.86% 0 0 0)}75%{clip-path:inset(50% 0 0 0)}77.5%{clip-path:inset(57.14% 0 0 0)}80%{clip-path:inset(64.29% 0 0 0)}82.5%{clip-path:inset(71.43% 0 0 0)}85%{clip-path:inset(57.14% 0 0 0)}87.5%{clip-path:inset(42.86% 0 0 0)}90%{clip-path:inset(57.14% 0 0 0)}92.5%{clip-path:inset(64.29% 0 0 0)}95%{clip-path:inset(64.29% 0 0 0)}97.5%{clip-path:inset(57.14% 0 0 0)}100%{clip-path:inset(50% 0 0 0)}}
@keyframes mvuB{0%{clip-path:inset(28.57% 0 0 0)}2.5%{clip-path:inset(35.71% 0 0 0)}5%{clip-path:inset(35.71% 0 0 0)}7.5%{clip-path:inset(7.14% 0 0 0)}10%{clip-path:inset(14.29% 0 0 0)}12.5%{clip-path:inset(28.57% 0 0 0)}15%{clip-path:inset(42.86% 0 0 0)}17.5%{clip-path:inset(42.86% 0 0 0)}20%{clip-path:inset(28.57% 0 0 0)}22.5%{clip-path:inset(28.57% 0 0 0)}25%{clip-path:inset(0% 0 0 0)}27.5%{clip-path:inset(7.14% 0 0 0)}30%{clip-path:inset(0% 0 0 0)}32.5%{clip-path:inset(14.29% 0 0 0)}35%{clip-path:inset(0% 0 0 0)}37.5%{clip-path:inset(7.14% 0 0 0)}40%{clip-path:inset(7.14% 0 0 0)}42.5%{clip-path:inset(21.43% 0 0 0)}45%{clip-path:inset(28.57% 0 0 0)}47.5%{clip-path:inset(42.86% 0 0 0)}50%{clip-path:inset(50% 0 0 0)}52.5%{clip-path:inset(50% 0 0 0)}55%{clip-path:inset(14.29% 0 0 0)}57.5%{clip-path:inset(28.57% 0 0 0)}60%{clip-path:inset(14.29% 0 0 0)}62.5%{clip-path:inset(28.57% 0 0 0)}65%{clip-path:inset(42.86% 0 0 0)}67.5%{clip-path:inset(14.29% 0 0 0)}70%{clip-path:inset(28.57% 0 0 0)}72.5%{clip-path:inset(28.57% 0 0 0)}75%{clip-path:inset(28.57% 0 0 0)}77.5%{clip-path:inset(21.43% 0 0 0)}80%{clip-path:inset(35.71% 0 0 0)}82.5%{clip-path:inset(0% 0 0 0)}85%{clip-path:inset(7.14% 0 0 0)}87.5%{clip-path:inset(21.43% 0 0 0)}90%{clip-path:inset(14.29% 0 0 0)}92.5%{clip-path:inset(14.29% 0 0 0)}95%{clip-path:inset(21.43% 0 0 0)}97.5%{clip-path:inset(35.71% 0 0 0)}100%{clip-path:inset(28.57% 0 0 0)}}
@keyframes mpkA{0%{top:30.57%}2.5%{top:30.57%}5%{top:30.57%}7.5%{top:30.57%}10%{top:37.71%}12.5%{top:44.86%}15%{top:52%}17.5%{top:59.14%}20%{top:44.86%}22.5%{top:37.71%}25%{top:37.71%}27.5%{top:37.71%}30%{top:30.57%}32.5%{top:30.57%}35%{top:30.57%}37.5%{top:30.57%}40%{top:30.57%}42.5%{top:30.57%}45%{top:37.71%}47.5%{top:23.43%}50%{top:23.43%}52.5%{top:23.43%}55%{top:23.43%}57.5%{top:23.43%}60%{top:23.43%}62.5%{top:23.43%}65%{top:23.43%}67.5%{top:23.43%}70%{top:23.43%}72.5%{top:23.43%}75%{top:23.43%}77.5%{top:23.43%}80%{top:23.43%}82.5%{top:30.57%}85%{top:37.71%}87.5%{top:44.86%}90%{top:52%}92.5%{top:59.14%}95%{top:66.29%}97.5%{top:59.14%}100%{top:30.57%}}
@keyframes mpkB{0%{top:23.43%}2.5%{top:30.57%}5%{top:37.71%}7.5%{top:9.14%}10%{top:9.14%}12.5%{top:9.14%}15%{top:9.14%}17.5%{top:9.14%}20%{top:16.29%}22.5%{top:23.43%}25%{top:2%}27.5%{top:2%}30%{top:2%}32.5%{top:2%}35%{top:2%}37.5%{top:2%}40%{top:2%}42.5%{top:2%}45%{top:2%}47.5%{top:9.14%}50%{top:16.29%}52.5%{top:23.43%}55%{top:16.29%}57.5%{top:16.29%}60%{top:16.29%}62.5%{top:16.29%}65%{top:16.29%}67.5%{top:16.29%}70%{top:16.29%}72.5%{top:16.29%}75%{top:16.29%}77.5%{top:16.29%}80%{top:23.43%}82.5%{top:2%}85%{top:2%}87.5%{top:2%}90%{top:2%}92.5%{top:2%}95%{top:9.14%}97.5%{top:16.29%}100%{top:23.43%}}
@keyframes mvhA{0%{opacity:0.6}2.5%{opacity:0.54}5%{opacity:0.43}7.5%{opacity:0.54}10%{opacity:0.49}12.5%{opacity:0.54}15%{opacity:0.54}17.5%{opacity:0.49}20%{opacity:0.66}22.5%{opacity:0.71}25%{opacity:0.66}27.5%{opacity:0.6}30%{opacity:0.77}32.5%{opacity:0.71}35%{opacity:0.66}37.5%{opacity:0.6}40%{opacity:0.49}42.5%{opacity:0.43}45%{opacity:0.37}47.5%{opacity:0.83}50%{opacity:0.71}52.5%{opacity:0.66}55%{opacity:0.6}57.5%{opacity:0.54}60%{opacity:0.49}62.5%{opacity:0.83}65%{opacity:0.71}67.5%{opacity:0.83}70%{opacity:0.77}72.5%{opacity:0.66}75%{opacity:0.6}77.5%{opacity:0.54}80%{opacity:0.49}82.5%{opacity:0.43}85%{opacity:0.54}87.5%{opacity:0.66}90%{opacity:0.54}92.5%{opacity:0.49}95%{opacity:0.49}97.5%{opacity:0.54}100%{opacity:0.6}}
@keyframes mvhB{0%{opacity:0.77}2.5%{opacity:0.71}5%{opacity:0.71}7.5%{opacity:0.94}10%{opacity:0.89}12.5%{opacity:0.77}15%{opacity:0.66}17.5%{opacity:0.66}20%{opacity:0.77}22.5%{opacity:0.77}25%{opacity:1}27.5%{opacity:0.94}30%{opacity:1}32.5%{opacity:0.89}35%{opacity:1}37.5%{opacity:0.94}40%{opacity:0.94}42.5%{opacity:0.83}45%{opacity:0.77}47.5%{opacity:0.66}50%{opacity:0.6}52.5%{opacity:0.6}55%{opacity:0.89}57.5%{opacity:0.77}60%{opacity:0.89}62.5%{opacity:0.77}65%{opacity:0.66}67.5%{opacity:0.89}70%{opacity:0.77}72.5%{opacity:0.77}75%{opacity:0.77}77.5%{opacity:0.83}80%{opacity:0.71}82.5%{opacity:1}85%{opacity:0.94}87.5%{opacity:0.83}90%{opacity:0.89}92.5%{opacity:0.89}95%{opacity:0.83}97.5%{opacity:0.71}100%{opacity:0.77}}
.mslot::after{inset:1% 1%; border-radius:5% / 7%}

.simfig::before{content:""; position:absolute; inset:14% 10%; border-radius:var(--r-round); background:radial-gradient(closest-side, color-mix(in srgb, var(--acc) 30%, transparent), transparent 72%); filter:blur(26px); animation:simglow 7s ease-in-out infinite}
@keyframes simglow{0%,100%{opacity:.45} 50%{opacity:1}}
.simimg{position:relative; display:block; width:100%; height:auto; filter:drop-shadow(0 28px 36px var(--c-rgba-0-0-0-42))}
.simflow{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:var(--r-4); overflow:hidden; margin-top:clamp(36px,5vw,60px)}
.simstep{padding:var(--sp-26) var(--sp-22) var(--sp-30); border-left:1px solid var(--line); position:relative}
.simstep:first-child{border-left:0}
.simstep::after{content:""; position:absolute; left:22px; top:0; width:34px; height:2px; background:var(--acc)}
.simstep i{font-family:var(--font-mono); font-style:normal; font-size:var(--fs-r064); letter-spacing:.18em; color:var(--mut); text-transform:uppercase}
.simstep h3{margin:var(--sp-12) 0 var(--sp-10); font-size:var(--fs-r130)}
.simstep p{margin:0; color:var(--mut); font-size:var(--fs-r092)}
.simsign{margin-top:var(--sp-14); display:grid; grid-template-columns:minmax(0,1fr) fit-content(52%); gap:clamp(22px,4vw,52px); border:1px solid var(--acc); border-radius:var(--r-4); padding:clamp(20px,3vw,28px)} /* a lista dos passos leva a largura de que precisa: cada passo numa linha (César, 17/10) */
.simk{font-size:var(--fs-r130); line-height:1.2; letter-spacing:-.01em; color:var(--tx); margin:0 0 var(--sp-18)} /* título do cartão maior que o texto e mais afastado dele (César, 17/10) */
.simsign p{margin:0; color:var(--mut); max-width:none}
.simsteps{list-style:none; margin:0; padding:0; display:grid; gap:var(--sp-12); align-content:center}
.simsteps li{display:grid; grid-template-columns:28px 1fr; gap:var(--sp-12); align-items:center; font-size:var(--fs-r095)}
.simsteps b{font-family:var(--font-mono); font-weight:400; font-size:var(--fs-r070); color:var(--acc); border:1px solid var(--acc); border-radius:var(--r-pill); width:28px; height:28px; display:inline-grid; place-items:center}
@media (max-width:1100px){ .simhero{grid-template-columns:1fr} .simmain .simfig{width:58%} }
@media (max-width:900px){
  .simflow{grid-template-columns:1fr} .simstep{border-left:0} .simstep+.simstep{border-top:1px solid var(--line)}
  .simsign{grid-template-columns:1fr}
}
@media (max-width:700px){
  .simhero > .eyebrow{white-space:normal}
  .simmain .simfig{float:none; width:100%; shape-outside:none; margin:0 0 var(--sp-18)}
  .simtext{text-align:left; justify-items:start} .simctas{flex-direction:row}
}
.form{display:grid; gap:var(--sp-20); margin-top:var(--sp-8)}
.frow{display:grid; gap:var(--sp-20); grid-template-columns:1fr 1fr}
@media (max-width:640px){ .frow{grid-template-columns:1fr} }
.fld{display:grid; gap:var(--sp-8)}
.fld label{font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.16em; text-transform:uppercase; color:var(--mut)}
.fld input,.fld select,.fld textarea{ background:var(--ink2); color:var(--tx); border:1px solid var(--line2); border-radius:var(--r-4); padding:var(--sp-13) var(--sp-14); font:inherit; font-size:var(--fs-r096); width:100%; min-height:48px; }
.fld textarea{min-height:130px; resize:vertical}
.fld input::placeholder,.fld textarea::placeholder{color:var(--mut); opacity:.9}
#contacto .form input, #contacto .form select{padding:var(--sp-6) var(--sp-10); min-height:0; font-size:var(--fs-r088)}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--acc); outline-offset:1px; border-color:var(--acc)}
.fld .ferr{color:var(--err); font-size:var(--fs-r080); display:none; margin:0}
.fld.bad input,.fld.bad select,.fld.bad textarea{border-color:var(--err)}
.fld.bad .ferr{display:block}
.consent{display:flex; gap:var(--sp-12); align-items:flex-start; color:var(--mut); font-size:var(--fs-r088)}
.consent input{width:20px; height:20px; margin-top:var(--sp-2); accent-color:var(--acc); flex:none}
.hpwrap{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.fmsg{font-family:var(--font-mono); font-size:var(--fs-r080); margin:0; display:none}
.fmsg.on{display:block}
.fmsg.ok{color:var(--ok)} .fmsg.err{color:var(--err)}
footer{border-top:1px solid var(--line); padding:var(--sp-34) 0 var(--sp-46); color:var(--mut); font-size:var(--fs-r090)}
footer .cols{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr); gap:var(--sp-34)}
footer .cols a{overflow-wrap:anywhere}
footer .cols .brand span{white-space:normal; line-height:1.5} /* slogan quebra em qualquer largura */
footer h4{font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.18em; text-transform:uppercase; color:var(--tx); margin:0 0 var(--sp-14); font-weight:400}
footer ul{list-style:none; margin:0; padding:0; display:grid; gap:var(--sp-9)}
footer a{color:var(--mut)}
footer a:hover{color:var(--acc)}
footer .cols>div{display:flex; flex-direction:column}
footer .cols>div>ul{flex:1; display:flex; flex-direction:column; gap:var(--sp-9)}
footer .cols>.fnav>ul{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-9) var(--sp-18); align-content:start} /* navegação em duas colunas */
@media (min-width:1000px){ footer .cols>.fnav a{white-space:nowrap} }
@media (max-width:999px){ footer .cols>.fnav>ul{grid-template-columns:1fr} }
footer .cols .fsoc{margin-top:auto} /* redes alinhadas com Área reservada */
.fsoc{display:flex; gap:var(--sp-12); margin-top:var(--sp-8)}
.fsoc a{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--line2); border-radius:var(--r-round); color:var(--mut)}
.fsoc a:hover{color:var(--acc); border-color:var(--acc)}
.legal{margin-top:var(--sp-44); padding-top:var(--sp-20); padding-right:var(--sp-96); border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:var(--sp-14); justify-content:space-between; font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.1em; text-transform:uppercase}
.lterms{display:flex; gap:var(--sp-18); flex-wrap:wrap}
.lterm{position:relative}
.lterm>a{color:var(--mut); border-bottom:1px dotted var(--line2); padding-bottom:var(--sp-2)}
.lterm>a:hover{color:var(--acc); text-decoration:none; border-bottom-color:var(--acc)}
.lpop{ position:absolute; bottom:calc(100% + 14px); right:-6px; width:min(300px, 78vw); display:grid; gap:var(--sp-8); background:color-mix(in srgb, var(--ink2) 96%, transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border:1px solid var(--line2); border-radius:var(--r-8); padding:var(--sp-14) var(--sp-16); opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .22s ease, transform .22s ease, visibility .22s; z-index:55; font-family:var(--font-body); font-size:var(--fs-r082); letter-spacing:0; text-transform:none; line-height:1.55; color:var(--mut); text-align:left; white-space:normal; box-shadow:var(--sh-4); }
.lpop::after{content:""; position:absolute; top:-1px; left:-1px; width:9px; height:9px; border-left:1.5px solid var(--acc); border-top:1.5px solid var(--acc)}
.lpop b{font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--acc); font-weight:400}
.lpop i{font-style:normal; display:flex; align-items:center; gap:var(--sp-7); font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.12em; text-transform:uppercase; color:var(--tx)}
.lpop i::before{content:"→"; color:var(--acc)}
.lterm:hover .lpop, .lterm:focus-within .lpop{opacity:1; visibility:visible; transform:none}
@media (max-width:760px){ footer .cols{grid-template-columns:1fr} }
.a11y-ui .fabwrap{position:fixed; right:18px; bottom:18px; z-index:70}
.a11y-ui .fab{ position:relative; width:62.6px; height:62.6px; border-radius:var(--r-round); border:1px solid var(--acc); background:var(--ink2); color:var(--acc); padding:0; overflow:hidden; cursor:pointer; display:block; box-shadow:var(--sh-5); }
.a11y-ui .fab img, .a11y-ui .fab canvas{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; pointer-events:none}
.a11y-ui .fab canvas{z-index:2}
.a11y-ui .fab.playing canvas{visibility:hidden}
.fab.anim-nudge{animation:fnudge 1.15s ease}
@keyframes fnudge{0%,100%{transform:none} 20%{transform:rotate(-10deg) scale(1.08)} 45%{transform:rotate(8deg)} 70%{transform:rotate(-4deg) scale(1.03)}}
.fab.anim-bounce{animation:fbounce 1.15s cubic-bezier(.3,1.4,.4,1)}
@keyframes fbounce{0%,100%{transform:none} 30%{transform:translateY(-10px) scale(1.05)} 60%{transform:translateY(0) scale(.96)} 80%{transform:translateY(-4px)}}
.fab.anim-pulse{animation:fpulse 1.15s ease}
@keyframes fpulse{0%,100%{transform:none} 40%{transform:scale(1.1); box-shadow:var(--sh-6)} 70%{transform:scale(1)}}
.fabtip{position:absolute; right:calc(100% + 13px); top:50%; transform:translateY(-50%) translateX(6px); background:var(--ink2); border:1px solid var(--line2); color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.14em; text-transform:uppercase; white-space:nowrap; padding:var(--sp-8) var(--sp-12); border-radius:var(--r-4); opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease}
.a11y-ui .fabwrap:hover .fabtip, .a11y-ui .fab:focus-visible ~ .fabtip{opacity:1; transform:translateY(-50%) translateX(0)}
@media (prefers-reduced-motion:reduce){ .fab.anim-nudge, .fab.anim-bounce, .fab.anim-pulse{animation:none} }
.botbtn{text-align:left; justify-content:flex-start}
.chatbox{display:grid; gap:var(--sp-10); grid-template-columns:minmax(0,1fr)}
.chatlog{max-height:220px; overflow-y:auto; scrollbar-width:thin; display:grid; gap:var(--sp-8); padding:var(--sp-4) 0; grid-template-columns:minmax(0,1fr)}
.cmsg{margin:0; font-size:var(--fs-r084); line-height:1.5; padding:var(--sp-9) var(--sp-12); border-radius:var(--r-10); max-width:100%; width:100%; box-sizing:border-box; overflow-wrap:anywhere}
.cmsg.b{background:color-mix(in srgb, var(--acc) 12%, transparent); color:var(--tx); justify-self:start; border-bottom-left-radius:var(--r-2)}
.cmsg.u{background:var(--acc); color:var(--ink); justify-self:end; border-bottom-right-radius:var(--r-2)}
.chatchips{display:flex; gap:var(--sp-6); flex-wrap:wrap; justify-content:space-between}
.chatchips button{font-family:var(--font-mono); font-size:var(--fs-r058); letter-spacing:.12em; text-transform:uppercase; background:none; border:0; border-radius:0; color:var(--mut); padding:var(--sp-6) 0; cursor:pointer; text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--line2)}
.chatchips button:hover{color:var(--acc); text-decoration-color:var(--acc)}
.chatin{position:relative; display:flex}
.chatin input{flex:1; width:100%; background:var(--ink); color:var(--tx); border:1px solid var(--line2); border-radius:var(--r-pill); padding:var(--sp-10) var(--sp-46) var(--sp-10) var(--sp-14); font:inherit; font-size:var(--fs-r086); min-width:0}
.chatin input:focus{outline:2px solid var(--acc); border-color:var(--acc)}
.chatin button{position:absolute; right:5px; top:50%; transform:translateY(-50%); width:32px; height:32px; padding:0; border:1px solid var(--acc); background:var(--acc); color:var(--ink); border-radius:var(--r-pill); cursor:pointer; display:inline-flex; align-items:center; justify-content:center}
.chatin button svg{width:14px; height:14px}
.chatback{background:none; border:0; color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.14em; text-transform:uppercase; cursor:pointer; padding:var(--sp-4) 0; text-align:left}
.chatback:hover{color:var(--acc)}
.a11y-ui .panel{ position:fixed; right:18px; bottom:84px; z-index:70; width:min(288px, calc(100vw - 36px)); height:min(478px, calc(100vh - 110px)); background:var(--ink2); background:color-mix(in srgb, var(--ink2) 80%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid var(--line2); border-radius:var(--r-10); padding:var(--sp-20); display:none; box-shadow:var(--sh-7); }
.a11y-ui .panel.on{display:flex; flex-direction:column}
.a11y-ui .pwin{border:1px solid var(--line2); border-radius:var(--r-10) var(--r-10) 0 0; padding:var(--sp-14); background:var(--ink); flex:1; min-height:0; overflow-y:auto; scrollbar-width:thin; display:flex; flex-direction:column}
.a11y-ui .ptabs{display:flex; gap:var(--sp-6); margin:-1px 0 0; padding:0; flex:0 0 auto}
.a11y-ui .ptab{flex:1; padding:var(--sp-10) var(--sp-8); background:transparent; border:1px solid var(--line2); border-top:0; border-radius:0 0 var(--r-10) var(--r-10); color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.14em; text-transform:uppercase; cursor:pointer}
.a11y-ui .ptab:hover{color:var(--acc)}
.a11y-ui .ptab[aria-pressed="true"]{background:var(--ink); color:var(--acc)}
.pinrow{display:flex; justify-content:flex-end; margin:0 0 var(--sp-10)}
.pinbtn{background:none; border:1px solid var(--line2); border-radius:var(--r-8); color:var(--mut); font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.12em; text-transform:uppercase; padding:var(--sp-7) var(--sp-10); cursor:pointer}
.pinbtn:hover{border-color:var(--acc); color:var(--acc)}
.pinrow{display:flex}
.pinrow .pinbtn{flex:1; padding:var(--sp-9) var(--sp-10)}
.chatdock{position:fixed; left:18px; top:18px; bottom:18px; z-index:80; width:min(340px, calc(100vw - 36px)); display:flex; flex-direction:column; gap:var(--sp-12); background:var(--ink2); background:color-mix(in srgb, var(--ink2) 84%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid var(--line2); border-radius:var(--r-12); padding:var(--sp-16); box-shadow:var(--sh-8)}
.dockbar{display:flex; align-items:center; gap:var(--sp-10)}
.dockbar b{font-size:var(--fs-r095)}
.dockbar .sp{flex:1}
.chatdock .chatbox{flex:1; min-height:0; grid-template-rows:minmax(0,1fr) auto auto}
.chatdock .chatlog{max-height:none; min-height:0; overflow:auto}
.a11y-ui .pwin .chatbox{flex:1; min-height:0; grid-template-rows:minmax(0,1fr) auto auto}
.a11y-ui .pwin .chatlog{max-height:none; min-height:120px}
.a11y-ui .pwin .pinrow{margin:0 0 var(--sp-8)}
.a11y-ui h2{font-size:var(--fs-r100); margin:0 0 var(--sp-16); letter-spacing:0}
.a11y-ui .grp{display:grid; gap:var(--sp-7); margin-bottom:var(--sp-12)}
.a11y-ui .grp>span{font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--mut)}
.a11y-ui .row{display:flex; gap:var(--sp-8); flex-wrap:wrap}
.a11y-ui .ab{ border:1px solid var(--line2); background:transparent; color:var(--tx); border-radius:var(--r-6); padding:var(--sp-9) var(--sp-13); font:inherit; font-size:var(--fs-r082); cursor:pointer; min-height:40px; flex:1; }
.a11y-ui .ab[aria-pressed="true"]{background:var(--acc); color:var(--ink); border-color:var(--acc); font-weight:600}
.a11y-ui .close{position:absolute; top:10px; right:10px; background:none; border:0; color:var(--mut); font-size:var(--fs-r120); cursor:pointer; width:36px; height:36px}
.rv{opacity:0; transform:translateY(16px)}
.rv.on{opacity:1; transform:none; transition:opacity .7s ease, transform .7s ease}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .aurora i{animation:none}
  .rv{opacity:1; transform:none; transition:none}
  .btn,.pmark,.pbody{transition:none}
}
.hb{list-style:none;display:flex;flex-wrap:wrap;gap:var(--sp-8) var(--sp-10);margin:var(--sp-22) 0 0;padding:0}
.hb li{font-family:var(--font-mono);font-size:var(--fs-r066);letter-spacing:.12em;text-transform:uppercase;color:var(--mut);border:1px solid var(--line);border-radius:var(--r-pill);padding:var(--sp-7) var(--sp-12)}
.hb li::before{content:"✓ ";color:var(--acc2)}
.audintro{font-size:var(--fs-r095);color:var(--mut);margin:var(--sp-14) 0 0;max-width:none}
.audintro2{font-size:var(--fs-r086);color:color-mix(in srgb, var(--mut) 78%, transparent);margin:var(--sp-8) 0 0;max-width:none;line-height:1.6}
.gate{position:relative;margin-top:var(--sp-30);border:1px solid var(--line2);background:var(--ink2);padding:var(--sp-24) clamp(18px,3vw,32px) var(--sp-22)}
.gate::before,.gate::after{content:"";position:absolute;width:12px;height:12px;border:1.5px solid var(--acc);pointer-events:none}
.gate::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.gate::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.gate-k{font-family:var(--font-mono);font-size:var(--fs-r066);letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin:0 0 var(--sp-18);display:flex;align-items:center;gap:var(--sp-12)}
.gate-k::after{content:"";flex:1;height:1px;background:var(--line)}
.gcards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-12)}
@media (max-width:760px){.gcards{grid-template-columns:1fr}}
.gcard{display:grid;gap:var(--sp-8);text-align:left;background:transparent;border:1px solid var(--line2);padding:var(--sp-16) var(--sp-16) var(--sp-18);cursor:pointer;color:var(--tx);font:inherit;transition:border-color .18s ease, background .18s ease, transform .18s ease}
.gcard .gid{font-family:var(--font-mono);font-size:var(--fs-r060);letter-spacing:.16em;color:var(--mut)}
.gcard b{font-family:var(--font-display);font-size:var(--fs-r114);font-weight:700;letter-spacing:-.01em}
.gcard .gd{font-size:var(--fs-r084);color:var(--mut);line-height:1.5}
.gcard:hover{border-color:var(--acc);background:color-mix(in srgb, var(--acc) 9%, transparent);transform:translateY(-2px)}
.gcard:hover .gid{color:var(--acc)}
.gtimer{display:flex;align-items:center;gap:var(--sp-16);margin-top:var(--sp-18);flex-wrap:wrap}
.gmsg{font-family:var(--font-mono);font-size:var(--fs-r064);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.gtrack{flex:1;min-width:120px;height:2px;background:var(--line);border-radius:var(--r-2);overflow:hidden}
.gbar{display:block;height:100%;background:var(--acc);transition:width 1s linear}
.austat{display:flex;align-items:baseline;gap:var(--sp-14);flex-wrap:wrap;margin-top:var(--sp-30);border-top:1px solid var(--line2);padding-top:var(--sp-16)}
.austat{position:relative}
.austat .ak{position:absolute;top:0;left:0;transform:translateY(-50%);background:var(--ink);padding:var(--sp-2) var(--sp-16) var(--sp-2) 0;font-family:var(--font-mono);font-size:var(--fs-r062);letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
.austat b{font-family:var(--font-mono);font-size:var(--fs-r080);letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.aalts{margin-left:auto;display:flex;gap:var(--sp-22);flex-wrap:wrap;align-items:baseline}
.aalt{background:none;border:0;padding:0;cursor:pointer;font-family:var(--font-mono);font-size:var(--fs-r110);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);opacity:.4;transition:opacity .18s ease, color .18s ease}
.aalt:hover{opacity:1;color:var(--acc)}
.aalt[aria-pressed="true"]{opacity:1;color:var(--brand);font-weight:700} /* perfil ativo em laranja (César, 17/10) */
.filters2{display:grid; grid-template-columns:repeat(5, 1fr); gap:var(--sp-10); margin-top:var(--sp-22)}
@media (max-width:860px){ .filters2{grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:var(--sp-8)} }
.fchk{display:flex; align-items:center; gap:var(--sp-12); background:var(--ink2); border:1px solid var(--line); padding:var(--sp-12) var(--sp-14); min-height:52px; cursor:pointer; font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.1em; text-transform:uppercase; color:var(--mut); text-align:left; line-height:1.45; transition:border-color .16s ease, background .16s ease, color .16s ease}
.fchk .fbox{width:36px; height:36px; border:1px solid var(--line2); flex:none; display:grid; place-items:center; transition:background .16s ease, border-color .16s ease}
.fchk .fbox::after{content:attr(data-letter); font-family:var(--font-display); font-size:var(--fs-r092); font-weight:700; line-height:1; color:var(--mut); transition:color .16s ease}
.fchk .fbox[data-letter="A–D"]::after{font-size:var(--fs-r056); letter-spacing:.04em}
.fchk:hover{color:var(--tx); border-color:var(--acc)}
.fchk:hover .fbox{border-color:var(--acc)}
.fchk[aria-pressed="true"]{color:var(--tx); border-color:var(--acc); background:color-mix(in srgb, var(--acc) 10%, var(--ink2))}
.fchk:hover .fbox::after{color:var(--tx)}
.fchk[aria-pressed="true"] .fbox{background:var(--acc); border-color:var(--acc)}
.fchk[aria-pressed="true"] .fbox::after{color:var(--ink)}
.fleg{font-family:var(--font-mono); font-size:var(--fs-r074); letter-spacing:.14em; text-transform:uppercase; color:var(--mut); margin:var(--sp-28) 0 0; display:flex; align-items:center; gap:var(--sp-12); width:100%; max-width:none}
.fleg::before{content:""; width:22px; height:1px; background:var(--acc); flex:none}
.proprow{border-bottom:1px dashed var(--line2)}
.proprow .phead:hover .pname{color:var(--acc2)}
.proprow .pmark{border-style:dashed}
.regwrap{position:relative}
.regwrap.veiled .reg{filter:blur(7px) saturate(.6);opacity:.4;pointer-events:none;user-select:none}
.regseal{position:absolute;inset:0;z-index:3;display:grid;place-items:center}
.regseal span{font-family:var(--font-mono);font-size:var(--fs-r068);letter-spacing:.22em;text-transform:uppercase;color:var(--tx);background:color-mix(in srgb, var(--ink) 78%, transparent);border:1px dashed var(--line2);padding:var(--sp-12) var(--sp-20)}
/* mosaico: 1–3 colunas; o cartão clicado vira painel 2×2 (ou 2×1 em 2 colunas) e os restantes reorganizam-se (dense); a mudança anima com View Transitions */
.tchips{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,max(280px,30%)),1fr));grid-auto-flow:dense;gap:var(--sp-14);margin:var(--sp-30) 0 0;padding:0;container-type:inline-size}
.tchips li{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--sp-8);min-height:240px;border:1px solid var(--line2);border-radius:var(--r-4);padding:var(--sp-16) var(--sp-18);color:var(--tx);background:var(--ink2);isolation:isolate}
.tchips .tcimg{position:absolute;right:-8%;top:-6%;width:72%;height:auto;opacity:.34;filter:saturate(.9);z-index:-1;pointer-events:none;transition:opacity .4s ease, transform .6s ease}
html[data-theme="dark"] .tchips .tcimg{opacity:.28;filter:saturate(.8) brightness(1.1)}
.tchips li::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top, var(--ink2) 28%, color-mix(in srgb, var(--ink2) 55%, transparent) 60%, transparent)}
.tchips li:hover .tcimg, html[data-theme="dark"] .tchips li:hover .tcimg{opacity:.9;transform:scale(1.04)}
.tchips li:hover::after{background:linear-gradient(to top, var(--ink2) 22%, color-mix(in srgb, var(--ink2) 45%, transparent) 50%, transparent)} /* ao passar o rato a imagem fica quase opaca */
.tchips li{cursor:pointer; transition:border-color .2s, box-shadow .2s}
.tchips li:hover{border-color:var(--acc)}
.tchips li[aria-expanded="true"]{display:none} /* o cartão aberto dá o lugar ao painel com o mesmo view-transition-name */
.tchips li:focus-visible{outline:2px solid var(--acc); outline-offset:2px}
/* pormenor da tecnologia: texto alargado, parceiros procurados e projetos do catálogo que precisam dela */
.tchips li.tdet{display:block; cursor:default; min-height:0; padding:var(--sp-22) clamp(18px,3vw,32px) var(--sp-26); border-color:var(--acc); box-shadow:var(--sh-9)}
.tchips li.tdet::after,.tchips li.tdet:hover::after{content:none}
.tchips li.tdet .tdimg{position:absolute; right:-6%; top:-8%; width:min(44%,340px); height:auto; opacity:.14; z-index:-1; pointer-events:none}
.tchips .tdprj li{display:block; min-height:0; padding:0; border:0; border-radius:0; background:none; overflow:visible; cursor:auto; isolation:auto; box-shadow:none} .tchips .tdprj li::after,.tchips .tdprj li:hover::after{content:none} /* as linhas de projeto dentro do painel não são cartões */
.tchips .tdprj b{font-family:inherit; font-weight:600; font-size:inherit; letter-spacing:0; text-transform:none}
.tchips li.tdet .tdetg{grid-template-columns:1fr; gap:var(--sp-22)} .tchips li.tdet .tdetg p{max-width:62ch}
.tchips li.tdet .tdprj a{grid-template-columns:auto minmax(0,1fr); grid-template-areas:"code name" "state state" "tag tag"; gap:var(--sp-4) var(--sp-12)} .tchips li.tdet .tdprj a > i{grid-area:code} .tchips li.tdet .tdprj a > b{grid-area:name} .tchips li.tdet .tdprj a > em{grid-area:state; white-space:normal} .tchips li.tdet .tdprj a > span{grid-area:tag}
.tchips li.tdet .tdimg[data-on="false"]{display:none}
@container (width >= 574px){ .tchips li.tdet{grid-column:span 2} }
@container (width >= 868px){ .tchips li.tdet{grid-row:span 2} }
@container (width >= 574px) and (width < 868px){ .tchips:has(li.tdet) li[data-tec="auto"]{grid-column:span 2} .tchips:has(li[data-tec="auto"][aria-expanded="true"]) li[data-tec="iot"]{grid-column:span 2} } /* 2 colunas: 5 cartões + painel fecham em 4 filas sem buraco */
.tchips [data-tec="ia"]{view-transition-name:tec-ia; order:2} .tchips [data-tec="xr"]{view-transition-name:tec-xr; order:4} .tchips [data-tec="p3d"]{view-transition-name:tec-p3d; order:6} .tchips [data-tec="chain"]{view-transition-name:tec-chain; order:8} .tchips [data-tec="iot"]{view-transition-name:tec-iot; order:10} .tchips [data-tec="auto"]{view-transition-name:tec-auto; order:12} /* cartões em ordens pares; o painel recebe uma ordem ímpar (inline) para ocupar o lugar do cartão */
::view-transition-old(root),::view-transition-new(root){animation:none; mix-blend-mode:normal}
::view-transition-group(*){animation-duration:1.5s; animation-timing-function:cubic-bezier(.45,.02,.12,1)} /* César, 17/10: movimento orgânico e suave — acelera devagar, desacelera longo, sem batida */
::view-transition-old(*),::view-transition-new(*){animation-duration:1.5s; animation-timing-function:cubic-bezier(.45,.02,.12,1)}
/* César, 17/10: os cartões não desaparecem durante o movimento — a imagem antiga fica visível até ao fim e a nova surge por cima só no último troço */
::view-transition-old(*){animation-name:tecStay} ::view-transition-new(*){animation-name:tecOver}
@keyframes tecStay{from{opacity:1} to{opacity:1}} @keyframes tecOver{from{opacity:0} 60%{opacity:0} to{opacity:1}}
::view-transition-image-pair(*){isolation:isolate}
/* telemóvel (uma coluna, sem View Transition): o painel abre no lugar do cartão com um deslize curto */
@container (width < 574px){ .tchips li.tdet{animation:tecMobIn .42s cubic-bezier(.2,.7,.2,1) both} .tchips li.tdet .tdx{width:44px; height:44px} }
@keyframes tecMobIn{from{opacity:0; transform:translateY(10px); clip-path:inset(0 0 55% 0 round 4px)} to{opacity:1; transform:none; clip-path:inset(0 0 0 0 round 4px)}}
@media (hover: none){ .tchips li:hover .tcimg{opacity:.34; transform:none} html[data-theme="dark"] .tchips li:hover .tcimg{opacity:.28} }
.tdeth{display:flex; justify-content:space-between; align-items:center; gap:var(--sp-12)}
.tdx{flex:none; width:36px; height:36px; border-radius:var(--r-round); border:1px solid var(--line2); background:none; color:var(--mut); font-size:var(--fs-r125); line-height:1; cursor:pointer}
.tdx:hover,.tdx:focus-visible{color:var(--tx); border-color:var(--acc); outline:none}
.tdet h3{font-size:clamp(1.3rem,2.4vw,1.8rem); line-height:1.15; letter-spacing:-.01em; margin:var(--sp-10) 0 var(--sp-16)}
.tdetg{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:var(--sp-24) clamp(24px,4vw,56px)}
.tdetg p{color:var(--mut); max-width:none; text-wrap:pretty}
.tdetg .tdetp{color:var(--tx); border-left:2px solid var(--acc); padding-left:var(--sp-14); margin:0}
.tdk{font-family:var(--font-mono); font-size:var(--fs-r066); letter-spacing:.18em; text-transform:uppercase; color:var(--acc); margin:0 0 var(--sp-8)}
.tdprj{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.tdprj a{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:var(--sp-2) var(--sp-14); align-items:baseline; padding:var(--sp-10) 0; border-bottom:1px solid var(--line); color:var(--tx); text-decoration:none}
.tdprj a:hover b,.tdprj a:focus-visible b{color:var(--acc)}
.tdprj i{font-family:var(--font-mono); font-style:normal; font-size:var(--fs-r066); letter-spacing:.14em; color:var(--mut)}
.tdprj b{font-weight:600}
.tdprj em{font-style:normal; font-family:var(--font-mono); font-size:var(--fs-r060); letter-spacing:.12em; text-transform:uppercase; color:var(--acc2); white-space:nowrap}
.tdprj span{grid-column:2 / -1; color:var(--mut); font-size:var(--fs-r088); line-height:1.45}
@media (max-width:760px){ .tdetg{grid-template-columns:1fr} }
.tchips b{position:relative}
.tchips small{position:relative}
.tchips b{font-family:var(--font-mono);font-weight:400;font-size:var(--fs-r074);letter-spacing:.1em;text-transform:uppercase}
.tchips small{font-size:var(--fs-r086);line-height:1.45;color:var(--mut);text-wrap:pretty}
.conf{display:grid;gap:0;margin-top:var(--sp-34);border-top:1px solid var(--line)}
.crow{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) minmax(0,1fr) minmax(0,1.3fr);gap:var(--sp-22);padding:var(--sp-26) 0;border-bottom:1px solid var(--line);align-items:start}
.crow i{display:block;font-family:var(--font-mono);font-style:normal;font-size:var(--fs-r064);letter-spacing:.18em;color:var(--acc);text-transform:uppercase;margin-bottom:var(--sp-8)}
.crow h3{font-size:var(--fs-r118);margin:0}
.crow p{margin:0;color:var(--mut);font-size:var(--fs-r094);max-width:none;text-wrap:pretty}
.crow .ck{display:block;font-family:var(--font-mono);font-size:var(--fs-r062);letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-bottom:var(--sp-8)}
.crow .cl{color:var(--tx);font-size:var(--fs-r090);line-height:1.5}
.cnorms{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin:0;padding:0;list-style:none}
.cnorms li{font-family:var(--font-mono);font-size:var(--fs-r066);letter-spacing:.08em;border:1px solid var(--line2);border-radius:var(--r-4);padding:var(--sp-6) var(--sp-9);color:var(--tx);white-space:nowrap}
.cnorms li b{font-weight:400;color:var(--mut);letter-spacing:0;text-transform:none}
.cnote{margin:var(--sp-18) 0 0;font-size:var(--fs-r084);color:var(--mut);max-width:72ch}
@media (max-width:980px){.crow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:600px){.crow{grid-template-columns:1fr;gap:var(--sp-14)}}
.quotes{display:grid;gap:var(--sp-22);grid-template-columns:repeat(3,1fr);margin-top:var(--sp-36)}
@media (max-width:900px){.quotes{grid-template-columns:1fr}}
.quote{margin:0;border:1px solid var(--line);border-left:3px solid var(--acc);background:var(--ink2);padding:var(--sp-24) var(--sp-22)}
.quote blockquote{margin:0 0 var(--sp-16);color:var(--mut);font-size:var(--fs-r095)}
.quote blockquote::before{content:"« ";color:var(--acc);font-family:var(--font-display);font-size:var(--fs-r140)}
.quote figcaption{font-family:var(--font-mono);font-size:var(--fs-r070);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.quote figcaption b{color:var(--tx)}
.pmodal{position:fixed;inset:0;z-index:90;display:grid;place-items:center}
.pmback{position:absolute;inset:0;background:var(--c-rgba-4-10-10-72);backdrop-filter:blur(4px)}
.pmbox{position:relative;width:min(1080px,calc(100vw - 28px));max-height:min(860px,calc(100svh - 28px));background:var(--ink);border:1px solid var(--line2);border-radius:var(--r-10);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sh-10)}
.pmbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-12);padding:var(--sp-10) var(--sp-10) var(--sp-10) var(--sp-16);border-bottom:1px solid var(--line)}
.pmbar .mono{font-size:var(--fs-r068);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.pmclose{background:none;border:1px solid var(--line2);border-radius:var(--r-6);color:var(--tx);font-size:var(--fs-r120);width:40px;height:40px;cursor:pointer}
.pmclose:hover{border-color:var(--acc);color:var(--acc)}
.evbar{position:fixed; top:var(--nav-h); left:0; right:0; z-index:55; display:flex; align-items:center; gap:var(--sp-14); justify-content:center; padding:var(--sp-8) var(--sp-18); background:color-mix(in srgb, var(--acc) 16%, var(--ink)); border-bottom:1px solid var(--line2); font-family:var(--font-mono); font-size:var(--fs-r062); letter-spacing:.16em; text-transform:uppercase; color:var(--tx)}
.evbar b{color:var(--acc); font-weight:700}
.evbar button{background:none; border:0; color:var(--mut); cursor:pointer; font-size:var(--fs-r100); line-height:1; padding:var(--sp-2) var(--sp-6)}
.evbar button:hover{color:var(--acc)}
.hero .instr{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:0;transition:opacity .25s ease}
.hero.hover .instr{opacity:1}
.hero .igrid{position:absolute;inset:0;
 background:repeating-linear-gradient(90deg,transparent 0 39px,color-mix(in srgb,var(--acc) 24%,transparent) 39px 40px),
            repeating-linear-gradient(0deg,transparent 0 39px,color-mix(in srgb,var(--acc) 18%,transparent) 39px 40px);
 -webkit-mask:radial-gradient(160px at calc(var(--hx,.5)*100%) calc(var(--hy,.5)*100%),var(--c-000000) 0 42%,transparent 72%);
 mask:radial-gradient(160px at calc(var(--hx,.5)*100%) calc(var(--hy,.5)*100%),var(--c-000000) 0 42%,transparent 72%)}
.hero .ret{position:absolute;left:calc(var(--hx,.5)*100%);top:calc(var(--hy,.5)*100%);width:22px;height:22px;margin:-11px 0 0 -11px;
 border:1.5px solid var(--acc);border-radius:var(--r-round);box-shadow:var(--sh-11)}
.hero .ret::before,.hero .ret::after{content:"";position:absolute;background:var(--acc)}
.hero .ret::before{left:50%;top:-7px;width:1px;height:5px;box-shadow:var(--sh-12)}
.hero .ret::after{top:50%;left:-7px;height:1px;width:5px;box-shadow:var(--sh-13)}
.hero .iread{position:absolute;left:calc(var(--hx,.5)*100% + 18px);top:calc(var(--hy,.5)*100% + 14px);
 font-family:var(--font-mono);font-size:var(--fs-r060);letter-spacing:.14em;color:var(--mut);
 background:color-mix(in srgb,var(--ink) 74%,transparent);border:1px solid var(--line);padding:var(--sp-3) var(--sp-8);border-radius:var(--r-4);white-space:nowrap}
@media (prefers-reduced-motion: no-preference){
  .aurora>*{transform:translate(calc((var(--hx,.5) - .5)*26px), calc((var(--hy,.5) - .5)*18px));transition:transform .5s cubic-bezier(.2,.6,.2,1)}
  .lens{transform:translate(calc((var(--hx,.5) - .5)*-12px), calc((var(--hy,.5) - .5)*-8px));transition:transform .5s cubic-bezier(.2,.6,.2,1)}
  .hero.cap .ret{animation:ev-cap .5s ease}
  .hero.cap .igrid{opacity:1}
  @keyframes ev-cap{0%{transform:scale(1)}30%{transform:scale(1.9);border-color:var(--acc2)}100%{transform:scale(1)}}
  .audpill,.chip{position:relative;overflow:hidden}
}

.admlink{display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; align-self:center; vertical-align:middle; border:1px solid var(--line); border-radius:var(--r-round); color:var(--mut); opacity:.55; transition:opacity .2s, color .2s, border-color .2s}
.admlink:hover,.admlink:focus-visible{opacity:1; color:var(--acc); border-color:var(--acc); text-decoration:none}

/* assinatura: legenda do conceito ao passar o rato ou focar cada palavra */
.sigw{position:relative; display:inline-block; cursor:help; border-bottom:1px dotted currentColor; outline-offset:3px}
.sigw > b{text-transform:lowercase} /* a assinatura usa os títulos dos temas (lab.r1t–r3t, capitalizados nas traduções) sempre em minúsculas */
.sigtip{position:absolute; left:0; bottom:calc(100% + 10px); transform:translateY(4px); width:max-content; max-width:min(300px, calc(100vw - 40px)); padding:var(--sp-10) var(--sp-12); font:400 .8rem/1.45 'Inter',system-ui,sans-serif; font-style:normal; letter-spacing:0; text-transform:none; color:var(--tx); background:var(--ink2); border:1px solid var(--line2); box-shadow:var(--sh-14); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .18s ease, transform .18s ease, visibility 0s linear .18s; z-index:30; text-align:left}
.sigw:hover .sigtip, .sigw:focus-visible .sigtip{opacity:1; visibility:visible; transform:none; transition-delay:0s}
.sigw:last-of-type .sigtip{left:auto; right:0}

/* ── Estilos inline extraídos ── */
.s-index-1:not(#\#):not(#\#):not(#\#){position:absolute}
.s-index-2:not(#\#):not(#\#):not(#\#){stroke:var(--line)}
.s-index-3:not(#\#):not(#\#):not(#\#){stroke:var(--line2)}
.s-index-4:not(#\#):not(#\#):not(#\#){fill:var(--ink2)}
.s-index-5:not(#\#):not(#\#):not(#\#){stroke:var(--acc)}
.s-index-6:not(#\#):not(#\#):not(#\#){position:absolute;inset:0;display:block}
.s-index-7:not(#\#):not(#\#):not(#\#){left:28.5%;top:28.5%}
.s-index-8:not(#\#):not(#\#):not(#\#){left:72.5%;top:28.6%}
.s-index-9:not(#\#):not(#\#):not(#\#){left:72.7%;top:70.4%}
.s-index-10:not(#\#):not(#\#):not(#\#){left:27.4%;top:70.9%}
.s-index-11:not(#\#):not(#\#):not(#\#){left:654.8px;top:503.8px;width:182.4px;height:152.4px;animation-duration:2.60s;animation-delay:0.00s}
.s-index-12:not(#\#):not(#\#):not(#\#){left:495.4px;top:150.4px;width:118.1px;height:188.1px;animation-duration:2.97s;animation-delay:-0.73s}
.s-index-13:not(#\#):not(#\#):not(#\#){left:596.0px;top:699.0px;width:172.9px;height:104.9px;animation-duration:3.34s;animation-delay:-1.46s}
.s-index-14:not(#\#):not(#\#):not(#\#){left:953.8px;top:516.8px;width:68.4px;height:55.4px;animation-duration:3.71s;animation-delay:-2.19s}
.s-index-15:not(#\#):not(#\#):not(#\#){left:938.5px;top:562.5px;width:46.0px;height:57.0px;animation-duration:4.08s;animation-delay:-2.92s}
.s-index-16:not(#\#):not(#\#):not(#\#){left:1182.1px;top:301.1px;width:41.8px;height:41.8px;animation-duration:2.85s;animation-delay:-0.25s}
.s-index-17:not(#\#):not(#\#):not(#\#){left:667.4px;top:573.4px;width:167.2px;height:93.2px;animation-duration:3.22s;animation-delay:-0.98s}
.s-index-18:not(#\#):not(#\#):not(#\#){left:461.0px;top:382.0px;width:38.0px;height:38.0px;animation-duration:3.59s;animation-delay:-1.71s}
.s-index-19:not(#\#):not(#\#):not(#\#){left:1027.0px;top:615.0px;width:35.0px;height:38.0px;animation-duration:3.96s;animation-delay:-2.44s}
.s-index-20:not(#\#):not(#\#):not(#\#){left:707.3px;top:687.3px;width:25.5px;height:28.5px;animation-duration:2.73s;animation-delay:-3.17s}
.s-index-21:not(#\#):not(#\#):not(#\#){left:830.8px;top:564.8px;width:28.5px;height:47.5px;animation-duration:3.10s;animation-delay:-0.50s}
.s-index-22:not(#\#):not(#\#):not(#\#){left:689.2px;top:667.2px;width:27.6px;height:45.6px;animation-duration:3.47s;animation-delay:-1.23s}
.s-index-23:not(#\#):not(#\#):not(#\#){left:544.2px;top:196.5px;width:17px;height:95px;transform:rotate(3.8deg)}
.s-index-24:not(#\#):not(#\#):not(#\#){left:63.84px;top:329.16px;width:350.65px;height:315.48px;clip-path:polygon(98.91% 49.53%,98.79% 56.76%,98.71% 64.25%,98.20% 72.11%,96.50% 80.05%,92.94% 87.21%,87.41% 92.58%,80.58% 95.76%,73.41% 97.14%,66.58% 97.66%,60.20% 97.99%,54.06% 98.40%,47.84% 98.77%,41.36% 99.17%,34.31% 99.58%,26.51% 99.54%,18.38% 98.05%,10.83% 94.23%,5.01% 87.85%,1.58% 79.61%,0.31% 70.63%,0.50% 61.80%,1.29% 53.51%,2.11% 45.61%,2.81% 37.77%,3.80% 29.83%,5.79% 21.91%,9.51% 14.80%,15.09% 9.38%,21.89% 5.99%,28.99% 4.26%,35.71% 3.33%,41.97% 2.50%,47.99% 1.74%,54.03% 1.18%,60.24% 0.84%,66.84% 0.47%,74.11% 0.32%,81.83% 1.22%,89.14% 4.32%,94.89% 10.01%,98.32% 17.71%,99.61% 26.21%,99.62% 34.50%,99.22% 42.23%)}
.s-index-25:not(#\#):not(#\#):not(#\#){left:607.00px;top:52.00px;width:412.00px;height:453.00px;clip-path:polygon(10.44% 10.60%,12.86% 9.71%,15.29% 8.83%,17.72% 7.06%,20.15% 5.74%,22.57% 4.86%,25.00% 4.86%,27.43% 5.08%,29.85% 5.30%,32.28% 5.52%,34.71% 6.18%,37.14% 6.40%,39.56% 7.28%,41.99% 7.95%,44.42% 9.05%,46.84% 9.93%,49.27% 10.38%,51.70% 11.04%,54.13% 11.48%,56.55% 11.92%,58.98% 12.14%,61.41% 12.36%,63.83% 12.80%,66.26% 13.47%,68.69% 14.13%,71.12% 14.79%,73.54% 15.23%,75.97% 16.34%,78.40% 17.66%,80.83% 19.21%,83.25% 20.75%,85.68% 22.96%,88.11% 24.72%,90.53% 26.49%,92.96% 28.48%,94.90% 30.91%,96.12% 33.77%,96.60% 35.98%,97.09% 38.19%,97.57% 40.40%,98.06% 42.60%,98.30% 45.92%,98.30% 50.33%,98.30% 54.75%,98.06% 56.95%,97.33% 59.16%,96.60% 61.37%,96.12% 63.58%,95.63% 66.23%,95.39% 68.43%,95.78% 69.65%,92.96% 70.93%,91.02% 71.85%,90.05% 72.63%,89.51% 73.73%,89.32% 75.28%,88.59% 83.44%,87.86% 90.51%,87.62% 92.27%,85.68% 92.94%,83.25% 93.82%,80.83% 94.70%,78.40% 94.92%,75.97% 94.92%,73.54% 95.14%,71.12% 94.92%,68.69% 94.70%,66.26% 93.82%,63.83% 93.60%,61.41% 93.16%,58.98% 92.72%,56.55% 92.27%,54.13% 91.83%,51.70% 91.39%,49.27% 90.73%,46.84% 90.29%,44.42% 89.85%,41.99% 89.40%,39.56% 89.40%,37.14% 88.96%,34.71% 88.74%,32.28% 88.08%,29.85% 87.64%,27.43% 87.20%,25.00% 86.75%,22.57% 86.09%,20.15% 85.87%,17.72% 85.21%,15.29% 84.77%,12.86% 84.11%,10.44% 83.66%,8.01% 82.78%,5.58% 81.46%,3.16% 80.13%,2.43% 79.03%,1.70% 76.82%,1.21% 74.61%,1.21% 72.41%,1.46% 70.20%,1.46% 67.99%,1.21% 65.78%,1.94% 63.58%,2.67% 61.37%,2.91% 59.16%,3.64% 56.95%,3.88% 54.75%,3.88% 52.54%,3.40% 50.33%,3.64% 48.12%,4.37% 45.92%,4.61% 43.71%,4.85% 41.50%,4.61% 39.29%,4.61% 37.09%,4.61% 34.88%,4.85% 32.67%,5.10% 30.46%,5.10% 28.26%,5.34% 26.05%,5.83% 23.84%,6.31% 21.63%,6.31% 19.43%,6.80% 17.22%,7.52% 15.01%,8.50% 12.80%,9.47% 11.48%)}
.s-index-26:not(#\#):not(#\#):not(#\#){left:1082.65px;top:380.50px;width:275.12px;height:318.53px;clip-path:polygon(99.52% 48.34%,99.64% 54.44%,99.48% 60.75%,99.16% 67.45%,98.52% 74.84%,96.97% 82.75%,93.29% 90.38%,86.85% 96.25%,78.20% 99.28%,68.69% 99.51%,59.58% 98.03%,51.38% 96.18%,43.80% 94.81%,36.31% 93.82%,28.67% 92.75%,20.94% 90.96%,13.67% 87.87%,7.66% 83.19%,3.68% 77.05%,2.04% 70.11%,2.17% 63.20%,3.08% 56.84%,3.78% 51.11%,3.69% 45.57%,2.84% 39.79%,1.50% 33.28%,0.45% 25.86%,0.80% 17.84%,3.74% 10.24%,9.63% 4.34%,17.81% 1.07%,26.95% 0.31%,35.82% 1.18%,43.89% 2.71%,51.23% 4.29%,58.10% 5.86%,64.89% 7.32%,71.82% 8.74%,79.03% 10.45%,86.17% 13.14%,92.24% 17.35%,96.34% 23.04%,98.32% 29.55%,98.98% 36.07%,99.24% 42.30%)}
.s-index-27:not(#\#):not(#\#):not(#\#){--k:0.94}
.s-index-28:not(#\#):not(#\#):not(#\#){--k:1}
.s-index-29:not(#\#):not(#\#):not(#\#){--k:0.78}
.s-index-30:not(#\#):not(#\#):not(#\#){--k:0.95}
.s-index-31:not(#\#):not(#\#):not(#\#){--k:0.92}
.s-index-32:not(#\#):not(#\#):not(#\#){--k:0.97}
.s-index-33:not(#\#):not(#\#):not(#\#){left:37.71%;top:5.99%;width:15.18%;height:14.59%;clip-path:polygon(3.66% 16.28%, 97.54% 0.00%, 100.00% 86.19%, 0.00% 100.00%)}
.s-index-34:not(#\#):not(#\#):not(#\#){left:35.58%;top:22.54%;width:20.59%;height:15.34%;clip-path:polygon(0.00% 12.17%, 94.50% 0.00%, 100.00% 90.60%, 0.40% 100.00%)}
.s-index-35:not(#\#):not(#\#):not(#\#){left:42.044%;top:41.210%;width:19.887%;height:13.633%;clip-path:polygon(99.85% 50.00%,99.82% 52.03%,99.76% 54.06%,99.70% 56.10%,99.68% 58.15%,99.67% 60.22%,99.58% 62.30%,99.46% 64.40%,99.38% 66.53%,99.30% 68.70%,99.14% 70.88%,98.93% 73.08%,98.71% 75.32%,98.45% 77.59%,98.15% 79.89%,97.81% 82.22%,97.43% 84.60%,96.97% 86.99%,96.22% 89.21%,95.13% 91.16%,93.70% 92.80%,91.84% 93.98%,89.64% 94.69%,87.35% 95.15%,85.10% 95.51%,82.91% 95.78%,80.78% 96.00%,78.74% 96.17%,76.76% 96.32%,74.86% 96.44%,73.00% 96.51%,71.21% 96.56%,69.48% 96.62%,67.80% 96.66%,66.16% 96.69%,64.55% 96.67%,62.98% 96.65%,61.46% 96.64%,59.96% 96.64%,58.49% 96.64%,57.04% 96.63%,55.61% 96.61%,54.20% 96.63%,52.79% 96.65%,51.40% 96.67%,50.00% 96.64%,48.61% 96.60%,47.21% 96.54%,45.82% 96.45%,44.42% 96.33%,43.02% 96.19%,41.61% 96.07%,40.18% 95.99%,38.73% 95.88%,37.27% 95.72%,35.78% 95.60%,34.26% 95.49%,32.72% 95.32%,31.16% 95.11%,29.55% 94.89%,27.91% 94.66%,26.21% 94.44%,24.46% 94.21%,22.65% 93.94%,20.78% 93.66%,18.83% 93.37%,16.82% 93.02%,14.77% 92.59%,12.65% 92.11%,10.51% 91.51%,8.46% 90.70%,6.55% 89.63%,4.99% 88.18%,3.90% 86.30%,3.24% 84.11%,2.78% 81.83%,2.30% 79.61%,1.86% 77.41%,1.52% 75.20%,1.32% 72.96%,1.24% 70.72%,1.20% 68.51%,1.09% 66.37%,0.97% 64.27%,0.90% 62.18%,0.84% 60.12%,0.84% 58.07%,0.86% 56.03%,0.82% 54.01%,0.79% 52.01%,0.79% 50.00%,0.83% 48.00%,0.91% 45.99%,0.99% 43.99%,1.07% 41.97%,1.08% 39.93%,0.94% 37.83%,0.66% 35.64%,0.61% 33.47%,0.62% 31.27%,0.62% 29.02%,0.63% 26.71%,0.64% 24.34%,0.65% 21.90%,0.66% 19.38%,0.67% 16.75%,1.01% 14.26%,1.87% 12.10%,2.86% 10.02%,4.04% 8.08%,5.38% 6.29%,7.05% 4.85%,9.28% 4.10%,11.86% 3.89%,14.26% 3.66%,16.42% 3.29%,18.51% 2.95%,20.56% 2.70%,22.56% 2.51%,24.47% 2.30%,26.30% 2.07%,28.08% 1.86%,29.84% 1.75%,31.59% 1.74%,33.30% 1.76%,34.95% 1.72%,36.56% 1.71%,38.15% 1.76%,39.70% 1.77%,41.21% 1.71%,42.70% 1.66%,44.18% 1.63%,45.65% 1.63%,47.11% 1.71%,48.56% 1.80%,50.00% 1.85%,51.44% 1.86%,52.88% 1.89%,54.33% 1.95%,55.78% 2.02%,57.24% 2.08%,58.71% 2.16%,60.19% 2.28%,61.69% 2.40%,63.22% 2.52%,64.76% 2.66%,66.33% 2.82%,67.95% 2.94%,69.62% 3.05%,71.31% 3.21%,73.03% 3.43%,74.80% 3.66%,76.63% 3.91%,78.52% 4.17%,80.44% 4.51%,82.41% 4.90%,84.46% 5.32%,86.58% 5.78%,88.74% 6.33%,90.89% 7.02%,92.86% 8.01%,94.46% 9.45%,95.70% 11.24%,96.62% 13.29%,97.20% 15.57%,97.60% 17.92%,97.94% 20.24%,98.24% 22.54%,98.52% 24.78%,98.76% 27.00%,98.95% 29.20%,99.15% 31.36%,99.31% 33.50%,99.38% 35.63%,99.42% 37.74%,99.50% 39.81%,99.61% 41.86%,99.71% 43.90%,99.78% 45.94%,99.83% 47.97%)}
.s-index-36:not(#\#):not(#\#):not(#\#){left:32.84%;top:58.16%;width:21.16%;height:13.00%;clip-path:polygon(0.83% 2.51%, 100.00% 0.00%, 99.84% 100.00%, 0.00% 99.98%)}
.s-index-37:not(#\#):not(#\#):not(#\#){left:31.07%;top:75.72%;width:26.87%;height:19.17%;clip-path:polygon(0.00% 0.00%, 100.00% 3.07%, 98.02% 100.00%, 1.73% 94.26%)}
.s-index-38:not(#\#):not(#\#):not(#\#){color:var(--acc)}
.s-index-39:not(#\#):not(#\#):not(#\#){margin:var(--sp-14) 0 0}
.s-index-40:not(#\#):not(#\#):not(#\#){color:var(--acc2)}
.s-index-41:not(#\#):not(#\#):not(#\#){margin-top:var(--sp-4);max-width:760px}
.s-index-42:not(#\#):not(#\#):not(#\#){display:block;margin-top:var(--sp-6)}
.s-index-43:not(#\#):not(#\#):not(#\#){margin:-8px 0 0;display:none}
.s-index-44:not(#\#):not(#\#):not(#\#){display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-18);flex-wrap:wrap}
.s-index-45:not(#\#):not(#\#):not(#\#){margin:0}
.s-index-46:not(#\#):not(#\#):not(#\#){margin-top:var(--sp-28)}
.s-index-47:not(#\#):not(#\#):not(#\#){margin-top:var(--sp-16)}
.s-index-48:not(#\#):not(#\#):not(#\#){margin-bottom:var(--sp-14)}
.s-index-49:not(#\#):not(#\#):not(#\#){max-width:44ch}
.s-index-50:not(#\#):not(#\#):not(#\#){margin:auto 0 0;padding-top:var(--sp-14)}
.s-index-51:not(#\#):not(#\#):not(#\#){white-space:nowrap}
.s-index-52:not(#\#):not(#\#):not(#\#){margin:0 0 var(--sp-12);color:var(--mut)}
.s-index-53:not(#\#):not(#\#):not(#\#){position:static}
.s-index-54:not(#\#):not(#\#):not(#\#){font-size:var(--fs-r064);letter-spacing:.14em;text-transform:uppercase;margin-left:auto}
.s-index-55:not(#\#):not(#\#):not(#\#){flex:1;width:100%;border:0;min-height:min(74vh, 760px);background:var(--ink)}
.s-index-56:not(#\#):not(#\#):not(#\#){flex:1;display:grid;place-items:center;padding:var(--sp-48) var(--sp-28);min-height:320px}
.s-index-57:not(#\#):not(#\#):not(#\#){text-align:center;max-width:52ch}
.s-index-58:not(#\#):not(#\#):not(#\#){font-size:var(--fs-r070);letter-spacing:.2em;text-transform:uppercase;color:var(--acc);margin:0 0 var(--sp-14)}
.s-index-59:not(#\#):not(#\#):not(#\#){font-size:var(--fs-r160);margin:0 0 var(--sp-12)}
.s-index-60:not(#\#):not(#\#):not(#\#){color:var(--mut);margin:0 0 var(--sp-8)}
.s-index-61:not(#\#):not(#\#):not(#\#){margin-top:var(--sp-22);border:1px dashed var(--line2);border-radius:var(--r-6);padding:var(--sp-22) var(--sp-20)}
.s-index-62:not(#\#):not(#\#):not(#\#){font-size:var(--fs-r072);letter-spacing:.14em;color:var(--mut);margin:0}
.s-index-63:not(#\#):not(#\#):not(#\#){margin-top:var(--sp-22);display:flex;gap:var(--sp-12);justify-content:center;flex-wrap:wrap}