/* =========================================================
   B5 Investimentos — landing page
   Paleta e tipografia seguem o Manual de Marca.
   ========================================================= */
@font-face{font-family:"Red Hat Display";font-weight:300;font-display:swap;src:url("../fonts/RedHatDisplay-Light.ttf") format("truetype")}
@font-face{font-family:"Red Hat Display";font-weight:400;font-display:swap;src:url("../fonts/RedHatDisplay-Regular.ttf") format("truetype")}
@font-face{font-family:"Red Hat Display";font-weight:700;font-display:swap;src:url("../fonts/RedHatDisplay-Bold.ttf") format("truetype")}

:root{
	--navy:#131A2E; --mid:#2C3D6D; --accent:#6883CE; --white:#fff; --mist:#EEF1F8;
	--ink:#131A2E; --ink-soft:rgba(19,26,46,.68); --on-dark-soft:rgba(255,255,255,.72);
	--line-dark:rgba(19,26,46,.14); --line-light:rgba(255,255,255,.16);
	--font:"Red Hat Display",system-ui,-apple-system,"Segoe UI",sans-serif;
	--ease:cubic-bezier(.22,.7,.2,1);
	--gutter:clamp(20px,5vw,72px);
	--max:1240px;
	--hdr:84px;
	/* Padrão de respiro: seção · título→conteúdo · bloco→bloco */
	--sec-y:clamp(72px,8.5vw,128px);
	--head-gap:clamp(36px,4.5vw,64px);
	--block-gap:clamp(40px,5vw,72px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-weight:400;font-size:clamp(16px,1.05vw + 8px,18px);line-height:1.6;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:10px 16px;z-index:100}
.skip:focus{left:8px}
.wrap{width:100%;max-width:calc(var(--max) + var(--gutter)*2);margin:0 auto;padding:0 var(--gutter)}
section{position:relative}
.section{padding:var(--sec-y) 0}
.sec-head{margin-bottom:var(--head-gap)}
/* duas seções escuras seguidas não somam o respiro duas vezes */
.andre{padding-bottom:calc(var(--sec-y) * .6)}
.andre + .dif{padding-top:calc(var(--sec-y) * .6)}
[data-theme="dark"]{background:var(--navy);color:#fff}

/* Tipografia */
h1,h2,h3{font-weight:700;letter-spacing:-.02em;line-height:1.08}
h2{font-size:clamp(2rem,4.4vw,3.6rem);font-weight:400;letter-spacing:-.025em;line-height:1.1}
h2 em,.hero__title .ln--soft,.dif__quote em{font-style:normal;color:var(--accent)}
h2 em{font-weight:700}
h3{font-size:1.25rem}
.lead{font-size:clamp(1.05rem,1.2vw + .6rem,1.3rem);line-height:1.55;color:var(--ink-soft);font-weight:300;max-width:34em}
[data-theme="dark"] .lead{color:var(--on-dark-soft)}
.label{font-size:.78rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:1.4rem;display:flex;align-items:center;gap:.9rem}
.label::before{content:"";width:28px;height:1px;background:currentColor}
.label--dark{color:var(--mid)}

/* Textura: degradê + grão fino (fundo institucional do manual) */
.grain{position:absolute;inset:0;pointer-events:none;opacity:.09;mix-blend-mode:overlay;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
[data-theme="dark"].section,.hero{background:radial-gradient(120% 90% at 85% 0%,#1d2a52 0%,var(--navy) 55%) , var(--navy)}
.dif,.met,.cta{overflow:hidden}
.wrap{position:relative;z-index:1}

/* Botões */
.btn{--fill:#fff;position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;font-weight:700;font-size:.95rem;letter-spacing:.01em;line-height:1.2;padding:1.05rem 1.7rem;border:1px solid transparent;border-radius:2px;cursor:pointer;
	transition:color .35s var(--ease),border-color .35s var(--ease),box-shadow .45s var(--ease),transform .35s var(--ease)}
/* preenchimento que desliza da esquerda no hover */
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--fill);transform:scaleX(0);transform-origin:left center;transition:transform .5s var(--ease)}
.btn:hover::before,.btn:focus-visible::before{transform:scaleX(1)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0);transition-duration:.1s}
.btn svg{width:1.15em;height:1.15em;flex:none;transition:transform .35s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
/* Principal sobre fundo escuro: azul claro, texto branco -> preenche de branco, texto marinho */
.btn--solid{background:var(--accent);color:#fff;box-shadow:0 12px 28px -14px rgba(104,131,206,.9)}
.btn--solid:hover,.btn--solid:focus-visible{color:var(--navy);box-shadow:0 18px 36px -14px rgba(104,131,206,.75)}
/* Secundário (vazado): borda visível e vidro leve; no hover enche de azul médio */
.btn--ghost{--fill:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);color:#fff;background:rgba(255,255,255,.05);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.btn--ghost:hover,.btn--ghost:focus-visible{border-color:#fff;color:#fff}
.btn--sm{padding:.7rem 1.15rem;font-size:.85rem}
.btn--block{width:100%;justify-content:center}
/* Principal sobre fundo claro: marinho -> preenche de azul médio */
[data-theme="light"] .btn--solid{--fill:var(--mid);background:var(--navy);color:#fff;box-shadow:0 12px 26px -16px rgba(19,26,46,.8)}
[data-theme="light"] .btn--solid:hover,[data-theme="light"] .btn--solid:focus-visible{color:#fff;box-shadow:0 18px 34px -16px rgba(19,26,46,.7)}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--hdr);background:transparent;color:#fff;transition:background .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease),transform .5s var(--ease)}
.hdr::before{content:"";position:absolute;inset:0;background:rgba(19,26,46,.0);backdrop-filter:blur(0);transition:all .4s var(--ease);z-index:-1}
.hdr.is-solid::before{background:rgba(19,26,46,.72);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%)}
.hdr[data-theme="light"]{color:var(--navy)}
.hdr[data-theme="light"].is-solid::before{background:rgba(255,255,255,.78);box-shadow:0 1px 0 var(--line-dark)}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;height:100%}
.hdr__logo{position:relative;display:block;width:clamp(150px,15vw,200px);aspect-ratio:3.7/1}
.hdr__logo .logo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:left center;transition:opacity .35s}
.logo--escuro{opacity:0}
.hdr[data-theme="light"] .logo--escuro{opacity:1}
.hdr[data-theme="light"] .logo--branco{opacity:0}
.hdr__nav{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2.2rem);font-size:.92rem;font-weight:400}
.hdr__nav a:not(.btn){position:relative;padding:.4rem 0;opacity:.82;transition:opacity .25s,color .25s}
.hdr__nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.hdr__nav a:not(.btn):hover,.hdr__nav a:not(.btn):focus-visible{opacity:1;color:var(--accent)}
.hdr__nav a.is-active{opacity:1}
.hdr__nav a:not(.btn):hover::after,.hdr__nav a.is-active::after{transform:scaleX(1)}

.hdr__burger{display:none;width:44px;height:44px;position:relative;padding:0;border:0!important;border-radius:0;background:none!important;color:inherit!important;box-shadow:none!important;-webkit-tap-highlight-color:transparent;-webkit-appearance:none;appearance:none}
.hdr__burger:hover,.hdr__burger:focus,.hdr__burger:active{background:none!important;color:inherit!important;border:0!important;box-shadow:none!important;outline:0}
.hdr__burger:focus-visible{outline:2px solid var(--accent)!important;outline-offset:2px}
.hdr__burger span{background:currentColor!important}
.hdr__burger span{position:absolute;left:10px;right:10px;height:1.5px;background:currentColor;transition:transform .35s var(--ease),top .35s var(--ease)}
.hdr__burger span:first-child{top:18px}.hdr__burger span:last-child{top:26px}
.hdr__burger[aria-expanded="true"] span:first-child{top:22px;transform:rotate(45deg)}
.hdr__burger[aria-expanded="true"] span:last-child{top:22px;transform:rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hdr) + clamp(16px,4.2vh,52px)) 0 0;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__glow{position:absolute;width:70vw;height:70vw;max-width:1000px;max-height:1000px;right:-18vw;top:-22vw;border-radius:50%;background:radial-gradient(closest-side,rgba(104,131,206,.28),transparent 70%);filter:blur(10px)}
.hero__spot{position:absolute;width:520px;height:520px;left:0;top:0;margin:-260px 0 0 -260px;border-radius:50%;background:radial-gradient(closest-side,rgba(104,131,206,.20),transparent 70%);opacity:0;transition:opacity .6s;will-change:transform}
.hero__lines{position:absolute;right:0;top:0;width:min(46vw,640px);height:auto;opacity:.55}
.hl{stroke:var(--accent);stroke-width:1;vector-effect:non-scaling-stroke;opacity:.7}
.hero__in{position:relative;z-index:2;padding-top:0;padding-bottom:clamp(28px,6vh,76px)}

/* Moldura aberta (elemento central da marca) */
.frame{position:relative;padding:clamp(22px,min(3.6vw,4.6vh),52px) clamp(26px,4.4vw,72px);max-width:960px}
.frame>i{position:absolute;background:var(--accent);display:block}
.frame__l{left:0;top:0;width:3px;height:100%;transform-origin:top}
.frame__t{left:0;top:0;height:3px;width:100%;transform-origin:left}
.frame__r{right:0;top:0;width:3px;height:clamp(54px,9vw,110px);transform-origin:top}
.frame__b{left:0;bottom:0;height:3px;width:52%;transform-origin:left}
.hero__label{margin-bottom:clamp(1.2rem,3vh,2rem)}
.hero__title{font-size:clamp(2.05rem,min(6.2vw,9.2vh),5.4rem);font-weight:700;letter-spacing:-.035em;line-height:1.02}
.hero__title .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero__title .ln__in{display:inline-block;will-change:transform}
.hero__title .ln--soft{font-weight:300}
.hero__sub{margin-top:clamp(1rem,2.2vh,2rem);max-width:36em;font-size:clamp(1.02rem,1.1vw + .55rem,1.28rem);font-weight:300;line-height:1.55;color:var(--on-dark-soft)}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:clamp(1.1rem,2.6vh,2.4rem)}


