@font-face{font-family:'Work Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/worksans-400.woff2') format('woff2')}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/worksans-600.woff2') format('woff2')}
:root{--navy:#03275C;--blue:#064392;--blue-vivid:#0687DF;--cyan:#00AEEF;--green:#0B9A40;--green-light:#58C046;--surface:#FFFFFF;--paper:#F4FAFB;--ink:#102A43;--muted:#4d6478;--line:#DCEFF2;--green-tint:#e6f5ea;--radius:12px;--radius-sm:6px;--shadow:0 12px 36px #03275c0a;--container:1200px;--font-display:'Work Sans',Arial,sans-serif;--font-body:'Work Sans',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--surface);color:var(--ink);font:400 16px/1.65 var(--font-body);-webkit-font-smoothing:antialiased}img{display:block;max-width:100%}a{color:inherit}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}:focus-visible{outline:3px solid var(--blue-vivid);outline-offset:5px}.sr-only,.file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:10px;left:10px;transform:translateY(-180%);z-index:1100;background:white;color:var(--navy);padding:12px}.skip-link:focus{transform:none}.container{width:min(calc(100% - 80px),var(--container));margin-inline:auto}h1,h2,h3,p{overflow-wrap:break-word}h1,h2,h3{color:var(--navy)}
/* Compact institutional masthead. */
.site-header{position:sticky;top:0;z-index:100;background:var(--navy);color:white}.header-inner{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-number{font:600 56px/.9 var(--font-display);letter-spacing:-5px;color:var(--green-light);padding-right:5px}.brand-copy{display:grid;line-height:1.3}.brand-copy strong{font-size:17px;letter-spacing:1px}.brand-copy small{font-size:11px}.main-nav{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:600}.main-nav a{text-decoration:none;padding-block:10px}.main-nav a:hover{color:var(--cyan)}.main-nav .nav-cta{border:1px solid #ffffff60;padding:10px 18px;border-radius:5px}.menu-toggle{display:none;width:44px;height:44px;border:1px solid #ffffff60;border-radius:5px;background:transparent}.menu-toggle span[aria-hidden]{display:block;background:white;height:2px;width:20px;margin:4px auto}
/* Campaign lettering is the hero artwork; the photo frame belongs to the editor. */
.hero{overflow:hidden;background:white}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:center;padding-block:78px 86px;min-height:690px}.eyebrow,.section-kicker{font-size:12px;font-weight:600;letter-spacing:1.8px;text-transform:uppercase;margin:0 0 22px;color:var(--blue)}.hero .eyebrow{display:flex;align-items:center;gap:10px}.hero .eyebrow:before{content:'';height:8px;width:8px;background:var(--green);border-radius:50%}.hero-subject{font-size:23px;font-weight:600;margin:0 0 8px;color:var(--navy)}.hero h1{font-size:clamp(60px,6.4vw,88px);font-weight:600;line-height:1.02;letter-spacing:-5px;margin:0}.hero h1 span{color:var(--green)}.hero-lead{font-size:16px;max-width:530px;margin:26px 0;color:var(--muted)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-links{display:flex;gap:10px;flex-wrap:wrap;font-size:12px;margin-top:24px}.hero-links a{text-underline-offset:4px}.hero-art{align-self:stretch;display:flex;flex-direction:column;justify-content:center;position:relative}.campaign-mark{position:relative;background:var(--navy);border-radius:100px 12px 100px 12px;min-height:430px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;overflow:hidden}.campaign-mark:after{content:'';position:absolute;bottom:0;left:0;right:0;height:12px;background:linear-gradient(90deg,var(--green),var(--green-light))}.mark-label{font-size:22px;font-weight:600;letter-spacing:9px;padding-left:9px}.mark-number{font:600 285px/.94 var(--font-display);letter-spacing:-24px;padding-right:24px;color:white}.mark-caption{position:absolute;right:22px;bottom:28px;font-size:11px;line-height:1.4;letter-spacing:1px;font-weight:600}.campaign-location{display:flex;justify-content:space-between;font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;border-bottom:1px solid var(--line);padding:18px 2px;color:var(--blue)}
.btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 20px;border:1px solid transparent;border-radius:5px;font-size:13px;font-weight:600;line-height:1.5;text-decoration:none;transition:background .15s,color .15s}.btn-primary{background:var(--blue);color:white}.btn-primary:hover:not(:disabled){background:var(--navy)}.btn-secondary{background:white;border-color:var(--green);color:var(--navy)}.btn-secondary:hover{background:var(--green-tint)}.btn-ghost{background:white;border-color:var(--line);color:var(--navy)}.btn-light{background:white;color:var(--navy)}.btn-outline-light{border-color:#ffffff80;color:white;background:transparent}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-disabled{background:var(--paper);color:var(--muted)}
.section{padding-block:92px}.section-soft{background:var(--paper)}.section h2{font-size:clamp(30px,3.1vw,42px);line-height:1.17;font-weight:600;letter-spacing:-1.6px;margin:0}.section-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:100px;align-items:end;margin-bottom:44px}.section-heading>p{font-size:15px;color:var(--muted);margin:0;max-width:440px}.section-heading h2{max-width:560px}.manifesto{padding-block:48px;background:var(--navy);color:white}.manifesto-layout{display:grid;grid-template-columns:180px 1fr 1fr;gap:44px;align-items:start}.manifesto .section-kicker{color:var(--cyan);margin:6px 0}.manifesto h2{font-size:26px;line-height:1.3;letter-spacing:-.6px;color:white}.manifesto p:last-child{font-size:14px;line-height:1.8;margin:0;color:#ffffffcf}
/* Each subject is expandable, keeping the program scannable. */
.axes-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 48px}.axis-card{border-top:1px solid var(--line)}.axis-card summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer;padding:25px 0}.axis-card summary::-webkit-details-marker{display:none}.axis-card summary:after{content:'+';font-size:24px;color:var(--blue-vivid);line-height:1}.axis-card[open] summary:after{content:'−'}.axis-card h3{font-size:17px;font-weight:600;line-height:1.4;margin:0}.axis-card p{font-size:14px;color:var(--muted);margin:0;padding:0 36px 26px 0;max-width:510px}.axis-card[open] summary{padding-bottom:12px}.axis-card summary:hover h3{color:var(--blue)}
.quadro-group+.quadro-group{margin-top:48px}.quadro-heading{font-size:20px;letter-spacing:-.5px;margin:0}.quadro-subheading{color:var(--muted);font-size:13px;margin:4px 0 20px}.slate-heading{display:flex;gap:20px;align-items:center;font-size:12px;font-weight:600;color:var(--blue);margin:24px 0 18px}.slate-heading:after{content:'';height:1px;background:var(--line);flex:1}.members-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.member-card{display:flex;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line);min-width:0}.member-avatar,.member-photo{flex-shrink:0;width:64px;height:76px;border-radius:6px;object-fit:cover;background:var(--paper)}.member-avatar{display:grid;place-items:center;font-size:21px;font-weight:600;color:var(--blue);border-bottom:3px solid var(--green)}.member-body{min-width:0}.member-body h3{font-size:15px;line-height:1.4;font-weight:600;margin:0 0 6px}.member-category{font-size:10px;font-weight:600;color:var(--blue);margin:0 0 4px}.member-register{font-size:11px;color:var(--muted);margin:0}
.support-section{background:var(--paper)}.photo-maker{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.maker-preview{max-width:500px}.canvas-shell{padding:12px;border:1px solid var(--line);border-radius:12px;background:white}#support-canvas{display:block;width:100%;height:auto;touch-action:none;border-radius:5px}.drag-hint{text-align:center;color:var(--muted);font-size:12px;margin:14px 0 0}.maker-controls{display:grid;gap:24px}.control-card{padding:28px;background:white;border:1px solid var(--line);border-radius:12px}.upload-button{display:grid;grid-template-columns:42px 1fr;gap:0 12px;align-items:center;padding:20px;border:1px dashed var(--blue-vivid);border-radius:6px;background:var(--paper);cursor:pointer}.upload-button>span{grid-row:span 2;width:36px;height:36px;display:grid;place-items:center;background:var(--blue);color:white;border-radius:50%;font-size:14px}.upload-button strong{font-size:15px;color:var(--navy)}.upload-button small{font-size:12px;color:var(--muted)}.control-card:has(.file-input:focus-visible) .upload-button{outline:3px solid var(--blue-vivid);outline-offset:4px}.range-group{margin-top:24px}.range-group label{display:flex;justify-content:space-between;font-size:13px;font-weight:600;margin-bottom:10px}.range-group output{color:var(--blue)}.range-group input{width:100%;accent-color:var(--blue)}.maker-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.privacy-note{border-top:1px solid var(--line);margin-top:22px;padding-top:18px;font-size:12px;color:var(--muted)}.how-card{padding:0 8px}.how-card h3{font-size:16px;margin:0 0 12px}.how-card ol{padding-left:20px;margin:0;color:var(--muted);font-size:13px}.how-card li+li{margin-top:5px}.text-link{display:inline-block;color:var(--blue);font-size:13px;font-weight:600;margin-top:16px;text-underline-offset:4px}
#como-votar{background:white;padding-block:64px}.voting-box{display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center}.voting-box h2{font-size:32px}.voting-box .section-kicker{margin-bottom:12px}.voting-box p:last-child{max-width:700px;font-size:14px;color:var(--muted)}.voting-status{display:flex;align-items:center;gap:10px;border:1px solid var(--line);padding:14px 18px;border-radius:5px;white-space:nowrap}.voting-status span{height:7px;width:7px;border-radius:50%;background:var(--blue-vivid)}.final-cta{background:var(--blue);padding-block:64px;color:white}.final-cta-box{display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center}.final-cta .section-kicker{color:var(--line);margin-bottom:16px}.final-cta h2{color:white;max-width:620px;font-size:36px}.final-cta p:last-child{max-width:610px;font-size:14px;color:#ffffffd9;margin-bottom:0}.final-actions{display:flex;gap:12px;flex-direction:column}.site-footer{background:var(--navy);color:white;padding:34px 0}.footer-grid{display:flex;justify-content:space-between;align-items:center;gap:30px}.footer-grid strong{font-size:13px}.site-footer p{font-size:11px;color:#ffffffb8;margin:8px 0 0}.footer-links{display:flex;gap:18px;font-size:11px;flex-wrap:wrap}.footer-links a{text-underline-offset:4px}
@media(min-width:1500px){.hero-grid{min-height:740px}}
@media(max-width:1050px){.main-nav{gap:16px;font-size:12px}.hero-grid{gap:40px;min-height:610px;padding-block:60px}.hero h1{font-size:66px;letter-spacing:-3.5px}.campaign-mark{min-height:380px}.mark-number{font-size:240px}.manifesto-layout{grid-template-columns:1fr 1fr;gap:24px 40px}.manifesto .section-kicker{grid-column:1/-1}.section-heading{gap:50px}.photo-maker{gap:32px}.container{width:calc(100% - 48px)}.mark-caption{font-size:9px;right:14px}.maker-actions{grid-template-columns:1fr}}
@media(max-width:800px){html{scroll-padding-top:90px}.header-inner{min-height:72px}.brand-number{font-size:46px}.menu-toggle{display:block}.main-nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--navy);padding:16px 24px 24px;border-top:1px solid #ffffff30}.main-nav.is-open{display:grid;gap:4px}.main-nav a{padding:12px;font-size:14px}.main-nav .nav-cta{margin-top:8px;justify-self:start}.hero-grid{gap:28px;grid-template-columns:1.15fr .85fr;padding-block:48px}.hero h1{font-size:53px;letter-spacing:-3px}.hero-subject{font-size:19px}.hero-lead{font-size:14px}.hero-art{align-self:center}.campaign-mark{min-height:300px;border-radius:65px 8px}.mark-number{font-size:200px}.mark-label{font-size:15px}.mark-caption{display:none}.campaign-location{font-size:9px;gap:10px}.hero-actions{display:grid}.hero-links{font-size:11px}.section{padding-block:64px}.section-heading{gap:24px}.section h2{font-size:32px}.manifesto h2{font-size:25px}.section-heading>p{font-size:14px}.axes-grid{gap:0 28px}.axis-card h3{font-size:15px}.photo-maker{grid-template-columns:1fr 1fr;gap:24px}.control-card{padding:18px}.upload-button{padding:14px}.upload-button strong{font-size:13px}.voting-box,.final-cta-box{gap:28px}.final-cta h2{font-size:30px}.footer-grid{align-items:flex-start;flex-direction:column}.footer-links{font-size:12px}}
@media(max-width:600px){.container{width:calc(100% - 40px)}.hero-grid{grid-template-columns:1fr;gap:36px;padding-block:40px}.hero h1{font-size:64px;letter-spacing:-4px}.hero .eyebrow{font-size:10px;letter-spacing:1.3px;margin-bottom:24px}.hero-lead{font-size:15px}.hero-actions{grid-template-columns:1fr}.hero-links{font-size:11px;gap:8px}.hero-art{width:100%}.campaign-mark{min-height:230px;border-radius:50px 8px;flex-direction:row;gap:25px}.mark-label{font-size:22px;letter-spacing:6px}.mark-number{font-size:230px;letter-spacing:-18px;padding-right:18px}.campaign-location{font-size:10px;padding-block:13px}.manifesto-layout,.section-heading,.photo-maker,.voting-box,.final-cta-box{grid-template-columns:1fr;gap:24px}.manifesto-layout{gap:18px}.manifesto .section-kicker{grid-column:auto}.manifesto h2{font-size:26px}.section-kicker{font-size:10px;margin-bottom:14px}.section-heading{margin-bottom:28px}.section h2{font-size:31px;letter-spacing:-1px}.axes-grid{grid-template-columns:1fr}.axis-card summary{padding-block:22px}.axis-card h3{font-size:16px}.members-grid{grid-template-columns:1fr;gap:0}.member-card{padding-block:16px}.member-body h3{font-size:15px}.member-register{font-size:12px}.slate-heading{font-size:11px;gap:12px}.quadro-group+.quadro-group{margin-top:36px}.maker-preview{width:100%}.maker-actions{grid-template-columns:1fr 1fr}.maker-actions .btn{padding-inline:10px;font-size:12px}.control-card{padding:20px}.voting-status{justify-self:start;margin:0}.final-actions{flex-direction:row;flex-wrap:wrap}.final-actions .btn{flex:1}.footer-links{gap:16px}.site-footer{padding-block:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Interactive controls and responsive refinements. */
[hidden] { display: none !important; }
body { min-width: 0; }
main, section, .hero-grid > *, .photo-maker > *, .section-heading > * { min-width: 0; }
.hero-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
.photo-maker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.reading-progress { position: absolute; inset: auto 0 0; height: 3px; overflow: hidden; }
.reading-progress span { display: block; height: 100%; background: var(--cyan); transform: scaleX(0); transform-origin: left; }
.main-nav a { position: relative; }
.main-nav a[aria-current='location'] { color: var(--cyan); }
.main-nav a[aria-current='location']::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: var(--cyan); }
.btn { transition: background .18s ease, color .18s ease, box-shadow .18s ease; }
.btn:hover:not(:disabled) { box-shadow: 0 4px 12px #03275c15; }
.axis-card { transition: background .2s ease; }
.axis-card summary { transition: color .2s ease; }
.axis-card summary::after { flex: 0 0 26px; text-align: center; border-radius: 50%; transition: background .2s ease; }
.axis-card summary:hover::after { background: var(--line); }
.axis-card[open] h3 { color: var(--blue); }
.axis-card[open] p { animation: detail-enter .22s ease-out; }
@keyframes detail-enter { from { opacity: .3; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }
.member-tools { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); padding-bottom: 20px; }
.member-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-button { border: 1px solid transparent; background: var(--paper); color: var(--navy); padding: 11px 18px; border-radius: 6px; font-size: 13px; font-weight: 600; min-height: 44px; transition: background .18s ease, color .18s ease; }
.filter-button:hover { border-color: var(--blue); }
.filter-button[aria-pressed='true'] { color: white; background: var(--blue); }
.member-search { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 6px; padding: 0 14px; width: min(100%, 290px); min-height: 46px; }
.member-search:focus-within { border-color: var(--blue); outline: 2px solid var(--line); }
.member-search svg { width: 19px; height: 19px; flex: none; fill: none; stroke: var(--blue); stroke-width: 1.7; }
.member-search input { border: 0; outline: none; background: transparent; padding: 10px 0; width: 100%; min-width: 0; font-size: 16px; color: var(--ink); }
.member-search input::placeholder { color: var(--muted); }
.member-results { margin: 12px 0 28px; font-size: 12px; color: var(--muted); }
.member-empty { background: var(--paper); border-radius: 8px; padding: 28px; font-size: 14px; }
.member-card { transition: border-color .2s ease; }
.member-card:hover { border-color: var(--blue-vivid); }
#support-canvas { touch-action: pan-y; }
#support-canvas.has-photo { touch-action: none; cursor: grab; }
#support-canvas.has-photo:active { cursor: grabbing; }
.whatsapp-float { position: fixed; z-index: 90; right: max(24px, env(safe-area-inset-right)); bottom: max(24px, env(safe-area-inset-bottom)); display: flex; align-items: stretch; background: var(--green); color: white; border-radius: 36px; box-shadow: 0 5px 22px #03275c30; border: 2px solid white; touch-action: none; user-select: none; max-width: calc(100% - 32px); }
.whatsapp-float a { display: flex; align-items: center; gap: 10px; padding: 14px 8px 14px 16px; text-decoration: none; border-radius: 32px 0 0 32px; font-size: 14px; font-weight: 600; }
.whatsapp-float a > svg { width: 29px; height: 29px; fill: white; flex: none; }
.whatsapp-float a > span { text-shadow: 0 1px 2px #03275c50; }
.whatsapp-float a:hover { background: #03275c20; }
.whatsapp-move { display: grid; place-items: center; border: 0; border-left: 1px solid #ffffff50; border-radius: 0 32px 32px 0; background: transparent; color: white; padding: 0 8px 0 5px; min-width: 32px; cursor: grab; }
.whatsapp-move svg { width: 20px; height: 24px; fill: currentColor; }
.whatsapp-move:hover { background: #03275c20; }
.whatsapp-float.is-dragging, .whatsapp-float.is-dragging * { cursor: grabbing; }
.whatsapp-float.is-dragging { box-shadow: 0 10px 30px #03275c45; }
.back-to-top { position: fixed; z-index: 80; left: 24px; bottom: max(24px, env(safe-area-inset-bottom)); display: grid; place-items: center; width: 44px; height: 44px; color: var(--navy); background: white; border: 1px solid var(--line); border-radius: 50%; box-shadow: 0 4px 16px #03275c15; }
.back-to-top svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.back-to-top:hover { background: var(--paper); }
.site-footer { padding-bottom: 106px; }
@media (min-width: 801px) and (max-width: 1000px) {
  .main-nav { gap: 12px; }
  .main-nav .nav-cta { padding-inline: 12px; }
  .hero-grid { gap: 28px; }
}
@media (max-width: 800px) {
  .photo-maker { grid-template-columns: 1fr; }
  .maker-preview { width: 100%; margin-inline: auto; }
  .maker-controls { max-width: 580px; width: 100%; margin-inline: auto; }
  .maker-actions { grid-template-columns: 1fr 1fr; }
  .main-nav a[aria-current='location']::after { left: 12px; right: auto; width: 24px; }
  .member-tools { gap: 16px; align-items: stretch; flex-direction: column; }
  .member-search { width: 100%; }
}
@media (max-width: 600px) {
  .hero-grid { grid-template-columns: 1fr; min-height: 0; padding-block: 32px 40px; gap: 28px; }
  .hero h1 { font-size: clamp(48px, 13.5vw, 68px); letter-spacing: -.055em; }
  .hero .eyebrow { margin-bottom: 20px; }
  .hero-subject { font-size: 18px; }
  .hero-lead { margin-block: 22px; }
  .campaign-mark { min-height: 180px; border-radius: 40px 8px; gap: 30px; }
  .mark-number { font-size: 180px; }
  .mark-label { font-size: 18px; }
  .section { padding-block: 52px; }
  .manifesto { padding-block: 36px; }
  .member-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filter-button { padding-inline: 8px; font-size: 12px; }
  .member-empty { padding: 20px; }
  .whatsapp-float { right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); }
  .whatsapp-float a { padding: 12px; }
  .whatsapp-float a > span { display: none; }
  .whatsapp-move { min-width: 30px; padding-inline: 2px 6px; }
  .back-to-top { left: 16px; bottom: max(16px, env(safe-area-inset-bottom)); }
}
@media (max-width: 360px) {
  .container { width: calc(100% - 32px); }
  .hero-links { gap: 6px; font-size: 10px; }
  .member-card { gap: 12px; }
  .member-avatar, .member-photo { width: 52px; height: 64px; }
  .member-body h3 { font-size: 14px; }
  .maker-actions { grid-template-columns: 1fr; }
}

/* Expressive campaign typography and motion, with the original palette. */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../assets/fonts/outfit-latin-variable.woff2') format('woff2');
}
:root { --font-display: 'Outfit', 'Work Sans', sans-serif; }
h1, h2, h3, .brand-copy, .btn, .filter-button { font-family: var(--font-display); }
.section h2 { font-weight: 500; letter-spacing: -.025em; }
.section-kicker { letter-spacing: 1.3px; }
.section-heading > p { line-height: 1.8; }
.brand-copy strong { font-size: 19px; letter-spacing: .6px; }
.brand-copy small { font-size: 12px; }
.brand-number { font-weight: 600; }
.site-header { background: linear-gradient(110deg, var(--navy), var(--blue)); }
.main-nav { font-weight: 400; font-size: 14px; }
.main-nav .nav-cta { border-radius: 10px; }
.hero {
  position: relative;
  isolation: isolate;
  background: radial-gradient(ellipse at 92% 30%, #00aeef17, transparent 50%), radial-gradient(ellipse at 68% 100%, #58c04614, transparent 48%), var(--surface);
}
.hero::before {
  content: '';
  pointer-events: none;
  position: absolute;
  z-index: -1;
  width: 600px;
  height: 600px;
  top: -330px;
  right: -100px;
  border: 1px solid #0687df10;
  border-radius: 50%;
  box-shadow: 0 0 0 70px #00aeef05, 0 0 0 140px #00aeef04;
}
.hero-grid { min-height: 610px; gap: 76px; padding-block: 64px 28px; }
.hero .eyebrow {
  width: fit-content;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  border: 1px solid var(--line);
  border-radius: 30px;
  background: #ffffffc9;
  padding: 9px 14px;
  margin-bottom: 24px;
}
.hero-subject { font-family: var(--font-display); font-size: 26px; font-weight: 400; margin-bottom: 12px; }
.hero h1 { font-family: var(--font-display); font-size: clamp(58px, 6.1vw, 88px); font-weight: 500; line-height: 1.08; letter-spacing: -.045em; }
.hero h1 span { color: inherit; }
.type-layout { position: relative; display: block; }
.type-reserve { display: block; visibility: hidden; white-space: nowrap; }
.type-live { position: absolute; inset: 0; display: block; white-space: nowrap; }
.hero h1 #typed-second {
  color: var(--green);
  background: linear-gradient(100deg, var(--blue) 0%, var(--blue-vivid) 35%, var(--green) 90%);
  background-size: 160% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: text-gradient 8s ease-in-out infinite alternate;
}
.type-cursor { display: none; width: 3px; height: .8em; margin-left: 6px; vertical-align: -.025em; background: var(--blue-vivid); border-radius: 3px; }
.motion-ready .type-cursor { display: inline-block; animation: cursor-blink 1s step-end infinite; }
.hero-lead { max-width: 510px; font-size: 16px; line-height: 1.85; margin-block: 24px 28px; }
.btn { border-radius: 10px; font-size: 15px; font-weight: 500; min-height: 50px; padding-inline: 22px; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.btn-primary { background: linear-gradient(110deg, var(--blue), var(--blue-vivid)); box-shadow: 0 5px 15px #06439218; }
.btn-primary:hover:not(:disabled) { background: linear-gradient(110deg, var(--navy), var(--blue)); }
.btn:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 8px 20px #03275c1c; }
.btn-secondary { border-color: var(--line); background: #ffffffb3; color: var(--blue); }
.btn-secondary:hover { border-color: var(--green); background: white; }
.button-arrow { font: 400 20px/1 var(--font-body); transition: transform .2s ease; }
.btn:hover .button-arrow { transform: translate(2px, -2px); }
.hero-links { font-size: 12px; gap: 12px; margin-top: 22px; }
.hero-art { perspective: 1000px; padding-block: 12px; }
.campaign-mark {
  min-height: 410px;
  border-radius: 72px 24px 72px 24px;
  background: linear-gradient(135deg, var(--navy) 12%, var(--blue) 42%, var(--blue-vivid) 78%, var(--cyan));
  background-size: 160% 160%;
  box-shadow: 0 25px 55px -25px #06439280;
  transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));
  transition: transform .35s ease-out;
  animation: mark-float 6s ease-in-out infinite, mark-gradient 12s ease-in-out infinite alternate;
}
.campaign-mark::before { content: ''; position: absolute; width: 280px; height: 280px; top: -135px; right: -100px; border: 1px solid #ffffff24; border-radius: 50%; box-shadow: 0 0 0 38px #ffffff06, 0 0 0 76px #ffffff05; }
.campaign-mark::after { height: 80px; width: 140%; left: -15%; right: auto; bottom: -62px; border-radius: 50%; background: linear-gradient(90deg, var(--green), var(--green-light), var(--cyan)); transform: rotate(-8deg); }
.mark-label { position: relative; font-family: var(--font-display); font-size: 21px; font-weight: 400; letter-spacing: 10px; }
.mark-number { font-family: var(--font-display); font-weight: 600; font-size: 290px; line-height: .98; letter-spacing: -16px; padding-right: 16px; text-shadow: 0 8px 30px #03275c15; }
.mark-caption { z-index: 1; font-weight: 400; }
.campaign-location { position: relative; margin-top: 8px; font-weight: 400; letter-spacing: .5px; }
.hero-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 14px 30px; }
.explore-link { display: inline-flex; align-items: center; gap: 10px; color: var(--blue); font-size: 12px; text-decoration: none; }
.explore-link > span { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid var(--line); border-radius: 50%; font-size: 16px; transition: transform .2s ease; }
.explore-link:hover > span { transform: translateY(3px); }
.motion-toggle { display: inline-flex; align-items: center; gap: 6px; padding: 10px 0 10px 10px; min-height: 44px; border: 0; background: transparent; color: var(--muted); font-size: 11px; }
.motion-toggle:hover { color: var(--blue); }
.motion-toggle-icon { font-size: 14px; }
.manifesto { background: linear-gradient(115deg, var(--navy), var(--blue)); }
.manifesto h2 { font-size: 28px; font-weight: 400; line-height: 1.35; }
.axis-card h3 { font-size: 19px; font-weight: 500; }
.axis-card summary::after { border: 1px solid var(--line); font-size: 21px; }
.quadro-heading { font-size: 23px; font-weight: 500; }
.member-body h3 { font-size: 17px; font-weight: 500; }
.member-avatar { font-family: var(--font-display); font-weight: 400; background: linear-gradient(140deg, var(--paper), #dceff270); }
.how-card h3 { font-weight: 500; font-size: 19px; }
.final-cta { background: linear-gradient(115deg, var(--navy), var(--blue) 50%, var(--blue-vivid)); }
@keyframes cursor-blink { 0%, 45% { opacity: 1; } 50%, 95% { opacity: 0; } }
@keyframes text-gradient { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
@keyframes mark-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
@keyframes mark-gradient { from { background-position: 0% 0%; } to { background-position: 100% 100%; } }
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation-play-state: paused !important; transition: none !important; }
.motion-paused .type-cursor, .motion-reduced .type-cursor { display: none; }
.hero.is-offscreen .campaign-mark, .hero.is-offscreen #typed-second, .hero.is-offscreen .type-cursor { animation-play-state: paused; }
@media (max-width: 1100px) {
  .hero-grid { gap: 38px; min-height: 580px; padding-top: 50px; }
  .hero h1 { font-size: clamp(53px, 6.5vw, 74px); }
  .hero-subject { font-size: 23px; }
  .campaign-mark { min-height: 360px; }
  .mark-number { font-size: 245px; }
  .hero-actions { gap: 10px; }
  .hero-actions .btn { padding-inline: 16px; font-size: 14px; }
  .main-nav { font-size: 13px; }
}
@media (max-width: 800px) {
  .hero-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 28px; min-height: 520px; padding-top: 36px; }
  .hero h1 { font-size: clamp(43px, 6.8vw, 55px); }
  .hero-subject { font-size: 21px; }
  .hero .eyebrow { padding: 7px 10px; font-size: 9px; }
  .hero-lead { font-size: 14px; line-height: 1.8; }
  .hero-links { font-size: 11px; gap: 8px; }
  .campaign-mark { min-height: 300px; border-radius: 50px 18px; }
  .mark-number { font-size: 210px; }
  .mark-label { font-size: 16px; letter-spacing: 7px; }
  .hero-bottom { padding-bottom: 22px; }
}
@media (max-width: 600px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 30px; padding-block: 28px 14px; }
  .hero h1 { font-size: clamp(48px, 12.9vw, 72px); font-weight: 500; letter-spacing: -.04em; }
  .hero .eyebrow { font-size: 10px; margin-bottom: 20px; }
  .hero-subject { font-size: 23px; margin-bottom: 10px; }
  .hero-lead { font-size: 15px; margin-block: 20px 24px; }
  .hero-actions .btn { font-size: 15px; padding-inline: 22px; }
  .hero-links { margin-top: 20px; font-size: 11px; }
  .hero-art { padding: 8px 0 0; }
  .campaign-mark { min-height: 200px; gap: 34px; border-radius: 44px 16px; }
  .mark-number { font-size: 200px; }
  .mark-label { font-size: 21px; }
  .campaign-mark::after { bottom: -70px; }
  .campaign-location { font-size: 10px; margin-top: 2px; }
  .hero-bottom { gap: 12px; padding-block: 6px 20px; }
  .motion-toggle { font-size: 10px; padding-left: 0; }
  .explore-link { font-size: 11px; gap: 7px; }
  .manifesto h2 { font-size: 26px; }
  .axis-card h3 { font-size: 18px; }
  .member-body h3 { font-size: 16px; }
}
@media (max-width: 360px) {
  .hero h1 { font-size: 46px; }
  .hero-links { font-size: 10px; gap: 5px; }
  .member-body h3 { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .campaign-mark { animation: none; transform: none; }
  .motion-ready .type-cursor { display: none; }
  .btn:hover:not(:disabled), .btn:hover .button-arrow, .explore-link:hover > span { transform: none; }
}

/* A continuous opening and one closing area with three columns. */
.hero-grid { min-height: 560px; padding-block: 52px 30px; }
@media (min-width: 1101px) {
  .hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 40px;
    justify-content: stretch;
  }
}
.campaign-caption { display: flex; align-items: center; gap: 16px; min-height: 58px; margin-top: 12px; border-bottom: 1px solid var(--line); }
.campaign-caption p { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex: 1; color: var(--blue); font-size: 11px; letter-spacing: .7px; margin: 0; }
.campaign-caption p > span { font-weight: 600; }
.campaign-caption .motion-toggle { flex: 0 0 44px; width: 44px; min-height: 44px; padding: 0; display: grid; place-items: center; color: var(--blue); border: 1px solid var(--line); border-radius: 50%; background: #ffffffa8; }
.campaign-caption .motion-toggle:hover { border-color: var(--blue-vivid); background: white; }
.campaign-caption .motion-toggle-icon { font-size: 17px; line-height: 1; }
.hero-identity { position: relative; padding-block: 58px 62px; background: linear-gradient(180deg, #f4fafb00, #f4fafbc2 55%, var(--paper)); }
.hero-identity::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: min(calc(100% - 80px), var(--container)); height: 2px; background: linear-gradient(90deg, transparent, #00aeef35 30%, #58c04640 70%, transparent); }
.hero-identity .manifesto-layout { grid-template-columns: 1.1fr .9fr; align-items: center; gap: 84px; }
.hero-identity .section-kicker { color: var(--blue); margin: 0 0 15px; }
.hero-identity h2 { font-size: clamp(27px, 2.4vw, 34px); line-height: 1.3; font-weight: 500; letter-spacing: -.025em; margin: 0; max-width: 560px; }
.hero-identity .manifesto-layout > p { color: var(--muted); font-size: 14px; line-height: 1.85; margin: 0; }
#propostas { border-top: 1px solid #dceff290; }
.campaign-footer { background: radial-gradient(ellipse at 100% 0, #0687df28, transparent 65%), var(--navy); color: white; padding-block: 62px 108px; }
.footer-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.footer-column { min-width: 0; padding-right: 40px; }
.footer-column + .footer-column { border-left: 1px solid #dceff226; padding-left: 40px; }
.footer-column:last-child { padding-right: 0; }
.campaign-footer #como-votar { background: transparent; padding: 0 40px 0 0; }
.campaign-footer .section-kicker { color: var(--cyan); font-size: 11px; letter-spacing: 1px; margin: 0 0 16px; }
.footer-column h2 { color: white; font-size: 26px; font-weight: 500; line-height: 1.25; letter-spacing: -.5px; margin: 0 0 18px; }
.footer-column > p:not(.section-kicker):not(.footer-status) { font-size: 13px; line-height: 1.85; color: #ffffffc4; margin: 0; }
.footer-status { display: flex; gap: 9px; align-items: center; color: var(--line); font-size: 11px; line-height: 1.6; margin: 22px 0 0; }
.footer-status > span { width: 6px; height: 6px; flex: none; background: var(--cyan); border-radius: 50%; }
.footer-socials { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.footer-socials a { display: inline-flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid #ffffff40; padding: 10px 13px; border-radius: 8px; text-decoration: none; font-size: 12px; min-height: 44px; transition: background .2s ease, border-color .2s ease; }
.footer-socials a:hover { background: #ffffff12; border-color: var(--cyan); }
.footer-socials a > span { color: var(--cyan); font-size: 16px; }
.footer-brand { display: flex; gap: 16px; align-items: center; margin-bottom: 22px; }
.footer-brand > span { color: var(--green-light); font: 600 82px/.9 var(--font-display); }
.footer-brand h2 { font-size: 24px; margin: 0; }
.footer-brand h2 > span { display: block; color: #ffffffcf; font-size: 15px; font-weight: 400; letter-spacing: 0; line-height: 1.45; margin-top: 5px; }
.footer-site { display: inline-block; margin-top: 22px; color: var(--line); font-size: 12px; text-underline-offset: 4px; overflow-wrap: anywhere; }
.footer-site:hover { color: var(--cyan); }
@media (max-width: 1050px) {
  .hero-identity .manifesto-layout { gap: 40px; }
  .footer-column { padding-right: 24px; }
  .footer-column + .footer-column { padding-left: 24px; }
  .campaign-footer #como-votar { padding-right: 24px; }
  .footer-column h2 { font-size: 23px; }
  .footer-brand { gap: 10px; }
  .footer-brand > span { font-size: 66px; }
  .footer-brand h2 > span { font-size: 13px; }
}
@media (max-width: 800px) {
  .hero-grid { min-height: 510px; padding-block: 36px 24px; }
  .hero-identity { padding-block: 42px; }
  .hero-identity::before { width: calc(100% - 48px); }
  .hero-identity .manifesto-layout { grid-template-columns: 1fr; gap: 20px; }
  .hero-identity h2 { max-width: 640px; }
  .footer-columns { grid-template-columns: 1fr; }
  .campaign-footer { padding-block: 42px 100px; }
  .footer-column, .campaign-footer #como-votar { padding: 0 0 28px; }
  .footer-column + .footer-column { border-left: 0; border-top: 1px solid #dceff226; padding: 28px 0; }
  .footer-column:last-child { padding-bottom: 0; }
  .footer-column h2 { font-size: 25px; }
  .footer-column > p { max-width: 600px; }
  .footer-brand > span { font-size: 72px; }
  .footer-brand h2 > span { font-size: 15px; }
}
@media (max-width: 600px) {
  .hero-grid { min-height: 0; padding-block: 28px 20px; gap: 28px; }
  .campaign-caption { margin-top: 8px; min-height: 54px; }
  .campaign-caption p { font-size: 10px; }
  .hero-identity { padding-block: 34px 40px; }
  .hero-identity::before { width: calc(100% - 40px); }
  .hero-identity h2 { font-size: 27px; }
  .hero-identity .manifesto-layout { gap: 20px; }
  .hero-identity .manifesto-layout > p { font-size: 14px; }
  .campaign-footer .section-kicker { font-size: 10px; }
}

/* Supplied campaign number, shared by the masthead and hero. */
.brand-logo { width: 48px; height: 54px; object-fit: contain; flex: none; }
.mark-logo { position: relative; z-index: 1; width: 300px; max-width: 72%; height: auto; aspect-ratio: 1; object-fit: contain; filter: drop-shadow(0 8px 12px #03275c38); }
@media (max-width: 1100px) { .mark-logo { width: 250px; } }
@media (max-width: 800px) {
  .brand-logo { width: 42px; height: 48px; }
  .mark-logo { width: 210px; }
}
@media (max-width: 600px) { .mark-logo { width: 190px; max-width: 52%; flex: none; } }

@media (max-width: 360px) {
  .campaign-mark { gap: 18px; }
  .mark-label { font-size: 17px; letter-spacing: 5px; }
}

@media (min-width: 801px) {
  .hero-grid { min-height: 0; padding-block: 40px 32px; }
  .hero h1 { font-size: clamp(68px, 7.2vw, 100px); }
  .hero .eyebrow { margin-bottom: 18px; }
  .hero-subject { font-size: 23px; margin-bottom: 10px; }
  .hero-lead { font-size: 15px; line-height: 1.75; margin-block: 20px 24px; }
  .campaign-mark { min-height: 340px; border-radius: 58px 20px; }
  .mark-logo { width: 240px; }
  .mark-label { font-size: 18px; letter-spacing: 8px; }
}


/* ==========================================================
   CORREÇÃO DO SELETOR DE FOTO DE APOIO
   O input file ocupa toda a área visível e recebe o clique
   diretamente. Isso evita falhas de <label for="..."> em
   alguns navegadores/webviews.
   ========================================================== */
.upload-picker {
  position: relative;
  display: block;
  width: 100%;
}

.upload-picker .upload-button {
  width: 100%;
  pointer-events: none;
  user-select: none;
}

.file-input-overlay {
  position: absolute;
  inset: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  cursor: pointer;
}

.upload-picker:focus-within .upload-button {
  outline: 3px solid var(--blue-vivid);
  outline-offset: 4px;
}

.file-input-overlay:disabled {
  cursor: not-allowed;
}

/* ==========================================================
   AJUSTE VISUAL DO RODAPE CHAPA 3
   ========================================================== */
.campaign-footer {
  position: relative;
  padding-block: 46px 54px;
  background:
    radial-gradient(ellipse at 82% -10%, #0b8ae52a, transparent 48%),
    linear-gradient(180deg, #07346f 0%, #062e65 100%);
}

.footer-columns {
  grid-template-columns: 1fr 1.08fr .92fr;
  align-items: stretch;
}

.footer-column {
  display: flex;
  flex-direction: column;
  min-height: 222px;
  padding-right: 38px;
}

.footer-column + .footer-column {
  padding-left: 38px;
  border-left-color: #ffffff24;
}

.campaign-footer #como-votar {
  padding-right: 38px;
}

.campaign-footer .section-kicker {
  margin-bottom: 14px;
  font-size: 10px;
  letter-spacing: 1.35px;
}

.footer-column h2 {
  margin-bottom: 16px;
  font-size: 25px;
  line-height: 1.2;
}

.footer-column > p:not(.section-kicker):not(.footer-status) {
  max-width: 350px;
  font-size: 13px;
  line-height: 1.75;
}

.footer-status {
  margin-top: auto;
  padding-top: 20px;
}

.footer-socials {
  margin-top: auto;
  padding-top: 20px;
  gap: 9px;
}

.footer-socials a {
  min-width: 114px;
  min-height: 44px;
  padding: 10px 13px;
}

.footer-brand {
  margin-bottom: 16px;
  gap: 14px;
}

.footer-brand > span {
  font-size: 72px;
  line-height: .88;
}

.footer-brand h2 {
  margin: 0;
  font-size: 23px;
}

.footer-brand h2 > span {
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.4;
}

.footer-identity > p {
  max-width: 330px !important;
}

.footer-site {
  margin-top: auto;
  padding-top: 18px;
}

/* Mantém o botão flutuante inteiramente dentro da tela. */
.whatsapp-float {
  right: max(20px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
}

@media (max-width: 1050px) {
  .campaign-footer {
    padding-block: 42px 50px;
  }

  .footer-column {
    min-height: 210px;
    padding-right: 26px;
  }

  .footer-column + .footer-column {
    padding-left: 26px;
  }

  .campaign-footer #como-votar {
    padding-right: 26px;
  }

  .footer-brand > span {
    font-size: 64px;
  }
}

@media (max-width: 800px) {
  .campaign-footer {
    padding-block: 38px 82px;
  }

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

  .footer-column,
  .campaign-footer #como-votar {
    min-height: 0;
    padding: 0 0 28px;
  }

  .footer-column + .footer-column {
    padding: 28px 0;
    border-left: 0;
    border-top: 1px solid #ffffff24;
  }

  .footer-column:last-child {
    padding-bottom: 0;
  }

  .footer-status,
  .footer-socials,
  .footer-site {
    margin-top: 18px;
    padding-top: 0;
  }

  .footer-column > p:not(.section-kicker):not(.footer-status) {
    max-width: 620px;
  }
}

@media (max-width: 600px) {
  .campaign-footer {
    padding-block: 34px 78px;
  }

  .footer-column h2 {
    font-size: 23px;
  }

  .footer-brand > span {
    font-size: 62px;
  }

  .footer-brand h2 {
    font-size: 22px;
  }
}

/* ==========================================================
   AJUSTE FOOTER MESMO NUMERO 3
   ========================================================== */
.footer-brand {
  align-items: center;
}

.footer-brand-logo {
  width: 74px;
  height: 74px;
  object-fit: contain;
  flex: 0 0 74px;
  display: block;
}

@media (max-width: 1050px) {
  .footer-brand-logo {
    width: 64px;
    height: 64px;
    flex-basis: 64px;
  }
}

@media (max-width: 800px) {
  .footer-brand-logo {
    width: 72px;
    height: 72px;
    flex-basis: 72px;
  }
}

@media (max-width: 600px) {
  .footer-brand-logo {
    width: 68px;
    height: 68px;
    flex-basis: 68px;
  }
}

/* ==========================================================
   AJUSTE CARD FLUTUANTE E TEXTOS JUSTIFICADOS
   ========================================================== */

@keyframes chapa3-card-float-fix {
  0%, 100% {
    translate: 0 0;
  }
  50% {
    translate: 0 -10px;
  }
}

.campaign-mark {
  animation:
    chapa3-card-float-fix 5.8s ease-in-out infinite,
    mark-gradient 12s ease-in-out infinite alternate !important;
  will-change: translate, transform;
}

body:not(.motion-paused) .campaign-mark {
  animation-play-state: running !important;
}

body.motion-paused .campaign-mark,
.hero.is-offscreen .campaign-mark {
  animation-play-state: paused !important;
}

/* Alinhamento justificado apenas nos textos corridos.
   Títulos, botões, rótulos e elementos de navegação permanecem intactos. */
.hero-lead,
.manifesto-layout > p,
.section-heading > p,
.axis-card p,
.support-heading > p,
.privacy-note,
.how-card li,
.footer-column > p:not(.section-kicker):not(.footer-status),
.footer-identity > p {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  -webkit-hyphens: auto;
}

/* Mantém a preferência de acessibilidade do dispositivo. */
@media (prefers-reduced-motion: reduce) {
  .campaign-mark {
    animation: none !important;
    translate: 0 0 !important;
  }
}

/* ==========================================================
   FORCAR MOVIMENTO CARD E OCULTAR BOTAO
   ========================================================== */

/* Oculta completamente o controle visual de pausa. */
.motion-toggle,
.campaign-caption .motion-toggle {
  display: none !important;
}

/* Movimento contínuo e perceptível do card principal. */
@keyframes chapa3-card-float-force {
  0%, 100% {
    transform:
      translate3d(0, 0, 0)
      rotateX(var(--tilt-x, 0deg))
      rotateY(var(--tilt-y, 0deg));
  }
  50% {
    transform:
      translate3d(0, -12px, 0)
      rotateX(var(--tilt-x, 0deg))
      rotateY(var(--tilt-y, 0deg));
  }
}

.campaign-mark {
  animation:
    chapa3-card-float-force 4.8s ease-in-out infinite,
    mark-gradient 12s ease-in-out infinite alternate !important;
  animation-play-state: running !important;
  will-change: transform, background-position;
}

/* O card continua se movimentando mesmo se o sistema operacional
   estiver configurado para reduzir animações. */
@media (prefers-reduced-motion: reduce) {
  .campaign-mark {
    animation:
      chapa3-card-float-force 4.8s ease-in-out infinite,
      mark-gradient 12s ease-in-out infinite alternate !important;
    animation-play-state: running !important;
    transform: none;
  }
}

/* Pausa apenas quando a aba/página realmente estiver fora de exibição. */
body.motion-paused .campaign-mark,
.hero.is-offscreen .campaign-mark {
  animation-play-state: paused !important;
}

/* ==========================================================
   IDENTIDADE SHOWCASE CHAPA 3
   ========================================================== */

.identity-showcase {
  position: relative;
  overflow: hidden;
  padding-block: 74px 76px;
  background:
    radial-gradient(circle at -3% 22%, rgba(6, 135, 223, .09), transparent 24%),
    radial-gradient(circle at 103% 12%, rgba(6, 135, 223, .10), transparent 27%),
    radial-gradient(circle at 4% 98%, rgba(88, 192, 70, .09), transparent 24%),
    linear-gradient(180deg, #ffffff 0%, #f8fcfd 100%);
}

.identity-showcase::before,
.identity-showcase::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.identity-showcase::before {
  width: 380px;
  height: 380px;
  right: -180px;
  top: -210px;
  border: 44px solid rgba(6, 135, 223, .045);
}

.identity-showcase::after {
  width: 300px;
  height: 300px;
  left: -215px;
  bottom: -175px;
  border: 44px solid rgba(88, 192, 70, .045);
}

.identity-showcase-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: 76px;
  align-items: center;
}

.identity-main {
  min-width: 0;
  padding-right: 18px;
}

.identity-kicker {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 26px;
  color: var(--blue);
}

.identity-kicker > span {
  width: 66px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--blue-vivid), var(--green-light));
}

.identity-headline {
  display: grid;
  gap: 2px;
  margin: 0;
  max-width: 720px;
  font-size: clamp(38px, 4.1vw, 58px) !important;
  line-height: 1.06 !important;
  letter-spacing: -2.6px !important;
  font-weight: 600 !important;
}

.identity-headline > span {
  display: block;
}

.identity-headline > span:nth-child(1) {
  color: var(--navy);
}

.identity-headline > span:nth-child(2) {
  color: var(--blue-vivid);
}

.identity-headline > span:nth-child(3) {
  background: linear-gradient(90deg, var(--blue), var(--cyan) 46%, var(--green) 88%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.identity-pillars {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 46px;
}

.identity-pillar {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
  padding-right: 18px;
}

.identity-pillar + .identity-pillar {
  padding-left: 22px;
  border-left: 1px solid var(--line);
}

.identity-icon {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--blue-vivid);
  background: rgba(6, 135, 223, .075);
  box-shadow: 0 8px 22px rgba(3, 39, 92, .07);
}

.identity-icon-green {
  color: var(--green);
  background: rgba(88, 192, 70, .10);
}

.identity-icon svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.identity-pillar strong,
.identity-pillar small {
  display: block;
}

.identity-pillar strong {
  color: var(--navy);
  font-size: 13px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: .25px;
}

.identity-pillar small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.identity-signature {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 36px 0 0;
  color: #73889a;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 3.2px;
  text-transform: uppercase;
}

.identity-signature::before {
  content: "";
  width: 64px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--blue-vivid), var(--green-light));
}

.identity-content {
  min-width: 0;
  padding-left: 60px;
  border-left: 1px solid var(--line);
}

.identity-text {
  margin: 0;
  max-width: 570px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.9;
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

.identity-emphasis {
  margin: 28px 0 0;
  max-width: 570px;
  color: var(--navy);
  font-size: 18px;
  line-height: 1.55;
  font-weight: 600;
}

.identity-cta {
  width: min(100%, 520px);
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin-top: 32px;
  padding: 15px 24px 15px 30px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(100deg, var(--blue), var(--blue-vivid));
  box-shadow: 0 16px 34px rgba(6, 67, 146, .17);
  text-decoration: none;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .7px;
  transition: transform .2s ease, box-shadow .2s ease;
}

.identity-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 38px rgba(6, 67, 146, .23);
}

.identity-cta svg {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.identity-slogan {
  margin: 22px 0 0 auto;
  max-width: 300px;
  color: var(--blue-vivid);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 24px;
  font-style: italic;
  line-height: 1.1;
  text-align: right;
  transform: rotate(-3deg);
}

@media (max-width: 1050px) {
  .identity-showcase-grid {
    gap: 44px;
  }

  .identity-main {
    padding-right: 0;
  }

  .identity-content {
    padding-left: 38px;
  }

  .identity-headline {
    font-size: clamp(35px, 4.4vw, 48px) !important;
    letter-spacing: -2px !important;
  }

  .identity-pillars {
    grid-template-columns: 1fr;
    gap: 15px;
    margin-top: 34px;
  }

  .identity-pillar,
  .identity-pillar + .identity-pillar {
    padding: 0;
    border-left: 0;
  }
}

@media (max-width: 800px) {
  .identity-showcase {
    padding-block: 56px 60px;
  }

  .identity-showcase-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .identity-content {
    padding: 38px 0 0;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .identity-pillars {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
  }

  .identity-pillar {
    display: grid;
    align-content: start;
  }

  .identity-pillar + .identity-pillar {
    padding-left: 16px;
    border-left: 1px solid var(--line);
  }

  .identity-slogan {
    margin-right: 8px;
  }
}

@media (max-width: 600px) {
  .identity-showcase {
    padding-block: 48px 52px;
  }

  .identity-kicker {
    gap: 11px;
    margin-bottom: 20px;
  }

  .identity-kicker > span {
    width: 42px;
  }

  .identity-headline {
    font-size: clamp(35px, 10.5vw, 45px) !important;
    line-height: 1.04 !important;
    letter-spacing: -1.8px !important;
  }

  .identity-pillars {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 34px;
  }

  .identity-pillar,
  .identity-pillar + .identity-pillar {
    display: flex;
    padding: 0;
    border-left: 0;
  }

  .identity-text {
    font-size: 14px;
    line-height: 1.8;
  }

  .identity-emphasis {
    margin-top: 22px;
    font-size: 17px;
  }

  .identity-cta {
    min-height: 56px;
    padding-inline: 22px 18px;
    font-size: 12px;
  }

  .identity-signature {
    font-size: 9px;
    letter-spacing: 2.2px;
  }

  .identity-slogan {
    font-size: 21px;
  }
}

/* ==========================================================
   HERO MESMA IDENTIDADE VISUAL SHOWCASE
   ========================================================== */

.hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at -5% 18%, rgba(6,135,223,.08), transparent 25%),
    radial-gradient(circle at 104% 22%, rgba(6,135,223,.09), transparent 27%),
    radial-gradient(circle at 51% 106%, rgba(88,192,70,.07), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f8fcfd 100%) !important;
}

.hero::before {
  content: "";
  position: absolute;
  width: 440px;
  height: 440px;
  right: -250px;
  top: -230px;
  border: 52px solid rgba(6,135,223,.045);
  border-radius: 50%;
  pointer-events: none;
}

.hero::after {
  content: "";
  position: absolute;
  width: 330px;
  height: 330px;
  left: 30%;
  bottom: -265px;
  border: 42px solid rgba(88,192,70,.045);
  border-radius: 50%;
  pointer-events: none;
}

.hero-grid {
  position: relative;
  z-index: 2;
  grid-template-columns: minmax(0,.92fr) minmax(520px,1.08fr) !important;
  gap: 76px !important;
  min-height: 590px !important;
  padding-block: 62px 58px !important;
  align-items: center !important;
}

.hero-copy {
  max-width: 620px;
}

.hero .eyebrow {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 20px !important;
  padding: 8px 15px !important;
  border: 1px solid #cfe4ef;
  border-radius: 999px;
  color: var(--blue) !important;
  background: rgba(255,255,255,.7);
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 1.25px !important;
  text-transform: uppercase;
  box-shadow: 0 8px 20px rgba(3,39,92,.035);
}

.hero .eyebrow::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--green);
}

.hero-subject {
  position: relative;
  margin: 0 0 16px !important;
  padding-left: 26px;
  color: var(--navy) !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  letter-spacing: .1px;
}

.hero-subject::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 16px;
  height: 3px;
  border-radius: 99px;
  transform: translateY(-50%);
  background: linear-gradient(90deg,var(--blue-vivid),var(--green-light));
}

.hero-title {
  margin: 0 !important;
  font-size: clamp(56px, 6.25vw, 88px) !important;
  line-height: .98 !important;
  letter-spacing: -4.6px !important;
  font-weight: 600 !important;
}

.hero-title #typed-first {
  color: var(--navy);
}

.hero-title #typed-second {
  background: linear-gradient(90deg, var(--blue), var(--blue-vivid) 48%, var(--green) 104%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.type-cursor {
  background: linear-gradient(180deg,var(--blue-vivid),var(--green)) !important;
}

.hero-lead {
  max-width: 585px !important;
  margin-top: 28px !important;
  color: var(--muted) !important;
  font-size: 15px !important;
  line-height: 1.82 !important;
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

.hero-actions {
  display: flex !important;
  flex-wrap: wrap;
  gap: 12px !important;
  margin-top: 28px !important;
}

.hero-actions .btn {
  min-height: 54px;
  padding: 13px 22px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.hero-actions .btn-primary {
  color: #fff !important;
  background: linear-gradient(100deg,var(--blue),var(--blue-vivid)) !important;
  border-color: transparent !important;
  box-shadow: 0 14px 30px rgba(6,67,146,.17);
}

.hero-actions .btn-secondary {
  color: var(--navy) !important;
  background: rgba(255,255,255,.78) !important;
  border: 1px solid #cfe0e8 !important;
  box-shadow: none !important;
}

.hero-actions .btn:hover {
  transform: translateY(-2px);
}

.button-arrow {
  font-size: 16px;
  color: currentColor;
}

/* Card com a mesma linguagem gráfica da seção seguinte */
.hero-art {
  width: min(100%, 620px) !important;
  justify-self: end;
}

.campaign-mark {
  position: relative;
  min-height: 340px !important;
  border-radius: 64px 16px 64px 16px !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 95% -8%, rgba(255,255,255,.12), transparent 30%),
    radial-gradient(circle at 100% 8%, transparent 0 18%, rgba(255,255,255,.045) 18.5% 19.5%, transparent 20% 28%, rgba(255,255,255,.035) 28.5% 29.5%, transparent 30%),
    linear-gradient(135deg,#062e69 0%,#084e9c 58%,#0787cf 100%) !important;
  box-shadow:
    0 28px 56px rgba(3,39,92,.17),
    inset 0 0 0 1px rgba(255,255,255,.06);
  transform-origin: 50% 50%;
  will-change: transform;
  animation: chapa3-card-showcase-float 4.8s ease-in-out infinite !important;
  animation-play-state: running !important;
}

.campaign-mark::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 28px;
  background: linear-gradient(90deg,#078ad8 0%,#59cb32 58%,#24b9b8 100%);
  clip-path: polygon(0 76%,100% 0,100% 100%,0 100%);
  pointer-events: none;
}

@keyframes chapa3-card-showcase-float {
  0%,100% { transform: translate3d(0,0,0) rotate(-.15deg); }
  50%     { transform: translate3d(0,-12px,0) rotate(.25deg); }
}

body.motion-paused .campaign-mark,
.hero.is-offscreen .campaign-mark {
  animation-play-state: running !important;
}

.mark-label {
  color: rgba(255,255,255,.92) !important;
  letter-spacing: 8px !important;
  font-weight: 500 !important;
}

.mark-logo {
  filter: drop-shadow(0 18px 24px rgba(0,0,0,.14));
}

.mark-caption {
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .55px !important;
}

.campaign-caption {
  margin-top: 30px !important;
  padding-top: 18px !important;
  border-top: 1px solid #d6e8ed;
}

.campaign-caption p {
  color: var(--blue) !important;
  font-size: 10px !important;
  letter-spacing: 1.1px !important;
}

.campaign-caption p span {
  color: var(--navy) !important;
  font-weight: 700;
}

.motion-toggle {
  display: none !important;
}

@media (max-width: 1050px) {
  .hero-grid {
    grid-template-columns: minmax(0,.95fr) minmax(430px,1.05fr) !important;
    gap: 42px !important;
  }

  .hero-title {
    font-size: clamp(50px,7vw,72px) !important;
    letter-spacing: -3.6px !important;
  }

  .campaign-mark {
    min-height: 310px !important;
  }
}

@media (max-width: 800px) {
  .hero-grid {
    grid-template-columns: 1fr !important;
    gap: 42px !important;
    padding-block: 48px 56px !important;
  }

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

  .hero-art {
    width: min(100%,600px) !important;
    justify-self: center;
  }

  .campaign-mark {
    min-height: 330px !important;
  }

  .hero-title {
    font-size: clamp(54px,12vw,76px) !important;
  }
}

@media (max-width: 600px) {
  .hero {
    background:
      radial-gradient(circle at 102% 10%, rgba(6,135,223,.08), transparent 28%),
      linear-gradient(180deg,#fff 0%,#f9fcfd 100%) !important;
  }

  .hero-grid {
    gap: 34px !important;
    padding-block: 36px 46px !important;
  }

  .hero .eyebrow {
    margin-bottom: 18px !important;
  }

  .hero-subject {
    font-size: 15px !important;
  }

  .hero-title {
    font-size: clamp(48px,15.5vw,64px) !important;
    letter-spacing: -3.5px !important;
  }

  .hero-lead {
    margin-top: 22px !important;
    font-size: 14px !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .hero-actions .btn {
    width: 100%;
  }

  .campaign-mark {
    min-height: 255px !important;
    border-radius: 44px 12px 44px 12px !important;
  }

  .campaign-caption {
    margin-top: 22px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .campaign-mark {
    animation: none !important;
    transform: none !important;
  }
}

/* ==========================================================
   PROPOSTAS SHOWCASE CHAPA 3
   ========================================================== */

#propostas {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at -2% 14%, rgba(6,135,223,.08), transparent 23%),
    radial-gradient(circle at 103% 20%, rgba(6,135,223,.08), transparent 26%),
    radial-gradient(circle at 50% 110%, rgba(88,192,70,.07), transparent 30%),
    linear-gradient(180deg, #fbfeff 0%, #f7fbfd 100%) !important;
}

#propostas::before,
#propostas::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

#propostas::before {
  width: 360px;
  height: 360px;
  left: -235px;
  bottom: -185px;
  border: 40px solid rgba(88,192,70,.04);
}

#propostas::after {
  width: 420px;
  height: 420px;
  right: -245px;
  top: -240px;
  border: 44px solid rgba(6,135,223,.04);
}

#propostas .container {
  position: relative;
  z-index: 1;
}

#propostas .section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(300px, .98fr);
  gap: 58px;
  align-items: end;
  margin-bottom: 34px;
}

#propostas .section-heading > div {
  max-width: 560px;
}

#propostas .section-kicker {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 22px;
  color: var(--blue);
}

#propostas .section-kicker::before {
  content: "";
  width: 64px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--blue-vivid), var(--green-light));
}

#propostas h2 {
  margin: 0;
  max-width: 560px;
  font-size: clamp(38px, 4vw, 56px) !important;
  line-height: 1.06 !important;
  letter-spacing: -2.1px !important;
}

#propostas .section-heading > p {
  margin: 0;
  max-width: 500px;
  padding-left: 36px;
  border-left: 1px solid var(--line);
  color: var(--muted);
  font-size: 15px;
  line-height: 1.9;
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

#propostas .axes-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

#propostas .axis-card {
  position: relative;
  border: 1px solid rgba(207, 225, 235, .95);
  border-radius: 26px;
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(10px);
  box-shadow: 0 16px 30px rgba(3,39,92,.05);
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

#propostas .axis-card::before {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  top: 0;
  height: 4px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, var(--blue-vivid), var(--green-light));
  opacity: .9;
}

#propostas .axis-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 36px rgba(3,39,92,.08);
  border-color: #c1dceb;
}

#propostas .axis-card summary {
  list-style: none;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 16px;
  align-items: center;
  cursor: pointer;
  padding: 22px 22px 18px;
}

#propostas .axis-card summary::-webkit-details-marker {
  display: none;
}

#propostas .axis-card summary::after {
  content: none !important;
}

#propostas .axis-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 76px;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 999px;
  color: var(--blue);
  background: rgba(6,135,223,.08);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  white-space: nowrap;
}

#propostas .axis-card h3 {
  margin: 0;
  color: var(--navy);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.3;
}

#propostas .axis-toggle {
  position: relative;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
  border: 1px solid #d1e4ec;
  background: #fff;
  box-shadow: 0 8px 18px rgba(3,39,92,.05);
}

#propostas .axis-toggle::before,
#propostas .axis-toggle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 2px;
  border-radius: 999px;
  background: var(--blue-vivid);
  transform: translate(-50%, -50%);
}

#propostas .axis-toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: opacity .18s ease;
}

#propostas .axis-card[open] {
  background: rgba(255,255,255,.96);
  border-color: #b8d8e7;
  box-shadow: 0 22px 40px rgba(3,39,92,.09);
}

#propostas .axis-card[open] .axis-toggle::after {
  opacity: 0;
}

#propostas .axis-card[open] h3 {
  color: var(--blue);
}

