/* =====================================================
   WEKON — BASE COMERCIAL v4
===================================================== */

:root{
  --navy:#071525;
  --navy2:#0d2341;
  --blue:#2563eb;
  --blue-light:#9bbcff;
  --green:#16a34a;
  --white:#fff;
  --bg:#f5f7fa;
  --text:#101828;
  --muted:#667085;
  --border:#e4e7ec;
  --max:1180px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:Inter,Segoe UI,Arial,Helvetica,sans-serif;
  background:var(--bg);
  color:var(--text);
  font-size:16px;
  line-height:1.55;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
.container{width:min(calc(100% - 40px),var(--max));margin:auto}

.site-header{position:absolute;top:0;left:0;width:100%;z-index:20}
.header-inner{height:78px;display:flex;align-items:center;justify-content:space-between}
.brand{width:130px}
.brand img{width:100%;height:auto}

.menu-button{
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(255,255,255,.45);
  background:transparent;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:5px;cursor:pointer
}
.menu-button span{width:18px;height:1px;background:#fff}

.mobile-menu{
  position:fixed;inset:0;z-index:100;background:var(--navy);color:#fff;
  display:flex;align-items:center;justify-content:center;
  transform:translateY(-100%);transition:transform .3s ease
}
.mobile-menu.active{transform:translateY(0)}
.mobile-menu nav{display:flex;flex-direction:column;gap:20px;text-align:center}
.mobile-menu nav a{font-size:27px;font-weight:700}
.menu-close{
  position:absolute;top:20px;right:20px;width:44px;height:44px;
  border-radius:50%;border:1px solid rgba(255,255,255,.45);
  background:transparent;color:#fff;font-size:28px;cursor:pointer
}

.hero{
  background:
    radial-gradient(circle at 88% 0%,rgba(37,99,235,.35),transparent 38%),
    linear-gradient(135deg,#061321,#0b1c32 55%,#102e5a);
  color:#fff;padding-top:125px;padding-bottom:42px
}
.hero-content{max-width:760px}
.eyebrow{
  display:block;color:var(--blue-light);font-size:11px;font-weight:700;
  letter-spacing:2.4px;margin-bottom:10px
}
.eyebrow.blue{color:var(--blue)}
.hero h1{
  font-size:clamp(44px,6vw,74px);line-height:.96;
  letter-spacing:-3px;margin-bottom:22px
}
.hero-description{max-width:690px;color:#c8d1de;font-size:18px;line-height:1.62}
.hero-actions{display:flex;align-items:center;gap:18px;margin-top:26px}
.hero-link{color:#d4dce7;font-size:14px;font-weight:700}
.hero-link span{color:var(--blue-light);margin-left:5px}
.hero-trust{display:flex;flex-wrap:wrap;gap:18px;margin-top:24px;color:#aebaca;font-size:12px}

.funnel{margin-top:24px}
.funnel-title{display:block;color:#b3bfce;font-size:10px;font-weight:700;margin-bottom:7px;letter-spacing:.5px}
.funnel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.funnel-card{
  min-height:68px;padding:11px 14px;border-radius:11px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.045);color:#fff;
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;
  transition:.2s ease
}
.funnel-card:hover{transform:translateY(-2px);background:rgba(255,255,255,.09);border-color:rgba(155,188,255,.55)}
.number{color:var(--blue-light);font-size:10px;font-weight:700}
.funnel-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.funnel-text strong{font-size:13px;line-height:1.25}
.funnel-text small{color:#aebaca;font-size:10px;line-height:1.3}
.arrow{color:var(--blue-light);font-size:16px;line-height:1}

.section{padding:38px 0}
.section-heading{max-width:800px;margin-bottom:18px}
.section-heading h2{
  font-size:clamp(32px,3.8vw,47px);line-height:.99;
  letter-spacing:-2.2px;margin-bottom:15px
}
.section-heading p{color:var(--muted);font-size:17px;line-height:1.65;max-width:720px}

.product-card{padding:30px;border-radius:15px;border:1px solid var(--border);background:#fff}
.featured-product{display:grid;grid-template-columns:1.1fr .9fr;gap:42px;margin-bottom:13px}
.featured-product .product-main{align-self:center}
.product-label{display:block;color:var(--blue);font-size:10px;font-weight:700;letter-spacing:2px;margin-bottom:12px}
.product-card h3{font-size:34px;line-height:1.03;letter-spacing:-1.1px;margin-bottom:13px}
.product-description{max-width:720px;color:var(--muted);font-size:16px;line-height:1.65}
.benefit-row{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:23px 0}
.benefit-row div{padding:13px;border-radius:9px;background:#f5f7fa}
.benefit-row strong{display:block;font-size:13px;margin-bottom:3px}
.benefit-row span{display:block;color:var(--muted);font-size:11px;line-height:1.45}
.product-resources{padding:23px;border-radius:12px;background:#f4f7fb}
.product-resources>strong{display:block;margin-bottom:15px;font-size:15px}
.resource-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.resource-list span{color:#475467;font-size:13px}

.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-bottom:9px}
.product-grid .product-card{display:flex;flex-direction:column;align-items:flex-start}
.product-grid .product-card p{color:var(--muted);font-size:14px;line-height:1.48;margin-bottom:10px}
.text-link{color:var(--blue);font-size:13px;font-weight:700;margin-top:auto}

.website-card{
  padding:35px;border-radius:15px;background:var(--navy);color:#fff
}
.website-card h3{max-width:760px;font-size:35px;line-height:1.03;letter-spacing:-1.1px;margin-bottom:14px}
.website-card p{max-width:780px;color:#bcc7d5;font-size:16px;line-height:1.65;margin-bottom:22px}
.website-card .product-label{color:var(--blue-light)}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:23px}
.features span{color:#d0d8e3;font-size:13px}

.addons-section{background:#eef2f7}
.addons-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.addon-card{padding:16px;background:#fff;border:1px solid var(--border);border-radius:11px;transition:.2s}
.addon-card:hover{transform:translateY(-3px);border-color:#bfd2f5}
.addon-card>span{display:block;color:var(--blue);font-size:10px;font-weight:700;margin-bottom:12px}
.addon-card h3{font-size:16px;line-height:1.2;margin-bottom:6px}
.addon-card p{color:#5f6f83;font-size:12px;line-height:1.42}
.addons-cta{
  margin-top:14px;padding:16px;border-radius:11px;background:#fff;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;gap:20px
}
.addons-cta strong{display:block;font-size:16px;margin-bottom:3px}
.addons-cta p{color:var(--muted);font-size:14px}

.operation-section{background:#fff}
.document-tags{display:flex;flex-wrap:wrap;gap:10px}
.document-tags span{
  padding:9px 13px;border-radius:9px;background:#eef3f9;color:#344054;
  font-size:14px;font-weight:700;border:1px solid #dce5f0
}

.differentiators{background:#f5f7fa}
.differentiator-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.differentiator{padding:17px;background:#fff;border:1px solid var(--border);border-radius:12px}
.differentiator>span{display:block;color:var(--blue);font-size:11px;font-weight:700;margin-bottom:12px}
.differentiator h3{font-size:17px;line-height:1.2;margin-bottom:6px}
.differentiator p{color:var(--muted);font-size:12px;line-height:1.45}

.white-section{background:#fff}
.segments-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.segment{padding:15px;border:1px solid var(--border);border-radius:11px}
.segment span{display:block;color:var(--blue);font-size:10px;font-weight:700;margin-bottom:9px}
.segment strong{display:block;font-size:16px;margin-bottom:6px}
.segment small{color:var(--muted);font-size:13px;line-height:1.5}

.support{padding:38px 0;background:var(--navy);color:#fff}
.support-heading{max-width:760px;margin-bottom:21px}
.support h2{font-size:clamp(40px,4.8vw,59px);line-height:.98;letter-spacing:-2px;margin-bottom:15px}
.support-heading p{color:#bcc7d5;font-size:17px;line-height:1.65}
.support-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.13);border-bottom:1px solid rgba(255,255,255,.13)}
.support-item{padding:18px 15px;border-right:1px solid rgba(255,255,255,.13)}
.support-item:last-child{border-right:none}
.support-item>span{display:block;color:var(--blue-light);font-size:11px;font-weight:700;margin-bottom:13px}
.support-item h3{font-size:16px;margin-bottom:8px}
.support-item p{color:#a7b4c5;font-size:13px;line-height:1.6}
.support-button{margin-top:23px}

.trust{background:#f5f7fa}
.trust-box{
  padding:34px;border-radius:15px;background:#fff;border:1px solid var(--border);
  display:grid;grid-template-columns:1.2fr .8fr;gap:45px;align-items:center
}
.trust-box h2{font-size:40px;line-height:1;letter-spacing:-1.4px;margin-bottom:14px}
.trust-box p{color:var(--muted);font-size:16px;line-height:1.65}
.trust-action{display:flex;flex-direction:column;gap:14px}
.trust-action strong{font-size:17px}

.contact{padding:46px 0;background:#fff}
.contact-inner{max-width:900px}
.contact h2{max-width:800px;font-size:clamp(43px,5vw,67px);line-height:.98;letter-spacing:-2.6px;margin-bottom:17px}
.contact-inner>p{max-width:680px;color:var(--muted);font-size:17px;line-height:1.65;margin-bottom:24px}
.contact-buttons{display:flex;gap:9px;flex-wrap:wrap}

.button{
  min-height:48px;padding:0 19px;border-radius:8px;
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-size:13px;font-weight:700;transition:.2s ease
}
.button:hover{transform:translateY(-2px)}
.button span{font-size:17px}
.whatsapp-button{color:#fff;background:var(--green)}
.blue-button{color:#fff;background:var(--blue)}
.light-button{color:var(--navy);background:#fff}
.outline-button{color:var(--blue);background:#fff;border:1px solid var(--border)}

footer{padding:30px 0 20px;background:#050e19;color:#fff}
.footer-logo{width:100px;margin-bottom:8px}
footer p{color:#9aa6b7;font-size:11px}
.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:22px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);
  color:#758194;font-size:10px
}

@media(max-width:1000px){
  .addons-grid,.segments-grid{grid-template-columns:repeat(2,1fr)}
  .support-grid{grid-template-columns:repeat(2,1fr)}
  .support-item:nth-child(2){border-right:none}
  .support-item:nth-child(3),.support-item:nth-child(4){border-top:1px solid rgba(255,255,255,.13)}
  .trust-box{grid-template-columns:1fr;gap:25px}
}

@media(max-width:700px){
  .container{width:calc(100% - 32px)}
  .header-inner{height:70px}
  .brand{width:100px}
  .hero{padding-top:103px;padding-bottom:34px}
  .hero h1{font-size:clamp(40px,11vw,54px);letter-spacing:-2px}
  .hero-description{font-size:15px}
  .hero-actions{align-items:flex-start;flex-direction:column;gap:13px}
  .hero-trust{gap:9px;flex-direction:column}
  .funnel{margin-top:24px}
  .funnel-grid{grid-template-columns:1fr}
  .funnel-card{min-height:66px}
  .section{padding:40px 0}
  .section-heading h2{font-size:36px}
  .section-heading p{font-size:15px}
  .featured-product{grid-template-columns:1fr;gap:25px}
  .product-grid{grid-template-columns:1fr}
  .product-card{padding:23px}
  .product-card h3{font-size:28px}
  .product-description{font-size:15px}
  .benefit-row{grid-template-columns:1fr}
  .resource-list{grid-template-columns:1fr}
  .website-card{padding:25px}
  .website-card h3{font-size:28px}
  .website-card p{font-size:15px}
  .features{grid-template-columns:1fr 1fr}
  .features span{font-size:12px}
  .addons-grid{grid-template-columns:1fr}
  .addon-card{min-height:0}
  .addons-cta{align-items:flex-start;flex-direction:column}
  .document-tags span{font-size:12px;padding:10px 13px}
  .differentiator-grid{grid-template-columns:1fr}
  .segments-grid{grid-template-columns:1fr 1fr}
  .support{padding:54px 0}
  .support-grid{grid-template-columns:1fr}
  .support-item{border-right:none;border-bottom:1px solid rgba(255,255,255,.13)}
  .support-item:last-child{border-bottom:none}
  .support-item:nth-child(3),.support-item:nth-child(4){border-top:none}
  .trust-box{padding:24px}
  .trust-box h2{font-size:33px}
  .contact{padding:58px 0}
  .contact h2{font-size:43px}
  .contact-buttons{flex-direction:column}
  .contact-buttons .button{width:100%}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px}
}

@media(max-width:380px){
  .container{width:calc(100% - 26px)}
  .brand{width:90px}
  .hero{padding-top:95px}
  .hero h1{font-size:38px}
  .features,.segments-grid{grid-template-columns:1fr}
}


/* =====================================================
   ALCANCE NACIONAL
===================================================== */

.national-reach{
  padding:44px 0;
  background:#e7edf4;
  border-top:1px solid #dbe3ec;
  border-bottom:1px solid #dbe3ec;
}

.national-inner{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:42px;
  align-items:center;
}

.national-copy{
  max-width:650px;
}

.national-copy h2{
  font-size:clamp(34px,4.1vw,49px);
  line-height:1;
  letter-spacing:-2px;
  margin-bottom:12px;
}

.national-copy p{
  color:var(--muted);
  font-size:15px;
  line-height:1.58;
  max-width:650px;
}

.national-points{
  display:flex;
  flex-wrap:wrap;
  gap:9px 18px;
  margin-top:18px;
}

.national-points span{
  color:#475467;
  font-size:12px;
  font-weight:600;
}

.brazil-visual{
  min-height:250px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.brazil-illustration{
  width:min(100%,470px);
  position:relative;
  margin:0 auto;
  padding:4px 0 20px;
}

.brazil-cartoon{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

.brazil-shape{
  fill:url(#brazilGreen);
  stroke:#8bc7a0;
  stroke-width:3;
  stroke-linejoin:round;
  filter:drop-shadow(0 12px 18px rgba(27,95,55,.10));
}

.brazil-highlight{
  fill:rgba(255,255,255,.26);
  opacity:.8;
}

.brazil-dots circle{
  fill:#24a866;
  stroke:#fff;
  stroke-width:4;
  filter:drop-shadow(0 3px 6px rgba(36,168,102,.20));
  animation:softDot 3.6s infinite ease-in-out;
}

.brazil-dots circle:nth-child(2){animation-delay:.25s}
.brazil-dots circle:nth-child(3){animation-delay:.5s}
.brazil-dots circle:nth-child(4){animation-delay:.75s}
.brazil-dots circle:nth-child(5){animation-delay:1s}
.brazil-dots circle:nth-child(6){animation-delay:1.25s}
.brazil-dots circle:nth-child(7){animation-delay:1.5s}
.brazil-dots circle:nth-child(8){animation-delay:1.75s}
.brazil-dots circle:nth-child(9){animation-delay:2s}
.brazil-dots circle:nth-child(10){animation-delay:2.25s}

@keyframes softDot{
  0%,100%{opacity:.75}
  50%{opacity:1;transform:scale(1.12)}
}

.brazil-sparkles circle{
  fill:#24a866;
  opacity:.45;
}

.brazil-label{
  fill:#39815a;
  font-size:13px;
  font-weight:800;
  letter-spacing:4px;
}

.map-attribution{
  display:none;
}

@media(max-width:1000px){
  .national-inner{
    grid-template-columns:1fr;
    gap:20px;
  }

  .national-copy{
    max-width:800px;
  }

  .brazil-visual{
    min-height:220px;
  }

  .support-grid{
  grid-template-columns:repeat(3,1fr);
}

.support-item:last-child{
  border-right:none;
}

}

@media(max-width:1000px){
  .national-inner{
    grid-template-columns:1fr;
    gap:20px;
  }

  .national-copy{
    max-width:800px;
  }

  .brazil-visual{
    min-height:310px;
  }

  .reach-message{
    right:50%;
    transform:translateX(50%);
  }

  .support-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

@media(max-width:700px){
  .national-reach{
    padding:40px 0;
  }

  .national-copy h2{
    font-size:36px;
  }

  .national-copy p{
    font-size:14px;
  }

  .national-stats{
    flex-direction:column;
  }

  .national-stat{
    width:100%;
  }

  .brazil-visual{
    min-height:270px;
  }

  .brazil-illustration{
    width:min(100%,430px);
  }

  .reach-message{
    bottom:0;
    width:max-content;
    max-width:90%;
  }

  .support-grid{
    grid-template-columns:1fr;
  }

  .support-item{
    border-right:none !important;
    border-bottom:1px solid rgba(255,255,255,.13);
  }

  .support-item:last-child{
    border-bottom:none;
  }
}


/* =====================================================
   AJUSTES v15 — alcance nacional
===================================================== */

.national-reach{
  padding:42px 0;
}

.national-inner{
  gap:34px;
}

.national-copy h2{
  max-width:620px;
}

.national-copy p{
  max-width:600px;
}

.national-stats{
  margin-top:17px;
}

.brazil-visual{
  min-height:300px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.brazil-illustration{
  max-width:420px;
}

.brazil-shape{
  fill:url(#brazilGreen);
  stroke:#79c79a;
  stroke-width:3;
  stroke-linejoin:round;
}

.brazil-highlight{
  fill:#ffffff;
  opacity:.22;
}

.brazil-dots circle{
  fill:#fff;
  stroke:#55b879;
  stroke-width:4;
  filter:drop-shadow(0 3px 6px rgba(31,122,72,.12));
}

.brazil-sparkles circle{
  fill:#57b97d;
  opacity:.55;
}

.brazil-label{
  fill:#2f7e52;
  font-size:14px;
  font-weight:800;
  letter-spacing:3px;
}

@media(max-width:1000px){
  .brazil-visual{
    min-height:260px;
  }

  .brazil-illustration{
    max-width:380px;
  }
}

@media(max-width:700px){
  .national-reach{
    padding:36px 0;
  }

  .brazil-visual{
    min-height:250px;
  }

  .brazil-illustration{
    max-width:330px;
  }

  .national-stats{
    grid-template-columns:repeat(2,1fr);
  }
}


/* =====================================================
   AJUSTES v16 — MAPA REAL DO BRASIL EM SVG
===================================================== */

.brazil-visual{
  min-height:320px;
}

.brazil-illustration{
  width:min(100%, 330px);
  max-width:330px;
  margin:0 auto;
}

.brazil-cartoon{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

.brazil-shape{
  fill:#43b879;
  stroke:#238f58;
  stroke-width:2.8;
  stroke-linejoin:round;
  stroke-linecap:round;
  filter:drop-shadow(0 12px 18px rgba(35,143,88,.15));
}

.brazil-glow{
  fill:#dff5e7;
  opacity:.16;
  stroke:none;
  transform-origin:center;
}

.map-pin{
  animation:pinFloat 3.6s ease-in-out infinite;
  transform-box:fill-box;
  transform-origin:center;
}

.map-pin:nth-child(2n){animation-delay:.35s}
.map-pin:nth-child(3n){animation-delay:.7s}
.map-pin:nth-child(4n){animation-delay:1.05s}
.map-pin:nth-child(5n){animation-delay:1.4s}

.pin-ring{
  fill:#fff;
  stroke:#2b9c61;
  stroke-width:3;
}

.pin-core{
  fill:#2b9c61;
}

.brazil-label{
  fill:#176b40;
  font-size:15px;
  font-weight:800;
  letter-spacing:3px;
}

@keyframes pinFloat{
  0%,100%{transform:translateY(0);opacity:.86}
  50%{transform:translateY(-3px);opacity:1}
}

@media(max-width:700px){
  .brazil-visual{
    min-height:270px;
  }

  .brazil-illustration{
    width:min(100%, 300px);
  }
}


/* =====================================================
   AJUSTES v18 — PINS ABSOLUTOS E RÓTULO CENTRAL
===================================================== */

.map-pins{
  overflow:visible;
}

.map-pin{
  animation:pinPulseSafe 3.6s ease-in-out infinite;
  transform:none !important;
  transform-box:initial !important;
  transform-origin:initial !important;
}

.map-pin:nth-child(2n),
.map-pin:nth-child(3n),
.map-pin:nth-child(4n),
.map-pin:nth-child(5n){
  animation-delay:0s;
}

.pin-ring{
  fill:#ffffff;
  stroke:#24945a;
  stroke-width:3;
}

.pin-core{
  fill:#24945a;
}

.pin-tail{
  fill:#ffffff;
  stroke:#24945a;
  stroke-width:2;
  stroke-linejoin:round;
}

.brazil-label{
  x:192px;
  y:238px;
  fill:#176b40;
  font-size:15px;
  font-weight:800;
  letter-spacing:3px;
  text-anchor:middle;
  dominant-baseline:middle;
  pointer-events:none;
}

@keyframes pinPulseSafe{
  0%,100%{
    opacity:.88;
  }
  50%{
    opacity:1;
  }
}


/* =====================================================
   AJUSTES v19 — MAPA RESPONSIVO / TELA CHEIA
===================================================== */

.national-reach{
  overflow:hidden;
}

.national-inner{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding-left:24px;
  padding-right:24px;
  box-sizing:border-box;
}

.brazil-visual{
  min-width:0;
  min-height:0;
}

.brazil-illustration{
  width:min(100%, 390px);
  max-width:390px;
  padding:0;
}

.brazil-cartoon{
  width:100%;
  max-width:390px;
  height:auto;
  display:block;
}

.brazil-shape{
  fill:url(#brazilGreen) !important;
  stroke:#238f58 !important;
  stroke-width:2.8;
}

.brazil-glow{
  fill:#dff5e7 !important;
  opacity:.16;
  stroke:none;
}

.map-pins,
.map-pin{
  fill:none !important;
}

.map-pin .pin-ring{
  fill:#ffffff !important;
  stroke:#24945a !important;
  stroke-width:3 !important;
}

.map-pin .pin-core{
  fill:#24945a !important;
  stroke:none !important;
}

.map-pin .pin-tail{
  fill:#ffffff !important;
  stroke:#24945a !important;
  stroke-width:2 !important;
}

.brazil-label{
  fill:#176b40 !important;
}

@media(min-width:1200px){
  .national-inner{
    grid-template-columns:minmax(0,1fr) minmax(360px,430px);
    gap:50px;
  }

  .brazil-illustration{
    width:370px;
    max-width:370px;
  }
}

@media(max-width:1000px){
  .national-inner{
    grid-template-columns:1fr;
    gap:28px;
  }

  .national-copy{
    max-width:720px;
  }

  .brazil-visual{
    order:2;
  }

  .brazil-illustration{
    width:min(100%,360px);
    max-width:360px;
  }
}

@media(max-width:600px){
  .national-reach{
    padding:34px 0;
  }

  .national-inner{
    padding-left:18px;
    padding-right:18px;
    gap:22px;
  }

  .national-copy h2{
    font-size:clamp(30px,9vw,40px);
    letter-spacing:-1.5px;
  }

  .national-copy p{
    font-size:15px;
  }

  .brazil-illustration{
    width:min(100%,300px);
    max-width:300px;
  }
}


/* =====================================================
   AJUSTES v20 — MAPA VERDE E PINS EQUILIBRADOS
===================================================== */

.brazil-shape{
  fill:#59c48a !important;
  stroke:#238f58 !important;
  stroke-width:2.8;
  stroke-linejoin:round;
  stroke-linecap:round;
  filter:drop-shadow(0 12px 18px rgba(35,143,88,.15));
}

.brazil-glow{
  fill:#dff5e7 !important;
  opacity:.14;
  stroke:none !important;
}

.map-pins{
  pointer-events:none;
}

.map-pin{
  transform:none !important;
  animation:pinPulseSafe 3.8s ease-in-out infinite;
  opacity:.9;
}

.map-pin:nth-child(2){animation-delay:.25s}
.map-pin:nth-child(3){animation-delay:.5s}
.map-pin:nth-child(4){animation-delay:.75s}
.map-pin:nth-child(5){animation-delay:1s}
.map-pin:nth-child(6){animation-delay:1.25s}
.map-pin:nth-child(7){animation-delay:1.5s}
.map-pin:nth-child(8){animation-delay:1.75s}
.map-pin:nth-child(9){animation-delay:2s}
.map-pin:nth-child(10){animation-delay:2.25s}

.pin-ring{
  fill:#ffffff !important;
  stroke:#24945a !important;
  stroke-width:3 !important;
}

.pin-core{
  fill:#24945a !important;
  stroke:none !important;
}

.pin-tail{
  fill:#ffffff !important;
  stroke:#24945a !important;
  stroke-width:2 !important;
  stroke-linejoin:round;
}

.brazil-label{
  fill:#176b40 !important;
  font-size:15px;
  font-weight:800;
  letter-spacing:3px;
}

@keyframes pinPulseSafe{
  0%,100%{opacity:.84}
  50%{opacity:1}
}


/* =====================================================
   AJUSTES v21 — MAPA DEFINITIVO
   Uma única camada visível + cores inline resistentes
===================================================== */

.brazil-cartoon{
  display:block;
  width:100%;
  height:auto;
  overflow:visible;
}

.brazil-shape{
  fill:#59c48a !important;
  stroke:#238f58 !important;
  stroke-width:2.8px !important;
  stroke-linejoin:round;
  stroke-linecap:round;
  filter:drop-shadow(0 12px 18px rgba(35,143,88,.14));
}

.brazil-glow{
  display:none !important;
}

.map-pins{
  fill:none !important;
  stroke:none;
  pointer-events:none;
}

.map-pin{
  fill:none !important;
  stroke:none !important;
  transform:none !important;
  animation:pinPulseSafe 3.8s ease-in-out infinite;
}

.map-pin .pin-ring{
  fill:#ffffff !important;
  stroke:#24945a !important;
  stroke-width:3px !important;
}

.map-pin .pin-core{
  fill:#24945a !important;
  stroke:none !important;
}

.map-pin .pin-tail{
  fill:#ffffff !important;
  stroke:#24945a !important;
  stroke-width:2px !important;
  stroke-linejoin:round;
}

.brazil-label{
  fill:#176b40 !important;
  font-size:15px;
  font-weight:800;
  letter-spacing:3px;
  text-anchor:middle;
  dominant-baseline:middle;
}

@keyframes pinPulseSafe{
  0%,100%{opacity:.86}
  50%{opacity:1}
}


/* =====================================================
   AJUSTES v22 — MAPA LIMPO
===================================================== */

.map-pins,
.map-pin,
.pin-ring,
.pin-core,
.pin-tail{
  display:none !important;
}

.green-highlight{
  color:#168b50;
}

.brazil-shape{
  fill:#59c48a !important;
  stroke:#238f58 !important;
}

.brazil-label{
  fill:#176b40 !important;
}


/* =====================================================
   AJUSTES v23 — PRODUTOS, PAÍSES E HIERARQUIA VISUAL
===================================================== */

/* Remove qualquer sobra visual da antiga versão Global. */
.product-grid-main{
  grid-template-columns:repeat(3,1fr);
}

.product-card-international{
  position:relative;
}

.availability{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  margin-top:4px;
  margin-bottom:14px;
}

.availability-label{
  width:100%;
  color:#718096;
  font-size:10px;
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
  margin-bottom:1px;
}

.country-chip{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 8px;
  border:1px solid #d8e3ef;
  border-radius:999px;
  background:#f7fafc;
  color:#344054;
  font-size:11px;
  font-weight:700;
  line-height:1;
}

.product-grid-main .product-card{
  min-height:245px;
}

.product-grid-main .text-link{
  margin-top:auto;
}

/* Faixa internacional: uma única mensagem, sem criar
   outra seção pesada ou repetitiva. */
.international-strip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin:0 0 12px;
  padding:16px 20px;
  border:1px solid #d9e3ec;
  border-radius:13px;
  background:linear-gradient(90deg,#f7fafc,#ffffff);
}

.international-strip .product-label{
  margin-bottom:4px;
  color:#168b50;
}

.international-strip strong{
  display:block;
  color:#142033;
  font-size:14px;
  line-height:1.35;
}

.international-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}

.international-list span{
  display:inline-flex;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  background:#edf8f2;
  color:#176b40;
  font-size:11px;
  font-weight:700;
}

/* Alcance nacional: um foco comercial forte, sem
   repetir "30 mil" em vários lugares. */
.national-copy h2 strong{
  color:#168b50;
}

.national-points{
  display:flex;
  flex-wrap:wrap;
  gap:8px 16px;
  margin-top:16px;
}

.national-points span{
  color:#416052;
  font-size:12px;
  font-weight:650;
}

/* Compacta a seção para evitar espaços vazios. */
.national-reach{
  padding:48px 0;
}

.brazil-visual{
  min-height:290px;
}

.brazil-illustration{
  max-width:390px;
}

/* Mobile */
@media(max-width:1000px){
  .product-grid-main{
    grid-template-columns:1fr 1fr;
  }

  .product-grid-main .product-card:last-child{
    grid-column:1 / -1;
  }

  .international-strip{
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
  }

  .international-list{
    justify-content:flex-start;
  }
}

@media(max-width:700px){
  .product-grid-main{
    grid-template-columns:1fr;
  }

  .product-grid-main .product-card:last-child{
    grid-column:auto;
  }

  .product-grid-main .product-card{
    min-height:0;
  }

  .availability{
    margin-top:8px;
  }

  .country-chip{
    font-size:11px;
  }

  .international-strip{
    padding:15px;
    margin-bottom:10px;
  }

  .international-strip strong{
    font-size:13px;
  }

  .international-list span{
    font-size:10px;
    padding:6px 8px;
  }

  .national-reach{
    padding:38px 0;
  }

  .national-copy h2{
    font-size:clamp(32px,9vw,42px);
    letter-spacing:-1.6px;
  }

  .national-points{
    flex-direction:column;
    gap:7px;
  }
}


/* =====================================================
   WEKON v24 — HOME COMPACTA E INTERATIVA
===================================================== */

/* A página apresenta a informação essencial primeiro.
   O restante aparece sob demanda. */
.compact-details{
  margin-top:14px;
  border:1px solid #dce6ee;
  border-radius:12px;
  background:#fff;
  overflow:hidden;
}

.compact-details summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:42px;
  padding:10px 14px;
  cursor:pointer;
  color:#176b40;
  font-size:13px;
  font-weight:750;
  user-select:none;
}

.compact-details summary::-webkit-details-marker{
  display:none;
}

.details-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#edf8f2;
  color:#168b50;
  font-size:18px;
  font-weight:500;
  line-height:1;
  transition:transform .2s ease;
}

.compact-details[open] .details-icon{
  transform:rotate(45deg);
}

.details-content{
  padding:0 14px 14px;
  color:#556575;
  font-size:13px;
  line-height:1.55;
  border-top:1px solid #edf1f4;
}

.details-content p{
  margin:12px 0;
}

.details-whatsapp,
.details-contact-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:8px;
  padding:9px 13px;
  border-radius:8px;
  background:#168b50;
  color:#fff !important;
  font-size:12px;
  font-weight:750;
  text-decoration:none;
  transition:transform .2s ease, opacity .2s ease;
}

.details-whatsapp:hover,
.details-contact-link:hover{
  transform:translateY(-1px);
  opacity:.92;
}

.about-mini-points{
  display:flex;
  flex-wrap:wrap;
  gap:7px 14px;
  margin-top:10px;
}

.about-mini-points span{
  font-size:11px;
  font-weight:650;
  color:#416052;
}

/* Cards ficam mais compactos porque o conteúdo longo
   agora aparece somente quando solicitado. */
.product-grid-main .product-card{
  min-height:210px;
}

.product-grid-main .product-card > p{
  display:none;
}

.product-grid-main .availability{
  display:none;
}

.product-grid-main .compact-details .availability{
  display:flex;
}

.product-grid-main .compact-details{
  margin-top:12px;
}

.product-grid-main .text-link{
  margin-top:0;
}

/* O mapa ganha um rótulo maior e mais centralizado. */
.brazil-label{
  font-size:19px !important;
  font-weight:850 !important;
  letter-spacing:3.5px !important;
  fill:#176b40 !important;
  text-anchor:middle !important;
  dominant-baseline:middle !important;
}

/* Menos espaço vertical entre blocos da Home. */
section{
  scroll-margin-top:80px;
}

@media(max-width:700px){
  .compact-details summary{
    min-height:44px;
    padding:10px 13px;
    font-size:12px;
  }

  .details-content{
    padding:0 13px 13px;
    font-size:12px;
  }

  .product-grid-main .product-card{
    min-height:0;
  }

  .brazil-label{
    font-size:18px !important;
    letter-spacing:3px !important;
  }
}


/* =====================================================
   WEKON v25 — HIERARQUIA, CONVERSÃO E COMPACTAÇÃO
===================================================== */

/* -----------------------------------------------------
   CTA: verde forte somente onde existe intenção comercial
----------------------------------------------------- */

.primary-cta{
  box-shadow:0 7px 18px rgba(22,139,80,.14);
}

.details-content .details-contact-link{
  background:#168b50;
  box-shadow:none;
}

.details-content .details-contact-link:hover{
  background:#117541;
}

/* -----------------------------------------------------
   Produtos: menos texto exposto e mais respiro
----------------------------------------------------- */

.product-grid-main .product-card h3{
  margin-bottom:7px;
}

.product-grid-main .product-card .product-label{
  margin-bottom:6px;
}

.product-grid-main .compact-details{
  background:#fbfdfc;
}

.product-grid-main .compact-details summary{
  font-size:12px;
  min-height:40px;
}

.product-grid-main .compact-details[open] summary{
  background:#f4faf6;
}

/* -----------------------------------------------------
   Faixa de benefícios — substitui blocos repetitivos
----------------------------------------------------- */

.value-row-section{
  padding:18px 0 8px;
}

.value-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.value-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:14px 15px;
  border:1px solid #e0e8ed;
  border-radius:12px;
  background:#fff;
}

.value-icon{
  flex:0 0 25px;
  width:25px;
  height:25px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#eaf8f0;
  color:#168b50;
  font-size:13px;
  font-weight:900;
}

.value-item strong{
  display:block;
  margin-bottom:2px;
  color:#172334;
  font-size:12px;
}

.value-item span:not(.value-icon){
  display:block;
  color:#687887;
  font-size:10.5px;
  line-height:1.4;
}

/* -----------------------------------------------------
   Alcance nacional
----------------------------------------------------- */

.national-copy p{
  max-width:560px;
}

.national-points{
  margin-top:14px;
}

.national-points span{
  font-size:11.5px;
}

/* -----------------------------------------------------
   Internacional: mais discreto, menos cara de outra seção
----------------------------------------------------- */

.international-strip{
  padding:14px 18px;
  margin-top:8px;
  margin-bottom:8px;
  background:#fbfdfc;
}

.international-strip strong{
  font-size:13px;
}

/* -----------------------------------------------------
   Rodapé/CTA final — foco em conversão
----------------------------------------------------- */

.cta-final{
  position:relative;
}

.cta-final .whatsapp-button,
.cta-final a.whatsapp-button{
  min-height:44px;
  padding:11px 18px;
  font-size:13px;
  font-weight:800;
}

/* -----------------------------------------------------
   Mobile
----------------------------------------------------- */

@media(max-width:800px){

  .value-row{
    grid-template-columns:1fr;
    gap:8px;
  }

  .value-item{
    padding:12px 13px;
  }

  .value-item span:not(.value-icon){
    font-size:10.5px;
  }

}

@media(max-width:600px){

  .value-row-section{
    padding:10px 0 3px;
  }

  .product-grid-main{
    gap:10px;
  }

  .product-grid-main .product-card{
    padding:16px;
  }

  .product-grid-main .product-card h3{
    font-size:22px;
  }

  .international-strip{
    padding:13px 14px;
  }

  .national-reach{
    padding:34px 0;
  }

  .national-copy p{
    font-size:14px;
  }

}


/* =====================================================
   WEKON v26 — AUDITORIA PROFISSIONAL UX/UI
===================================================== */

.site-header{min-height:68px}
.site-header .logo,.site-header .brand-logo,.site-header img{
  max-height:52px;width:auto;
}
.hero h1{
  font-size:clamp(40px,5vw,58px);
  line-height:1.03;
  letter-spacing:-2.2px;
  max-width:760px;
}
.hero-accent{color:#168b50}
.hero-subtitle{
  max-width:650px;
  font-size:clamp(16px,1.5vw,19px);
  line-height:1.55;
  color:#596979;
}
.hero .whatsapp-button{
  min-height:46px;padding:12px 20px;font-size:13px;font-weight:800;
}

.product-card-featured{
  grid-column:span 2;
  border:1.5px solid #9ed5b6;
  background:linear-gradient(145deg,#fff,#f5fbf7);
  box-shadow:0 14px 34px rgba(31,122,72,.08);
}
.product-card-featured h3{font-size:30px!important}
.product-card-featured .product-label{color:#168b50}
.product-lead{max-width:690px;font-size:15px;line-height:1.55;color:#4d5e6d}
.product-capabilities{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0 2px}
.product-capabilities span{
  padding:6px 9px;border-radius:999px;background:#eaf8f0;
  color:#176b40;font-size:10.5px;font-weight:750;
}

section h2{
  font-size:clamp(28px,3vw,38px);
  line-height:1.1;letter-spacing:-1.1px;
}
section > .container > p,.section-intro{font-size:16px;line-height:1.55}
.product-card h3{font-size:24px;line-height:1.1}
.product-card p{font-size:14px;line-height:1.5}
section{padding-top:52px;padding-bottom:52px}

.compact-details{border-color:#dce7e0}
.compact-details summary{color:#176b40;font-size:12px;font-weight:800}
.compact-details summary:hover{background:#f7fbf8}
.details-icon{width:25px;height:25px}

.brazil-illustration{max-width:410px}
.brazil-label{
  font-size:20px!important;font-weight:900!important;
  letter-spacing:3.8px!important;fill:#176b40!important;
}

.country-chip{background:#f7fafc;border-color:#d8e4df;color:#344054}

@media(max-width:1000px){
  .product-card-featured{grid-column:1/-1}
}
@media(max-width:700px){
  section{padding-top:38px;padding-bottom:38px}
  .site-header{min-height:60px}
  .site-header .logo,.site-header .brand-logo,.site-header img{max-height:45px}
  .hero h1{font-size:clamp(34px,9.5vw,42px);letter-spacing:-1.5px}
  .hero-subtitle{font-size:15px;line-height:1.5}
  section h2{font-size:28px}
  .product-card h3{font-size:22px}
  .product-card-featured h3{font-size:25px!important}
  .product-lead{font-size:14px}
  .brazil-illustration{max-width:320px}
  .brazil-label{font-size:18px!important;letter-spacing:3px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;animation-duration:.01ms!important;
    animation-iteration-count:1!important;transition-duration:.01ms!important;
  }
}


/* =====================================================
   WEKON v27 — CORREÇÃO DIRETA
   Logo real + SG Master realmente compacto
===================================================== */

/* LOGO — alvo explícito criado no HTML */
.site-header .site-logo{
  display:block;
  width:auto !important;
  height:56px !important;
  max-width:220px !important;
  object-fit:contain;
}

.site-header{
  min-height:64px !important;
  padding-top:5px !important;
  padding-bottom:5px !important;
}

/* Evita que regras antigas de img reduzam a logo */
.site-header .site-logo{
  flex-shrink:0;
}

/* SG MASTER — destaque sem ocupar uma seção gigante */
.product-grid-main .product-card-featured{
  grid-column:span 2;
  min-height:0 !important;
  padding:20px 22px !important;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}

.product-grid-main .product-card-featured h3{
  margin:3px 0 5px !important;
  font-size:27px !important;
  line-height:1.05 !important;
}

.product-grid-main .product-card-featured .product-label{
  margin-bottom:3px !important;
  font-size:10px !important;
}

.product-grid-main .product-card-featured .product-lead{
  margin:0 0 8px !important;
  max-width:620px;
  font-size:13px !important;
  line-height:1.4 !important;
}

.product-grid-main .product-card-featured .product-capabilities{
  margin:5px 0 7px !important;
  gap:5px !important;
}

.product-grid-main .product-card-featured .product-capabilities span{
  padding:5px 8px !important;
  font-size:9.5px !important;
}

.product-grid-main .product-card-featured .compact-details{
  margin-top:5px !important;
}

.product-grid-main .product-card-featured .compact-details summary{
  min-height:36px !important;
  padding:7px 11px !important;
}

.product-grid-main .product-card-featured .details-content{
  padding:0 11px 10px !important;
  font-size:12px !important;
}

/* Os demais cards ficam menores para a hierarquia ficar clara. */
.product-grid-main .product-card:not(.product-card-featured){
  min-height:0 !important;
  padding:18px !important;
}

.product-grid-main .product-card:not(.product-card-featured) h3{
  font-size:22px !important;
}

@media(max-width:1000px){
  .product-grid-main .product-card-featured{
    grid-column:1 / -1;
  }
}

@media(max-width:700px){
  .site-header .site-logo{
    height:46px !important;
    max-width:180px !important;
  }

  .site-header{
    min-height:58px !important;
    padding-top:4px !important;
    padding-bottom:4px !important;
  }

  .product-grid-main .product-card-featured{
    padding:17px 16px !important;
  }

  .product-grid-main .product-card-featured h3{
    font-size:24px !important;
  }

  .product-grid-main .product-card-featured .product-lead{
    font-size:13px !important;
  }
}


/* =====================================================
   WEKON v28 — CORREÇÃO REAL DA HOME MOBILE
   Logo + SG Master compacto
===================================================== */

/* -------------------------------
   LOGO REAL
-------------------------------- */

.site-header .brand{
  width:165px !important;
}

.site-header .brand img.site-logo{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain;
}

/* Mantém o header compacto mesmo com a logo maior. */
.site-header .header-inner{
  height:72px !important;
}


/* -------------------------------
   SG MASTER — ESTRUTURA REAL
-------------------------------- */

/* O SG Master usa .featured-product, não
   .product-grid-main. */
#sg-master.featured-product{
  padding:22px !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:12px !important;
  margin-bottom:10px !important;
}

#sg-master .product-main{
  align-self:auto !important;
}

#sg-master .product-label{
  margin-bottom:5px !important;
}

#sg-master h3{
  font-size:28px !important;
  margin-bottom:6px !important;
}

#sg-master .product-lead{
  margin-bottom:9px !important;
  font-size:13px !important;
  line-height:1.4 !important;
}

/* Benefícios viram uma faixa compacta. */
#sg-master .benefit-row{
  grid-template-columns:repeat(3,1fr) !important;
  gap:7px !important;
  margin:10px 0 !important;
}

#sg-master .benefit-row div{
  padding:10px !important;
  border-radius:8px !important;
}

#sg-master .benefit-row strong{
  font-size:11px !important;
  margin-bottom:0 !important;
}

#sg-master .benefit-row span{
  font-size:9.5px !important;
  line-height:1.3 !important;
}

/* CTA mais proporcional. */
#sg-master .blue-button{
  min-height:42px !important;
  padding:0 15px !important;
  font-size:12px !important;
  margin-top:2px;
}


/* -------------------------------
   RECURSOS DO SG MASTER
-------------------------------- */

.master-resources{
  width:100%;
  border:1px solid #e1e7ef;
  border-radius:11px;
  background:#f7f9fc;
  overflow:hidden;
}

.master-resources summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  padding:12px 14px;
}

.master-resources summary::-webkit-details-marker{
  display:none;
}

.master-resources summary > span:first-child{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.master-resources summary strong{
  color:#172033;
  font-size:13px;
}

.master-resources summary small{
  color:#718096;
  font-size:10px;
  line-height:1.3;
}

.master-resources[open] .details-icon{
  transform:rotate(45deg);
}

.master-resources .product-resources{
  padding:12px 14px 14px;
  border-top:1px solid #e4e9f0;
  border-radius:0;
  background:#f7f9fc;
}

.master-resources .resource-list{
  grid-template-columns:repeat(2,1fr);
  gap:7px 14px;
}

.master-resources .resource-list span{
  font-size:11px;
  line-height:1.35;
}


/* -------------------------------
   MOBILE
-------------------------------- */

@media(max-width:700px){

  .site-header .brand{
    width:140px !important;
  }

  .site-header .header-inner{
    height:68px !important;
  }

  #sg-master.featured-product{
    padding:17px !important;
    gap:9px !important;
  }

  #sg-master h3{
    font-size:25px !important;
  }

  #sg-master .product-lead{
    font-size:13px !important;
    margin-bottom:7px !important;
  }

  #sg-master .benefit-row{
    grid-template-columns:repeat(3,1fr) !important;
    gap:5px !important;
    margin:8px 0 !important;
  }

  #sg-master .benefit-row div{
    padding:8px 6px !important;
    text-align:center;
  }

  #sg-master .benefit-row strong{
    font-size:10px !important;
  }

  /* No mobile, a descrição dos benefícios não precisa
     ocupar uma linha inteira. Ela continua disponível
     dentro dos detalhes gerais. */
  #sg-master .benefit-row span{
    display:none !important;
  }

  #sg-master .blue-button{
    min-height:40px !important;
    padding:0 13px !important;
    font-size:11.5px !important;
  }

  .master-resources summary{
    padding:11px 12px;
  }

  .master-resources .resource-list{
    grid-template-columns:1fr !important;
    gap:7px !important;
  }

  .master-resources .resource-list span{
    font-size:11px !important;
  }

}


/* =====================================================
   WEKON v29 — ADICIONAIS DENTRO DOS PRODUTOS
===================================================== */

.solution-groups{
  display:grid;
  gap:7px;
  margin-top:14px;
}

.solution-group{
  border:1px solid #dfe7e2;
  border-radius:10px;
  background:#f8faf9;
  overflow:hidden;
}

.solution-group summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  padding:11px 13px;
}

.solution-group summary::-webkit-details-marker{
  display:none;
}

.solution-group summary > span:first-child{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.solution-group summary strong{
  font-size:12px;
  color:#172033;
}

.solution-group summary small{
  font-size:10px;
  color:#73808d;
}

.solution-group[open] .details-icon{
  transform:rotate(45deg);
}

.solution-group-content{
  padding:11px 13px 13px;
  border-top:1px solid #e4ebe7;
}

.feature-tags,
.product-mini-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.feature-tags span,
.product-mini-tags span{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:5px 8px;
  border-radius:999px;
  background:#eef6f1;
  color:#245f42;
  font-size:10px;
  font-weight:700;
}

.feature-group{
  margin-bottom:12px;
}

.feature-group:last-child{
  margin-bottom:0;
}

.feature-group > strong{
  display:block;
  margin-bottom:7px;
  font-size:11px;
  color:#263442;
}

.product-mini-tags{
  margin:9px 0 8px;
}

#sg-master .solution-groups{
  grid-template-columns:repeat(3,1fr);
}

#sg-master .solution-group{
  min-width:0;
}

#sg-master .solution-group summary{
  min-height:58px;
}

#sg-master .solution-group summary strong{
  font-size:11px;
}

#sg-master .solution-group summary small{
  font-size:9px;
}

#sg-master .solution-group-content{
  min-height:80px;
}

.product-grid-main .product-card{
  display:flex;
  flex-direction:column;
  min-height:0;
}

.product-grid-main .product-card .compact-details{
  margin-top:auto;
}

.product-grid-main .product-lead{
  margin-bottom:7px;
}

.product-grid-main .feature-tags span{
  font-size:9.5px;
}

@media(max-width:900px){
  #sg-master .solution-groups{
    grid-template-columns:1fr;
  }

  #sg-master .solution-group summary{
    min-height:0;
  }

  #sg-master .solution-group-content{
    min-height:0;
  }
}

@media(max-width:700px){

  #sg-master .solution-groups{
    gap:6px;
    margin-top:10px;
  }

  .solution-group summary{
    padding:10px 11px;
  }

  .solution-group-content{
    padding:10px 11px 11px;
  }

  .feature-tags{
    gap:5px;
  }

  .feature-tags span,
  .product-mini-tags span{
    min-height:24px;
    padding:5px 7px;
    font-size:9.5px;
  }

  .product-grid-main{
    gap:10px;
  }

}

/* WEKON v30 */
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:82px}
#sg-master{padding:20px!important}
#sg-master h3{font-size:27px!important;margin:3px 0 5px!important}
#sg-master .product-lead{font-size:13px!important;line-height:1.45!important;margin-bottom:8px!important}
#sg-master .product-capabilities{margin:4px 0 10px!important}
.master-modules{width:100%;margin-top:12px;border:1px solid #dfe8e2;border-radius:11px;background:#f8faf9;overflow:hidden}
.master-modules summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 14px;cursor:pointer}
.master-modules summary::-webkit-details-marker{display:none}
.master-modules summary>span:first-child{display:flex;flex-direction:column;gap:2px}
.master-modules summary strong{font-size:12px;color:#172033}
.master-modules summary small{font-size:10px;color:#74818e}
.master-modules[open] .details-icon{transform:rotate(45deg)}
.master-modules-content{padding:14px;border-top:1px solid #e3ebe6}
.module-group{margin-bottom:14px}
.module-group:last-child{margin-bottom:0}
.module-group h4{margin:0 0 7px;font-size:12px;color:#243442}
.module-heading-row{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:8px}
.module-heading-row h4{margin-bottom:2px}
.module-heading-row p{margin:0;font-size:10px;line-height:1.4;color:#71808d}
.master-modules .feature-tags span{font-size:9.5px;min-height:25px}
.anchor-link{color:#168b50;font-size:11px;font-weight:800;text-decoration:none}
.marketplaces-section{padding:48px 0}
.marketplace-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:22px 0 12px}
.marketplace-card{min-height:100px;padding:16px;border:1px solid #dfe7e3;border-radius:12px;background:#fff;display:flex;flex-direction:column;justify-content:center;gap:5px}
.marketplace-card strong{font-size:13px;color:#172033}
.marketplace-card span{font-size:10.5px;line-height:1.4;color:#71808d}
.marketplace-card-more{background:#f6faf7;border-color:#b9dfc8}
.brazil-label{display:none!important}
.product-mini-tags,.country-list,.countries,.availability{overflow:visible!important;white-space:normal!important;max-width:100%}
.product-mini-tags span,.country-list span,.countries span{flex:0 0 auto;white-space:nowrap}
@media(max-width:900px){.marketplace-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){
#sg-master{padding:17px!important}
#sg-master h3{font-size:24px!important}
.master-modules summary{padding:11px 12px}
.master-modules-content{padding:12px}
.module-heading-row{flex-direction:column;gap:6px}
.marketplaces-section{padding:38px 0}
.marketplace-grid{grid-template-columns:1fr 1fr;gap:8px;margin-top:17px}
.marketplace-card{min-height:88px;padding:13px}
.marketplace-card strong{font-size:12px}
.marketplace-card span{font-size:9.5px}
}
@media(max-width:390px){.marketplace-grid{grid-template-columns:1fr}}

/* =====================================================
   WEKON v31 — CORREÇÕES
===================================================== */

/* Mobilidade não é produto independente. */
#mobilidade{
  display:none !important;
}

/* Países: uma única linha por produto, sem corte. */
.product-mini-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:9px 0 8px;
  overflow:visible !important;
  white-space:normal !important;
}

.product-mini-tags span{
  flex:0 0 auto;
  white-space:nowrap;
}

/* Impede faixas de países soltas fora dos cards. */
.product-grid-main > .product-mini-tags{
  display:none !important;
}

/* Âncoras não devem esconder títulos atrás do header. */
section[id],
article[id],
details[id]{
  scroll-margin-top:92px;
}

@media(max-width:700px){
  section[id],
  article[id],
  details[id]{
    scroll-margin-top:88px;
  }

  .product-mini-tags{
    gap:5px;
  }

  .product-mini-tags span{
    font-size:10px;
    min-height:25px;
  }
}

/* =====================================================
   WEKON v34 — SG MASTER / MÓDULOS / APPS / INTEGRAÇÕES
===================================================== */
#sg-master{padding:20px!important}
#sg-master h3{font-size:27px!important;margin:3px 0 5px!important}
#sg-master .product-lead{max-width:700px;font-size:13px!important;line-height:1.45!important;margin-bottom:8px!important}
.interactive-notice{display:flex;align-items:center;gap:7px;margin:3px 0 13px;padding:8px 10px;border-radius:8px;background:#f1f8f4;color:#557064;font-size:10.5px;line-height:1.35}
.interactive-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#168b50;color:#fff;font-weight:800;flex:0 0 20px}
.master-ecosystem{width:100%;display:grid;gap:10px;margin-top:14px}
.ecosystem-block{border:1px solid #dfe8e2;border-radius:12px;background:#f9fbfa;padding:13px}
.ecosystem-heading{display:flex;align-items:flex-start;gap:9px;margin-bottom:10px}
.ecosystem-kicker{display:block;color:#168b50;font-size:9px;font-weight:900;letter-spacing:.08em}
.ecosystem-heading h4{margin:0;font-size:14px;color:#172033}
.ecosystem-heading p{margin:3px 0 0;color:#75828d;font-size:10px;line-height:1.4}
.interactive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.interactive-item{position:relative;display:flex;flex-direction:column;gap:3px;min-height:65px;padding:10px 30px 9px 11px;border:1px solid #e0e8e3;border-radius:9px;background:#fff;color:inherit;text-decoration:none;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.interactive-item:hover{transform:translateY(-1px);border-color:#b8dbc7;box-shadow:0 4px 14px rgba(20,70,45,.07)}
.interactive-item strong{color:#1b2935;font-size:11px;line-height:1.25}
.interactive-item span{color:#788590;font-size:9px;line-height:1.35}
.interactive-item b{position:absolute;right:9px;bottom:9px;color:#168b50;font-size:12px}
@media(max-width:900px){.interactive-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){
#sg-master{padding:17px!important}
#sg-master h3{font-size:24px!important}
.interactive-notice{width:100%;box-sizing:border-box}
.ecosystem-block{padding:11px}
.interactive-grid{grid-template-columns:1fr;gap:6px}
.interactive-item{min-height:58px;padding:10px 32px 9px 11px}
.interactive-destinations{width:calc(100% - 28px)}
}

/* WEKON v35 — SG MASTER COMPACTO */
#sg-master{padding:20px!important}
#sg-master .product-lead{max-width:700px}
.interactive-hint{margin:7px 0 11px;font-size:10.5px;line-height:1.4;color:#687b73}
.master-modules{width:100%;margin-top:9px;border:1px solid #dfe8e2;border-radius:11px;background:#f9fbfa;overflow:hidden}
.master-modules summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;cursor:pointer}
.master-modules summary::-webkit-details-marker{display:none}
.master-modules summary>span:first-child{display:flex;flex-direction:column;gap:2px}
.master-modules summary strong{font-size:12px;color:#172033}
.master-modules summary small{font-size:9.5px;color:#75828d}
.details-icon{font-size:18px;line-height:1;color:#168b50;transition:transform .15s ease}
.master-modules[open] .details-icon{transform:rotate(45deg)}
.master-modules-content{padding:0 12px 12px;border-top:1px solid #e4ebe7}
.compact-link-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding-top:10px}
.compact-feature-link{display:flex;align-items:center;justify-content:space-between;gap:7px;min-height:32px;padding:7px 9px;box-sizing:border-box;border:1px solid #e1e8e4;border-radius:7px;background:#fff;color:#34444d;text-decoration:none;font-size:9.5px;line-height:1.2;transition:border-color .15s ease,background .15s ease}
.compact-feature-link:hover{border-color:#b8dbc7;background:#f5faf7}
.compact-feature-link b{color:#168b50;font-size:11px;flex:0 0 auto}
@media(max-width:700px){
#sg-master{padding:17px!important}
.master-modules{margin-top:8px}
.master-modules summary{padding:10px 11px}
.compact-link-grid{grid-template-columns:repeat(2,1fr);gap:5px}
.compact-feature-link{min-height:31px;font-size:9px;padding:7px 8px}
.interactive-destinations{width:calc(100% - 28px)}
}

/* WEKON v36 — SG MASTER MAIS LIMPO
   Removidos CTA azul e tags repetitivas.
*/
#sg-master .product-main{
  padding-bottom:4px;
}

#sg-master .interactive-hint{
  margin:6px 0 12px;
  font-size:10.5px;
  line-height:1.4;
  color:#687b73;
}

#sg-master .product-capabilities{
  display:none!important;
}

/* WEKON v38 — ícones dos canais */
.integration-brand{display:flex;align-items:center;gap:12px;margin-bottom:12px}.integration-logo{width:40px;height:40px;object-fit:contain;border-radius:10px;background:#fff;padding:5px;box-sizing:border-box;border:1px solid #edf1ef}.integration-brand h3{margin:0}.integration-generic-icon{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:#edf7f1;color:#168b50;font-size:20px;font-weight:700}

/* =====================================================
   WEKON v39 — REFINO VISUAL / UX
   Seção Presença Nacional
===================================================== */

:root{
  --wekon-green:#159447;
  --wekon-green-dark:#08783a;
  --wekon-navy:#101b2d;
  --wekon-text:#172033;
  --wekon-muted:#687585;
  --wekon-national-bg:#f1f6fa;
}

/* Tipografia global */
html,
body{
  font-family:"Manrope",sans-serif;
}

/* Presença nacional */
.national-reach{
  position:relative;
  overflow:hidden;
  padding:72px 0 76px;
  background:
    radial-gradient(
      circle at 76% 62%,
      rgba(21,148,71,.075),
      transparent 32%
    ),
    var(--wekon-national-bg);
  border-top:1px solid #e1e9ef;
  border-bottom:1px solid #e1e9ef;
}

/* Atmosfera suave atrás do mapa */
.national-reach::after{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:7%;
  top:50%;
  transform:translateY(-50%);
  border-radius:50%;
  background:rgba(72,190,120,.055);
  filter:blur(55px);
  pointer-events:none;
}

.national-inner{
  position:relative;
  z-index:1;
  grid-template-columns:minmax(0,1.05fr) minmax(280px,.82fr);
  gap:54px;
  align-items:center;
}

.national-copy{
  max-width:610px;
}

.national-copy .eyebrow{
  color:#9bbcf3;
  letter-spacing:3.5px;
  font-size:11px;
  font-weight:800;
}

.national-copy h2{
  margin:14px 0 18px;
  max-width:650px;
  color:var(--wekon-navy);
  font-size:clamp(36px,4.15vw,52px);
  line-height:1.02;
  letter-spacing:-2.4px;
  font-weight:800;
}

.national-copy h2 strong{
  color:var(--wekon-green);
  font-weight:800;
}

.national-copy p{
  max-width:570px;
  margin:0;
  color:var(--wekon-muted);
  font-size:15px;
  line-height:1.65;
  font-weight:500;
}

/* Mapa */
.brazil-visual{
  min-height:0;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.brazil-illustration{
  position:relative;
  width:min(100%,390px);
  margin:0 auto;
  padding:0 0 4px;
}

.brazil-illustration::before{
  content:"";
  position:absolute;
  width:230px;
  height:230px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:rgba(42,181,104,.075);
  filter:blur(34px);
  z-index:-1;
}

.brazil-cartoon{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

.brazil-shape{
  fill:#59c48a !important;
  stroke:#238f58 !important;
  stroke-width:2.8px;
  stroke-linejoin:round;
  filter:drop-shadow(0 16px 24px rgba(24,104,61,.13));
}

/* Não exibir elementos antigos do mapa */
.brazil-dots,
.brazil-sparkles,
.brazil-label,
.map-attribution{
  display:none !important;
}

/* Ajuste dos demais títulos da página */
h1,h2,h3,h4,h5,h6{
  font-family:"Manrope",sans-serif;
}

/* Mantém corpo confortável */
p,
span,
li,
a,
button{
  font-family:"Manrope",sans-serif;
}

/* Mobile */
@media(max-width:1000px){

  .national-reach{
    padding:58px 0 62px;
  }

  .national-inner{
    grid-template-columns:1fr;
    gap:26px;
  }

  .national-copy{
    max-width:700px;
  }

  .national-copy h2{
    max-width:650px;
  }

  .brazil-visual{
    min-height:0;
  }

  .brazil-illustration{
    width:min(100%,340px);
  }

}

@media(max-width:700px){

  .national-reach{
    padding:50px 0 54px;
  }

  .national-reach::after{
    width:260px;
    height:260px;
    right:-60px;
    top:67%;
  }

  .national-inner{
    gap:22px;
  }

  .national-copy .eyebrow{
    font-size:10px;
    letter-spacing:3px;
  }

  .national-copy h2{
    margin:12px 0 15px;
    font-size:clamp(34px,9.5vw,43px);
    line-height:1.04;
    letter-spacing:-1.7px;
  }

  .national-copy p{
    max-width:100%;
    font-size:14px;
    line-height:1.58;
  }

  .brazil-illustration{
    width:min(100%,285px);
  }

  .brazil-illustration::before{
    width:190px;
    height:190px;
    filter:blur(30px);
  }

}

/* =====================================================
   WEKON v40 — REFINO DO HERO
===================================================== */

.hero .site-logo,
.hero ~ .site-logo{
  max-width:190px;
}

.hero-content{
  max-width:700px;
}

.hero h1{
  font-family:"Manrope",sans-serif;
  font-weight:800;
  letter-spacing:-2.4px;
  line-height:1.02;
}

.hero-subtitle{
  color:rgba(255,255,255,.70);
  max-width:620px;
  line-height:1.65;
}

.hero-actions{
  margin-top:24px;
}

.hero-actions .hero-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:0;
  min-height:0;
  color:#f4f8ff;
  font-weight:700;
  text-decoration:none;
}

.hero-actions .hero-link span{
  color:#8eb6ff;
  font-size:20px;
  transition:transform .2s ease;
}

.hero-actions .hero-link:hover span{
  transform:translateY(3px);
}

.hero-actions:has(.hero-link:only-child){
  margin-top:26px;
}

.hero-trust{
  display:none !important;
}

.funnel{
  margin-top:32px;
}

.funnel-title{
  display:block;
  margin-bottom:13px;
  font-size:11px;
  letter-spacing:1.7px;
  font-weight:800;
  color:rgba(255,255,255,.68);
}

.funnel-card{
  transition:
    transform .2s ease,
    border-color .2s ease,
    background .2s ease;
}

.funnel-card:hover{
  transform:translateY(-2px);
  border-color:rgba(151,190,255,.42);
  background:rgba(255,255,255,.075);
}

/* Logo menor e com mais respiro */
.site-header .site-logo{
  width:auto;
  max-width:185px;
  max-height:72px;
  object-fit:contain;
}

/* Mobile */
@media(max-width:700px){

  .site-header .site-logo{
    max-width:165px;
    max-height:64px;
  }

  .hero{
    padding-top:34px;
    padding-bottom:48px;
  }

  .hero h1{
    font-size:clamp(38px,10.8vw,48px);
    line-height:1.03;
    letter-spacing:-2px;
  }

  .hero-subtitle{
    margin-top:18px;
    font-size:16px;
    line-height:1.58;
    color:rgba(255,255,255,.72);
  }

  .hero-actions{
    margin-top:23px;
  }

  .hero-actions .hero-link{
    font-size:16px;
  }

  .funnel{
    margin-top:29px;
  }

  .funnel-title{
    margin-bottom:11px;
    font-size:10px;
    letter-spacing:1.5px;
  }

  .funnel-grid{
    gap:13px;
  }

  .funnel-card{
    min-height:82px;
  }

}

/* =====================================================
   WEKON v41 — ALINHAMENTO COM A PROPOSTA COMERCIAL 2026
===================================================== */

/* Indicadores de presença nacional */
.national-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:22px;
  max-width:590px;
}

.national-stats > div{
  padding:14px 15px;
  border:1px solid rgba(21,148,71,.15);
  border-radius:14px;
  background:rgba(255,255,255,.52);
  box-shadow:0 8px 24px rgba(25,50,75,.045);
}

.national-stats strong{
  display:block;
  color:var(--wekon-green);
  font-size:21px;
  line-height:1.05;
  letter-spacing:-.7px;
  font-weight:800;
}

.national-stats span{
  display:block;
  margin-top:5px;
  color:#6a7784;
  font-size:10px;
  line-height:1.3;
  font-weight:700;
}

/* Destinos internos usados enquanto as páginas específicas não possuem
   URL externa cadastrada. Mantém o clique funcional sem poluir a interface. */
.feature-destinations{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.feature-destination{
  scroll-margin-top:90px;
}

/* Marketplaces: ícones compactos e consistentes */
.marketplace-card{
  text-decoration:none;
  color:inherit;
}

.marketplace-card .integration-brand{
  margin-bottom:9px;
}

.marketplace-card .integration-generic-icon{
  width:34px;
  height:34px;
  border-radius:10px;
  font-size:12px;
  letter-spacing:-.2px;
}

.marketplace-card-more{
  cursor:pointer;
}

/* Mais respiro no Web quando o conteúdo cresce */
#sg-master-web .details-content{
  max-height:none;
}

#sg-master-web .feature-group + .feature-group{
  margin-top:14px;
}

@media(max-width:700px){
  .national-stats{
    grid-template-columns:1fr;
    gap:8px;
    max-width:100%;
  }

  .national-stats > div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:11px 13px;
  }

  .national-stats strong{
    font-size:18px;
  }

  .national-stats span{
    margin-top:0;
    text-align:right;
  }

  #sg-master-web .product-mini-tags,
  #sg-agenda .product-mini-tags{
    flex-wrap:wrap;
  }
}

/* Versões do SG Master — informação comercial da proposta */
.product-version-line{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:8px 0 4px;
}

.product-version-line span{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 9px;
  border-radius:999px;
  background:#eef7f1;
  color:#27704e;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.15px;
}

/* =====================================================
   WEKON v43 — SEGMENTOS COMPACTOS
   Alteração somente na seção existente.
===================================================== */

.compact-segments-section{
  padding:64px 0 68px;
  background:#f7fafb;
  border-top:1px solid #e7edf0;
  border-bottom:1px solid #e7edf0;
}

.segments-inner{
  width:min(1040px,calc(100% - 40px));
  margin:0 auto;
}

.segments-heading{
  text-align:center;
  max-width:650px;
  margin:0 auto 30px;
}

.segments-heading .section-eyebrow{
  display:block;
  margin-bottom:9px;
  color:#159447;
  font-size:9.5px;
  letter-spacing:2.2px;
  line-height:1.2;
  font-weight:800;
}

.segments-heading h2{
  margin:0;
  color:#101b2d;
  font-family:"Manrope",sans-serif;
  font-size:clamp(25px,3vw,33px);
  line-height:1.15;
  letter-spacing:-1.1px;
  font-weight:800;
}

.segments-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:10px 12px;
  max-width:900px;
  margin:0 auto;
}

.segment-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#4f5d67;
  font-family:"Manrope",sans-serif;
  font-size:11px;
  line-height:1.2;
  font-weight:600;
  white-space:nowrap;
}

.segment-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#159447;
  font-size:8px;
}

@media(max-width:700px){

  .compact-segments-section{
    padding:48px 0 52px;
  }

  .segments-inner{
    width:calc(100% - 28px);
  }

  .segments-heading{
    margin-bottom:22px;
  }

  .segments-heading .section-eyebrow{
    font-size:8.5px;
    letter-spacing:1.8px;
  }

  .segments-heading h2{
    font-size:24px;
    letter-spacing:-.8px;
  }

  .segments-list{
    gap:11px 14px;
  }

  .segment-item{
    font-size:10px;
  }

}


/* =====================================================
   WEKON v43 — CORREÇÃO DE RESPONSIVIDADE
   -----------------------------------------------------
   Mantém:
   - SG Master e seus módulos
   - Apps e Integrações dentro do SG Master
   - Segmentos compactos, sem botões
   - Marketplaces como seção própria
   - Presença Nacional
   - Logo ajustada
   -----------------------------------------------------
   Este bloco apenas reforça o layout em larguras
   diferentes e evita que estilos antigos desmontem
   as seções.
===================================================== */

/* Base segura de containers */
.container{
  width:min(calc(100% - 40px),1180px);
  margin-left:auto;
  margin-right:auto;
}

/* =====================================================
   SEGMENTOS — COMPACTOS, SEM BOTÕES
===================================================== */

.compact-segments-section{
  width:100%;
  display:block;
  padding:52px 0 54px;
  background:#f7fafb;
  border-top:1px solid #e7edf0;
  border-bottom:1px solid #e7edf0;
}

.compact-segments-section .segments-inner{
  width:min(1040px,calc(100% - 40px));
  margin-left:auto;
  margin-right:auto;
}

.compact-segments-section .segments-heading{
  display:block;
  width:100%;
  max-width:680px;
  margin:0 auto 24px;
  text-align:center;
}

.compact-segments-section .segments-heading h2{
  display:block;
  margin:0;
}

.compact-segments-section .segments-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  width:100%;
  max-width:940px;
  margin:0 auto;
  gap:8px 16px;
}

.compact-segments-section .segment-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:auto;
  max-width:100%;
  white-space:nowrap;
  color:#4f5d67;
  font-family:"Manrope",sans-serif;
  font-size:11px;
  line-height:1.35;
  font-weight:650;
}

.compact-segments-section .segment-icon{
  display:inline-flex;
  flex:0 0 5px;
  width:5px;
  height:5px;
  margin:0;
  border-radius:50%;
  background:#159447;
}

/* =====================================================
   INTEGRAÇÕES / MARKETPLACES
===================================================== */

.marketplaces-section{
  width:100%;
  display:block;
  padding:52px 0;
}

.marketplaces-section > .container{
  width:min(calc(100% - 40px),1180px);
  margin-left:auto;
  margin-right:auto;
}

.marketplaces-section .section-intro{
  max-width:720px;
}

.marketplaces-section .marketplace-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  width:100%;
  margin:22px 0 0;
}

.marketplaces-section .marketplace-card{
  min-width:0;
  width:100%;
  min-height:112px;
  padding:16px;
  box-sizing:border-box;
}

.marketplaces-section .integration-brand{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.marketplaces-section .integration-brand strong{
  display:block;
  line-height:1.2;
}

/* =====================================================
   PRESENÇA NACIONAL
===================================================== */

.national-reach{
  width:100%;
  display:block;
  overflow:hidden;
}

.national-reach .national-inner{
  width:min(calc(100% - 40px),1180px);
  margin-left:auto;
  margin-right:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);
  gap:42px;
  align-items:center;
}

.national-copy{
  min-width:0;
}

.brazil-visual{
  min-width:0;
  width:100%;
}

.brazil-illustration{
  width:min(100%,470px);
  margin-left:auto;
  margin-right:auto;
}

/* =====================================================
   LOGO — CORREÇÃO USADA NA V41
===================================================== */

.site-header .brand{
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
}

.site-header .site-logo{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:185px !important;
  max-height:56px !important;
  object-fit:contain !important;
  flex:0 0 auto !important;
}

/* =====================================================
   DESKTOP INTERMEDIÁRIO
===================================================== */

@media (max-width:1000px){

  .marketplaces-section .marketplace-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .national-reach .national-inner{
    grid-template-columns:minmax(0,1fr) minmax(250px,.8fr);
    gap:30px;
  }

}

/* =====================================================
   TABLET / CELULAR
===================================================== */

@media (max-width:700px){

  .container{
    width:calc(100% - 32px);
  }

  .compact-segments-section{
    padding:42px 0 44px;
  }

  .compact-segments-section .segments-inner{
    width:calc(100% - 28px);
  }

  .compact-segments-section .segments-heading{
    margin-bottom:20px;
  }

  .compact-segments-section .segments-heading h2{
    font-size:24px;
    line-height:1.14;
    letter-spacing:-.8px;
  }

  .compact-segments-section .segments-list{
    justify-content:center;
    gap:9px 13px;
  }

  .compact-segments-section .segment-item{
    font-size:10px;
  }

  .marketplaces-section{
    padding:42px 0;
  }

  .marketplaces-section > .container{
    width:calc(100% - 32px);
  }

  .marketplaces-section .marketplace-grid{
    grid-template-columns:1fr;
    gap:10px;
    margin-top:18px;
  }

  .marketplaces-section .marketplace-card{
    min-height:92px;
    padding:15px;
  }

  .national-reach .national-inner{
    grid-template-columns:1fr;
    gap:24px;
  }

  .national-copy{
    max-width:none;
  }

  .brazil-visual{
    min-height:0;
  }

  .brazil-illustration{
    width:min(100%,390px);
  }

  .site-header .site-logo{
    max-width:165px !important;
    max-height:48px !important;
  }

}

/* =====================================================
   CELULARES PEQUENOS
===================================================== */

@media (max-width:380px){

  .container{
    width:calc(100% - 26px);
  }

  .compact-segments-section .segments-inner{
    width:calc(100% - 26px);
  }

  .compact-segments-section .segment-item{
    font-size:9.5px;
  }

  .marketplaces-section > .container{
    width:calc(100% - 26px);
  }

}


/* =====================================================
   WEKON — CENTRALIZAÇÃO DESKTOP
   -----------------------------------------------------
   O mobile já está funcionando corretamente.
   Estas regras atuam somente acima de 700px.
===================================================== */

@media (min-width:701px){

  /* Cards de produtos que estão fora de .container
     passam a respeitar a mesma largura central do site. */
  .product-grid-main{
    width:min(calc(100% - 40px),1180px);
    margin-left:auto;
    margin-right:auto;
  }

  /* Website institucional também fica centralizado,
     sem ocupar toda a largura da tela. */
  .website-card{
    width:min(calc(100% - 40px),1180px);
    margin-left:auto;
    margin-right:auto;
    box-sizing:border-box;
  }

  /* Conteúdo interno do website mantém leitura confortável. */
  .website-card > div{
    width:100%;
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
  }

  /* Mantém a hierarquia visual do bloco de atendimento. */
  .support > .container,
  .contact-inner{
    margin-left:auto;
    margin-right:auto;
  }

  /* Seções que possuem elementos fora de um container
     continuam alinhadas ao eixo principal do site. */
  .segments-inner,
  .value-row-section > .container,
  .marketplaces-section > .container,
  .national-reach > .container{
    margin-left:auto;
    margin-right:auto;
  }

}

/* Telas grandes: evita que o conteúdo fique excessivamente
   espalhado horizontalmente. */
@media (min-width:1400px){

  .product-grid-main,
  .website-card{
    max-width:1180px;
  }

}


/* =====================================================
   WEKON — ATENDIMENTO / DESKTOP
   ===================================================== */

@media (min-width:701px){

  .support{
    width:100%;
  }

  .support > .container{
    width:min(calc(100% - 40px),1180px);
    margin-left:auto;
    margin-right:auto;
  }

  .support .support-intro{
    max-width:760px;
    margin-left:0;
    margin-right:auto;
  }

  .support .support-grid{
    width:100%;
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:stretch;
  }

  .support .support-item{
    min-width:0;
    box-sizing:border-box;
  }

  .support .support-actions{
    width:100%;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    margin-top:24px;
  }

}

@media (max-width:700px){

  .support .support-actions{
    width:100%;
  }

}


/* =====================================================
   WEKON — WEBSITE / BLOCO CENTRALIZADO
   -----------------------------------------------------
   O bloco não deve ocupar a largura total da tela.
   No desktop ele segue o mesmo eixo visual do conteúdo.
===================================================== */

@media (min-width:701px){

  #website.website-card{
    display:block;
    width:min(1180px, calc(100vw - 80px));
    max-width:1180px;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box;
  }

  #website.website-card > div{
    width:100%;
    max-width:none;
    margin-left:0;
    margin-right:0;
    box-sizing:border-box;
  }

}

/* Telas muito grandes: mantém respiro lateral */
@media (min-width:1280px){

  #website.website-card{
    width:1180px;
  }

}


/* =====================================================
   WEKON — ATENDIMENTO NO MESMO PADRÃO DO WEBSITE
   -----------------------------------------------------
   Desktop:
   - bloco escuro centralizado
   - mesma largura máxima do Website
   - conteúdo alinhado internamente
   - sem faixa escura ocupando a tela inteira
   Mobile:
   - não altera o layout que já está funcionando
===================================================== */

@media (min-width:701px){

  .support{
    width:min(1180px, calc(100vw - 80px)) !important;
    max-width:1180px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:38px 35px !important;
    box-sizing:border-box !important;
    border-radius:15px;
  }

  .support > .container{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box;
  }

  .support-heading{
    width:100%;
    max-width:760px;
    margin-left:0;
    margin-right:auto;
  }

  .support-grid{
    width:100% !important;
    max-width:none !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    margin-left:0;
    margin-right:0;
  }

}

@media (min-width:1280px){

  .support{
    width:1180px !important;
  }

}


/* =====================================================
   WEKON — AJUSTE DE TIPOGRAFIA DESKTOP
   -----------------------------------------------------
   Aumenta somente textos pequenos no desktop.
   Mobile permanece exatamente como estava.
===================================================== */

@media (min-width:701px){

  .interactive-item span{
    font-size:11px;
  }

  .master-modules summary small{
    font-size:11px;
  }

  .compact-feature-link{
    font-size:11px;
  }

  .marketplace-card span{
    font-size:12px;
  }

  .marketplace-card strong{
    font-size:14px;
  }

  .support-item p{
    font-size:14px;
  }

  .national-points span{
    font-size:13px;
  }

  footer p{
    font-size:12px;
  }

}


/* =====================================================
   WEKON — TIPOGRAFIA CLIENTE / DESKTOP
   ===================================================== */

@media (min-width:701px){

  .interactive-item span{
    font-size:12px !important;
    line-height:1.45;
  }

  .master-modules summary small{
    font-size:12px !important;
    line-height:1.4;
  }

  .compact-feature-link{
    font-size:12px !important;
    line-height:1.45;
  }

  .master-modules summary{
    font-size:14px !important;
    line-height:1.3;
  }

  .master-modules p,
  .master-modules li{
    font-size:13px;
    line-height:1.55;
  }

  .marketplace-card span{
    font-size:13px !important;
    line-height:1.4;
  }

  .marketplace-card strong{
    font-size:15px !important;
    line-height:1.25;
  }

  .compact-segments-section .segment-item{
    font-size:12.5px !important;
    line-height:1.45;
  }

  .support-item h3{
    font-size:15px !important;
    line-height:1.3;
  }

  .support-item p{
    font-size:14px !important;
    line-height:1.55;
  }

  .national-points span{
    font-size:13px !important;
    line-height:1.45;
  }

  footer p{
    font-size:12px !important;
    line-height:1.5;
  }

  .section-eyebrow,
  .eyebrow,
  .green-eyebrow{
    font-size:10.5px;
    line-height:1.3;
  }

  .interactive-item span,
  .master-modules p,
  .master-modules li,
  .compact-feature-link,
  .marketplace-card span,
  .support-item p,
  .national-points span,
  footer p{
    color:#465560;
  }

}


/* =====================================================
   WEKON — HIERARQUIA DESKTOP / LEITURA DO CLIENTE
   -----------------------------------------------------
   Aumenta os menores textos e reforça contraste.
   Mobile permanece sem alteração.
===================================================== */

@media (min-width:701px){

  /* Regra geral: informação que precisa ser lida
     não fica abaixo de 12px no desktop. */

  .eyebrow,
  .section-eyebrow,
  .green-eyebrow{
    font-size:11px !important;
    letter-spacing:.18em;
  }

  .product-label,
  .product-grid-main .product-card-featured .product-label{
    font-size:11.5px !important;
  }

  .benefit-row span,
  .about-mini-points span,
  .national-points span,
  .national-stats span{
    font-size:12.5px !important;
    line-height:1.5;
  }

  .number{
    font-size:12px !important;
  }

  .funnel-text small,
  .funnel-title{
    font-size:12px !important;
    line-height:1.45;
  }

  .addon-card > span,
  .differentiator > span{
    font-size:12.5px !important;
    line-height:1.5;
  }

  .segment span,
  .segment-item,
  .compact-segments-section .segment-item{
    font-size:12.5px !important;
    line-height:1.5;
  }

  .segment-icon{
    font-size:10px !important;
  }

  /* SG Master */
  #sg-master .benefit-row strong{
    font-size:12px !important;
  }

  #sg-master .master-resources summary small,
  #sg-master .solution-group summary small,
  .master-modules summary small,
  .module-heading-row p{
    font-size:12px !important;
    line-height:1.45;
  }

  #sg-master .master-resources .resource-list span,
  #sg-master .solution-group summary strong,
  .feature-tags span,
  .product-mini-tags span,
  .master-resources .resource-list span{
    font-size:12px !important;
  }

  .feature-group > strong{
    font-size:12.5px !important;
  }

  .anchor-link,
  .compact-feature-link{
    font-size:12px !important;
  }

  .interactive-notice,
  .interactive-hint,
  #sg-master .interactive-hint{
    font-size:12px !important;
    line-height:1.5;
  }

  .ecosystem-kicker{
    font-size:11px !important;
  }

  .ecosystem-heading p{
    font-size:13px !important;
    line-height:1.5;
  }

  .interactive-item strong{
    font-size:13px !important;
  }

  .interactive-item span{
    font-size:12px !important;
    line-height:1.5;
  }

  /* Marketplace / integrações */
  .marketplace-card span{
    font-size:13px !important;
    line-height:1.45;
  }

  .marketplace-card strong{
    font-size:15px !important;
  }

  .country-chip,
  .international-list span{
    font-size:12px !important;
  }

  .availability-label{
    font-size:11px !important;
  }

  /* Texto do mapa e estatísticas */
  .value-item span:not(.value-icon){
    font-size:12px !important;
  }

  .brazil-label{
    font-size:18px !important;
  }

  /* Rodapé */
  footer p{
    font-size:12px !important;
    line-height:1.5;
  }

  /* Contraste dos textos secundários:
     mais presença sem deixar o visual pesado. */
  .product-label,
  .benefit-row span,
  .about-mini-points span,
  .national-points span,
  .national-stats span,
  .funnel-text small,
  .addon-card > span,
  .differentiator > span,
  .segment span,
  .segment-item,
  #sg-master .master-resources summary small,
  #sg-master .solution-group summary small,
  .master-modules summary small,
  .module-heading-row p,
  #sg-master .master-resources .resource-list span,
  .feature-tags span,
  .product-mini-tags span,
  .interactive-notice,
  .interactive-hint,
  .ecosystem-heading p,
  .interactive-item span,
  .marketplace-card span,
  footer p{
    color:#465665 !important;
  }

}


/* =====================================================
   WEKON — LEITURA CONFORTÁVEL / DESKTOP
   -----------------------------------------------------
   Projeto pensado para leitura confortável por clientes
   com visão reduzida ou que estejam em telas grandes.
   Nenhuma regra abaixo afeta o mobile.
===================================================== */

@media (min-width:701px){

  /* Regra principal:
     informação de conteúdo nunca fica abaixo de 13px. */

  .product-lead{
    font-size:16px !important;
    line-height:1.55 !important;
  }

  .interactive-hint{
    font-size:13px !important;
    line-height:1.55 !important;
  }

  .product-version-line span{
    font-size:12px !important;
  }

  /* SG Master */
  .master-modules summary{
    padding:14px 15px !important;
  }

  .master-modules summary strong{
    font-size:15px !important;
    line-height:1.3;
  }

  .master-modules summary small{
    font-size:13px !important;
    line-height:1.45;
  }

  .compact-feature-link{
    min-height:38px !important;
    padding:9px 11px !important;
    font-size:13px !important;
    line-height:1.4;
  }

  .compact-feature-link b{
    font-size:14px !important;
  }

  /* Destinos de recursos */
  .feature-destination strong{
    font-size:14px !important;
  }

  .feature-destination span{
    font-size:13px !important;
    line-height:1.55 !important;
  }

  /* Cards e integrações */
  .interactive-item{
    min-height:72px !important;
    padding:12px 34px 11px 13px !important;
  }

  .interactive-item strong{
    font-size:14px !important;
    line-height:1.35 !important;
  }

  .interactive-item span{
    font-size:13px !important;
    line-height:1.5 !important;
  }

  .marketplace-card{
    min-height:108px !important;
  }

  .marketplace-card strong{
    font-size:15px !important;
  }

  .marketplace-card span{
    font-size:13px !important;
    line-height:1.5 !important;
  }

  /* Segmentos compactos */
  .compact-segments-section .segment-item{
    font-size:13px !important;
    line-height:1.55 !important;
  }

  .compact-segments-section .segment-icon{
    font-size:11px !important;
  }

  /* Atendimento */
  .support-item>span{
    font-size:12px !important;
  }

  .support-item h3{
    font-size:16px !important;
    line-height:1.35 !important;
  }

  .support-item p{
    font-size:14px !important;
    line-height:1.6 !important;
  }

  /* Informações institucionais */
  .national-points span,
  .national-stats span{
    font-size:14px !important;
    line-height:1.55 !important;
  }

  /* Textos auxiliares do restante da página */
  .benefit-row span,
  .about-mini-points span,
  .funnel-text small,
  .addon-card > span,
  .differentiator > span{
    font-size:13px !important;
    line-height:1.55 !important;
  }

  /* Etiquetas continuam menores para preservar hierarquia,
     mas não ficam microscópicas. */
  .product-label,
  .section-eyebrow,
  .eyebrow,
  .green-eyebrow{
    font-size:11px !important;
    line-height:1.35 !important;
  }

  /* Rodapé */
  footer p{
    font-size:13px !important;
    line-height:1.55 !important;
  }

  /* Contraste mais confortável */
  .product-lead,
  .interactive-hint,
  .master-modules summary small,
  .feature-destination span,
  .interactive-item span,
  .marketplace-card span,
  .compact-segments-section .segment-item,
  .support-item p,
  .national-points span,
  .national-stats span,
  .benefit-row span,
  .about-mini-points span,
  .funnel-text small,
  .addon-card > span,
  .differentiator > span,
  footer p{
    color:#344454 !important;
  }

  /* No bloco escuro, preserva o contraste adequado. */
  .support .support-item p{
    color:#c2ccd8 !important;
  }

}


/* =====================================================
   WEKON — HIERARQUIA TIPOGRÁFICA FINAL / DESKTOP
   -----------------------------------------------------
   Texto principal: 16px
   Texto secundário: 14px
   Etiquetas auxiliares: 12px
   Mobile preservado.
===================================================== */

@media (min-width:701px){

  .product-lead,
  .product-description,
  .section-description,
  .section-intro p{
    font-size:16px !important;
    line-height:1.6 !important;
  }

  .interactive-hint,
  .feature-destination span,
  .interactive-item span,
  .marketplace-card span,
  .support-item p,
  .national-points span,
  .national-stats span,
  .benefit-row span,
  .about-mini-points span,
  .funnel-text small,
  .addon-card > span,
  .differentiator > span,
  .master-modules summary small,
  .master-modules p,
  .master-modules li,
  footer p{
    font-size:14px !important;
    line-height:1.55 !important;
  }

  .master-modules summary strong,
  .interactive-item strong,
  .marketplace-card strong,
  .support-item h3{
    font-size:16px !important;
    line-height:1.35 !important;
  }

  .feature-destination strong{
    font-size:15px !important;
    line-height:1.35 !important;
  }

  .compact-feature-link{
    font-size:14px !important;
    line-height:1.45 !important;
  }

  .compact-feature-link b{
    font-size:15px !important;
  }

  .compact-segments-section .segment-item,
  .segment span,
  .segment-item{
    font-size:14px !important;
    line-height:1.5 !important;
  }

  #sg-master .benefit-row strong,
  .feature-group > strong{
    font-size:14px !important;
  }

  #sg-master .master-resources summary small,
  #sg-master .solution-group summary small,
  .module-heading-row p,
  .feature-tags span,
  .product-mini-tags span,
  .master-resources .resource-list span,
  #sg-master .master-resources .resource-list span{
    font-size:14px !important;
    line-height:1.5 !important;
  }

  #sg-master .solution-group summary strong{
    font-size:15px !important;
  }

  .interactive-notice,
  .interactive-hint,
  #sg-master .interactive-hint{
    font-size:14px !important;
    line-height:1.55 !important;
  }

  .product-label,
  .section-eyebrow,
  .eyebrow,
  .green-eyebrow,
  .ecosystem-kicker,
  .availability-label{
    font-size:12px !important;
    line-height:1.35 !important;
  }

  .marketplace-card{
    min-height:112px !important;
  }

  .marketplace-card strong{
    font-size:16px !important;
  }

  .marketplace-card span{
    font-size:14px !important;
  }

  .brazil-label{
    font-size:18px !important;
  }

  .value-item span:not(.value-icon){
    font-size:14px !important;
  }

  .product-lead,
  .product-description,
  .section-description,
  .section-intro p,
  .interactive-hint,
  .feature-destination span,
  .interactive-item span,
  .marketplace-card span,
  .national-points span,
  .national-stats span,
  .benefit-row span,
  .about-mini-points span,
  .funnel-text small,
  .addon-card > span,
  .differentiator > span,
  .master-modules summary small,
  .master-modules p,
  .master-modules li,
  .compact-feature-link,
  .compact-segments-section .segment-item,
  footer p{
    color:#344454 !important;
  }

  .support .support-item p{
    color:#d0d8e2 !important;
  }

}


/* =====================================================
   WEKON — PRESENÇA NACIONAL / DESKTOP CENTRALIZADO
   -----------------------------------------------------
   Corrige a distribuição visual da seção no desktop.
   O mapa permanece no lado direito, centralizado na sua
   coluna, enquanto o conteúdo fica equilibrado à esquerda.
   Mobile preservado.
===================================================== */

@media (min-width:1001px){

  .national-inner{
    width:min(100% - 48px, 1180px) !important;
    margin-inline:auto !important;
    grid-template-columns:minmax(0, 1fr) minmax(360px, 430px) !important;
    gap:50px !important;
    align-items:center !important;
  }

  .national-copy{
    width:100%;
    max-width:680px !important;
    margin-inline:auto;
  }

  .national-copy h2{
    max-width:680px !important;
    margin-inline:auto;
  }

  .national-copy p{
    max-width:650px !important;
    margin-inline:auto;
  }

  .national-stats{
    width:100%;
    max-width:650px;
    margin:20px auto 0 !important;
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px;
  }

  .national-stats > div{
    min-width:0;
    padding:14px 15px;
    box-sizing:border-box;
  }

  .national-stats strong{
    font-size:17px !important;
    line-height:1.25;
  }

  .national-stats span{
    display:block;
    margin-top:4px;
    font-size:14px !important;
    line-height:1.45;
  }

  .brazil-visual{
    width:100%;
    min-height:320px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
  }

  .brazil-illustration{
    width:min(100%, 370px) !important;
    max-width:370px !important;
    margin-inline:auto;
  }

  .brazil-cartoon{
    width:100%;
    display:block;
  }

}

/* Telas muito largas: evita que a seção fique pequena
   demais no centro da página. */
@media (min-width:1400px){

  .national-inner{
    max-width:1240px !important;
    grid-template-columns:minmax(0, 700px) minmax(390px, 1fr) !important;
  }

  .national-copy{
    max-width:700px !important;
  }

  .brazil-illustration{
    width:390px !important;
    max-width:390px !important;
  }

}

/* Mantém o comportamento compacto em telas menores. */
@media (max-width:1000px){

  .national-inner{
    width:auto !important;
    margin:0 !important;
  }

}


/* =====================================================
   WEKON — PRODUTOS / DESKTOP CENTRALIZADO
   -----------------------------------------------------
   SG Master WEB + SG Agenda ficam centralizados como
   um único conjunto visual.
   O restante do site não é alterado.
   Mobile preservado.
===================================================== */

@media (min-width:1001px){

  .product-grid-main{
    width:min(100% - 48px, 920px) !important;
    margin:10px auto 0 !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:18px !important;
    justify-content:center !important;
    align-items:stretch !important;
  }

  .product-grid-main .product-card{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box;
  }

  .product-grid-main .product-card-international{
    min-height:245px !important;
    padding:22px !important;
  }

  .product-grid-main .product-card h3{
    font-size:20px !important;
    line-height:1.25 !important;
    margin:8px 0 10px !important;
  }

  .product-grid-main .product-card .product-lead{
    display:block !important;
    font-size:14px !important;
    line-height:1.55 !important;
    margin:0 0 14px !important;
    color:#344454 !important;
  }

  .product-grid-main .product-label{
    font-size:12px !important;
    line-height:1.35 !important;
    letter-spacing:.16em;
  }

  .product-grid-main .product-mini-tags{
    display:flex !important;
    flex-wrap:wrap;
    gap:7px !important;
    margin:8px 0 14px !important;
  }

  .product-grid-main .product-mini-tags span{
    font-size:12px !important;
    line-height:1.35 !important;
    padding:5px 9px !important;
  }

  .product-grid-main .compact-details{
    margin-top:8px !important;
  }

  .product-grid-main .compact-details summary{
    min-height:42px !important;
    padding:9px 12px !important;
    font-size:14px !important;
  }

}

/* Em monitores muito largos, aumenta o conjunto sem
   deixá-lo ocupar a página inteira. */
@media (min-width:1400px){

  .product-grid-main{
    max-width:980px !important;
    gap:20px !important;
  }

}

/* A partir daqui o comportamento volta ao CSS original
   para tablet/celular. */
@media (max-width:1000px){

  .product-grid-main{
    width:auto !important;
  }

}


/* =====================================================
   WEKON — ACORDEÃO WEB + SG AGENDA
===================================================== */

@media (min-width:1001px){

  .product-grid-main{
    align-items:start !important;
  }

  .product-grid-main .product-card{
    align-self:start !important;
    height:auto !important;
    overflow:visible !important;
  }

  .product-grid-main .compact-details{
    width:100%;
    box-sizing:border-box;
  }

  .product-grid-main .compact-details summary{
    cursor:pointer;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px;
    min-height:42px !important;
    box-sizing:border-box;
  }

  .product-grid-main .compact-details .details-content{
    width:100%;
    box-sizing:border-box;
    margin-top:10px !important;
    padding-top:4px !important;
  }

  /* O conteúdo aparece naturalmente abaixo do botão,
     sem posição absoluta. */
  .product-grid-main .compact-details[open]{
    height:auto !important;
  }

  .product-grid-main .compact-details[open] .details-content{
    animation: wekonslideDown .18s ease-out;
  }

  @keyframes wekonslideDown{
    from{
      opacity:0;
      transform:translateY(-4px);
    }
    to{
      opacity:1;
      transform:translateY(0);
    }
  }

}

@media (max-width:1000px){

  .product-grid-main .compact-details .details-content{
    position:static !important;
    width:100% !important;
  }

}


/* =====================================================
   WEKON — 3 PRODUTOS EM LINHA / DESKTOP
   SG Master • SG Master WEB • SG Agenda
   -----------------------------------------------------
   Todos os três produtos ficam no mesmo grid no desktop.
   Ao abrir "Ver recursos", o conteúdo cresce para baixo.
   O JS fecha automaticamente outro produto aberto.
   Mobile permanece no fluxo vertical original.
===================================================== */

@media (min-width:1001px){

  .products-showcase{
    width:min(100% - 48px, 1240px) !important;
    margin:18px auto 0 !important;
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:18px !important;
    align-items:start !important;
  }

  .products-showcase > #sg-master,
  .products-showcase > .product-grid-main{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  /* O antigo grid agora deixa de ser um grid próprio:
     seus dois cards viram diretamente as colunas 2 e 3. */
  .products-showcase > .product-grid-main{
    display:contents !important;
  }

  .products-showcase > #sg-master{
    grid-column:1 !important;
    align-self:start !important;
  }

  .products-showcase > .product-grid-main > #sg-master-web{
    grid-column:2 !important;
    width:100% !important;
  }

  .products-showcase > .product-grid-main > #sg-agenda{
    grid-column:3 !important;
    width:100% !important;
  }

  .products-showcase .product-card{
    box-sizing:border-box;
    align-self:start !important;
    height:auto !important;
    overflow:visible !important;
  }

  /* Altura visual consistente antes da abertura. */
  .products-showcase > #sg-master,
  .products-showcase > .product-grid-main > .product-card{
    min-height:260px !important;
  }

  .products-showcase .product-card h3{
    font-size:20px !important;
    line-height:1.25 !important;
  }

  .products-showcase .product-lead{
    font-size:14px !important;
    line-height:1.55 !important;
  }

  /* Todos os acordeões crescem para baixo. */
  .products-showcase .compact-details{
    width:100% !important;
    height:auto !important;
    overflow:visible !important;
  }

  .products-showcase .compact-details summary{
    min-height:44px !important;
    box-sizing:border-box;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px;
    cursor:pointer;
  }

  .products-showcase .compact-details .details-content{
    position:static !important;
    width:100% !important;
    box-sizing:border-box;
    margin-top:10px !important;
    padding-top:2px !important;
  }

  .products-showcase .compact-details[open] .details-content{
    animation:wekonProductOpen .18s ease-out;
  }

  @keyframes wekonProductOpen{
    from{
      opacity:0;
      transform:translateY(-4px);
    }
    to{
      opacity:1;
      transform:translateY(0);
    }
  }

  /* Evita que os conteúdos abertos empurrem visualmente
     outros cards para cima/baixo de forma inesperada. */
  .products-showcase .product-card{
    z-index:1;
  }

  .products-showcase .product-card:has(.compact-details[open]){
    z-index:3;
  }

}

@media (min-width:1400px){

  .products-showcase{
    max-width:1280px !important;
    gap:20px !important;
  }

}

@media (max-width:1000px){

  .products-showcase{
    display:block !important;
    width:auto !important;
    margin:0 !important;
  }

  .products-showcase > .product-grid-main{
    display:grid !important;
  }

}


/* =====================================================
   WEKON — AJUSTE FINAL DOS 3 PRODUTOS / DESKTOP
   -----------------------------------------------------
   Objetivos:
   • aproveitar melhor a largura disponível;
   • manter SG Master / WEB / Agenda simétricos;
   • impedir corte das setas dos recursos;
   • preservar todas as funções e o mobile.
===================================================== */

@media (min-width:1001px){

  /* O conjunto usa melhor a largura do container. */
  .products-showcase{
    width:100% !important;
    max-width:none !important;
    grid-template-columns:
      minmax(0, 1fr)
      minmax(0, 1fr)
      minmax(0, 1fr) !important;
    gap:20px !important;
    align-items:start !important;
  }

  .products-showcase > #sg-master,
  .products-showcase > .product-grid-main > #sg-master-web,
  .products-showcase > .product-grid-main > #sg-agenda{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    align-self:start !important;
  }

  /* Evita que qualquer conteúdo interno provoque
     overflow horizontal. */
  .products-showcase .product-card,
  .products-showcase .master-modules,
  .products-showcase .master-modules-content,
  .products-showcase .compact-link-grid{
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  /* A seta nunca pode encolher ou ser cortada. */
  #sg-master .compact-feature-link{
    min-width:0 !important;
    width:100% !important;
    overflow:visible !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
    padding-left:9px !important;
    padding-right:9px !important;
  }

  #sg-master .compact-feature-link b{
    flex:0 0 auto !important;
    min-width:14px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin-left:auto !important;
  }

  /* O texto pode encolher; a seta não. */
  #sg-master .compact-feature-link{
    white-space:normal !important;
  }

  #sg-master .compact-feature-link:not(b){
    overflow-wrap:anywhere;
  }

  /* Respiro uniforme dentro dos três produtos. */
  .products-showcase > #sg-master{
    padding:22px !important;
  }

  .products-showcase > .product-grid-main > .product-card{
    padding:22px !important;
  }

  /* Os três títulos começam exatamente no mesmo ponto. */
  .products-showcase .product-label{
    display:block;
    min-height:17px;
    margin-bottom:7px !important;
  }

  .products-showcase .product-card h3{
    margin-top:0 !important;
    margin-bottom:10px !important;
  }

  .products-showcase .product-lead{
    margin-bottom:14px !important;
  }

  /* O botão Ver recursos ocupa toda a largura do card,
     mas mantém a seta dentro da área segura. */
  .products-showcase .compact-details summary{
    width:100% !important;
    padding-left:12px !important;
    padding-right:12px !important;
    box-sizing:border-box !important;
  }

  .products-showcase .compact-details summary .details-icon{
    flex:0 0 24px !important;
    width:24px !important;
    min-width:24px !important;
  }

  /* Quando o conteúdo abre, ele continua abaixo do
     respectivo produto sem sobrepor os demais. */
  .products-showcase .compact-details .details-content{
    position:static !important;
    width:100% !important;
    max-width:100% !important;
    overflow:visible !important;
    box-sizing:border-box !important;
  }

  #sg-master .master-modules-content{
    overflow:visible !important;
  }

  #sg-master .compact-link-grid{
    overflow:visible !important;
  }

}

/* Em monitores muito grandes, o container continua
   centralizado, mas aproveita melhor o espaço. */
@media (min-width:1400px){

  .products-showcase{
    gap:24px !important;
  }

  .products-showcase > #sg-master,
  .products-showcase > .product-grid-main > .product-card{
    padding:24px !important;
  }

}

/* Mobile permanece com o comportamento original. */
@media (max-width:1000px){

  .products-showcase{
    width:auto !important;
    max-width:none !important;
  }

}


/* =====================================================
   WEKON — 3 PRODUTOS / SEM SETAS
   -----------------------------------------------------
   Remove somente os indicadores visuais de seta dos
   botões/recursos dos três produtos.
   A função de abrir/fechar continua intacta.
   Mobile preservado.
===================================================== */

@media (min-width:701px){

  /* Esconde apenas a seta visual dos controles */
  .products-showcase .compact-details summary .details-icon,
  .products-showcase .compact-details summary::after,
  .products-showcase .compact-feature-link b,
  .products-showcase .compact-feature-link::after{
    display:none !important;
  }

  /* O texto passa a ocupar todo o espaço disponível. */
  .products-showcase .compact-details summary,
  .products-showcase .compact-feature-link{
    justify-content:flex-start !important;
    text-align:left !important;
    gap:0 !important;
  }

  .products-showcase .compact-feature-link{
    padding-right:12px !important;
  }

  .products-showcase .compact-details summary{
    padding-right:12px !important;
  }

}

/* Também remove setas puramente visuais nos três produtos
   em telas menores, sem alterar o funcionamento. */
@media (max-width:700px){

  .products-showcase .compact-details summary .details-icon,
  .products-showcase .compact-details summary::after,
  .products-showcase .compact-feature-link b,
  .products-showcase .compact-feature-link::after{
    display:none !important;
  }

}


/* =====================================================
   WEKON — CORREÇÃO DOS 3 PRODUTOS
   -----------------------------------------------------
   • Remove todas as setas visuais dos acordeões.
   • Não quebra palavras.
   • O texto quebra somente entre palavras.
   • A funcionalidade de abrir/fechar permanece.
===================================================== */

@media (min-width:701px){

  /* Remove o marcador nativo do <summary>. */
  .products-showcase .compact-details summary{
    list-style:none !important;
    -webkit-list-style:none !important;
  }

  .products-showcase .compact-details summary::-webkit-details-marker{
    display:none !important;
  }

  .products-showcase .compact-details summary::marker{
    display:none !important;
    content:"" !important;
  }

  /* Remove possíveis indicadores criados pelo CSS. */
  .products-showcase .compact-details summary::before,
  .products-showcase .compact-details summary::after,
  .products-showcase .compact-feature-link::before,
  .products-showcase .compact-feature-link::after{
    content:none !important;
    display:none !important;
  }

  /* Remove elementos de seta que possam existir no HTML. */
  .products-showcase .compact-details summary .details-icon,
  .products-showcase .compact-feature-link b{
    display:none !important;
  }

  /* Texto normal: pode quebrar entre palavras,
     mas jamais no meio da palavra. */
  .products-showcase .compact-details summary,
  .products-showcase .compact-feature-link,
  .products-showcase .compact-details summary *,
  .products-showcase .compact-feature-link *{
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }

  /* Evita que o texto seja comprimido até quebrar
     palavras desnecessariamente. */
  .products-showcase .compact-details summary,
  .products-showcase .compact-feature-link{
    white-space:normal !important;
    min-width:0 !important;
  }

  /* O texto principal do controle pode ocupar todo
     o espaço disponível. */
  .products-showcase .compact-details summary > span:first-child,
  .products-showcase .compact-feature-link > span:first-child{
    min-width:0 !important;
    flex:1 1 auto !important;
  }

}

/* No mobile, mesma regra de leitura: nunca cortar
   palavras ao meio e nenhum marcador de summary. */
@media (max-width:700px){

  .products-showcase .compact-details summary{
    list-style:none !important;
  }

  .products-showcase .compact-details summary::-webkit-details-marker{
    display:none !important;
  }

  .products-showcase .compact-details summary::marker{
    display:none !important;
    content:"" !important;
  }

  .products-showcase .compact-details summary::before,
  .products-showcase .compact-details summary::after,
  .products-showcase .compact-feature-link::before,
  .products-showcase .compact-feature-link::after{
    content:none !important;
    display:none !important;
  }

  .products-showcase .compact-details summary .details-icon,
  .products-showcase .compact-feature-link b{
    display:none !important;
  }

  .products-showcase .compact-details summary,
  .products-showcase .compact-feature-link,
  .products-showcase .compact-details summary *,
  .products-showcase .compact-feature-link *{
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }

}


/* =====================================================
   WEKON — V3 / 3 PRODUTOS LIMPOS E SIMÉTRICOS
   -----------------------------------------------------
   As setas "→" foram removidas do HTML dos três
   produtos. O "+" do acordeão permanece porque indica
   que há conteúdo expansível.
===================================================== */

@media (min-width:1001px){

  /* Três colunas com a mesma largura. */
  .products-showcase{
    width:min(100% - 48px, 1280px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:20px !important;
    align-items:start !important;
  }

  /* Todos os cards começam com a mesma área interna. */
  .products-showcase > #sg-master,
  .products-showcase > .product-grid-main > #sg-master-web,
  .products-showcase > .product-grid-main > #sg-agenda{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .products-showcase > #sg-master,
  .products-showcase > .product-grid-main > .product-card{
    padding:22px !important;
  }

  /* Remove qualquer reserva de espaço que existia
     para setas dos links internos. */
  .products-showcase .compact-feature-link{
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;
    padding-left:10px !important;
    padding-right:10px !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }

  /* Os controles Ver recursos ficam simétricos. */
  .products-showcase .compact-details summary{
    width:100% !important;
    min-height:44px !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:10px 12px !important;
  }

  .products-showcase .compact-details summary .details-icon{
    flex:0 0 24px !important;
    width:24px !important;
    height:24px !important;
    margin-left:auto !important;
  }

  /* Texto dos produtos nunca quebra palavra no meio. */
  .products-showcase,
  .products-showcase *{
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }

  /* O conteúdo aberto permanece abaixo do produto. */
  .products-showcase .compact-details .details-content{
    position:static !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }

  /* Os três títulos e etiquetas ficam alinhados. */
  .products-showcase .product-label{
    display:block !important;
    min-height:17px !important;
    margin-bottom:7px !important;
  }

  .products-showcase .product-card h3{
    margin-top:0 !important;
    margin-bottom:10px !important;
  }

  .products-showcase .product-lead{
    margin-bottom:14px !important;
  }

  /* Links de contato sem seta e com alinhamento limpo. */
  .products-showcase .details-contact-link{
    display:inline-block !important;
    margin-top:14px !important;
  }

}

/* Telas muito largas. */
@media (min-width:1400px){

  .products-showcase{
    max-width:1320px !important;
    gap:24px !important;
  }

}

/* Mobile preservado, apenas garantindo que palavras
   não sejam quebradas artificialmente. */
@media (max-width:1000px){

  .products-showcase .compact-feature-link,
  .products-showcase .compact-details summary,
  .products-showcase .details-contact-link{
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }

}


/* =====================================================
   WEKON — CORREÇÃO DE ALINHAMENTO / VERSÃO BASE
   -----------------------------------------------------
   Corrige o ajuste anterior que fez a seção ocupar
   toda a largura da tela.

   Regra principal:
   os 3 produtos devem seguir exatamente o mesmo
   container do título e das demais seções do site.
===================================================== */

@media (min-width:1001px){

  /* IMPORTANTE:
     não deixar a seção de soluções ocupar 100% da tela.
     Ela deve usar o mesmo container global do site. */
  #solucoes.section{
    width:100% !important;
  }

  #solucoes.section > .container{
    width:min(calc(100% - 40px),1180px) !important;
    max-width:1180px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  /* O heading e os produtos ficam no mesmo eixo. */
  #solucoes .section-heading{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }

  /* Três produtos ocupando o espaço do container,
     sem ultrapassar suas bordas. */
  #solucoes .products-showcase{
    width:100% !important;
    max-width:100% !important;
    margin:18px 0 28px !important;
    padding:0 !important;

    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
    align-items:start !important;
    box-sizing:border-box !important;
  }

  /* O grid interno do WEB/Agenda continua servindo
     apenas como agrupador; os dois cards participam
     diretamente da grade principal. */
  #solucoes .products-showcase > .product-grid-main{
    display:contents !important;
  }

  #solucoes .products-showcase > #sg-master{
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  #solucoes .products-showcase > .product-grid-main > #sg-master-web{
    grid-column:2 !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  #solucoes .products-showcase > .product-grid-main > #sg-agenda{
    grid-column:3 !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  /* Nada dentro dos cards pode aumentar a coluna. */
  #solucoes .products-showcase .product-card,
  #solucoes .products-showcase .master-modules,
  #solucoes .products-showcase .compact-details,
  #solucoes .products-showcase .master-modules-content,
  #solucoes .products-showcase .details-content{
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  /* Texto nunca deve escapar do card. */
  #solucoes .products-showcase .product-lead,
  #solucoes .products-showcase .interactive-hint,
  #solucoes .products-showcase .compact-feature-link,
  #solucoes .products-showcase summary{
    word-break:normal !important;
    overflow-wrap:break-word !important;
    hyphens:none !important;
  }

  /* Espaçamento inferior pequeno e consistente antes
     da próxima seção. */
  #solucoes .products-showcase{
    margin-bottom:28px !important;
  }

}

