/* Aligns — site institucional. Layout, tema, header, componentes.
   Estados iniciais de animação pertencem a motion.css; aqui o conteúdo é sempre visível. */

@font-face{font-family:Manrope;src:url("/site/assets/Manrope.ttf") format("truetype");font-style:normal;font-weight:200 800;font-display:swap}

:root{
  color-scheme:light;
  /* marca */
  --ink:#142D4E;
  --mint:#40D6BE;
  --paper:#F6F8FB;
  --white:#FFFFFF;
  /* derivados */
  --ink-2:#1B3B63;
  --ink-3:#26496F;
  --ink-deep:#0E2039;
  --mint-soft:#D6F5EF;
  --mint-deep:#0B6F64;
  --wash:#EAF1F3;
  --line:#D9E3E8;
  --line-strong:#B9CBD2;
  --text:#142D4E;
  --text-muted:#4A5D70;
  --text-on-dark:#E4ECF2;
  --text-muted-on-dark:#B6C5D2;
  --focus:#0B6F64;
  --focus-on-dark:#40D6BE;
  /* tipografia fluida */
  --fs-xs:clamp(.78rem,.76rem + .1vw,.84rem);
  --fs-sm:clamp(.88rem,.86rem + .12vw,.95rem);
  --fs-base:clamp(1rem,.97rem + .15vw,1.0625rem);
  --fs-lg:clamp(1.1rem,1.03rem + .35vw,1.3rem);
  --fs-h3:clamp(1.15rem,1.07rem + .4vw,1.4rem);
  --fs-h2:clamp(1.85rem,1.4rem + 2.1vw,3.2rem);
  --fs-h1:clamp(2.25rem,1.5rem + 3.6vw,4.6rem);
  /* espaço */
  --gutter:clamp(1.25rem,4vw,2.5rem);
  --max:1200px;
  --space-1:.5rem;
  --space-2:.75rem;
  --space-3:1rem;
  --space-4:1.5rem;
  --space-5:2rem;
  --space-6:3rem;
  --space-7:4.5rem;
  --section-y:clamp(4rem,8vw,7rem);
  /* forma */
  --radius-sm:6px;
  --radius:12px;
  --radius-lg:20px;
  --shadow-sm:0 1px 2px rgba(20,45,78,.06),0 1px 1px rgba(20,45,78,.04);
  --shadow-md:0 2px 4px rgba(20,45,78,.05),0 10px 24px -8px rgba(20,45,78,.14);
  --shadow-lg:0 4px 8px rgba(20,45,78,.06),0 24px 48px -16px rgba(20,45,78,.22);
  /* transição */
  --dur-fast:.15s;
  --dur:.28s;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --header-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 1rem);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--text);font-family:Manrope,"Segoe UI",Arial,sans-serif;font-size:var(--fs-base);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.menu-open{overflow:hidden}
