/* CyberNetworks — folha de estilos do site */
:root{
  /* paleta original da marca */
  --red:#e01010; --red-b:#ff3030; --red-d:#b40b0b;
  --bg:#080808; --bg-2:#0e0e0e; --bg-3:#111; --surface:#191919;
  --ink:#f9f5f1; --muted:#8f8983; --muted-hi:#bcb5ae;
  --green:#1a9e4a; --green-b:#35c46c;
  --grad:linear-gradient(120deg,#ff3030 0%,#e01010 55%,#8f0a0a 100%);
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16);
  --panel:rgba(255,255,255,.035); --panel-2:rgba(255,255,255,.06);
  --font:'Exo 2',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --r:1.125rem; --r-sm:.75rem; --hdr:4.625rem; --tb:2.125rem;
  --ease:cubic-bezier(.22,.7,.2,1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.55;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
ul{list-style:none}
:focus-visible{outline:2px solid var(--red-b);outline-offset:3px;border-radius:6px}
::selection{background:rgba(224,16,16,.45)}
[id]{scroll-margin-top:calc(var(--hdr) + 1.5rem)}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--red);border-radius:3px}

.wrap{width:100%;max-width:88rem;margin:0 auto;padding:0 clamp(1.125rem,4.9vw,4.5rem)}
.skip{position:absolute;left:.75rem;top:-8rem;z-index:400;background:var(--red);color:#fff;font-weight:600;padding:.6rem 1rem;border-radius:.625rem;transition:top .2s}
.skip:focus{top:.625rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ic.fill{fill:currentColor;stroke:none}
.progress{position:fixed;inset:0 0 auto 0;z-index:200;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;pointer-events:none}

/* ---------- Tipografia ---------- */
.eyebrow{display:block;font-size:.78rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:var(--muted-hi)}
.eyebrow.rd{color:var(--red-b)}
.display{font-weight:800;letter-spacing:-.03em;line-height:.98;color:#fff;font-size:clamp(2.7rem,6.4vw,5.9rem)}
.h2{font-weight:700;letter-spacing:-.025em;line-height:1.05;color:#fff;font-size:clamp(1.9rem,3.7vw,3rem)}
.h3{font-weight:600;letter-spacing:-.01em;line-height:1.2;color:#fff;font-size:1.22rem}
.rd{color:var(--red-b)}
.display .rd{color:var(--red);font-style:italic}
.lead{font-size:clamp(1.05rem,1.5vw,1.25rem);font-weight:300;color:#d9d2cb;max-width:36rem}
.lead b,.lead strong{font-weight:600;color:#fff}

/* ---------- Botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3.125rem;padding:.8rem 1.7rem;border-radius:62.5rem;border:1.5px solid transparent;font-weight:600;font-size:1.02rem;letter-spacing:-.005em;white-space:nowrap;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s,background-color .2s,border-color .2s,color .2s}
.btn .ic{width:1.1875rem;height:1.1875rem;transition:transform .25s var(--ease)}
.btn:hover .ic.arr{transform:translateX(4px)}
.btn:active{transform:translateY(1px)}
.btn-red{background:linear-gradient(135deg,#f02020,#d40e0e);color:#fff;box-shadow:0 .625rem 1.875rem -10px rgba(224,16,16,.75)}
.btn-red:hover{background:linear-gradient(135deg,#ff3030,#e01010);box-shadow:0 .875rem 2.375rem -8px rgba(224,16,16,.9);transform:translateY(-2px)}
.btn-line{border-color:rgba(255,255,255,.7);color:#fff;background:rgba(8,8,8,.3)}
.btn-line:hover{border-color:var(--red-b);color:#fff;background:rgba(224,16,16,.14);transform:translateY(-2px)}
.btn-soft{border-color:var(--line-2);background:var(--panel);color:#fff}
.btn-soft:hover{border-color:var(--red-b);background:rgba(224,16,16,.1)}
.btn-block{width:100%}
.link-arrow{display:inline-flex;align-items:center;gap:.45rem;color:var(--red-b);font-weight:500;border-bottom:1px solid transparent;transition:border-color .2s,gap .2s}
.link-arrow:hover{border-color:currentColor;gap:.65rem}

/* ---------- Cabeçalho ---------- */
.site-header{position:fixed;inset:0 0 auto 0;z-index:100;transition:background-color .35s,box-shadow .35s,backdrop-filter .35s}
.site-header.scrolled{background:rgba(8,8,8,.8);-webkit-backdrop-filter:blur(1.125rem) saturate(140%);backdrop-filter:blur(1.125rem) saturate(140%);box-shadow:0 1px 0 rgba(255,255,255,.07),0 1.125rem 2.5rem -26px #000}
.topbar{font-size:.82rem;color:var(--muted-hi);border-bottom:1px solid rgba(255,255,255,.06);max-height:var(--tb);overflow:hidden;transition:max-height .35s var(--ease),opacity .25s,border-color .25s}
.site-header.scrolled .topbar{max-height:0;opacity:0;border-color:transparent}
.topbar-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:var(--tb)}
.topbar nav{display:flex;align-items:center;gap:1.5rem}
.topbar a,.topbar .tb-item{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.topbar a{transition:color .2s}
.topbar a:hover{color:#fff}
.topbar b{color:#fff;font-weight:600}
.topbar .ic{width:.875rem;height:.875rem;color:var(--red-b)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;height:var(--hdr)}
.brand{display:flex;align-items:center;gap:.65rem;flex:none}
.brand img{height:2.5rem;width:auto;filter:drop-shadow(0 2px .75rem rgba(224,16,16,.45))}
.brand .wm{font-weight:800;font-style:italic;font-size:1.5rem;letter-spacing:-.03em;color:#fff;line-height:1}
.brand .wm b{font-weight:800;color:var(--red-b)}
.menu{display:flex;align-items:center;gap:clamp(1rem,2.4vw,2.4rem)}
.menu a{position:relative;padding:.5rem .1rem;font-size:.98rem;color:#cfc8c1;transition:color .2s}
.menu a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:var(--red-b);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.menu a:hover{color:#fff}
.menu a:hover::after,.menu a.on::after{transform:scaleX(1)}
.menu a.on{color:#fff;font-weight:500}
.head-cta{display:flex;align-items:center;gap:.7rem;flex:none}
.head-cta .btn{min-height:2.625rem;padding:.45rem 1.25rem;font-size:.95rem;border-radius:.75rem}
.burger{display:none;width:2.75rem;height:2.75rem;border:1px solid var(--line-2);border-radius:.75rem;background:var(--panel);cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.burger span{width:1.25rem;height:2px;border-radius:2px;background:#fff}

.mobile-menu{position:fixed;inset:0;z-index:300;background:rgba(6,6,6,.97);-webkit-backdrop-filter:blur(.875rem);backdrop-filter:blur(.875rem);display:none;flex-direction:column;padding:1.125rem clamp(1.125rem,5vw,2rem) 1.75rem;overflow-y:auto}
.mobile-menu.open{display:flex}
.mm-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.2rem}
.mm-close{width:2.75rem;height:2.75rem;border-radius:.75rem;border:1px solid var(--line-2);background:var(--panel);font-size:1.6rem;line-height:1;cursor:pointer}
.mm-links a{display:flex;align-items:center;justify-content:space-between;padding:.85rem .2rem;font-size:1.45rem;font-weight:600;letter-spacing:-.02em;color:#fff;border-bottom:1px solid var(--line)}
.mm-links .ic{color:var(--muted)}
.mm-actions{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:1.3rem}
.mm-actions .btn{min-height:3rem;padding:.6rem .8rem;font-size:.93rem;border-radius:.75rem}
.mm-actions .wide{grid-column:1/-1}
.mm-note{margin-top:1.2rem;font-size:.86rem;color:var(--muted-hi)}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;padding-top:calc(var(--hdr) + var(--tb));min-height:min(100svh,60rem);display:flex;flex-direction:column;border-bottom:1px solid rgba(255,48,48,.55);box-shadow:0 1px 1.375rem rgba(224,16,16,.4)}
.hero-main{flex:1;display:flex;align-items:center}
.hero-copy{position:relative;z-index:3;max-width:42rem;padding:clamp(1.6rem,4vh,3rem) 0 clamp(2rem,5vh,3.4rem)}
.hero-copy .eyebrow{margin-bottom:1.1rem}
.hero-copy .lead{margin-top:1.5rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.2rem}
.hero-actions .btn{min-height:3.5rem;padding:.9rem 1.9rem;font-size:1.08rem}
.scroll-cue{display:inline-flex;align-items:center;gap:.9rem;margin-top:2.6rem;font-size:.7rem;letter-spacing:.36em;text-transform:uppercase;color:var(--muted-hi);transition:color .2s}
.scroll-cue:hover{color:#fff}
.scroll-cue i{position:relative;display:block;width:1px;height:1.75rem;background:var(--line-2);overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;left:0;top:0;width:100%;height:45%;background:var(--red-b);animation:cue 1.9s var(--ease) infinite}
@keyframes cue{from{transform:translateY(-110%)}to{transform:translateY(240%)}}

.scene{position:absolute;z-index:1;top:calc(var(--hdr) + var(--tb) - 1rem);bottom:0;right:0;left:42%;overflow:hidden;pointer-events:none}
.scene-layer{position:absolute;inset:0;will-change:transform;transition:transform .5s var(--ease)}
.scene-img{inset:-2.5%}
.scene-img img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.scene-fibers svg{width:100%;height:100%;overflow:visible;mix-blend-mode:screen}
.scene::before,.scene::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none}
.scene::before{background:linear-gradient(90deg,var(--bg) 0%,rgba(8,8,8,.82) 10%,rgba(8,8,8,.32) 26%,transparent 44%)}
.scene::after{background:linear-gradient(180deg,var(--bg) 0%,transparent 16%,transparent 66%,rgba(8,8,8,.86) 100%)}
.scene-tags{z-index:3}
.tag{position:absolute;display:inline-flex;align-items:center;gap:.6rem;padding:.55rem 1rem;border-radius:.75rem;font-size:clamp(.82rem,1.2vw,1.08rem);font-weight:400;color:#fff;white-space:nowrap;background:linear-gradient(180deg,rgba(34,10,10,.92),rgba(14,8,8,.92));border:1px solid rgba(255,48,48,.75);box-shadow:0 0 0 1px rgba(255,48,48,.12),0 0 1.375rem rgba(224,16,16,.4),inset 0 0 1.125rem rgba(224,16,16,.14)}
.tag b{font-weight:700}
.tag .ic{width:1.35em;height:1.35em;color:var(--red-b)}
.tag.t-a{left:9%;top:11%;transform:rotate(-1.5deg)}
.tag.t-b{right:7%;top:19%;transform:rotate(3deg);border-color:rgba(255,255,255,.6);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 1.375rem rgba(255,255,255,.16),inset 0 0 1.125rem rgba(255,255,255,.06);background:linear-gradient(180deg,rgba(24,24,24,.92),rgba(10,10,10,.92))}
.tag.t-b .ic{color:#fff}
.tag.t-c{right:11%;bottom:27%;transform:rotate(-2deg)}

/* fibras: pulsos de luz percorrendo os caminhos */
.fiber{fill:none;stroke-linecap:round;animation:fiber-run var(--d,5s) linear infinite;animation-delay:var(--dl,0s)}
.fiber.glow{stroke-width:13;opacity:.3}
.fiber.core{stroke-width:3.2}
.fiber.head{stroke:#fff;stroke-width:5}
.fiber.r{stroke:#ff3030}.fiber.w{stroke:#fff}
.fiber.glow,.fiber.core{stroke-dasharray:64 936;stroke-dashoffset:1058}
.fiber.head{stroke-dasharray:6 994;stroke-dashoffset:1000}
@keyframes fiber-run{from{stroke-dashoffset:1064}to{stroke-dashoffset:0}}
.is-paused .fiber{animation-play-state:paused}

.pillars{position:relative;z-index:3;border-top:1px solid var(--line);background:rgba(8,8,8,.62);-webkit-backdrop-filter:blur(.75rem);backdrop-filter:blur(.75rem)}
.pillars-list{display:grid;grid-template-columns:repeat(4,1fr)}
.pillars-list li{display:flex;align-items:center;justify-content:center;gap:.9rem;padding:1.15rem 1rem;border-left:1px solid var(--line)}
.pillars-list li:first-child{border-left:0}
.pillars-list b{font-size:clamp(1.5rem,2.4vw,2rem);font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--red-b)}
.pillars-list span{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-hi)}

/* ---------- Faixa rolante ---------- */
.band-marquee{border-bottom:1px solid var(--line);background:var(--bg-2);overflow:hidden;padding:1rem 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee{display:flex;width:max-content;animation:marquee 30s linear infinite}
.band-marquee:hover .marquee{animation-play-state:paused}
.marquee ul{display:flex;flex:none}
.marquee li{display:flex;align-items:center;gap:2.2rem;padding-right:2.2rem;font-size:.82rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:#d6cfc8;white-space:nowrap}
.marquee li::after{content:"";width:.4rem;height:.4rem;background:var(--red);transform:rotate(45deg);box-shadow:0 0 .6rem rgba(224,16,16,.8)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- Seções ---------- */
.section{position:relative;padding:clamp(3.6rem,9vw,7rem) 0}
.section.alt{background:var(--bg-2)}
.section.alt-3{background:var(--bg-3)}
.sec-head{max-width:46rem;margin-bottom:clamp(2rem,4vw,3.2rem)}
.sec-head .h2{margin-top:.9rem}
.sec-head p{margin-top:1rem;color:var(--muted-hi);font-size:1.08rem;font-weight:300}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.card{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid var(--line);border-radius:var(--r);transition:border-color .3s,box-shadow .3s,transform .3s var(--ease)}
.card.hover:hover{border-color:rgba(255,48,48,.55);box-shadow:0 0 0 1px rgba(255,48,48,.14),0 1.5rem 3.125rem -30px rgba(224,16,16,.7);transform:translateY(-3px)}
.ico{display:inline-flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:.875rem;border:1px solid rgba(255,48,48,.32);background:linear-gradient(135deg,rgba(255,48,48,.18),rgba(224,16,16,.06));color:var(--red-b);flex:none;transition:background-color .3s,color .3s}
.ico .ic{width:1.375rem;height:1.375rem}
.card.hover:hover .ico{background:var(--red);color:#fff}
.note{margin-top:1.4rem;color:var(--muted-hi);font-size:.9rem}

/* ---------- Planos ---------- */
.plan-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.plan{display:flex;flex-direction:column;padding:1.6rem 1.3rem 1.4rem}
.plan.pop{border-color:rgba(255,48,48,.7);background:linear-gradient(180deg,rgba(224,16,16,.2),rgba(255,255,255,.02) 62%);box-shadow:0 0 0 1px rgba(255,48,48,.16),0 1.875rem 3.75rem -36px rgba(224,16,16,.85)}
.plan-top{display:flex;align-items:center;justify-content:space-between;gap:.6rem;min-height:1.75rem;margin-bottom:1rem}
.kicker{display:block;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted-hi)}
.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.28rem .7rem;border-radius:62.5rem;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border:1px solid rgba(255,48,48,.5);color:var(--red-b);background:rgba(224,16,16,.1)}
.badge.solid{background:var(--red);border-color:var(--red);color:#fff}
.plan .speed{font-size:clamp(2.8rem,4vw,3.5rem);font-weight:800;letter-spacing:-.045em;line-height:.95;color:#fff}
.plan .speed small{font-size:.36em;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--red-b);margin-left:.25em}
.plan .tech{margin-top:.55rem;color:#e6dfd8;font-weight:500;font-size:.92rem;line-height:1.35;min-height:2.7em}
.plan hr{border:0;border-top:1px solid var(--line);margin:1rem 0}
.plan .from{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.plan .price{font-size:2.3rem;font-weight:800;letter-spacing:-.03em;line-height:1.05;color:var(--red-b);white-space:nowrap}
.plan .price sup{font-size:.42em;font-weight:600;vertical-align:top;position:relative;top:.35em;margin-right:.15em}
.plan .price small{font-size:.34em;font-weight:400;letter-spacing:0;color:var(--muted-hi);margin-left:.2em}
.plan .install{margin-top:.5rem;font-size:.82rem;color:var(--muted-hi)}
.plan .install.free{display:flex;align-items:center;gap:.35rem;color:var(--green-b);font-weight:600}
.plan .install .ic{width:1rem;height:1rem;stroke-width:2.4}
.plan ul{margin:1.1rem 0 1.4rem;display:grid;gap:.5rem;flex:1;align-content:start}
.plan li{display:flex;gap:.55rem;align-items:flex-start;color:#d9d2cb;font-weight:300;font-size:.92rem}
.plan li .ic{width:1.05rem;height:1.05rem;color:var(--red-b);margin-top:.2rem}
.plan .btn{min-height:2.875rem;padding:.6rem 1rem;font-size:.98rem;border-radius:.75rem}

/* ---------- TV ---------- */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.6rem 0 2rem}
.chip{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem 1rem;border-radius:62.5rem;border:1px solid var(--line-2);background:var(--panel);font-size:.95rem;font-weight:500;color:#e6dfd8;transition:background-color .25s,border-color .25s,color .25s,transform .25s var(--ease)}
.chip:hover{background:var(--red);border-color:var(--red);color:#fff;transform:translateY(-2px)}
.chip.more{border-color:rgba(255,48,48,.55);color:var(--red-b);background:rgba(224,16,16,.1)}
.chip.more:hover{color:#fff;background:var(--red)}
.fidel{position:relative;display:inline-flex;border-radius:1rem;padding:1.5px;background:linear-gradient(120deg,#ff3030,#5a0808,#ff3030);background-size:220% 100%;animation:prem 8s linear infinite}
@keyframes prem{to{background-position:220% 0}}
.fidel span{display:flex;align-items:center;gap:.7rem;border-radius:calc(1rem - 1.5px);background:#120909;padding:.9rem 1.4rem;font-size:.86rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.fidel .ic{color:var(--red-b)}
.devices{position:relative;aspect-ratio:16/11;max-width:40rem;margin-left:auto;width:100%}
.devices svg.links{position:absolute;inset:-6% -4%;width:108%;height:112%;overflow:visible;mix-blend-mode:screen}
.dev{position:absolute;border-radius:.875rem;background:linear-gradient(145deg,#262626,#0c0c0c);border:1px solid rgba(255,255,255,.16);box-shadow:0 1.875rem 3.75rem -30px #000,0 0 2.5rem -12px rgba(224,16,16,.6);padding:7px}
.dev .screen{position:relative;width:100%;height:100%;border-radius:8px;overflow:hidden;background:radial-gradient(120% 90% at 20% 10%,rgba(255,48,48,.62),transparent 55%),radial-gradient(110% 100% at 90% 100%,rgba(143,10,10,.75),transparent 55%),linear-gradient(160deg,#1c0d0d,#0a0707)}
.dev .screen::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.07) 0 2px,transparent 2px 2.875rem);opacity:.6}
.dev .screen::after{content:"";position:absolute;left:8%;right:38%;bottom:11%;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--red-b) 40%,rgba(255,255,255,.22) 40%)}
.dev .play{position:absolute;left:50%;top:46%;width:18%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:rgba(8,8,8,.55);border:1.5px solid rgba(255,255,255,.8);display:grid;place-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.dev .play::after{content:"";width:32%;height:38%;margin-left:8%;background:#fff;clip-path:polygon(0 0,100% 50%,0 100%)}
.dev .live{position:absolute;left:6%;top:9%;z-index:1;display:inline-flex;align-items:center;gap:.4rem;padding:.25rem .6rem;border-radius:.4rem;background:rgba(8,8,8,.6);font-size:clamp(.6rem,1vw,.8rem);font-weight:600;letter-spacing:.08em;color:#fff}
.dev .live::before{content:"";width:.45em;height:.45em;border-radius:50%;background:var(--red-b);box-shadow:0 0 .5em var(--red-b)}
.dev.tv{left:6%;top:4%;width:76%;height:66%}
.dev.tv::after{content:"";position:absolute;left:32%;right:32%;bottom:-13%;height:10%;background:linear-gradient(180deg,#222,#0c0c0c);clip-path:polygon(38% 0,62% 0,100% 100%,0 100%);border-radius:2px}
.dev.tablet{right:0;bottom:2%;width:40%;height:44%;border-radius:1rem}
.dev.phone{left:0;bottom:0;width:17%;height:50%;border-radius:1.125rem;padding:5px}
.dev.phone .play{width:44%}
.dev.tablet .play{width:20%}
.dev.tv .play{width:13%}
.dev.phone .screen{border-radius:.8125rem}

/* ---------- Recursos (bento) ---------- */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}
.bento .card{padding:clamp(1.4rem,2.4vw,2rem);overflow:hidden}
.bento .b-7{grid-column:span 7}.bento .b-5{grid-column:span 5}.bento .b-6{grid-column:span 6}
.bento .h3{margin:1.1rem 0 .45rem}
.bento p{color:var(--muted-hi);font-weight:300;max-width:34rem}
.bento .big{display:inline-block;font-size:clamp(2.6rem,5vw,4rem);font-weight:800;letter-spacing:-.01em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.08em}
.bento .glowline{position:absolute;right:-8%;bottom:-34%;width:62%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(224,16,16,.3),transparent);pointer-events:none}
.bento .card>*:not(.glowline){position:relative}

/* ---------- Contato ---------- */
.contact{align-items:start}
.contact .lead{margin:1.1rem 0 2rem}
.cc-list{display:grid;gap:.7rem}
.cc{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem}
.cc .ico{width:2.625rem;height:2.625rem;border-radius:.75rem}
.cc .ico .ic{width:1.2rem;height:1.2rem}
.cc div{min-width:0;flex:1}
.cc .kicker{margin-bottom:.15rem}
.cc b{display:block;font-weight:600;color:#fff;font-size:1.02rem;line-height:1.3;overflow-wrap:anywhere}
.cc>.ic{color:var(--muted);transition:transform .25s var(--ease),color .25s}
a.cc:hover>.ic{transform:translateX(4px);color:var(--red-b)}
.form-shell{position:relative;border-radius:1.375rem;padding:1.5px;background:linear-gradient(120deg,#ff3030,#3a0707,#ff3030);background-size:220% 100%;animation:prem 8s linear infinite}
.form-card{border-radius:calc(1.375rem - 1.5px);background:radial-gradient(70% 90% at 100% 0,rgba(224,16,16,.22),transparent 60%),#0d0909;padding:clamp(1.5rem,3.2vw,2.4rem)}
.form-card .h3{font-size:1.5rem;margin-bottom:1.3rem}
.field{margin-bottom:1rem}
.field label{display:block;font-size:.7rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-hi);margin-bottom:.4rem}
.field input,.field select{width:100%;min-height:3.125rem;padding:.7rem 1rem;border-radius:var(--r-sm);border:1.5px solid var(--line-2);background:rgba(255,255,255,.04);color:#fff;font-size:1rem;outline:none;-webkit-appearance:none;appearance:none;transition:border-color .2s,box-shadow .2s,background-color .2s}
.field input::placeholder{color:var(--muted)}
.field input:focus,.field select:focus{border-color:var(--red-b);background:rgba(255,255,255,.06);box-shadow:0 0 0 3px rgba(224,16,16,.22)}
.field select{padding-right:2.6rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff3030' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center;background-size:1.1rem}
.field select option{background:#191919;color:#fff}
.field.bad input{border-color:var(--red-b)}
.form-msg{min-height:1.3rem;margin:.2rem 0 .6rem;font-size:.9rem;color:var(--red-b)}
.form-card .btn{min-height:3.5rem;font-size:1.08rem;border-radius:.875rem}

/* ---------- Rodapé ---------- */
.site-footer{position:relative;overflow:hidden;border-top:1px solid var(--line);background:var(--bg)}
.site-footer::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 0,rgba(224,16,16,.2),transparent 70%);pointer-events:none}
.footer-giant{position:relative;text-align:center;white-space:nowrap;font-size:clamp(4.5rem,21vw,19rem);font-weight:900;font-style:italic;letter-spacing:-.05em;line-height:.86;padding-top:clamp(2rem,5vw,4rem);user-select:none}
.footer-giant span{background:linear-gradient(180deg,rgba(255,48,48,.5),rgba(224,16,16,.04) 82%);-webkit-background-clip:text;background-clip:text;color:transparent;padding:0 .08em}
.foot-grid{position:relative;display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:clamp(1.6rem,4vw,3.5rem);padding:clamp(2rem,4vw,3.2rem) 0 clamp(2rem,4vw,3rem)}
.foot-brand img{height:5.5rem;width:auto;margin-bottom:1.1rem}
.foot-brand p{color:var(--muted-hi);font-weight:300;max-width:20rem;font-size:.95rem}
.soc{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.soc .btn{min-height:2.5rem;padding:.4rem 1rem;font-size:.88rem;border-radius:.75rem}
.foot-col h2{font-size:.72rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--red-b);margin-bottom:1.1rem}
.foot-col a,.foot-col p{display:block;color:var(--muted-hi);font-size:.95rem;font-weight:300;padding:.28rem 0;transition:color .2s,padding-left .2s var(--ease)}
.foot-col a:hover{color:#fff;padding-left:4px}
.foot-col b{color:#fff;font-weight:600}
.foot-bottom{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.5rem;padding:1.2rem 0 1.6rem;border-top:1px solid var(--line);font-size:.84rem;color:var(--muted)}
.foot-bottom a{transition:color .2s}
.foot-bottom a:hover{color:var(--red-b)}
.wa-float{position:fixed;right:clamp(1rem,2.4vw,1.75rem);bottom:clamp(1rem,2.4vw,1.75rem);z-index:90;display:grid;place-items:center;width:3.5rem;height:3.5rem;border-radius:50%;background:#25d366;color:#fff;box-shadow:0 .75rem 1.75rem -8px rgba(37,211,102,.7);transition:transform .25s var(--ease)}
.wa-float:hover{transform:translateY(-3px) scale(1.05)}
.wa-float .ic{width:1.7rem;height:1.7rem}

/* ---------- Animações de entrada ---------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal.d1{transition-delay:.08s}.js .reveal.d2{transition-delay:.16s}.js .reveal.d3{transition-delay:.24s}.js .reveal.d4{transition-delay:.32s}
.rise{animation:rise .9s var(--ease) both}
.rise.d1{animation-delay:.12s}.rise.d2{animation-delay:.24s}.rise.d3{animation-delay:.36s}.rise.d4{animation-delay:.5s}
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* ---------- Responsivo ---------- */
@media(max-width:1400px) and (min-width:1241px){.plan .tech{min-height:4.05em}}
@media(max-width:1240px){
  .plan-grid{grid-template-columns:repeat(6,1fr)}
  .plan{grid-column:span 2}
  .plan:nth-child(n+4){grid-column:span 3}
  .plan .tech{min-height:2.7em}
  .tb-opt{display:none!important}
}
@media(max-width:1100px){.head-cta .btn-line{display:none}}
@media(max-width:980px){
  .menu{display:none}
  .burger{display:flex}
  .tb-note{display:none}
  .topbar-in{justify-content:center}
  .hero{min-height:0}
  .hero-main{align-items:flex-end;padding-top:min(58vw,24rem)}
  .scene{left:0;bottom:auto;height:calc(min(86vw,36rem) + 1rem)}
  .scene-img img{object-position:50% 12%}
  .scene::before{background:linear-gradient(90deg,rgba(8,8,8,.5),transparent 30%,transparent 70%,rgba(8,8,8,.5))}
  .scene::after{background:linear-gradient(180deg,var(--bg) 0%,transparent 14%,transparent 42%,rgba(8,8,8,.9) 78%,var(--bg) 100%)}
  .tag.t-a{left:5%;top:9%}
  .tag.t-b{right:5%;top:22%}
  .tag.t-c{display:none}
  .scroll-cue{display:none}
  .split{grid-template-columns:1fr}
  .devices{margin:0 auto}
  .bento .b-7,.bento .b-5,.bento .b-6{grid-column:span 6}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
}
@media(max-width:760px){
  :root{--tb:0rem;--hdr:4rem}
  .topbar{display:none}
  .brand .wm{font-size:1.3rem}
  .brand img{height:2.2rem}
  .pillars-list{grid-template-columns:1fr 1fr}
  .pillars-list li{justify-content:flex-start;padding:.9rem .4rem;gap:.7rem}
  .pillars-list li:nth-child(odd){border-left:0}
  .pillars-list li:nth-child(n+3){border-top:1px solid var(--line)}
  .pillars-list span{letter-spacing:.14em;font-size:.66rem}
  .plan-grid{grid-template-columns:1fr 1fr}
  .plan,.plan:nth-child(n+4){grid-column:auto}
  .plan:last-child{grid-column:1/-1}
  .plan .tech{min-height:0}
  .bento .b-7,.bento .b-5,.bento .b-6{grid-column:1/-1}
  .hero-actions .btn{flex:1 1 12rem}
}
@media(max-width:520px){
  .head-cta .btn-red span{display:none}
  .head-cta .btn-red{padding:.45rem .8rem}
  .plan-grid{grid-template-columns:1fr}
  .plan:last-child{grid-column:auto}
  .foot-grid{grid-template-columns:1fr}
  .fidel span{letter-spacing:.08em;font-size:.78rem;padding:.8rem 1rem}
  .foot-bottom{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1;transform:none}
  .fiber{display:none}
  .marquee{flex-wrap:wrap;width:auto}
  .marquee ul[aria-hidden]{display:none}
  .marquee ul{flex-wrap:wrap;row-gap:.6rem;padding:0 1.125rem}
}