/* Monitores grandes: aumenta somente o espaço entre
   os cards, mantendo tudo preso ao mesmo container. */
@media (min-width:1400px){

  #solucoes.section > .container{
    width:min(calc(100% - 64px),1240px) !important;
    max-width:1240px !important;
  }

  #solucoes .products-showcase{
    gap:20px !important;
    margin-bottom:30px !important;
  }

}

/* Mobile: não aplicar a estrutura de 3 colunas. */
@media (max-width:1000px){

  #solucoes.section > .container{
    width:min(calc(100% - 40px),1180px) !important;
    max-width:none !important;
  }

  #solucoes .products-showcase{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:0 !important;
  }

}


/* =====================================================
   WEKON — SIMETRIA FINAL DOS PRODUTOS
   -----------------------------------------------------
   Os três cards devem seguir o mesmo eixo visual dos
   blocos destacados abaixo, sem encostar nas bordas
   do container geral.
===================================================== */

@media (min-width:1001px){

  #solucoes .products-showcase{
    width:calc(100% - 30px) !important;
    max-width:none !important;
    margin:18px auto 28px !important;

    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;

    padding:0 !important;
    box-sizing:border-box !important;
  }

  #solucoes .products-showcase > #sg-master,
  #solucoes .products-showcase > .product-grid-main > #sg-master-web,
  #solucoes .products-showcase > .product-grid-main > #sg-agenda{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  /* Mesmo espaço lateral e mesmo eixo para os três. */
  #solucoes .products-showcase > #sg-master{
    grid-column:1 !important;
  }

  #solucoes .products-showcase > .product-grid-main > #sg-master-web{
    grid-column:2 !important;
  }

  #solucoes .products-showcase > .product-grid-main > #sg-agenda{
    grid-column:3 !important;
  }

  /* Não permitir que textos ou controles aumentem
     artificialmente uma das três colunas. */
  #solucoes .products-showcase .product-card,
  #solucoes .products-showcase .master-modules,
  #solucoes .products-showcase .compact-details{
    min-width:0 !important;
    max-width:100% !important;
  }

  #solucoes .products-showcase .product-lead,
  #solucoes .products-showcase .interactive-hint,
  #solucoes .products-showcase .compact-feature-link,
  #solucoes .products-showcase summary{
    word-break:normal !important;
    overflow-wrap:break-word !important;
    hyphens:none !important;
  }

}