#propostas .axis-card p {
  margin: 0;
  padding: 0 22px 22px 114px;
  max-width: none;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

@media (max-width: 1050px) {
  #propostas .section-heading {
    gap: 34px;
  }

  #propostas h2 {
    font-size: clamp(34px, 4.2vw, 46px) !important;
    letter-spacing: -1.8px !important;
  }

  #propostas .section-heading > p {
    padding-left: 26px;
  }

  #propostas .axis-card summary {
    grid-template-columns: auto 1fr auto;
    gap: 14px;
  }

  #propostas .axis-card h3 {
    font-size: 18px;
  }
}

@media (max-width: 800px) {
  #propostas .section-heading {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  #propostas .section-heading > p {
    max-width: 620px;
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--line);
    padding-top: 22px;
  }

  #propostas .axes-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  #propostas .section-kicker {
    gap: 10px;
    margin-bottom: 18px;
  }

  #propostas .section-kicker::before {
    width: 42px;
  }

  #propostas h2 {
    font-size: clamp(34px, 10vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: -1.5px !important;
  }

  #propostas .axis-card summary {
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: start;
  }

  #propostas .axis-index {
    grid-column: 1 / 2;
    width: fit-content;
    margin-bottom: 2px;
  }

  #propostas .axis-card h3 {
    grid-column: 1 / 2;
    font-size: 17px;
  }

  #propostas .axis-toggle {
    grid-column: 2 / 3;
    grid-row: 1 / span 2;
    align-self: center;
  }

  #propostas .axis-card p {
    padding: 0 18px 20px 18px;
    font-size: 14px;
    line-height: 1.75;
  }
}