img,svg,canvas{max-width:100%}
h1,h2,h3,p,ul,ol{margin-top:0}
ul,ol{padding-left:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.on-dark :focus-visible{outline-color:var(--focus-on-dark)}
::selection{background:var(--mint);color:var(--ink)}

.skip-link{position:absolute;z-index:100;top:.75rem;left:.75rem;padding:.7rem 1.1rem;background:var(--white);color:var(--ink);font-weight:700;border-radius:var(--radius-sm);box-shadow:var(--shadow-md);transform:translateY(-200%)}
.skip-link:focus{transform:translateY(0)}

.container{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.section{padding-block:var(--section-y)}
.section--tint{background:var(--wash)}
.section--dark{background:var(--ink);color:var(--text-on-dark)}
.on-dark{color:var(--text-on-dark);--text:var(--text-on-dark);--text-muted:var(--text-muted-on-dark);--mint-deep:var(--mint);--line:#2D4B6D;--line-strong:#2D4B6D}

/* ---------- tipografia ---------- */
h1,h2,h3{font-weight:650;letter-spacing:-.035em;color:var(--ink);text-wrap:balance;overflow-wrap:break-word}
.on-dark h1,.on-dark h2,.on-dark h3{color:var(--white)}
h1{margin-bottom:var(--space-4);font-size:var(--fs-h1);line-height:1.04;letter-spacing:-.05em;font-weight:620}
h2{margin-bottom:var(--space-3);font-size:var(--fs-h2);line-height:1.1;letter-spacing:-.045em;font-weight:620}
h3{margin-bottom:.5rem;font-size:var(--fs-h3);line-height:1.3}
p{text-wrap:pretty}
.eyebrow{display:flex;align-items:center;gap:.6rem;margin:0 0 var(--space-3);font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--mint-deep)}
.eyebrow::before{content:"";width:1.6rem;height:2px;background:var(--mint);flex:none}
.on-dark .eyebrow{color:var(--mint)}
.lede{max-width:60ch;font-size:var(--fs-lg);line-height:1.7;color:var(--text-muted)}
.on-dark .lede{color:var(--text-muted-on-dark)}
.section-head{max-width:46rem;margin-bottom:var(--space-6)}
.section-head h2{margin-bottom:var(--space-3)}
.section-head>p:last-child{margin-bottom:0;color:var(--text-muted);font-size:var(--fs-lg)}
.on-dark .section-head>p:last-child{color:var(--text-muted-on-dark)}
.measure{max-width:62ch}

/* ---------- botões e links ---------- */
.button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:48px;padding:.7rem 1.4rem;border:1px solid transparent;border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-sm);font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),translate var(--dur) var(--ease)}
.button:hover{translate:0 -2px}
.button:active{translate:0 0}
.button [aria-hidden="true"]{display:inline-block;transition:transform var(--dur) var(--ease-out)}
.button:hover [aria-hidden="true"]{transform:translate(3px,-3px)}
.button--primary{background:var(--ink);color:var(--white);box-shadow:var(--shadow-sm)}
.button--primary:hover{background:var(--ink-2);box-shadow:var(--shadow-md)}
.button--mint{background:var(--mint);color:var(--ink)}
.button--mint:hover{background:#6BE3D0;box-shadow:0 10px 28px -10px rgba(64,214,190,.7)}
.button--ghost{border-color:var(--line-strong);color:var(--ink);background:transparent}
.button--ghost:hover{border-color:var(--ink);background:var(--white)}
.on-dark .button--ghost{border-color:#486683;color:var(--white)}
.on-dark .button--ghost:hover{border-color:var(--mint);background:rgba(255,255,255,.06)}
.contact-link:not([hidden]){display:inline-flex}
.contact-fallback{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.contact-fallback .button{min-height:44px}

.link-arrow{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;font-size:var(--fs-sm);font-weight:700;text-decoration:none;color:var(--ink)}
.link-arrow span[aria-hidden="true"]{display:inline-block;transition:transform var(--dur) var(--ease-out);color:var(--mint-deep)}
.link-arrow:hover span[aria-hidden="true"],a:hover>.link-arrow span[aria-hidden="true"],.card:hover .link-arrow span[aria-hidden="true"]{transform:translateX(5px)}
.link-arrow--down:hover span[aria-hidden="true"]{transform:translateY(4px)}
.on-dark .link-arrow{color:var(--white)}
.on-dark .link-arrow span[aria-hidden="true"]{color:var(--mint)}
.on-dark .link-underline{color:var(--white)}
.link-underline{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size var(--dur) var(--ease)}
.link-underline:hover,.link-underline:focus-visible{background-size:100% 1.5px}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(246,248,251,.94);border-bottom:1px solid transparent;transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.site-header.is-scrolled{background:rgba(246,248,251,.98);border-bottom-color:var(--line);box-shadow:0 8px 24px -16px rgba(20,45,78,.3);backdrop-filter:saturate(1.2) blur(8px);-webkit-backdrop-filter:saturate(1.2) blur(8px)}
.header-inner{width:min(100% - 2*var(--gutter),var(--max));min-height:var(--header-h);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}
.brand{display:inline-flex;align-items:center;min-height:44px;flex:none}
.brand img{display:block;width:140px;height:auto}
.nav-panel{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-5);flex:1}
.nav-list{display:flex;align-items:center;gap:.25rem;margin:0;padding:0;list-style:none}
.nav-link,.nav-trigger{position:relative;display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:0 .85rem;border:0;background:none;font:inherit;font-size:var(--fs-sm);font-weight:650;color:#2C4560;text-decoration:none;cursor:pointer;border-radius:var(--radius-sm);transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease)}
.nav-link::after,.nav-trigger::after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:.35rem;height:2px;background:var(--mint);transform:scaleX(0);transform-origin:left;transition:transform var(--dur) var(--ease)}
.nav-link:hover,.nav-trigger:hover,.nav-trigger[aria-expanded="true"]{color:var(--ink)}
.nav-link:hover::after,.nav-trigger:hover::after,.nav-trigger[aria-expanded="true"]::after,.nav-trigger.is-current::after{transform:scaleX(1)}
.nav-caret{width:10px;height:10px;transition:transform var(--dur) var(--ease)}
.nav-trigger[aria-expanded="true"] .nav-caret{transform:rotate(180deg)}
.nav-item{position:relative}
.submenu{position:absolute;top:calc(100% + .4rem);left:0;min-width:19rem;margin:0;padding:.5rem;list-style:none;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg)}
.submenu a{display:block;padding:.7rem .85rem;border-radius:var(--radius-sm);text-decoration:none;font-size:var(--fs-sm);font-weight:650;color:var(--ink);transition:background-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.submenu a small{display:block;margin-top:.1rem;font-size:var(--fs-xs);font-weight:500;color:var(--text-muted)}
.submenu a:hover{background:var(--wash)}
.submenu a[aria-current="page"]{background:var(--mint-soft);color:var(--ink)}
.nav-link[aria-current="page"]::after{transform:scaleX(1)}
/* sem JavaScript o submenu abre por hover/foco; com JavaScript, só por .is-open */
.site-header:not(.has-js) .nav-item .submenu{display:none}
.site-header:not(.has-js) .nav-item:hover .submenu,.site-header:not(.has-js) .nav-item:focus-within .submenu{display:block}
.has-js .nav-item .submenu{display:none}
.has-js .nav-item.is-open .submenu{display:block}
.header-contact{display:flex;align-items:center}
.header-contact .button{min-height:44px;padding-inline:1.1rem}
.menu-toggle{display:none;align-items:center;justify-content:center;gap:.6rem;min-width:44px;min-height:44px;padding:0 .9rem;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--white);font:inherit;font-size:var(--fs-sm);font-weight:700;color:var(--ink);cursor:pointer}
.menu-toggle:not([hidden]){display:none}
.menu-bars{display:grid;gap:4px;width:18px}
.menu-bars span{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform var(--dur) var(--ease),opacity var(--dur-fast) var(--ease)}
.menu-toggle[aria-expanded="true"] .menu-bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-bars span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] .menu-bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media(max-width:960px){
  .menu-toggle:not([hidden]){display:inline-flex}
  .nav-panel{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:var(--space-4);padding:var(--space-3) 0 var(--space-4)}
  .nav-list{flex-direction:column;align-items:stretch;gap:0}
  .nav-link,.nav-trigger{width:100%;justify-content:space-between;min-height:52px;padding:0 .25rem;border-bottom:1px solid var(--line);border-radius:0;font-size:var(--fs-base)}
  .nav-link::after,.nav-trigger::after{display:none}
  .submenu{position:static;min-width:0;padding:.25rem 0 .25rem 1rem;border:0;border-left:2px solid var(--mint);border-radius:0;box-shadow:none;background:transparent;margin:.5rem 0 .5rem .25rem}
  .site-header:not(.has-js) .nav-item .submenu{display:block}
  .header-inner{flex-wrap:wrap}
  .site-header:not(.has-js) .header-inner{padding-block:.5rem}
  .site-header:not(.has-js) .nav-panel{width:100%;flex-basis:100%}
  .has-js .nav-panel{display:none;position:fixed;z-index:49;top:var(--header-h);left:0;right:0;bottom:0;margin:0;padding:var(--space-3) var(--gutter) var(--space-6);overflow-y:auto;background:var(--paper);border-top:1px solid var(--line)}
  .has-js.is-menu-open .nav-panel{display:flex}
  .header-contact{flex-direction:column;align-items:stretch}
  .header-contact .button,.header-contact .contact-fallback{width:100%}
  .header-contact .contact-fallback .button{flex:1}
}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding-block:clamp(2.5rem,6vw,5.5rem) clamp(3.5rem,7vw,6rem)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(2rem,5vw,4.5rem)}
.hero-grid>*{min-width:0}
.hero-copy{min-width:0}
.hero h1{max-width:16ch}
.hero--home h1{max-width:15ch}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);margin-top:var(--space-5)}
.hero-ring{position:absolute;z-index:0;pointer-events:none;border:1px solid var(--line);border-radius:50%;width:min(52vw,640px);aspect-ratio:1;right:-12vw;top:-16%}
.hero-ring::before,.hero-ring::after{content:"";position:absolute;border:1px solid var(--line);border-radius:50%;inset:12%}
.hero-ring::after{inset:26%}
.hero>.container{position:relative;z-index:1}