/* Em monitores muito grandes, mantém exatamente a mesma
   proporção e apenas amplia o respiro entre os cards. */
@media (min-width:1400px){

  #solucoes .products-showcase{
    width:calc(100% - 30px) !important;
    gap:20px !important;
  }

}

/* Mobile continua utilizando o container completo. */
@media (max-width:1000px){

  #solucoes .products-showcase{
    width:100% !important;
    margin:18px 0 26px !important;
  }

}


/* =====================================================
   WEKON — SIMETRIA 100% / CORREÇÃO DEFINITIVA
   -----------------------------------------------------
   A diferença vinha do breakpoint de 1400px:
   a seção Soluções passava para 1240px enquanto o bloco
   Website permanecia em 1180px.

   Agora os dois usam exatamente o mesmo eixo e largura.
===================================================== */

@media (min-width:1001px){

  #solucoes.section > .container{
    width:1180px !important;
    max-width:calc(100vw - 80px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  #solucoes .products-showcase{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:0 !important;

    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
    box-sizing:border-box !important;
  }

  /* Mesma largura-base do bloco Website. */
  #website.website-card{
    width:1180px !important;
    max-width:calc(100vw - 80px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

}

/* Em monitores muito grandes, NÃO ampliar a seção
   Soluções para 1240px. Ela deve continuar exatamente
   alinhada ao Website e às demais áreas de conteúdo. */
@media (min-width:1400px){

  #solucoes.section > .container{
    width:1180px !important;
    max-width:1180px !important;
  }

  #solucoes .products-showcase{
    width:100% !important;
    max-width:100% !important;
    gap:20px !important;
  }

  #website.website-card{
    width:1180px !important;
    max-width:1180px !important;
  }

}

