/* =========================================================
   SMILE / ISMAILI — PREMIUM CAMPAIGN UI 2026
   Camada visual somente. Não altera rotas, APIs ou regras.
========================================================= */
:root{
  --sm-navy:#050a2b;
  --sm-navy-2:#08133e;
  --sm-navy-3:#0d1e55;
  --sm-yellow:#ffd21a;
  --sm-yellow-2:#ffe66b;
  --sm-cream:#f5f0e4;
  --sm-ink:#07112f;
  --sm-green:#0b7d49;
  --sm-line:rgba(255,255,255,.13);
  --sm-shadow:0 28px 80px rgba(1,5,24,.26);
}
body{background:var(--sm-navy);color:#fff}
.site-bg:before{
  background:
    linear-gradient(90deg,rgba(4,10,43,.96) 0%,rgba(4,10,43,.89) 42%,rgba(4,10,43,.54) 72%,rgba(4,10,43,.85) 100%),
    url('../img/fundo.png') center/cover no-repeat!important;
  filter:saturate(.92) contrast(1.02)!important;
  transform:scale(1.04)!important;
}
.site-bg:after{
  background:
    radial-gradient(circle at 75% 18%,rgba(255,210,26,.16),transparent 27%),
    radial-gradient(circle at 16% 72%,rgba(11,125,73,.18),transparent 30%),
    linear-gradient(180deg,rgba(5,10,43,.02),rgba(5,10,43,.52))!important;
}
.container{width:min(1260px,92%)}
.topbar{
  width:min(980px,94%);top:22px;padding:8px 10px 8px 13px;border-radius:999px;
  background:rgba(13,30,85,.78);border:1px solid rgba(255,255,255,.16);
  box-shadow:0 18px 54px rgba(1,5,24,.34);backdrop-filter:blur(24px) saturate(1.3)
}
.topbar.scrolled{background:rgba(7,15,53,.94)}
.brand{min-width:220px;gap:10px}.brand-logo{width:48px;height:40px;border-radius:12px}.brand-name{font-size:15px}.brand-name span{color:var(--sm-yellow)}
.brand-sub{font-size:8px;color:#bec8e2}.nav{gap:2px}.nav a{font-size:11px;padding:10px 9px;color:#fff}.nav a:hover{color:var(--sm-yellow);background:rgba(255,255,255,.08)}
.btn-adm{background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important}
.header-actions{background:transparent;border:0;padding:0}.header-actions .btn{padding:12px 17px;font-size:11px}
.btn,.btn-yellow{border-radius:12px}.btn{background:linear-gradient(135deg,#0b7d49,#0e9b59);box-shadow:0 18px 44px rgba(11,125,73,.20)}
.btn-yellow{background:linear-gradient(135deg,var(--sm-yellow),var(--sm-yellow-2));color:#10162e;box-shadow:0 18px 44px rgba(255,210,26,.18)}
.btn-ghost{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);box-shadow:none}
.hero{min-height:100vh;padding:135px 0 54px;overflow:hidden}
.hero:before{content:"";position:absolute;right:-6vw;top:9vh;width:43vw;height:43vw;border-radius:50%;background:radial-gradient(circle,rgba(255,210,26,.12),transparent 62%);filter:blur(8px);pointer-events:none}
.hero-grid{grid-template-columns:1.04fr .96fr;gap:24px;align-items:end}
.hero-copy{padding-bottom:42px;z-index:4}
.hero .kicker{padding:0;background:none;border:0;border-radius:0;color:var(--sm-yellow);font-size:12px;letter-spacing:.26em}.hero .kicker:before{content:"";width:30px;height:2px;background:var(--sm-yellow);display:inline-block;margin-right:4px}
.hero h1{margin:17px 0 18px;font-size:clamp(60px,8.6vw,128px);line-height:.78;letter-spacing:-.075em;text-transform:uppercase;font-weight:950;max-width:760px}
.hero h1 .hero-first{display:block;color:#fff}.hero h1 strong{display:block;color:#fff!important;background:none!important;-webkit-text-fill-color:initial!important;font-weight:950}.hero-number{display:block;margin-top:16px;font-size:clamp(92px,12vw,178px);line-height:.75;letter-spacing:-.075em;font-weight:950;color:#fff}
.hero-slogan{display:inline-flex;margin-top:23px;padding:10px 15px;border-left:4px solid var(--sm-yellow);font-size:clamp(22px,2.3vw,34px);font-weight:950;text-transform:uppercase;letter-spacing:-.035em;color:var(--sm-yellow)}
.hero-text{max-width:680px;margin-top:22px;font-size:17px;line-height:1.72;color:#d9e0ef}.hero-actions{margin-top:25px}.hero-metrics{max-width:720px;margin-top:28px;gap:10px}
.metric{padding:16px 16px;border-radius:14px;background:rgba(9,20,62,.72);border-color:rgba(255,255,255,.11);box-shadow:0 14px 38px rgba(0,0,0,.14)}.metric:before{height:2px;background:var(--sm-yellow)}.metric strong{font-size:27px;color:#fff}.metric span{font-size:9px;color:#bfc9df}
.portrait-shell{align-self:stretch;display:flex;align-items:flex-end;position:relative}
.portrait-card{width:100%;height:750px;padding:0;border-radius:0;background:transparent;border:0;box-shadow:none;overflow:visible}
.portrait-card:before{content:"";position:absolute;inset:9% -13% 0 3%;background:linear-gradient(145deg,transparent 0 28%,rgba(255,210,26,.98) 28% 52%,rgba(11,125,73,.94) 52% 76%,transparent 76%);clip-path:polygon(42% 0,100% 14%,100% 100%,0 100%,0 26%);opacity:.82;filter:saturate(1.1)}
.portrait-inner{position:absolute;inset:0;border-radius:0;overflow:visible}.portrait-inner img{height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 28px 28px rgba(0,0,0,.26))}.portrait-inner:after{display:none}
.portrait-badge{top:85px;right:-10px;width:105px;min-height:68px;border-radius:17px;box-shadow:var(--sm-shadow);transform:rotate(2deg)}
.portrait-info{left:auto;right:0;bottom:24px;width:min(360px,78%);padding:17px 19px;border-radius:14px;background:rgba(7,15,53,.88);border:1px solid rgba(255,255,255,.14)}.portrait-info h2{font-size:23px}.portrait-info p{margin-top:4px;font-size:11px;color:#d7dded}
.section{padding:100px 0}.section:nth-of-type(odd){background:var(--sm-cream);color:var(--sm-ink)}.section:nth-of-type(odd) .subtitle,.section:nth-of-type(odd) .story-card p,.section:nth-of-type(odd) .timeline-box p,.section:nth-of-type(odd) .agenda-card p{color:#58617a}.section:nth-of-type(odd) .kicker{background:none;border:0;padding:0;color:#9d7d00}.section:nth-of-type(odd) .kicker:before{content:"";display:inline-block;width:28px;height:2px;background:#b99800;margin-right:4px}.section:nth-of-type(even){background:var(--sm-navy);color:#fff}
.section-head{gap:64px;margin-bottom:42px}.title{font-size:clamp(42px,5vw,72px);line-height:.91;text-transform:uppercase;letter-spacing:-.055em}.title span{color:var(--sm-yellow)}.subtitle{font-size:16px;line-height:1.75}
.story-grid,.agenda-grid{gap:16px}.story-card,.agenda-card,.timeline-box,.number-card{border-radius:16px;box-shadow:0 15px 42px rgba(6,13,43,.07)}
.section:nth-of-type(odd) .story-card,.section:nth-of-type(odd) .agenda-card,.section:nth-of-type(odd) .timeline-box,.section:nth-of-type(odd) .number-card{background:#fff;border-color:rgba(7,17,47,.08)}
.story-card:before,.agenda-card:before{background:var(--sm-yellow);height:3px}.card-icon{border-radius:13px;background:#f6f0d8;border-color:#eadc9c}
.timeline:before{background:linear-gradient(var(--sm-yellow),var(--sm-navy-3))}.year{border-radius:14px;background:var(--sm-yellow);color:var(--sm-ink)}
.gov-block{border-radius:20px;background:linear-gradient(135deg,#0a1a4e,#071032 54%,#0a2440);border:1px solid rgba(255,255,255,.12)}.gov-logo{border-radius:12px}.commit-card{border-radius:14px;background:rgba(255,255,255,.065)}
.mapa-total-shell{border-radius:20px;background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.12)}.mapa-total-card,.mapa-mt-card{border-radius:16px}.mapa-total-card{background:linear-gradient(145deg,#0d1e55,#071134)}.mapa-total-card:before{background:rgba(255,210,26,.18)}
.mapa-mt-card{background:radial-gradient(circle at 50% 30%,rgba(255,210,26,.13),transparent 34%),linear-gradient(180deg,#0b194b,#071034)}.mapa-total-seal{color:var(--sm-yellow)}
.numbers{gap:14px}.number-card strong{color:var(--sm-yellow)}
.gallery{gap:14px}.photo{border-radius:16px}.photo.small{border-radius:16px}.contact-panel{border-radius:20px;background:linear-gradient(135deg,#0d1e55,#071034);border-color:rgba(255,255,255,.12)}
.contact-form input,.contact-form textarea{border-radius:11px;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.13)}
footer{background:#03071f;border-top-color:rgba(255,255,255,.08)}.footer-logo-img{border-radius:12px}
.whatsapp-float{border-radius:50%;background:#18b768}.backtop{border-radius:50%;background:var(--sm-yellow)}
@media(max-width:1180px){.topbar{width:94%}.hero-grid{grid-template-columns:1fr 430px}.portrait-card{height:650px}}
@media(max-width:900px){.topbar{border-radius:18px}.nav{top:84px;background:rgba(7,15,53,.98);border-radius:18px}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:0}.portrait-card{height:590px;max-width:600px;margin:auto}.hero h1{font-size:clamp(58px,16vw,100px)}.hero-number{font-size:clamp(96px,24vw,160px)}}
@media(max-width:620px){.topbar{top:9px}.brand-sub{display:none}.hero{padding-top:112px}.hero h1{font-size:52px}.hero-number{font-size:88px}.hero-slogan{font-size:22px}.portrait-card{height:475px}.portrait-badge{top:42px;right:3px;width:82px}.portrait-info{right:6px;bottom:4px}.section{padding:70px 0}.title{font-size:40px}.hero-metrics{grid-template-columns:1fr 1fr}.hero-metrics .metric:last-child{grid-column:1/-1}}

/* =========================================================
   SMILE SIGNATURE UI — V2.0
   Identidade própria da Ismaili. Inspiração de efeitos,
   sem reproduzir o layout da referência.
========================================================= */
:root{
  --smile-midnight:#07122f;
  --smile-blue:#10285f;
  --smile-blue-2:#173979;
  --smile-gold:#f3c631;
  --smile-gold-soft:#ffdf72;
  --smile-green:#0b7f4d;
  --smile-paper:#f8f5ed;
  --smile-text:#101a35;
}
html{scroll-padding-top:96px}
body{background:var(--smile-midnight);overflow-x:hidden}
.container{width:min(1320px,92%)}

/* Cabeçalho próprio: mais editorial e menos "cápsula" */
.topbar{
  width:min(1320px,calc(100% - 36px));
  top:18px;
  padding:10px 14px 10px 16px;
  border-radius:20px;
  background:linear-gradient(120deg,rgba(7,18,47,.96),rgba(16,40,95,.92));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 22px 60px rgba(1,6,25,.24);
  backdrop-filter:blur(18px) saturate(1.25);
}
.topbar:before{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--smile-gold),transparent 30%,transparent 70%,var(--smile-green));opacity:.9;border-radius:2px}
.brand{min-width:255px}.brand-logo{width:50px;height:42px;border-radius:13px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.brand-name{font-size:15px;letter-spacing:-.02em}.brand-name span{color:var(--smile-gold)}.brand-sub{letter-spacing:.12em}
.nav{gap:4px}.nav a{position:relative;border-radius:10px;padding:10px 9px;font-size:10.5px;letter-spacing:.01em}.nav a:not(.btn-adm):after{content:"";position:absolute;left:11px;right:11px;bottom:5px;height:2px;background:var(--smile-gold);transform:scaleX(0);transform-origin:left;transition:.22s}.nav a:hover:after{transform:scaleX(1)}
.btn-adm{border-radius:12px!important;background:rgba(255,255,255,.08)!important}
.header-actions .btn-yellow{border-radius:12px;padding-inline:18px}

/* Hero exclusivo: foto em arco + número como assinatura visual */
.hero{min-height:930px;padding:150px 0 70px;background:
 linear-gradient(118deg,rgba(7,18,47,.98) 0 46%,rgba(7,18,47,.83) 63%,rgba(7,18,47,.96) 100%),
 url('../img/fundo.png') center/cover no-repeat;isolation:isolate}
.hero:before{right:auto;left:-12vw;top:12vh;width:46vw;height:46vw;background:radial-gradient(circle,rgba(243,198,49,.12),transparent 62%)}
.hero:after{content:"15163";position:absolute;right:-1vw;bottom:-4vh;font-size:clamp(150px,24vw,410px);line-height:.75;font-weight:950;letter-spacing:-.09em;color:rgba(255,255,255,.035);z-index:-1;pointer-events:none}
.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);gap:72px;align-items:center}
.hero-copy{padding:18px 0 30px}
.hero .kicker{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.2em;color:var(--smile-gold)}
.hero .kicker:before{width:42px}
.hero h1{font-size:clamp(68px,7.7vw,118px);line-height:.82;margin:24px 0 0;letter-spacing:-.07em}
.hero h1 .hero-first{font-weight:780}.hero h1 strong{font-weight:950;color:var(--smile-gold)!important}
.hero-number{position:relative;display:inline-block;margin-top:24px;font-size:clamp(86px,10vw,146px);line-height:.78;color:#fff}
.hero-number:after{content:"MDB";position:absolute;right:-58px;top:10px;font-size:12px;letter-spacing:.18em;color:var(--smile-gold);transform:rotate(90deg);opacity:.9}
.hero-slogan{border:0;margin-top:26px;padding:0;font-size:clamp(22px,2vw,31px);color:#fff}.hero-slogan:before{content:"";width:54px;height:8px;border-radius:10px;background:linear-gradient(90deg,var(--smile-gold) 0 62%,var(--smile-green) 62%);display:inline-block;margin-right:13px;vertical-align:middle}
.hero-text{max-width:650px;color:#d4dced;font-size:16px}
.hero-actions{gap:10px}.hero-actions .btn{border-radius:12px;padding:14px 19px}
.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:760px}.metric{min-height:96px;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035));backdrop-filter:blur(10px)}.metric:before{width:36px;left:16px;top:14px;border-radius:5px}.metric strong{margin-top:7px}
.portrait-shell{justify-content:center;min-height:700px}.portrait-card{height:700px;max-width:520px;position:relative}
.portrait-card:before{inset:35px 18px 22px 26px;border-radius:250px 250px 42px 42px;clip-path:none;background:linear-gradient(160deg,rgba(243,198,49,.95),rgba(11,127,77,.92));opacity:1;transform:rotate(2.2deg)}
.portrait-card:after{content:"";position:absolute;inset:58px 4px 8px 45px;border:1px solid rgba(255,255,255,.30);border-radius:250px 250px 42px 42px;transform:rotate(-2.8deg);z-index:-1}
.portrait-inner{inset:0 0 0 0;overflow:hidden;border-radius:240px 240px 36px 36px}.portrait-inner img{object-fit:contain;object-position:center bottom;transform:scale(1.02);filter:drop-shadow(0 30px 34px rgba(0,0,0,.34))}
.portrait-badge{top:40px;right:-18px;width:95px;min-height:72px;border-radius:18px;transform:rotate(5deg)}
.portrait-info{left:-18px;right:auto;bottom:46px;width:320px;border-radius:18px;background:rgba(7,18,47,.90);box-shadow:0 24px 50px rgba(0,0,0,.25)}

/* Ritmo de seções com identidade Smile */
.section{position:relative;padding:112px 0}
.section:nth-of-type(odd){background:var(--smile-paper)}
.section:nth-of-type(even){background:var(--smile-midnight)}
.section-head{grid-template-columns:.9fr 1.1fr;align-items:end;gap:90px}.title{font-size:clamp(44px,4.7vw,70px)}
.section:nth-of-type(odd) .title span{color:#b78f00}.section:nth-of-type(even) .title span{color:var(--smile-gold)}
.story-grid{grid-template-columns:1.2fr .9fr .9fr;align-items:stretch}.story-card{position:relative;padding:30px 28px;min-height:240px;border-radius:24px}.story-card:first-child{transform:translateY(-14px);background:linear-gradient(145deg,#fff,#f4eedf)}.story-card:nth-child(2){transform:translateY(18px)}.story-card:nth-child(3){transform:translateY(-2px)}
.card-icon{width:54px;height:54px;display:grid;place-items:center;font-size:26px;border-radius:18px}
.timeline{max-width:1080px;margin-left:auto}.timeline:before{left:106px}.timeline-item{grid-template-columns:90px 1fr;gap:30px}.year{border-radius:999px;width:90px;height:50px;display:grid;place-items:center}.timeline-box{border-radius:22px;padding:26px 28px}
.gov-block{border-radius:34px;padding:44px;background:linear-gradient(135deg,#10285f 0%,#081638 56%,#0a2f2b 130%);overflow:hidden}.gov-block:after{content:"";position:absolute;width:280px;height:280px;right:-90px;bottom:-110px;border-radius:50%;border:55px solid rgba(243,198,49,.08)}.commit-grid{gap:12px}.commit-card{border-radius:18px;min-height:150px}
.numbers{grid-template-columns:1.2fr repeat(3,1fr)}.number-card{border-radius:24px;min-height:190px}.number-card:first-child{background:linear-gradient(145deg,var(--smile-blue),var(--smile-midnight));color:#fff;transform:translateY(-18px)}
.agenda-grid{grid-template-columns:repeat(3,1fr)}.agenda-card{border-radius:24px;padding:30px}.agenda-card h3{display:inline-flex;border:1px solid rgba(7,18,47,.1);border-radius:999px;padding:7px 12px;font-size:12px}.agenda-card b{display:block;margin:24px 0 10px;font-size:20px}
.gallery{grid-template-columns:1.35fr .65fr;gap:18px}.photo{border-radius:28px}.photo.small{border-radius:22px}.gallery-side{gap:18px}

/* Contato: composição mais limpa e autoral */
#contato{background:linear-gradient(160deg,#081638 0%,#07122f 58%,#0c2246 100%);padding:118px 0 128px}
.contact-panel{position:relative;display:grid;grid-template-columns:.78fr 1.22fr;gap:64px;padding:52px;border-radius:32px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.11);box-shadow:0 32px 90px rgba(0,0,0,.20);overflow:hidden}
.contact-panel:before{content:"É PRA JÁ";position:absolute;left:-10px;bottom:-34px;font-size:106px;font-weight:950;letter-spacing:-.07em;color:rgba(255,255,255,.025);pointer-events:none}
.contact-panel>div:first-child{align-self:center;padding-right:12px}.contact-panel .title{font-size:clamp(48px,4.6vw,72px);max-width:470px}.contact-panel .subtitle{max-width:440px;color:#cbd4e7}
.contact-form{display:grid;gap:14px;background:rgba(0,0,0,.12);border:1px solid rgba(255,255,255,.08);padding:22px;border-radius:24px}.form-row{gap:14px}.contact-form input,.contact-form textarea{min-height:58px;background:#13285a;border:1px solid rgba(255,255,255,.10);border-radius:14px;color:#fff;padding:0 18px}.contact-form textarea{min-height:150px;padding-top:17px}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#aebbd7}.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:rgba(243,198,49,.75);box-shadow:0 0 0 3px rgba(243,198,49,.08)}.contact-form .btn-yellow{min-height:56px;border-radius:14px;font-size:13px}

footer{padding:44px 0 34px;background:#040a20}.footer-logo-img{width:68px;height:48px;background:#fff;padding:5px;border-radius:14px}
.whatsapp-float,.backtop{box-shadow:0 16px 36px rgba(0,0,0,.25)}

@media(max-width:1180px){.topbar{width:calc(100% - 24px)}.brand{min-width:220px}.hero-grid{grid-template-columns:1fr 430px;gap:34px}.portrait-card{height:620px}.section-head{gap:48px}.contact-panel{gap:38px}}
@media(max-width:980px){.topbar{border-radius:18px}.nav{top:82px}.hero{min-height:auto}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-top:20px}.portrait-shell{min-height:auto}.portrait-card{height:600px}.story-grid{grid-template-columns:1fr}.story-card{transform:none!important}.numbers{grid-template-columns:1fr 1fr}.number-card:first-child{transform:none}.contact-panel{grid-template-columns:1fr}.section-head{grid-template-columns:1fr;gap:22px}.gallery{grid-template-columns:1fr}.gallery-side{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.topbar{width:calc(100% - 16px);top:8px}.brand{min-width:0}.brand-name{font-size:13px}.hero{padding-top:120px}.hero-grid{gap:10px}.hero h1{font-size:56px}.hero-number{font-size:88px}.hero-number:after{right:-44px}.hero-metrics{grid-template-columns:1fr}.portrait-card{height:500px}.portrait-info{left:4px;bottom:18px;width:280px}.section{padding:78px 0}.section-head{margin-bottom:32px}.story-grid,.agenda-grid,.numbers{grid-template-columns:1fr}.gallery-side{grid-template-columns:1fr}.gov-block{padding:26px 20px;border-radius:24px}.contact-panel{padding:28px 20px;border-radius:24px}.contact-panel:before{font-size:68px}.contact-form{padding:14px}.form-row{grid-template-columns:1fr}.title{font-size:42px}}

/* =========================================================
   SMILE SIGNATURE V3 — identidade autoral
   O layout abaixo substitui o cabeçalho-cápsula e cria uma
   abertura editorial própria, sem alterar rotas ou funções.
========================================================= */
.smile-header.topbar{
  position:fixed;top:0;left:0;right:0;transform:none;width:100%;max-width:none;
  padding:0;border:0;border-radius:0;background:rgba(5,12,34,.78);
  box-shadow:none;backdrop-filter:blur(18px) saturate(1.2);
  border-bottom:1px solid rgba(255,255,255,.10)
}
.smile-header.topbar.scrolled{background:rgba(5,12,34,.96);box-shadow:0 12px 34px rgba(0,0,0,.22)}
.smile-header.topbar:before{display:none}
.header-frame{width:min(1380px,94%);min-height:82px;margin:auto;display:grid;grid-template-columns:280px 1fr auto;align-items:center;gap:22px}
.brand{min-width:0;gap:12px}.brand-mark{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:#fff;box-shadow:0 10px 28px rgba(0,0,0,.22)}
.brand-mark:after{content:"";position:absolute;left:7px;right:7px;bottom:-5px;height:4px;border-radius:4px;background:linear-gradient(90deg,#0b7d49 0 62%,#f3c631 62%)}
.brand-logo{width:44px;height:38px;padding:4px;background:transparent;box-shadow:none}.brand-name{font-size:16px}.brand-sub{font-size:8px;letter-spacing:.16em}
.nav{justify-content:center;gap:1px}.nav a{padding:30px 9px 28px;border-radius:0;font-size:10.5px;text-transform:uppercase;letter-spacing:.055em;border-bottom:3px solid transparent}
.nav a:not(.btn-adm):after{display:none}.nav a:hover{background:transparent;border-bottom-color:var(--smile-gold);color:#fff}
.btn-adm{margin-left:8px!important;padding:11px 14px!important;border-radius:10px!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.13)!important;letter-spacing:.04em}
.header-actions{gap:8px}.header-actions .btn-yellow{border-radius:10px;padding:12px 18px;text-transform:uppercase;letter-spacing:.04em}

.hero{min-height:960px;padding:126px 0 0;background:
 linear-gradient(90deg,rgba(5,12,34,.98) 0 44%,rgba(5,12,34,.82) 58%,rgba(5,12,34,.28) 79%,rgba(5,12,34,.65) 100%),
 url('../img/fundo.png') center/cover no-repeat;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0 48%,rgba(243,198,49,.08) 48% 48.7%,transparent 48.7%);pointer-events:none}
.hero:after{content:"15163";right:-3vw;bottom:90px;font-size:clamp(190px,27vw,500px);color:rgba(255,255,255,.028);letter-spacing:-.10em}
.hero-ribbon{position:absolute;left:0;top:82px;z-index:4;width:100%;padding:8px 4vw;background:linear-gradient(90deg,#f3c631,#f7d95e 46%,#0b7f4d 46%,#0b7f4d);color:#07122f;font-size:10px;font-weight:950;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;overflow:hidden}
.hero-ribbon b{padding:0 13px}
.hero-grid{grid-template-columns:minmax(0,1.02fr) minmax(440px,.98fr);gap:48px;align-items:end;padding-top:54px}
.hero-copy{align-self:center;padding:30px 0 82px}.hero .kicker{display:inline-flex;padding:9px 12px;border-radius:8px;background:rgba(243,198,49,.10);border-left:3px solid var(--smile-gold);letter-spacing:.16em}.hero .kicker:before{display:none}
.hero h1{margin:24px 0 18px;font-size:clamp(66px,7.6vw,120px);line-height:.80;letter-spacing:-.075em}.hero h1 .hero-first{display:block;font-weight:640;color:#fff}.hero h1 strong{display:block;color:var(--smile-gold)!important;-webkit-text-fill-color:initial;background:none}
.hero-signature{display:flex;align-items:center;gap:26px;margin:18px 0 22px}.hero-number{margin:0;padding-right:24px;border-right:1px solid rgba(255,255,255,.18);font-size:clamp(76px,8vw,124px);line-height:.78;letter-spacing:-.065em;color:#fff}.hero-number:after{display:none}.hero-slogan{margin:0;padding:0;border:0;display:flex;flex-direction:column;gap:5px;font-size:clamp(20px,2vw,28px);line-height:1.05;font-weight:850;color:#fff}.hero-slogan:before{display:none}.hero-slogan small{font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--smile-gold);font-weight:900}
.hero-text{font-size:16px;line-height:1.7;max-width:690px}.hero-actions .btn{border-radius:10px;text-transform:uppercase;letter-spacing:.035em;font-size:11px;padding:14px 18px}
.portrait-shell{min-height:715px;align-items:end}.portrait-card{height:710px;max-width:590px;margin-left:auto}.portrait-card:before{inset:70px 0 0 65px;border-radius:42% 42% 0 0;transform:none;background:linear-gradient(160deg,rgba(243,198,49,.92),rgba(11,127,77,.78));clip-path:polygon(18% 0,100% 0,100% 100%,0 100%,0 18%)}
.portrait-card:after{inset:36px -18px 0 108px;border-radius:0;border:1px solid rgba(243,198,49,.28);transform:none;clip-path:polygon(18% 0,100% 0,100% 100%,0 100%,0 18%)}
.portrait-inner{inset:0;border-radius:0;clip-path:polygon(16% 0,100% 0,100% 100%,0 100%,0 16%)}.portrait-inner img{object-fit:contain;object-position:center bottom;transform:scale(1.03)}
.portrait-badge{top:58px;right:12px;width:84px;min-height:62px;border-radius:12px;transform:none}
.portrait-info{left:2px;bottom:30px;width:360px;border-radius:0 18px 18px 0;background:linear-gradient(90deg,#07122f 0%,rgba(7,18,47,.92));border-left:5px solid var(--smile-gold);padding:16px 20px}.portrait-info span{display:block;color:var(--smile-gold);font-size:10px;font-weight:950;letter-spacing:.18em;margin-bottom:4px}
.hero-metrics-wrap{position:relative;z-index:5;background:rgba(4,9,27,.86);border-top:1px solid rgba(255,255,255,.09)}.hero-metrics{max-width:none;margin:0 auto;padding:18px 0;grid-template-columns:repeat(3,1fr);gap:0}.metric{min-height:auto;padding:14px 28px;border:0;border-radius:0;background:transparent;backdrop-filter:none}.metric+.metric{border-left:1px solid rgba(255,255,255,.10)}.metric:before{display:none}.metric strong{font-size:34px}.metric span{margin-top:5px;font-size:10px;letter-spacing:.10em}

/* mais personalidade no ritmo das seções */
.section{padding:108px 0}.section-head{position:relative}.section-head:before{content:"SMILE";position:absolute;right:0;top:-34px;font-size:84px;font-weight:950;letter-spacing:-.06em;color:rgba(7,18,47,.035);pointer-events:none}.section:nth-of-type(even) .section-head:before{color:rgba(255,255,255,.03)}
.story-card,.agenda-card,.number-card{border-radius:16px}.story-card:first-child{transform:none}.story-card:nth-child(2),.story-card:nth-child(3){transform:none}.story-grid{gap:18px}.story-card{border-top:4px solid transparent}.story-card:nth-child(1){border-top-color:var(--smile-gold)}.story-card:nth-child(2){border-top-color:var(--smile-green)}.story-card:nth-child(3){border-top-color:#1e4d9a}
#contato{padding-top:110px}.contact-panel{grid-template-columns:.9fr 1.1fr;border-radius:20px;background:linear-gradient(120deg,rgba(16,40,95,.46),rgba(255,255,255,.035));border-left:5px solid var(--smile-gold)}.contact-panel:before{content:"15163";font-size:150px;left:auto;right:18px;bottom:-42px}
.contact-form{border-radius:14px;background:rgba(3,8,28,.40)}.contact-form input,.contact-form textarea{border-radius:10px;background:rgba(24,47,99,.72)}

@media(max-width:1120px){.header-frame{grid-template-columns:240px 1fr auto}.nav a{padding-left:6px;padding-right:6px;font-size:9.5px}.hero-grid{grid-template-columns:1fr 410px}.portrait-card{height:620px}.portrait-shell{min-height:620px}}
@media(max-width:980px){.smile-header.topbar{top:0;width:100%;border-radius:0}.header-frame{width:94%;min-height:72px;display:flex;justify-content:space-between}.nav{top:72px;left:3%;right:3%;padding:12px;border-radius:14px;background:#07122f}.nav a{padding:12px 14px;border-bottom:0}.hero-ribbon{top:72px}.hero{padding-top:130px}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:20px}.portrait-card{margin:auto}.hero-metrics{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:680px){.header-frame{min-height:66px}.brand-mark{width:46px;height:46px}.brand-sub{display:none}.hero-ribbon{top:66px;font-size:8px}.hero{padding-top:118px}.hero h1{font-size:58px}.hero-signature{align-items:flex-end;gap:16px}.hero-number{font-size:78px;padding-right:16px}.hero-slogan{font-size:20px}.portrait-shell{min-height:auto}.portrait-card{height:500px}.portrait-info{width:285px}.hero-metrics{grid-template-columns:1fr}.metric+.metric{border-left:0;border-top:1px solid rgba(255,255,255,.09)}.section-head:before{font-size:52px}.contact-panel{border-left-width:3px}}

/* =========================================================
   SMILE SIGNATURE V3.1 — MOBILE HARDENING
   Escopo exclusivo: <= 680px. Desktop permanece intacto.
========================================================= */
@media (max-width:680px){
  html,body{max-width:100%;overflow-x:hidden}
  body{min-width:0}
  *,*::before,*::after{box-sizing:border-box}
  img,svg,video,canvas,iframe{max-width:100%;height:auto}
  .container{width:100%;max-width:100%;padding-left:18px;padding-right:18px;margin-left:auto;margin-right:auto}
  .hero-grid,.gov-grid,.commit-grid,.story-grid,.agenda-grid,.numbers,.gallery,.gallery-side,.contact-panel,.mapa-total-grid,.section-head,.timeline-item,.form-row{min-width:0;max-width:100%}
  .hero-grid>*,.gov-grid>*,.commit-grid>*,.story-grid>*,.agenda-grid>*,.numbers>*,.gallery>*,.gallery-side>*,.contact-panel>*,.mapa-total-grid>*,.section-head>*,.timeline-item>*,.form-row>*{min-width:0;max-width:100%}

  /* Cabeçalho mobile */
  .smile-header.topbar{left:0;right:0;width:100%;max-width:100%;padding:0}
  .header-frame{width:100%;max-width:100%;min-height:66px;padding:0 14px;gap:8px}
  .brand{flex:1;min-width:0;max-width:calc(100% - 58px);gap:9px;overflow:hidden}
  .brand-mark{width:42px;height:42px;min-width:42px;border-radius:12px}
  .brand-logo{width:38px;height:34px;padding:3px}
  .brand-name{font-size:12px;line-height:1.02;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand-sub{display:none}
  .header-actions{flex:0 0 auto;padding:0;background:none;border:0}
  .header-actions .btn{display:none!important}
  .mobile-btn{display:grid;width:44px;height:44px;min-width:44px;border-radius:12px}
  .nav{position:fixed;top:66px;left:10px!important;right:10px!important;width:auto;max-width:none;max-height:calc(100dvh - 82px);overflow-y:auto;padding:10px!important;border-radius:14px;gap:2px;box-shadow:0 20px 55px rgba(0,0,0,.38)}
  .nav a{width:100%;padding:12px 13px!important;font-size:11px!important;line-height:1.25;text-align:left;border-radius:9px!important;border:0!important;white-space:normal}
  .nav .btn-adm{margin:5px 0 0!important;width:100%}

  /* Abertura */
  .hero-ribbon{top:66px;padding:7px 14px;font-size:7.5px;letter-spacing:.12em;text-overflow:ellipsis}
  .hero-ribbon b{padding:0 5px}
  .hero{min-height:auto;padding:112px 0 0;background-position:58% center}
  .hero:after{right:-12vw;bottom:36px;font-size:48vw}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:4px;padding-top:22px}
  .hero-copy{width:100%;padding:18px 0 20px}
  .hero .kicker{max-width:100%;padding:8px 10px;font-size:9px;line-height:1.35;letter-spacing:.11em;white-space:normal}
  .hero h1{max-width:100%;margin:18px 0 14px;font-size:clamp(46px,15vw,58px);line-height:.84;letter-spacing:-.065em;overflow-wrap:anywhere}
  .hero-signature{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:end;gap:12px;width:100%;margin:14px 0 18px}
  .hero-number{min-width:0;font-size:clamp(62px,20vw,78px);padding-right:12px;white-space:nowrap}
  .hero-slogan{min-width:0;font-size:clamp(17px,5.2vw,20px);overflow-wrap:anywhere}
  .hero-slogan small{font-size:8px;letter-spacing:.11em}
  .hero-text{max-width:100%;font-size:15px;line-height:1.62;overflow-wrap:anywhere}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:9px;width:100%;margin-top:20px}
  .hero-actions .btn{width:100%;min-height:48px;padding:12px 14px;text-align:center;white-space:normal}
  .portrait-shell{width:100%;min-height:0;overflow:hidden}
  .portrait-card{width:100%;max-width:100%;height:430px;margin:0 auto;overflow:hidden}
  .portrait-card:before{inset:58px 2px 0 34px}
  .portrait-card:after{inset:34px 0 0 54px;right:0}
  .portrait-inner{max-width:100%;overflow:hidden}
  .portrait-inner img{width:100%;max-width:100%;object-position:center bottom;transform:none}
  .portrait-badge{top:46px;right:8px;width:72px;min-height:54px}
  .portrait-info{left:0;right:10px;bottom:12px;width:auto;max-width:calc(100% - 10px);padding:13px 15px}
  .portrait-info h2{font-size:19px;overflow-wrap:anywhere}
  .hero-metrics-wrap{width:100%;overflow:hidden}
  .hero-metrics{width:100%;grid-template-columns:1fr!important;padding:8px 18px 14px}
  .metric{width:100%;padding:14px 4px}
  .metric strong{font-size:28px}

  /* Seções */
  .section{width:100%;overflow:hidden;padding:68px 0}
  .section-head{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:16px;margin-bottom:28px}
  .section-head:before{right:-5px;top:-20px;font-size:44px;max-width:100%;overflow:hidden}
  .title,.contact-panel .title{max-width:100%;font-size:clamp(36px,11vw,44px);line-height:.94;letter-spacing:-.045em;overflow-wrap:anywhere;word-break:normal}
  .subtitle{max-width:100%;font-size:15px;line-height:1.65;overflow-wrap:anywhere}
  .story-grid,.agenda-grid,.numbers,.gallery,.gallery-side,.commit-grid{grid-template-columns:minmax(0,1fr)!important;gap:14px}
  .story-card,.agenda-card,.number-card,.timeline-box,.commit-card{width:100%;max-width:100%;min-height:0;padding:22px 18px}
  .story-card h3,.agenda-card h3,.timeline-box h3,.commit-card h3{overflow-wrap:anywhere}

  /* Timeline */
  .timeline{width:100%;max-width:100%;margin:0;gap:14px}
  .timeline:before{display:none}
  .timeline-item{grid-template-columns:minmax(0,1fr)!important;gap:10px;width:100%}
  .year{width:max-content;min-width:82px;height:auto;min-height:42px;padding:8px 14px;border-radius:999px;font-size:16px}
  .timeline-box{padding:20px 18px;border-radius:16px}
  .timeline-box h3{font-size:22px}

  /* Compromissos */
  .gov-block{width:100%;max-width:100%;padding:24px 18px;border-radius:20px}
  .gov-grid{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:22px}
  .gov-logo{width:92px;max-width:40%}
  .gov-block h2{font-size:clamp(34px,10vw,44px);overflow-wrap:anywhere}
  .gov-block p{font-size:15px;line-height:1.65}
  .commit-card{min-height:0}
  .commit-card h3{display:block;font-size:17px;line-height:1.35}
  .commit-card h3 span{display:inline-block;margin-right:5px}

  /* Mapa */
  .mapa-total-shell{width:100%;max-width:100%;padding:16px;border-radius:20px;overflow:hidden}
  .mapa-total-grid{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:14px}
  .mapa-total-card,.mapa-mt-card{width:100%;max-width:100%;padding:20px 16px;border-radius:18px;overflow:hidden}
  .mapa-total-card strong{font-size:clamp(46px,15vw,60px);line-height:.95;overflow-wrap:anywhere}
  .mapa-total-card span{font-size:16px}
  .mapa-mt-card{min-height:330px}
  .mapa-mt-svg{display:block;width:100%;height:auto;min-height:0;max-height:300px;margin:0 auto}
  .mapa-mt-title{max-width:100%}
  .mapa-total-seal{max-width:100%;white-space:normal}

  /* Agenda / galeria */
  .agenda-card b{font-size:18px;margin:18px 0 8px}
  .photo,.photo.small{width:100%;max-width:100%;min-height:0;height:auto;aspect-ratio:4/5;border-radius:18px}
  .photo.small{aspect-ratio:4/3}
  .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .photo:after{left:10px;right:10px;bottom:10px;padding:12px 13px;border-radius:12px;font-size:13px;overflow-wrap:anywhere}

  /* Contato */
  #contato{padding-top:72px}
  .contact-panel{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:24px;width:100%;max-width:100%;padding:24px 16px;border-radius:18px;border-left-width:3px;overflow:hidden}
  .contact-panel:before{right:-4px;bottom:-18px;font-size:72px}
  .contact-panel>div:first-child{padding-right:0;min-width:0}
  .contact-form{width:100%;max-width:100%;padding:13px;gap:10px;border-radius:12px}
  .form-row{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:10px}
  .contact-form input,.contact-form textarea{display:block;width:100%;max-width:100%;min-width:0;min-height:52px;padding:14px 13px;font-size:16px;border-radius:9px}
  .contact-form textarea{min-height:125px;padding-top:14px}
  .contact-form .btn-yellow{width:100%;max-width:100%;min-height:52px;padding:12px}

  /* Rodapé e botões flutuantes */
  footer{padding:34px 18px 96px;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
  .footer-logo-img{width:76px}
  .whatsapp-float,.backtop{right:12px;width:50px;height:50px;border-radius:50%}
  .whatsapp-float{bottom:72px;font-size:23px}
  .backtop{bottom:14px;font-size:19px}
}

@media (max-width:420px){
  .container{padding-left:14px;padding-right:14px}
  .header-frame{padding:0 10px}
  .brand-name{font-size:11px}
  .hero{padding-top:108px}
  .hero h1{font-size:clamp(42px,14.5vw,52px)}
  .hero-signature{grid-template-columns:1fr;align-items:start;gap:8px}
  .hero-number{width:max-content;border-right:0;border-bottom:1px solid rgba(255,255,255,.18);padding:0 0 9px;font-size:clamp(62px,22vw,76px)}
  .hero-slogan{font-size:18px}
  .portrait-card{height:390px}
  .portrait-badge{width:64px;top:42px}
  .portrait-info{right:6px;max-width:calc(100% - 6px)}
  .section{padding:60px 0}
  .title,.contact-panel .title{font-size:clamp(33px,10.7vw,40px)}
  .mapa-mt-card{min-height:300px}
  .mapa-mt-svg{max-height:270px}
}

/* =========================================================
   SMILE SIGNATURE V3.3 — MOBILE PREMIUM COMPOSITION
   Escopo exclusivo: celulares. Desktop/tablet grande intactos.
========================================================= */
@media (max-width:680px){
  /* Hero deixa de parecer desktop comprimido */
  .hero{
    background:
      radial-gradient(circle at 86% 26%, rgba(243,198,49,.10), transparent 26%),
      radial-gradient(circle at 4% 62%, rgba(11,127,77,.11), transparent 30%),
      linear-gradient(180deg,#07122f 0%,#06102b 66%,#050c22 100%);
    padding-top:112px;
  }
  .hero:before{background:linear-gradient(145deg,transparent 0 60%,rgba(243,198,49,.055) 60% 60.7%,transparent 60.7%)}
  .hero:after{font-size:54vw;right:-10vw;bottom:12px;color:rgba(255,255,255,.022)}
  .hero-ribbon{background:linear-gradient(90deg,#f3c631 0 68%,#0b7f4d 68% 100%);color:#07122f}
  .hero-grid{gap:26px;padding-top:28px}
  .hero-copy{padding:14px 0 0}
  .hero .kicker{border:1px solid rgba(243,198,49,.22);border-left:3px solid var(--smile-gold);background:rgba(243,198,49,.06);border-radius:10px}
  .hero h1{margin:18px 0 8px;font-size:clamp(44px,13.8vw,56px);line-height:.86;letter-spacing:-.055em}
  .hero h1 .hero-first{font-weight:620}
  .hero h1 strong{margin-top:2px}

  /* número + slogan em assinatura horizontal elegante */
  .hero-signature{
    display:grid;
    grid-template-columns:minmax(0,138px) minmax(0,1fr);
    gap:14px;
    align-items:center;
    margin:18px 0 20px;
    padding:14px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:18px;
    background:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
    box-shadow:0 18px 50px rgba(0,0,0,.18);
  }
  .hero-number{
    width:auto;
    padding:0 14px 0 0;
    border:0;
    border-right:1px solid rgba(255,255,255,.12);
    font-size:clamp(50px,16vw,66px);
    line-height:.88;
    letter-spacing:-.06em;
  }
  .hero-slogan{font-size:clamp(16px,4.8vw,19px);line-height:1.08}
  .hero-slogan small{margin-bottom:3px;font-size:7.5px;letter-spacing:.14em}
  .hero-text{font-size:15.5px;line-height:1.7;color:#d9e1f1}

  /* CTAs mais refinados e menos pesados */
  .hero-actions{gap:10px;margin-top:22px}
  .hero-actions .btn{
    min-height:50px;
    border-radius:14px;
    font-size:11px;
    letter-spacing:.025em;
    box-shadow:none;
  }
  .hero-actions .btn-yellow{box-shadow:0 10px 28px rgba(243,198,49,.16)}
  .hero-actions .btn:nth-child(2){background:#0b7f4d;border-color:#14975e;color:#fff}
  .hero-actions .btn-ghost{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.14)}

  /* Foto vira um editorial vertical real, sem logo solta */
  .portrait-shell{overflow:visible;margin-top:2px;padding-bottom:10px}
  .portrait-card{
    height:auto;
    min-height:520px;
    aspect-ratio:4/5.15;
    border-radius:26px;
    overflow:hidden;
    background:linear-gradient(155deg,rgba(243,198,49,.96) 0 32%,rgba(11,127,77,.92) 32% 49%,#0a1736 49% 100%);
    box-shadow:0 28px 70px rgba(0,0,0,.30);
  }
  .portrait-card:before{
    inset:0;
    border-radius:0;
    clip-path:none;
    background:
      linear-gradient(145deg,rgba(255,255,255,.05),transparent 28%),
      linear-gradient(180deg,transparent 54%,rgba(4,10,30,.24) 100%);
  }
  .portrait-card:after{
    inset:14px;
    border-radius:20px;
    clip-path:none;
    border:1px solid rgba(255,255,255,.12);
  }
  .portrait-inner{inset:0;border-radius:0;clip-path:none}
  .portrait-inner img{
    position:absolute;
    inset:0;
    width:100%;height:100%;
    object-fit:cover;
    object-position:center 20%;
    filter:saturate(.98) contrast(1.02);
  }
  .portrait-badge{display:none}
  .portrait-info{
    left:14px;right:14px;bottom:14px;
    width:auto;max-width:none;
    padding:16px 17px 17px;
    border:1px solid rgba(255,255,255,.12);
    border-left:4px solid var(--smile-gold);
    border-radius:16px;
    background:linear-gradient(110deg,rgba(6,16,45,.94),rgba(10,29,66,.88));
    backdrop-filter:blur(12px);
    box-shadow:0 15px 40px rgba(0,0,0,.28);
  }
  .portrait-info span{font-size:9px;letter-spacing:.20em}
  .portrait-info h2{font-size:23px;line-height:1.05;margin:2px 0 0}
  .portrait-info p{font-size:12px;line-height:1.5;color:#d7dfef}

  /* Indicadores deixam de ser barra e viram cards premium */
  .hero-metrics-wrap{
    margin-top:6px;
    padding:18px 0 26px;
    border-top:0;
    background:linear-gradient(180deg,rgba(4,9,27,.22),rgba(4,9,27,.78));
  }
  .hero-metrics{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px;
    padding:0 18px;
  }
  .metric{
    position:relative;
    min-height:118px;
    padding:20px 16px 16px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:18px;
    background:linear-gradient(145deg,rgba(19,42,92,.72),rgba(7,18,47,.92));
    box-shadow:0 16px 36px rgba(0,0,0,.16);
  }
  .metric+.metric{border-left:1px solid rgba(255,255,255,.10);border-top:1px solid rgba(255,255,255,.10)}
  .metric:after{content:"";position:absolute;left:16px;top:14px;width:28px;height:3px;border-radius:99px;background:var(--smile-gold)}
  .metric:nth-child(2):after{background:var(--smile-green)}
  .metric:nth-child(3){grid-column:1/-1;min-height:104px}
  .metric:nth-child(3):after{background:linear-gradient(90deg,var(--smile-gold),var(--smile-green))}
  .metric strong{margin-top:11px;font-size:32px;line-height:.95;color:#fff}
  .metric span{margin-top:8px;font-size:9.5px;line-height:1.35;letter-spacing:.08em;color:#cbd5e9}

  /* Botões flutuantes menores e menos invasivos */
  .whatsapp-float,.backtop{right:14px;width:46px;height:46px}
  .whatsapp-float{bottom:68px;font-size:21px}
  .backtop{bottom:14px;font-size:17px}
}

@media (max-width:420px){
  .hero-signature{grid-template-columns:118px minmax(0,1fr);padding:12px;gap:12px}
  .hero-number{font-size:clamp(46px,15.5vw,58px);padding-right:10px;border-right:1px solid rgba(255,255,255,.12);border-bottom:0}
  .hero-slogan{font-size:16px}
  .portrait-card{min-height:470px;aspect-ratio:4/5.25}
  .portrait-info{left:10px;right:10px;bottom:10px}
  .hero-metrics{padding:0 14px}
  .metric{min-height:112px;padding-left:14px;padding-right:14px}
  .metric strong{font-size:29px}
}

/* =========================================================
   SMILE SIGNATURE V3.4 — LEITURA PREMIUM + ACESSIBILIDADE
   Escopo: melhorar contraste/legibilidade dos cards de
   Indicadores e Compromissos, preservando estrutura e rotas.
========================================================= */

/* INDICADORES — cards claros com contraste real */
#numeros .numbers{
  align-items:stretch;
  gap:18px;
}
#numeros .number-card,
#numeros .number-card:first-child{
  position:relative;
  min-height:188px;
  padding:30px 22px 28px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfaf6 100%);
  border:1px solid rgba(7,18,47,.10);
  box-shadow:0 18px 42px rgba(7,18,47,.09);
  color:#07122f;
  transform:none;
  overflow:hidden;
}
#numeros .number-card:before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:4px;
  background:linear-gradient(90deg,#c38c00 0 62%,#0b7f4d 62% 100%);
}
#numeros .number-card strong,
#numeros .number-card:first-child strong{
  display:block;
  margin:0;
  color:#b77f00;
  font-size:clamp(38px,3vw,48px);
  line-height:1;
  font-weight:950;
  letter-spacing:-.04em;
  text-shadow:none;
}
#numeros .number-card span,
#numeros .number-card:first-child span{
  display:block;
  max-width:240px;
  margin:14px auto 0;
  color:#0b1736;
  font-size:14px;
  line-height:1.42;
  font-weight:900;
  letter-spacing:.035em;
  text-transform:uppercase;
  text-wrap:balance;
}
#numeros .number-card:hover{
  transform:translateY(-4px);
  border-color:rgba(183,127,0,.26);
  box-shadow:0 24px 52px rgba(7,18,47,.13);
}

/* COMPROMISSOS — reforço de hierarquia e contraste */
#compromissos .gov-block{
  background:linear-gradient(135deg,#10285f 0%,#081638 58%,#083832 135%);
  border-color:rgba(255,255,255,.18);
}
#compromissos .gov-block h2{
  color:#ffffff;
  text-shadow:0 2px 16px rgba(0,0,0,.16);
}
#compromissos .gov-block > .gov-grid > div:first-child > p{
  color:#eef4ff;
  font-weight:560;
}
#compromissos .commit-card{
  position:relative;
  min-height:150px;
  padding:22px 22px 20px;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.055));
  border:1px solid rgba(255,255,255,.17);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
#compromissos .commit-card h3{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:0 0 10px;
  color:#ffffff;
  font-size:18px;
  line-height:1.3;
  font-weight:900;
  letter-spacing:-.015em;
}
#compromissos .commit-card h3 span{
  flex:0 0 auto;
  line-height:1.15;
  filter:saturate(.95);
}
#compromissos .commit-card p{
  margin:0;
  color:#e8eef9;
  font-size:14.5px;
  line-height:1.65;
  font-weight:560;
}
#compromissos .commit-card:hover{
  background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.075));
  border-color:rgba(243,198,49,.34);
}

/* foco visível para navegação por teclado */
#numeros .number-card:focus-within,
#compromissos .commit-card:focus-within{
  outline:3px solid rgba(243,198,49,.55);
  outline-offset:3px;
}

@media (max-width:980px){
  #numeros .numbers{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  #numeros .number-card,#numeros .number-card:first-child{min-height:168px;padding:26px 18px 24px}
  #numeros .number-card span,#numeros .number-card:first-child span{font-size:13.5px;max-width:220px}
}

@media (max-width:680px){
  #numeros .numbers{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
  #numeros .number-card,#numeros .number-card:first-child{
    min-height:154px;
    padding:22px 12px 20px;
    border-radius:16px;
  }
  #numeros .number-card strong,#numeros .number-card:first-child strong{
    font-size:clamp(32px,9.6vw,40px);
  }
  #numeros .number-card span,#numeros .number-card:first-child span{
    margin-top:11px;
    max-width:100%;
    color:#07122f;
    font-size:11.5px;
    line-height:1.38;
    letter-spacing:.018em;
    overflow-wrap:normal;
    word-break:normal;
  }
  #compromissos .gov-block h2{font-size:clamp(34px,10vw,44px);line-height:1.02}
  #compromissos .gov-block > .gov-grid > div:first-child > p{font-size:15.5px;line-height:1.68}
  #compromissos .commit-grid{grid-template-columns:1fr!important;gap:10px}
  #compromissos .commit-card{padding:20px 17px;min-height:0;border-radius:15px}
  #compromissos .commit-card h3{display:flex;font-size:17px;line-height:1.32;margin-bottom:8px}
  #compromissos .commit-card h3 span{display:inline-block;margin-right:0}
  #compromissos .commit-card p{font-size:14.5px;line-height:1.62}
}

@media (max-width:390px){
  #numeros .number-card,#numeros .number-card:first-child{min-height:146px;padding:20px 9px 18px}
  #numeros .number-card span,#numeros .number-card:first-child span{font-size:10.8px;line-height:1.34}
}

@media (prefers-reduced-motion:reduce){
  #numeros .number-card,#compromissos .commit-card{transition:none!important}
  #numeros .number-card:hover{transform:none}
}

/* =========================================================
   V3.5 — VÍDEO DA CAMPANHA / AUTOPLAY PREMIUM
   ========================================================= */
.campaign-video-section{
  position:relative;
  overflow:hidden;
  padding-top:92px;
  padding-bottom:92px;
}
.campaign-video-section:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 82% 42%,rgba(243,198,49,.10),transparent 28%),
    radial-gradient(circle at 8% 0%,rgba(9,154,87,.07),transparent 30%);
}
.campaign-video-card{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(360px,1.18fr);
  align-items:center;
  gap:clamp(30px,5vw,78px);
  overflow:hidden;
  padding:clamp(28px,4.5vw,64px);
  border-radius:42px;
  background:
    linear-gradient(135deg,rgba(7,23,59,.99),rgba(5,18,45,.985) 58%,rgba(5,53,47,.96));
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 38px 95px rgba(5,15,42,.25),inset 0 1px 0 rgba(255,255,255,.07);
}
.campaign-video-card:before{
  content:"SMILE";
  position:absolute;
  z-index:-1;
  right:-20px;
  top:-26px;
  color:rgba(255,255,255,.035);
  font-size:clamp(88px,14vw,220px);
  line-height:1;
  font-weight:950;
  letter-spacing:-.08em;
}
.campaign-video-card:after{
  content:"";
  position:absolute;
  width:320px;
  height:320px;
  right:-150px;
  bottom:-150px;
  border-radius:50%;
  border:50px solid rgba(243,198,49,.07);
  z-index:-1;
}
.campaign-video-copy .title{color:#fff;margin-top:14px;max-width:620px}
.campaign-video-copy .title span{color:var(--yellow)}
.campaign-video-copy .subtitle{color:#dce5f5;max-width:560px;font-weight:560}
.campaign-video-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:30px}
.video-sound-btn{
  appearance:none;
  border:1px solid rgba(255,255,255,.16);
  border-radius:18px;
  min-height:68px;
  padding:12px 18px;
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
  background:rgba(255,255,255,.075);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  cursor:pointer;
  text-align:left;
  transition:.25s ease;
}
.video-sound-btn:hover{transform:translateY(-2px);background:rgba(255,255,255,.11);border-color:rgba(243,198,49,.42)}
.video-sound-btn.is-on{background:linear-gradient(135deg,rgba(6,159,92,.28),rgba(255,255,255,.08));border-color:rgba(40,211,129,.45)}
.video-sound-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:var(--yellow);font-size:18px}
.video-sound-copy{display:grid;gap:3px}.video-sound-copy b{font-size:14px}.video-sound-copy small{font-size:11px;color:#bfcbe0;font-weight:650}
.campaign-video-tag{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 19px;border-radius:999px;background:var(--yellow);color:#07122f;font-size:13px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 16px 38px rgba(243,198,49,.18)}
.campaign-video-stage{position:relative;min-height:590px;display:grid;place-items:center}
.campaign-video-glow{position:absolute;width:min(70vw,520px);height:min(70vw,520px);border-radius:50%;background:radial-gradient(circle,rgba(243,198,49,.22),rgba(0,168,107,.08) 44%,transparent 72%);filter:blur(10px)}
.campaign-video-device{
  position:relative;
  width:min(100%,380px);
  aspect-ratio:9/16;
  overflow:hidden;
  border-radius:30px;
  background:#020817;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 38px 80px rgba(0,0,0,.46),0 0 0 8px rgba(255,255,255,.035);
}
.campaign-video-device video{display:block;width:100%;height:100%;object-fit:cover;background:#020817}
.video-overlay-sound{
  position:absolute;
  left:50%;
  bottom:76px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:9px;
  padding:11px 15px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.23);
  color:#fff;
  background:rgba(4,13,34,.72);
  backdrop-filter:blur(14px);
  box-shadow:0 15px 35px rgba(0,0,0,.25);
  cursor:pointer;
  white-space:nowrap;
  transition:.24s ease;
}
.video-overlay-sound:hover{background:rgba(4,13,34,.88);border-color:rgba(243,198,49,.55)}
.video-overlay-sound.is-hidden{opacity:0;visibility:hidden;transform:translate(-50%,10px);pointer-events:none}
.video-overlay-sound b{font-size:12px;letter-spacing:.015em}

@media(max-width:980px){
  .campaign-video-card{grid-template-columns:1fr;gap:30px}
  .campaign-video-copy{text-align:center}.campaign-video-copy .subtitle,.campaign-video-copy .title{margin-left:auto;margin-right:auto}
  .campaign-video-actions{justify-content:center}
  .campaign-video-stage{min-height:0}
  .campaign-video-device{width:min(100%,400px)}
}
@media(max-width:620px){
  .campaign-video-section{padding-top:58px;padding-bottom:58px}
  .campaign-video-card{padding:22px 16px 26px;border-radius:28px}
  .campaign-video-card:before{font-size:88px;right:-10px;top:-12px}
  .campaign-video-copy{text-align:left}
  .campaign-video-copy .title,.campaign-video-copy .subtitle{margin-left:0;margin-right:0}
  .campaign-video-copy .title{font-size:clamp(35px,11vw,48px);line-height:.98}
  .campaign-video-actions{justify-content:flex-start;gap:10px;margin-top:22px}
  .video-sound-btn{width:100%;min-height:62px;border-radius:16px}
  .campaign-video-tag{min-height:44px}
  .campaign-video-device{width:min(100%,350px);border-radius:24px;box-shadow:0 28px 58px rgba(0,0,0,.42),0 0 0 5px rgba(255,255,255,.035)}
  .video-overlay-sound{bottom:68px}
}
@media(prefers-reduced-motion:reduce){.video-sound-btn,.video-overlay-sound{transition:none}.video-sound-btn:hover{transform:none}}
.video-load-error{position:absolute;inset:14px;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:24px;text-align:center;border-radius:22px;background:linear-gradient(145deg,rgba(4,13,34,.96),rgba(4,45,36,.94));border:1px solid rgba(243,198,49,.28);color:#fff}.video-load-error[hidden]{display:none}.video-load-error strong{font-size:16px;color:#f3c631}.video-load-error span{font-size:12px;line-height:1.5;color:#cbd5e1;max-width:230px}

/* =========================================================
   SMILE SIGNATURE V3.6 — MOBILE HERO REBUILD
   Corrige quebra de nome, assinatura 15163/slogan e hierarquia
   visual em celulares. Desktop permanece inalterado.
========================================================= */
@media (max-width:680px){
  .hero{padding-top:112px!important;overflow:hidden}
  .hero-grid{display:block!important;padding-top:30px!important}
  .hero-copy{width:100%!important;max-width:100%!important;padding:10px 0 24px!important}
  .hero .kicker{display:inline-flex!important;max-width:100%!important;margin:0 0 18px!important;padding:10px 14px!important;font-size:9px!important;line-height:1.35!important}

  /* Nome sem quebra no meio das palavras */
  .hero h1{
    width:100%!important;
    max-width:100%!important;
    margin:0 0 18px!important;
    font-size:clamp(42px,12.6vw,54px)!important;
    line-height:.88!important;
    letter-spacing:-.055em!important;
    overflow:visible!important;
    word-break:keep-all!important;
    overflow-wrap:normal!important;
  }
  .hero h1 .hero-first,
  .hero h1 strong{
    display:block!important;
    width:100%!important;
    white-space:nowrap!important;
    word-break:keep-all!important;
    overflow-wrap:normal!important;
  }

  /* Assinatura vira bloco editorial em duas linhas, sem texto espremido */
  .hero-signature{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:0!important;
    width:100%!important;
    margin:14px 0 20px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .hero-number{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    padding:14px 18px 12px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-left:4px solid var(--smile-gold)!important;
    border-radius:18px 18px 0 0!important;
    background:linear-gradient(145deg,rgba(21,45,96,.82),rgba(9,22,53,.94))!important;
    color:#fff!important;
    font-size:clamp(58px,18vw,76px)!important;
    line-height:.86!important;
    letter-spacing:-.055em!important;
    white-space:nowrap!important;
  }
  .hero-slogan{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    gap:10px!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    padding:10px 15px!important;
    border:1px solid rgba(243,198,49,.24)!important;
    border-top:0!important;
    border-radius:0 0 14px 14px!important;
    background:linear-gradient(90deg,rgba(243,198,49,.12),rgba(11,127,77,.10))!important;
    color:#fff!important;
    font-size:17px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
  }
  .hero-slogan small{
    margin:0!important;
    padding-right:10px!important;
    border-right:1px solid rgba(255,255,255,.16)!important;
    color:var(--smile-gold)!important;
    font-size:8px!important;
    line-height:1.25!important;
    letter-spacing:.10em!important;
    white-space:normal!important;
  }

  .hero-text{margin-top:0!important;font-size:16px!important;line-height:1.7!important;max-width:100%!important}
  .hero-actions{margin-top:22px!important}

  /* Foto com respiro e sem colisão com o hero */
  .portrait-shell{margin-top:4px!important;padding:0 0 14px!important}
  .portrait-card{width:100%!important;min-height:0!important;height:auto!important;aspect-ratio:4/5!important;border-radius:24px!important}
  .portrait-inner img{object-position:center 18%!important}
  .portrait-info{left:12px!important;right:12px!important;bottom:12px!important}

  /* Indicadores logo após o hero, compactos e legíveis */
  .hero-metrics-wrap{margin-top:0!important;padding:16px 0 24px!important}
  .hero-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;padding:0 16px!important}
  .metric{min-height:112px!important;padding:19px 14px 15px!important}
  .metric:nth-child(3){grid-column:1/-1!important}
  .metric strong{font-size:30px!important}
  .metric span{font-size:10px!important;line-height:1.35!important;color:#dce5f4!important}
}

@media (max-width:420px){
  .hero h1{font-size:clamp(38px,12vw,48px)!important}
  .hero-number{font-size:clamp(54px,17.5vw,68px)!important;padding:13px 16px 11px!important}
  .hero-slogan{font-size:15px!important;gap:8px!important}
  .hero-slogan small{font-size:7.5px!important;padding-right:8px!important}
  .hero-text{font-size:15.5px!important}
  .portrait-card{aspect-ratio:4/5.15!important}
}

@media (max-width:360px){
  .hero h1{font-size:38px!important}
  .hero-number{font-size:56px!important}
  .hero-slogan{align-items:flex-start!important;flex-direction:column!important;gap:4px!important}
  .hero-slogan small{border-right:0!important;padding-right:0!important}
}

/* =========================================================
   SMILE SIGNATURE V3.7 — MOBILE FINAL POLISH
   Correções específicas para 320–430px observadas em aparelho real.
   Desktop permanece inalterado.
========================================================= */
@media (max-width:680px){
  html,body{max-width:100%;overflow-x:hidden!important}
  *,*::before,*::after{box-sizing:border-box}
  .container{width:100%!important;max-width:100%!important;padding-left:18px!important;padding-right:18px!important}

  /* Cabeçalho compacto, estável e sem estouro */
  .topbar{width:100%!important;max-width:none!important;left:0!important;right:0!important;top:0!important;border-radius:0!important;padding:12px 16px!important}
  .header-frame{width:100%!important;max-width:100%!important;padding:0!important}
  .brand{min-width:0!important;max-width:calc(100% - 76px)!important}
  .brand-copy{min-width:0!important}.brand-name{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .mobile-btn{flex:0 0 58px!important;width:58px!important;height:58px!important;border-radius:16px!important}

  /* Hero: uma única coluna real; nenhum elemento lateral residual */
  .hero{min-height:0!important;padding:112px 0 0!important;overflow:hidden!important}
  .hero:after{display:none!important}
  .hero-ribbon{top:82px!important;height:32px!important;padding:9px 18px!important;font-size:8.5px!important;letter-spacing:.15em!important;text-overflow:clip!important}
  .hero-ribbon b{padding:0 7px!important}
  .hero-grid{display:flex!important;flex-direction:column!important;gap:24px!important;width:100%!important;max-width:100%!important;padding-top:42px!important}
  .hero-copy,.portrait-shell{width:100%!important;max-width:100%!important;min-width:0!important}
  .hero-copy{order:1!important;padding:0!important}
  .portrait-shell{order:2!important;display:block!important;min-height:0!important;margin:0!important;padding:0 0 18px!important}

  .hero .kicker{max-width:100%!important;font-size:9.5px!important;line-height:1.4!important;white-space:normal!important}
  .hero h1{font-size:clamp(43px,13vw,57px)!important;line-height:.90!important;letter-spacing:-.045em!important;margin:20px 0 18px!important}
  .hero h1 .hero-first,.hero h1 strong{white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important}

  .hero-signature{width:100%!important;max-width:100%!important;margin:0 0 22px!important}
  .hero-number{max-width:100%!important;font-size:clamp(58px,18vw,76px)!important}
  .hero-slogan{min-width:0!important;max-width:100%!important}
  .hero-text{width:100%!important;max-width:100%!important;margin:0!important;font-size:17px!important;line-height:1.72!important;overflow-wrap:normal!important;word-break:normal!important}

  .hero-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:10px!important;margin:24px 0 0!important}
  .hero-actions .btn{width:100%!important;min-height:54px!important;padding:14px 16px!important;font-size:12px!important;border-radius:15px!important}

  /* Retrato fecha o hero em largura total, sem vazio lateral */
  .portrait-card{width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;aspect-ratio:4/4.85!important;margin:0!important;border-radius:26px!important}
  .portrait-inner img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 17%!important}
  .portrait-info{left:14px!important;right:14px!important;bottom:14px!important;width:auto!important;max-width:none!important}

  /* Indicadores: sempre abaixo da foto, 2 + 1, sem corte */
  .hero-metrics-wrap{position:relative!important;width:100%!important;margin:0!important;padding:18px 0 28px!important;overflow:hidden!important}
  .hero-metrics{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;max-width:100%!important;gap:10px!important;padding:0 18px!important}
  .metric{width:100%!important;min-width:0!important;min-height:118px!important;padding:20px 13px 15px!important}
  .metric:nth-child(3){grid-column:1/-1!important;min-height:105px!important}
  .metric strong{font-size:clamp(29px,8.5vw,36px)!important;white-space:nowrap!important;letter-spacing:-.03em!important}
  .metric span{font-size:10px!important;line-height:1.35!important;letter-spacing:.045em!important;word-break:normal!important;overflow-wrap:normal!important}

  /* Vídeo: tipografia adaptada e conteúdo nunca cortado */
  .campaign-video-section{overflow:hidden!important;padding:48px 0!important}
  .campaign-video-card{width:100%!important;max-width:100%!important;padding:22px 18px 26px!important;gap:24px!important;overflow:hidden!important}
  .campaign-video-copy{min-width:0!important;width:100%!important}
  .campaign-video-copy .title{max-width:100%!important;font-size:clamp(34px,10.5vw,46px)!important;line-height:.96!important;letter-spacing:-.045em!important;overflow-wrap:normal!important;word-break:normal!important}
  .campaign-video-copy .subtitle{max-width:100%!important;font-size:15px!important;line-height:1.6!important;color:#e4eaf6!important}
  .campaign-video-stage{width:100%!important;min-width:0!important}
  .campaign-video-device{width:min(100%,340px)!important;max-width:100%!important;margin:0 auto!important}

  /* História: contraste WCAG-friendly em cards claros/escuros */
  #historia .story-grid{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  #historia .story-card{width:100%!important;min-height:0!important;padding:24px 22px!important;transform:none!important}
  #historia .story-card:first-child{background:linear-gradient(145deg,#fffdf8,#f3eddf)!important;border-color:rgba(7,18,47,.10)!important}
  #historia .story-card:first-child h3{color:#07122f!important;text-shadow:none!important}
  #historia .story-card:first-child p{color:#34415d!important;font-weight:560!important}
  #historia .story-card:not(:first-child) h3{color:#fff!important}
  #historia .story-card:not(:first-child) p{color:#e5ebf6!important}
  #historia .story-card h3{font-size:24px!important;line-height:1.15!important;margin-top:18px!important}
  #historia .story-card p{font-size:16px!important;line-height:1.7!important}

  /* Seções e títulos com escala confortável */
  .section{padding:62px 0!important;overflow:hidden!important}
  .section-head{gap:18px!important;margin-bottom:30px!important}
  .title{max-width:100%!important;font-size:clamp(34px,10.4vw,44px)!important;line-height:.98!important;letter-spacing:-.045em!important}
  .subtitle{max-width:100%!important;font-size:16px!important;line-height:1.65!important}

  /* Flutuantes menores para não encobrir conteúdo */
  .whatsapp-float,.backtop{right:12px!important;width:46px!important;height:46px!important;border-radius:16px!important}
  .whatsapp-float{bottom:66px!important;font-size:20px!important}.backtop{bottom:12px!important;font-size:17px!important}
}

@media (max-width:430px){
  .container{padding-left:14px!important;padding-right:14px!important}
  .hero-grid{padding-top:38px!important}
  .hero h1{font-size:clamp(40px,12.8vw,52px)!important}
  .hero-signature{padding:0!important}
  .hero-number{font-size:clamp(55px,17.5vw,70px)!important}
  .hero-text{font-size:16px!important}
  .portrait-card{aspect-ratio:4/5.05!important}
  .hero-metrics{padding:0 14px!important}
  .metric{padding-left:11px!important;padding-right:11px!important}
  .metric strong{font-size:clamp(27px,8.4vw,33px)!important}
  .metric span{font-size:9.5px!important}
}

@media (max-width:360px){
  .brand-logo{width:46px!important;height:46px!important}.brand-name{font-size:12px!important}.brand-sub{display:none!important}
  .mobile-btn{flex-basis:52px!important;width:52px!important;height:52px!important}
  .hero h1{font-size:39px!important}
  .hero-number{font-size:54px!important}
  .hero-slogan{font-size:15px!important}
  .metric strong{font-size:27px!important}.metric span{font-size:9px!important}
  .campaign-video-copy .title{font-size:34px!important}
}

/* =========================================================
   ISMAILI SIGNATURE V3.8 — IDENTIDADE + MOBILE + CONTRASTE
   Upgrade visual sobre V3.7. Sem alteração de rotas/funções.
========================================================= */

/* 1) Marca d'água correta e discreta */
.campaign-video-card:before{
  content:"ISMAILI" !important;
  right:-10px !important;
  top:-20px !important;
  color:rgba(255,255,255,.032) !important;
  letter-spacing:-.065em !important;
}

/* =========================================================
   V3.11 — VÍDEO COMPACTO E RESPONSIVO
   Reduz o aparelho vertical sem cortar o conteúdo do vídeo.
========================================================= */
@media (min-width:981px){
  .campaign-video-card{grid-template-columns:minmax(0,1fr) minmax(300px,.72fr)!important;gap:clamp(28px,4vw,58px)!important}
  .campaign-video-stage{min-height:535px!important}
  .campaign-video-device{width:min(100%,310px)!important}
}
@media (min-width:681px) and (max-width:980px){
  .campaign-video-device{width:min(100%,290px)!important}
}
@media (max-width:680px){
  .campaign-video-device{width:min(78vw,270px)!important;max-width:270px!important}
  .campaign-video-device video{object-fit:contain!important}
}
@media (max-width:430px){
  .campaign-video-device{width:min(74vw,245px)!important;max-width:245px!important;border-radius:21px!important}
}

/* Identificação eleitoral sempre visível no rodapé */
.campaign-footer .campaign-legal-strip{width:fit-content;max-width:100%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;gap:10px 18px;flex-wrap:wrap;padding:11px 18px;border-radius:999px;background:linear-gradient(135deg,#ffd700,#fff0a1);color:#092016;box-shadow:0 14px 34px rgba(255,215,0,.16)}
.campaign-footer .campaign-legal-strip strong{font-size:12px;letter-spacing:.11em;text-transform:uppercase}
.campaign-footer .campaign-legal-strip span{font-size:12px;font-weight:900}
.campaign-footer-candidate{color:#f8fafc;font-weight:800;font-size:13px;line-height:1.6}
.campaign-footer-copy{margin-top:5px;color:#94a3b8;font-size:11px}
@media(max-width:520px){.campaign-footer .campaign-legal-strip{border-radius:17px;display:grid;gap:4px;padding:11px 15px}.campaign-footer .campaign-legal-strip strong,.campaign-footer .campaign-legal-strip span{font-size:11px}.campaign-footer-candidate{font-size:11px;padding:0 8px}}

/* Identificação eleitoral fixa dentro do quadro do vídeo */
.video-electoral-info{position:absolute;z-index:4;left:10px;right:10px;bottom:54px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 8px;padding:8px 10px;border-radius:12px;background:rgba(3,14,32,.88);border:1px solid rgba(255,215,0,.34);color:#fff;backdrop-filter:blur(10px);box-shadow:0 8px 22px rgba(0,0,0,.28);pointer-events:none}
.video-electoral-info strong{font-size:8px;line-height:1.2;letter-spacing:.08em;color:#ffd700;text-transform:uppercase}
.video-electoral-info span{font-size:10px;line-height:1.2;font-weight:1000;color:#fff;text-align:right}
.video-electoral-info small{grid-column:1/-1;font-size:8px;line-height:1.25;font-weight:800;color:#dce5f5}
@media(max-width:430px){.video-electoral-info{left:8px;right:8px;bottom:48px;padding:7px 8px}.video-electoral-info strong,.video-electoral-info small{font-size:7px}.video-electoral-info span{font-size:9px}}

/* 2) História: primeiro card claro com contraste real em desktop e mobile */
#historia .story-card:first-child{
  background:linear-gradient(145deg,#fffdf8 0%,#f4efe4 100%) !important;
  border-color:rgba(7,18,47,.12) !important;
  box-shadow:0 20px 50px rgba(7,18,47,.08) !important;
}
#historia .story-card:first-child h3{
  color:#07122f !important;
  text-shadow:none !important;
  font-weight:900 !important;
}
#historia .story-card:first-child p{
  color:#38445c !important;
  font-weight:600 !important;
}
#historia .story-card:first-child .card-icon{
  background:linear-gradient(145deg,#fff8dc,#f3ead0) !important;
  border:1px solid rgba(196,151,0,.22) !important;
}

/* 3) Identidade visual: Mato Grosso nas áreas escuras */
#historia,
#compromissos,
#mapa-votos{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
#historia:before,
#compromissos:before,
#mapa-votos:before{
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  width:520px;
  height:520px;
  right:-190px;
  top:50%;
  transform:translateY(-50%) rotate(45deg);
  border:1px solid rgba(243,198,49,.075);
  background:
    radial-gradient(circle at 50% 50%,rgba(243,198,49,.065) 0 13%,transparent 13.5%),
    linear-gradient(135deg,rgba(9,154,87,.055),transparent 55%);
  box-shadow:0 0 0 70px rgba(9,154,87,.025),0 0 0 140px rgba(243,198,49,.018);
}
#historia:after,
#compromissos:after{
  content:"★";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  right:68px;
  top:50%;
  transform:translateY(-50%);
  font-size:170px;
  line-height:1;
  color:rgba(255,255,255,.025);
}

/* 4) Uma foto real, sutil, como fundo editorial na seção clara de números */
#numeros{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
#numeros:before{
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  inset:0 0 0 auto;
  width:min(42vw,720px);
  background-image:
    linear-gradient(90deg,#f7f4ec 0%,rgba(247,244,236,.90) 18%,rgba(247,244,236,.34) 58%,rgba(247,244,236,.12) 100%),
    url("../../img/perfil.png");
  background-size:cover;
  background-position:center 24%;
  opacity:.12;
  filter:saturate(.82) contrast(.94);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%);
}

/* Cards de indicadores: leitura mais forte e acabamento consistente */
#numeros .number-card{
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(7,18,47,.08) !important;
  box-shadow:0 18px 45px rgba(7,18,47,.08) !important;
}
#numeros .number-card strong{
  color:#d5a800 !important;
  text-shadow:none !important;
}
#numeros .number-card span{
  color:#14213d !important;
  font-weight:850 !important;
  opacity:1 !important;
}

/* 5) Mobile próprio: composição compacta e sem colunas residuais */
@media (max-width:680px){
  /* topo/hero */
  .hero{padding-top:112px!important;background:linear-gradient(180deg,#07122f 0%,#091733 100%)!important}
  .hero-grid{padding-top:34px!important;gap:18px!important}
  .hero-copy{display:flex!important;flex-direction:column!important;gap:0!important}
  .hero .kicker{margin-bottom:14px!important}
  .hero h1{margin:10px 0 16px!important;font-size:clamp(40px,12.2vw,52px)!important;line-height:.91!important}
  .hero-signature{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:0!important;
    width:100%!important;
    margin:0 0 18px!important;
    padding:0!important;
    border-radius:18px!important;
    overflow:hidden!important;
    background:linear-gradient(145deg,rgba(17,45,95,.96),rgba(8,28,60,.96))!important;
    border:1px solid rgba(243,198,49,.22)!important;
  }
  .hero-number{
    display:block!important;
    width:100%!important;
    padding:14px 16px 10px!important;
    border:0!important;
    border-left:4px solid var(--smile-gold)!important;
    border-bottom:1px solid rgba(255,255,255,.11)!important;
    font-size:clamp(52px,16.5vw,68px)!important;
    line-height:.9!important;
  }
  .hero-slogan{
    display:grid!important;
    grid-template-columns:minmax(92px,.72fr) 1fr!important;
    align-items:center!important;
    gap:12px!important;
    padding:12px 16px 14px!important;
    font-size:17px!important;
    line-height:1.08!important;
  }
  .hero-slogan small{
    display:block!important;
    padding-right:12px!important;
    border-right:1px solid rgba(255,255,255,.15)!important;
    font-size:8px!important;
    line-height:1.35!important;
  }
  .hero-text{font-size:16px!important;line-height:1.62!important}
  .hero-actions{margin-top:20px!important;gap:9px!important}
  .hero-actions .btn{min-height:50px!important;border-radius:14px!important}

  /* foto fecha a apresentação sem vazio enorme */
  .portrait-shell{padding:0 0 10px!important}
  .portrait-card{
    aspect-ratio:16/12!important;
    min-height:0!important;
    border-radius:22px!important;
    box-shadow:0 24px 50px rgba(0,0,0,.23)!important;
  }
  .portrait-inner img{object-position:center 22%!important}
  .portrait-info{left:12px!important;right:12px!important;bottom:12px!important;padding:14px 16px!important;border-radius:16px!important}
  .portrait-info h2{font-size:23px!important;line-height:1.02!important}
  .portrait-info p{font-size:12px!important;line-height:1.45!important}
  .portrait-badge{width:50px!important;height:50px!important;top:12px!important;right:12px!important}

  /* três indicadores iguais: uma pilha premium, zero corte */
  .hero-metrics-wrap{padding:14px 0 26px!important}
  .hero-metrics{
    grid-template-columns:1fr!important;
    gap:9px!important;
    padding:0 14px!important;
  }
  .metric,
  .metric:nth-child(3){
    grid-column:auto!important;
    min-height:82px!important;
    display:grid!important;
    grid-template-columns:minmax(112px,.8fr) 1fr!important;
    align-items:center!important;
    gap:14px!important;
    padding:16px 18px!important;
    border-radius:18px!important;
  }
  .metric:after{left:18px!important;top:12px!important;width:32px!important}
  .metric strong{
    margin:0!important;
    padding-top:7px!important;
    font-size:clamp(31px,9vw,40px)!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .metric span{
    margin:0!important;
    font-size:10px!important;
    line-height:1.35!important;
    letter-spacing:.045em!important;
  }
  .metric+.metric{border-left:1px solid rgba(255,255,255,.12)!important}

  /* Foto de fundo não compete com a leitura no celular */
  #numeros:before{width:100%;opacity:.045;background-position:75% 22%;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 100%)}

  /* Elementos de MT menores no mobile */
  #historia:before,#compromissos:before,#mapa-votos:before{width:300px;height:300px;right:-185px;opacity:.72}
  #historia:after,#compromissos:after{font-size:90px;right:-12px;opacity:.7}
}

@media (max-width:380px){
  .hero h1{font-size:39px!important}
  .hero-slogan{grid-template-columns:86px 1fr!important;font-size:15px!important;padding-left:14px!important;padding-right:14px!important}
  .metric{grid-template-columns:104px 1fr!important;padding-left:14px!important;padding-right:14px!important}
  .metric strong{font-size:30px!important}
  .metric span{font-size:9px!important}
}

/* Marca d'água institucional global correta */
.section-head:before{content:"ISMAILI" !important;letter-spacing:-.045em !important}

/* =========================================================
   ISMAILI SIGNATURE V3.9 — MOBILE COMPOSITION REBUILD
   Mobile com composição própria; desktop preservado.
========================================================= */
.hero-mobile-v39{display:none}

@media (max-width:680px){
  /* Esconde exclusivamente a composição desktop no celular. */
  .hero-desktop-v39{display:none!important}
  .hero-mobile-v39{display:block!important;position:relative;z-index:3;padding-top:40px!important;padding-bottom:26px!important}

  .hero{padding-top:112px!important;min-height:0!important;background:linear-gradient(180deg,#07122f 0%,#091733 68%,#07122f 100%)!important}
  .hero-mobile-v39 .kicker{display:inline-flex!important;max-width:100%!important;margin:0 0 22px!important;padding:10px 14px!important;border-radius:10px!important;background:rgba(243,198,49,.08)!important;border:1px solid rgba(243,198,49,.22)!important;border-left:4px solid var(--smile-gold)!important;color:var(--smile-gold)!important;font-size:9px!important;line-height:1.35!important;letter-spacing:.12em!important}

  .hero-mobile-v39 h1{margin:0 0 20px!important;font-size:clamp(44px,13.5vw,58px)!important;line-height:.88!important;letter-spacing:-.055em!important;font-weight:950!important}
  .hero-mobile-v39 h1 .hero-first{display:block!important;color:#fff!important}
  .hero-mobile-v39 h1 strong{display:block!important;color:var(--smile-gold)!important;background:none!important;-webkit-text-fill-color:initial!important}

  .hero-mobile-signature{width:100%!important;overflow:hidden!important;margin:0 0 22px!important;border:1px solid rgba(255,255,255,.11)!important;border-left:4px solid var(--smile-gold)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(17,45,95,.96),rgba(7,22,53,.98))!important;box-shadow:0 18px 42px rgba(0,0,0,.20)!important}
  .hero-mobile-number{padding:16px 18px 12px!important;border-bottom:1px solid rgba(255,255,255,.09)!important;color:#fff!important;font-size:clamp(60px,18vw,78px)!important;line-height:.86!important;font-weight:950!important;letter-spacing:-.06em!important;white-space:nowrap!important}
  .hero-mobile-slogan{display:grid!important;grid-template-columns:112px 1fr!important;align-items:center!important;gap:14px!important;padding:12px 16px 14px!important}
  .hero-mobile-slogan small{color:var(--smile-gold)!important;font-size:8px!important;line-height:1.35!important;font-weight:900!important;letter-spacing:.12em!important;text-transform:uppercase!important}
  .hero-mobile-slogan b{padding-left:14px!important;border-left:1px solid rgba(255,255,255,.13)!important;color:#fff!important;font-size:18px!important;line-height:1.08!important;font-weight:950!important;text-transform:uppercase!important}

  .hero-mobile-text{margin:0 0 22px!important;color:#e7edf7!important;font-size:16px!important;line-height:1.65!important;font-weight:560!important}

  .hero-mobile-metrics{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:0 0 22px!important}
  .hero-mobile-metric{display:grid!important;grid-template-columns:minmax(128px,.72fr) 1fr!important;align-items:center!important;gap:14px!important;min-height:86px!important;padding:15px 17px!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(17,42,91,.84),rgba(7,20,49,.96))!important;box-shadow:0 15px 34px rgba(0,0,0,.17)!important;position:relative!important;overflow:hidden!important}
  .hero-mobile-metric:before{content:"";position:absolute;left:17px;top:12px;width:30px;height:3px;border-radius:999px;background:var(--smile-gold)}
  .hero-mobile-metric:nth-child(2):before{background:var(--smile-green)}
  .hero-mobile-metric:nth-child(3):before{background:linear-gradient(90deg,var(--smile-gold),var(--smile-green))}
  .hero-mobile-metric strong{padding-top:8px!important;color:#fff!important;font-size:clamp(31px,9.5vw,40px)!important;line-height:1!important;font-weight:950!important;letter-spacing:-.04em!important;white-space:nowrap!important}
  .hero-mobile-metric span{color:#e7edf7!important;font-size:10px!important;line-height:1.32!important;font-weight:900!important;letter-spacing:.055em!important;text-transform:uppercase!important}

  .hero-mobile-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:0 0 24px!important}
  .hero-mobile-actions .btn{width:100%!important;min-height:54px!important;padding:14px 16px!important;border-radius:15px!important;font-size:12px!important}

  .hero-mobile-portrait{position:relative!important;width:100%!important;aspect-ratio:4/4.6!important;overflow:hidden!important;border-radius:26px!important;border:1px solid rgba(255,255,255,.10)!important;background:#091733!important;box-shadow:0 24px 54px rgba(0,0,0,.24)!important}
  .hero-mobile-portrait img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 16%!important}
  .hero-mobile-portrait:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(5,14,37,.18) 62%,rgba(5,14,37,.62) 100%);pointer-events:none}
  .hero-mobile-portrait-copy{position:absolute!important;z-index:2!important;left:14px!important;right:14px!important;bottom:14px!important;padding:15px 17px 17px!important;border-left:4px solid var(--smile-gold)!important;border-radius:16px!important;background:linear-gradient(110deg,rgba(6,16,45,.94),rgba(10,29,66,.88))!important;backdrop-filter:blur(12px)!important;box-shadow:0 16px 38px rgba(0,0,0,.28)!important}
  .hero-mobile-portrait-copy span{display:block;color:var(--smile-gold)!important;font-size:9px!important;font-weight:900!important;letter-spacing:.18em!important;text-transform:uppercase!important}
  .hero-mobile-portrait-copy h2{margin:4px 0 5px!important;color:#fff!important;font-size:25px!important;line-height:1.02!important;font-weight:950!important}
  .hero-mobile-portrait-copy p{margin:0!important;color:#dce5f4!important;font-size:12px!important;line-height:1.45!important}

  /* Remove qualquer vestígio visual da composição antiga no mobile. */
  .hero .portrait-shell,.hero .hero-metrics-wrap.hero-desktop-v39{display:none!important}
}

@media (max-width:380px){
  .hero-mobile-v39{padding-top:34px!important}
  .hero-mobile-v39 h1{font-size:42px!important}
  .hero-mobile-number{font-size:58px!important}
  .hero-mobile-slogan{grid-template-columns:96px 1fr!important;gap:10px!important;padding-left:14px!important;padding-right:14px!important}
  .hero-mobile-slogan b{font-size:16px!important;padding-left:10px!important}
  .hero-mobile-metric{grid-template-columns:116px 1fr!important;padding-left:14px!important;padding-right:14px!important}
  .hero-mobile-metric strong{font-size:31px!important}
  .hero-mobile-portrait{aspect-ratio:4/5!important}
}

/* =========================================================
   ISMAILI SIGNATURE V3.10 — CARDS HISTÓRIA UNIFICADOS
   Ajuste visual solicitado: os 3 cards de História passam a
   usar a mesma base cromática no desktop e no mobile.
   ========================================================= */
#historia .story-card,
#historia .story-card:first-child,
#historia .story-card:nth-child(2),
#historia .story-card:nth-child(3){
  background:linear-gradient(145deg,#182643 0%,#1d2b49 100%) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-top:4px solid #f2c018 !important;
  box-shadow:0 18px 42px rgba(4,12,35,.18) !important;
  color:#fff !important;
}
#historia .story-card h3,
#historia .story-card:first-child h3,
#historia .story-card:not(:first-child) h3{
  color:#fff !important;
  text-shadow:none !important;
  font-weight:900 !important;
}
#historia .story-card p,
#historia .story-card:first-child p,
#historia .story-card:not(:first-child) p{
  color:#e7edf7 !important;
  font-weight:560 !important;
}
#historia .story-card .card-icon,
#historia .story-card:first-child .card-icon{
  background:linear-gradient(145deg,#fff8dc,#f3ead0) !important;
  border:1px solid rgba(196,151,0,.24) !important;
  color:#07122f !important;
}
@media (max-width:680px){
  #historia .story-card,
  #historia .story-card:first-child,
  #historia .story-card:nth-child(2),
  #historia .story-card:nth-child(3){
    background:linear-gradient(145deg,#182643 0%,#1d2b49 100%) !important;
    border-color:rgba(255,255,255,.12) !important;
    border-top-color:#f2c018 !important;
  }
  #historia .story-card h3{color:#fff !important}
  #historia .story-card p{color:#e7edf7 !important}
}