/* hero escuro de serviço */
.hero--dark{background:var(--ink);color:var(--text-on-dark);padding-block:clamp(1.5rem,3vw,2.5rem) clamp(3.5rem,7vw,6rem);background-image:radial-gradient(60% 80% at 85% 40%,rgba(64,214,190,.12),transparent 70%)}
.hero--dark h1{color:var(--white)}
.hero--dark .lede{color:var(--text-muted-on-dark)}
.hero--dark .hero-grid{padding-top:clamp(1.5rem,4vw,3.5rem)}
.breadcrumb{padding-bottom:var(--space-3)}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:.25rem .5rem;margin:0;padding:0;list-style:none;font-size:var(--fs-xs);font-weight:650;color:var(--text-muted-on-dark)}
.breadcrumb li{display:inline-flex;align-items:center;gap:.5rem}
.breadcrumb li+li::before{content:"/";color:#8DA6BC}
.breadcrumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--text-on-dark);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 78%/0 1px no-repeat;transition:background-size var(--dur) var(--ease)}
.breadcrumb a:hover{background-size:100% 1px}
.breadcrumb [aria-current="page"]{color:var(--mint)}

.hero-orb{position:relative;display:grid;place-items:center;aspect-ratio:1;width:min(100%,430px);max-width:100%;margin-inline:auto}
.hero-orb::before,.hero-orb::after{content:"";position:absolute;border:1px solid rgba(182,197,210,.22);border-radius:50%;inset:0}
.hero-orb::after{inset:14%;border-color:rgba(64,214,190,.28)}