/* Mobile não recebe nenhuma dessas regras. */
@media (max-width:1000px){

  #solucoes.section > .container{
    width:min(calc(100% - 40px),1180px) !important;
    max-width:none !important;
  }

  #website.website-card{
    width:auto !important;
    max-width:none !important;
  }

}


/* =====================================================
   WEKON — AJUSTE SOMENTE DE TIPOGRAFIA
   -----------------------------------------------------
   NÃO altera largura, margens, grid, espaçamento ou
   alinhamento das seções.
   Apenas reforça o peso visual dos textos dos produtos.
===================================================== */

@media (min-width:1001px){

  /* Títulos dos três produtos */
  #solucoes .products-showcase .product-card h3,
  #solucoes .products-showcase > #sg-master h3{
    font-weight:700 !important;
  }

  /* Rótulos superiores */
  #solucoes .products-showcase .product-label{
    font-weight:700 !important;
  }

  /* Descrição principal: um pouco mais firme,
     sem ficar pesada demais. */
  #solucoes .products-showcase .product-lead{
    font-weight:500 !important;
  }

  /* "Ver recursos" */
  #solucoes .products-showcase .compact-details summary{
    font-weight:700 !important;
  }

  /* Módulos / Apps / Integrações */
  #solucoes .products-showcase .master-modules summary strong{
    font-weight:700 !important;
  }

  #solucoes .products-showcase .master-modules summary small{
    font-weight:500 !important;
  }

  /* Itens internos do SG Master */
  #solucoes .products-showcase .compact-feature-link{
    font-weight:600 !important;
  }

  /* Tags como Básica / Master / Plus e países */
  #solucoes .products-showcase .product-mini-tags span{
    font-weight:600 !important;
  }

}

