:root{--green:#00af00;--green-dark:#087a18;--black:#080a09;--graphite:#151816;--graphite-2:#222622;--white:#fff;--off:#f2f5f1;--muted:#a4aba5;--ink:#111512;--line:rgba(255,255,255,.12);--shadow:0 24px 70px rgba(0,0,0,.18);--radius:18px;--container:min(1180px,calc(100% - 48px));--space-xs:8px;--space-sm:14px;--space-md:24px;--space-lg:48px;--space-xl:90px;--mono:'JetBrains Mono',ui-monospace,monospace}
:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:4px}
.icon-inline{width:13px;height:13px;vertical-align:-2px;margin-right:6px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:#fff;font-family:Inter,Arial,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:var(--container);margin-inline:auto}.skip{position:fixed;left:16px;top:-80px;background:#fff;color:#000;padding:10px 16px;z-index:1000}.skip:focus{top:16px}.utility{height:34px;border-bottom:1px solid var(--line);background:#050605;color:#aeb4af;font-size:11px;letter-spacing:.05em}.utility .container{height:100%;display:flex;align-items:center;gap:28px}.utility a{margin-left:auto;color:#fff}.header{height:108px;position:sticky;top:0;z-index:50;background:rgba(8,10,9,.88);border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}.nav-wrap{height:100%;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center;gap:10px;font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:-.04em}.brand img{width:52px;height:52px;object-fit:contain}.brand span{font-size:17px}.brand b{display:block;font-size:7px;letter-spacing:.24em;color:var(--green)}.brand--header img{width:96px;height:96px}.nav{margin-left:auto;display:flex;align-items:center;gap:24px}.nav a{font-size:12px;color:#d9ddda;transition:.2s}.nav a:hover{color:var(--green)}
.nav-dropdown{position:relative}.nav-dropdown__toggle{display:flex;align-items:center;gap:6px;background:none;border:0;color:#d9ddda;font-size:12px;cursor:pointer;padding:0}.nav-dropdown__toggle:hover{color:var(--green)}.nav-dropdown__toggle svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .2s}.nav-dropdown.open .nav-dropdown__toggle svg{transform:rotate(180deg)}.nav-dropdown__panel{display:none;position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%);min-width:240px;background:#0c100d;border:1px solid var(--line);border-radius:10px;padding:10px;box-shadow:var(--shadow);flex-direction:column;z-index:60}.nav-dropdown.open .nav-dropdown__panel{display:flex}.nav-dropdown__panel a{padding:10px 12px;border-radius:6px;font-size:12.5px}.nav-dropdown__panel a:hover{background:rgba(255,255,255,.06)}.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:15px 21px;background:var(--green);color:#061007;font-size:13px;font-weight:800;border:1px solid var(--green);border-radius:8px;transition:.25s;box-shadow:0 10px 30px rgba(0,175,0,.15)}.button:hover{transform:translateY(-2px);background:#06c506;box-shadow:0 14px 34px rgba(0,175,0,.25)}.button-small{padding:11px 16px;font-size:11px}.button-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.32);box-shadow:none}.button-ghost:hover{background:#fff;color:#000;border-color:#fff}.menu-toggle{display:none;margin-left:auto;background:transparent;border:0;padding:10px}.menu-toggle span{display:block;width:24px;height:2px;background:#fff;margin:5px}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 72% 40%,rgba(0,175,0,.09),transparent 34%),linear-gradient(135deg,#090b0a 0%,#101412 100%)}.hero:before{content:"";position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to right,black,transparent 74%)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:52px;padding-block:44px 52px;position:relative;z-index:2;width:var(--container);margin-inline:auto}.eyebrow{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#cbd0cc}.eyebrow span{width:24px;height:2px;background:var(--green)}.eyebrow.dark{color:#526058}.hero h1,.hero-title,.section h2{font-family:Montserrat,sans-serif;font-weight:800;line-height:1.04;letter-spacing:-.05em;margin:20px 0 22px}.hero h1,.hero-title{font-size:clamp(43px,5.2vw,74px);max-width:760px}.hero h1 em,.hero-title em,.section h2 em{display:block;color:var(--green);font-style:normal}.hero-lead{max-width:560px;color:#b9c0bb;font-size:15px;line-height:1.65}.hero-actions{display:flex;gap:12px;margin:22px 0}.proofs{display:flex;gap:0;padding-top:24px;border-top:1px solid var(--line)}.proofs div{padding:0 28px;border-right:1px solid var(--line)}.proofs div:first-child{padding-left:0}.proofs div:last-child{border:0}.proofs b,.proofs span{display:block}.proofs b{font-size:12px}.proofs span{font-size:10px;color:#8e9790}.hero-visual{position:relative;justify-self:end;width:min(100%,520px)}.photo-frame{height:460px;position:relative;overflow:hidden;border-radius:180px 180px 18px 18px;border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow)}.photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center}.photo-frame.hero-photo{border-radius:24px}
.hero-photo img.photo-main{object-fit:cover;object-position:center}
.hero-photo img.photo-bg{display:none}
.page-photo img.photo-main{object-fit:cover;object-position:center}
.page-photo img.photo-bg{display:none}.photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(5,8,6,.9))}.local-badge{position:absolute;left:28px;right:28px;bottom:28px;padding:18px 20px;background:rgba(7,10,8,.75);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(16px);border-radius:10px}.local-badge small,.local-badge b,.local-badge span{display:block}.local-badge small{color:var(--green);font-size:9px;letter-spacing:.16em}.local-badge b{font-size:13px;margin-top:5px}.local-badge span{font-size:11px;color:#aab1ac}.orbit{position:absolute;border:1px solid rgba(0,175,0,.28);border-radius:50%;pointer-events:none}.orbit-one{width:650px;height:650px;left:-80px;top:-10px}.orbit-two{width:760px;height:430px;left:-130px;top:80px;transform:rotate(22deg)}.scroll-hint{position:absolute;bottom:24px;left:50%;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#89908b;z-index:3}.scroll-hint span{color:var(--green);margin-left:8px}
.section{padding:110px 0}.light,.why,.faq{background:var(--off);color:var(--ink)}.section-head{display:grid;grid-template-columns:1.15fr .85fr;align-items:end;gap:80px;margin-bottom:54px}.section h2{font-size:clamp(34px,4vw,54px)}.section-head p{color:#687168;max-width:480px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.service-card{position:relative;min-height:290px;padding:30px;background:#fff;border:1px solid #dfe5df;border-radius:12px;transition:.3s;overflow:hidden}.service-card:hover{transform:translateY(-7px);box-shadow:0 24px 70px rgba(18,36,22,.12);border-color:#b5c1b6}.service-card i{position:absolute;right:20px;top:18px;color:#bdc5be;font:700 10px Montserrat}.service-card .icon{width:48px;height:48px;display:grid;place-items:center;border:1px solid #ccd4cc;border-radius:50%;color:var(--green-dark);font-size:21px;margin-bottom:38px}.service-card h3{font:700 18px Montserrat;margin:0 0 12px}.service-card p{font-size:13px;color:#687168}.service-card a{position:absolute;left:30px;bottom:27px;font-size:11px;font-weight:700;color:var(--green-dark)}.service-card a span{margin-left:8px}.service-card.featured{background:var(--graphite);color:#fff;border-color:var(--graphite)}.service-card.featured p{color:#aeb6b0}.service-card.featured a{color:#1ae51a}.service-card.featured .icon{border-color:rgba(255,255,255,.2);color:var(--green)}
.corporate{background:#0b0d0c;position:relative;overflow:hidden}.corporate:after{content:"";position:absolute;width:650px;height:650px;border-radius:50%;background:rgba(0,175,0,.08);filter:blur(110px);right:-250px;bottom:-300px}.corporate-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center;position:relative;z-index:2}.tech-panel{min-height:510px;background:linear-gradient(145deg,#171c18,#0b0e0c);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:26px;box-shadow:var(--shadow);overflow:hidden}.panel-top{display:flex;gap:7px;align-items:center;color:#778078;font-size:9px;letter-spacing:.14em}.panel-top span{width:7px;height:7px;border:1px solid #617063;border-radius:50%}.panel-top b{margin-left:auto}.panel-split{display:grid;grid-template-columns:1.3fr 1fr;gap:14px;margin:20px 0}.panel-chart{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;padding:10px;min-height:140px}.panel-chart svg{width:100%;height:100%;display:block}.panel-highlight{background:linear-gradient(150deg,var(--green),var(--green-dark));border-radius:12px;padding:18px;display:flex;flex-direction:column;justify-content:center;color:#04170a}.panel-highlight span{font-size:9px;letter-spacing:.16em;font-weight:800;opacity:.75}.panel-highlight b{font:800 34px Montserrat;margin:4px 0;letter-spacing:-.03em}.panel-highlight p{font-size:11px;margin:0;opacity:.85;line-height:1.4}
.metrics-4{grid-template-columns:repeat(2,1fr)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.metrics div{padding:16px;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:7px}.metrics span,.metrics b{display:block}.metrics span{font-size:8px;letter-spacing:.16em;color:#727b73}.metrics b{font-size:12px;margin-top:5px;color:#e4e8e4}.corporate-copy h2{max-width:620px}.corporate-copy>p{color:#aeb6b0;font-size:15px}.corporate-copy ul{padding:0;margin:30px 0;list-style:none}.corporate-copy li{padding:12px 0;border-bottom:1px solid var(--line);font-size:13px;color:#aeb6b0}.corporate-copy li:before{content:"✓";color:var(--green);font-weight:800;margin-right:12px}.corporate-copy li b{color:#fff}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #ccd4cc;border-left:1px solid #ccd4cc}.why-item{padding:32px;border-right:1px solid #ccd4cc;border-bottom:1px solid #ccd4cc}.why-item span{font:800 30px Montserrat;color:var(--green-dark)}.why-item h3{font:700 14px Montserrat;margin:40px 0 10px}.why-item p{color:#6a746c;font-size:12px}.local{background:#111512}.local-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:center}.local-photo{position:relative}.local-photo img{height:620px;width:100%;object-fit:cover;object-position:center;border-radius:16px;filter:saturate(.88) contrast(1.05)}.since{position:absolute;right:-30px;bottom:45px;width:150px;height:150px;border-radius:50%;background:var(--green);color:#041005;display:grid;place-content:center;text-align:center;border:10px solid #111512}.since small{font-size:9px;letter-spacing:.18em}.since b{font:800 32px Montserrat}.local-copy h2{max-width:650px}.local-copy>p{color:#aeb6b0}.address{display:flex;gap:18px;margin:35px 0;padding:22px;border:1px solid var(--line);border-radius:10px}.address>span{font-size:28px;color:var(--green)}.address small,.address b,.address p{display:block;margin:0}.address small{font-size:8px;color:var(--green);letter-spacing:.15em}.address b{font-size:14px}.address p{font-size:12px;color:#909891}.text-link{display:inline-block;color:var(--green);font-size:12px;font-weight:700}.faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:100px}.faq-intro{position:sticky;top:140px;align-self:start}.faq-intro p{color:#6c746d}.accordion details{border-top:1px solid #cdd4ce;padding:22px 0}.accordion details:last-child{border-bottom:1px solid #cdd4ce}.accordion summary{cursor:pointer;list-style:none;font:700 15px Montserrat;display:flex;justify-content:space-between;gap:20px}.accordion summary::-webkit-details-marker{display:none}.accordion summary span{font-size:22px;color:var(--green-dark);transition:.2s}.accordion details[open] summary span{transform:rotate(45deg)}.accordion details p{font-size:13px;color:#69716a;max-width:680px;padding-right:30px}.cta{background:var(--green);color:#041005;padding:72px 0}.cta-inner{display:grid;grid-template-columns:1.3fr .7fr;gap:80px;align-items:center}.cta span{font-size:9px;font-weight:800;letter-spacing:.16em}.cta h2{font:800 clamp(28px,3.5vw,48px)/1.08 Montserrat;margin:12px 0}.cta p{margin:0}.cta-actions{display:flex;flex-direction:column;align-items:flex-start;gap:18px}.button-dark{background:#081009;color:#fff;border-color:#081009;box-shadow:none}.button-dark:hover{background:#172118}.cta-actions>a:last-child{font-size:11px;font-weight:700;border-bottom:1px solid #075807}.footer{padding:70px 0 20px;background:#080a09}.footer-grid{display:grid;grid-template-columns:1.4fr .8fr 1fr .8fr;gap:56px}.footer-brand p,.footer div>p{font-size:11px;color:#7d857f}.footer h4{font:700 11px Montserrat;text-transform:uppercase;letter-spacing:.1em;margin:0 0 18px}.footer-grid>div>a:not(.brand){display:block;font-size:11px;color:#aab1ac;margin:8px 0}.footer-grid>div>a:hover{color:var(--green)}.footer-bottom{margin-top:55px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#68706a;font-size:9px}.whatsapp{position:fixed;right:20px;bottom:20px;z-index:40;display:flex;align-items:center;gap:9px;background:var(--green);color:#041005;padding:13px 16px;border-radius:30px;font-size:11px;font-weight:800;box-shadow:0 12px 35px rgba(0,0,0,.35)}.whatsapp svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:var(--black);stroke-width:1.6}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1050px){.nav{display:none}.menu-toggle{display:block}.nav.open{display:flex;position:absolute;left:0;right:0;top:108px;max-height:calc(100svh - 108px);overflow-y:auto;padding:24px;background:#0c100d;flex-direction:column;align-items:stretch;gap:4px;border-bottom:1px solid var(--line)}.nav.open a{padding:12px 4px}.nav-wrap>.button-small{display:none}.nav-dropdown{width:100%}.nav-dropdown__toggle{width:100%;justify-content:space-between;padding:12px 4px}.nav-dropdown__panel{position:static;transform:none;min-width:0;width:100%;border:0;background:rgba(255,255,255,.04);box-shadow:none;margin-top:4px}.hero-grid{grid-template-columns:1fr .8fr;gap:34px}.photo-frame{height:380px}.hero-slides{min-height:0}.service-grid{grid-template-columns:repeat(2,1fr)}.corporate-grid,.local-grid{gap:50px}.why-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){:root{--container:min(100% - 30px,1180px)}.utility span:nth-child(2){display:none}.header{height:76px}.brand--header img{width:58px;height:58px}.nav.open{top:76px;max-height:calc(100svh - 76px)}.hero-slides{min-height:auto}.hero-grid{grid-template-columns:1fr;padding:64px 0 56px}.hero h1,.hero-title{font-size:42px}.hero-visual{justify-self:stretch;width:100%}.photo-frame{height:340px;border-radius:80px 80px 14px 14px}.orbit{display:none}.proofs{gap:0}.proofs div{padding:0 12px}.proofs b{font-size:10px}.hero-actions{align-items:stretch;flex-direction:column}.scroll-hint{display:none}.hero-tabs{padding-bottom:0}.hero-tab{padding:14px 10px 16px}.hero-tab-label{font-size:11px}.hero-spin{display:none}.aurora{opacity:.35}.section{padding:78px 0}.section-head{grid-template-columns:1fr;gap:15px}.service-grid{grid-template-columns:1fr}.corporate-grid,.local-grid,.faq-grid,.cta-inner{grid-template-columns:1fr;gap:50px}.tech-panel{min-height:420px}.local-photo img{height:520px}.since{right:-4px;width:120px;height:120px}.faq-intro{position:static}.why-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:8px}.whatsapp span{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.button,.service-card{transition:none}}
.inner-hero{padding:92px 0 82px;background:radial-gradient(circle at 78% 25%,rgba(0,175,0,.12),transparent 26%),linear-gradient(135deg,rgba(9,11,10,.72),rgba(21,26,22,.55)),url('assets/inner-hero-bg.jpg') center/cover no-repeat;position:relative;overflow:hidden}
.inner-hero h1,.inner-hero p,.inner-hero .eyebrow,.inner-hero .breadcrumbs{text-shadow:0 2px 18px rgba(0,0,0,.55)}.breadcrumbs{font-size:10px;color:#89928b;letter-spacing:.08em;text-transform:uppercase;margin-bottom:34px}.breadcrumbs a{color:var(--green)}.inner-hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:80px;align-items:end}.inner-hero h1{font:800 clamp(42px,5vw,72px)/1.02 Montserrat;margin:16px 0 24px;letter-spacing:-.05em}.inner-hero p{font-size:17px;color:#b3bbb5;max-width:720px}.hero-index{font:800 clamp(80px,13vw,180px)/.8 Montserrat;color:transparent;-webkit-text-stroke:1px rgba(0,175,0,.3);text-align:right}.content-section{padding:92px 0;background:var(--off);color:var(--ink)}.content-section.alt{background:#fff}.content-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.content-kicker{font-size:10px;color:var(--green-dark);font-weight:800;letter-spacing:.15em;text-transform:uppercase}.content-section h2{font:800 clamp(30px,3.8vw,50px)/1.08 Montserrat;letter-spacing:-.045em;margin:12px 0 24px}.content-section h3{font:700 21px Montserrat}.content-section p{color:#626c64}.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0;list-style:none}.feature-list li{padding:16px 18px;background:#fff;border:1px solid #dbe2dc;border-radius:8px;font-size:13px;display:flex;align-items:center;gap:14px}.content-section.alt .feature-list li{background:var(--off)}
.feature-list .icon,.path-card .icon{width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;border:1px solid #ccd4cc;border-radius:50%;color:var(--green-dark)}
.feature-list .icon svg,.path-card .icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.subsection-card .icon{width:40px;height:40px;display:grid;place-items:center;border:1px solid #ccd4cc;border-radius:50%;color:var(--green-dark);margin-bottom:16px}
.subsection-card .icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.steps{counter-reset:step;display:grid;gap:12px}.step{counter-increment:step;padding:22px;border-left:3px solid var(--green);background:#fff;box-shadow:0 8px 28px rgba(10,30,14,.06)}.step:before{content:'0' counter(step);font:800 11px Montserrat;color:var(--green-dark)}.step h3{margin:7px 0}.notice{padding:22px;border:1px solid #cad4cb;background:#edf3ed;border-radius:8px;color:#526057;font-size:12px}.cross-links{padding:70px 0;background:#0d100e}.cross-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cross-card{padding:25px;border:1px solid var(--line);border-radius:10px;transition:.2s}.cross-card:hover{border-color:var(--green);transform:translateY(-3px)}.cross-card small{color:var(--green);font-size:9px;letter-spacing:.13em}.cross-card h3{font:700 16px Montserrat}.cross-card p{font-size:11px;color:#8f9891}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.contact-card{padding:28px;background:#fff;border:1px solid #dbe2dc;border-radius:10px}.contact-card span{font-size:9px;color:var(--green-dark);font-weight:800;letter-spacing:.13em}.contact-card h3{margin:10px 0}.contact-card a{color:var(--green-dark);font-weight:700}.inner-page .footer{border-top:1px solid var(--line)}
@media(max-width:760px){.inner-hero{padding:62px 0}.inner-hero-grid,.content-grid{grid-template-columns:1fr;gap:35px}.hero-index{text-align:left;font-size:80px}.feature-list,.cross-grid,.contact-grid{grid-template-columns:1fr}.content-section{padding:68px 0}}

/* Visual upgrade: branded photography and coherent line icons */
.service-card .icon{width:52px;height:52px;border-radius:14px;background:linear-gradient(145deg,#fff,#edf3ed);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 10px 25px rgba(14,45,19,.08)}
.service-card .icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.service-card.featured .icon{background:linear-gradient(145deg,rgba(0,175,0,.18),rgba(255,255,255,.03));box-shadow:none}
/* Nota (CHANGELOG-M3.md): os fundos fotográficos genéricos de "data center"/"bancada" que
   existiam aqui antes (network-operations-bg / technical-workbench-bg) foram removidos por
   violar o Brand Guideline oficial da M3 ("Evitar: fotos genéricas de data center que não
   representam a estrutura da M3") — eram fotos de banco de imagens fingindo ser um ambiente
   real da M3. No lugar, foram geradas por IA (OpenRouter, gemini-3-pro-image-preview) imagens
   PURAMENTE ABSTRATAS (linhas/glow verde, sem nenhum objeto, pessoa ou ambiente reconhecível) —
   ver imagens-para-gerar.txt para os prompts usados. Isso não viola o guideline porque não
   finge ser uma foto real da estrutura da M3, é só textura decorativa. Quando houver fotografia
   real da bancada/rack da M3 (ver TODO-CONFIRMACOES-CLIENTE.md), trocar por ela. */
.tech-panel{background:radial-gradient(circle at 75% 20%,rgba(0,175,0,.1),transparent 45%),linear-gradient(145deg,rgba(20,26,21,.4),rgba(10,13,11,.62)),url('assets/tech-panel-bg.jpg') center/cover no-repeat}
.tech-panel .metrics div{background:rgba(4,9,5,.72);backdrop-filter:blur(10px)}
.inner-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 64%,rgba(0,175,0,.1));pointer-events:none}
.inner-hero .container{position:relative;z-index:2}
.content-section{background-image:radial-gradient(circle at 88% 12%,rgba(0,175,0,.05),transparent 26%)}
.cross-links{background:linear-gradient(120deg,rgba(13,16,14,.55),rgba(10,12,10,.68)),url('assets/cross-links-bg.jpg') center/cover no-repeat}
.rich-section-head{max-width:760px;margin-bottom:44px}
.subsection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.subsection-card{padding:24px;background:#fff;border:1px solid #dbe2dc;border-radius:10px}
.content-section.alt .subsection-card{background:var(--off)}
.subsection-card h3{font:700 16px Montserrat;margin:0 0 10px;color:var(--ink)}
.subsection-card p{font-size:12.5px;color:#626c64;margin:0}
.page-photo{margin-top:28px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.page-photo img{width:100%;height:280px;object-fit:cover;object-position:center}
/* Painel com vídeo de fundo (vídeo próprio "video m3" — ver CHANGELOG-M3.md), usado no
   card "Montagem de Computador" para dar destaque visual dentro da grade de subseções.
   Mesma técnica "vídeo cover" do restante do site. */
.video-panel{grid-column:1/-1;position:relative;min-height:380px;border-radius:var(--radius);overflow:hidden;display:flex;align-items:flex-end;box-shadow:var(--shadow)}
.video-panel-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#090b0a}
.video-panel-bg iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-height:100%;min-width:177.78vh;transform:translate(-50%,-50%)}
.video-panel:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(6,9,7,.88) 0%,rgba(6,9,7,.42) 55%,rgba(6,9,7,.18) 100%)}
.video-panel-content{position:relative;z-index:2;padding:34px}
.video-panel-content h3{font:700 22px Montserrat;margin:0 0 10px;color:#fff}
.video-panel-content p{font-size:13.5px;color:#d3d9d4;margin:0;max-width:520px}
@media(prefers-reduced-motion:reduce){.video-panel-bg{display:none}.video-panel{background:linear-gradient(145deg,#171c18,#0b0e0c)}}
@media(max-width:760px){.video-panel{min-height:320px}}
@media(max-width:1050px){.subsection-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.subsection-grid{grid-template-columns:1fr}}
.paths-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.path-card{position:relative;padding:34px 30px;background:#fff;border:1px solid #dfe5df;border-radius:14px;transition:.3s;display:flex;flex-direction:column;gap:12px}
.path-card:hover{transform:translateY(-6px);box-shadow:0 24px 70px rgba(18,36,22,.12);border-color:#b5c1b6}
.path-card__label{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--green-dark);text-transform:uppercase}
.path-card h3{font:700 22px Montserrat;margin:0;color:var(--ink)}
.path-card p{font-size:13.5px;color:#687168;margin:0;flex:1}
.path-card a{font-size:12px;font-weight:800;color:var(--green-dark)}
.path-card a span{margin-left:6px}
@media(max-width:1050px){.paths-grid{grid-template-columns:1fr}}

/* ======================================================================
   REDESIGN 2026 — carrossel do hero, sistema de ícones, parallax e microinterações
   ====================================================================== */

/* Hero — carrossel (3 caminhos: Loja / Assistência / Empresas) */
.hero-aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.aurora{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;mix-blend-mode:screen}
.aurora-a{width:560px;height:560px;background:radial-gradient(circle,rgba(0,175,0,.55),transparent 70%);top:-200px;right:-140px;animation:auroraDrift1 22s ease-in-out infinite}
.aurora-b{width:460px;height:460px;background:radial-gradient(circle,rgba(0,229,118,.4),transparent 70%);bottom:-180px;left:-120px;animation:auroraDrift2 26s ease-in-out infinite}
.aurora-c{width:360px;height:360px;background:radial-gradient(circle,rgba(0,175,0,.3),transparent 70%);top:42%;left:40%;animation:auroraDrift3 30s ease-in-out infinite}
@keyframes auroraDrift1{0%,100%{transform:translate(0,0)}50%{transform:translate(-50px,35px)}}
@keyframes auroraDrift2{0%,100%{transform:translate(0,0)}50%{transform:translate(35px,-25px)}}
@keyframes auroraDrift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(25px,20px) scale(1.1)}}
.hero-noise{position:absolute;inset:0;z-index:1;opacity:.05;pointer-events:none;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px}
.hero h1,.hero-title{font-size:clamp(32px,3.6vw,52px)}
.hero h1 em,.hero-title em{background:linear-gradient(90deg,#39ff6a,var(--green) 55%,#00c853);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 22px rgba(0,175,0,.35))}
.hero-slide .eyebrow{display:inline-flex;padding:8px 16px 8px 12px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.03);backdrop-filter:blur(6px)}
.hero-slide .eyebrow span{width:8px;height:8px;border-radius:50%;background:var(--green);animation:eyebrowPing 2.2s ease-out infinite}
@keyframes eyebrowPing{0%{box-shadow:0 0 0 0 rgba(0,175,0,.55)}70%{box-shadow:0 0 0 9px rgba(0,175,0,0)}100%{box-shadow:0 0 0 0 rgba(0,175,0,0)}}
.hero-slide .proofs{display:flex;gap:12px;padding-top:0;border-top:0;flex-wrap:wrap}
.hero-slide .proofs div{padding:14px 18px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.035);backdrop-filter:blur(6px)}
.hero-slide .proofs b{font:800 15px Montserrat}
.hero-slide .proofs span{font-size:10px;color:#9aa39c;letter-spacing:.02em;margin-top:2px}
.hero-slide h1,.hero-slide .hero-title{margin:14px 0}
.hero-slide .button span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,.15);transition:transform .3s ease}
.hero-slide .button:hover span{transform:translate(3px,-3px)}
.hero-slides{position:relative;z-index:2;display:grid;min-height:520px}
.hero-slide{grid-area:1/1;display:flex;align-items:center;opacity:0;pointer-events:none;transition:opacity .7s ease;z-index:1}
.hero-slide.is-active{opacity:1;pointer-events:auto;z-index:2}
.hero-slide .hero-copy>*,.hero-slide .hero-visual{opacity:0}
.hero-slide.is-active .hero-copy>*{animation:heroRise .7s cubic-bezier(.22,1,.36,1) forwards}
.hero-slide.is-active .hero-copy>*:nth-child(1){animation-delay:.05s}
.hero-slide.is-active .hero-copy>*:nth-child(2){animation-delay:.11s}
.hero-slide.is-active .hero-copy>*:nth-child(3){animation-delay:.17s}
.hero-slide.is-active .hero-copy>*:nth-child(4){animation-delay:.23s}
.hero-slide.is-active .hero-copy>*:nth-child(5){animation-delay:.29s}
.hero-slide.is-active .hero-visual{animation:heroRise .8s cubic-bezier(.22,1,.36,1) .18s forwards}
@keyframes heroRise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.hero-tabs{display:flex;position:relative;z-index:3;border-top:1px solid rgba(255,255,255,.12)}
.hero-tab{flex:1;text-align:left;background:none;border:0;border-right:1px solid rgba(255,255,255,.12);padding:14px 20px 16px;cursor:pointer;color:#7d857f;display:flex;flex-direction:column;gap:8px;transition:color .3s ease}
.hero-tab:last-child{border-right:0}
.hero-tab-num{font:800 11px Montserrat;letter-spacing:.08em}
.hero-tab-label{font-size:13px;font-weight:700}
.hero-tab.is-active,.hero-tab:hover{color:#fff}
.hero-tab-bar{position:relative;height:2px;background:rgba(255,255,255,.12);border-radius:2px;overflow:hidden}
.hero-tab-bar i{position:absolute;inset:0;width:0;background:var(--green);border-radius:2px}
.hero-tab.is-active .hero-tab-bar i{width:100%}
.hero-tab.is-active.is-filling .hero-tab-bar i{width:0;animation:heroFill 6.5s linear forwards}
.hero.is-paused .hero-tab-bar i{animation-play-state:paused}
@keyframes heroFill{to{width:100%}}
@media(prefers-reduced-motion:reduce){.hero-slide .hero-copy>*,.hero-slide .hero-visual{animation:none;opacity:1;transform:none}.aurora{animation:none}.hero-tab.is-active.is-filling .hero-tab-bar i{animation:none;width:100%}}

/* Hero — cartão visual: glow de profundidade, tilt 3D (via script.js) e badge giratório.
   Painel abstrato "linhas + glow verde" nos slides sem fotografia (mantém a identidade já
   usada no site, evitando fotos genéricas de estoque). */
.hero-visual-glow{position:absolute;inset:-40px;border-radius:200px;background:radial-gradient(circle at 60% 30%,rgba(0,175,0,.38),transparent 65%);filter:blur(55px);z-index:0;opacity:.85}
.photo-frame{z-index:1;transition:transform .15s ease-out}
.hero-panel{display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 22%,rgba(0,175,0,.18),transparent 55%),linear-gradient(150deg,#151b16,#0a0d0b)}
.hero-panel:before{content:"";position:absolute;inset:0;opacity:.55;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(circle at 50% 40%,black,transparent 72%)}
.hero-panel-icon{position:relative;z-index:1;width:100px;height:100px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(0,175,0,.18),transparent 70%);border:1px solid rgba(0,175,0,.32)}
.hero-panel-icon svg{width:46px;height:46px;fill:none;stroke:var(--green);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 24px rgba(0,175,0,.45))}
.hero-spin{position:absolute;top:-46px;right:-46px;z-index:2;width:96px;height:96px;color:rgba(255,255,255,.8);animation:heroSpin 16s linear infinite}
.hero-spin text{fill:currentColor}
.hero-spin__dot{position:absolute;inset:0;margin:auto;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 16px rgba(0,175,0,.7);animation:heroDotPulse 2.4s ease-in-out infinite alternate}
@keyframes heroSpin{to{transform:rotate(360deg)}}
@keyframes heroDotPulse{from{opacity:.7;transform:scale(.9)}to{opacity:1;transform:scale(1.15)}}
@media(prefers-reduced-motion:reduce){.hero-spin{animation:none}.hero-spin__dot{animation:none}}

/* Ícones — profundidade, gradiente e microinteração no hover (unifica path-card,
   subsection-card e feature-list no mesmo padrão visual do service-card) */
.path-card .icon,.feature-list .icon,.subsection-card .icon{border:0;background:linear-gradient(145deg,#fff,#edf3ed);box-shadow:inset 0 0 0 1px rgba(20,40,24,.08),0 8px 20px rgba(14,45,19,.1);transition:.3s cubic-bezier(.22,1,.36,1)}
.path-card .icon{width:58px;height:58px;border-radius:16px}
.path-card .icon svg{width:27px;height:27px}
.subsection-card .icon{width:46px;height:46px;border-radius:13px}
.subsection-card .icon svg{width:22px;height:22px}
.feature-list .icon{width:38px;height:38px;border-radius:11px}
.feature-list .icon svg{width:18px;height:18px}
.path-card .icon svg,.subsection-card .icon svg,.feature-list .icon svg{transition:.3s}
.path-card:hover .icon,.subsection-card:hover .icon,.service-card:hover .icon{background:linear-gradient(145deg,var(--green),var(--green-dark));box-shadow:0 12px 28px rgba(0,175,0,.32);transform:translateY(-3px) rotate(-4deg)}
.path-card:hover .icon svg,.subsection-card:hover .icon svg,.service-card:hover .icon svg{stroke:#fff}
.service-card .icon,.service-card .icon svg{transition:.3s cubic-bezier(.22,1,.36,1)}
.subsection-card{transition:.3s cubic-bezier(.22,1,.36,1)}
.subsection-card:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(18,36,22,.1);border-color:#b5c1b6}

/* Revelação escalonada — os cards de uma mesma grade entram em sequência, não juntos */
.paths-grid.reveal .path-card,.subsection-grid.reveal .subsection-card{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.paths-grid.reveal.visible .path-card,.subsection-grid.reveal.visible .subsection-card{opacity:1;transform:none}
.paths-grid .path-card:nth-child(2){transition-delay:.08s}
.paths-grid .path-card:nth-child(3){transition-delay:.16s}
.subsection-grid .subsection-card:nth-child(2){transition-delay:.05s}
.subsection-grid .subsection-card:nth-child(3){transition-delay:.1s}
.subsection-grid .subsection-card:nth-child(4){transition-delay:.15s}
.subsection-grid .subsection-card:nth-child(5){transition-delay:.2s}
.subsection-grid .subsection-card:nth-child(6){transition-delay:.25s}
.subsection-grid .subsection-card:nth-child(7){transition-delay:.3s}
.subsection-grid .subsection-card:nth-child(8){transition-delay:.35s}
.subsection-grid .subsection-card:nth-child(9){transition-delay:.4s}
.subsection-grid .subsection-card:nth-child(10){transition-delay:.45s}
.service-grid .service-card:nth-child(2){transition-delay:.06s}
.service-grid .service-card:nth-child(3){transition-delay:.12s}
.service-grid .service-card:nth-child(4){transition-delay:.18s}
.service-grid .service-card:nth-child(5){transition-delay:.24s}
.service-grid .service-card:nth-child(6){transition-delay:.3s}
.why-grid .why-item:nth-child(2){transition-delay:.08s}
.why-grid .why-item:nth-child(3){transition-delay:.16s}
.why-grid .why-item:nth-child(4){transition-delay:.24s}
@media(prefers-reduced-motion:reduce){.paths-grid.reveal .path-card,.subsection-grid.reveal .subsection-card{transition-delay:0s!important}}

/* Botões — brilho sutil que percorre o botão no hover */
.button{position:relative;overflow:hidden}
.button:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-130%);transition:transform .6s ease}
.button:hover:before{transform:translateX(130%)}
.button-ghost:before{background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.2) 50%,transparent 70%)}
.button-dark:before{background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%)}
@media(prefers-reduced-motion:reduce){.button:before{display:none}}

/* Botão flutuante do WhatsApp — anel de pulso sutil para chamar atenção sem exagero */
.whatsapp{position:fixed}
.whatsapp:after{content:"";position:absolute;inset:0;border-radius:30px;border:2px solid var(--green);opacity:.55;animation:waPulse 2.6s ease-out infinite;pointer-events:none}
@keyframes waPulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.4);opacity:0}}
@media(prefers-reduced-motion:reduce){.whatsapp:after{display:none}}

/* Parallax — elementos decorativos movidos via script.js (respeita prefers-reduced-motion) */
[data-parallax]{will-change:transform}

/* Fotos da fachada — a foto é vertical (prédio estreito) e os cartões são mais largos que
   altos, então "cover" cortava o topo (fachada/letreiro) ou a base (mural do M3). Agora cada
   cartão mostra a foto INTEIRA (object-fit:contain) sobre uma cópia da mesma foto desfocada
   preenchendo as bordas — nada de crop, nada de tarja vazia. */
.photo-frame,.local-photo,.page-photo{position:relative;overflow:hidden}
.local-photo{height:460px;border-radius:16px}
.page-photo{height:280px}
img.photo-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:blur(36px) brightness(.8) saturate(1.7);transform:scale(1.35)}
img.photo-main{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center}
.local-photo img.photo-main{filter:saturate(.96) contrast(1.02)}
.photo-shade{z-index:2}
.local-badge{z-index:3}
.since{z-index:2}
@media(max-width:1050px){.local-photo{height:420px}}
@media(max-width:760px){.local-photo{height:340px}.page-photo{height:220px}}

/* Faixa de marcas — equipamentos e periféricos das marcas presentes na loja física da M3
   (mesmas marcas visíveis nos adesivos da vitrine, ver assets/fachada-m3.jpg), em looping
   contínuo suave. Pausa com prefers-reduced-motion. */
.brands{background:#0a0c0b;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;overflow:hidden}
.brands-inner{display:flex;align-items:center;gap:32px}
.brands-label{flex:0 0 auto;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6d766f;white-space:nowrap}
.brands-track{flex:1;min-width:0;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.brands-marquee{display:flex;width:max-content;animation:brandsScroll 24s linear infinite}
.brands-row{display:flex;gap:52px;padding-right:52px;flex-shrink:0}
.brands-row span{font:800 19px Montserrat;letter-spacing:-.02em;color:#828b84;white-space:nowrap;transition:color .3s ease}
.brands-row span:hover{color:#fff}
@keyframes brandsScroll{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.brands-marquee{animation:none}.brands-track{overflow-x:auto}}
@media(max-width:760px){.brands-label{display:none}}

/* ======================================================================
   REDESIGN 2026.2 — identidade "engenharia/tech": tipografia mono nos
   rótulos técnicos, cantos de mira (HUD) nos cards, títulos com glow
   consistente, textura de grade nas seções escuras, números que contam.
   ====================================================================== */

/* Tipografia mono nos rótulos/tags — o mesmo tratamento usado em datasheets e
   dashboards técnicos, aplicado a todo texto pequeno em versalete do site. */
.eyebrow,.content-kicker,.hero-tab-num,.service-card i,.path-card__label,
.local-badge small,.since small,.address small,.cta span,.footer h4,
.breadcrumbs,.brands-label,.cross-card small,.utility,.footer-bottom,
.contact-card span,.hero-dot,.faq-intro .eyebrow{font-family:var(--mono)}
.eyebrow,.content-kicker{letter-spacing:.12em}
.content-kicker{position:relative}
.content-kicker:after{content:"_";margin-left:2px;color:var(--green);animation:cursorBlink 1.1s steps(1) infinite}
@keyframes cursorBlink{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.content-kicker:after{animation:none}}

/* Glow de gradiente nos títulos — antes só o hero tinha; agora todo <em> de
   H2 do site ganha o mesmo tratamento, para a identidade ficar coesa. */
.section h2 em{background:linear-gradient(90deg,#39ff6a,var(--green) 55%,#00c853);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 16px rgba(0,175,0,.25))}
.why .section h2 em,.faq .section h2 em{filter:drop-shadow(0 2px 10px rgba(0,175,0,.18))}

/* Cantos de mira (HUD) — aparecem no hover como um "target lock", reforçando
   a linguagem técnica sem cair em neon/cyberpunk (ver briefing de marca). */
.service-card,.path-card,.subsection-card{position:relative}
.service-card:before,.service-card:after,.path-card:before,.path-card:after,.subsection-card:before,.subsection-card:after{content:"";position:absolute;width:14px;height:14px;border-color:var(--green);opacity:0;transition:opacity .3s ease,transform .3s ease;pointer-events:none}
.service-card:before,.path-card:before,.subsection-card:before{top:9px;left:9px;border-width:2px 0 0 2px;border-style:solid;transform:translate(5px,5px)}
.service-card:after,.path-card:after,.subsection-card:after{bottom:9px;right:9px;border-width:0 2px 2px 0;border-style:solid;transform:translate(-5px,-5px)}
.service-card:hover:before,.service-card:hover:after,.path-card:hover:before,.path-card:hover:after,.subsection-card:hover:before,.subsection-card:hover:after{opacity:1;transform:translate(0,0)}
.service-card.featured:before,.service-card.featured:after{border-color:var(--green)}

/* Textura de grade — estende o padrão "blueprint" do hero para as demais
   seções escuras, para a identidade técnica ficar coesa no site inteiro. */
.corporate:before,.local:before{content:"";position:absolute;inset:0;opacity:.12;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(circle at 30% 20%,black,transparent 70%)}
.corporate,.local{position:relative}
.corporate .container,.local .container{position:relative;z-index:1}

/* Números que sobem — animados via script.js quando entram na tela. */
.why-item span[data-count]{font-variant-numeric:tabular-nums}

@media(max-width:1050px){.hero-panel-icon{width:104px;height:104px}.hero-panel-icon svg{width:50px;height:50px}.hero-spin{width:92px;height:92px;top:-44px;right:-30px}.hero-tab-label{font-size:12px}}
@media(max-width:760px){.hero-panel-icon{width:84px;height:84px}.hero-panel-icon svg{width:40px;height:40px}}