/* visual do hero da home: caixa quadrada; o viewBox das linhas (0-100) escala de forma uniforme com ela.
   Nos de servico nos cantos; as linhas ligam a base/topo de cada no ao aro do orb central. */
.hero-visual{position:relative;width:min(100%,540px);margin-inline:auto;aspect-ratio:1}
.hero-visual__lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
.hero-visual__lines path{stroke:#2FA596;stroke-width:.34;stroke-linecap:round}
.hero-visual .orb{position:absolute;left:50%;top:50%;translate:-50% -50%}
.hero-visual .orb--hero{--orb-size:min(46%,250px)}
.hero-node{position:absolute;display:flex;flex-direction:column;justify-content:center;gap:.1rem;width:46%;min-height:64px;padding:.7rem .9rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--white);box-shadow:var(--shadow-sm);text-decoration:none;font-size:var(--fs-sm);font-weight:700;line-height:1.25;color:var(--ink);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),translate var(--dur) var(--ease)}
.hero-node small{font-size:var(--fs-xs);font-weight:600;color:var(--mint-deep)}
.hero-node:hover{border-color:var(--mint);box-shadow:var(--shadow-md);translate:0 -2px}
.hero-node--tl{left:0;top:0}
.hero-node--tr{right:0;top:0}
.hero-node--bl{left:0;bottom:0}
.hero-node--br{right:0;bottom:0}