/* ==========================================================
   MEMBROS SHOWCASE CHAPA 3
   ========================================================== */

#membros {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at -4% 14%, rgba(6,135,223,.08), transparent 24%),
    radial-gradient(circle at 104% 16%, rgba(6,135,223,.08), transparent 27%),
    radial-gradient(circle at 55% 108%, rgba(88,192,70,.07), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #f8fcfd 100%) !important;
}

#membros::before,
#membros::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

#membros::before {
  width: 420px;
  height: 420px;
  right: -250px;
  top: -250px;
  border: 44px solid rgba(6,135,223,.04);
}

#membros::after {
  width: 320px;
  height: 320px;
  left: -220px;
  bottom: -180px;
  border: 40px solid rgba(88,192,70,.04);
}

#membros .container {
  position: relative;
  z-index: 1;
}

#membros .section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(300px, .98fr);
  gap: 58px;
  align-items: end;
  margin-bottom: 30px;
}

#membros .section-heading > div {
  max-width: 560px;
}

#membros .section-kicker {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 22px;
  color: var(--blue);
}

#membros .section-kicker::before {
  content: "";
  width: 64px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--blue-vivid), var(--green-light));
}

#membros h2 {
  margin: 0;
  max-width: 560px;
  font-size: clamp(38px, 4vw, 56px) !important;
  line-height: 1.06 !important;
  letter-spacing: -2.1px !important;
}