/* Números grandes no fim do topo */
.hero__stats{position:relative;z-index:2;margin-top:auto;padding-bottom:clamp(10px,2.4vh,28px)}
.hero .stats{margin-top:0;grid-template-columns:repeat(4,1fr)}
.hero .stat{padding-top:.9rem;gap:.4rem}
.hero .stat b{font-size:clamp(1.7rem,min(3.2vw,4.6vh),2.8rem)}
.hero .stat>span{font-size:.82rem}
@media (max-width:900px){.hero .stats{grid-template-columns:repeat(2,1fr)}.hero .stat:nth-child(3){padding-left:0;border-left:0}.hero .stat:nth-child(n+3){margin-top:0}}
@media (max-width:600px){
	.hero .stats{grid-template-columns:repeat(2,1fr);gap:0}
	.hero .stat,.hero .stat+.stat{padding:.8rem .8rem .8rem 0;border-bottom:0}
	.hero .stat:nth-child(even){padding-left:.9rem;border-left:1px solid var(--line-light)}
	.hero .stat:nth-child(odd){border-left:0;padding-left:0}
	.hero .stat b{font-size:1.7rem}
	.hero .stat>span{font-size:.7rem;line-height:1.3}
	.hero .stat small{display:none}
}

/* ---------- Tradução ---------- */
.trad{background:var(--mist)}
.trad__in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,7vw,120px);align-items:center}
.trad__head h2{margin-bottom:1.6rem}
.trad__list{display:grid;gap:0;border-top:1px solid var(--line-dark)}
.trad__row{display:grid;grid-template-columns:minmax(0,.8fr) 28px minmax(0,1.2fr);gap:1rem;align-items:center;padding:clamp(1rem,2.2vh,1.5rem) 0;border-bottom:1px solid var(--line-dark)}
.trad__jargon{position:relative;font-weight:700;font-size:clamp(1.05rem,1.5vw,1.35rem);letter-spacing:-.01em;justify-self:start;transition:color .5s,opacity .5s}
.trad__jargon::after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.trad__arrow{width:22px;color:var(--accent);opacity:.35;transition:opacity .5s,transform .5s var(--ease)}
.trad__plain{font-size:clamp(1rem,1.3vw,1.2rem);font-weight:300;color:var(--ink-soft);transition:color .5s,opacity .5s,transform .6s var(--ease)}
.trad__row.is-done .trad__jargon{opacity:.38}
.trad__row.is-done .trad__jargon::after{transform:scaleX(1)}
.trad__row.is-done .trad__arrow{opacity:1;transform:translateX(3px)}
.trad__row.is-done .trad__plain{color:var(--navy);font-weight:700}
.js .trad__plain{opacity:.28;transform:translateX(-8px)}
.js .trad__row.is-done .trad__plain{opacity:1;transform:none}