/* hub interativo do hero (motion.js): no ativo, linha acesa, pulsos de fluxo, painel com a frase do card */
.hero-hub{position:relative;width:min(100%,540px);margin-inline:auto}
.hero-hub .hero-visual{width:100%}
.hero-glow{position:absolute;z-index:0;left:0;top:0;width:560px;height:560px;margin:-280px 0 0 -280px;border-radius:50%;background:radial-gradient(closest-side,rgba(64,214,190,.24),rgba(64,214,190,0));opacity:0;pointer-events:none}
.hub-line path.hub-lit,.hub-line path.hub-flow{stroke:#1FB9A0}
.hub-line .hub-lit{stroke-width:.85;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .6s var(--ease-out)}
.hub-line.is-active .hub-lit{stroke-dashoffset:0}
.hub-line .hub-flow{display:none;stroke-width:.7;stroke-dasharray:10 90;stroke-dashoffset:0}
.hero-hub.is-flowing .hub-flow{display:inline;animation:hub-flow 3.4s linear infinite}
.hero-hub.is-flowing .hub-line:nth-child(2) .hub-flow{animation-delay:-.9s}
.hero-hub.is-flowing .hub-line:nth-child(3) .hub-flow{animation-delay:-1.8s}
.hero-hub.is-flowing .hub-line:nth-child(4) .hub-flow{animation-delay:-2.6s}
.hero-hub.is-flowing .hub-line.is-active .hub-flow{animation-duration:1s}
/* botao de pausa (criado pelo motion.js; so aparece com JS e sem movimento reduzido) */
.motion-toggle{position:absolute;z-index:2;right:var(--gutter);bottom:.5rem;display:inline-flex;align-items:center;gap:.55rem;min-height:44px;padding:0 1rem;border:1px solid var(--line-strong);border-radius:999px;background:rgba(255,255,255,.85);font:inherit;font-size:var(--fs-xs);font-weight:700;color:#2C4560;cursor:pointer;transition:color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease)}
.motion-toggle:hover{color:var(--ink);border-color:var(--mint);background:var(--white)}
.motion-toggle__icon{position:relative;width:10px;height:12px;flex:none;border-left:3px solid var(--mint-deep);border-right:3px solid var(--mint-deep)}
.motion-toggle.is-paused .motion-toggle__icon{width:0;height:0;border-left:10px solid var(--mint-deep);border-right:0;border-top:6px solid transparent;border-bottom:6px solid transparent}
@keyframes hub-flow{to{stroke-dashoffset:-100}}
.hero-node{will-change:auto}
.hero-node.is-active{border-color:var(--mint);box-shadow:0 0 0 2px var(--mint),var(--shadow-md);translate:0 -2px}
.hero-node.is-active::after{content:"";position:absolute;top:.65rem;right:.65rem;width:.55rem;height:.55rem;border-radius:50%;background:var(--mint)}
.hero-node:focus-visible{outline-offset:2px}
.hub-panel{display:none}
.hero-hub.is-live .hub-panel{display:block;min-height:7.6rem;margin-top:var(--space-4);padding:var(--space-4);border:1px solid var(--line);border-left:3px solid var(--mint);border-radius:var(--radius);background:var(--white);box-shadow:var(--shadow-sm);transition:opacity var(--dur) var(--ease)}
.hero-hub.is-live .hub-panel.is-empty{opacity:0;visibility:hidden}
.hub-title{display:block;font-size:var(--fs-lg);font-weight:700;letter-spacing:-.025em;color:var(--ink)}
.hub-text{display:block;margin:.25rem 0 .1rem;font-size:var(--fs-sm);line-height:1.55;color:var(--text-muted)}
.hub-panel .link-arrow{min-height:40px}

/* ---------- orbs ---------- */
.orb{display:block;flex:none;width:var(--orb-size,80px);height:auto;max-width:100%;aspect-ratio:1}
.orb--hero{--orb-size:clamp(200px,26vw,300px)}
.orb--stage{--orb-size:clamp(240px,34vw,400px)}
.orb--card{--orb-size:clamp(96px,9vw,116px)}
.orb--side{--orb-size:clamp(88px,10vw,112px)}
.orb--inline{--orb-size:22px}
.orb--cta{--orb-size:clamp(180px,24vw,300px)}

/* ---------- faixa de capacidades ---------- */
.capabilities{overflow:hidden;border-block:1px solid var(--line);background:var(--white)}
.capabilities-list{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 0;margin:0;padding:1.1rem var(--gutter);list-style:none}
.capabilities-list li{display:inline-flex;align-items:center;min-height:36px;font-size:var(--fs-sm);font-weight:700;letter-spacing:-.01em;color:#2C4560;white-space:nowrap}
.capabilities-list li::after{content:"";width:5px;height:5px;margin-inline:1.1rem;border-radius:50%;background:var(--mint);flex:none}
.capabilities-list li:last-child::after{display:none}

/* ---------- cards ---------- */
.grid{display:grid;gap:var(--space-4);margin:0;padding:0;list-style:none}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{position:relative;display:flex;flex-direction:column;height:100%;padding:var(--space-5);background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:inherit;text-decoration:none;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),translate var(--dur) var(--ease)}
.card:hover,.card:focus-within{border-color:var(--mint);box-shadow:var(--shadow-lg);translate:0 -4px}
.card h3{margin-top:.25rem}
.card p{color:var(--text-muted);font-size:var(--fs-sm)}
.card .link-arrow{margin-top:auto}
.card .link-arrow::after{content:"";position:absolute;inset:0;border-radius:inherit}
.card-orb{display:grid;place-items:center;width:fit-content;max-width:100%;padding:.4rem;margin:0 0 var(--space-4);border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(150deg,var(--white),var(--mint-soft))}
.card-list{margin:0 0 var(--space-4);padding:0;list-style:none;font-size:var(--fs-sm);font-weight:600;color:var(--ink)}
.card-list li{position:relative;padding:.4rem 0 .4rem 1.4rem;border-top:1px solid var(--line)}
.card-list li::before{content:"";position:absolute;left:0;top:1.1em;width:.7rem;height:2px;background:var(--mint)}
.service-cards .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.service-cards .card{padding:clamp(1.5rem,3vw,2.25rem)}

.card--link{padding:var(--space-4) var(--space-5)}
.card-top{display:flex;align-items:center;gap:.7rem;margin-bottom:.6rem}
.card-top h3{margin:0;font-size:var(--fs-lg)}

/* pilares, cobrança e princípios */
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);margin:var(--space-6) 0 0;padding:0;list-style:none}
.pillars li{padding-top:var(--space-4);border-top:2px solid var(--mint)}
.pillars h3{margin-bottom:.4rem}
.pillars p{margin:0;color:var(--text-muted);font-size:var(--fs-sm)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.split>div>p{color:var(--text-muted);font-size:var(--fs-lg)}
.fact-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--line-strong)}
.fact-list li{padding:var(--space-4) 0;border-bottom:1px solid var(--line-strong)}
.fact-list h3{margin-bottom:.35rem;font-size:var(--fs-lg)}
.fact-list p{margin:0;color:var(--text-muted);font-size:var(--fs-sm)}
.on-dark .fact-list{border-color:#2D4B6D}
.on-dark .fact-list li{border-color:#2D4B6D}
.on-dark .fact-list p{color:var(--text-muted-on-dark)}
.principles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none}
.principles li{padding:var(--space-4);border-left:2px solid var(--mint);background:var(--white);border-radius:0 var(--radius) var(--radius) 0;font-weight:650;font-size:var(--fs-sm);box-shadow:var(--shadow-sm)}

/* ---------- processo ---------- */
/* Marcador (circulo 2.6rem) no topo de cada passo; li::after e o trecho de trilho ate o proximo marcador (cinza,
   so CSS: sem JS o <ol> continua parecendo completo). O .progress-line (motion.js) preenche o trilho do centro
   do 1o ao do ultimo marcador. Horizontal em tela larga, vertical ate 720px. */
.process{--pgap:var(--space-5);position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--pgap);margin:0;padding:0;list-style:none;counter-reset:step}
.process li{position:relative;padding:calc(2.6rem + var(--space-3)) 0 0;counter-increment:step}
.process li::before{content:counter(step,decimal-leading-zero);position:absolute;z-index:2;left:0;top:0;display:grid;place-items:center;width:2.6rem;height:2.6rem;border:2px solid var(--line-strong);border-radius:50%;background:var(--white);font-size:var(--fs-xs);font-weight:800;color:var(--mint-deep);transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.process li::after{content:"";position:absolute;z-index:0;left:1.3rem;top:calc(1.3rem - 1.5px);width:calc(100% + var(--pgap));height:3px;border-radius:3px;background:var(--line-strong)}
.process li:last-child::after{display:none}
.process li.is-done::before{border-color:var(--mint)}
.process li.is-active::before{background:var(--mint);border-color:var(--mint);color:var(--ink)}
.process li.is-active h3{color:var(--mint-deep)}
.process h3{transition:color var(--dur) var(--ease)}
.process p{margin:0;color:var(--text-muted);font-size:var(--fs-sm)}
.progress-line{position:absolute;z-index:1;left:1.3rem;top:calc(1.3rem - 1.5px);width:0;height:3px;background:var(--mint);transform-origin:left center;pointer-events:none;border-radius:3px}
.progress-line.is-vertical{top:1.3rem;margin-left:-1.5px;transform-origin:center top}

/* ---------- conteúdo de serviço ---------- */
.check-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--space-6);margin:0;padding:0;list-style:none}
.check-list li{position:relative;padding:var(--space-3) 0 var(--space-3) 2rem;border-top:1px solid var(--line-strong);font-size:var(--fs-base);color:var(--text)}
.check-list li::before{content:"";position:absolute;left:.2rem;top:1.45rem;width:.8rem;height:.8rem;border:2px solid var(--mint);border-radius:50%}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none}
.tile{position:relative;height:100%;padding:var(--space-5) var(--space-5) var(--space-5);background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);font-weight:600;line-height:1.55;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),translate var(--dur) var(--ease)}
.tile::before{content:"";display:block;width:1.8rem;height:3px;margin-bottom:var(--space-3);background:var(--mint);border-radius:3px;transition:width var(--dur) var(--ease)}
.tile:hover{border-color:var(--line-strong);box-shadow:var(--shadow-md);translate:0 -3px}
.tile:hover::before{width:3rem}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-5);margin:0;padding:0;list-style:none;counter-reset:s}
.steps--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.steps li{padding-top:var(--space-4);border-top:3px solid var(--line-strong);counter-increment:s}
.steps li::before{content:counter(s,decimal-leading-zero);display:block;margin-bottom:var(--space-3);font-size:var(--fs-xs);font-weight:800;letter-spacing:.1em;color:var(--mint-deep)}
.steps h3{font-size:var(--fs-lg)}
.steps p{margin:0;color:var(--text-muted);font-size:var(--fs-sm)}
.steps li:hover{border-top-color:var(--mint)}
.section-note{max-width:62ch;margin:var(--space-5) 0 0;color:var(--text-muted);font-size:var(--fs-base)}
.columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.columns h3{margin-bottom:var(--space-2)}
.columns>div>p{color:var(--text-muted);font-size:var(--fs-sm)}
.columns .check-list{grid-template-columns:1fr}
.columns .check-list li{font-size:var(--fs-sm)}
.example-note{margin-bottom:var(--space-4);font-size:var(--fs-sm);color:var(--text-muted)}
.examples .tile{background:var(--paper)}