#membros .section-heading > p {
  margin: 0;
  max-width: 510px;
  padding-left: 36px;
  border-left: 1px solid var(--line);
  color: var(--muted);
  font-size: 15px;
  line-height: 1.9;
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

.member-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  border: 1px solid rgba(207,225,235,.95) !important;
  border-radius: 24px;
  background: rgba(255,255,255,.8);
  backdrop-filter: blur(10px);
  box-shadow: 0 16px 30px rgba(3,39,92,.05);
}

.member-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.filter-button {
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 999px !important;
  border: 1px solid #d4e5ec !important;
  background: #fff !important;
  color: var(--navy) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.filter-button:hover {
  transform: translateY(-1px);
  border-color: #bdd8e7 !important;
  box-shadow: 0 10px 18px rgba(3,39,92,.06);
}

.filter-button[aria-pressed='true'] {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(100deg, var(--blue), var(--blue-vivid)) !important;
  box-shadow: 0 12px 24px rgba(6,67,146,.16);
}

.member-search {
  width: min(100%, 330px) !important;
  min-height: 50px !important;
  padding: 0 16px !important;
  border: 1px solid #d4e5ec !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.9);
  box-shadow: 0 10px 18px rgba(3,39,92,.03);
}

.member-search:focus-within {
  border-color: #b7d9e8 !important;
  outline: 0 !important;
  box-shadow: 0 0 0 4px rgba(6,135,223,.08);
}

.member-results {
  margin: 16px 0 30px !important;
  width: fit-content;
  padding: 7px 14px;
  border-radius: 999px;
  color: var(--blue);
  background: rgba(6,135,223,.06);
  font-size: 11px !important;
  font-weight: 600;
  letter-spacing: .7px;
  text-transform: uppercase;
}

.quadro-group {
  margin-top: 0 !important;
  padding: 28px 28px 30px;
  border: 1px solid rgba(207,225,235,.95);
  border-radius: 30px;
  background: rgba(255,255,255,.84);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 32px rgba(3,39,92,.05);
}

.quadro-group + .quadro-group {
  margin-top: 26px !important;
}

.quadro-heading {
  margin: 0;
  color: var(--navy);
  font-size: 28px !important;
  line-height: 1.1;
  letter-spacing: -1.1px;
}

.quadro-subheading {
  margin: 8px 0 22px !important;
  color: var(--muted);
  font-size: 14px !important;
}

.slate-heading {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 22px 0 18px !important;
  color: var(--blue) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .3px;
  text-transform: uppercase;
}

.slate-heading::before {
  content: "";
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--blue-vivid), var(--green));
}