/* Mobile: reforço leve, sem mexer no layout. */
@media (max-width:1000px){

  #solucoes .products-showcase .product-card h3{
    font-weight:700 !important;
  }

  #solucoes .products-showcase .product-label{
    font-weight:700 !important;
  }

  #solucoes .products-showcase .compact-details summary{
    font-weight:700 !important;
  }

  #solucoes .products-showcase .master-modules summary strong{
    font-weight:700 !important;
  }

  #solucoes .products-showcase .compact-feature-link{
    font-weight:600 !important;
  }

}


/* =====================================================
   WEKON — AJUSTE DOS ITENS INTERNOS
   -----------------------------------------------------
   Ajuste somente da tipografia e das células internas.
   NÃO altera o alinhamento/posição das seções.
===================================================== */

@media (min-width:1001px){

  /* Deixa os itens mais compactos e legíveis. */
  #solucoes .products-showcase .compact-feature-link{
    font-size:12px !important;
    font-weight:600 !important;
    line-height:1.25 !important;

    min-height:42px !important;
    height:auto !important;

    padding:8px 9px !important;
    margin:0 !important;

    display:flex !important;
    align-items:center !important;

    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;

    box-sizing:border-box !important;
  }

  /* O nome do recurso fica mais forte para compensar
     a redução de tamanho. */
  #solucoes .products-showcase .compact-feature-link{
    letter-spacing:0 !important;
  }

  /* Mantém a grade interna uniforme. */
  #solucoes .products-showcase .compact-link-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:6px !important;
    align-items:stretch !important;
  }

  /* Quando houver nomes de duas linhas, todos continuam
     visualmente alinhados no centro. */
  #solucoes .products-showcase .compact-feature-link span,
  #solucoes .products-showcase .compact-feature-link{
    text-align:left !important;
  }

}