/* entregas: cartao com icone, indice e titulo */
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none;counter-reset:feat}
.feature-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.columns{counter-reset:feat}
.feature{position:relative;display:flex;flex-direction:column;height:100%;padding:var(--space-5);background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);counter-increment:feat;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),translate var(--dur) var(--ease)}
.feature::after{content:counter(feat,decimal-leading-zero);position:absolute;top:1.25rem;right:1.4rem;font-size:var(--fs-xs);font-weight:800;letter-spacing:.1em;color:var(--mint-deep)}
.feature:hover,.feature:focus-within{border-color:var(--mint);box-shadow:var(--shadow-lg);translate:0 -3px}
.feature-icon{display:grid;place-items:center;width:3rem;height:3rem;margin-bottom:var(--space-4);border-radius:var(--radius);background:var(--mint-soft);color:var(--mint-deep);transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.feature-icon svg{width:1.5rem;height:1.5rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.feature:hover .feature-icon,.feature:focus-within .feature-icon{background:var(--ink);color:var(--mint)}
.feature h3{margin:0 0 .4rem;font-size:var(--fs-lg);font-weight:700;letter-spacing:-.025em}
.feature p{margin:0;color:var(--text-muted);font-size:var(--fs-sm)}
.feature .check-list{margin-top:var(--space-4)}
.columns .feature{padding:var(--space-5) var(--space-5) var(--space-4)}
.columns .feature .check-list li{padding-block:.7rem}
.columns .feature .check-list li::before{top:1.1rem}

/* sinais: introducao fixa a esquerda, lista numerada a direita */
.signals-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.signals-intro{position:sticky;top:calc(var(--header-h) + 2rem)}
.signals-intro>p:not(.eyebrow){max-width:38ch;margin-bottom:0;color:var(--text-muted);font-size:var(--fs-lg)}
.signals-intro .orb{margin-top:var(--space-5)}
.signals{margin:0;padding:0;list-style:none;counter-reset:sig;border-top:1px solid var(--line-strong)}
.signals li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-3);border-bottom:1px solid var(--line-strong);counter-increment:sig;font-weight:600;line-height:1.5;transition:background-color var(--dur) var(--ease),padding-left var(--dur) var(--ease)}
.signals li::before{content:counter(sig,decimal-leading-zero);display:grid;place-items:center;width:2.5rem;height:2.5rem;border:1.5px solid var(--mint);border-radius:50%;background:var(--white);font-size:var(--fs-xs);font-weight:800;color:var(--mint-deep)}
.signals li:hover{padding-left:var(--space-4);background:var(--white)}