.slate-heading::after {
  content: "";
  height: 1px;
  background: var(--line);
  flex: 1;
}

.members-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 18px !important;
}

.member-card {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
  padding: 16px !important;
  border: 1px solid #d7e6ed !important;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 24px rgba(3,39,92,.04);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.member-card:hover {
  transform: translateY(-2px);
  border-color: #b9d9e8 !important;
  box-shadow: 0 18px 28px rgba(3,39,92,.08);
}

.member-avatar,
.member-photo {
  width: 78px !important;
  height: 92px !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, #f4fbff, #e8f1f4 72%) !important;
  box-shadow: inset 0 0 0 1px rgba(7,110,174,.08);
}

.member-avatar {
  display: grid;
  place-items: center;
  color: var(--blue);
  font-size: 24px !important;
  font-weight: 500 !important;
  border-bottom: 4px solid var(--green-light) !important;
}

.member-body {
  min-width: 0;
}

.member-body h3 {
  margin: 0 0 6px !important;
  color: var(--navy);
  font-size: 17px !important;
  font-weight: 600 !important;
  line-height: 1.35;
}

.member-category {
  display: inline-flex;
  align-items: center;
  margin: 0 0 6px !important;
  padding: 4px 9px;
  border-radius: 999px;
  color: var(--blue) !important;
  background: rgba(6,135,223,.07);
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .45px;
  text-transform: uppercase;
}