/* Telas grandes: um pequeno ganho de legibilidade sem
   permitir que os textos estourem as células. */
@media (min-width:1400px){

  #solucoes .products-showcase .compact-feature-link{
    font-size:12.5px !important;
    padding-left:10px !important;
    padding-right:10px !important;
  }

  #solucoes .products-showcase .compact-link-grid{
    gap:7px !important;
  }

}

/* Mobile: mantém a legibilidade atual e apenas reforça
   o peso da fonte. */
@media (max-width:1000px){

  #solucoes .products-showcase .compact-feature-link{
    font-weight:600 !important;
    word-break:normal !important;
    hyphens:none !important;
  }

}


/* =====================================================
   WEKON — BANDEIRAS DOS PAÍSES
   -----------------------------------------------------
   Os emojis ficam em um elemento separado para o
   navegador poder usar a fonte de emoji do sistema,
   sem interferência da fonte principal do site.
===================================================== */

.product-mini-tags .country-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:5px !important;
  white-space:nowrap !important;
}

.product-mini-tags .country-flag{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  font-family:"Segoe UI Emoji","Apple Color Emoji",
              "Noto Color Emoji",sans-serif !important;

  font-size:14px !important;
  line-height:1 !important;
  font-weight:400 !important;

  width:16px !important;
  height:16px !important;
  flex:0 0 16px !important;
}