/* exemplos: rotulados como ilustracao, nao como caso entregue */
.example-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);margin:0;padding:0;list-style:none;counter-reset:ex}
.example{display:flex;flex-direction:column;align-items:flex-start;height:100%;padding:var(--space-5);border:1.5px dashed var(--line-strong);border-radius:var(--radius-lg);background:var(--paper);font-weight:600;line-height:1.55;counter-increment:ex}
.example::before{content:"Exemplo " counter(ex,decimal-leading-zero);display:inline-flex;margin-bottom:var(--space-3);padding:.2rem .7rem;border:1px solid var(--line-strong);border-radius:999px;background:var(--white);font-size:var(--fs-xs);font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--mint-deep)}

/* ---------- FAQ ---------- */
.faq-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.faq-intro{position:sticky;top:calc(var(--header-h) + 2rem)}
.faq-intro h2{margin-bottom:var(--space-3)}
.faq-intro>p:not(.eyebrow){max-width:34ch;color:var(--text-muted);font-size:var(--fs-lg)}
.faq{max-width:50rem;border-top:1px solid var(--line-strong)}
.faq-layout .faq{max-width:none}
.faq details{border-bottom:1px solid var(--line-strong)}
.faq summary{position:relative;display:flex;align-items:center;min-height:56px;padding:var(--space-3) 3rem var(--space-3) 0;font-size:var(--fs-lg);font-weight:650;letter-spacing:-.02em;line-height:1.35;cursor:pointer;list-style:none;transition:color var(--dur-fast) var(--ease)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:.4rem;top:50%;width:.6rem;height:.6rem;border-right:2px solid var(--mint-deep);border-bottom:2px solid var(--mint-deep);translate:0 -70%;rotate:45deg;transition:rotate var(--dur) var(--ease),translate var(--dur) var(--ease)}
.faq summary:hover{color:var(--mint-deep)}
.faq details[open] summary::after{rotate:225deg;translate:0 -20%}
.faq details p{max-width:62ch;margin:0 0 var(--space-4);color:var(--text-muted)}
/* abertura suave so com CSS (navegadores sem ::details-content abrem sem animacao) */
@supports selector(::details-content){
  .faq details{interpolate-size:allow-keywords}
  .faq details::details-content{block-size:0;overflow:hidden;opacity:0;transition:block-size var(--dur) var(--ease),opacity var(--dur) var(--ease),content-visibility var(--dur) allow-discrete}
  .faq details[open]::details-content{block-size:auto;opacity:1}
}