.member-register {
  margin: 0 !important;
  color: var(--muted);
  font-size: 12px !important;
  line-height: 1.55;
}

.member-empty {
  padding: 24px 20px !important;
  border: 1px solid #d7e6ed;
  border-radius: 20px;
  background: rgba(255,255,255,.84);
  box-shadow: 0 12px 24px rgba(3,39,92,.04);
}

@media (max-width: 1050px) {
  #membros .section-heading {
    gap: 34px;
  }

  #membros h2 {
    font-size: clamp(34px, 4.2vw, 46px) !important;
    letter-spacing: -1.8px !important;
  }

  #membros .section-heading > p {
    padding-left: 26px;
  }

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

@media (max-width: 800px) {
  #membros .section-heading {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  #membros .section-heading > p {
    max-width: 620px;
    padding-left: 0;
    padding-top: 22px;
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .member-tools {
    flex-direction: column;
    align-items: stretch;
  }

  .member-search {
    width: 100% !important;
  }
}

@media (max-width: 600px) {
  #membros .section-kicker {
    gap: 10px;
    margin-bottom: 18px;
  }

  #membros .section-kicker::before {
    width: 42px;
  }

  #membros h2 {
    font-size: clamp(34px, 10vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: -1.5px !important;
  }

  .member-tools {
    padding: 16px;
    border-radius: 22px;
  }

  .member-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .filter-button {
    padding-inline: 8px;
    font-size: 12px !important;
  }

  .quadro-group {
    padding: 22px 18px 22px;
    border-radius: 24px;
  }

  .quadro-heading {
    font-size: 24px !important;
  }

  .members-grid {
    gap: 12px !important;
  }

  .member-card {
    padding: 14px !important;
    border-radius: 18px;
  }

  .member-avatar,
  .member-photo {
    width: 62px !important;
    height: 74px !important;
    border-radius: 14px !important;
  }

  .member-avatar {
    font-size: 20px !important;
  }

  .member-body h3 {
    font-size: 15px !important;
  }

  .member-register {
    font-size: 11px !important;
  }
}