.product-mini-tags .country-chip > span:last-child{
  white-space:nowrap !important;
}

/* Não deixa as regras de tipografia dos chips
   sobrescreverem a bandeira. */
.product-mini-tags .country-chip .country-flag{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  min-height:0 !important;
  border-radius:0 !important;
}

/* Mantém a bandeira proporcional em telas menores. */
@media (max-width:1000px){
  .product-mini-tags .country-flag{
    font-size:14px !important;
    width:16px !important;
    height:16px !important;
    flex-basis:16px !important;
  }
}


/* =====================================================
   WEKON — BANDEIRAS SVG / V2
   -----------------------------------------------------
   Usa SVG inline para que as bandeiras sejam exibidas
   corretamente mesmo quando o navegador não possui
   uma fonte de emoji colorida.
===================================================== */

.product-mini-tags .country-flag-svg{
  display:inline-block !important;
  width:18px !important;
  height:12px !important;
  min-width:18px !important;
  flex:0 0 18px !important;
  vertical-align:middle !important;
  object-fit:cover !important;
  border-radius:2px !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.08) !important;
}

.product-mini-tags .country-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  white-space:nowrap !important;
}

/* O texto do país segue a tipografia normal do site. */
.product-mini-tags .country-chip > span:last-child{
  font-family:inherit !important;
  white-space:nowrap !important;
}

@media (max-width:1000px){
  .product-mini-tags .country-flag-svg{
    width:18px !important;
    height:12px !important;
    min-width:18px !important;
    flex-basis:18px !important;
  }
}


/* =====================================================
   WEKON — PAÍSES / V5
   • SG Master: Brasil + Paraguai
   • SG Master WEB: Brasil + Paraguai
   • SG Agenda: Brasil + Paraguai + EUA
   • Países permanecem na mesma linha no desktop.
===================================================== */

@media (min-width:1001px){

  #solucoes .product-mini-tags{
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
    gap:8px !important;
    min-width:0 !important;
  }

  #solucoes .product-mini-tags .country-chip{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  #solucoes .product-mini-tags .country-chip > span:last-child{
    white-space:nowrap !important;
  }

  #solucoes .product-mini-tags .country-flag-svg{
    flex:0 0 18px !important;
  }

}

/* Em telas menores, permite somente o comportamento natural
   do container, sem quebrar o texto do nome do país. */
@media (max-width:1000px){

  #solucoes .product-mini-tags .country-chip{
    white-space:nowrap !important;
  }

  #solucoes .product-mini-tags .country-chip > span:last-child{
    white-space:nowrap !important;
  }

}


/* =====================================================
   WEKON — SG MASTER / V6
   Somente a bandeira do Brasil é exibida no SG Master.
   Os nomes dos planos permanecem normalmente visíveis.
===================================================== */

#sg-master .master-country-flag{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:42px !important;
  height:30px !important;
  padding:0 !important;
  margin-top:10px !important;
  border-radius:999px !important;
  background:#eef7f2 !important;
  border:1px solid #dcece4 !important;
  box-sizing:border-box !important;
  vertical-align:middle !important;
}

#sg-master .master-country-flag .country-flag-svg{
  display:block !important;
  width:22px !important;
  height:15px !important;
  min-width:22px !important;
  flex:0 0 22px !important;
  object-fit:cover !important;
  border-radius:2px !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.08) !important;
}

@media (max-width:600px){
  #sg-master .master-country-flag{
    width:40px !important;
    height:28px !important;
  }

  #sg-master .master-country-flag .country-flag-svg{
    width:21px !important;
    height:14px !important;
    min-width:21px !important;
    flex-basis:21px !important;
  }
}


/* =====================================================
   WEKON — SG MASTER / V7
   -----------------------------------------------------
   O SG Master não exibe mais os planos nesta área.
   Exibe apenas o país completo: bandeira + Brasil.
===================================================== */

#sg-master .master-country-chip{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;

  width:auto !important;
  min-width:0 !important;
  height:34px !important;
  padding:0 13px !important;
  margin:10px 0 8px !important;

  border-radius:999px !important;
  background:#eef7f2 !important;
  border:1px solid #dcece4 !important;
  box-sizing:border-box !important;

  white-space:nowrap !important;
  vertical-align:middle !important;

  font-weight:600 !important;
}

#sg-master .master-country-chip .country-flag-svg{
  display:block !important;
  width:22px !important;
  height:15px !important;
  min-width:22px !important;
  flex:0 0 22px !important;

  object-fit:cover !important;
  border-radius:2px !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.08) !important;
}

#sg-master .master-country-chip > span:last-child{
  white-space:nowrap !important;
  font-family:inherit !important;
}

@media (max-width:600px){
  #sg-master .master-country-chip{
    height:32px !important;
    padding:0 12px !important;
  }

  #sg-master .master-country-chip .country-flag-svg{
    width:21px !important;
    height:14px !important;
    min-width:21px !important;
    flex-basis:21px !important;
  }
}


/* =====================================================
   WEKON — SG MASTER / V8
   Padronização tipográfica do país
   -----------------------------------------------------
   O chip "Brasil" do SG Master usa exatamente a mesma
   hierarquia tipográfica dos chips de países dos demais
   produtos.
===================================================== */

#sg-master .master-country-chip{
  font-family:inherit !important;
  font-size:11px !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  color:#344054 !important;

  min-height:25px !important;
  height:25px !important;
  padding:4px 8px !important;
  margin:10px 0 8px !important;

  gap:6px !important;
  border:1px solid #d8e4df !important;
  border-radius:999px !important;
  background:#f7fafc !important;

  box-sizing:border-box !important;
  white-space:nowrap !important;
}

#sg-master .master-country-chip .country-flag-svg{
  width:18px !important;
  height:12px !important;
  min-width:18px !important;
  flex:0 0 18px !important;
  border-radius:2px !important;
}

#sg-master .master-country-chip > span:last-child{
  font-family:inherit !important;
  font-size:11px !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:0 !important;
  color:#344054 !important;
  white-space:nowrap !important;
}

@media (max-width:1000px){
  #sg-master .master-country-chip{
    font-size:12px !important;
    height:28px !important;
    min-height:28px !important;
    padding:4px 9px !important;
  }

  #sg-master .master-country-chip > span:last-child{
    font-size:12px !important;
  }

  #sg-master .master-country-chip .country-flag-svg{
    width:18px !important;
    height:12px !important;
    min-width:18px !important;
    flex-basis:18px !important;
  }
}


/* =====================================================
   WEKON — ATENDIMENTO HUMANIZADO / V10
   -----------------------------------------------------
   Mantém as informações de suporte e acrescenta os
   diferenciais de atendimento sem remover conteúdo.
===================================================== */

.support-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}

.support-item,
.support-extra-item{
  min-width:0 !important;
  box-sizing:border-box !important;
}

.support-item h3,
.support-extra-item h3{
  font-weight:700 !important;
}

.support-item p,
.support-extra-item p{
  line-height:1.55 !important;
}

.support-extra{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  margin-top:28px !important;
  border-top:1px solid rgba(255,255,255,.13) !important;
  border-bottom:1px solid rgba(255,255,255,.13) !important;
}

.support-extra-item{
  padding:24px 20px !important;
  border-right:1px solid rgba(255,255,255,.13) !important;
}

.support-extra-item:last-child{
  border-right:none !important;
}

.support-extra-item h3{
  font-size:16px !important;
  line-height:1.3 !important;
  margin-bottom:8px !important;
}

.support-extra-item p{
  font-size:14px !important;
  color:#a7b4c5 !important;
  margin:0 !important;
}

.support-button{
  margin-top:24px !important;
}

@media (max-width:900px){
  .support-grid,
  .support-extra{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .support-extra-item:nth-child(2){
    border-right:none !important;
  }

  .support-extra-item:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.13) !important;
  }
}

@media (max-width:600px){
  .support-grid,
  .support-extra{
    grid-template-columns:1fr !important;
  }

  .support-extra-item{
    border-right:none !important;
    border-bottom:1px solid rgba(255,255,255,.13) !important;
  }

  .support-extra-item:last-child{
    border-bottom:none !important;
  }
}


/* =====================================================
   WEKON — REFINO VISUAL / V11
   -----------------------------------------------------
   1. Remove o CTA duplicado dentro de Atendimento.
   2. Padroniza as etiquetas verdes das seções claras.
   3. Reduz espaços verticais excessivos entre blocos.
   4. Preserva alinhamento, responsividade e funções.
===================================================== */

/* O botão de atendimento foi removido do HTML.
   Mantemos a regra antiga inofensiva para não afetar
   outras partes que possam reutilizar a classe. */

.green-eyebrow{
  color:#159447 !important;
}

/* Atendimento: sem espaço reservado para o CTA removido. */
.support{
  padding-bottom:34px !important;
}

/* Menos respiro entre a presença nacional e a seção seguinte,
   mantendo a leitura confortável no desktop. */
.national-reach{
  padding-top:58px !important;
  padding-bottom:60px !important;
}

/* Integrações mais compacta, sem colar o conteúdo. */
.marketplaces-section{
  padding-top:34px !important;
  padding-bottom:34px !important;
}

/* Os textos secundários das áreas claras usam o mesmo tom
   neutro do restante da página. */
.marketplaces-section .section-intro,
.national-copy p,
.value-item > div > span{
  color:#667085 !important;
}

/* Mantém títulos e nomes com o peso visual já utilizado. */
.marketplace-card strong,
.value-item strong{
  color:#101828 !important;
  font-weight:700 !important;
}

@media (max-width:700px){
  .national-reach{
    padding-top:44px !important;
    padding-bottom:48px !important;
  }

  .marketplaces-section{
    padding-top:30px !important;
    padding-bottom:30px !important;
  }

  .support{
    padding-bottom:40px !important;
  }
}


/* =====================================================
   WEKON V12 — PADRÃO DE CORES DOS TÍTULOS
   -----------------------------------------------------
   Títulos principais: navy #071A2D
   Textos secundários: #52677D
   Eyebrows/destaques: azul #2563EB
   Verde permanece reservado para ações/destaques.
===================================================== */

:root{
  --wekon-title:#071A2D;
  --wekon-text:#52677D;
  --wekon-blue:#2563EB;
}

/* Títulos principais das seções claras */
main h1,
main h2,
main h3,
section h1,
section h2,
section h3{
  color:var(--wekon-title);
}

/* Textos descritivos */
main p,
section p{
  color:var(--wekon-text);
}

/* Eyebrows / pequenas etiquetas de seção */
.eyebrow,
.section-eyebrow,
.label,
.kicker,
.overline{
  color:var(--wekon-blue);
}

/* Preserva títulos e textos das áreas escuras */
.support h1,
.support h2,
.support h3,
.support p,
.dark-section h1,
.dark-section h2,
.dark-section h3,
.dark-section p{
  color:inherit;
}