/* ---------- Quem somos ---------- */
.sobre__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(40px,7vw,110px);align-items:start}
.sobre__text h2{margin-bottom:2rem;font-size:clamp(1.9rem,3.6vw,3rem)}
.sobre__text p{color:var(--ink-soft);margin-bottom:1.1rem;max-width:40em}
.sobre__text p strong{color:var(--navy);font-weight:700}
.sobre__role{font-size:.78rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:.35rem 0 1rem}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:var(--block-gap);border-top:1px solid var(--line-dark)}
.stat{padding:2rem 1.5rem 0 0;display:grid;gap:.7rem;align-content:start}
.stat+.stat{padding-left:1.5rem;border-left:1px solid var(--line-dark)}
.stat b{font-size:clamp(2.2rem,4.2vw,3.6rem);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--navy);font-variant-numeric:tabular-nums}
.stat .stat__plus{font-size:.45em;color:var(--accent);letter-spacing:.02em;font-weight:700}
.stat>span{font-size:.92rem;color:var(--ink-soft);line-height:1.45}
.stat small{opacity:.8}

/* ---------- Diferenciais ---------- */
.dif__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,20px)}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
.card{--mx:50%;--my:50%;position:relative;isolation:isolate;border-radius:22px;padding:clamp(24px,2.6vw,38px);min-height:340px;display:flex;flex-direction:column;gap:1rem;
	background:linear-gradient(160deg,#1a2342 0%,#101730 100%);border:1px solid rgba(255,255,255,.07);
	box-shadow:0 18px 40px -22px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06)}
/* Luz na borda: parada em repouso, percorre o contorno só com o mouse em cima */
.card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:2px;z-index:2;pointer-events:none;
	background:conic-gradient(from var(--a),transparent 0deg,transparent 215deg,rgba(104,131,206,.25) 260deg,var(--accent) 322deg,#fff 350deg,transparent 360deg);
	-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
	animation:orbit 4s linear infinite paused}
@keyframes orbit{to{--a:360deg}}
/* escalonamento da luz entre os cards */
.card:nth-child(2)::before{animation-delay:-1s}.card:nth-child(3)::before{animation-delay:-2s}.card:nth-child(4)::before{animation-delay:-3s}
.card:hover::before,.card:focus-within::before{animation-play-state:running}
/* Holofote que segue o cursor */
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;opacity:0;transition:opacity .45s var(--ease);
	background:radial-gradient(420px circle at var(--mx) var(--my),rgba(104,131,206,.22),transparent 60%)}
.js .dif .card.is-in{transition:opacity .9s var(--ease),transform .9s var(--ease),translate .5s var(--ease),scale .5s var(--ease),box-shadow .5s var(--ease),border-color .5s}
.card:hover{translate:0 -8px;scale:1.025;border-color:rgba(104,131,206,.45);z-index:3;
	box-shadow:0 30px 60px -20px rgba(0,0,0,.9),0 0 0 1px rgba(104,131,206,.25),0 0 50px -10px rgba(104,131,206,.35),inset 0 1px 0 rgba(255,255,255,.1)}
.card:hover::after{opacity:1}
.dif__grid:has(.card:hover) .card:not(:hover){opacity:.62}
.card__n{font-size:.78rem;font-weight:700;letter-spacing:.2em;color:var(--accent)}
.card__ic{width:44px;height:44px;color:var(--accent);margin:.6rem 0 auto;transition:transform .5s var(--ease),filter .5s}
.card__ic svg{width:100%;height:100%}
.card:hover .card__ic{transform:translateY(-4px) scale(1.08);filter:drop-shadow(0 0 12px rgba(104,131,206,.7))}
.card h3{font-size:1.3rem;letter-spacing:-.01em}
.card p{font-size:.95rem;color:var(--on-dark-soft);line-height:1.55;font-weight:300}
.dif__quote{margin-top:var(--block-gap);font-size:clamp(1.4rem,2.8vw,2.3rem);font-weight:300;line-height:1.25;max-width:30em;letter-spacing:-.015em}