/* ---------- CTA final ---------- */
.cta{position:relative;overflow:hidden;background:var(--ink);color:var(--text-on-dark)}
.cta-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center;gap:var(--space-6);padding-block:clamp(4rem,8vw,6.5rem)}
.cta h2{max-width:14ch;color:var(--white)}
.cta p{max-width:46ch;color:var(--text-muted-on-dark);font-size:var(--fs-lg)}
.cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);margin-top:var(--space-5)}
.cta-visual{display:grid;place-items:center}
.cta-ring{position:absolute;z-index:0;right:-8vw;bottom:-45%;width:min(60vw,720px);aspect-ratio:1;border:1px solid #2D4B6D;border-radius:50%;pointer-events:none}
.cta-ring::before,.cta-ring::after{content:"";position:absolute;inset:12%;border:1px solid #2D4B6D;border-radius:50%}
.cta-ring::after{inset:26%;border-color:#35597D}

/* ---------- rodapé ---------- */
.site-footer{background:var(--white);border-top:1px solid var(--line)}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:var(--space-6);padding-block:var(--space-7) var(--space-6)}
.footer-brand img{display:block;width:130px;height:auto}
.footer-sign{margin:var(--space-3) 0 .25rem;font-weight:700;color:var(--ink)}
.footer-note{margin:0;padding-bottom:.15rem;color:var(--text-muted);font-size:var(--fs-sm);line-height:1.6}
.footer-col h2{margin-bottom:var(--space-3);font-size:var(--fs-xs);letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--text-muted)}
.footer-col ul{margin:0;padding:0;list-style:none}
.footer-col a{display:inline-flex;align-items:center;min-height:44px;font-size:var(--fs-sm);font-weight:600;color:var(--ink);text-decoration:none;background:linear-gradient(var(--mint),var(--mint)) 0 82%/0 2px no-repeat;transition:background-size var(--dur) var(--ease)}
.footer-col a:hover{background-size:100% 2px}
.footer-base{padding-block:var(--space-4) var(--space-5);border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--text-muted)}
.footer-base p{margin:0}

/* ---------- responsivo ---------- */
@media(max-width:1080px){
  .grid--4,.feature-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps--5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .principles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .hero-grid{grid-template-columns:minmax(0,1fr)}
  .hero h1,.hero--home h1{max-width:18ch}
  .hero-visual{width:100%}
  .hero-hub{width:min(100%,460px)}
  .hero-orb{width:min(70%,340px)}
  .split,.signals-layout,.faq-layout{grid-template-columns:minmax(0,1fr)}
  .signals-intro,.faq-intro{position:static}
  .grid--3,.tiles,.columns,.feature-grid,.example-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process{--pgap:var(--space-4)}
  .cta-inner{grid-template-columns:minmax(0,1fr)}
  .cta-visual{order:-1;justify-self:start}
  .orb--cta{--orb-size:140px}
  .footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .footer-grid>:first-child{grid-column:1/-1}
}
@media(max-width:720px){
  :root{--header-h:64px}
  .brand img{width:120px}
  .service-cards .grid,.grid--2,.grid--3,.grid--4,.tiles,.columns,.check-list,.pillars,.principles,.feature-grid,.feature-grid--4,.example-list{grid-template-columns:minmax(0,1fr)}
  .steps,.steps--5{grid-template-columns:minmax(0,1fr);gap:0;padding-left:1.75rem;border-left:0}
  .steps li{padding:0 0 var(--space-5) 1.5rem;border-top:0;border-left:3px solid var(--line-strong)}
  .steps li::before{margin-bottom:.4rem}
  /* processo vertical: marcadores a esquerda, trilho entre eles */
  .process{grid-template-columns:minmax(0,1fr);gap:0}
  .process li{min-height:2.6rem;padding:0 0 var(--space-5) 3.6rem}
  .process li:last-child{padding-bottom:0}
  .process li::after{left:calc(1.3rem - 1.5px);top:1.3rem;width:3px;height:100%}
  .process li h3{margin-top:.45rem}
  .signals li{padding-inline:.25rem}
  /* visual do hero: orb no topo e os quatro nos em grade 2x2 (sem as linhas) */
  .hero-visual{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;width:100%;aspect-ratio:auto}
  .hero-hub{width:100%}
  .hero-visual__lines{display:none}
  .hero-hub.is-live .hub-panel{min-height:8.6rem}
  .hero-visual .orb{position:static;translate:none;grid-column:1/-1;justify-self:center;margin-bottom:.25rem}
  .hero-visual .orb--hero{--orb-size:min(62vw,220px)}
  .hero-node{position:static;width:auto;min-height:60px;font-size:var(--fs-xs);padding:.6rem .75rem}
  .hero-ring{display:none}
  .capabilities-list{justify-content:flex-start}
  .footer-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-5)}
  .faq summary{font-size:var(--fs-base)}
}
@media(max-width:400px){
  .button{width:100%}
  .hero-actions .button,.cta-actions .button,.cta-actions .contact-fallback{width:100%}
  .hero-actions{align-items:stretch}
  .hero-node{padding:.5rem .6rem}
}
@media(min-width:1500px){
  :root{--max:1280px}
}

/* ---------- movimento reduzido ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  .button:hover,.card:hover,.tile:hover,.feature:hover,.hero-node:hover{translate:none}
  .faq details::details-content{transition:none!important}
  .hub-flow{display:none!important}
  .hero-glow{display:none}
  .hub-lit{transition:none}
  .signals li:hover{padding-left:var(--space-3)}
}

.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}