/* ═══════════════════════════════════════════════════════════════════════════
   PowerTech · folha de estilo do portal (direcção "vidro")
   Partilhada por index.html, solucoes.html e privacidade.html.
   Sistema AuthKit — tela de meia-noite, grelha de blueprint, superfícies de
   vidro fosco, arestas por sombra interna em vez de traço, pílulas de 999px,
   cartões de 16px, ritmo de 120px — com a NOSSA paleta: o #05070D do site,
   a escada de texto #F4F7FB → #C7D2E0 → #8FA0B8 → #6E7F99, e o azul de marca
   #4F8EF7 no lugar do violeta como único acento cromático.
   Tema único e assumido. O comportamento vive no main.js — os ids do menu, do
   reveal e do formulário de contacto são os mesmos da versão anterior do
   portal (guardada em index-classico.html, que continua a usar styles.css).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Fontes alojadas no próprio site (ver assets/fonts/LEIA-ME.txt) ────────────
   Antes vinham do Google Fonts: uma folha CSS de outro domínio a bloquear a
   primeira pintura, e o IP de cada visitante enviado ao Google. Subconjunto
   latin — cobre o português inteiro e o euro. Licença OFL junto dos ficheiros. */
@font-face{font-family:'Inter'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('assets/fonts/inter-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Space Grotesk'; font-style:normal; font-weight:400 500; font-display:swap;
  src:url('assets/fonts/space-grotesk-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono'; font-style:normal; font-weight:400; font-display:swap;
  src:url('assets/fonts/jetbrains-mono-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
  --canvas:#05070D;        /* tela — o preto azulado que o site já usa */
  --plate:#101829;         /* placa elevada */
  --ice:#F4F7FB;           /* títulos */
  --frost:#C7D2E0;         /* corpo */
  --mist:#8FA0B8;          /* corpo esbatido */
  --veil:#6E7F99;          /* copy de apoio — 4,9:1 sobre a tela (AA) */
  --blue:#4F8EF7;          /* acção — o único cromático */
  --blue-soft:#7FAAF5;
  --on-blue:#05070D;       /* texto sobre o azul — 6,3:1 (branco dava 3,2:1) */

  --edge:rgba(199,210,224,.12);      /* aresta universal, sempre por dentro */
  --edge-soft:rgba(199,210,224,.06);
  --glass:rgba(182,208,247,.03);     /* vidro quase invisível */
  --wash:rgba(182,208,247,.06);      /* enchimento das pílulas */
  --wash-2:rgba(182,208,247,.12);
  --line:rgba(199,210,224,.05);      /* grelha de blueprint */


  --card:rgba(199,210,224,.12) 0 1px 1px 0 inset,
         rgba(199,210,224,.05) 0 24px 48px 0 inset,
         rgba(5,7,13,.7) 0 24px 32px 0;
  --modal:rgba(216,236,248,.2) 0 1px 1px 0 inset,
          rgba(127,170,245,.06) 0 24px 48px 0 inset,
          rgba(0,0,0,.3) 0 16px 32px 0;
  --hair:rgba(199,210,224,.12) 0 0 0 1px inset;

  --page:1200px; --gap:100px;
  --sans:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --display:'Space Grotesk','Inter',ui-sans-serif,system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  position:relative; background:var(--canvas); color:var(--frost);
  font-family:var(--sans); font-size:16px; line-height:1.5; letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* Grelha de blueprint — atmosfera de fundo, esbatida nas bordas */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),
                   linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:88px 88px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%,#000 35%,transparent 88%);
  mask-image:radial-gradient(120% 90% at 50% 0%,#000 35%,transparent 88%);
}
body > *{position:relative; z-index:1;}

h1,h2,h3,h4{color:var(--ice); font-weight:500; text-wrap:balance;}
h1,h2{font-family:var(--display); letter-spacing:normal;}
h3,h4{font-family:var(--sans); letter-spacing:-.01em;}
p{max-width:64ch;}
a{color:inherit; text-decoration:none;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible{outline:2px solid var(--blue); outline-offset:2px; border-radius:8px;}
::selection{background:rgba(79,142,247,.35); color:#fff;}
img{max-width:100%;}

.container{max-width:var(--page); margin:0 auto; padding:0 24px;}
.section{padding:var(--gap) 0;}
@media (max-width:760px){ :root{--gap:72px;} }
/* Visível só para leitores de ecrã (dá estrutura sem mudar o desenho) */
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;}

/* ── Sobretítulo com linhas que desvanecem ─────────────────────────────── */
.eyebrow{display:flex; align-items:center; gap:20px; justify-content:center;
  font-family:var(--mono); font-size:14px; font-weight:400; letter-spacing:.1em;
  text-transform:uppercase; color:var(--frost); font-feature-settings:'tnum' 1;}
.eyebrow::before,.eyebrow::after{content:""; height:1px; flex:1; max-width:200px;}
@media (max-width:560px){
  .eyebrow{font-size:12px; letter-spacing:.08em; gap:12px;}
  .eyebrow::before,.eyebrow::after{max-width:28px;}
}
.eyebrow::before{background:linear-gradient(90deg,transparent,var(--edge));}
.eyebrow::after{background:linear-gradient(90deg,var(--edge),transparent);}

/* ── Botões ─────────────────────────────────────────────────────────────── */
.pill{display:inline-flex; align-items:center; gap:9px; border-radius:999px;
  padding:12px 22px; font-size:14px; font-weight:500; letter-spacing:-.01em; min-height:44px;
  border:0; cursor:pointer; font-family:var(--sans);
  background:var(--wash); color:#fff; box-shadow:var(--hair); transition:background .2s;}
.pill:hover{background:var(--wash-2);}
.pill.outline{background:transparent; color:var(--frost);}
.pill.outline:hover{background:var(--wash);}
.pill.action{background:var(--blue); color:var(--on-blue); font-weight:600;
  box-shadow:rgba(255,255,255,.18) 0 1px 0 0 inset, rgba(79,142,247,.35) 0 8px 24px -8px;}
.pill.action:hover{background:#5F9AF8;}
.pill svg{flex:none; transition:transform .18s ease;}
.pill:hover svg{transform:translateX(3px);}

/* ── Navegação ──────────────────────────────────────────────────────────── */
.navbar{position:sticky; top:0; z-index:100; background:rgba(5,7,13,.72);
  backdrop-filter:saturate(150%) blur(14px); -webkit-backdrop-filter:saturate(150%) blur(14px);
  transition:box-shadow .3s;}
.navbar.scrolled{box-shadow:0 1px 0 0 var(--edge-soft);}
.nav-inner{max-width:var(--page); margin:0 auto; padding:0 24px; height:68px;
  display:flex; align-items:center; gap:20px;}
.logo{display:flex; align-items:center; gap:10px; min-height:44px;}
.logo-img{width:24px; height:auto; flex:none;}
.logo-text{font-size:16px; font-weight:500; color:var(--ice); letter-spacing:-.01em; line-height:1.15;}
.logo-sub-text{font-size:11px; color:var(--veil); line-height:1.2;}
.nav-links{display:flex; align-items:center; gap:4px; margin-left:auto;}
.nav-links a{padding:9px 15px; font-size:14px; color:var(--frost); border-radius:999px;}
.nav-links a:hover,.nav-links a.active{background:var(--wash); color:#fff;}
.nav-links a.nav-cta{margin-left:8px; background:var(--blue); color:var(--on-blue);
  font-weight:600;}
.nav-links a.nav-cta:hover{background:#5F9AF8;}
.hamburger{display:none; margin-left:auto; width:44px; height:44px; border:0;
  border-radius:999px; background:var(--wash); box-shadow:var(--hair); cursor:pointer;
  padding:15px 13px; flex-direction:column; justify-content:space-between;}
.hamburger span{display:block; height:1.5px; background:var(--frost); border-radius:2px;
  transition:transform .25s, opacity .2s;}
.hamburger.open span:nth-child(1){transform:translateY(5.5px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg);}
@media (max-width:880px){
  .hamburger{display:flex;}
  .nav-links{position:fixed; inset:68px 0 auto 0; flex-direction:column; align-items:stretch;
    gap:4px; margin:0; padding:16px 20px 24px; background:rgba(5,7,13,.98);
    box-shadow:0 1px 0 0 var(--edge-soft); display:none;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:14px 16px; font-size:15px; border-radius:12px;}
  .nav-links a.nav-cta{margin:8px 0 0; justify-content:center; text-align:center;}
}

/* ── Hero do catálogo (solucoes.html) ─────────────────────────────────────── */
.hero{position:relative; padding:72px 0 0; text-align:center;}
.hero .eyebrow{margin-bottom:24px;}
.hero .lede{font-size:18px; line-height:1.6; color:var(--frost); max-width:62ch;
  margin:0 auto 32px; text-wrap:balance;}
.hero-actions{display:flex; align-items:center; justify-content:center; gap:14px;
  flex-wrap:wrap;}
@media (max-width:560px){
  .hero{padding-top:40px;}
  .hero .eyebrow{margin-bottom:18px;}
  .hero .lede{font-size:16px; margin-bottom:24px;}
}

/* ── Diagramas de fluxo (Email → Leitura → ERP) ──────────────────────────
   Texto real, não imagem: lê-se num leitor de ecrã pela ordem do processo e
   parte em várias linhas no telemóvel. As setas são decorativas. */
.flow{display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:10px 8px; list-style:none;}
.flow li{display:flex; align-items:center; gap:8px;}
.flow .node{border-radius:999px; padding:6px 13px; font-size:13px; line-height:1.3;
  color:var(--frost); background:var(--wash); box-shadow:var(--hair); white-space:nowrap;}
.flow .node.pt{color:var(--blue); background:var(--blue-wash);
  box-shadow:rgba(79,142,247,.45) 0 0 0 1px inset; font-weight:500;}
.flow .node.end{color:var(--ice); box-shadow:rgba(199,210,224,.28) 0 0 0 1px inset;}
.flow li + li::before{content:""; flex:none; width:18px; height:9px; background:var(--veil);
  clip-path:polygon(0 42%,64% 42%,64% 0,100% 50%,64% 100%,64% 58%,0 58%);}

/* ── Cabeçalho de secção ────────────────────────────────────────────────── */
.head{text-align:center; max-width:840px; margin:0 auto;}
.head .eyebrow{margin-bottom:24px;}
.head h2{font-size:clamp(26px,3.4vw,38px); line-height:1.18; color:var(--ice); text-wrap:balance;}
.head p{font-size:17px; line-height:1.6; color:var(--frost); max-width:62ch;
  margin:18px auto 0; text-wrap:pretty;}
.head p a{color:var(--ice); text-decoration:underline; text-underline-offset:3px;}

/* ── Números, em pastilhas ──────────────────────────────────────────────── */
.stats{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:28px;}
.stat{display:inline-flex; align-items:baseline; gap:8px; border-radius:6px;
  padding:7px 13px; background:var(--wash); box-shadow:var(--hair);}
.stat b{font-size:14px; font-weight:600; color:var(--ice); font-variant-numeric:tabular-nums;}
.stat span{font-size:13px; color:var(--mist);}

/* ── Banda de fecho do catálogo ─────────────────────────────────────────── */
.platform{margin-top:56px; border-radius:16px; padding:44px 40px; text-align:center;
  background:var(--glass); box-shadow:var(--card);}
.platform p{font-size:16px; line-height:1.6; color:var(--frost); max-width:58ch;
  margin:22px auto 28px;}
.tags{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:30px;}
.tag{border-radius:6px; padding:5px 10px; font-size:12px; font-weight:500; color:var(--frost);
  background:var(--wash-2); box-shadow:var(--hair);}

/* ── CTA fixo no telemóvel ──────────────────────────────────────────────
   Visível por defeito (funciona sem JS). Com JS, o main.js só o mostra depois
   de o botão do hero sair do ecrã, e esconde-o quando o formulário está à vista. */
.sticky-cta{display:none;}
@media (max-width:860px){
  body{padding-bottom:76px;}
  .sticky-cta{display:flex; position:fixed; left:0; right:0; bottom:0; z-index:90;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom)); justify-content:center;
    background:rgba(5,7,13,.92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    box-shadow:0 -1px 0 0 var(--edge-soft); transition:transform .3s ease;}
  .sticky-cta .pill{width:100%; max-width:420px; justify-content:center;}
  .js .sticky-cta:not(.show){transform:translateY(110%);}
}
@media (prefers-reduced-motion:reduce){ .sticky-cta{transition:none;} }

/* ── Contacto: o cartão-modal do sistema ────────────────────────────────── */
.contact{max-width:560px; margin:56px auto 0; border-radius:16px; padding:32px;
  background:rgba(5,7,13,.97); box-shadow:var(--modal);}
.row2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:12px;}
@media (max-width:520px){ .row2{grid-template-columns:1fr;} }
.fg{margin-bottom:12px;}
.fg label{display:block; font-size:13px; color:var(--mist); margin-bottom:7px;}
.fg input,.fg select,.fg textarea{width:100%; background:rgba(199,210,224,.06);
  border:0; box-shadow:var(--hair); color:#fff; border-radius:6px; padding:12px 12px; min-height:44px;
  font-size:14px; font-family:var(--sans); line-height:1.4; letter-spacing:-.01em;}
.fg textarea{resize:vertical; min-height:104px;}
.opt{color:var(--veil); font-weight:400;}
/* Campos opcionais do diagnóstico: fechados por defeito para o formulário ficar curto */
.more-fields{margin:2px 0 14px; border-radius:10px; box-shadow:var(--hair); padding:0 14px;}
.more-fields summary{display:flex; align-items:center; gap:12px; min-height:44px; padding:10px 0;
  cursor:pointer; font-size:14px; line-height:1.4; color:var(--frost); list-style:none;}
.more-fields[open] summary{margin-bottom:4px;}
.more-fields summary::-webkit-details-marker{display:none;}
.more-fields summary::after{content:""; margin-left:auto; width:7px; height:7px; flex:none;
  border-right:1.5px solid var(--mist); border-bottom:1.5px solid var(--mist);
  transform:rotate(45deg) translateY(-2px); transition:transform .18s ease;}
.more-fields[open] summary::after{transform:rotate(-135deg) translateY(-2px);}
.more-fields[open]{padding-bottom:4px;}
.more-fields summary:focus-visible{outline:2px solid var(--blue); outline-offset:2px; border-radius:8px;}
.fg input::placeholder,.fg textarea::placeholder{color:rgba(199,210,224,.55);}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;
  box-shadow:rgba(199,210,224,.24) 0 0 0 1px inset;}
.fg select{appearance:none; cursor:pointer; color:var(--frost);
  background-image:linear-gradient(45deg,transparent 50%,#8FA0B8 50%),
                   linear-gradient(135deg,#8FA0B8 50%,transparent 50%);
  background-position:calc(100% - 17px) 19px, calc(100% - 12px) 19px;
  background-size:5px 5px,5px 5px; background-repeat:no-repeat;}
.fg select option{background:#101829; color:var(--frost);}
.btn-send{width:100%; background:var(--blue); color:var(--on-blue); border:0; border-radius:999px;
  padding:13px 24px; font-size:14px; font-weight:600; font-family:var(--sans); min-height:44px;
  letter-spacing:-.01em; cursor:pointer; margin-top:6px;
  box-shadow:rgba(255,255,255,.18) 0 1px 0 0 inset, rgba(79,142,247,.35) 0 8px 24px -8px;}
.btn-send:hover{background:#5F9AF8;}
.btn-send:disabled{opacity:.6; cursor:default;}
.form-note{margin:14px auto 0; font-size:13px; color:var(--veil); text-align:center;}
.privacy{margin:10px auto 0; font-size:12px; line-height:1.5; color:var(--veil); text-align:center;}
.privacy a{color:var(--frost); text-decoration:underline; text-underline-offset:2px;}
.privacy a:hover{color:#fff;}
.form-note.success{color:#2DD4BF;} .form-note.error{color:#F87171;}

/* ── Rodapé ─────────────────────────────────────────────────────────────── */
.footer{margin-top:var(--gap); padding:56px 0 0; box-shadow:0 -1px 0 0 var(--edge-soft);}
.footer-inner{display:grid; grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));
  gap:40px 32px;}
@media (max-width:720px){ .footer-inner{grid-template-columns:1fr;} }
.footer-brand p{font-size:14px; line-height:1.6; color:var(--veil); margin-top:16px; max-width:40ch;}
.ft-col{display:flex; flex-direction:column; gap:0;}
.ft-col strong{font-size:13px; font-weight:500; color:var(--ice); margin-bottom:6px;}
.ft-col a{font-size:14px; color:var(--veil); padding:6px 0;}
.ft-col a:hover{color:var(--frost);}
.footer-bottom{margin-top:48px; padding:22px 0 36px; box-shadow:0 -1px 0 0 var(--edge-soft);}
.footer-bottom .container{display:flex; gap:10px 24px; flex-wrap:wrap;}
.footer-bottom span{font-family:var(--mono); font-size:12px; color:var(--veil);}

/* ── Revelação (a mesma classe que o main.js liga) ────────────────────────
   Só esconde quando o <html> tem a classe .js, posta por um script de uma
   linha no <head>. Sem JavaScript — ou se o main.js não carregar em 3 s, caso
   em que esse script retira a classe — o conteúdo aparece logo, sem animação.
   Antes, sem JS, 25 dos 34 blocos ficavam invisíveis. */
.rv{transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);}
.js .rv:not(.in){opacity:0; transform:translateY(14px);}
.rv.d1{transition-delay:.08s} .rv.d2{transition-delay:.16s} .rv.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .rv,.js .rv:not(.in){opacity:1; transform:none; transition:none;}
}

/* ═══ Catálogo de soluções (solucoes.html) ══════════════════════════════════ */
.sol-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
  gap:16px; margin-top:56px;}
.sol-card{display:flex; flex-direction:column; background:var(--glass);
  border-radius:16px; padding:24px; box-shadow:var(--card);
  transition:box-shadow .25s, transform .25s;}
.sol-card:hover{transform:translateY(-3px);
  box-shadow:rgba(199,210,224,.2) 0 1px 1px 0 inset,
             rgba(127,170,245,.08) 0 24px 48px 0 inset,
             rgba(5,7,13,.7) 0 24px 32px 0;}
.sol-card .tile{width:48px; height:48px; border-radius:9999px; background:var(--wash);
  box-shadow:var(--hair); display:flex; align-items:center; justify-content:center;
  color:var(--frost); margin-bottom:20px;}
.sol-card:hover .tile{color:var(--blue);}
.sol-card h3{font-size:18px; margin-bottom:10px;}
.sol-card p{font-size:14px; line-height:1.6; color:var(--mist); max-width:none; flex:1;}
/* Sete cartões: o último fica centrado em vez de sozinho à esquerda */
@media (min-width:1000px){
  .sol-grid.sete{grid-template-columns:repeat(6,minmax(0,1fr));}
  .sol-grid.sete > .sol-card{grid-column:span 2;}
  .sol-grid.sete > .sol-card:last-child{grid-column:3 / span 2;}
}
@media (min-width:700px) and (max-width:999px){
  .sol-grid.sete{grid-template-columns:repeat(4,minmax(0,1fr));}
  .sol-grid.sete > .sol-card{grid-column:span 2;}
  .sol-grid.sete > .sol-card:last-child{grid-column:2 / span 2;}
}
/* «Para quem» / «Integra»: a mesma linha no mesmo sítio de cada cartão */
.sol-card .sol-meta{flex:none; margin-top:14px; padding-top:12px; font-size:13px; line-height:1.5;
  color:var(--frost); box-shadow:0 -1px 0 0 var(--edge-soft);}
.sol-card .sol-meta b{font-weight:500; color:var(--ice);}
.sol-card .foot{display:flex; align-items:center; gap:12px; margin-top:20px;}
.sol-card .go{margin-left:auto; display:inline-flex; align-items:center; gap:7px;
  font-size:13px; color:var(--frost);}
.sol-card .go svg{transition:transform .18s ease;}
.sol-card:hover .go{color:#fff;}
.sol-card:hover .go svg{transform:translateX(3px);}

/* Título da página de catálogo — grande, mas não é o wordmark */
.page-title{font-family:var(--display); font-weight:500; color:var(--ice);
  font-size:clamp(36px,5.2vw,58px); line-height:1.08; letter-spacing:-.01em;
  margin-bottom:24px;}

/* ═══ Página de texto (privacidade.html) ════════════════════════════════════ */
.prose{max-width:720px; margin:0 auto; padding:72px 0 0;}
.prose .eyebrow{justify-content:flex-start; margin-bottom:24px;}
.prose .eyebrow::before{display:none;}
.prose h1{font-family:var(--display); font-weight:500; font-size:clamp(32px,5vw,48px);
  line-height:1.12; color:var(--ice); margin-bottom:14px;}
.prose .updated{font-size:14px; color:var(--veil); margin-bottom:40px;}
.prose h2{font-family:var(--display); font-weight:500; font-size:22px; line-height:1.3;
  color:var(--ice); margin:44px 0 12px;}
.prose p,.prose li{font-size:16px; line-height:1.7; color:var(--frost); max-width:none;}
.prose p + p{margin-top:12px;}
.prose ul{margin:12px 0 0 0; padding-left:20px; display:grid; gap:8px;}
.prose li::marker{color:var(--veil);}
.prose strong{color:var(--ice); font-weight:500;}
.prose a{color:var(--frost); text-decoration:underline; text-underline-offset:2px;}
.prose a:hover{color:#fff;}
.prose .box{margin-top:16px; border-radius:16px; padding:20px 24px; background:var(--glass);
  box-shadow:var(--card);}
.prose .box p{font-size:15px;}

/* Telemóvel: cabeçalhos centrados do catálogo um degrau abaixo */
@media (max-width:560px){
  .head h2{font-size:24px;}
  .head p{font-size:16px;}
}

/* ══ Home (v2.75.0) ═════════════════════════════════════════════════════════
   Um só molde para todas as secções e um só tipo de linha, para o ritmo da
   página vir da repetição em vez de cada secção ter o seu desenho:
   · .sec    — secção separada da anterior por um fio, título à esquerda
               (.split-head, fixo ao rolar no computador) e conteúdo à direita
   · .item   — linha com nome à esquerda e texto à direita; serve as áreas, os
               passos do método e a prova
   Caixas só onde há um objeto: o exemplo do hero, a conta ilustrativa e o
   formulário. Escala: 50 · 30 · 18 · 16 · 14 · 12 px. */
.sec{padding:88px 0; box-shadow:0 -1px 0 0 var(--edge-soft);}
.split{display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:56px; align-items:start;}
.split-head{position:sticky; top:96px;}
.kicker{font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--mist); margin-bottom:14px;}
.split-head h2{font-size:clamp(26px,2.6vw,30px); line-height:1.2;}
.split-head p{margin-top:14px; font-size:16px; line-height:1.6; color:var(--mist);}

.list{list-style:none;}
.item{display:grid; grid-template-columns:minmax(0,190px) minmax(0,1fr); gap:24px;
  padding:22px 0; box-shadow:0 -1px 0 0 var(--edge-soft);}
.item:first-child{padding-top:0; box-shadow:none;}
.item h3{font-size:18px; line-height:1.35;}
.item h3 .n{display:block; font-family:var(--mono); font-size:12px; font-weight:400;
  color:var(--blue); letter-spacing:.06em; margin-bottom:6px;}
.item p{font-size:16px; line-height:1.6; color:var(--frost); max-width:none;}
.item p + p{margin-top:8px;}
/* Antes / depois de cada área: etiqueta numa coluna, texto na outra */
.ba{display:grid; grid-template-columns:110px minmax(0,1fr); gap:8px 12px;}
.ba dt{font-family:var(--mono); font-size:12px; line-height:1.6; padding-top:3px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--veil);}
.ba dt.to{color:var(--blue);}
.ba dd{font-size:16px; line-height:1.6; color:var(--frost);}
.item .tags{justify-content:flex-start; margin:0;}
.more{display:inline-flex; align-items:center; gap:8px; margin-top:12px; font-size:15px;
  font-weight:500; color:var(--ice); min-height:44px;}
.more svg{transition:transform .18s ease;}
.more:hover svg{transform:translateX(3px);}
.reach{margin-top:28px; font-size:15px; line-height:1.6; color:var(--mist); max-width:none;}
.reach b{color:var(--frost); font-weight:500;}

/* Hero: texto à esquerda, um exemplo concreto à direita */
.hero2{padding:72px 0 88px;}
.hero2 .split{grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:56px; align-items:center;}
.hero2 h1{font-size:clamp(34px,4.2vw,50px); line-height:1.1; letter-spacing:-.015em;}
.hero2 .lede{margin-top:20px; font-size:18px; line-height:1.6; color:var(--frost); max-width:46ch;}
.hero2 .hero-actions{justify-content:flex-start; margin-top:30px;}
.hero2 .note{margin-top:18px; font-size:14px; color:var(--mist);}
.hero2 .note b{color:var(--ice); font-weight:500;}
.example{border-radius:16px; padding:24px; background:var(--glass); box-shadow:var(--card);}
.example .kicker{margin-bottom:18px;}
.example .ex-h{font-size:14px; font-weight:500; color:var(--mist); margin-bottom:10px;}
.example .manual{list-style:none; display:grid; gap:6px; font-size:15px; color:var(--frost);}
.example .manual li{display:flex; gap:10px; align-items:baseline;}
.example .manual li::before{content:"·"; color:var(--veil);}
.example .after{margin-top:20px; padding-top:20px; box-shadow:0 -1px 0 0 var(--edge-soft);}
.example .after .ex-h{color:var(--blue);}
.example .flow{justify-content:flex-start;}
.example .after p{margin-top:12px; font-size:14px; color:var(--mist);}

/* Calculadora de potencial (Fase 5, v2.80.0): três entradas, três resultados.
   As contas são feitas no navegador (main.js); sem JS mostra o exemplo 100 h × 15 € × 60%. */
.calc{margin-top:32px; border-radius:16px; padding:22px 24px; background:var(--glass);
  box-shadow:var(--hair);}
.calc .kicker{margin-bottom:14px;}
.calc-in{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.3fr); gap:0 12px;}
.calc-in input[type=range]{width:100%; min-height:44px; accent-color:var(--blue); cursor:pointer;
  background:none; box-shadow:none; padding:0;}
.calc-in output{color:var(--ice); font-weight:500; font-variant-numeric:tabular-nums;}
.calc-out{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:6px;
  padding-top:16px; box-shadow:0 -1px 0 0 var(--edge-soft); font-variant-numeric:tabular-nums;}
.calc-out dt{font-family:var(--mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--mist);}
.calc-out dd{margin-top:4px; font-family:var(--display); font-size:24px; font-weight:500;
  color:var(--ice); line-height:1.2;}
.calc-out dd small{font-family:var(--sans); font-size:13px; font-weight:400; color:var(--mist);}
.calc-out .res dd{color:var(--blue);}
.calc-note{margin-top:14px; font-size:13px; line-height:1.5; color:var(--mist); max-width:none;}
.calc-note b{color:var(--frost); font-weight:500;}
.calc .more{margin-top:6px;}
@media (max-width:640px){
  .calc-in{grid-template-columns:1fr;}
  .calc-out{grid-template-columns:1fr; gap:10px;}
  .calc-out div{display:flex; align-items:baseline; justify-content:space-between; gap:12px;}
  .calc-out dd{margin-top:0; font-size:20px;}
}

.split .contact{max-width:none; margin:0;}
/* A última secção já traz o seu espaço; o rodapé não soma outro */
body:has(.hero2) .footer{margin-top:0;}
.split-head .direct{margin-top:22px; font-size:15px; color:var(--mist);}
.split-head .direct a{color:var(--ice); text-decoration:underline; text-underline-offset:3px;}

@media (max-width:860px){
  .split,.hero2 .split{grid-template-columns:1fr; gap:28px;}
  .split-head{position:static;}
  .sec{padding:64px 0;}
  .hero2{padding:40px 0 64px;}
}
@media (max-width:560px){
  .item{grid-template-columns:1fr; gap:8px;}
  .ba{grid-template-columns:1fr; gap:2px;}
  .ba dd + dt{margin-top:8px;}
  .hero2 .lede{font-size:16px;}
  .example{padding:20px 18px;}
}

/* ══ Páginas de serviço (v2.78.0) ═══════════════════════════════════════════
   Mesmo molde da home (.hero2, .sec + .split, .item); só se juntam o caminho
   no topo, as perguntas frequentes e o fecho com o botão do diagnóstico. */
.crumbs{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:14px;
  font-family:var(--mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--mist);}
.crumbs a{color:var(--frost); text-decoration:underline; text-underline-offset:3px;}
.crumbs a:hover{color:var(--ice);}
.crumbs span[aria-hidden]{color:var(--veil);}
.faq{display:grid;}
.faq-item{box-shadow:0 -1px 0 0 var(--edge-soft);}
.faq-item:first-child{box-shadow:none;}
.faq-item summary{display:flex; align-items:center; gap:16px; min-height:56px; padding:14px 0;
  cursor:pointer; list-style:none; font-size:18px; font-weight:500; line-height:1.35;
  color:var(--ice);}
.faq-item:first-child summary{padding-top:0;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:""; margin-left:auto; width:8px; height:8px; flex:none;
  border-right:1.5px solid var(--mist); border-bottom:1.5px solid var(--mist);
  transform:rotate(45deg) translateY(-2px); transition:transform .18s ease;}
.faq-item[open] summary::after{transform:rotate(-135deg) translateY(-2px);}
.faq-item summary:focus-visible{outline:2px solid var(--blue); outline-offset:2px; border-radius:8px;}
.faq-item p{padding:0 32px 20px 0; font-size:16px; line-height:1.6; color:var(--frost); max-width:none;}
.cta-end p{font-size:18px; line-height:1.6; color:var(--frost); max-width:56ch;}
.cta-end .hero-actions{justify-content:flex-start; margin-top:24px;}
@media (max-width:560px){
  .faq-item summary{font-size:16px;}
  .cta-end p{font-size:16px;}
}