:root{
  --bg:#03050a;
  --bg-soft:#07101d;
  --card:#0b111c;
  --card-2:#111827;
  --text:#f6f8ff;
  --muted:#b9c2d6;
  --muted-2:#7d8aa4;
  --red:#ff3b4d;
  --red-2:#ff5a68;
  --red-dark:#7d050b;
  --purple:#7b3cff;
  --purple-2:#a56cff;
  --gray-accent:#9aa0b3;
  --blue:#4b5cff;
  --blue-2:#7aa2ff;
  --blue-dark:#161735;
  --line:rgba(255,255,255,.12);
  --shadow:0 24px 70px rgba(0,0,0,.45);
  --radius:28px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Manrope", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,59,77,.16), transparent 28%),
    radial-gradient(circle at 86% 8%, rgba(123,60,255,.18), transparent 34%),
    radial-gradient(circle at 50% 96%, rgba(154,160,179,.08), transparent 35%),
    linear-gradient(135deg,#020307 0%,#08070f 32%,#12121a 62%,#030407 100%);
  color:var(--text);
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul{padding:0;margin:0;list-style:none}
.container{width:min(var(--max), calc(100% - 40px));margin:0 auto}
.section{padding:82px 0}
.page-glow{position:fixed;pointer-events:none;z-index:-1;filter:blur(40px);opacity:.55}
.page-glow-left{width:340px;height:340px;left:-140px;top:140px;background:rgba(22,109,255,.22);border-radius:50%}
.page-glow-right{width:420px;height:420px;right:-190px;top:420px;background:rgba(255,38,56,.16);border-radius:50%}
.header{
  position:sticky;top:0;z-index:100;
  backdrop-filter:blur(18px);
  background:rgba(3,5,10,.82);
  border-bottom:1px solid var(--line);
}
.nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand,.footer-brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:-.04em;font-size:1.25rem}
.brand img,.footer-brand img{width:42px;height:42px;object-fit:contain}
.brand span span,.footer-brand span span{color:var(--red-2)}
.nav-links{display:flex;align-items:center;gap:26px;color:#e6e7ec;font-weight:700;font-size:.94rem}
.nav-links a:not(.nav-cta){opacity:.78;transition:.2s}
.nav-links a:hover{opacity:1;color:#fff}
.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:800;transition:.25s ease;border:1px solid transparent;cursor:pointer}
.nav-cta{padding:11px 18px;background:#fff;color:#09090b}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(255,255,255,.14)}
.nav-toggle{display:none;width:46px;height:46px;border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:15px;padding:10px}
.nav-toggle span{display:block;height:2px;background:#fff;margin:6px 0;border-radius:10px}
.hero{padding:58px 0 44px;min-height:calc(100svh - 72px);display:flex;align-items:center;position:relative}
.hero:before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:.25;
  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:64px 64px;
  mask-image:linear-gradient(180deg,#000,transparent 72%);
}
.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:40px;align-items:center}
.eyebrow{margin:0 0 14px;color:var(--red-2);font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem}
h1,h2,h3,p{margin-top:0}
h1{font-family:"Manrope", ui-sans-serif, system-ui, sans-serif;font-size:clamp(2.35rem,5.25vw,4.65rem);line-height:.98;letter-spacing:-.052em;font-weight:800;margin-bottom:18px;max-width:890px}
h1:after{content:"";display:block;width:96px;height:4px;background:linear-gradient(90deg,var(--blue),var(--red),transparent);border-radius:10px;margin-top:18px}
h2,h3,.brand,.footer-brand,.nav-links,.btn,.tab,.badge,.price-card strong,.score-card strong,.mini-card strong{font-family:"Manrope", ui-sans-serif, system-ui, sans-serif}

.hero-text{font-size:1.08rem;line-height:1.62;color:var(--muted);max-width:680px;margin-bottom:22px}
.hero-actions,.demo-actions,.contact-actions{display:flex;gap:14px;flex-wrap:wrap}
.btn{padding:13px 22px;font-size:.95rem}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--red-2));color:#fff;box-shadow:0 18px 44px rgba(22,109,255,.22)}
.btn-primary:hover,.btn-card:hover{transform:translateY(-3px);box-shadow:0 22px 60px rgba(22,109,255,.34)}
.btn-secondary{border-color:var(--line);background:rgba(255,255,255,.04);color:#fff}
.btn-secondary:hover{background:rgba(255,255,255,.08);transform:translateY(-3px)}
.hero-proof{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;color:var(--muted);font-size:.86rem}
.hero-proof span{padding:11px 14px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:999px}
.hero-proof strong{color:#fff}
.hero-panel{background:linear-gradient(135deg, rgba(255,59,77,.12) 0%, rgba(123,60,255,.12) 38%, rgba(154,160,179,.10) 68%, rgba(0,0,0,.48) 100%);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero-panel:before{content:"";position:absolute;inset:-1px;background:radial-gradient(circle at 78% 0%,rgba(123,60,255,.26),transparent 40%), radial-gradient(circle at 20% 100%,rgba(255,59,77,.18),transparent 42%), linear-gradient(180deg,rgba(255,255,255,.04),transparent 40%);pointer-events:none}
.panel-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:.9rem;margin-bottom:20px;position:relative;z-index:1}
.status-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#29ff87;box-shadow:0 0 20px rgba(41,255,135,.7);margin-right:8px}
.dashboard-card,.mini-card{position:relative;z-index:1;border:1px solid var(--line);background:rgba(4,4,6,.52);border-radius:22px;padding:18px}
.score-card{min-height:150px;display:flex;flex-direction:column;justify-content:center}
.score-card span,.mini-card span{color:var(--muted-2);font-weight:700;text-transform:uppercase;font-size:.76rem;letter-spacing:.1em}
.score-card strong{font-size:4.15rem;letter-spacing:-.08em;line-height:1;color:#fff}
.score-card small,.mini-card small{color:var(--muted)}
.panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.mini-card strong{display:block;font-size:1.78rem;margin:5px 0;color:#fff}
.activity-list{position:relative;z-index:1;margin-top:14px;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:22px;padding:13px 16px}
.activity-list p{margin:8px 0;color:var(--muted);font-size:.91rem}.activity-list span{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--red-2);margin-right:10px}
.intro-strip{padding:48px 0;background:linear-gradient(90deg,rgba(22,109,255,.14),rgba(255,38,56,.09),rgba(255,255,255,.02));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.strip-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;align-items:center}
.strip-grid h2,.section-heading h2{font-family:"Manrope", ui-sans-serif, system-ui, sans-serif;font-size:clamp(2rem,4vw,3.45rem);line-height:1.04;letter-spacing:-.045em;font-weight:800;margin-bottom:14px}
.strip-grid p,.section-heading p{color:var(--muted);line-height:1.7;font-size:1.05rem}
.section-heading{max-width:780px;margin-bottom:38px}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.service-card,.price-card,.step,.support-box,.demo-terminal,.contact-card{border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));border-radius:var(--radius);box-shadow:0 18px 55px rgba(0,0,0,.22)}
.service-card{padding:26px;min-height:410px;display:flex;flex-direction:column}
.icon{width:56px;height:56px;border-radius:18px;background:linear-gradient(135deg,rgba(22,109,255,.18),rgba(255,38,56,.12));border:1px solid rgba(22,109,255,.36);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;letter-spacing:-.05em;margin-bottom:22px}
.service-card h3{font-size:1.25rem;letter-spacing:-.03em}.service-card p{color:var(--muted);line-height:1.6}.service-card ul{margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}
.service-card li{padding:8px 0;color:#e5e6ec}.service-card li:before{content:"✓";color:var(--red-2);font-weight:900;margin-right:8px}
.process-section{background:rgba(255,255,255,.025)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step{padding:24px}.step span{display:inline-block;color:var(--red-2);font-weight:900;margin-bottom:20px}.step h3{font-size:1.16rem}.step p{color:var(--muted);line-height:1.55}
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}.tab{border:1px solid var(--line);background:rgba(255,255,255,.05);color:#fff;padding:12px 16px;border-radius:999px;font-weight:800;cursor:pointer;transition:.2s}.tab.active,.tab:hover{background:#fff;color:#070707}
.plan-panel{display:none}.plan-panel.active{display:block}.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.pricing-grid.compact{grid-template-columns:repeat(3,1fr)}
.price-card{padding:24px;display:flex;flex-direction:column;min-height:420px;position:relative;overflow:hidden}.price-card.featured{border-color:rgba(22,109,255,.65);box-shadow:0 24px 70px rgba(22,109,255,.16)}.price-card.featured:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 0%,rgba(22,109,255,.22),transparent 42%),radial-gradient(circle at 20% 90%,rgba(255,38,56,.12),transparent 44%);pointer-events:none}.badge{width:max-content;padding:8px 10px;border-radius:999px;background:linear-gradient(135deg,rgba(22,109,255,.16),rgba(255,38,56,.12));border:1px solid rgba(22,109,255,.34);color:#fff;font-weight:900;font-size:.78rem;text-transform:uppercase;margin-bottom:18px}.price-card h3{font-size:1.2rem}.price-card strong{display:block;font-size:2rem;letter-spacing:-.05em;margin-bottom:12px}.price-card small{font-size:.95rem;color:var(--muted)}.price-card p{color:var(--muted);line-height:1.55}.price-card ul{margin:18px 0 24px}.price-card li{padding:8px 0;color:#e8e9ee}.price-card li:before{content:"•";color:var(--red-2);font-size:1.35rem;vertical-align:middle;margin-right:8px}.btn-card{margin-top:auto;background:#fff;color:#08080a}
.support-box{margin-top:28px;padding:30px;display:grid;grid-template-columns:.8fr 1.2fr;gap:24px;align-items:center}.support-box p:last-child{color:var(--muted);line-height:1.7;margin:0}.support-box h2{font-family:"Manrope", ui-sans-serif, system-ui, sans-serif;font-size:2rem;letter-spacing:-.04em;font-weight:800;margin:0}
.demo-section{background:linear-gradient(180deg,rgba(22,109,255,.08),rgba(255,38,56,.04),transparent)}.demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}.demo-grid h2{font-family:"Manrope", ui-sans-serif, system-ui, sans-serif;font-size:clamp(2rem,4vw,3.65rem);line-height:1.04;letter-spacing:-.045em;font-weight:800}.demo-grid p{color:var(--muted);line-height:1.7}.demo-terminal{padding:0;overflow:hidden;background:#090a0d}.terminal-top{height:44px;background:#14151b;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 16px}.terminal-top span{width:11px;height:11px;border-radius:50%;background:var(--red)}.terminal-top span:nth-child(2){background:#ffbd2e}.terminal-top span:nth-child(3){background:#27c93f}pre{margin:0;padding:24px;color:#e8e8e8;white-space:pre-wrap;line-height:1.8;font-family:"Cascadia Code","Fira Code",Consolas,monospace;font-size:.95rem}
.contact-section{padding-top:36px}.contact-card{padding:36px;display:flex;align-items:center;justify-content:space-between;gap:26px;background:linear-gradient(135deg,rgba(22,109,255,.24),rgba(255,38,56,.14),rgba(255,255,255,.05))}.contact-card h2{font-family:"Manrope", ui-sans-serif, system-ui, sans-serif;font-size:clamp(2rem,4vw,3.1rem);letter-spacing:-.045em;font-weight:800;margin-bottom:12px}.contact-card p{color:var(--muted);max-width:680px;line-height:1.6}
.footer{border-top:1px solid var(--line);padding:30px 0;background:#050506}.footer-grid{display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:.95rem}.footer a{color:#fff;font-weight:800}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease, transform .65s ease}.reveal.visible{opacity:1;transform:none}
@media (max-width:1050px){.hero-grid,.strip-grid,.demo-grid,.support-box{grid-template-columns:1fr}.service-grid,.pricing-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.pricing-grid.compact{grid-template-columns:repeat(2,1fr)}.contact-card{flex-direction:column;align-items:flex-start}}
@media (max-width:820px){.nav-toggle{display:block}.nav-links{position:absolute;left:20px;right:20px;top:86px;display:none;flex-direction:column;align-items:stretch;padding:18px;background:rgba(10,10,13,.96);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.nav-links.open{display:flex}.nav-links a{padding:10px 4px}.nav-cta{text-align:center}.hero{padding-top:56px}.section{padding:66px 0}.service-grid,.pricing-grid,.pricing-grid.compact,.steps,.panel-grid{grid-template-columns:1fr}.footer-grid{flex-direction:column;text-align:center}.score-card strong{font-size:4rem}.contact-actions,.hero-actions,.demo-actions{width:100%}.btn{width:100%}}
@media (max-width:520px){.container{width:min(100% - 28px,var(--max))}.nav{height:70px}.brand span,.footer-brand span{font-size:1.05rem}h1{font-size:3rem}.hero-proof{display:none}.service-card,.price-card,.support-box,.contact-card{border-radius:22px;padding:20px}.tabs{overflow:auto;flex-wrap:nowrap;padding-bottom:4px}.tab{white-space:nowrap}.section-heading h2,.strip-grid h2{font-size:2.1rem}}


/* Ajuste de primeira dobra: hero mais compacto para caber em telas Full HD sem zoom-out. */
@media (min-width: 1060px) and (max-height: 900px){
  .hero{padding:42px 0 34px;min-height:auto;}
  .hero-grid{gap:34px;}
  .eyebrow{margin-bottom:10px;}
  h1{font-size:clamp(2.3rem,4.8vw,4.25rem);margin-bottom:16px;}
  h1:after{margin-top:16px;}
  .hero-text{font-size:1.02rem;line-height:1.55;margin-bottom:18px;}
  .hero-proof{margin-top:18px;}
  .hero-panel{padding:18px;border-radius:24px;}
  .panel-top{margin-bottom:14px;}
  .score-card{min-height:132px;}
  .score-card strong{font-size:3.7rem;}
  .mini-card strong{font-size:1.55rem;}
  .activity-list{padding:10px 14px;}
  .activity-list p{margin:7px 0;font-size:.88rem;}
}


/* Identidade visual azul + vermelho + preto */
.service-card, .price-card, .step, .support-box, .demo-terminal, .contact-card{
  background:linear-gradient(160deg, rgba(12,12,16,.88), rgba(48,24,62,.48), rgba(55,28,35,.42));
}
.header:after{
  content:"";display:block;height:1px;width:100%;
  background:linear-gradient(90deg, transparent, rgba(255,59,77,.55), rgba(123,60,255,.55), rgba(154,160,179,.35), transparent);
}
.eyebrow{
  background:linear-gradient(90deg,var(--red-2),var(--purple-2),var(--gray-accent));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.nav-cta:hover{box-shadow:0 14px 34px rgba(22,109,255,.18)}
.btn-secondary{background:linear-gradient(135deg,rgba(22,109,255,.10),rgba(255,38,56,.06));}
.tab.active,.tab:hover{background:linear-gradient(135deg,var(--red),var(--purple),#3b3f48);color:#fff;}
.status-dot{background:var(--blue-2);box-shadow:0 0 20px rgba(0,183,255,.72)}
.activity-list span{background:linear-gradient(135deg,var(--red-2),var(--purple-2),var(--gray-accent));}
.service-card li:before,.price-card li:before{color:var(--blue-2)}
.step span,.brand span span,.footer-brand span span{color:var(--red-2)}
.icon{color:#fff;box-shadow:inset 0 0 22px rgba(0,183,255,.08)}


.marketing-card strong{font-size:3.25rem;letter-spacing:-.06em;}
.marketing-card small{font-size:.98rem;line-height:1.55;max-width:94%;}
.marketing-grid .marketing-mini strong{font-size:1.9rem;}
.marketing-list{background:linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.03));}
.marketing-list p{line-height:1.5;}

/* Reforço do gradiente principal do container de marketing */
.hero-panel{background:linear-gradient(135deg, rgba(255,59,77,.12) 0%, rgba(123,60,255,.12) 38%, rgba(154,160,179,.10) 68%, rgba(0,0,0,.48) 100%) !important;}


/* ===== Tema claro branco + vermelho + preto ===== */
:root{
  --bg:#ffffff;
  --bg-soft:#f6f7fb;
  --card:#ffffff;
  --card-2:#fbfbfd;
  --text:#121212;
  --muted:#525866;
  --muted-2:#7f8797;
  --line:rgba(15,15,15,.08);
  --shadow:0 20px 50px rgba(17,17,17,.08);
}
body{
  background:linear-gradient(180deg,#ffffff 0%,#fafafa 100%);
  color:var(--text);
}
.page-glow-left{background:rgba(255,59,77,.10)}
.page-glow-right{background:rgba(0,0,0,.06)}
.header{background:rgba(255,255,255,.92); border-bottom:1px solid rgba(15,15,15,.07)}
.nav-links{color:#191919}
.nav-links a:not(.nav-cta){opacity:.8}
.nav-links a:hover{color:#c61f32}
.nav-cta{background:#111111;color:#fff}
.nav-cta:hover{box-shadow:0 14px 34px rgba(17,17,17,.16)}
.brand,.footer-brand{font-size:0}
.brand-wordmark{width:172px;height:auto;display:block}
.brand img,.footer-brand img{width:auto;height:auto;object-fit:contain}
.hero:before{opacity:.10; background-image:linear-gradient(rgba(17,17,17,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(17,17,17,.05) 1px, transparent 1px)}
.eyebrow{-webkit-text-fill-color:initial;color:#c61f32 !important;background:none !important}
h1,h2,h3,.strip-grid h2,.section-heading h2,.demo-grid h2,.contact-card h2,.support-box h2{color:#111111}
h1:after{background:linear-gradient(90deg,#d7263d,#111111,transparent)}
.hero-text,.strip-grid p,.section-heading p,.support-box p:last-child,.demo-grid p,.contact-card p,.service-card p,.step p,.price-card p,.activity-list p,.panel-top,.score-card small,.mini-card small{color:#5d6472}
.hero-proof span{background:#fff;border:1px solid rgba(15,15,15,.08); color:#5d6472}
.hero-proof strong{color:#111}
.btn-primary{background:linear-gradient(135deg,#d7263d,#111111); box-shadow:0 18px 40px rgba(215,38,61,.14)}
.btn-secondary{border-color:rgba(15,15,15,.10);background:#fff;color:#111}
.btn-secondary:hover{background:#f6f6f8}
.hero-panel,.service-card,.price-card,.step,.support-box,.demo-terminal,.contact-card{background:#fff !important; border:1px solid rgba(15,15,15,.08); box-shadow:0 16px 40px rgba(17,17,17,.06)}
.hero-panel:before{background:radial-gradient(circle at 90% 10%,rgba(215,38,61,.08),transparent 30%), radial-gradient(circle at 10% 90%,rgba(0,0,0,.04),transparent 34%) !important}
.status-dot{background:#16a34a; box-shadow:0 0 14px rgba(22,163,74,.3)}
.dashboard-card,.mini-card,.activity-list{background:#fcfcfd;border:1px solid rgba(15,15,15,.08)}
.score-card span,.mini-card span{color:#8a92a3}
.score-card strong,.mini-card strong,.marketing-card strong{color:#111}
.intro-strip{background:linear-gradient(90deg,rgba(215,38,61,.05),rgba(17,17,17,.035),rgba(255,255,255,.95)); border-top:1px solid rgba(15,15,15,.06); border-bottom:1px solid rgba(15,15,15,.06)}
.process-section,.demo-section{background:#fafafb}
.icon{background:linear-gradient(135deg,rgba(215,38,61,.10),rgba(17,17,17,.05)); border-color:rgba(215,38,61,.18); color:#111}
.service-card li,.price-card li{color:#1d1e22}
.service-card li:before,.price-card li:before{color:#d7263d}
.step span,.brand span span,.footer-brand span span{color:#d7263d}
.tab{background:#fff;color:#111;border-color:rgba(15,15,15,.08)}
.tab.active,.tab:hover{background:linear-gradient(135deg,#d7263d,#111111);color:#fff}
.price-card.featured{border-color:rgba(215,38,61,.32); box-shadow:0 24px 50px rgba(215,38,61,.10)}
.price-card.featured:before{background:radial-gradient(circle at 80% 0%,rgba(215,38,61,.10),transparent 42%),radial-gradient(circle at 20% 90%,rgba(17,17,17,.04),transparent 44%)}
.badge{background:linear-gradient(135deg,rgba(215,38,61,.08),rgba(17,17,17,.05));border:1px solid rgba(215,38,61,.18);color:#111}
.btn-card{background:#111;color:#fff}
.demo-terminal{background:#ffffff}
.terminal-top{background:#f5f5f7;border-bottom:1px solid rgba(15,15,15,.08)}
pre{color:#17181c}
.contact-card{background:linear-gradient(135deg,rgba(215,38,61,.05),rgba(17,17,17,.03),#fff) !important}
.footer{border-top:1px solid rgba(15,15,15,.08);background:#ffffff}
.footer-grid{color:#5d6472}.footer a{color:#111}
.nav-toggle{background:#fff;border:1px solid rgba(15,15,15,.1)}
.nav-toggle span{background:#111}
.feature-details{margin:10px 0 16px;border-top:1px solid rgba(15,15,15,.08);padding-top:12px}
.feature-details summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;font-weight:800;color:#111;padding:10px 0}
.feature-details summary::-webkit-details-marker{display:none}
.feature-details summary::after{content:'▾';font-size:1rem;transition:transform .2s ease;color:#d7263d}
.feature-details[open] summary::after{transform:rotate(180deg)}
.feature-details ul{margin:0 0 12px;padding:0;list-style:none}
.feature-details li{padding:8px 0 8px 18px;position:relative;color:#5d6472;line-height:1.55;border-bottom:1px dashed rgba(15,15,15,.06)}
.feature-details li::before{content:'•';position:absolute;left:4px;color:#d7263d;font-weight:900}
.details-ticket{display:inline-flex;align-items:center;gap:8px;color:#111;font-weight:800;text-decoration:none}
.details-ticket:hover{color:#d7263d}
@media (max-width:820px){.nav-links{background:#fff;border:1px solid rgba(15,15,15,.08)} .brand-wordmark{width:152px}}


/* ===== Atualização UI/UX: logo enviada + painel global de funcionalidades ===== */
.brand,
.footer-brand{
  display:flex !important;
  align-items:center;
  gap:10px;
  font-size:1.22rem !important;
  letter-spacing:-.04em;
}

.brand-logo-shell{
  width:44px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#111111;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(17,17,17,.10);
  border:1px solid rgba(255,255,255,.08);
  flex:0 0 auto;
}

.brand-logo-only{
  width:30px !important;
  height:30px !important;
  object-fit:contain !important;
  opacity:.98;
}

.brand-text{
  color:#111111;
  font-weight:900;
  letter-spacing:-.055em;
  line-height:1;
}

.brand-text span{color:#d7263d;}
.footer .brand-logo-shell{background:#111111;}
.footer .brand-text{color:#111111;}
.price-card{min-height:auto;}

.features-open{
  width:100%;
  margin:4px 0 16px;
  border:1px solid rgba(15,15,15,.10);
  background:#ffffff;
  color:#111111;
  border-radius:16px;
  padding:12px 14px;
  font-weight:900;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  transition:.22s ease;
}
.features-open::after{content:"▾";color:#d7263d;font-size:1rem;transition:transform .22s ease;}
.features-open[aria-expanded="true"]{background:#111111;color:#ffffff;border-color:#111111;}
.features-open[aria-expanded="true"]::after{transform:rotate(180deg);}
.features-open:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(17,17,17,.08);}

.feature-universe{
  margin-top:28px;
  border:1px solid rgba(15,15,15,.08);
  background:linear-gradient(180deg,#ffffff 0%,#fafafa 100%);
  border-radius:32px;
  padding:30px;
  box-shadow:0 22px 60px rgba(17,17,17,.08);
}
.feature-universe[hidden]{display:none !important;}
.feature-universe-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px;}
.feature-universe-head h2{margin-bottom:8px;font-size:clamp(1.8rem,3vw,2.7rem);letter-spacing:-.045em;}
.feature-universe-head p:not(.eyebrow){margin:0;color:#5d6472;max-width:760px;line-height:1.65;}
.features-close{border:1px solid rgba(15,15,15,.10);background:#111111;color:#ffffff;padding:11px 16px;border-radius:999px;cursor:pointer;font-weight:900;white-space:nowrap;}
.feature-universe-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:16px;}
.feature-universe-card{border:1px solid rgba(15,15,15,.08);background:#ffffff;border-radius:24px;padding:22px;box-shadow:0 14px 36px rgba(17,17,17,.05);}
.feature-universe-card h3{margin-bottom:6px;color:#111111;letter-spacing:-.03em;}
.feature-universe-card p{color:#5d6472;line-height:1.55;margin-bottom:14px;}
.feature-universe-card ul{display:grid;gap:9px;list-style:none;padding:0;margin:0;}
.feature-universe-card li{color:#333844;line-height:1.48;position:relative;padding-left:18px;font-size:.95rem;}
.feature-universe-card li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:#d7263d;}
.feature-universe-cta{margin-top:22px;padding-top:20px;border-top:1px solid rgba(15,15,15,.08);display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.feature-universe-cta span{color:#5d6472;font-weight:700;}
@media (max-width:900px){.feature-universe-grid{grid-template-columns:1fr;}.feature-universe-head{flex-direction:column;}.features-close{width:100%;}}
@media (max-width:520px){.brand-logo-shell{width:40px;height:34px;border-radius:11px;}.brand-logo-only{width:27px !important;height:27px !important;}.brand-text{font-size:1.08rem;}.feature-universe{padding:20px;border-radius:24px;}.feature-universe-card{padding:18px;border-radius:20px;}}


/* Logo transparente corrigida */
.brand-logo-only,.brand-wordmark,.brand img,.footer-brand img{background:transparent !important;}
.brand-logo-shell{background:#111111 !important;}


/* ===== Ajuste final: marca textual sem PNG ===== */
.brand,
.footer-brand{
  display:flex !important;
  align-items:center;
  gap:0;
  font-size:1.34rem !important;
  text-decoration:none;
}
.brand img,
.footer-brand img,
.brand-logo-shell,
.brand-logo-only,
.brand-wordmark{
  display:none !important;
}
.brand-text-only{
  color:#111111;
  font-weight:900;
  letter-spacing:-.055em;
  line-height:1;
}
.brand-text-only span{color:#d7263d;}
.footer .brand-text-only{color:#111111;}
.tab{font-size:.92rem;}
.icon{font-size:.78rem;}


/* ===== UI final: estrutura limpa, fonte corporativa/tech e vetores ===== */
:root{
  --font-body:"Sophos Sans","Aptos","Segoe UI",Arial,Helvetica,sans-serif;
  --font-display:"Sophos Sans","Aptos Display","Segoe UI",Arial,Helvetica,sans-serif;
  --red:#d7192d;
  --red-2:#ef3340;
  --black:#111111;
  --text:#111111;
  --muted:#515866;
  --muted-2:#7b8494;
  --line:rgba(17,17,17,.09);
  --shadow:0 18px 44px rgba(17,17,17,.07);
  --radius:26px;
}
body{
  font-family:var(--font-body) !important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfbfc 55%,#ffffff 100%) !important;
  color:var(--text) !important;
}
h1,h2,h3,.brand,.footer-brand,.nav-links,.btn,.tab,.badge,.price-card strong,.score-card strong,.mini-card strong{
  font-family:var(--font-display) !important;
}
.header{
  background:rgba(255,255,255,.94) !important;
  backdrop-filter:blur(14px) !important;
  border-bottom:1px solid rgba(17,17,17,.07) !important;
}
.header::after{
  content:"";display:block;height:2px;width:100%;
  background:linear-gradient(90deg,transparent,rgba(215,25,45,.55),rgba(17,17,17,.12),transparent);
}
.brand,.footer-brand{font-size:1.32rem !important;letter-spacing:-.035em !important;font-weight:700 !important;}
.brand img,.footer-brand img,.brand-logo-shell,.brand-logo-only,.brand-wordmark{display:none !important;}
.brand-text{font-weight:700 !important;letter-spacing:-.035em !important;color:#111 !important;}
.brand-text span{color:var(--red) !important;}
.nav-links{font-weight:600 !important;}
.nav-cta{background:#111 !important;color:#fff !important;font-weight:700 !important;}
.hero{padding:50px 0 46px !important;min-height:auto !important;}
.hero-grid{grid-template-columns:1.04fr .96fr !important;gap:46px !important;}
.eyebrow{
  color:var(--red) !important;background:none !important;-webkit-text-fill-color:initial !important;
  font-size:.76rem !important;letter-spacing:.115em !important;font-weight:800 !important;
}
h1{
  font-size:clamp(2.35rem,4.15vw,4.15rem) !important;
  line-height:1.07 !important;
  letter-spacing:-.04em !important;
  font-weight:650 !important;
  max-width:840px !important;
  animation:titleFluid 7.5s ease-in-out infinite;
}
h1:after{width:92px !important;height:3px !important;background:linear-gradient(90deg,var(--red),#111,transparent) !important;}
.hero-text{font-size:1.04rem !important;line-height:1.68 !important;color:#4f5665 !important;max-width:640px !important;}
.btn{font-weight:700 !important;}
.btn-primary{background:linear-gradient(135deg,var(--red),#111) !important;box-shadow:0 14px 34px rgba(215,25,45,.13) !important;}
.btn-secondary{background:#fff !important;border:1px solid rgba(17,17,17,.12) !important;color:#111 !important;}
.hero-panel,.service-card,.price-card,.step,.support-box,.demo-terminal,.contact-card,.feature-universe,.feature-universe-card{
  background:#fff !important;border:1px solid rgba(17,17,17,.08) !important;box-shadow:0 16px 42px rgba(17,17,17,.06) !important;
}
.hero-panel:before{background:radial-gradient(circle at 90% 0%,rgba(215,25,45,.08),transparent 34%),radial-gradient(circle at 4% 100%,rgba(17,17,17,.035),transparent 34%) !important;}
.dashboard-card,.mini-card,.activity-list{background:#fbfbfc !important;border:1px solid rgba(17,17,17,.08) !important;}
.score-card strong,.mini-card strong,.marketing-card strong{color:#111 !important;font-weight:650 !important;}
.score-card span,.mini-card span{color:#7b8494 !important;font-weight:700 !important;}
.intro-strip{background:linear-gradient(90deg,rgba(215,25,45,.05),rgba(17,17,17,.025),#fff) !important;}
.service-grid{gap:20px !important;}
.service-card{min-height:390px !important;padding:26px !important;}
.icon{
  width:60px !important;height:60px !important;border-radius:20px !important;
  background:linear-gradient(135deg,rgba(215,25,45,.09),rgba(17,17,17,.04)) !important;
  border:1px solid rgba(215,25,45,.18) !important;
  color:var(--red) !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  margin-bottom:22px !important;
}
.icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.icon-label{display:none !important;}
.service-card h3,.step h3,.price-card h3{font-weight:650 !important;letter-spacing:-.025em !important;}
.service-card p,.step p,.price-card p{color:#4f5665 !important;line-height:1.62 !important;}
.service-card li,.price-card li{color:#2b3039 !important;}
.service-card li:before,.price-card li:before{color:var(--red) !important;}
.step{position:relative;overflow:hidden;}
.step-icon{width:38px;height:38px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:rgba(215,25,45,.075);border:1px solid rgba(215,25,45,.12);color:var(--red);margin:-4px 0 18px;}
.step-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;}
.tab{font-weight:700 !important;background:#fff !important;color:#111 !important;border-color:rgba(17,17,17,.1) !important;}
.tab.active,.tab:hover{background:linear-gradient(135deg,var(--red),#111) !important;color:#fff !important;}
.badge{background:rgba(215,25,45,.07) !important;border:1px solid rgba(215,25,45,.14) !important;color:#111 !important;font-weight:700 !important;}
.price-card strong{font-weight:650 !important;}
.features-open{border-radius:14px !important;font-weight:700 !important;}
.features-open[aria-expanded="true"]{background:#111 !important;color:#fff !important;}
.feature-universe-card li::before{background:var(--red) !important;}
.feature-universe-head h2{font-weight:650 !important;}
.features-close{background:#111 !important;color:#fff !important;font-weight:700 !important;}
.terminal-top{background:#f4f5f7 !important;}
pre{font-family:"Cascadia Code","Consolas","SFMono-Regular",monospace !important;color:#17181c !important;}
@keyframes titleFluid{
  0%,100%{transform:translateY(0);opacity:1;}
  50%{transform:translateY(-5px);opacity:.965;}
}
@media (prefers-reduced-motion:reduce){h1{animation:none !important;}}
@media (min-width:1060px) and (max-height:900px){
  h1{font-size:clamp(2.25rem,3.75vw,3.9rem) !important;}
  .hero{padding:42px 0 34px !important;}
}
@media (max-width:1050px){.hero-grid{grid-template-columns:1fr !important;}.desktop-break{display:none !important;}}
@media (max-width:520px){h1{font-size:2.55rem !important;line-height:1.08 !important;}.hero{padding-top:36px !important;}.service-card{min-height:auto !important;}}

@import url("https://fonts.googleapis.com/css2?family=Electrolize&family=Exo+2:wght@300;400;500;600&family=Michroma&family=Orbitron:wght@400;500;600&family=Rajdhani:wght@300;400;500;600&family=Space+Mono:wght@400;700&display=swap");

:root{
  --font-body:"Exo 2","Rajdhani","Segoe UI",Arial,sans-serif;
  --font-display:"Orbitron","Michroma","Rajdhani","Segoe UI",Arial,sans-serif;
  --font-tech:"Electrolize","Rajdhani","Segoe UI",Arial,sans-serif;
  --font-mono:"Space Mono","Cascadia Code",Consolas,monospace;
}

/* Base geral */
body{
  font-family:var(--font-body) !important;
  font-weight:400 !important;
  letter-spacing:.005em;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Títulos principais */
h1,
h2,
h3,
.section-heading h2,
.strip-grid h2,
.demo-grid h2,
.contact-card h2,
.support-box h2,
.feature-universe-head h2{
  font-family:var(--font-display) !important;
  font-weight:500 !important;
  letter-spacing:-.025em !important;
  text-transform:none;
}

/* Hero principal */
h1{
  font-size:clamp(2.25rem,3.85vw,3.9rem) !important;
  line-height:1.14 !important;
  font-weight:500 !important;
  letter-spacing:-.035em !important;
  max-width:880px !important;
}

/* Subtítulos e textos */
p,
.hero-text,
.section-heading p,
.strip-grid p,
.service-card p,
.price-card p,
.step p,
.support-box p,
.demo-grid p,
.contact-card p,
.feature-universe-card p{
  font-family:var(--font-body) !important;
  font-weight:400 !important;
  letter-spacing:.006em;
}

/* Marca Silv4Code sem aparência pesada */
.brand,
.footer-brand,
.brand-text,
.brand-text-only,
.footer .brand-text,
.footer .brand-text-only{
  font-family:var(--font-display) !important;
  font-weight:500 !important;
  letter-spacing:.015em !important;
}

.brand-text span,
.brand-text-only span{
  font-weight:500 !important;
}

/* Menu, botões e elementos de ação */
.nav-links,
.nav-links a,
.nav-cta,
.btn,
.tab,
.badge,
.features-open,
.features-close,
.details-ticket{
  font-family:var(--font-tech) !important;
  font-weight:400 !important;
  letter-spacing:.045em !important;
}

/* Eyebrow / textos pequenos em destaque */
.eyebrow{
  font-family:var(--font-tech) !important;
  font-weight:400 !important;
  letter-spacing:.16em !important;
  font-size:.76rem !important;
  text-transform:uppercase !important;
}

/* Cards de serviço */
.service-card h3,
.step h3,
.price-card h3,
.feature-universe-card h3{
  font-family:var(--font-display) !important;
  font-weight:500 !important;
  letter-spacing:-.01em !important;
}

/* Lista dos cards */
.service-card li,
.price-card li,
.feature-universe-card li{
  font-family:var(--font-body) !important;
  font-weight:400 !important;
  letter-spacing:.006em;
}

/* Valores, métricas e números */
.price-card strong,
.score-card strong,
.mini-card strong,
.marketing-card strong{
  font-family:var(--font-display) !important;
  font-weight:500 !important;
  letter-spacing:-.025em !important;
}

/* Painel lateral do hero */
.panel-top,
.score-card span,
.mini-card span,
.activity-list p{
  font-family:var(--font-tech) !important;
  font-weight:400 !important;
  letter-spacing:.055em;
}

/* Terminal / código */
pre,
code,
.demo-terminal code{
  font-family:var(--font-mono) !important;
  font-weight:400 !important;
  letter-spacing:.01em;
}

/* Ajuste fino para manter o visual clean e futurista */
h2{
  font-size:clamp(1.9rem,3.45vw,3.15rem) !important;
  line-height:1.12 !important;
}

h3{
  line-height:1.22 !important;
}

.hero-text{
  font-size:1.02rem !important;
  line-height:1.72 !important;
}

.btn{
  text-transform:uppercase;
  font-size:.82rem !important;
}

.nav-links{
  font-size:.86rem !important;
}

.tab{
  font-size:.84rem !important;
}

.badge{
  font-size:.7rem !important;
}

/* Evita que a fonte futurista fique exageradamente grossa */
strong,
b{
  font-weight:500 !important;
}

/* Responsivo */
@media (max-width:820px){
  h1{
    font-size:clamp(2.15rem,9vw,3.15rem) !important;
    line-height:1.12 !important;
  }

  .nav-links{
    font-size:.9rem !important;
  }
}

@media (max-width:520px){
  h1{
    font-size:2.45rem !important;
    line-height:1.13 !important;
    letter-spacing:-.025em !important;
  }

  h2{
    font-size:2rem !important;
  }

  .brand,
  .footer-brand,
  .brand-text,
  .brand-text-only{
    font-size:1.02rem !important;
    letter-spacing:.01em !important;
  }
}
/* Card adicional S4Security na vitrine */
.service-grid:has(.service-card:nth-child(5)){
  grid-template-columns:repeat(5,minmax(0,1fr));
}
@media (max-width:1180px){
  .service-grid:has(.service-card:nth-child(5)){grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:680px){
  .service-grid:has(.service-card:nth-child(5)){grid-template-columns:1fr;}
}
/* Ajuste responsivo estável para a vitrine com S4Security */
.service-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important;}


/* ===== Sincronização de fonte: site principal com /s4security ===== */
:root{
  --s4sec-type-body:"Exo 2","Rajdhani","Segoe UI",Arial,sans-serif;
  --s4sec-type-display:"Orbitron","Michroma","Rajdhani","Segoe UI",Arial,sans-serif;
  --s4sec-type-ui:"Electrolize","Rajdhani","Segoe UI",Arial,sans-serif;
  --s4sec-type-mono:"Space Mono","Cascadia Code",Consolas,monospace;
}
body,
.s4security-page{
  font-family:var(--s4sec-type-body) !important;
  font-weight:400 !important;
  letter-spacing:.004em;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
h1,
.s4sec-hero-copy h1{
  font-family:var(--s4sec-type-display) !important;
  font-weight:500 !important;
  letter-spacing:-.055em !important;
  line-height:1.06 !important;
}
h2,
h3,
.section-heading h2,
.strip-grid h2,
.demo-grid h2,
.contact-card h2,
.support-box h2,
.feature-universe-head h2,
.s4sec-demo-copy h2,
.s4sec-report-head h2{
  font-family:var(--s4sec-type-display) !important;
  font-weight:500 !important;
  letter-spacing:-.035em !important;
}
p,
.hero-text,
.section-heading p,
.strip-grid p,
.service-card p,
.price-card p,
.step p,
.support-box p,
.demo-grid p,
.contact-card p,
.feature-universe-card p,
.s4sec-lead,
.s4sec-pipeline p,
.s4sec-module-grid p,
.finding-card p{
  font-family:var(--s4sec-type-body) !important;
  font-weight:400 !important;
}
.brand,
.footer-brand,
.brand-text,
.brand-text-only,
.nav-links,
.nav-links a,
.nav-cta,
.btn,
.tab,
.badge,
.features-open,
.features-close,
.details-ticket,
.eyebrow,
.panel-top,
.score-card span,
.mini-card span,
.s4sec-live-head span,
.severity,
.finding-source{
  font-family:var(--s4sec-type-ui) !important;
  font-weight:400 !important;
}
.brand-text,
.brand-text-only{
  letter-spacing:.018em !important;
  font-weight:500 !important;
}
strong,b{
  font-weight:500 !important;
}
pre,code,.demo-terminal code{
  font-family:var(--s4sec-type-mono) !important;
}
.s4sec-flowline{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 18px;
  padding:12px 14px;
  border:1px solid rgba(15,15,15,.08);
  border-radius:16px;
  background:#fff;
  color:#111;
  box-shadow:0 12px 28px rgba(17,17,17,.04);
}
.s4sec-flowline span{
  font-family:var(--s4sec-type-ui) !important;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:500;
}
.s4sec-flowline b{
  color:#d7263d;
}
@media (max-width:620px){
  .s4sec-flowline{align-items:flex-start;flex-direction:column;gap:8px;}
  .s4sec-flowline b{display:none;}
}


/* ===== Ajustes comerciais S4Security integrado aos Websites ===== */
.service-card.s4security-card{
  border-color:rgba(215,25,45,.20) !important;
  background:linear-gradient(180deg,#ffffff 0%,#fff8f9 100%) !important;
}
.service-card.s4security-card .icon{
  background:linear-gradient(135deg,rgba(215,25,45,.12),rgba(17,17,17,.04)) !important;
  box-shadow:0 14px 30px rgba(215,25,45,.08) !important;
}
.service-note{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid rgba(17,17,17,.08);
  font-size:.92rem;
  line-height:1.56 !important;
  color:#4f5665 !important;
}
.website-security-note{
  margin-top:18px;
  border:1px solid rgba(215,25,45,.18);
  background:linear-gradient(135deg,rgba(215,25,45,.06),rgba(17,17,17,.025),#ffffff);
  border-radius:22px;
  padding:18px 20px;
  color:#2b3039;
  line-height:1.6;
  box-shadow:0 14px 34px rgba(17,17,17,.05);
}
.website-security-note strong,
.hero-text strong,
.intro-strip strong,
.section-heading strong,
.service-card strong,
.support-box strong,
.demo-section strong,
.feature-universe-card strong{
  color:#111111 !important;
  font-weight:700 !important;
}
.price-card li strong{
  color:#111111 !important;
  font-weight:700 !important;
}


/* ===== Correção UI/UX S4Security integrada - 2026-06-27 ===== */
/* Baseado em princípios de hierarquia visual, cards agrupando conteúdo relacionado e grids responsivos. */

#servicos .section-heading .eyebrow{
  letter-spacing:.14em !important;
  color:#d7192d !important;
}

#servicos .section-heading p:not(.eyebrow){
  max-width:760px !important;
}

.service-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}

.service-card{
  min-height:360px !important;
  padding:28px !important;
  display:flex !important;
  flex-direction:column !important;
  border-radius:24px !important;
  overflow:hidden !important;
}

.service-card h3{
  font-size:1.08rem !important;
  line-height:1.22 !important;
  margin:0 0 12px !important;
}

.service-card p{
  font-size:.93rem !important;
  line-height:1.65 !important;
  margin:0 !important;
}

.service-card ul{
  list-style:none !important;
  padding:18px 0 0 !important;
  margin:auto 0 0 !important;
  border-top:1px solid rgba(15,15,15,.08) !important;
  display:grid !important;
  gap:8px !important;
}

.service-card li{
  font-size:.9rem !important;
  line-height:1.42 !important;
  padding:0 0 0 18px !important;
  position:relative !important;
}

.service-card li::before{
  content:'✓' !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  color:#d7192d !important;
  font-weight:900 !important;
  margin:0 !important;
}

/* O S4Security deixa de ser uma quinta coluna estreita e vira um banner funcional. */
.service-card.s4security-card{
  grid-column:1 / -1 !important;
  min-height:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
  gap:28px !important;
  align-items:center !important;
  padding:32px !important;
  background:
    radial-gradient(circle at 98% 10%,rgba(215,25,45,.08),transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#fff7f8 42%,#ffffff 100%) !important;
  border:1px solid rgba(215,25,45,.16) !important;
}

.s4security-card .icon{
  margin-bottom:16px !important;
}

.service-kicker{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin-bottom:10px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(215,25,45,.18);
  background:rgba(215,25,45,.06);
  color:#d7192d;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.s4security-card h3{
  font-size:clamp(1.8rem,3vw,2.55rem) !important;
  letter-spacing:-.04em !important;
  margin-bottom:12px !important;
}

.s4security-card p{
  max-width:720px !important;
  font-size:1rem !important;
  line-height:1.72 !important;
}

.s4security-card .service-note{
  margin-top:14px !important;
  color:#4f5665 !important;
}

.s4security-list{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}

.s4security-list li{
  background:#fff !important;
  border:1px solid rgba(15,15,15,.08) !important;
  border-radius:16px !important;
  padding:14px 16px 14px 42px !important;
  box-shadow:0 12px 28px rgba(17,17,17,.05) !important;
  color:#20242c !important;
  font-size:.94rem !important;
  line-height:1.5 !important;
}

.s4security-list li::before{
  left:16px !important;
  top:14px !important;
}

.s4security-list a{
  color:#d7192d !important;
  font-weight:700 !important;
  text-decoration:none !important;
}

/* Cards de preço: corrige o bug do strong dentro da lista virar preço gigante. */
.pricing-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(230px,1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}

.pricing-grid.compact{
  grid-template-columns:repeat(3,minmax(230px,1fr)) !important;
}

.price-card{
  min-height:0 !important;
  padding:28px !important;
  border-radius:24px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  overflow:hidden !important;
}

.price-card > strong{
  display:block !important;
  font-size:1.74rem !important;
  line-height:1.08 !important;
  margin:12px 0 12px !important;
  letter-spacing:-.035em !important;
}

.price-card p{
  font-size:.93rem !important;
  line-height:1.62 !important;
  margin:0 !important;
}

.price-card ul{
  list-style:none !important;
  padding:18px 0 0 !important;
  margin:20px 0 22px !important;
  display:grid !important;
  gap:10px !important;
  border-top:1px solid rgba(15,15,15,.08) !important;
}

.price-card li{
  color:#252a33 !important;
  font-size:.9rem !important;
  line-height:1.45 !important;
  padding:0 0 0 18px !important;
  position:relative !important;
}

.price-card li::before{
  content:'✓' !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  color:#d7192d !important;
  font-size:.95rem !important;
  line-height:1.45 !important;
  margin:0 !important;
}

.price-card ul li strong,
.price-card li strong,
.price-card .security-feature strong{
  display:inline !important;
  font-size:inherit !important;
  line-height:inherit !important;
  letter-spacing:inherit !important;
  margin:0 !important;
  font-family:inherit !important;
  font-weight:700 !important;
  color:#111 !important;
}

.price-card .security-feature span{
  display:grid !important;
  gap:2px !important;
}

.price-card .security-feature small{
  display:block !important;
  color:#5d6472 !important;
  font-size:.78rem !important;
  line-height:1.35 !important;
  margin-top:2px !important;
}

.price-card .features-open{
  margin-top:auto !important;
  min-height:46px !important;
}

.price-card .btn-card{
  margin-top:14px !important;
  min-height:46px !important;
  font-size:.76rem !important;
  letter-spacing:.05em !important;
}

.website-security-note{
  margin-top:22px !important;
  padding:18px 20px !important;
  border-radius:18px !important;
  border:1px solid rgba(215,25,45,.14) !important;
  background:linear-gradient(135deg,rgba(215,25,45,.06),rgba(17,17,17,.02)) !important;
  color:#333844 !important;
  line-height:1.58 !important;
  font-size:.96rem !important;
}

.website-security-note strong{
  color:#111 !important;
  font-weight:700 !important;
}

/* Melhor legibilidade do bloco "Ver todas as funcionalidades". */
.feature-universe{
  margin-top:30px !important;
}

.feature-universe-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

.feature-universe-card{
  overflow:hidden !important;
}

.feature-universe-card li strong{
  font-size:inherit !important;
  display:inline !important;
  margin:0 !important;
  letter-spacing:inherit !important;
}

@media (max-width:1180px){
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .service-card.s4security-card{grid-template-columns:1fr !important;}
  .pricing-grid,.pricing-grid.compact{grid-template-columns:repeat(2,minmax(240px,1fr)) !important;}
}

@media (max-width:760px){
  .service-grid,.pricing-grid,.pricing-grid.compact,.feature-universe-grid{grid-template-columns:1fr !important;}
  .service-card,.service-card.s4security-card,.price-card{padding:22px !important;border-radius:22px !important;}
  .service-card{min-height:0 !important;}
  .s4security-card h3{font-size:2rem !important;}
  .service-kicker{width:100%;justify-content:center;text-align:center;}
}


/* ===== FIX DEFINITIVO UI S4Security / Websites - commit ready ===== */
/* Mantém Produtos e Soluções com 4 cards e coloca S4Security em container próprio abaixo. */
#servicos .service-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}
#servicos .service-grid > .service-card{
  min-height:330px !important;
  padding:26px !important;
  border-radius:22px !important;
}
#servicos .service-grid > .service-card h3{
  font-size:1.02rem !important;
  line-height:1.2 !important;
  margin:0 0 12px !important;
  letter-spacing:-.015em !important;
}
#servicos .service-grid > .service-card p{
  font-size:.9rem !important;
  line-height:1.62 !important;
  color:#4f5665 !important;
}
#servicos .service-grid > .service-card ul{
  margin-top:auto !important;
  padding-top:18px !important;
  border-top:1px solid rgba(15,15,15,.08) !important;
}
#servicos .service-grid > .service-card li{
  font-size:.86rem !important;
  line-height:1.35 !important;
}

.s4security-showcase{
  margin-top:26px !important;
  display:grid !important;
  grid-template-columns:72px minmax(0,1fr) minmax(280px,.82fr) !important;
  gap:24px !important;
  align-items:start !important;
  padding:28px !important;
  border-radius:26px !important;
  border:1px solid rgba(215,25,45,.16) !important;
  background:linear-gradient(135deg,#ffffff 0%,#fff7f8 48%,#ffffff 100%) !important;
  box-shadow:0 18px 48px rgba(17,17,17,.06) !important;
}
.s4security-showcase-icon{
  width:64px !important;
  height:64px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:20px !important;
  border:1px solid rgba(215,25,45,.18) !important;
  background:rgba(215,25,45,.06) !important;
}
.s4security-showcase-icon svg{
  width:30px !important;
  height:30px !important;
  fill:none !important;
  stroke:#d7192d !important;
  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.s4security-showcase h3{
  margin:8px 0 10px !important;
  font-size:clamp(1.45rem,2.2vw,2.05rem) !important;
  line-height:1.12 !important;
  letter-spacing:-.025em !important;
  color:#111 !important;
}
.s4security-showcase p{
  margin:0 !important;
  max-width:820px !important;
  font-size:.96rem !important;
  line-height:1.68 !important;
  color:#4f5665 !important;
}
.s4security-showcase .service-note{
  margin-top:12px !important;
  padding-top:12px !important;
  border-top:1px solid rgba(15,15,15,.08) !important;
  font-size:.9rem !important;
}
.s4security-showcase strong{
  font-weight:700 !important;
  color:#111 !important;
}
.s4security-showcase-list{
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;
  display:grid !important;
  gap:10px !important;
  border:0 !important;
}
.s4security-showcase-list li{
  position:relative !important;
  padding:12px 14px 12px 36px !important;
  border:1px solid rgba(15,15,15,.08) !important;
  border-radius:15px !important;
  background:#fff !important;
  color:#272c35 !important;
  font-size:.88rem !important;
  line-height:1.42 !important;
}
.s4security-showcase-list li::before{
  content:'✓' !important;
  position:absolute !important;
  left:14px !important;
  top:12px !important;
  color:#d7192d !important;
  font-weight:900 !important;
}
.s4security-showcase-list a{
  color:#d7192d !important;
  font-weight:700 !important;
  text-decoration:none !important;
}

/* Planos: impede que textos internos sejam renderizados como preço gigante. */
#planos .pricing-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}
#planos .price-card{
  min-height:0 !important;
  padding:24px !important;
  border-radius:22px !important;
  overflow:hidden !important;
}
#planos .price-card h3{
  font-size:1.06rem !important;
  line-height:1.22 !important;
  margin:0 !important;
}
#planos .price-card > strong{
  display:block !important;
  font-size:1.58rem !important;
  line-height:1.05 !important;
  letter-spacing:-.03em !important;
  margin:14px 0 12px !important;
  font-weight:600 !important;
}
#planos .price-card > strong small{
  font-size:.78rem !important;
  font-weight:400 !important;
}
#planos .price-card p{
  font-size:.88rem !important;
  line-height:1.55 !important;
  color:#4f5665 !important;
}
#planos .price-card ul{
  list-style:none !important;
  display:grid !important;
  gap:9px !important;
  padding:16px 0 0 !important;
  margin:18px 0 14px !important;
  border-top:1px solid rgba(15,15,15,.08) !important;
}
#planos .price-card li{
  position:relative !important;
  padding:0 0 0 18px !important;
  font-size:.86rem !important;
  line-height:1.35 !important;
  color:#252a33 !important;
}
#planos .price-card li::before{
  content:'✓' !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  color:#d7192d !important;
  font-size:.88rem !important;
  line-height:1.35 !important;
  margin:0 !important;
}
#planos .price-card li strong,
#planos .price-card li span,
#planos .price-card li small,
#planos .price-card .security-included,
#planos .price-card .security-included *{
  font-family:inherit !important;
  letter-spacing:normal !important;
}
#planos .price-card li strong{
  display:inline !important;
  font-size:inherit !important;
  line-height:inherit !important;
  margin:0 !important;
  font-weight:600 !important;
}
#planos .security-included{
  margin:4px 0 16px !important;
  padding:14px !important;
  border-radius:16px !important;
  border:1px solid rgba(215,25,45,.14) !important;
  background:linear-gradient(135deg,rgba(215,25,45,.055),rgba(17,17,17,.018)) !important;
}
#planos .security-included span{
  display:block !important;
  color:#111 !important;
  font-size:.92rem !important;
  line-height:1.25 !important;
  font-weight:700 !important;
  margin:0 0 5px !important;
}
#planos .security-included small{
  display:block !important;
  color:#596273 !important;
  font-size:.78rem !important;
  line-height:1.45 !important;
  font-weight:400 !important;
}
#planos .features-open{
  margin-top:auto !important;
  min-height:44px !important;
  padding:10px 13px !important;
  font-size:.74rem !important;
  line-height:1.2 !important;
}
#planos .btn-card{
  margin-top:12px !important;
  min-height:44px !important;
  padding:12px 14px !important;
  font-size:.73rem !important;
  letter-spacing:.045em !important;
}
.website-security-note{
  margin-top:20px !important;
  padding:16px 18px !important;
  border-radius:18px !important;
  font-size:.92rem !important;
  line-height:1.55 !important;
}

@media (max-width:1180px){
  #servicos .service-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .s4security-showcase{grid-template-columns:64px 1fr !important;}
  .s4security-showcase-list{grid-column:1 / -1 !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  #planos .pricing-grid,#planos .pricing-grid.compact{grid-template-columns:repeat(2,minmax(240px,1fr)) !important;}
}
@media (max-width:760px){
  #servicos .service-grid,#planos .pricing-grid,#planos .pricing-grid.compact{grid-template-columns:1fr !important;}
  .s4security-showcase{grid-template-columns:1fr !important;padding:22px !important;border-radius:22px !important;}
  .s4security-showcase-list{grid-template-columns:1fr !important;}
  #servicos .service-grid > .service-card{min-height:0 !important;}
}


/* ===== S4SECURITY BANNER FIX FINAL - sem SVG gigante / commit ready ===== */
/* Corrige definitivamente o container da S4Security abaixo dos 4 produtos. */
#servicos .service-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}

#servicos .service-grid > .service-card{
  min-height:330px !important;
  max-width:none !important;
}

#servicos .s4security-showcase,
#servicos .service-card.s4security-card{
  display:none !important;
}

#servicos .s4security-banner,
.s4security-banner{
  width:100% !important;
  max-width:100% !important;
  margin:28px 0 0 !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.22fr) minmax(320px,.78fr) !important;
  gap:0 !important;
  overflow:hidden !important;
  border:1px solid rgba(215,25,45,.16) !important;
  border-radius:28px !important;
  background:#ffffff !important;
  box-shadow:0 20px 56px rgba(17,17,17,.07) !important;
  position:relative !important;
}

#servicos .s4security-banner *,
.s4security-banner *{
  box-sizing:border-box !important;
}

#servicos .s4security-banner::before,
.s4security-banner::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:linear-gradient(135deg,rgba(215,25,45,.055),rgba(255,255,255,0) 42%,rgba(17,17,17,.025)) !important;
}

#servicos .s4security-banner-main,
.s4security-banner-main{
  position:relative !important;
  z-index:1 !important;
  padding:30px !important;
  min-width:0 !important;
}

#servicos .s4security-banner-head,
.s4security-banner-head{
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  margin-bottom:16px !important;
}

#servicos .s4security-mark,
.s4security-mark{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  border-radius:18px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(135deg,#111111,#2b2b2b) !important;
  color:#ffffff !important;
  font-family:var(--font-display,"Rajdhani","Segoe UI",Arial,sans-serif) !important;
  font-size:1.02rem !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
  box-shadow:0 16px 34px rgba(17,17,17,.18) !important;
  border:1px solid rgba(255,255,255,.12) !important;
}

#servicos .s4security-kicker,
.s4security-kicker{
  display:inline-flex !important;
  margin-bottom:7px !important;
  color:#d7192d !important;
  font-family:var(--font-tech,"Rajdhani","Segoe UI",Arial,sans-serif) !important;
  font-size:.72rem !important;
  line-height:1.1 !important;
  font-weight:700 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}

#servicos .s4security-banner h3,
.s4security-banner h3{
  margin:0 !important;
  color:#111111 !important;
  font-family:var(--font-display,"Rajdhani","Segoe UI",Arial,sans-serif) !important;
  font-size:clamp(1.45rem,2.2vw,2.15rem) !important;
  line-height:1.08 !important;
  font-weight:500 !important;
  letter-spacing:-.025em !important;
}

#servicos .s4security-banner p,
.s4security-banner p{
  max-width:820px !important;
  margin:0 !important;
  color:#424958 !important;
  font-family:var(--font-body,"Exo 2","Segoe UI",Arial,sans-serif) !important;
  font-size:.96rem !important;
  line-height:1.68 !important;
  letter-spacing:.003em !important;
}

#servicos .s4security-banner p + p,
.s4security-banner p + p{
  margin-top:13px !important;
}

#servicos .s4security-note,
.s4security-note{
  padding-top:13px !important;
  border-top:1px solid rgba(15,15,15,.08) !important;
}

#servicos .s4security-banner strong,
.s4security-banner strong{
  font-size:inherit !important;
  display:inline !important;
  margin:0 !important;
  font-family:inherit !important;
  font-weight:700 !important;
  letter-spacing:inherit !important;
  line-height:inherit !important;
  color:#111111 !important;
}

#servicos .s4security-banner-side,
.s4security-banner-side{
  position:relative !important;
  z-index:1 !important;
  min-width:0 !important;
  padding:28px !important;
  background:linear-gradient(180deg,#fff7f8 0%,#ffffff 100%) !important;
  border-left:1px solid rgba(215,25,45,.12) !important;
}

#servicos .s4security-side-title,
.s4security-side-title{
  margin-bottom:12px !important;
  color:#111111 !important;
  font-size:.86rem !important;
  line-height:1.25 !important;
  font-weight:800 !important;
  letter-spacing:.045em !important;
  text-transform:uppercase !important;
}

#servicos .s4security-banner-side ul,
.s4security-banner-side ul{
  list-style:none !important;
  display:grid !important;
  gap:10px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}

#servicos .s4security-banner-side li,
.s4security-banner-side li{
  position:relative !important;
  margin:0 !important;
  padding:12px 14px 12px 36px !important;
  border:1px solid rgba(15,15,15,.08) !important;
  border-radius:15px !important;
  background:#ffffff !important;
  color:#333844 !important;
  font-size:.86rem !important;
  line-height:1.45 !important;
}

#servicos .s4security-banner-side li::before,
.s4security-banner-side li::before{
  content:"✓" !important;
  position:absolute !important;
  left:14px !important;
  top:12px !important;
  color:#d7192d !important;
  font-weight:900 !important;
}

#servicos .s4security-banner-side a,
.s4security-banner-side a{
  color:#d7192d !important;
  font-weight:800 !important;
  text-decoration:none !important;
}

/* Garante que nenhum SVG antigo dentro do banner possa estourar o layout, caso exista cache parcial. */
#servicos .s4security-banner svg,
#servicos .s4security-showcase svg{
  width:28px !important;
  height:28px !important;
  max-width:28px !important;
  max-height:28px !important;
  display:block !important;
  fill:none !important;
  stroke:#d7192d !important;
  overflow:hidden !important;
}

@media (max-width:1100px){
  #servicos .service-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  #servicos .s4security-banner{grid-template-columns:1fr !important;}
  #servicos .s4security-banner-side{border-left:0 !important;border-top:1px solid rgba(215,25,45,.12) !important;}
}

@media (max-width:720px){
  #servicos .service-grid{grid-template-columns:1fr !important;}
  #servicos .s4security-banner{border-radius:22px !important;}
  #servicos .s4security-banner-main,
  #servicos .s4security-banner-side{padding:22px !important;}
  #servicos .s4security-banner-head{align-items:flex-start !important;}
  #servicos .s4security-mark{width:48px !important;height:48px !important;min-width:48px !important;border-radius:15px !important;font-size:.9rem !important;}
  #servicos .s4security-banner h3{font-size:1.55rem !important;}
}

.hero-content{
  max-width: 760px !important;
}

.hero h1,
.hero-content h1{
  max-width: 760px !important;
  font-size: clamp(2.7rem, 4.15vw, 4.65rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.065em !important;
  font-weight: 400 !important;
  text-wrap: balance;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

/* Ajusta melhor a largura entre texto e painel lateral */
.hero-grid{
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr) !important;
  gap: clamp(36px, 5vw, 80px) !important;
}

/* Mantém o subtítulo proporcional */
.hero-text{
  max-width: 660px !important;
  font-size: 1.02rem !important;
  line-height: 1.75 !important;
}

/* Responsivo para notebook/telas médias */
@media (max-width: 1180px){
  .hero h1,
  .hero-content h1{
    font-size: clamp(2.55rem, 4.4vw, 4rem) !important;
    max-width: 700px !important;
  }

  .hero-grid{
    grid-template-columns: minmax(0, 1fr) minmax(330px, .9fr) !important;
    gap: 42px !important;
  }
}

/* Responsivo para tablet */
@media (max-width: 920px){
  .hero-grid{
    grid-template-columns: 1fr !important;
  }

  .hero-content{
    max-width: 100% !important;
  }

  .hero h1,
  .hero-content h1{
    max-width: 720px !important;
    font-size: clamp(2.55rem, 7vw, 4rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.055em !important;
  }
}

/* Responsivo para celular */
@media (max-width: 560px){
  .hero h1,
  .hero-content h1{
    font-size: clamp(2.25rem, 11vw, 3.05rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.045em !important;
    max-width: 100% !important;
  }

  .eyebrow{
    font-size: .68rem !important;
    letter-spacing: .14em !important;
    line-height: 1.5 !important;
  }
}