:root{
--navy:#031e38;
--navy-2:#062b4c;
--navy-3:#0b3d67;
--orange:#ff5a0a;
--orange-2:#ff7a2f;
--white:#fff;
--off:#f5f5f2;
--ink:#071d32;
--muted:#66717d;
--line:#dbe2e8;
--shadow:0 18px 50px rgba(0,0,0,.14);
--shadow-soft:0 10px 30px rgba(7,29,50,.08);
--radius:24px;
--radius-sm:16px;
--max:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
margin:0;
font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
background:var(--off);
color:var(--ink);
line-height:1.5;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(var(--max), calc(100% - 48px));margin:auto}
.section{padding:104px 0}
.section + .section{border-top:1px solid rgba(7,29,50,.04)}
.eyebrow{font-size:.78rem;letter-spacing:.15em;text-transform:uppercase;font-weight:900;color:var(--orange)}
.display{font-size:clamp(2.6rem,5.3vw,5.85rem);line-height:.9;letter-spacing:-.065em;margin:18px 0 26px;font-weight:950;text-wrap:balance}
.display span{color:var(--orange)}
.title{font-size:clamp(2rem,3.5vw,4rem);line-height:1;letter-spacing:-.04em;margin:10px 0 20px}
.lead{font-size:clamp(1rem,1.3vw,1.18rem);max-width:680px}
.btn{
display:inline-flex;align-items:center;gap:10px;
padding:15px 22px;border-radius:12px;
background:var(--orange);color:white;font-weight:900;
border:1px solid transparent;box-shadow:0 10px 25px rgba(255,90,10,.25);
transition:.25s ease;
}
.btn:hover{transform:translateY(-2px);background:var(--orange-2)}
.btn.outline{background:transparent;border-color:rgba(255,255,255,.35);box-shadow:none}
.btn.light{background:white;color:var(--navy);box-shadow:none}
/* Header */
.header{
position:fixed;left:0;right:0;top:0;z-index:50;
border-bottom:1px solid rgba(255,255,255,.08);
background:linear-gradient(180deg,rgba(3,30,56,.97),rgba(3,30,56,.80));
backdrop-filter:blur(18px) saturate(125%);
box-shadow:0 8px 30px rgba(0,0,0,.08);
}
.nav{height:86px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{display:flex;align-items:center;gap:12px;color:white;font-weight:950;letter-spacing:-.04em}
.logo-mark{width:42px;height:42px;border:3px solid var(--orange);border-radius:50% 50% 44% 44%;position:relative;transform:rotate(45deg)}
.logo-mark:before,.logo-mark:after{content:"";position:absolute;background:var(--orange);border-radius:3px}
.logo-mark:before{width:4px;height:22px;left:16px;top:8px}
.logo-mark:after{width:22px;height:4px;left:7px;top:17px}
.logo-copy b{font-size:1.35rem;display:block;line-height:.9}
.logo-copy small{font-weight:700;opacity:.7}
.menu{display:flex;gap:30px;align-items:center;color:white;font-size:.9rem;font-weight:800}
.menu a{opacity:.82;position:relative;padding:30px 0 27px}
.menu a:after{content:"";position:absolute;left:0;right:100%;bottom:18px;height:2px;background:var(--orange);transition:.25s ease}
.menu a:hover{opacity:1;color:white}
.menu a:hover:after{right:0}
.menu-toggle{display:none;background:none;border:0;color:white;font-size:1.7rem}
/* Hero */
.hero{
min-height:810px;padding-top:86px;color:white;position:relative;overflow:hidden;
background:
linear-gradient(90deg,rgba(3,30,56,.995) 0%,rgba(3,30,56,.94) 38%,rgba(3,30,56,.60) 67%,rgba(3,30,56,.18) 100%),
radial-gradient(circle at 80% 37%,rgba(255,122,47,.32),transparent 22%),
radial-gradient(circle at 88% 58%,rgba(255,90,10,.14),transparent 24%),
linear-gradient(180deg,#173b5c 0%,#0a2b49 46%,#071f36 100%);
}
.hero:before{
content:"";position:absolute;inset:0;opacity:.48;
background-image:
linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
background-size:80px 80px;
mask-image:linear-gradient(to right,transparent 10%,black 35%,black 100%);
}
.hero:after{
content:"";position:absolute;right:-90px;bottom:30px;width:390px;height:390px;
border:10px solid var(--orange);opacity:.5;transform:rotate(45deg);
box-shadow:-90px 90px 0 -12px rgba(255,90,10,.18), -180px 180px 0 -20px rgba(255,255,255,.06);
}
.hero-grid{
min-height:702px;display:grid;grid-template-columns:1.02fr .98fr;align-items:center;position:relative;z-index:2;
}
.hero-copy{padding:92px 0 72px;max-width:690px}
.hero-copy .eyebrow{color:#ff8c50}
.hero-copy p{font-size:1.12rem;max-width:560px;color:rgba(255,255,255,.82);line-height:1.65}
.hero-tags{display:flex;flex-wrap:wrap;gap:0;margin-top:30px;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;font-weight:900;color:rgba(255,255,255,.68)}
.hero-tags span{padding:0 14px;border-right:1px solid rgba(255,255,255,.18)}
.hero-tags span:first-child{padding-left:0}
.hero-tags span:last-child{border-right:0}
.hero-media{height:100%;position:relative;display:flex;align-items:flex-end;justify-content:center}
.city{
position:absolute;right:-5%;bottom:110px;width:110%;height:300px;
background:
radial-gradient(ellipse at 70% 100%,rgba(255,167,93,.8),transparent 36%),
linear-gradient(180deg,rgba(255,174,98,.15),rgba(10,33,55,.05));
filter:blur(.1px);
}
.city:before{
content:"";position:absolute;right:18%;bottom:0;width:52px;height:220px;background:linear-gradient(#f6e7d3,#916f53);
box-shadow:80px 40px 0 -12px #c8b7a5, 122px 118px 0 18px #d8c5ae;
clip-path:polygon(32% 0,68% 0,76% 100%,24% 100%);
opacity:.78;
}
.candidate{
width:min(535px,92%);height:635px;position:relative;z-index:3;
border-radius:270px 270px 36px 36px;
background:
radial-gradient(circle at 50% 22%, #f3bd91 0 10%, transparent 10.5%),
radial-gradient(circle at 48% 18%, #17110f 0 17%, transparent 17.5%),
linear-gradient(180deg,transparent 0 27%,#171717 27% 100%);
filter:drop-shadow(0 30px 30px rgba(0,0,0,.28));
}
.candidate:after{
content:"FOTO DA CANDIDATA";position:absolute;inset:auto 0 28px;text-align:center;
color:rgba(255,255,255,.35);font-weight:900;letter-spacing:.15em;font-size:.76rem;
}
.side-note{
position:absolute;right:0;top:140px;width:180px;font-size:1.45rem;line-height:1.05;font-weight:950;
text-transform:uppercase;text-align:right;
}
.side-note span{color:var(--orange)}
/* Axes */
.axes{background:white;border-bottom:1px solid var(--line);box-shadow:0 10px 30px rgba(7,29,50,.03)}
.axes-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.axis{padding:38px 26px;text-align:center;border-right:1px solid var(--line);transition:.25s ease;position:relative}
.axis:hover{background:#fffaf7}
.axis:after{content:"";position:absolute;left:28px;right:28px;bottom:0;height:3px;background:var(--orange);transform:scaleX(0);transform-origin:center;transition:.25s ease}
.axis:hover:after{transform:scaleX(1)}
.axis:last-child{border-right:none}
.ico{width:54px;height:54px;margin:0 auto 14px;border:2px solid rgba(255,90,10,.82);border-radius:18px;display:grid;place-items:center;color:var(--orange);font-weight:950;background:#fff8f4;box-shadow:0 8px 18px rgba(255,90,10,.08)}
.axis h3{margin:5px 0 6px}
.axis p{font-size:.9rem;color:var(--muted);margin:0 0 10px}
/* About */
.about{
color:white;position:relative;overflow:hidden;
background:
linear-gradient(90deg,rgba(3,30,56,1),rgba(5,42,73,.96)),
var(--navy);
}
.about:after{
content:"+";position:absolute;right:5%;top:0;font-size:26rem;line-height:1;color:rgba(255,90,10,.08);font-weight:950;
}
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center;position:relative;z-index:2}
.portrait{
min-height:520px;border:1px solid rgba(255,255,255,.12);border-radius:28px;position:relative;overflow:hidden;
background:
radial-gradient(circle at 32% 20%,rgba(255,122,47,.22),transparent 24%),
linear-gradient(160deg,#204769,#071d32 65%);
box-shadow:0 28px 65px rgba(0,0,0,.20);
}
.portrait:after{content:"FOTO";position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.18);font-weight:950;font-size:4rem}
.quote{padding:18px 0 0;font-size:1.5rem;max-width:540px}
.about-copy p{color:rgba(255,255,255,.78)}
.credentials{
margin-top:34px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;
}
.cred{
padding:20px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));transition:.25s ease
}
.cred:hover{transform:translateY(-3px);border-color:rgba(255,122,47,.55)}
.cred b{display:block;color:white}.cred span{font-size:.9rem;color:rgba(255,255,255,.65)}
/* Proposals */
.proposals{background:var(--navy);color:white}
.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px}
.section-head p{max-width:440px;color:rgba(255,255,255,.68)}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.card{
background:white;color:var(--ink);border-radius:20px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.14);transition:.25s ease;border:1px solid rgba(255,255,255,.15);
}
.card:hover{transform:translateY(-6px)}
.card-media{height:210px;background:
linear-gradient(180deg,transparent 45%,rgba(3,30,56,.13)),
linear-gradient(135deg,#d7e1e8,#f3c19e);position:relative}
.card-media:after{content:"IMAGEM";position:absolute;inset:0;display:grid;place-items:center;font-size:.72rem;letter-spacing:.12em;font-weight:900;color:rgba(7,29,50,.28)}
.card-body{padding:18px}
.card-body h3{font-size:1rem;line-height:1.1;margin:8px 0}
.card-body p{font-size:.86rem;color:var(--muted);min-height:54px}
.more{font-size:.8rem;font-weight:950;color:var(--orange);display:inline-flex;gap:6px;align-items:center}
.more:hover{letter-spacing:.02em}
/* Feature */
.feature{background:white;padding:0}
.feature-grid{display:grid;grid-template-columns:1fr 1.25fr;min-height:460px}
.feature-photo{background:linear-gradient(135deg,#f3c497,#7d9db8);position:relative}
.feature-photo:after{content:"IMAGEM DE DESTAQUE";position:absolute;inset:0;display:grid;place-items:center;font-weight:950;color:rgba(7,29,50,.3)}
.feature-copy{padding:70px clamp(34px,6vw,90px);display:flex;flex-direction:column;justify-content:center;background:
radial-gradient(circle at 100% 0,rgba(255,90,10,.08),transparent 30%), white}
.feature-copy strong{color:var(--orange);font-size:clamp(2rem,4vw,4rem);line-height:1}
/* News */
.news{background:#f7f8fa}
.news-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:18px}
.news-card{background:white;border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-soft);transition:.25s ease}
.news-card:hover{transform:translateY(-4px)}
.news-img{height:210px;background:linear-gradient(135deg,#123b60,#e89c61)}
.news-card .copy{padding:18px}
.news-card h3{margin:6px 0 8px;line-height:1.15}
.tag{font-size:.72rem;font-weight:900;color:var(--orange);text-transform:uppercase}
/* Participate */
.participate{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:white;position:relative;overflow:hidden}
.participate:after{content:"";position:absolute;right:-120px;top:20px;width:380px;height:380px;border:8px solid rgba(255,90,10,.25);transform:rotate(45deg)}
.participate-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;position:relative;z-index:2}
.actions{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.action{padding:28px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.028));transition:.25s ease}
.action:hover{transform:translateY(-4px);border-color:rgba(255,122,47,.55);background:rgba(255,255,255,.065)}
.action b{display:block;margin-top:16px}.action span{font-size:.9rem;color:rgba(255,255,255,.66)}
/* Banner */
.number-band{background:linear-gradient(90deg,#041a2e,#062b4c 65%,#041a2e);color:white;padding:40px 0;border-top:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden}
.number-band:after{content:"+";position:absolute;right:4%;top:-88px;font-size:15rem;font-weight:950;color:rgba(255,90,10,.08)}
.number-grid{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:28px}
.num{font-size:clamp(3.6rem,7vw,6.2rem);line-height:.8;color:var(--orange);font-weight:950;letter-spacing:-.05em}
/* Footer */
footer{background:white;padding:44px 0 28px}
.footer-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:30px;align-items:start}
.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 20px}
.social{display:flex;gap:10px}
.social a{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-weight:900}
.legal{margin-top:34px;padding-top:22px;border-top:1px solid var(--line);font-size:.78rem;color:var(--muted)}
@media (max-width: 1020px){
.menu{display:none}
.menu-toggle{display:block}
.hero-grid{grid-template-columns:1fr}
.hero{min-height:auto}
.hero-copy{padding:70px 0 20px}
.hero-media{min-height:520px}
.side-note{right:20px;top:40px}
.axes-grid{grid-template-columns:repeat(3,1fr)}
.axis:nth-child(3){border-right:none}
.cards{grid-template-columns:repeat(3,1fr)}
.about-grid,.participate-grid{grid-template-columns:1fr}
.news-grid{grid-template-columns:1fr 1fr}
.news-card:first-child{grid-column:span 2}
.number-grid{grid-template-columns:1fr auto;gap:16px}
.number-grid .num{grid-column:2}
.number-grid .band-copy{grid-column:1}
.number-grid .btn{grid-column:1 / -1;justify-self:start}
}
@media (max-width: 700px){
.container{width:min(100% - 28px, var(--max))}
.section{padding:72px 0}
.nav{height:72px}
.logo-copy small{display:none}
.header .btn{display:none}
.hero{padding-top:72px}
.hero-copy{padding:54px 0 22px}
.display{font-size:clamp(3rem,13vw,4.7rem)}
.hero-copy p{font-size:1rem}
.hero-media{min-height:455px}
.candidate{height:475px;width:94%}
.side-note{font-size:1rem;width:130px}
.hero-tags{gap:10px;font-size:.68rem}
.axes{overflow-x:auto}
.axes-grid{grid-template-columns:repeat(5,230px);width:max-content}
.axis{border-right:1px solid var(--line)!important}
.about-grid{gap:30px}
.portrait{min-height:380px}
.credentials{grid-template-columns:1fr}
.section-head{align-items:start;flex-direction:column}
.cards{
display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;
margin-right:-14px;
}
.card{min-width:84vw;scroll-snap-align:start}
.feature-grid{grid-template-columns:1fr}
.feature-photo{min-height:300px}
.feature-copy{padding:42px 26px}
.news-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}
.news-card,.news-card:first-child{min-width:82vw;grid-column:auto;scroll-snap-align:start}
.actions{grid-template-columns:1fr 1fr}
.number-grid{grid-template-columns:1fr}
.number-grid .num,.number-grid .band-copy,.number-grid .btn{grid-column:auto}
.footer-grid{grid-template-columns:1fr}
}
@media (max-width: 470px){
.actions{grid-template-columns:1fr}
.hero-media{min-height:390px}
.candidate{height:410px}
.display{font-size:3.4rem}
}
.candidate{
background:none !important;
width:min(560px,96%);
height:650px;
border-radius:0;
overflow:visible;
display:flex;
align-items:flex-end;
justify-content:center;
filter:drop-shadow(0 28px 34px rgba(0,0,0,.30));
}
.candidate img{
width:100%;
height:100%;
object-fit:cover;
object-position:center 15%;
border-radius:280px 280px 32px 32px;
border:1px solid rgba(255,255,255,.12);
}
.candidate:after{display:none}
.portrait{
min-height:540px;
background:none !important;
border:none;
box-shadow:none;
overflow:visible;
}
.portrait:after{display:none}
.portrait img{
width:100%;
height:540px;
object-fit:cover;
object-position:center 15%;
border-radius:28px;
border:1px solid rgba(255,255,255,.12);
box-shadow:0 28px 65px rgba(0,0,0,.22);
}
.bio-badges{
display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 30px;
}
.bio-badges span{
padding:9px 12px;border-radius:999px;
background:rgba(255,255,255,.06);
border:1px solid rgba(255,255,255,.12);
color:rgba(255,255,255,.84);
font-size:.78rem;font-weight:850;
}
.pautas-intro{
max-width:760px;color:rgba(255,255,255,.75);margin-top:-12px;margin-bottom:28px;
}
.pautas-grid{
display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
}
.pauta-card{
padding:28px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));
border:1px solid rgba(255,255,255,.12);position:relative;overflow:hidden;
}
.pauta-card:before{
content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--orange);
}
.pauta-card h3{margin:0 0 10px;font-size:1.18rem}
.pauta-card p{margin:0;color:rgba(255,255,255,.70);font-size:.94rem}
.profile-strip{
background:white;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.profile-grid{
display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:24px 0;
}
.profile-avatar{
width:64px;height:64px;border-radius:50%;overflow:hidden;border:3px solid #fff;box-shadow:0 0 0 2px var(--orange);
}
.profile-avatar img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.profile-title b{display:block;font-size:1.05rem}
.profile-title span{color:var(--muted);font-size:.9rem}
.social-links{display:flex;gap:10px;flex-wrap:wrap}
.social-links a{
padding:10px 14px;border-radius:999px;border:1px solid var(--line);
background:#fff;color:var(--navy);font-weight:850;font-size:.82rem;
transition:.2s ease;
}
.social-links a:hover{border-color:var(--orange);color:var(--orange);transform:translateY(-1px)}
.whats-fixed{
position:fixed;right:22px;bottom:22px;z-index:40;width:58px;height:58px;border-radius:50%;
display:grid;place-items:center;background:#25D366;color:white;font-weight:950;
box-shadow:0 14px 32px rgba(0,0,0,.22);border:3px solid white;
}
.whats-fixed:hover{transform:translateY(-2px)}
@media (max-width:900px){
.pautas-grid{grid-template-columns:1fr}
.profile-grid{grid-template-columns:auto 1fr}
.social-links{grid-column:1 / -1}
}
@media (max-width:700px){
.candidate{height:500px;width:100%}
.candidate img{border-radius:220px 220px 24px 24px;object-position:center 12%}
.portrait img{height:410px}
.profile-grid{grid-template-columns:1fr;text-align:center;justify-items:center}
.social-links{justify-content:center}
.whats-fixed{width:54px;height:54px;right:14px;bottom:14px}
}
.brand-logo{
display:flex;
align-items:center;
gap:14px;
}
.brand-logo img{
display:block;
height:56px;
width:auto;
}
.brand-logo.footer img{
height:64px;
}
@media (max-width:700px){
.brand-logo img{height:46px}
.brand-logo.footer img{height:54px}
}
.candidate{
background:none !important;
width:min(575px,96%);
height:670px;
border-radius:0;
overflow:visible;
display:flex;
align-items:flex-end;
justify-content:center;
filter:none;
}
.candidate img{
width:100%;
height:100%;
object-fit:contain;
object-position:center bottom;
border:none;
border-radius:0;
display:block;
filter:drop-shadow(0 26px 34px rgba(0,0,0,.30));
}
.portrait{
min-height:560px;
border-radius:28px;
padding:26px 18px 0;
border:1px solid rgba(255,255,255,.10);
background:
radial-gradient(circle at 32% 18%,rgba(255,122,47,.16),transparent 28%),
linear-gradient(160deg,#204769,#071d32 68%);
box-shadow:0 28px 65px rgba(0,0,0,.20);
display:flex;
align-items:flex-end;
justify-content:center;
overflow:hidden;
}
.portrait img{
width:100%;
height:100%;
object-fit:contain;
object-position:center bottom;
border:none;
border-radius:0;
box-shadow:none;
display:block;
filter:drop-shadow(0 20px 24px rgba(0,0,0,.20));
}
.profile-avatar img{
object-fit:cover;
object-position:center 18%;
background:#eef2f5;
}
@media (max-width:700px){
.candidate{
height:500px;
width:100%;
}
.portrait{
min-height:430px;
padding:20px 10px 0;
}
.portrait img{
height:390px;
}
}
/* ===== AJUSTES V5 ===== */
.hero-tags{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:30px;
font-size:.76rem;
letter-spacing:.08em;
text-transform:uppercase;
font-weight:900;
color:white;
}
.hero-tags span{
padding:10px 14px;
border-radius:999px;
border:1px solid rgba(255,255,255,.14);
backdrop-filter:blur(8px);
box-shadow:0 10px 22px rgba(0,0,0,.12);
}
.hero-tags span:first-child,
.hero-tags span:last-child{
padding-left:14px;
border-right:1px solid rgba(255,255,255,.14);
}
.tag-saude{background:rgba(34,197,94,.22); color:#d9ffe5; border-color:rgba(34,197,94,.38)}
.tag-infancia{background:rgba(251,146,60,.22); color:#fff0dc; border-color:rgba(251,146,60,.4)}
.tag-inclusao{background:rgba(168,85,247,.22); color:#f3e8ff; border-color:rgba(168,85,247,.4)}
.tag-gestao{background:rgba(14,165,233,.22); color:#e0f7ff; border-color:rgba(14,165,233,.38)}
.tag-transparencia{background:rgba(245,158,11,.22); color:#fff6d8; border-color:rgba(245,158,11,.4)}
.axis{
padding:40px 24px 38px;
}
.axis .ico{
width:66px;
height:66px;
margin:0 auto 16px;
border-radius:20px;
border:2px solid rgba(255,90,10,.42);
background:linear-gradient(180deg,#fff,#fff7f2);
box-shadow:0 10px 24px rgba(255,90,10,.10);
display:grid;
place-items:center;
color:var(--orange);
transition:.22s ease;
}
.axis .ico svg{
width:28px;
height:28px;
stroke:currentColor;
stroke-width:2.15;
fill:none;
stroke-linecap:round;
stroke-linejoin:round;
}
.axis:hover .ico{
transform:translateY(-2px) scale(1.04);
box-shadow:0 14px 28px rgba(255,90,10,.14);
}
.axis h3{
font-size:1rem;
letter-spacing:-.02em;
margin:0 0 8px;
}
.profile-strip{
background:linear-gradient(180deg,#ffffff,#f7f9fb);
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
box-shadow:0 8px 24px rgba(7,29,50,.04);
}
.profile-grid{
display:grid;
grid-template-columns:auto 1fr auto;
gap:26px;
align-items:center;
padding:26px 0;
}
.profile-avatar{
width:86px;
height:86px;
border-radius:50%;
overflow:hidden;
border:3px solid #fff;
box-shadow:0 0 0 2px var(--orange), 0 12px 26px rgba(7,29,50,.12);
background:linear-gradient(180deg,#f2f6fb,#e9eef4);
display:grid;
place-items:center;
}
.profile-avatar img{
width:100%;
height:100%;
object-fit:contain;
object-position:center bottom;
transform:scale(1.14) translateY(8px);
background:transparent;
}
.profile-title b{
display:block;
font-size:1.32rem;
line-height:1.05;
margin-bottom:6px;
}
.profile-title span{
color:var(--muted);
font-size:1rem;
}
.profile-actions{
display:flex;
flex-direction:column;
align-items:flex-end;
gap:10px;
}
.profile-actions strong{
font-size:.78rem;
letter-spacing:.14em;
text-transform:uppercase;
color:#6c7d8f;
}
.social-links{
display:flex;
gap:12px;
flex-wrap:wrap;
justify-content:flex-end;
}
.social-links a{
padding:12px 18px;
border-radius:999px;
border:1px solid #d5dde6;
background:#fff;
color:var(--navy);
font-weight:900;
font-size:.9rem;
display:inline-flex;
align-items:center;
gap:10px;
box-shadow:0 8px 18px rgba(7,29,50,.06);
transition:.22s ease;
}
.social-links a .sicon{
width:28px;
height:28px;
border-radius:50%;
display:grid;
place-items:center;
font-size:.9rem;
font-weight:900;
color:white;
flex:0 0 auto;
}
.social-links a:hover{
transform:translateY(-2px);
border-color:#b8c6d4;
box-shadow:0 12px 22px rgba(7,29,50,.10);
}
.social-links a.instagram .sicon{background:linear-gradient(135deg,#f9ce34,#ee2a7b,#6228d7)}
.social-links a.facebook .sicon{background:#1877F2}
.social-links a.linkedin .sicon{background:#0A66C2}
.social-links a.whatsapp .sicon{background:#25D366}
.social-links a.instagram:hover{border-color:#e0b0ef}
.social-links a.facebook:hover{border-color:#b8d4ff}
.social-links a.linkedin:hover{border-color:#b7d3f4}
.social-links a.whatsapp:hover{border-color:#b8ebca}
@media (max-width: 980px){
.profile-grid{
grid-template-columns:auto 1fr;
}
.profile-actions{
grid-column:1 / -1;
align-items:flex-start;
}
.social-links{
justify-content:flex-start;
}
}
@media (max-width: 700px){
.hero-tags{
gap:8px;
}
.hero-tags span{
padding:8px 12px;
font-size:.7rem;
}
.profile-grid{
grid-template-columns:1fr;
text-align:center;
justify-items:center;
}
.profile-actions{
align-items:center;
}
.social-links{
justify-content:center;
}
.social-links a{
padding:11px 15px;
font-size:.85rem;
}
}
/* WhatsApp icon refinement */
.sicon.wa-icon,
.wa-ico,
.wa-float-icon,
.footer-wa-icon{
display:grid;
place-items:center;
}
.sicon.wa-icon svg{
width:16px;
height:16px;
stroke:none;
fill:white;
}
.wa-ico{
width:28px;
height:28px;
margin:0;
background:transparent;
border:none;
box-shadow:none;
color:var(--orange);
}
.wa-ico svg{
width:28px;
height:28px;
fill:currentColor;
}
.whats-fixed{
font-size:0;
}
.wa-float-icon svg{
width:28px;
height:28px;
fill:white;
}
.footer-wa-icon svg{
width:16px;
height:16px;
fill:currentColor;
}
.social a .footer-wa-icon{
width:16px;
height:16px;
display:grid;
place-items:center;
}
/* ===== V7 acabamento premium ===== */
:root{
--saude:#22c55e;
--infancia:#f97316;
--inclusao:#8b5cf6;
--gestao:#0ea5e9;
--transparencia:#eab308;
}
body{
background:#f4f2ee;
}
.section{
position:relative;
}
/* Hero */
.hero{
min-height:850px;
background:
radial-gradient(circle at 78% 18%,rgba(255,126,51,.28),transparent 25%),
radial-gradient(circle at 90% 54%,rgba(255,90,10,.10),transparent 24%),
linear-gradient(90deg,#031e38 0%,#062b4c 47%,#0b385c 100%);
}
.hero:before{
opacity:.35;
background-size:72px 72px;
}
.hero:after{display:none}
.hero-grid{
min-height:768px;
grid-template-columns:1.05fr .95fr;
}
.hero-copy{
padding:90px 0 70px;
position:relative;
z-index:4;
}
.hero-actions{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:12px;
margin-top:28px;
}
.hero-actions .btn.outline{
background:rgba(255,255,255,.04);
border-color:rgba(255,255,255,.24);
box-shadow:none;
}
.hero-actions .btn.outline:hover{
background:rgba(255,255,255,.09);
border-color:rgba(255,255,255,.35);
}
.hero-media{
min-height:700px;
overflow:visible;
isolation:isolate;
}
.hero-sky{
position:absolute;
inset:auto -12% 0 -5%;
height:65%;
border-radius:40px 40px 0 0;
background:
radial-gradient(circle at 74% 20%,rgba(255,193,118,.76),transparent 18%),
linear-gradient(180deg,rgba(255,181,106,.22),rgba(13,49,79,.04) 36%,rgba(3,30,56,.02));
z-index:0;
filter:saturate(110%);
}
.hero-monument{
position:absolute;
right:0;
bottom:88px;
width:58%;
height:330px;
z-index:1;
opacity:.8;
}
.tower{
position:absolute;
bottom:0;
width:24px;
height:220px;
background:linear-gradient(180deg,#f2d5b5,#7e654f);
box-shadow:0 12px 36px rgba(0,0,0,.28);
}
.tower-a{right:110px;transform:skew(-3deg)}
.tower-b{right:75px;transform:skew(3deg)}
.dome{
position:absolute;
bottom:0;
width:110px;
height:52px;
background:linear-gradient(180deg,#e8ddd2,#8e8174);
}
.dome-a{
right:168px;
border-radius:110px 110px 0 0;
}
.dome-b{
right:-20px;
border-radius:0 0 110px 110px;
transform:translateY(12px);
}
.candidate{
width:min(610px,100%);
height:720px;
align-self:end;
margin-bottom:-34px;
z-index:3;
position:relative;
}
.candidate img{
object-fit:contain;
object-position:center bottom;
filter:drop-shadow(0 30px 34px rgba(0,0,0,.30));
transform:translateY(26px);
}
.side-note{
right:-12px;
top:150px;
width:200px;
text-align:right;
background:rgba(3,30,56,.55);
border:1px solid rgba(255,255,255,.10);
border-radius:18px;
padding:16px;
backdrop-filter:blur(10px);
z-index:4;
}
.side-note small{
display:block;
color:rgba(255,255,255,.65);
text-transform:uppercase;
letter-spacing:.09em;
font-size:.65rem;
margin-bottom:8px;
}
.side-note strong{
display:block;
font-size:1.25rem;
line-height:1.02;
}
.hero-orbit{
position:absolute;
border:5px solid rgba(255,90,10,.28);
border-radius:22px;
transform:rotate(45deg);
pointer-events:none;
z-index:1;
}
.hero-orbit-a{width:210px;height:210px;right:10%;top:140px}
.hero-orbit-b{width:120px;height:120px;right:31%;bottom:90px;border-color:rgba(255,255,255,.08)}
/* Colored topic chips */
.hero-tags{
gap:9px;
margin-top:26px;
}
.hero-tags span{
padding:9px 13px;
border-radius:999px;
box-shadow:none;
border:1px solid rgba(255,255,255,.11);
backdrop-filter:blur(8px);
}
.tag-saude{background:rgba(34,197,94,.20)!important;color:#dfffe9!important;border-color:rgba(34,197,94,.35)!important}
.tag-infancia{background:rgba(249,115,22,.20)!important;color:#ffeadb!important;border-color:rgba(249,115,22,.35)!important}
.tag-inclusao{background:rgba(139,92,246,.20)!important;color:#efe7ff!important;border-color:rgba(139,92,246,.35)!important}
.tag-gestao{background:rgba(14,165,233,.20)!important;color:#def6ff!important;border-color:rgba(14,165,233,.35)!important}
.tag-transparencia{background:rgba(234,179,8,.20)!important;color:#fff6cd!important;border-color:rgba(234,179,8,.35)!important}
/* Axes */
.axes{
position:relative;
z-index:5;
background:#f7f5f1;
box-shadow:0 -16px 38px rgba(3,30,56,.08);
}
.axis{
background:transparent;
overflow:hidden;
}
.axis:before{
content:"";
position:absolute;
inset:auto 24px 0 24px;
height:4px;
border-radius:999px;
opacity:.9;
}
.axis-saude:before{background:var(--saude)}
.axis-infancia:before{background:var(--infancia)}
.axis-inclusao:before{background:var(--inclusao)}
.axis-gestao:before{background:var(--gestao)}
.axis-transparencia:before{background:var(--transparencia)}
.axis:after{display:none}
.axis .ico{
border:none;
background:#fff;
box-shadow:0 10px 26px rgba(7,29,50,.07);
}
.axis-saude .ico{color:var(--saude);background:rgba(34,197,94,.08)}
.axis-infancia .ico{color:var(--infancia);background:rgba(249,115,22,.08)}
.axis-inclusao .ico{color:var(--inclusao);background:rgba(139,92,246,.08)}
.axis-gestao .ico{color:var(--gestao);background:rgba(14,165,233,.08)}
.axis-transparencia .ico{color:var(--transparencia);background:rgba(234,179,8,.10)}
/* Social profile strip */
.profile-strip{
background:linear-gradient(180deg,#ffffff,#f7f8fa);
border-top:none;
box-shadow:0 10px 30px rgba(7,29,50,.05);
}
.profile-grid{
grid-template-columns:1fr auto;
gap:30px;
padding:30px 0;
}
.profile-person{
display:flex;
align-items:center;
gap:18px;
min-width:0;
}
.profile-avatar{
width:92px;
height:92px;
flex:0 0 auto;
background:linear-gradient(180deg,#edf2f7,#dde6ef);
}
.profile-avatar img{
object-fit:contain;
object-position:center bottom;
transform:scale(1.16) translateY(10px);
}
.profile-title b{
font-size:1.45rem;
}
.profile-title span{
font-size:.98rem;
}
.profile-actions{
align-items:flex-end;
}
.social-kicker{
font-size:.75rem;
font-weight:900;
letter-spacing:.14em;
text-transform:uppercase;
color:#728094;
}
.social-links a{
padding:12px 17px;
border:none;
box-shadow:0 8px 22px rgba(7,29,50,.08);
background:#fff;
}
.social-links .social-primary{
background:#25D366;
color:white;
}
.social-links .social-primary .sicon{
background:white!important;
color:#25D366!important;
}
.social-links .social-primary .wa-icon svg{
fill:#25D366!important;
}
/* About section cleanup */
.about{
background:
radial-gradient(circle at 86% 20%,rgba(255,90,10,.10),transparent 24%),
linear-gradient(135deg,#031e38,#062b4c);
}
.about-grid{
grid-template-columns:.9fr 1.1fr;
gap:84px;
}
.quote{
font-size:1.32rem;
line-height:1.45;
color:rgba(255,255,255,.85);
}
.credentials{
grid-template-columns:repeat(2,1fr);
}
.cred{
background:rgba(255,255,255,.035);
box-shadow:none;
}
/* Proposal cards */
.proposals{
background:#041f38;
}
.cards{
gap:18px;
}
.card{
border:1px solid rgba(7,29,50,.06);
box-shadow:0 16px 38px rgba(0,0,0,.12);
position:relative;
}
.card:before{
content:"";
position:absolute;
inset:0 auto 0 0;
width:4px;
z-index:3;
}
.card-saude:before{background:var(--saude)}
.card-infancia:before{background:var(--infancia)}
.card-inclusao:before{background:var(--inclusao)}
.card-transparencia:before{background:var(--transparencia)}
.card-media{
height:218px;
transition:.35s ease;
}
.card:hover .card-media{transform:scale(1.02)}
.card-body{
position:relative;
z-index:2;
}
/* Featured story */
.feature{
background:#f5f1eb;
}
.feature-grid{
min-height:500px;
}
/* News */
.news{
background:#f2f0ec;
}
/* Participate */
.participate{
background:
radial-gradient(circle at 90% 50%,rgba(255,90,10,.10),transparent 28%),
linear-gradient(135deg,#031e38,#082d4d);
}
.actions{
grid-template-columns:1.4fr .8fr .8fr;
align-items:stretch;
}
.action:first-child{
grid-row:span 2;
min-height:220px;
display:flex;
flex-direction:column;
justify-content:center;
background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));
}
.action{
min-height:102px;
}
/* Footer */
footer{
background:#f7f5f1;
}
.footer-grid{
align-items:center;
}
/* Motion */
@media (prefers-reduced-motion:no-preference){
.card,.axis,.action,.social-links a,.btn{
transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
}
.hero-orbit-a{animation:floatA 8s ease-in-out infinite}
.hero-orbit-b{animation:floatB 10s ease-in-out infinite}
@keyframes floatA{50%{transform:rotate(45deg) translateY(-10px)}}
@keyframes floatB{50%{transform:rotate(45deg) translateY(8px)}}
}
/* Tablet */
@media (max-width:1020px){
.hero-grid{grid-template-columns:1fr}
.hero-copy{padding-bottom:20px}
.hero-media{min-height:580px}
.candidate{
height:600px;
width:min(560px,94%);
margin:0 auto -30px;
}
.side-note{right:24px;top:76px}
.profile-grid{grid-template-columns:1fr}
.profile-actions{align-items:flex-start}
.social-links{justify-content:flex-start}
.actions{grid-template-columns:1fr 1fr}
.action:first-child{grid-row:auto;grid-column:1 / -1;min-height:160px}
}
/* Mobile */
@media (max-width:700px){
.hero{
min-height:auto;
}
.hero-grid{
min-height:auto;
}
.hero-copy{
padding:52px 0 8px;
}
.display{
font-size:clamp(3rem,13vw,4rem);
max-width:100%;
}
.hero-actions{
align-items:stretch;
}
.hero-actions .btn{
width:100%;
justify-content:center;
}
.hero-media{
min-height:500px;
margin-top:0;
}
.candidate{
height:525px;
width:108%;
margin-left:-4%;
margin-bottom:-26px;
}
.candidate img{
transform:translateY(18px);
}
.side-note{
top:40px;
right:0;
width:148px;
padding:12px;
}
.side-note strong{font-size:1rem}
.hero-monument{
width:72%;
height:260px;
right:-8%;
bottom:64px;
}
.hero-orbit-a{width:140px;height:140px;right:-20px;top:160px}
.hero-orbit-b{display:none}
.axes{
overflow-x:auto;
}
.axes-grid{
grid-template-columns:repeat(5,220px);
}
.profile-grid{
grid-template-columns:1fr;
text-align:left;
}
.profile-person{
width:100%;
align-items:center;
}
.profile-actions{
width:100%;
align-items:flex-start;
}
.social-links{
width:100%;
display:grid;
grid-template-columns:1fr 1fr;
}
.social-links a{
justify-content:center;
}
.social-links .social-primary{
grid-column:1 / -1;
}
.about-grid{
gap:40px;
}
.credentials{
grid-template-columns:1fr;
}
.actions{
grid-template-columns:1fr;
}
.action:first-child{
grid-column:auto;
min-height:140px;
}
}
@media (max-width:470px){
.profile-person{
align-items:flex-start;
}
.profile-avatar{
width:78px;
height:78px;
}
.profile-title b{
font-size:1.18rem;
}
.profile-title span{
font-size:.88rem;
}
.social-links{
grid-template-columns:1fr;
}
.social-links .social-primary{
grid-column:auto;
}
}
/* ===== V8 refinamento solicitado ===== */
/* Hero menor e foto visualmente maior */
.hero{
min-height:710px!important;
}
.hero-grid{
min-height:624px!important;
grid-template-columns:1.02fr .98fr!important;
}
.hero-copy{
padding:58px 0 50px!important;
}
.display{
font-size:clamp(2.8rem,5.05vw,5.35rem)!important;
}
.hero-media{
min-height:620px!important;
}
.candidate{
height:645px!important;
width:min(640px,108%)!important;
margin-bottom:-28px!important;
}
.candidate img{
transform:translateY(10px)!important;
}
.hero-sky{
height:62%!important;
}
.side-note{
top:118px!important;
}
/* Área "Quem é" com mais respiro e contraste */
.about{
background:
radial-gradient(circle at 8% 18%,rgba(255,90,10,.10),transparent 24%),
linear-gradient(105deg,#f6f2eb 0%,#f6f2eb 46%,#ffffff 46%,#ffffff 100%)!important;
color:var(--ink)!important;
}
.about:after{
color:rgba(255,90,10,.05)!important;
}
.about-grid{
grid-template-columns:.86fr 1.14fr!important;
gap:70px!important;
}
.portrait{
min-height:500px!important;
background:
radial-gradient(circle at 50% 18%,rgba(255,130,60,.18),transparent 26%),
linear-gradient(180deg,#e9eef3,#dce5ec)!important;
border:1px solid #dce3e9!important;
box-shadow:0 22px 54px rgba(7,29,50,.11)!important;
}
.portrait img{
filter:drop-shadow(0 18px 22px rgba(7,29,50,.16))!important;
}
.quote{
color:#31465b!important;
border-left:4px solid var(--orange);
padding-left:18px!important;
margin-top:24px;
}
.about-copy .eyebrow{
color:var(--orange)!important;
}
.about-copy .title{
color:var(--navy)!important;
}
.about-copy p{
color:#4c5d6f!important;
}
.bio-badges span{
background:#fff!important;
color:#31465b!important;
border-color:#dde4ea!important;
box-shadow:0 4px 12px rgba(7,29,50,.04);
}
.credentials{
gap:14px!important;
}
.cred{
background:#fff!important;
border:1px solid #e2e7ec!important;
box-shadow:0 8px 22px rgba(7,29,50,.045)!important;
}
.cred b{
color:var(--navy)!important;
}
.cred span{
color:#667586!important;
}
/* Propostas com imagens reais da arte fornecida */
.proposals{
background:
radial-gradient(circle at 93% 12%,rgba(255,90,10,.10),transparent 23%),
linear-gradient(135deg,#031e38,#07355a)!important;
}
.card-media{
height:200px!important;
background-size:cover!important;
background-position:center!important;
background-repeat:no-repeat!important;
}
.card-media:after{
display:none!important;
}
.card-body{
padding:19px 18px 22px!important;
}
.card-body p{
min-height:0!important;
margin-bottom:0!important;
}
.card{
cursor:default!important;
}
.card:hover{
transform:translateY(-4px)!important;
}
/* Remove Participate gap */
.number-band{
margin-top:0!important;
}
/* Rodapé novo */
.site-footer{
background:#021a30;
color:white;
padding:0!important;
position:relative;
overflow:hidden;
}
.site-footer:after{
content:"+";
position:absolute;
right:-10px;
bottom:-100px;
font-size:22rem;
font-weight:950;
color:rgba(255,90,10,.055);
line-height:1;
pointer-events:none;
}
.footer-accent{
height:5px;
background:linear-gradient(90deg,var(--orange),#ff8a4a 34%,transparent 75%);
}
.footer-main{
display:grid;
grid-template-columns:1.55fr .65fr .8fr;
gap:70px;
padding:62px 0 48px;
position:relative;
z-index:2;
}
.footer-brand .brand-logo.footer img{
height:72px;
}
.footer-brand p{
max-width:430px;
color:rgba(255,255,255,.65);
margin:20px 0 24px;
line-height:1.65;
}
.footer-social{
display:flex;
gap:10px;
}
.footer-social a{
width:42px;
height:42px;
border-radius:50%;
display:grid;
place-items:center;
border:1px solid rgba(255,255,255,.13);
background:rgba(255,255,255,.05);
color:white;
font-weight:900;
transition:.2s ease;
}
.footer-social a:hover{
transform:translateY(-2px);
background:rgba(255,255,255,.10);
border-color:rgba(255,255,255,.25);
}
.footer-social .footer-wa{
background:#25D366;
border-color:#25D366;
}
.footer-social .footer-wa svg{
width:18px;
height:18px;
fill:white;
}
.footer-nav,
.footer-contact{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:12px;
}
.footer-nav strong,
.footer-contact strong{
color:#ff7a2f;
text-transform:uppercase;
letter-spacing:.12em;
font-size:.78rem;
margin-bottom:6px;
}
.footer-nav a,
.footer-contact span{
color:rgba(255,255,255,.72);
font-size:.95rem;
}
.footer-nav a:hover{
color:white;
}
.footer-contact-btn{
margin-top:10px;
padding:12px 16px;
border-radius:10px;
background:var(--orange);
color:white;
font-weight:900;
}
.footer-bottom{
display:flex;
justify-content:space-between;
gap:22px;
padding:22px 0 28px;
border-top:1px solid rgba(255,255,255,.09);
color:rgba(255,255,255,.43);
font-size:.76rem;
position:relative;
z-index:2;
}
@media (max-width:1020px){
.hero{
min-height:auto!important;
}
.hero-grid{
min-height:auto!important;
}
.hero-copy{
padding-bottom:10px!important;
}
.hero-media{
min-height:550px!important;
}
.candidate{
height:580px!important;
width:min(600px,100%)!important;
}
.about{
background:linear-gradient(180deg,#f6f2eb 0 46%,#fff 46% 100%)!important;
}
.about-grid{
grid-template-columns:1fr!important;
}
.footer-main{
grid-template-columns:1.2fr .8fr;
}
.footer-contact{
grid-column:1 / -1;
}
}
@media (max-width:700px){
.hero-copy{
padding:42px 0 0!important;
}
.hero-media{
min-height:455px!important;
}
.candidate{
height:485px!important;
width:108%!important;
margin-left:-4%!important;
margin-bottom:-22px!important;
}
.candidate img{
transform:translateY(8px)!important;
}
.side-note{
top:34px!important;
}
.about{
background:linear-gradient(180deg,#f6f2eb 0 43%,#fff 43% 100%)!important;
}
.portrait{
min-height:410px!important;
}
.footer-main{
grid-template-columns:1fr;
gap:38px;
padding:48px 0 34px;
}
.footer-contact{
grid-column:auto;
}
.footer-bottom{
flex-direction:column;
}
}
/* Fix das imagens dos cards */
.card-media{
background-size:cover !important;
background-position:center center !important;
background-repeat:no-repeat !important;
overflow:hidden;
position:relative;
}
.card-media::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg, rgba(3,30,56,0) 0%, rgba(3,30,56,.08) 100%);
pointer-events:none;
}
/* ===== V9 destaque + footer ===== */
/* Featured image */
.feature{
background:linear-gradient(180deg,#f7f4ef,#f1ece5);
padding:0;
}
.feature-grid{
min-height:460px;
align-items:stretch;
}
.feature-photo{
position:relative;
overflow:hidden;
background:transparent !important;
min-height:420px;
}
.feature-photo img{
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
display:block;
}
.feature-copy{
background:
radial-gradient(circle at 100% 0,rgba(255,90,10,.09),transparent 32%),
linear-gradient(180deg,#ffffff,#fbf8f4);
}
.feature-copy p{
color:#516170;
max-width:560px;
}
/* Unified WhatsApp icon styling */
.wa-icon,
.wa-float-icon,
.footer-wa,
.btn-wa-icon{
display:grid;
place-items:center;
line-height:0;
}
.wa-icon svg,
.wa-float-icon svg,
.footer-wa svg,
.btn-wa-icon svg{
width:16px;
height:16px;
fill:currentColor;
display:block;
}
.social-links .social-primary{
background:#25D366 !important;
color:#fff !important;
border-color:#25D366 !important;
}
.social-links .social-primary .sicon{
background:rgba(255,255,255,.18) !important;
color:#fff !important;
width:30px;
height:30px;
border-radius:50%;
display:grid;
place-items:center;
}
.social-links .social-primary .wa-icon svg{
width:16px;
height:16px;
fill:#fff !important;
}
.whats-fixed{
background:#25D366 !important;
border:3px solid #fff !important;
box-shadow:0 14px 32px rgba(0,0,0,.24) !important;
font-size:0;
}
.wa-float-icon svg{
width:28px;
height:28px;
fill:#fff;
}
/* Better footer */
.site-footer{
background:
radial-gradient(circle at 85% 20%,rgba(255,90,10,.10),transparent 20%),
linear-gradient(180deg,#021a30,#031e38);
color:#fff;
}
.site-footer:after{
content:"";
position:absolute;
right:-80px;
bottom:-80px;
width:280px;
height:280px;
border:6px solid rgba(255,122,47,.10);
border-radius:38px;
transform:rotate(45deg);
pointer-events:none;
}
.footer-main{
grid-template-columns:1.2fr .6fr .7fr 1fr;
gap:44px;
padding:64px 0 40px;
align-items:start;
}
.footer-brand .brand-logo.footer img{
height:76px;
}
.footer-brand p{
max-width:420px;
color:rgba(255,255,255,.70);
margin:18px 0 22px;
line-height:1.7;
}
.footer-social{
display:flex;
gap:10px;
flex-wrap:wrap;
}
.footer-social a{
width:44px;
height:44px;
border-radius:50%;
display:grid;
place-items:center;
border:1px solid rgba(255,255,255,.12);
background:rgba(255,255,255,.05);
color:#fff;
font-weight:900;
box-shadow:0 8px 16px rgba(0,0,0,.10);
transition:.22s ease;
}
.footer-social a:hover{
transform:translateY(-2px);
border-color:rgba(255,255,255,.26);
background:rgba(255,255,255,.11);
}
.footer-social .footer-wa{
background:#25D366;
border-color:#25D366;
color:#fff;
}
.footer-social .footer-wa svg{
width:18px;
height:18px;
fill:#fff;
}
.footer-links-col{
display:flex;
flex-direction:column;
gap:12px;
align-items:flex-start;
}
.footer-links-col strong{
color:#ff8a4a;
text-transform:uppercase;
letter-spacing:.12em;
font-size:.78rem;
margin-bottom:4px;
}
.footer-links-col a,
.footer-links-col span{
color:rgba(255,255,255,.72);
font-size:.96rem;
line-height:1.5;
}
.footer-links-col a:hover{ color:#fff; }
.footer-cta{
background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));
border:1px solid rgba(255,255,255,.10);
border-radius:24px;
padding:24px;
box-shadow:0 18px 40px rgba(0,0,0,.12);
}
.footer-cta small{
display:block;
color:#ff8a4a;
text-transform:uppercase;
letter-spacing:.12em;
font-weight:900;
margin-bottom:10px;
}
.footer-cta h3{
margin:0 0 10px;
font-size:1.5rem;
line-height:1.1;
letter-spacing:-.03em;
}
.footer-cta p{
margin:0 0 18px;
color:rgba(255,255,255,.72);
line-height:1.6;
}
.footer-contact-btn{
display:inline-flex;
align-items:center;
gap:12px;
padding:14px 18px;
border-radius:14px;
background:#25D366 !important;
color:#fff !important;
font-weight:900;
box-shadow:0 12px 24px rgba(37,211,102,.22);
}
.footer-contact-btn .btn-wa-icon{
width:30px;
height:30px;
border-radius:50%;
background:rgba(255,255,255,.16);
color:#fff;
flex:0 0 auto;
}
.footer-contact-btn .btn-wa-icon svg{
width:16px;
height:16px;
fill:#fff;
}
.footer-bottom{
display:flex;
justify-content:space-between;
gap:20px;
padding:22px 0 30px;
border-top:1px solid rgba(255,255,255,.10);
color:rgba(255,255,255,.48);
font-size:.78rem;
line-height:1.5;
}
@media (max-width:1020px){
.footer-main{
grid-template-columns:1fr 1fr;
gap:32px;
}
.footer-cta{
grid-column:1 / -1;
}
}
@media (max-width:700px){
.feature-grid{
grid-template-columns:1fr;
}
.feature-photo{
min-height:340px;
}
.footer-main{
grid-template-columns:1fr;
padding:48px 0 28px;
}
.footer-bottom{
flex-direction:column;
}
}
/* ===== V10 fotos HQ + ícone WhatsApp enviado ===== */
.card-media{
height:230px !important;
background-size:cover !important;
background-repeat:no-repeat !important;
transition:transform .35s ease, filter .35s ease !important;
filter:saturate(.96) contrast(1.02);
}
.card-saude .card-media{background-position:center 36% !important}
.card-infancia .card-media{background-position:center 58% !important}
.card-inclusao:nth-of-type(3) .card-media{background-position:center 55% !important}
.card-inclusao:nth-of-type(4) .card-media{background-position:center 38% !important}
.card-transparencia .card-media{background-position:center 50% !important}
.card:hover .card-media{
transform:scale(1.035) !important;
filter:saturate(1.03) contrast(1.03);
}
/* Use exactly the uploaded WhatsApp artwork everywhere */
.wa-icon img,
.wa-float-icon img,
.footer-wa img,
.btn-wa-icon img,
.wa-inline-img{
display:block;
width:100%;
height:100%;
object-fit:contain;
}
.social-links .social-primary .sicon.wa-icon{
width:31px !important;
height:31px !important;
padding:5px;
background:#fff !important;
}
.social-links .social-primary .sicon.wa-icon img{
width:100%;
height:100%;
}
.whats-fixed .wa-float-icon{
width:32px;
height:32px;
}
.whats-fixed{
padding:10px !important;
}
.footer-social .footer-wa{
padding:10px;
}
.footer-social .footer-wa img{
width:22px;
height:22px;
}
.footer-contact-btn .btn-wa-icon{
width:31px !important;
height:31px !important;
padding:5px;
background:#fff !important;
}
.footer-contact-btn .btn-wa-icon img{
width:100%;
height:100%;
}
/* =========================================================
V11 — RESPONSIVIDADE FINAL
========================================================= */
html, body{
max-width:100%;
overflow-x:hidden;
}
body.menu-open{
overflow:hidden;
}
.container{
width:min(var(--max), calc(100% - 48px));
}
.menu-toggle{
width:46px;
height:46px;
padding:0;
border-radius:13px;
border:1px solid rgba(255,255,255,.14);
background:rgba(255,255,255,.05);
display:none;
align-items:center;
justify-content:center;
line-height:1;
cursor:pointer;
}
.menu-toggle span,
.menu-toggle::before,
.menu-toggle::after{
content:"";
width:20px;
height:2px;
border-radius:10px;
background:#fff;
display:block;
position:absolute;
transition:.25s ease;
}
.menu-toggle span{transform:translateY(0)}
.menu-toggle::before{transform:translateY(-6px)}
.menu-toggle::after{transform:translateY(6px)}
.menu-toggle.is-open span{opacity:0}
.menu-toggle.is-open::before{transform:rotate(45deg)}
.menu-toggle.is-open::after{transform:rotate(-45deg)}
/* Large tablets / small notebooks */
@media (max-width:1180px){
:root{--max:1040px}
.container{
width:min(var(--max), calc(100% - 40px));
}
.nav{
gap:18px;
}
.brand-logo img{
height:50px;
}
.menu{
gap:22px;
font-size:.84rem;
}
.header > .container > .btn{
padding:13px 16px;
font-size:.82rem;
}
.hero-grid{
grid-template-columns:1fr .9fr!important;
}
.hero-copy{
max-width:620px;
}
.display{
font-size:clamp(3.3rem,5.6vw,5rem)!important;
}
.side-note{
right:4px!important;
width:174px!important;
}
.axis{
padding-inline:18px;
}
.cards{
grid-template-columns:repeat(3,1fr)!important;
}
.card:nth-child(4),
.card:nth-child(5){
grid-column:auto;
}
.footer-main{
grid-template-columns:1.25fr .7fr .85fr!important;
}
.footer-cta{
grid-column:1 / -1;
display:grid;
grid-template-columns:1fr auto;
gap:16px 30px;
align-items:center;
}
.footer-cta small,
.footer-cta h3,
.footer-cta p{
grid-column:1;
}
.footer-cta .footer-contact-btn{
grid-column:2;
grid-row:1 / 4;
}
}
/* Tablet */
@media (max-width:980px){
.container{
width:min(100% - 36px, 900px);
}
.header{
background:rgba(3,30,56,.96);
}
.nav{
height:76px;
}
.brand-logo img{
height:47px;
}
.header > .container > .btn{
display:none;
}
.menu-toggle{
display:flex;
position:relative;
z-index:72;
}
.menu{
display:flex!important;
position:fixed!important;
left:18px!important;
right:18px!important;
top:88px!important;
z-index:70!important;
flex-direction:column!important;
align-items:stretch!important;
gap:0!important;
padding:12px!important;
border-radius:22px!important;
background:rgba(3,30,56,.985)!important;
border:1px solid rgba(255,255,255,.10)!important;
box-shadow:0 24px 70px rgba(0,0,0,.28)!important;
backdrop-filter:blur(20px)!important;
opacity:0;
visibility:hidden;
transform:translateY(-12px) scale(.98);
pointer-events:none;
transition:.22s ease;
}
.menu.is-open{
opacity:1;
visibility:visible;
transform:none;
pointer-events:auto;
}
.menu a{
padding:16px 14px!important;
border-bottom:1px solid rgba(255,255,255,.08);
font-size:1rem;
opacity:1;
}
.menu a:last-child{border-bottom:none}
.menu a:after{display:none}
.hero{
padding-top:76px!important;
min-height:auto!important;
}
.hero-grid{
display:grid!important;
grid-template-columns:1fr!important;
min-height:auto!important;
}
.hero-copy{
padding:58px 0 20px!important;
max-width:760px;
position:relative;
z-index:6;
}
.hero-copy p{
max-width:650px;
}
.display{
max-width:760px;
font-size:clamp(3.5rem,9vw,5.4rem)!important;
}
.hero-media{
min-height:560px!important;
width:100%;
margin-top:-10px;
}
.candidate{
width:min(620px,82vw)!important;
height:590px!important;
margin-inline:auto!important;
margin-bottom:-28px!important;
}
.side-note{
right:6%!important;
top:90px!important;
}
.hero-monument{
width:62%!important;
right:3%!important;
}
.hero-tags{
max-width:720px;
}
.axes{
overflow:hidden;
}
.axes-grid{
grid-template-columns:repeat(5,minmax(190px,1fr))!important;
overflow-x:auto;
scroll-snap-type:x mandatory;
scrollbar-width:none;
padding-bottom:2px;
}
.axes-grid::-webkit-scrollbar{display:none}
.axis{
min-width:210px;
scroll-snap-align:start;
}
.profile-grid{
grid-template-columns:1fr!important;
gap:20px!important;
align-items:flex-start!important;
}
.profile-person{
width:100%;
}
.profile-actions{
width:100%;
align-items:flex-start!important;
}
.social-links{
justify-content:flex-start!important;
}
.about{
background:
linear-gradient(180deg,#f6f2eb 0 42%,#fff 42% 100%)!important;
}
.about-grid{
grid-template-columns:1fr!important;
gap:46px!important;
}
.portrait{
width:min(520px,100%);
margin-inline:auto;
}
.quote{
max-width:700px;
margin-inline:auto;
}
.about-copy{
max-width:760px;
margin-inline:auto;
}
.pautas-grid{
grid-template-columns:1fr!important;
}
.cards{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:18px!important;
}
.card-media{
height:250px!important;
}
.feature-grid{
grid-template-columns:1fr!important;
}
.feature-photo{
min-height:440px!important;
}
.feature-copy{
padding:52px 40px!important;
}
.number-grid{
grid-template-columns:1fr auto!important;
gap:18px 28px!important;
}
.number-grid .band-copy{grid-column:1}
.number-grid .num{grid-column:2;grid-row:1 / 3}
.number-grid > div:nth-child(3){grid-column:1}
.number-grid .btn{
grid-column:1 / -1!important;
justify-self:start;
}
.footer-main{
grid-template-columns:1fr 1fr!important;
}
.footer-brand{
grid-column:1 / -1;
}
.footer-cta{
grid-column:1 / -1;
}
}
/* Mobile */
@media (max-width:700px){
:root{
--radius:18px;
--radius-sm:14px;
}
.container{
width:calc(100% - 28px)!important;
}
.section{
padding:68px 0!important;
}
.nav{
height:70px!important;
}
.brand-logo img{
height:43px!important;
max-width:178px;
}
.menu{
top:80px!important;
left:14px!important;
right:14px!important;
}
.hero{
padding-top:70px!important;
}
.hero-copy{
padding:44px 0 10px!important;
}
.hero-copy .eyebrow{
font-size:.69rem;
letter-spacing:.13em;
}
.display{
font-size:clamp(2.85rem,13.5vw,4.25rem)!important;
line-height:.92!important;
margin:14px 0 20px!important;
max-width:100%;
}
.hero-copy p{
font-size:1rem!important;
line-height:1.58!important;
}
.hero-actions{
display:grid!important;
grid-template-columns:1fr!important;
gap:10px!important;
margin-top:22px!important;
}
.hero-actions .btn{
width:100%;
min-height:50px;
justify-content:center;
text-align:center;
padding:13px 16px;
}
.hero-tags{
gap:7px!important;
margin-top:22px!important;
}
.hero-tags span{
padding:8px 10px!important;
font-size:.66rem!important;
letter-spacing:.06em!important;
}
.hero-media{
min-height:455px!important;
margin-top:2px!important;
}
.candidate{
width:112%!important;
max-width:none!important;
height:500px!important;
margin-left:-6%!important;
margin-bottom:-26px!important;
}
.candidate img{
transform:translateY(12px)!important;
}
.side-note{
top:32px!important;
right:0!important;
width:145px!important;
padding:11px!important;
border-radius:15px!important;
}
.side-note small{
font-size:.57rem!important;
}
.side-note strong{
font-size:.95rem!important;
}
.hero-monument{
width:82%!important;
right:-10%!important;
bottom:58px!important;
opacity:.55!important;
}
.hero-orbit-a{
width:125px!important;
height:125px!important;
right:-35px!important;
top:125px!important;
}
.axes{
box-shadow:0 -10px 30px rgba(3,30,56,.07)!important;
}
.axes-grid{
margin-inline:-14px;
padding-inline:14px;
grid-template-columns:repeat(5,78vw)!important;
gap:12px;
}
.axis{
min-width:0!important;
padding:28px 20px 30px!important;
border:1px solid #e6ebef!important;
border-radius:18px!important;
background:#fff!important;
box-shadow:0 10px 24px rgba(7,29,50,.05);
}
.axis .ico{
width:58px!important;
height:58px!important;
}
.profile-strip{
padding:4px 0;
}
.profile-grid{
padding:24px 0!important;
}
.profile-person{
align-items:center!important;
}
.profile-avatar{
width:76px!important;
height:76px!important;
}
.profile-title b{
font-size:1.18rem!important;
}
.profile-title span{
font-size:.86rem!important;
line-height:1.35;
}
.social-kicker{
font-size:.68rem!important;
}
.social-links{
width:100%!important;
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:10px!important;
}
.social-links a{
min-width:0;
justify-content:center!important;
padding:11px 10px!important;
font-size:.81rem!important;
}
.social-links .social-primary{
grid-column:1 / -1!important;
}
.about{
background:linear-gradient(180deg,#f6f2eb 0 39%,#fff 39% 100%)!important;
}
.portrait{
min-height:395px!important;
padding:14px 8px 0!important;
border-radius:22px!important;
}
.portrait img{
height:365px!important;
}
.quote{
font-size:1.05rem!important;
line-height:1.5!important;
padding-left:14px!important;
}
.about-copy .title{
font-size:2.65rem!important;
}
.about-copy .lead{
font-size:1.03rem!important;
}
.bio-badges{
gap:8px!important;
}
.bio-badges span{
font-size:.72rem!important;
padding:8px 10px!important;
}
.credentials{
grid-template-columns:1fr!important;
}
.cred{
padding:17px!important;
}
.pautas-intro{
font-size:.95rem;
}
.pauta-card{
padding:22px!important;
}
.section-head{
gap:12px!important;
margin-bottom:24px!important;
}
.section-head .title{
font-size:2.55rem!important;
}
.section-head p{
font-size:.94rem;
}
.cards{
display:flex!important;
overflow-x:auto!important;
scroll-snap-type:x mandatory!important;
gap:14px!important;
margin-right:-14px!important;
padding:0 14px 12px 0!important;
scrollbar-width:none;
}
.cards::-webkit-scrollbar{display:none}
.card{
min-width:84vw!important;
max-width:84vw!important;
scroll-snap-align:start!important;
border-radius:20px!important;
}
.card-media{
height:235px!important;
}
.card-body{
padding:18px 18px 20px!important;
}
.feature-photo{
min-height:310px!important;
}
.feature-photo img{
object-position:center 38%!important;
}
.feature-copy{
padding:38px 22px 42px!important;
}
.feature-copy strong{
font-size:2.9rem!important;
}
.number-band{
padding:34px 0!important;
}
.number-grid{
grid-template-columns:1fr!important;
gap:18px!important;
text-align:left;
}
.number-grid .band-copy,
.number-grid .num,
.number-grid > div:nth-child(3),
.number-grid .btn{
grid-column:auto!important;
grid-row:auto!important;
}
.num{
font-size:4.8rem!important;
}
.number-grid .btn{
width:100%;
justify-content:center;
}
.footer-main{
grid-template-columns:1fr!important;
gap:32px!important;
padding:46px 0 30px!important;
}
.footer-brand .brand-logo.footer img{
height:64px!important;
}
.footer-links-col{
padding-top:4px;
}
.footer-cta{
display:block!important;
padding:22px!important;
}
.footer-cta .footer-contact-btn{
width:100%;
justify-content:center;
margin-top:16px;
}
.footer-bottom{
flex-direction:column!important;
gap:8px!important;
padding:20px 0 26px!important;
}
.whats-fixed{
width:54px!important;
height:54px!important;
right:14px!important;
bottom:14px!important;
padding:9px!important;
}
.whats-fixed .wa-float-icon{
width:30px!important;
height:30px!important;
}
}
/* Very small mobile */
@media (max-width:430px){
.container{
width:calc(100% - 24px)!important;
}
.brand-logo img{
height:40px!important;
max-width:164px;
}
.menu-toggle{
width:43px;
height:43px;
}
.display{
font-size:clamp(2.55rem,13vw,3.55rem)!important;
}
.hero-copy p{
font-size:.95rem!important;
}
.hero-tags span{
font-size:.62rem!important;
padding:7px 9px!important;
}
.hero-media{
min-height:420px!important;
}
.candidate{
width:118%!important;
height:460px!important;
margin-left:-9%!important;
}
.side-note{
width:132px!important;
}
.axes-grid{
grid-template-columns:repeat(5,84vw)!important;
}
.profile-person{
align-items:flex-start!important;
}
.social-links{
grid-template-columns:1fr!important;
}
.social-links .social-primary{
grid-column:auto!important;
}
.about-copy .title,
.section-head .title{
font-size:2.25rem!important;
}
.portrait{
min-height:350px!important;
}
.portrait img{
height:330px!important;
}
.card{
min-width:88vw!important;
max-width:88vw!important;
}
.card-media{
height:215px!important;
}
.feature-photo{
min-height:280px!important;
}
.feature-copy strong{
font-size:2.45rem!important;
}
.num{
font-size:4.15rem!important;
}
}
/* Landscape phones */
@media (max-height:540px) and (orientation:landscape) and (max-width:980px){
.hero-copy{
padding-top:34px!important;
}
.hero-media{
min-height:430px!important;
}
.candidate{
height:455px!important;
}
.menu{
max-height:calc(100vh - 96px);
overflow:auto;
}
}
/* Touch devices: avoid hover-only feedback */
@media (hover:none){
.card:hover,
.axis:hover,
.action:hover,
.social-links a:hover,
.btn:hover{
transform:none!important;
}
}
/* Proteções de interface: dificultam cópia casual, não tornam o código invisível */
html, body, img, a, div, section, article, header, footer, main, span, p, h1, h2, h3, h4, h5, h6 {
-webkit-user-drag:none;
}
body.security-lock {
-webkit-user-select:none;
-moz-user-select:none;
user-select:none;
}
input, textarea, [contenteditable="true"] {
-webkit-user-select:text;
-moz-user-select:text;
user-select:text;
}
/* Correção definitiva das imagens das propostas */
#propostas .card-media{
display:block !important;
min-height:230px !important;
background-color:#e9edf1 !important;
background-size:cover !important;
background-repeat:no-repeat !important;
background-position:center center !important;
}
#propostas .card-media:after{
display:none !important;
content:none !important;
}
#pautas{
scroll-margin-top:90px;
}
#propostas,
#quem-e,
#inicio{
scroll-margin-top:90px;
}
/* Remove o texto placeholder sobre a imagem de destaque */
.feature-photo::after,
.feature-photo:after{
display:none !important;
content:none !important;
}
/* WordPress admin bar compatibility */
.admin-bar .header { top: 32px; }
@media (max-width: 782px) {
.admin-bar .header { top: 46px; }
}
/* =========================================================
ÍCONES SVG OFICIAIS/BRAND — atualização final
========================================================= */
.brand-svg,
.footer-brand-svg{
display:block;
width:100%;
height:100%;
object-fit:contain;
}
/* Faixa de redes */
.social-links a .sicon{
width:30px !important;
height:30px !important;
border-radius:50%;
display:grid !important;
place-items:center !important;
padding:7px;
color:#fff !important;
flex:0 0 auto;
}
.social-links a .sicon .brand-svg{
width:100%;
height:100%;
color:#fff;
}
.social-links a.instagram .sicon{
background:linear-gradient(135deg,#feda75 0%,#fa7e1e 27%,#d62976 53%,#962fbf 77%,#4f5bd5 100%) !important;
}
.social-links a.facebook .sicon{
background:#1877F2 !important;
}
.social-links a.linkedin .sicon{
background:#0A66C2 !important;
}
.social-links a.whatsapp .sicon{
background:#fff !important;
color:#25D366 !important;
}
.social-links a.whatsapp .sicon .brand-svg{
color:#25D366 !important;
}
.social-links .social-primary{
background:#25D366 !important;
color:#fff !important;
}
/* Rodapé */
.footer-social a{
color:#fff !important;
}
.footer-social .footer-brand-svg{
width:18px;
height:18px;
color:#fff;
}
.footer-social .footer-wa{
color:#fff !important;
}
.footer-social .footer-wa .footer-brand-svg{
width:19px;
height:19px;
color:#fff;
}
/* CTA WhatsApp no rodapé */
.footer-contact-btn .btn-wa-icon{
width:31px !important;
height:31px !important;
padding:6px !important;
border-radius:50%;
background:#fff !important;
color:#25D366 !important;
}
.footer-contact-btn .btn-wa-icon .brand-svg{
color:#25D366 !important;
}
/* Botão flutuante */
.whats-fixed .wa-float-icon{
width:30px !important;
height:30px !important;
display:grid !important;
place-items:center !important;
color:#fff !important;
}
.whats-fixed .wa-float-icon .brand-svg{
color:#fff !important;
}
/* =========================================================
V4 — correção definitiva dos ícones sociais
========================================================= */
/* SVGs carregados como ![]()
não herdam currentColor.
Aplicamos máscara CSS usando os próprios SVGs para garantir
cor correta em qualquer fundo. */
.social-links .sicon,
.footer-social a,
.footer-contact-btn .btn-wa-icon,
.whats-fixed .wa-float-icon{
position:relative;
overflow:hidden;
}
/* Esconde o ![]()
original para evitar círculo branco/vazio */
.social-links .sicon img,
.footer-social a img,
.footer-contact-btn .btn-wa-icon img,
.whats-fixed .wa-float-icon img{
display:none !important;
}
/* Ícones superiores */
.social-links a .sicon::before{
content:"";
width:16px;
height:16px;
display:block;
background:#fff;
-webkit-mask-repeat:no-repeat;
-webkit-mask-position:center;
-webkit-mask-size:contain;
mask-repeat:no-repeat;
mask-position:center;
mask-size:contain;
}
.social-links a.instagram .sicon::before{
-webkit-mask-image:url('../icons/instagram.svg');
mask-image:url('../icons/instagram.svg');
}
.social-links a.facebook .sicon::before{
-webkit-mask-image:url('../icons/facebook.svg');
mask-image:url('../icons/facebook.svg');
}
.social-links a.linkedin .sicon::before{
-webkit-mask-image:url('../icons/linkedin.svg');
mask-image:url('../icons/linkedin.svg');
}
.social-links a.whatsapp .sicon::before{
-webkit-mask-image:url('../icons/whatsapp.svg');
mask-image:url('../icons/whatsapp.svg');
background:#25D366;
}
/* WhatsApp superior: círculo branco com ícone verde */
.social-links a.whatsapp .sicon{
background:#fff !important;
}
/* Rodapé */
.footer-social a::before{
content:"";
width:17px;
height:17px;
display:block;
background:#fff;
-webkit-mask-repeat:no-repeat;
-webkit-mask-position:center;
-webkit-mask-size:contain;
mask-repeat:no-repeat;
mask-position:center;
mask-size:contain;
}
.footer-social a[aria-label="Instagram"]::before{
-webkit-mask-image:url('../icons/instagram.svg');
mask-image:url('../icons/instagram.svg');
}
.footer-social a[aria-label="Facebook"]::before{
-webkit-mask-image:url('../icons/facebook.svg');
mask-image:url('../icons/facebook.svg');
}
.footer-social a[aria-label="LinkedIn"]::before{
-webkit-mask-image:url('../icons/linkedin.svg');
mask-image:url('../icons/linkedin.svg');
}
.footer-social a[aria-label="WhatsApp"]::before{
-webkit-mask-image:url('../icons/whatsapp.svg');
mask-image:url('../icons/whatsapp.svg');
}
.footer-social .footer-wa{
background:#25D366 !important;
border-color:#25D366 !important;
}
/* CTA WhatsApp do rodapé */
.footer-contact-btn .btn-wa-icon::before{
content:"";
width:17px;
height:17px;
display:block;
background:#25D366;
-webkit-mask:url('../icons/whatsapp.svg') center/contain no-repeat;
mask:url('../icons/whatsapp.svg') center/contain no-repeat;
}
/* Botão flutuante */
.whats-fixed .wa-float-icon::before{
content:"";
width:28px;
height:28px;
display:block;
background:#fff;
-webkit-mask:url('../icons/whatsapp.svg') center/contain no-repeat;
mask:url('../icons/whatsapp.svg') center/contain no-repeat;
}
/* garante centragem */
.social-links .sicon,
.footer-social a,
.footer-contact-btn .btn-wa-icon,
.whats-fixed .wa-float-icon{
display:grid !important;
place-items:center !important;
}
/* V5 — rodapé inferior simplificado */
.footer-bottom.footer-bottom-single{
justify-content:flex-end !important;
text-align:right;
}
@media (max-width:700px){
.footer-bottom.footer-bottom-single{
justify-content:center !important;
text-align:center;
}
}
/* V7 — credenciais ampliadas */
.credentials{
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.credentials .cred:last-child{
grid-column:1 / -1;
}
@media (max-width:700px){
.credentials{
grid-template-columns:1fr !important;
}
.credentials .cred:last-child{
grid-column:auto;
}
}
/* =========================================================
V11 — separação Pautas x Propostas + modais
========================================================= */
.pautas-section{
background:
radial-gradient(circle at 86% 14%,rgba(255,90,10,.10),transparent 24%),
linear-gradient(135deg,#071d32,#0a3559);
color:#fff;
}
.pautas-head p{
color:rgba(255,255,255,.70);
}
.pautas-grid-five{
grid-template-columns:repeat(5,minmax(0,1fr)) !important;
}
.pauta-card{
min-height:230px;
}
.pauta-index{
display:block;
color:var(--orange);
font-size:.72rem;
font-weight:950;
letter-spacing:.14em;
margin-bottom:26px;
}
.pauta-card h3{
font-size:1.05rem;
}
.pauta-card p{
line-height:1.55;
}
.proposal-cards .card-body{
display:flex;
flex-direction:column;
min-height:220px;
}
.proposal-cards .card-body p{
flex:1;
}
.proposal-more{
appearance:none;
border:0;
background:transparent;
padding:12px 0 0;
color:var(--orange);
font:inherit;
font-size:.83rem;
font-weight:950;
cursor:pointer;
display:inline-flex;
align-items:center;
gap:8px;
align-self:flex-start;
}
.proposal-more span{
transition:transform .2s ease;
}
.proposal-more:hover span{
transform:translateX(4px);
}
/* Modal */
.proposal-modal{
position:fixed;
inset:0;
z-index:99999;
display:flex;
align-items:center;
justify-content:center;
padding:24px;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:.22s ease;
}
.proposal-modal.is-open{
opacity:1;
visibility:visible;
pointer-events:auto;
}
.proposal-modal-backdrop{
position:absolute;
inset:0;
background:rgba(1,16,31,.78);
backdrop-filter:blur(10px);
}
.proposal-modal-dialog{
position:relative;
z-index:2;
width:min(860px,100%);
max-height:min(820px,calc(100vh - 48px));
overflow:auto;
border-radius:28px;
background:
radial-gradient(circle at 100% 0,rgba(255,90,10,.08),transparent 28%),
#fff;
color:var(--ink);
padding:44px;
box-shadow:0 35px 100px rgba(0,0,0,.34);
transform:translateY(12px) scale(.985);
transition:.22s ease;
}
.proposal-modal.is-open .proposal-modal-dialog{
transform:none;
}
.proposal-modal-close{
position:absolute;
right:18px;
top:18px;
width:42px;
height:42px;
border-radius:50%;
border:1px solid #dfe5ea;
background:#fff;
color:var(--navy);
font-size:1.65rem;
line-height:1;
cursor:pointer;
}
.proposal-modal-kicker{
color:var(--orange);
text-transform:uppercase;
letter-spacing:.14em;
font-size:.76rem;
font-weight:950;
margin-bottom:10px;
}
.proposal-modal-dialog h2{
margin:0;
max-width:700px;
font-size:clamp(2rem,4vw,3.25rem);
line-height:1;
letter-spacing:-.04em;
color:var(--navy);
}
.proposal-modal-lead{
max-width:720px;
margin:20px 0 30px;
color:#506174;
font-size:1.05rem;
line-height:1.65;
}
.proposal-modal-grid{
display:grid;
grid-template-columns:1.1fr .9fr;
gap:24px;
}
.proposal-modal-grid h3{
color:var(--navy);
margin:0 0 14px;
}
.proposal-modal-grid ul{
margin:0;
padding-left:20px;
}
.proposal-modal-grid li{
margin:0 0 10px;
color:#536476;
line-height:1.55;
}
.proposal-modal-highlight{
border-radius:20px;
padding:24px;
background:linear-gradient(145deg,#041f38,#0a3559);
color:#fff;
align-self:start;
}
.proposal-modal-highlight span{
display:block;
color:#ff8a4a;
text-transform:uppercase;
letter-spacing:.12em;
font-size:.69rem;
font-weight:900;
margin-bottom:10px;
}
.proposal-modal-highlight strong{
display:block;
font-size:1.25rem;
line-height:1.15;
margin-bottom:10px;
}
.proposal-modal-highlight p{
color:rgba(255,255,255,.72);
margin:0;
line-height:1.6;
}
.proposal-modal-note{
margin:26px 0 0;
padding-top:18px;
border-top:1px solid #e8edf1;
color:#84909d;
font-size:.77rem;
line-height:1.5;
}
body.modal-open{
overflow:hidden;
}
@media (max-width:1180px){
.pautas-grid-five{
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
}
@media (max-width:800px){
.pautas-grid-five{
grid-template-columns:1fr !important;
}
.pauta-card{
min-height:auto;
}
.proposal-modal{
padding:14px;
align-items:flex-end;
}
.proposal-modal-dialog{
width:100%;
max-height:88vh;
border-radius:24px 24px 18px 18px;
padding:34px 22px 26px;
}
.proposal-modal-grid{
grid-template-columns:1fr;
}
.proposal-modal-close{
right:14px;
top:14px;
}
}
.campaign-slogan{
display:inline-flex;align-items:center;
margin:4px 0 2px;padding:10px 14px 10px 16px;
border-left:4px solid var(--orange);border-radius:0 12px 12px 0;
background:rgba(255,255,255,.055);color:#fff;
font-size:1rem;font-weight:850;letter-spacing:-.01em;
}
.band-slogan strong{display:block;max-width:330px;font-size:1.18rem;line-height:1.35;color:#fff}
.band-slogan strong::after{content:"";display:block;width:54px;height:3px;margin-top:12px;border-radius:999px;background:var(--orange)}
.footer-slogan{margin-top:14px;color:#fff;font-size:1rem;font-weight:900;line-height:1.35;max-width:420px}
.footer-brand .footer-slogan + p{margin-top:10px}
@media (max-width:700px){
.campaign-slogan{width:100%;font-size:.93rem;line-height:1.4;padding:10px 12px 10px 14px}
.band-slogan strong{max-width:none;font-size:1.05rem}
.footer-slogan{font-size:.95rem}
}
/* V13 mobile */
@media (max-width:700px){
.display{
font-size:clamp(2.45rem,11.6vw,3.45rem) !important;
line-height:.93 !important;
letter-spacing:-.055em !important;
}
.hero-copy{padding-top:38px !important;}
.hero-actions{
display:grid !important;
grid-template-columns:1fr 1fr !important;
gap:10px !important;
}
.hero-actions .btn{
width:100% !important;
min-height:48px !important;
padding:11px 9px !important;
font-size:.72rem !important;
line-height:1.15 !important;
white-space:normal !important;
text-align:center !important;
}
.hero-tags{
display:flex !important;
flex-wrap:nowrap !important;
gap:7px !important;
overflow-x:auto !important;
scrollbar-width:none !important;
-webkit-overflow-scrolling:touch !important;
padding:2px 14px 6px 0 !important;
margin-right:-14px !important;
}
.hero-tags::-webkit-scrollbar{display:none}
.hero-tags span{
flex:0 0 auto !important;
white-space:nowrap !important;
font-size:.62rem !important;
padding:7px 9px !important;
}
.hero-media{
min-height:430px !important;
margin-bottom:-38px !important;
z-index:1 !important;
}
.candidate{
height:472px !important;
margin-bottom:-18px !important;
}
.axes{
position:relative !important;
z-index:5 !important;
margin-top:0 !important;
padding-top:0 !important;
background:transparent !important;
box-shadow:none !important;
}
.axes .container{
width:100% !important;
padding-left:14px !important;
padding-right:0 !important;
}
.axes-grid{
display:flex !important;
gap:12px !important;
overflow-x:auto !important;
scroll-snap-type:x mandatory !important;
scrollbar-width:none !important;
padding:0 16vw 14px 0 !important;
margin:0 !important;
transform:translateY(-22px) !important;
}
.axes-grid::-webkit-scrollbar{display:none}
.axis{
flex:0 0 76vw !important;
max-width:76vw !important;
min-width:76vw !important;
scroll-snap-align:start !important;
padding:24px 18px 26px !important;
border-radius:20px !important;
border:1px solid #e5e9ee !important;
background:#fff !important;
box-shadow:0 16px 34px rgba(7,29,50,.11) !important;
overflow:hidden !important;
}
.axes::after,.axes-grid::after{
display:none !important;
content:none !important;
}
.profile-grid{padding-top:12px !important;}
.profile-actions{width:100% !important;}
.social-links{
display:grid !important;
grid-template-columns:1fr 1fr !important;
gap:10px !important;
width:100% !important;
}
.social-links a,
.social-links .social-primary,
.social-links a.whatsapp.social-primary{
grid-column:auto !important;
width:100% !important;
min-height:52px !important;
padding:11px 12px !important;
justify-content:center !important;
border-radius:999px !important;
font-size:.82rem !important;
}
.whats-fixed{
right:12px !important;
bottom:12px !important;
width:52px !important;
height:52px !important;
}
}
@media (max-width:430px){
.display{
font-size:clamp(2.28rem,11.2vw,3.05rem) !important;
}
.hero-actions .btn{
font-size:.68rem !important;
padding-inline:7px !important;
}
.axis{
flex-basis:80vw !important;
min-width:80vw !important;
max-width:80vw !important;
}
.axes-grid{
padding-right:18vw !important;
}
}
/* V14 — copyright + crédito UPJA */
.footer-bottom.footer-bottom-credit{
justify-content:space-between !important;
align-items:center;
text-align:left;
}
.footer-bottom.footer-bottom-credit a{
color:#ff8a4a;
font-weight:900;
text-decoration:none;
}
.footer-bottom.footer-bottom-credit a:hover{
color:#fff;
}
@media (max-width:700px){
.footer-bottom.footer-bottom-credit{
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
text-align:center !important;
gap:6px !important;
}
}
/* V15 — cards mobile realmente sobrepostos à foto */
@media (max-width:700px){
.hero-media{
overflow:visible !important;
margin-bottom:-86px !important;
}
.candidate{
position:relative !important;
z-index:1 !important;
height:472px !important;
}
.axes{
position:relative !important;
z-index:20 !important;
margin-top:-64px !important;
padding-top:0 !important;
background:transparent !important;
}
.axes .container{
position:relative !important;
z-index:20 !important;
margin-top:0 !important;
}
.axes-grid{
position:relative !important;
z-index:20 !important;
transform:none !important;
margin-top:0 !important;
padding-top:0 !important;
}
.axis{
box-shadow:0 18px 36px rgba(7,29,50,.16) !important;
}
}
@media (max-width:430px){
.hero-media{
margin-bottom:-94px !important;
}
.axes{
margin-top:-72px !important;
}
}
/* =========================================================
V16 — refinamento menu desktop + faixa mobile de experiência
========================================================= */
/* Desktop: menu maior e CTA menor */
@media (min-width:981px){
.menu{
gap:34px !important;
font-size:1rem !important;
font-weight:850 !important;
}
.menu a{
padding:29px 0 26px !important;
letter-spacing:-.01em;
}
.header > .container > .btn{
padding:12px 18px !important;
min-height:46px !important;
font-size:.82rem !important;
border-radius:12px !important;
box-shadow:0 8px 18px rgba(255,90,10,.18) !important;
}
.nav{
gap:26px !important;
}
}
/* Faixa "Experiência..." no mobile: vira chips elegantes e roláveis */
@media (max-width:700px){
/* seleciona a faixa clara logo antes da seção de pautas */
section[style*="background:#fff"][style*="padding:26px"]{
padding:16px 0 !important;
overflow:hidden !important;
border-top:1px solid #e8edf1 !important;
border-bottom:1px solid #e8edf1 !important;
background:linear-gradient(180deg,#fff,#f7f9fb) !important;
}
section[style*="background:#fff"][style*="padding:26px"] > .container{
width:100% !important;
display:flex !important;
flex-wrap:nowrap !important;
justify-content:flex-start !important;
align-items:center !important;
gap:10px !important;
overflow-x:auto !important;
padding:0 14px 4px !important;
margin:0 !important;
scrollbar-width:none !important;
-webkit-overflow-scrolling:touch !important;
text-transform:none !important;
letter-spacing:0 !important;
}
section[style*="background:#fff"][style*="padding:26px"] > .container::-webkit-scrollbar{
display:none !important;
}
section[style*="background:#fff"][style*="padding:26px"] > .container > span{
flex:0 0 auto !important;
white-space:nowrap !important;
display:inline-flex !important;
align-items:center !important;
min-height:40px !important;
padding:9px 14px !important;
border-radius:999px !important;
border:1px solid #dfe6ec !important;
background:#fff !important;
color:#173754 !important;
font-size:.76rem !important;
font-weight:850 !important;
box-shadow:0 7px 18px rgba(7,29,50,.05) !important;
}
/* remove os pontos laranja isolados entre os itens */
section[style*="background:#fff"][style*="padding:26px"] > .container > span[style*="color:var(--orange)"]{
display:none !important;
}
}
/* Mobile muito pequeno */
@media (max-width:430px){
section[style*="background:#fff"][style*="padding:26px"] > .container > span{
font-size:.72rem !important;
padding:8px 12px !important;
min-height:38px !important;
}
}