/* ==========================================================
   CIRCULOS CONTINUOS CHAPA 3
   ========================================================== */

html, body {
  overflow-x: clip;
}

body {
  position: relative;
  background:
    linear-gradient(180deg, #fbfdff 0%, #f8fcfd 100%);
}

body::before,
body::after,
main::before,
main::after {
  content: "";
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

main {
  position: relative;
  isolation: isolate;
}

.site-header,
main > section,
main > div,
footer,
.back-to-top,
.whatsapp-float {
  position: relative;
  z-index: 1;
}

/* círculo superior direito */
body::before {
  width: 560px;
  height: 560px;
  top: -210px;
  right: -210px;
  border: 56px solid rgba(18, 129, 223, .07);
  opacity: .95;
}

/* círculo inferior esquerdo */
body::after {
  width: 460px;
  height: 460px;
  left: -220px;
  bottom: -120px;
  border: 44px solid rgba(69, 192, 101, .06);
  opacity: .92;
}

/* círculo central topo */
main::before {
  width: 520px;
  height: 520px;
  left: 50%;
  top: 120px;
  transform: translateX(-50%);
  border: 54px solid rgba(33, 160, 234, .07);
  box-shadow: inset 0 0 120px rgba(98, 212, 83, .06);
  opacity: .88;
}

/* círculo central inferior */
main::after {
  width: 620px;
  height: 620px;
  left: 22%;
  bottom: 120px;
  border: 58px solid rgba(110, 206, 90, .05);
  opacity: .82;
}

@media (max-width: 1050px) {
  body::before {
    width: 460px;
    height: 460px;
    top: -180px;
    right: -190px;
    border-width: 42px;
  }

  body::after {
    width: 360px;
    height: 360px;
    left: -180px;
    bottom: -90px;
    border-width: 34px;
  }

  main::before {
    width: 420px;
    height: 420px;
    top: 160px;
    border-width: 40px;
  }

  main::after {
    width: 460px;
    height: 460px;
    left: 16%;
    bottom: 150px;
    border-width: 42px;
  }
}

@media (max-width: 800px) {
  body::before {
    width: 340px;
    height: 340px;
    top: -120px;
    right: -150px;
    border-width: 28px;
    opacity: .8;
  }

  body::after {
    width: 280px;
    height: 280px;
    left: -130px;
    bottom: 20px;
    border-width: 24px;
    opacity: .72;
  }

  main::before {
    width: 300px;
    height: 300px;
    top: 220px;
    border-width: 28px;
    opacity: .72;
  }

  main::after {
    width: 320px;
    height: 320px;
    left: 50%;
    bottom: 200px;
    transform: translateX(-50%);
    border-width: 28px;
    opacity: .68;
  }
}

@media (max-width: 600px) {
  body::before {
    width: 250px;
    height: 250px;
    top: -85px;
    right: -110px;
    border-width: 20px;
  }

  body::after {
    width: 210px;
    height: 210px;
    left: -95px;
    bottom: 110px;
    border-width: 18px;
  }

  main::before {
    width: 220px;
    height: 220px;
    top: 250px;
    border-width: 18px;
  }

  main::after {
    width: 240px;
    height: 240px;
    bottom: 220px;
    border-width: 18px;
  }
}

/* ==========================================================
   CORRIGIR CIRCULO CONTINUO ENTRE IDENTIDADE E PROPOSTAS
   ========================================================== */

/* Remove os círculos locais da seção de identidade que estavam
   sendo cortados no limite da seção. */
.identity-showcase::before,
.identity-showcase::after {
  display: none !important;
}

/* Faz o círculo principal nascer na seção seguinte e subir para
   a anterior, criando continuidade visual real entre as duas. */
#propostas {
  overflow: visible !important;
  isolation: isolate;
}

#propostas::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -265px;
  width: 520px;
  height: 520px;
  transform: translateX(-50%);
  border: 54px solid rgba(33, 160, 234, .07);
  border-radius: 50%;
  box-shadow: inset 0 0 120px rgba(98, 212, 83, .06);
  pointer-events: none;
  opacity: .9;
  z-index: 0;
}