/* ---------- Soluções ---------- */
.sec-head--split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,6vw,100px);align-items:end}
.sol__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,20px)}
.tile{background:var(--mist);padding:clamp(22px,2.2vw,32px);min-height:250px;display:flex;flex-direction:column;gap:.7rem;position:relative;overflow:hidden;transition:background .45s var(--ease),color .45s var(--ease),transform .45s var(--ease)}
.tile::after{content:"";position:absolute;right:-1px;top:-1px;width:0;height:0;border-top:2px solid var(--accent);border-right:2px solid var(--accent);transition:width .5s var(--ease),height .5s var(--ease)}
.tile:hover{background:var(--navy);color:#fff;transform:translateY(-4px)}
.tile:hover::after{width:44px;height:44px}
.tile__ic{width:38px;height:38px;color:var(--mid);margin-bottom:auto;transition:color .45s}
.tile__ic svg{width:100%;height:100%}
.tile:hover .tile__ic{color:var(--accent)}
.tile h3{font-size:1.15rem}
.tile p{font-size:.92rem;color:var(--ink-soft);line-height:1.5;transition:color .45s}
.tile:hover p{color:var(--on-dark-soft)}
.tile--cta{background:var(--navy);color:#fff;justify-content:flex-end;align-items:flex-start}
.tile--cta p{color:var(--on-dark-soft);margin-bottom:.8rem}
.tile--cta:hover{background:var(--mid)}


/* ---------- Soluções: leque de cards ---------- */
.sol{overflow-x:clip}
.sol__fan{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.fcard{--mx:50%;--my:50%;position:relative;isolation:isolate;border-radius:20px;padding:0;min-height:230px;display:flex;flex-direction:column;color:#fff;
	background:linear-gradient(160deg,#2C3D6D 0%,#131A2E 70%);border:1px solid rgba(255,255,255,.08);
	box-shadow:0 24px 50px -22px rgba(19,26,46,.7),inset 0 1px 0 rgba(255,255,255,.1);outline-offset:4px}
.fcard::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:2px;z-index:2;pointer-events:none;
	background:conic-gradient(from var(--a),transparent 0deg,transparent 215deg,rgba(104,131,206,.25) 260deg,var(--accent) 322deg,#fff 350deg,transparent 360deg);
	-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
	animation:orbit 4s linear infinite paused;opacity:0;transition:opacity .4s}
.fcard::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;opacity:0;transition:opacity .45s;background:radial-gradient(360px circle at var(--mx) var(--my),rgba(104,131,206,.28),transparent 60%)}
.fcard.is-hover::before,.fcard:focus-visible::before{opacity:1;animation-play-state:running}
.fcard.is-hover::after{opacity:1}
.fcard__img{position:relative;height:9.2rem;border-radius:19px 19px 0 0;overflow:hidden;flex:none}
.fcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.fcard.is-hover .fcard__img img{transform:scale(1.07)}
.fcard__img::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(to top,#18213f,transparent)}
.fcard__n{position:absolute;left:1.1rem;top:.9rem;z-index:2;font-size:.75rem;font-weight:700;letter-spacing:.2em;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.fcard__ic{position:absolute;left:1.1rem;top:7.6rem;z-index:3;width:2.7rem;height:2.7rem;padding:.6rem;border-radius:13px;color:var(--accent);background:#131A2E;border:1px solid rgba(104,131,206,.4);box-shadow:0 10px 20px -8px rgba(0,0,0,.7);transition:filter .4s}
.fcard__ic svg{width:100%;height:100%}
.fcard__body{padding:2.1rem 1.4rem 1.4rem;display:flex;flex-direction:column;gap:.55rem}
.fcard.is-hover .fcard__ic{filter:drop-shadow(0 0 12px rgba(104,131,206,.8))}
.fcard h3{font-size:1.12rem;letter-spacing:-.01em;line-height:1.15}
.fcard p{font-size:.85rem;line-height:1.45;color:rgba(255,255,255,.7);font-weight:300}
.sol__more{display:flex;align-items:center;justify-content:center;gap:1.4rem;flex-wrap:wrap;margin-top:var(--block-gap);text-align:center;color:var(--ink-soft)}
.sol__more strong{color:var(--navy)}

@media (min-width:901px){
	.sol__fan{display:block;position:relative;height:36rem;margin-top:1rem}
	.fcard{position:absolute;left:50%;top:1.5rem;width:15.5rem;height:23rem;margin-left:-7.75rem;min-height:0;cursor:pointer;will-change:transform;
		box-shadow:0 30px 60px -24px rgba(19,26,46,.85),inset 0 1px 0 rgba(255,255,255,.1)}
	.js .fcard{opacity:0}
	/* Cards cobertos pelo vizinho: conteúdo fica na parte que aparece */
	.fcard[data-side="left"] .fcard__body{padding-right:var(--pad,6.5rem)}
	.fcard[data-side="right"] .fcard__body{padding-left:var(--pad,6.5rem)}
	.fcard h3{font-size:1.2rem}
	.fcard p{opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s}
	.fcard[data-side="center"] p,.fcard.is-hover p,.fcard:focus-visible p{opacity:1;transform:none}
	.fcard.is-hover[data-side] .fcard__body{padding-left:1.4rem;padding-right:1.4rem}
	.fcard.is-hover{box-shadow:0 40px 80px -20px rgba(19,26,46,.95),0 0 60px -10px rgba(104,131,206,.5),inset 0 1px 0 rgba(255,255,255,.14)}
}
@media (prefers-reduced-motion:reduce){.fcard::before{animation:none}}

/* ---------- Soluções no celular: carrossel que transborda à direita ---------- */
@media (max-width:900px){
	.sol__fan{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-left:var(--gutter);-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;
		margin:0 calc(-1 * var(--gutter));padding:6px var(--gutter) 18px;cursor:grab;touch-action:pan-x pan-y}
	.sol__fan::-webkit-scrollbar{display:none}
	.sol__fan.is-drag{cursor:grabbing;scroll-snap-type:none}
	.sol__fan .fcard{flex:0 0 calc((100vw - var(--gutter) - 14px) / 1.8);scroll-snap-align:start;min-height:0;user-select:none;-webkit-user-select:none}
	.sol__fan .fcard:last-child{margin-right:var(--gutter)}
	.sol__fan .fcard__img img{pointer-events:none}
	.sol__dots{display:flex;justify-content:center;gap:8px;margin-top:6px}
	.sol__dots i{display:block;width:7px;height:7px;border-radius:99px;background:rgba(19,26,46,.18);transition:width .35s var(--ease),background .35s}
	.sol__dots i.is-on{width:24px;background:var(--navy)}
}
@media (min-width:901px){.sol__dots{display:none}}

/* ---------- Método ---------- */
.steps{position:relative;display:grid;gap:clamp(36px,5vw,64px);padding-left:clamp(0px,1vw,10px)}
.step{display:grid;grid-template-columns:clamp(74px,12vw,170px) minmax(0,1fr);gap:clamp(16px,3vw,48px);align-items:start;padding-left:clamp(28px,4vw,60px);position:relative}
.step::before{content:"";position:absolute;left:0;top:.9rem;width:11px;height:11px;border-radius:50%;background:var(--navy);border:1.5px solid var(--accent);transform:translateX(-5px);transition:background .5s}
.step.is-on::before{background:var(--accent)}
.step__n{font-size:clamp(3.2rem,8vw,7rem);font-weight:300;letter-spacing:-.05em;line-height:.9;color:transparent;-webkit-text-stroke:1px rgba(104,131,206,.7);transition:color .6s var(--ease)}
.step.is-on .step__n{color:var(--accent);-webkit-text-stroke-color:var(--accent)}
.step h3{font-size:clamp(1.4rem,2.4vw,2rem);margin-bottom:.8rem;letter-spacing:-.015em}
.step p{max-width:38em;color:var(--on-dark-soft);font-weight:300}
.steps__line{position:absolute;left:0;top:1rem;bottom:2rem;width:1px;background:var(--line-light)}
.steps__line i{position:absolute;inset:0;background:var(--accent);transform:scaleY(0);transform-origin:top}

/* ---------- Propósito ---------- */

/* ---------- Os 5 pilares ---------- */
.pil{background:#fff}
.pil__track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;cursor:grab;
	--edge:max(var(--gutter),calc((100% - var(--max)) / 2));padding:14px var(--gutter) 40px var(--edge);scroll-padding-left:var(--edge)}
.pil__track::-webkit-scrollbar{display:none}
.pil__track.is-drag{cursor:grabbing;scroll-snap-type:none}
.pil__grid{display:flex;gap:clamp(14px,1.4vw,20px);width:max-content}
.pil__card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.9rem;flex:0 0 min(78vw,clamp(280px,26vw,360px));scroll-snap-align:start;min-height:390px;user-select:none;-webkit-user-select:none;padding:clamp(22px,2vw,30px);border-radius:20px;background:var(--mist);color:var(--navy);
	transition:translate .5s var(--ease),background .5s var(--ease),color .5s var(--ease),box-shadow .5s var(--ease)}
.js .pil .pil__card.is-in{transition:opacity .9s var(--ease),transform .9s var(--ease),translate .5s var(--ease),background .5s var(--ease),color .5s var(--ease),box-shadow .5s var(--ease)}
.pil__card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.pil__n{font-size:clamp(2.6rem,3.6vw,3.4rem);font-weight:300;letter-spacing:-.05em;line-height:.9;color:transparent;-webkit-text-stroke:1px rgba(44,61,109,.55);font-variant-numeric:tabular-nums;transition:-webkit-text-stroke-color .5s}
.pil__ic{width:40px;height:40px;margin:1.8rem 0 .3rem;color:var(--mid);transition:color .5s var(--ease),transform .5s var(--ease)}
.pil__ic svg{width:100%;height:100%}
.pil__card h3{font-size:1.3rem;letter-spacing:-.015em}
.pil__card p{font-size:.92rem;line-height:1.55;color:var(--ink-soft);transition:color .5s var(--ease)}
.pil__card:hover,.pil__card:focus-within{translate:0 -8px;background:var(--navy);color:#fff;box-shadow:0 30px 60px -28px rgba(19,26,46,.75)}
.pil__card:hover::before,.pil__card:focus-within::before{transform:scaleX(1)}
.pil__card:hover .pil__n{-webkit-text-stroke-color:var(--accent)}
.pil__card:hover .pil__ic{color:var(--accent);transform:translateY(-4px)}
.pil__card:hover p{color:var(--on-dark-soft)}
.pil__grid:has(.pil__card:hover) .pil__card:not(:hover){opacity:.7}
/* passadores */
.pil__nav{display:flex;align-items:center;gap:.8rem}
.pil__btn{width:48px;height:48px;padding:0;display:grid;place-items:center;border-radius:50%;cursor:pointer;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
	border:1.5px solid var(--navy)!important;background:transparent!important;color:var(--navy)!important;box-shadow:none!important;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),opacity .35s,transform .35s var(--ease)}
.pil__btn svg{width:20px;height:20px;transition:transform .35s var(--ease)}
.pil__btn[data-pil-prev] svg{transform:rotate(180deg)}
.pil__btn:hover,.pil__btn:focus-visible{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important;outline:0}
.pil__btn:focus-visible{box-shadow:0 0 0 3px rgba(104,131,206,.5)!important}
.pil__btn:hover[data-pil-next] svg{transform:translateX(3px)}
.pil__btn:hover[data-pil-prev] svg{transform:rotate(180deg) translateX(3px)}
.pil__btn:active{transform:scale(.94)}
.pil__btn[disabled]{opacity:.28;pointer-events:none}
.pil__dots{display:flex;align-items:center;gap:8px;margin-left:1rem}
.pil__dots i{display:block;width:7px;height:7px;border-radius:99px;background:rgba(19,26,46,.18);transition:width .35s var(--ease),background .35s}
.pil__dots i.is-on{width:26px;background:var(--navy)}
@media (max-width:760px){.pil__card{min-height:0}}

/* ---------- Parceiros: carrossel de logos ---------- */
.parc{background:var(--mist);padding:calc(var(--sec-y) * .65) 0;overflow:hidden}
.parc__head{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;margin-bottom:clamp(24px,3.4vw,44px)}
.parc__head .label{margin:0}
.parc__lead{font-size:clamp(1rem,1.3vw,1.2rem);font-weight:300;color:var(--ink-soft)}
.parc__marquee{display:flex;width:max-content;animation:parcScroll 42s linear infinite}
.parc{--fade:clamp(40px,8vw,140px)}
.parc__marquee-wrap{position:relative}
.parc__group{display:flex;align-items:center;flex:none}
.parc__item{flex:none;display:grid;place-items:center;padding:0 clamp(36px,5vw,84px)}
.parc__item img{display:block;width:auto;opacity:.58;transition:opacity .4s var(--ease),transform .4s var(--ease);user-select:none;-webkit-user-drag:none}
.parc__item:hover img{opacity:1;transform:scale(1.06)}
.parc__item--btg img{height:clamp(34px,3.6vw,48px)}
.parc__item--safra img{height:clamp(30px,3.2vw,42px)}
.parc__item--agora img{height:clamp(22px,2.4vw,30px)}
.parc__item--avenue img{height:clamp(22px,2.4vw,30px)}
.parc__marquee:hover{animation-play-state:paused}
@keyframes parcScroll{to{transform:translateX(-50%)}}
.parc{position:relative}
.parc::before,.parc::after{content:"";position:absolute;top:0;bottom:0;width:var(--fade);z-index:2;pointer-events:none}
.parc::before{left:0;background:linear-gradient(90deg,var(--mist),transparent)}
.parc::after{right:0;background:linear-gradient(270deg,var(--mist),transparent)}
@media (prefers-reduced-motion:reduce){
	.parc__marquee{animation:none;width:auto;flex-wrap:wrap;justify-content:center}
	.parc__group[aria-hidden="true"]{display:none}
}

/* ---------- Contato ---------- */
.cta__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(40px,7vw,120px);align-items:center}
.cta h2{margin-bottom:1.5rem}
.cta__ways{display:grid;gap:.4rem;margin-top:2.2rem}
.cta__ways a{display:inline-flex;align-items:center;gap:.85rem;padding:.7rem 0;border-bottom:1px solid var(--line-light);width:100%;max-width:26em;transition:color .3s,padding .4s var(--ease)}
.cta__ways a:hover{color:var(--accent);padding-left:.5rem}
.cta__ways svg{width:26px;height:26px;color:var(--accent);flex:none}
.form{background:#fff;color:var(--navy);padding:clamp(24px,3vw,44px);display:grid;gap:1.1rem;position:relative}
.form::before{content:"";position:absolute;left:-1px;top:-1px;width:64px;height:64px;border-top:3px solid var(--accent);border-left:3px solid var(--accent);pointer-events:none}
.field{display:grid;gap:.4rem}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field label{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mid)}
.field label small{text-transform:none;letter-spacing:0;font-weight:400;opacity:.7}
.field input,.field select,.field textarea{font:inherit;font-size:1rem;color:var(--navy);width:100%;padding:.85rem .9rem;background:var(--mist);border:1px solid transparent;border-bottom-color:var(--line-dark);border-radius:2px;transition:border-color .3s,background .3s;appearance:none;-webkit-appearance:none}
.field select{background-image:linear-gradient(45deg,transparent 50%,var(--mid) 50%),linear-gradient(135deg,var(--mid) 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat;padding-right:2.4rem}
.field textarea{resize:vertical;min-height:90px}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--accent);background:#fff}
.field.is-error input{border-color:#b3261e}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:.82rem;line-height:1.45;color:var(--ink-soft);cursor:pointer}
.check input{margin-top:.2rem;accent-color:var(--navy);width:16px;height:16px;flex:none}
.form__hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.form__status{min-height:1.4em;font-size:.92rem;font-weight:700}
.form__status.is-ok{color:#1d6b43}.form__status.is-err{color:#b3261e}
.form.is-sent>:not(.form__status){display:none}
.form.is-sent .form__status{font-size:1.2rem;font-weight:400;line-height:1.4}
.form.is-loading button{opacity:.6;pointer-events:none}

/* ---------- Rodapé ---------- */
.ftr{padding:clamp(56px,8vw,96px) 0 2rem;background:#0d1322;color:#fff}
.ftr__top{display:grid;grid-template-columns:auto 1fr 1fr;gap:clamp(30px,6vw,100px);align-items:start;padding-bottom:clamp(36px,5vw,64px);border-bottom:1px solid var(--line-light)}
.ftr__logo{width:clamp(110px,12vw,150px);height:auto}
.ftr__nav,.ftr__contact{display:grid;gap:.65rem;justify-items:start;font-size:.95rem}
.ftr__nav a,.ftr__contact a{opacity:.8;transition:opacity .25s,color .25s}
.ftr__nav a:hover,.ftr__contact a:hover{opacity:1;color:var(--accent)}
.ftr__contact .label{margin-bottom:.4rem}
.ftr__docs{padding:2rem 0;border-bottom:1px solid var(--line-light)}
.ftr__docs .label{margin-bottom:1.1rem}
.ftr__docs ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem 3rem}
.ftr__docs li{position:relative;padding-left:1.1rem;font-size:.88rem;line-height:1.4}
.ftr__docs li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;background:var(--accent)}
.ftr__docs a,.ftr__docs span{color:rgba(255,255,255,.82)}
.ftr__docs span{color:rgba(255,255,255,.6)}
.ftr__docs a{border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.ftr__docs a:hover{color:#fff;border-bottom-color:var(--accent)}
.ftr__legal{padding-top:1.8rem;display:grid;gap:.9rem;font-size:.78rem;line-height:1.65;color:rgba(255,255,255,.55);max-width:none;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.ftr__legal p:first-child,.ftr__copy{text-align:left}
@media (max-width:700px){.ftr__docs ul{grid-template-columns:1fr}.ftr__legal{text-align:left}}
.ftr__legal strong{color:rgba(255,255,255,.85)}
.ftr__copy{margin-top:.6rem}

.is-counting{color:var(--accent)!important;-webkit-text-stroke-color:var(--accent)!important}
.stat b,.step__n,.card__n,.fcard__n{font-variant-numeric:tabular-nums}
.stat b span,.step__n span{transition:color .6s var(--ease)}


/* ---------- Fotos: fundos, molduras e parallax ---------- */
[data-parallax-img]{position:absolute;inset:0;overflow:hidden}
[data-parallax-img] img{position:absolute;left:0;top:-9%;width:100%;height:118%;object-fit:cover;will-change:transform}
.hero__photo{z-index:0}
.hero__photo img{object-position:62% 50%}
.hero__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,26,46,.95) 0%,rgba(19,26,46,.8) 36%,rgba(19,26,46,.4) 72%,rgba(19,26,46,.6) 100%),linear-gradient(to top,var(--navy) 0%,transparent 28%)}
.hero__glow,.hero__lines,.hero__spot{z-index:1}
.photo{position:relative;margin:0;overflow:hidden;background:#0d1322;box-shadow:0 40px 80px -40px rgba(19,26,46,.55)}
.photo--tall{aspect-ratio:4/5}
.photo--wide{aspect-ratio:16/11}
.photo::after{content:"";position:absolute;left:14px;top:14px;width:64px;height:64px;border-top:2px solid var(--accent);border-left:2px solid var(--accent);z-index:2;pointer-events:none}
.sobre__grid{align-items:center}
.andre__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(36px,6vw,96px);align-items:center}
.andre__text h2{font-size:clamp(2.2rem,4.6vw,4rem);margin-bottom:.6rem}
.andre__text p{color:var(--on-dark-soft);margin-bottom:1rem;max-width:34em;font-weight:300}
.andre .sobre__role{margin:.2rem 0 1.4rem}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.chips span{padding:.45rem .95rem;border:1px solid var(--line-light);border-radius:99px;font-size:.8rem;letter-spacing:.04em;color:#fff;background:rgba(255,255,255,.04)}
.andre .stats,.hero .stats{border-top-color:var(--line-light)}
.andre .stat+.stat,.hero .stat+.stat{border-left-color:var(--line-light)}
.andre .stat b,.hero .stat b{color:#fff}
.andre .stat>span,.hero .stat>span{color:var(--on-dark-soft)}
.band{min-height:78vh;display:flex;align-items:flex-end;padding:clamp(60px,9vw,120px) 0;overflow:hidden;isolation:isolate}
.band__photo{z-index:-1}
.band__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,26,46,.92) 0%,rgba(19,26,46,.55) 45%,rgba(19,26,46,.15) 100%),linear-gradient(to top,rgba(19,26,46,.85),transparent 55%)}
.band__quote{font-size:clamp(2.1rem,5.4vw,4.8rem);font-weight:300;letter-spacing:-.03em;line-height:1.06;max-width:12em}
.band__quote em{font-style:normal;font-weight:700;color:var(--accent)}
.cta__photo{z-index:0}
.cta__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,26,46,.94) 0%,rgba(19,26,46,.84) 50%,rgba(19,26,46,.72) 100%)}
.cta .grain{z-index:0}
@media (max-width:900px){
	.andre__grid{grid-template-columns:1fr}
	.photo--tall{aspect-ratio:4/3}
	.band{min-height:62vh}
}

/* ---------- Botão flutuante de WhatsApp ---------- */
.wa{position:fixed;right:clamp(14px,2.2vw,32px);bottom:clamp(14px,2.2vw,32px);z-index:55;display:flex;align-items:center;gap:.7rem;-webkit-tap-highlight-color:transparent;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.wa__btn{position:relative;display:grid;place-items:center;width:clamp(52px,4.4vw,64px);height:clamp(52px,4.4vw,64px);border-radius:50%;background:var(--accent);color:#fff;
	box-shadow:0 14px 30px -10px rgba(19,26,46,.65),0 0 0 1px rgba(255,255,255,.18) inset;transition:background .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease)}
.wa__btn svg{width:56%;height:56%}
.wa__btn::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);animation:waPulse 2.8s var(--ease) infinite;pointer-events:none}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(1.55);opacity:0}}
.wa__tip{padding:.55rem .95rem;border-radius:99px;background:var(--navy);color:#fff;font-size:.82rem;font-weight:700;letter-spacing:.01em;white-space:nowrap;box-shadow:0 10px 24px -10px rgba(19,26,46,.7);
	opacity:0;transform:translateX(10px);pointer-events:none;transition:opacity .35s var(--ease),transform .35s var(--ease)}