/* O verde continua sendo destaque, não cor geral de títulos */
.text-green,
.green-text,
.highlight-green{
  color:#16A34A;
}

/* Integrações e Presença Nacional seguem o mesmo azul de etiqueta */
.integration-section .eyebrow,
.integrations-section .eyebrow,
.national-presence .eyebrow,
.presence-national .eyebrow{
  color:var(--wekon-blue);
}


/* =====================================================
   WEKON V13 — CONTRASTE E LEGIBILIDADE
   -----------------------------------------------------
   A V12 padronizou as cores, mas algumas regras globais
   acabaram aplicando o navy dos fundos claros também em
   componentes de fundo escuro. Esta camada corrige apenas
   contraste/legibilidade, sem alterar layout ou funções.
===================================================== */

:root{
  --wekon-dark-title:#ffffff;
  --wekon-dark-text:#d4deea;
  --wekon-dark-muted:#b8c5d4;
  --wekon-light-title:#071A2D;
  --wekon-light-text:#52677D;
  --wekon-eyebrow:#2563EB;
}

/* ---------- HERO / FUNDO ESCURO ---------- */

.hero,
.hero h1,
.hero h2,
.hero h3{
  color:#ffffff !important;
}

.hero .eyebrow{
  color:#9bbcff !important;
}

.hero .hero-accent{
  color:#16A34A !important;
}

.hero .hero-subtitle,
.hero .hero-description{
  color:#d4deea !important;
}

.hero .hero-link{
  color:#e1e8f0 !important;
}

.hero .funnel-title{
  color:#c5d0dd !important;
}

.hero .funnel-text strong{
  color:#ffffff !important;
}

.hero .funnel-text small{
  color:#b8c5d4 !important;
}

/* ---------- BLOCO "SEU NEGÓCIO..." / FUNDO ESCURO ---------- */

#website.website-card,
#website.website-card h1,
#website.website-card h2,
#website.website-card h3{
  color:#ffffff !important;
}

#website.website-card .product-label{
  color:#9bbcff !important;
}

#website.website-card p{
  color:#d4deea !important;
}

#website.website-card .features span{
  color:#d4deea !important;
}

/* ---------- ATENDIMENTO / FUNDO ESCURO ---------- */

.support,
.support h1,
.support h2,
.support h3{
  color:#ffffff !important;
}

.support .eyebrow{
  color:#9bbcff !important;
}

.support p,
.support .support-item p,
.support .support-extra-item p{
  color:#d0dae6 !important;
}

.support .support-item h3,
.support .support-extra-item h3{
  color:#ffffff !important;
}

/* ---------- SEÇÕES CLARAS ---------- */

.national-reach h1,
.national-reach h2,
.national-reach h3,
.marketplaces-section h1,
.marketplaces-section h2,
.marketplaces-section h3,
.section h1,
.section h2,
.section h3{
  color:var(--wekon-light-title);
}

.marketplaces-section .eyebrow,
.national-reach .eyebrow,
.section .eyebrow{
  color:var(--wekon-eyebrow) !important;
}

/* Textos claros deixam de ficar excessivamente apagados. */
.marketplaces-section p,
.national-copy p,
.section-heading p,
.section-description{
  color:var(--wekon-light-text);
}

/* ---------- TÍTULOS DE CARDS CLAROS ---------- */

.marketplace-card strong,
.value-item strong,
.product-card h3{
  color:var(--wekon-light-title) !important;
}

.marketplace-card span,
.value-item > div > span,
.product-card p{
  color:var(--wekon-light-text) !important;
}

/* ---------- RESPONSIVIDADE ----------
   Apenas mantém as mesmas regras de contraste em telas menores.
*/
@media (max-width:700px){
  .hero .hero-subtitle,
  .hero .hero-description{
    color:#d4deea !important;
  }

  #website.website-card p,
  #website.website-card .features span{
    color:#d4deea !important;
  }

  .support .support-item p,
  .support .support-extra-item p{
    color:#d0dae6 !important;
  }
}


/* =====================================================
   WEKON V14 — CORREÇÃO DEFINITIVA DOS TÍTULOS ESCUROS
   -----------------------------------------------------
   Correção específica para os dois títulos que estavam
   recebendo a cor navy das seções claras.
   Não altera layout, espaçamento, alinhamento ou funções.
===================================================== */

/* HERO: "Sua empresa cresce." */
#inicio.hero .hero-content h1{
  color:#ffffff !important;
  opacity:1 !important;
  visibility:visible !important;
  text-shadow:none;
}

#inicio.hero .hero-content h1:first-line{
  color:#ffffff !important;
}

#inicio.hero .hero-content h1 .hero-accent{
  color:#16A34A !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* BLOCO WEBSITE:
   "Seu negócio também merece estar na internet." */
#website.website-card > div > h3{
  color:#ffffff !important;
  opacity:1 !important;
  visibility:visible !important;
  text-shadow:none;
}

/* Mantém o restante do conteúdo do bloco com contraste alto. */
#website.website-card > div > p{
  color:#d4deea !important;
  opacity:1 !important;
}

#website.website-card > div > .features span{
  color:#d4deea !important;
  opacity:1 !important;
}

#website.website-card > div > .product-label{
  color:#9bbcff !important;
  opacity:1 !important;
}

/* Garante contraste no título mesmo se regras genéricas
   de h1/h2/h3 forem adicionadas posteriormente. */
.hero h1,
.website-card h3{
  mix-blend-mode:normal !important;
}


/* =====================================================
   WEKON V15 — RESPONSIVIDADE DOS 3 PRODUTOS
   -----------------------------------------------------
   Correção para larguras intermediárias / meia tela.

   Acima de 1000px:
   SG Master | SG Master WEB | SG Agenda

   Até 1000px:
   os três cards passam para uma única coluna,
   evitando cards estreitos, botões espremidos e
   quebras desnecessárias.

   Não altera as funções dos acordeões.
===================================================== */

@media (max-width:1000px){

  #solucoes .products-showcase{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin:18px 0 28px !important;
    box-sizing:border-box !important;
  }

  /* O segundo nível deixa de usar duas colunas.
     WEB e AGENDA ficam com a mesma largura. */
  #solucoes .products-showcase > .product-grid-main{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  #solucoes .products-showcase > #sg-master,
  #solucoes .products-showcase > .product-grid-main > #sg-master-web,
  #solucoes .products-showcase > .product-grid-main > #sg-agenda{
    grid-column:auto !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  /* Os botões ocupam somente a largura do próprio card,
     sem serem comprimidos pela grade. */
  #solucoes .products-showcase .compact-details,
  #solucoes .products-showcase .compact-details summary,
  #solucoes .products-showcase .text-link{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  #solucoes .products-showcase .compact-details summary{
    min-height:44px !important;
  }

  /* Evita qualquer overflow horizontal em meia tela. */
  #solucoes .products-showcase .product-card,
  #solucoes .products-showcase .product-lead,
  #solucoes .products-showcase .availability,
  #solucoes .products-showcase .country-chip{
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  #solucoes .products-showcase .product-lead{
    overflow-wrap:break-word !important;
    word-break:normal !important;
    hyphens:none !important;
  }

}

/* Em telas pequenas, mantém exatamente a mesma coluna,
   apenas reduz o espaçamento externo. */
@media (max-width:700px){

  #solucoes .products-showcase{
    margin:16px 0 24px !important;
  }

  #solucoes .products-showcase > .product-grid-main{
    gap:14px !important;
  }

}


/* =====================================================
   WEKON V16 — AJUSTE FINO DE ESPAÇAMENTOS
   -----------------------------------------------------
   Mantém o comportamento da V15 e reduz somente os
   espaços verticais desnecessários entre os produtos
   em larguras intermediárias.
===================================================== */

@media (max-width:1000px){

  #solucoes .products-showcase{
    margin-top:14px !important;
    margin-bottom:18px !important;
  }

  #solucoes .products-showcase > .product-grid-main{
    gap:10px !important;
  }

  #solucoes .products-showcase > #sg-master,
  #solucoes .products-showcase > .product-grid-main > #sg-master-web,
  #solucoes .products-showcase > .product-grid-main > #sg-agenda{
    margin-bottom:0 !important;
  }

  /* Evita que o card deixe uma faixa vazia excessiva
     antes do próximo produto. */
  #solucoes .products-showcase .product-card{
    margin-bottom:0 !important;
  }
}

@media (max-width:700px){

  #solucoes .products-showcase{
    margin-top:12px !important;
    margin-bottom:16px !important;
  }

  #solucoes .products-showcase > .product-grid-main{
    gap:10px !important;
  }
}


/* =====================================================
   WEKON V17 — ESPAÇO REAL ENTRE SG MASTER E WEB
   -----------------------------------------------------
   A estrutura possui o SG Master fora da grade que
   contém WEB e Agenda. Por isso o gap da grade não
   controla o espaço entre Master e WEB.

   Corrige somente essa transição em telas intermediárias.
===================================================== */

@media (max-width:1000px){

  #solucoes .products-showcase > #sg-master{
    margin-bottom:14px !important;
  }

  #solucoes .products-showcase > .product-grid-main{
    gap:14px !important;
  }

  #solucoes .products-showcase > .product-grid-main > #sg-master-web,
  #solucoes .products-showcase > .product-grid-main > #sg-agenda{
    margin-bottom:0 !important;
  }

}

@media (max-width:700px){

  #solucoes .products-showcase > #sg-master{
    margin-bottom:12px !important;
  }

  #solucoes .products-showcase > .product-grid-main{
    gap:12px !important;
  }

}


/* =====================================================
   WEKON V18 — LOGO RESPONSIVA
   -----------------------------------------------------
   Em telas pequenas a logo estava crescendo dentro do
   cabeçalho e invadindo o conteúdo do HERO.

   Correção:
   - tamanho controlado da logo;
   - cabeçalho com altura previsível;
   - espaço reservado para a logo antes do título;
   - menu preservado;
   - nenhuma alteração no conteúdo ou funções.
===================================================== */

/* Tablet / telas intermediárias */
@media (max-width:1000px){

  .site-header{
    width:100%;
  }

  .site-header .header-inner{
    min-height:70px;
  }

  .site-header .brand{
    width:auto !important;
    max-width:150px !important;
    flex:0 0 auto !important;
  }

  .site-header .site-logo{
    width:auto !important;
    height:auto !important;
    max-width:150px !important;
    max-height:48px !important;
    object-fit:contain !important;
  }

}

/* Celular */
@media (max-width:700px){

  .site-header .header-inner{
    height:68px !important;
    min-height:68px !important;
    align-items:center !important;
  }

  .site-header .brand{
    width:120px !important;
    max-width:120px !important;
    height:48px !important;
    display:flex !important;
    align-items:center !important;
  }

  .site-header .site-logo{
    display:block !important;
    width:auto !important;
    height:auto !important;
    max-width:120px !important;
    max-height:44px !important;
    object-fit:contain !important;
  }

  /* Reserva espaço real abaixo do cabeçalho.
     Evita que a primeira linha do hero fique atrás da logo. */
  .hero{
    padding-top:118px !important;
  }

  .hero-content{
    position:relative;
    z-index:1;
  }

  .hero h1{
    position:relative;
    z-index:1;
  }

}

/* Celulares muito estreitos */
@media (max-width:380px){

  .site-header .header-inner{
    height:62px !important;
    min-height:62px !important;
  }

  .site-header .brand{
    width:108px !important;
    max-width:108px !important;
    height:43px !important;
  }

  .site-header .site-logo{
    max-width:108px !important;
    max-height:40px !important;
  }

  .hero{
    padding-top:106px !important;
  }

}


/* =====================================================
   WEKON V19 — MENU MOBILE NÃO APARECER FECHADO
   -----------------------------------------------------
   Em algumas larguras o item "Contato" do menu mobile
   estava ficando visível sobre o Hero mesmo com o menu
   fechado.

   Agora o menu fechado fica realmente invisível e sem
   interação. Ao receber .active, volta a aparecer.
===================================================== */

.mobile-menu{
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
  transform:translateY(-100%) !important;
}

.mobile-menu.active{
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  transform:translateY(0) !important;
}

@media (max-width:700px){

  .mobile-menu{
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(-100%) !important;
  }

  .mobile-menu.active{
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }

}


/* =====================================================
   WEKON V20 — REDUÇÃO DO ESPAÇO ANTES DE "SOLUÇÕES"
   -----------------------------------------------------
   Na visualização mobile/intermediária havia um respiro
   excessivo entre o bloco "Seu negócio..." e a seção
   "Tecnologia adaptada...".

   Ajuste somente vertical. Nenhum conteúdo ou função
   foi alterado.
===================================================== */

@media (max-width:700px){

  /* A seção seguinte começa mais próxima do bloco anterior. */
  #segmentos.compact-segments-section{
    padding-top:22px !important;
  }

  #segmentos .segments-heading{
    margin-bottom:18px !important;
  }
}

@media (min-width:701px) and (max-width:1000px){

  #segmentos.compact-segments-section{
    padding-top:26px !important;
  }

}


/* =====================================================
   WEKON V21 — CORREÇÃO DO "VAZIO" ENTRE SEÇÕES
   -----------------------------------------------------
   O espaço mostrado no mobile não vinha do gap dos
   produtos. Ele era formado pela combinação do padding
   inferior da seção de soluções + padding superior da
   seção seguinte.

   Reduzimos somente essa junção para que as seções
   fiquem visualmente conectadas, sem ficarem coladas.
===================================================== */

@media (max-width:700px){

  #solucoes.section{
    padding-bottom:8px !important;
  }

  #solucoes .products-showcase{
    margin-bottom:0 !important;
  }

  #segmentos.compact-segments-section{
    padding-top:8px !important;
  }

  #segmentos .segments-heading{
    margin-bottom:16px !important;
  }
}

/* Largura intermediária: mantém um pequeno respiro,
   mas elimina a faixa excessiva. */
@media (min-width:701px) and (max-width:1000px){

  #solucoes.section{
    padding-bottom:10px !important;
  }

  #solucoes .products-showcase{
    margin-bottom:0 !important;
  }

  #segmentos.compact-segments-section{
    padding-top:12px !important;
  }
}


/* =====================================================
   WEKON V24 — HERO VISUAL FLUTUANTE
   -----------------------------------------------------
   Nova camada visual, sem box/card:
   - imagem integrada ao Hero;
   - fade + movimento suave;
   - sem borda;
   - sem fundo adicional;
   - oculto abaixo de 1000px para preservar a
     responsividade já aprovada.
===================================================== */

.hero{
  position:relative;
  overflow:hidden;
}

.hero-floating-visual{
  position:absolute;
  top:50%;
  right:2.5%;
  width:min(39vw,500px);
  aspect-ratio:16 / 10;
  transform:translateY(-50%);
  z-index:1;
  pointer-events:none;
}

.hero-floating-stage{
  position:relative;
  width:100%;
  height:100%;
}

.hero-floating-slide{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;

  opacity:0;
  transform:translate3d(32px,0,0) scale(.975);

  filter:drop-shadow(0 26px 34px rgba(0,0,0,.22));

  transition:
    opacity .9s ease,
    transform 1.15s cubic-bezier(.22,.61,.36,1);
}

.hero-floating-slide.is-active{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}

/* Mantém o texto acima da imagem quando houver sobreposição. */
.hero-content,
.hero .funnel{
  position:relative;
  z-index:2;
}

/* Não interfere na versão tablet/mobile já aprovada. */
@media (max-width:1000px){
  .hero-floating-visual{
    display:none;
  }
}

/* Em telas muito grandes, evita que a imagem cresça demais. */
@media (min-width:1400px){
  .hero-floating-visual{
    width:500px;
    right:3%;
  }
}


/* ============================================================
   WEKON V26 — MOTION VISUAL
   ============================================================ */

.hero{
  isolation:isolate;
}

.hero-motion-glow{
  position:absolute;
  width:520px;
  height:520px;
  right:7%;
  top:50%;
  transform:translate(18%,-50%);
  border-radius:50%;
  background:radial-gradient(
    circle,
    rgba(37,99,235,.22) 0%,
    rgba(37,99,235,.08) 38%,
    rgba(37,99,235,0) 72%
  );
  filter:blur(8px);
  opacity:.72;
  pointer-events:none;
  z-index:0;
  animation:wekonGlow 8s ease-in-out infinite alternate;
}

@keyframes wekonGlow{
  from{
    transform:translate(18%,-50%) scale(.95);
    opacity:.55;
  }
  to{
    transform:translate(12%,-48%) scale(1.06);
    opacity:.82;
  }
}

.hero-motion-title{
  animation:wekonTitleIn .9s cubic-bezier(.16,1,.3,1) both;
}

.hero-motion-copy{
  animation:wekonCopyIn 1s .1s cubic-bezier(.16,1,.3,1) both;
}

@keyframes wekonTitleIn{
  from{
    opacity:0;
    transform:translate3d(-30px,10px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

@keyframes wekonCopyIn{
  from{
    opacity:0;
    transform:translate3d(-20px,8px,0);
  }
  to{
    opacity:1;
    transform:translate3d(0,0,0);
  }
}

.hero-floating-visual{
  z-index:2;
  will-change:transform;
}

.hero-floating-slide.is-active{
  animation:wekonHeroImage 5.2s ease-in-out both;
}

@keyframes wekonHeroImage{
  0%{
    transform:translate3d(70px,18px,0) scale(.94);
    opacity:0;
  }
  18%{
    transform:translate3d(0,0,0) scale(1);
    opacity:1;
  }
  55%{
    transform:translate3d(-7px,-5px,0) scale(1.015);
    opacity:1;
  }
  100%{
    transform:translate3d(5px,3px,0) scale(1.008);
    opacity:1;
  }
}

.motion-reveal{
  opacity:0;
  transform:translate3d(0,34px,0);
  transition:
    opacity .8s ease,
    transform .9s cubic-bezier(.16,1,.3,1);
}

.motion-reveal.is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}

@media (hover:hover) and (pointer:fine){
  .product-card,
  .segment-card,
  .integration-card,
  .marketplace-card{
    transition:
      transform .4s cubic-bezier(.16,1,.3,1),
      box-shadow .4s ease;
  }

  .product-card:hover,
  .segment-card:hover,
  .integration-card:hover,
  .marketplace-card:hover{
    transform:translateY(-5px);
  }
}

@media (max-width:1000px){
  .hero-motion-glow{
    display:none;
  }

  .motion-reveal{
    transform:translate3d(0,20px,0);
  }
}

@media (prefers-reduced-motion:reduce){
  .hero-motion-glow,
  .hero-motion-title,
  .hero-motion-copy,
  .hero-floating-slide.is-active,
  .motion-reveal{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }

  .motion-reveal{
    opacity:1 !important;
  }
}