#propostas .container {
  position: relative;
  z-index: 1;
}

@media (max-width: 1050px) {
  #propostas::before {
    top: -220px;
    width: 430px;
    height: 430px;
    border-width: 42px;
  }
}

@media (max-width: 800px) {
  #propostas::before {
    top: -170px;
    width: 320px;
    height: 320px;
    border-width: 28px;
    opacity: .78;
  }
}

@media (max-width: 600px) {
  #propostas::before {
    top: -125px;
    width: 240px;
    height: 240px;
    border-width: 20px;
    opacity: .72;
  }
}

/* ==========================================================
   CORRIGIR BOTOES FLUTUANTES APOS CIRCULOS
   ========================================================== */

.whatsapp-float {
  position: fixed !important;
  z-index: 90 !important;
  right: max(24px, env(safe-area-inset-right)) !important;
  bottom: max(24px, env(safe-area-inset-bottom)) !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  max-width: calc(100% - 32px) !important;
  display: inline-flex !important;
}

.back-to-top {
  position: fixed !important;
  z-index: 80 !important;
  left: 24px !important;
  right: auto !important;
  bottom: max(24px, env(safe-area-inset-bottom)) !important;
  top: auto !important;
  width: 44px !important;
  height: 44px !important;
}

@media (max-width: 600px) {
  .whatsapp-float {
    right: max(16px, env(safe-area-inset-right)) !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }

  .back-to-top {
    left: 16px !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
  }
}

/* ==========================================================
   LINK COMUNIDADE WHATSAPP CHAPA 3
   ========================================================== */
.footer-socials .community-link {
  color: #ffffff !important;
  background: linear-gradient(100deg, #16a34a, #22c55e) !important;
  border-color: transparent !important;
  font-weight: 700 !important;
  box-shadow: 0 12px 24px rgba(22, 163, 74, .18);
}

.footer-socials .community-link:hover {
  background: linear-gradient(100deg, #148f42, #1fb455) !important;
  border-color: transparent !important;
  transform: translateY(-1px);
}

.footer-socials .community-link > span {
  color: #ffffff !important;
}

@media (max-width: 600px) {
  .footer-socials .community-link {
    width: 100%;
  }
}

/* ==========================================================
   RESTAURAR ANIMACAO DO CARD HERO
   ========================================================== */

@keyframes hero-card-float-restore {
  0%, 100% {
    transform: translate3d(0, 0, 0) rotate(-0.2deg);
  }
  50% {
    transform: translate3d(0, -12px, 0) rotate(0.2deg);
  }
}

.campaign-mark {
  animation: hero-card-float-restore 4.8s ease-in-out infinite !important;
  animation-play-state: running !important;
  will-change: transform !important;
}

body.motion-paused .campaign-mark,
.hero.is-offscreen .campaign-mark,
body.motion-reduced .campaign-mark {
  animation: hero-card-float-restore 4.8s ease-in-out infinite !important;
  animation-play-state: running !important;
}

@media (prefers-reduced-motion: reduce) {
  .campaign-mark {
    animation: hero-card-float-restore 4.8s ease-in-out infinite !important;
    transform: translate3d(0, 0, 0) !important;
  }
}