.wa:hover .wa__tip,.wa:focus-visible .wa__tip{opacity:1;transform:none}
.wa:hover .wa__btn,.wa:focus-visible .wa__btn{background:var(--navy);transform:translateY(-3px) scale(1.05);box-shadow:0 18px 34px -10px rgba(19,26,46,.75),0 0 0 2px var(--accent)}
.wa:active .wa__btn{transform:scale(.97)}
.js .wa{opacity:0;transform:translateY(16px) scale(.9);pointer-events:none}
.js .wa.is-on{opacity:1;transform:none;pointer-events:auto}
.menu-open .wa{opacity:0!important;pointer-events:none!important}
@media (max-width:600px){.wa__tip{display:none}}
@media (prefers-reduced-motion:reduce){.wa__btn::before{animation:none}}

/* ---------- Revelação ---------- */
.js [data-reveal]{opacity:0;transform:translateY(34px)}
.js [data-reveal].is-in{opacity:1;transform:none;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js [data-hero]{opacity:0}
.js [data-hero="line"]{opacity:1;transform:translateY(110%)}
.js .frame>i{transform:scale(0)}


/* ---------- Sequência cinematográfica ---------- */
.cine{height:100vh;background:#fff;overflow:hidden;perspective:1500px}
.cine__stage{position:relative;width:100%;height:100vh;display:grid;place-items:center;overflow:hidden}
.cine__grid{position:absolute;inset:0;background-size:60px 60px;background-image:linear-gradient(to right,rgba(19,26,46,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(19,26,46,.06) 1px,transparent 1px);-webkit-mask-image:radial-gradient(ellipse at center,#000 0%,transparent 70%);mask-image:radial-gradient(ellipse at center,#000 0%,transparent 70%);opacity:.7}
.cine .grain{opacity:.05;mix-blend-mode:multiply}
.cine__text{position:absolute;z-index:10;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;padding:0 var(--gutter);display:flex;flex-direction:column;align-items:center}
.cine__label{justify-content:center}
.cine__l1,.cine__l2{font-size:clamp(2.2rem,6.4vw,5.6rem);letter-spacing:-.035em;line-height:1.04}
.cine__l1{font-weight:300;color:var(--navy);text-shadow:0 10px 30px rgba(19,26,46,.14)}
.cine__l1 b{font-weight:700}
.cine__l2{font-weight:700;background:linear-gradient(180deg,var(--navy) 0%,var(--mid) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-bottom:.08em}
.cine__l2 em{font-style:normal;-webkit-text-fill-color:var(--accent);color:var(--accent)}
.js .cine__text{visibility:hidden}
.cine__cardwrap{position:absolute;inset:0;z-index:20;display:grid;place-items:center;pointer-events:none}
.cine__card{position:relative;overflow:hidden;pointer-events:auto;width:92vw;height:88vh;border-radius:32px;display:grid;place-items:center;
	background:linear-gradient(145deg,#2C3D6D 0%,#131A2E 62%);
	box-shadow:0 40px 100px -20px rgba(19,26,46,.9),0 20px 40px -20px rgba(19,26,46,.8),inset 0 1px 2px rgba(255,255,255,.2),inset 0 -2px 4px rgba(0,0,0,.6);
	border:1px solid rgba(255,255,255,.05);color:#fff}
.js .cine__card{visibility:hidden}
.cine__sheen{position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;background:radial-gradient(800px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.07) 0%,transparent 40%);mix-blend-mode:screen}
.cine__card .grain{opacity:.08;mix-blend-mode:overlay}
.cine__inner{position:relative;z-index:2;width:100%;height:100%;max-width:1280px;margin:0 auto;padding:1.5rem clamp(16px,3vw,48px);display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:center;gap:2rem}
.cine__left h3{font-size:clamp(1.5rem,2.8vw,2.7rem);font-weight:700;letter-spacing:-.025em;line-height:1.1;margin-bottom:1.1rem;background:linear-gradient(180deg,#fff 0%,#a9b7e0 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cine__card .btn--solid{--fill:#fff;margin-top:1.6rem;background:var(--accent);color:#fff}
.cine__card .btn--solid:hover,.cine__card .btn--solid:focus-visible{color:var(--navy)}
.cine__left p{font-size:clamp(.95rem,1.1vw,1.15rem);font-weight:300;line-height:1.55;color:rgba(255,255,255,.72);max-width:24em}
.cine__right{display:flex;justify-content:flex-end;order:3}
.cine__left{order:1}
.cine__mockwrap{order:2;position:relative;height:min(64vh,620px);display:grid;place-items:center;perspective:1000px}
.cine__mark{width:clamp(110px,16vw,240px);height:auto;opacity:.92;filter:drop-shadow(0 18px 30px rgba(0,0,0,.55))}
.cine__scale{position:relative;width:100%;height:100%;display:grid;place-items:center;transform-style:preserve-3d}
.device{position:relative;width:260px;height:530px;border-radius:2.8rem;background:#0a0f1d;transform-style:preserve-3d;will-change:transform;
	box-shadow:inset 0 0 0 2px #4b5675,inset 0 0 0 7px #000,0 40px 80px -15px rgba(0,0,0,.9),0 15px 25px -5px rgba(0,0,0,.7)}
.device__screen{position:absolute;inset:7px;border-radius:2.3rem;overflow:hidden;background:#070c19;box-shadow:inset 0 0 15px #000}
.device__glare{position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(110deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,0) 45%)}
.doc{position:relative;height:100%;padding:2.3rem 1.1rem 1rem;display:flex;flex-direction:column;gap:.9rem;font-size:12px}
.doc__head{display:flex;justify-content:space-between;align-items:center}
.doc__head small{display:block;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5);font-weight:700}
.doc__head b{font-size:16px;letter-spacing:-.01em}
.doc__av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.doc__ring{position:relative;width:150px;height:150px;margin:.4rem auto .6rem;display:grid;place-items:center;filter:drop-shadow(0 12px 20px rgba(0,0,0,.7))}
.doc__ring svg{position:absolute;inset:0;width:100%;height:100%}
.doc__ring .ring{transform:rotate(-90deg);transform-origin:center;stroke-dasharray:402;stroke-dashoffset:402;stroke-linecap:round}
.doc__ring>div{text-align:center;position:relative}
.doc__ring b{display:block;font-size:40px;font-weight:700;letter-spacing:-.04em;line-height:1}
.doc__ring small{display:block;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:4px;font-weight:700}
.doc__row{display:flex;align-items:center;gap:.7rem;padding:.65rem .7rem;border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.05);box-shadow:inset 0 1px 1px rgba(255,255,255,.06),0 8px 16px rgba(0,0,0,.3)}
.doc__row i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--accent);background:rgba(104,131,206,.14);border:1px solid rgba(104,131,206,.28);flex:none}
.doc__row i svg{width:18px;height:18px}
.doc__row b{display:block;font-size:12px}
.doc__row span{font-size:10px;color:rgba(255,255,255,.55)}
.cbadge{position:absolute;z-index:30;display:flex;align-items:center;gap:.8rem;padding:.8rem 1rem;border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.02));backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 0 0 1px rgba(255,255,255,.1),0 25px 50px -12px rgba(0,0,0,.8),inset 0 1px 1px rgba(255,255,255,.2)}
.cbadge i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--accent);background:rgba(104,131,206,.16);border:1px solid rgba(104,131,206,.3);flex:none}
.cbadge i svg{width:19px;height:19px}
.cbadge b{display:block;font-size:13px;letter-spacing:-.01em}
.cbadge span{font-size:11px;color:rgba(255,255,255,.58)}
.cbadge--a{top:9%;left:-12%}
.cbadge--b{bottom:12%;right:-12%}
.js .cine .cbadge,.js .cine .cw,.js .cine__left,.js .cine__right,.js .cine__mockwrap{visibility:hidden}

/* Progresso de leitura */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:60;background:var(--accent);transform:scaleX(0);transform-origin:left;pointer-events:none}

@media (max-width:900px){
	.cine__card{width:94vw;height:90vh;border-radius:26px}
	.cine__inner{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;gap:.5rem;justify-items:center;text-align:center;padding:1.2rem 1rem}
	.cine__right{order:1;justify-content:center}.cine__mockwrap{order:2;width:100%;height:100%;min-height:0}.cine__left{order:3}
	.cine__mark{width:70px}
	.cine__scale{transform:scale(.62)}
	.cine__left p{display:none}
	.cine__left h3{margin:0;font-size:1.35rem}
	.cbadge--a{left:-18%}.cbadge--b{right:-18%}
}
html:not(.js) .cine,.cine.is-static{display:none}
@media (prefers-reduced-motion:reduce){.cine{display:none}}

/* Rede de segurança: se o JS/GSAP demorar ou falhar, o hero aparece sozinho após 5s. */
@keyframes failsafe{to{opacity:1;transform:none}}
.js [data-hero],.js .frame>i{animation:failsafe .6s 5s forwards}


.hdr__nav a{white-space:nowrap}
@media (max-width:1100px){
	.hdr__burger{display:block}
	.hdr__nav{position:fixed;inset:0;background:var(--navy);color:#fff;flex-direction:column;justify-content:center;align-items:flex-start;gap:1.2rem;padding:var(--hdr) var(--gutter) 40px;font-size:1.6rem;font-weight:300;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s;z-index:-1}
	.hdr.is-open .hdr__nav{opacity:1;visibility:visible}
	.hdr.is-open{color:#fff}
	.hdr.is-open .logo--branco{opacity:1}.hdr.is-open .logo--escuro{opacity:0}
	.hdr__nav .btn{font-size:1rem;margin-top:1rem}
	.hdr[data-theme="light"] .hdr__cta{background:var(--accent);color:#fff}
}

/* ---------- Responsivo ---------- */
@media (max-width:1080px){
	.dif__grid,.sol__grid{grid-template-columns:repeat(2,1fr)}
	.stats{grid-template-columns:repeat(2,1fr)}
	.stat:nth-child(3){padding-left:0;border-left:0}
	.stat:nth-child(n+3){margin-top:2rem}
	.card{min-height:280px}
}
@media (max-width:900px){
	:root{--hdr:72px}
	.hdr__burger{display:block}
	.hdr__nav{position:fixed;inset:0;background:var(--navy);color:#fff;flex-direction:column;justify-content:center;align-items:flex-start;gap:1.2rem;padding:var(--hdr) var(--gutter) 40px;font-size:1.6rem;font-weight:300;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s;z-index:-1}
	.hdr.is-open .hdr__nav{opacity:1;visibility:visible}
	.hdr.is-open{color:#fff}
	.hdr.is-open .logo--branco{opacity:1}.hdr.is-open .logo--escuro{opacity:0}
	.hdr__nav .btn{font-size:1rem;margin-top:1rem}
	.hdr[data-theme="light"] .hdr__cta{background:var(--accent);color:#fff}
	.trad__in,.sobre__grid,.cta__grid,.sec-head--split{grid-template-columns:1fr}
			.ftr__top{grid-template-columns:1fr 1fr}
	.ftr__logo{grid-column:1/-1}
	.hero__lines{opacity:.3}
}
@media (max-width:600px){
	.dif__grid,.sol__grid,	.field-row{grid-template-columns:1fr}
	.trad__row{grid-template-columns:1fr;gap:.3rem}
	.trad__arrow{display:none}
	.stats{grid-template-columns:1fr}
	.stat+.stat,.stat:nth-child(3){padding-left:0;border-left:0}
	.stat{padding:1.4rem 0;border-bottom:1px solid var(--line-dark)}
	.stat:nth-child(n+3){margin-top:0}
	.hero__scroll{display:none}
	.hero__cta .btn{width:100%;justify-content:center}
	.frame__b{width:40%}
	.ftr__top{grid-template-columns:1fr}
	.card{min-height:0}
	.step{grid-template-columns:1fr;padding-left:28px}
	.step__n{font-size:3.6rem}
}
@media (prefers-reduced-motion:reduce){
	.card::before{animation:none}
	html{scroll-behavior:auto}
	*{animation:none!important;transition:none!important}
	.js [data-reveal],.js [data-hero],.js .frame>i,.js [data-hero="line"]{opacity:1!important;transform:none!important}
	.js .trad__plain{opacity:1;transform:none}
}
