/* =========================================================================
   VIDA Partido Social — «Cartel de mitin»
   Tintas planas: azul VIDA, naranja, blanco. Archivo (variable: ancho + peso).
   ========================================================================= */

@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;
  src:url(/assets/fonts/archivo-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;
  src:url(/assets/fonts/archivo-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --navy:#0b1f4b;
  --blue:#007dfe;     /* azul eléctrico: fondo de la web (dato del cliente) */
  --blue-2:var(--blue); /* cliente: un único azul en toda la web */
  --blue-3:var(--blue);
  --navy-2:var(--blue-2);
  --navy-3:var(--blue-3);
  --orange:#f26a1b;
  --orange-soft:#ffe6d6;
  --orange-ink:#9b3d07;   /* naranja oscuro para texto pequeño sobre blanco (AA) */
  --paper:#ffffff;
  --cerulean:var(--blue); /* antes cerúleo #008cee; el cliente quiere un único azul */
  --sky:var(--cerulean);
  --ink-on-navy:#ffffff;  /* sobre azul eléctrico el texto va en blanco y en negrita (ver «Texto sobre azul») */
  --ink-soft:#33476f;
  --line-paper:#d5dbe7;
  --font:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1320px;
  --rule:3px;
  --ease:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scrollbar-color:var(--orange) var(--blue-3)}
body{background:var(--blue);color:#fff;font:400 1.125rem/1.6 var(--font);font-stretch:100%;text-rendering:optimizeLegibility}
::selection{background:var(--orange);color:var(--navy)}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:2px}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.btn-o:focus-visible{outline-color:var(--navy)}
input,textarea,select{caret-color:var(--orange)}
.wrap{width:min(var(--wrap),100% - 32px);margin-inline:auto}
.narrow{max-width:78ch}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--orange);color:var(--navy);padding:12px 16px;z-index:60;font-weight:800}
.skip:focus{left:16px}

/* Voz de cartel: Archivo extra-condensada negra */
.poster-type{font-weight:900;font-stretch:62%;text-transform:uppercase;line-height:1.02;letter-spacing:-.005em}
h1,h2,h3{text-wrap:balance}
.lead{font-size:clamp(1.15rem,1.6vw,1.4rem);line-height:1.5;max-width:56ch}

/* Superficies (tintas) */
.s-navy,.s-paper{background:var(--blue);color:#fff}
.s-navy2{background:var(--navy-2);color:#fff}
/* Las secciones antes blancas también son azul eléctrico (cliente, 2026-10-26) */
.s-paper{background:var(--blue);color:#fff}
/* .s-orange: nombre histórico; desde 2026-10-26 el fondo es azul (el naranja queda solo para botones y objetos) */
.s-orange{background:var(--blue-2);color:#fff}
.s-cerulean{background:var(--blue);color:#fff}
.s-cerulean .lead,.s-cerulean p.soft{color:var(--navy)}
.s-navy .lead,.s-navy2 .lead,.s-navy p.soft,.s-orange .lead,.s-paper .lead,.s-paper p.soft{color:var(--ink-on-navy)}

section.s{padding:clamp(72px,10vw,140px) 0}
section.s.tight{padding:clamp(48px,7vw,96px) 0}

/* Botones */
.btn{display:inline-flex;align-items:center;gap:12px;font:800 1.05rem/1.1 var(--font);text-decoration:none;border-radius:999px;padding:17px 26px;border:0;cursor:pointer;transition:transform .2s var(--ease),background-color .2s,color .2s;min-height:52px}
.btn svg{width:20px;height:20px;flex:none;transition:transform .2s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-o{background:var(--orange);color:var(--navy)}
.btn-o:hover{transform:translateY(-2px)}
.btn-n{background:var(--blue);color:#fff}
.btn-n:hover{transform:translateY(-2px)}
.s-navy .btn-n,.s-navy2 .btn-n,.s-orange .btn-n,.s-paper .btn-n{background:var(--orange);color:var(--navy)}
.btn-w{background:transparent;color:inherit;box-shadow:inset 0 0 0 2px currentColor}
.s-navy .btn-w:hover,.s-navy2 .btn-w:hover,.s-orange .btn-w:hover,.s-paper .btn-w:hover{background:#fff;color:var(--navy)}

.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
.acts{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

/* ===== Cabecera ===== */
.site-head{background:var(--blue);position:relative;z-index:30}
.site-head .wrap{display:flex;align-items:center;gap:24px;min-height:112px}
.brand img{height:87px;width:auto;filter:brightness(0) invert(1)}  /* +90% (cliente) */
.nav-main{margin-left:auto}
.nav-main ul{display:flex;gap:4px;list-style:none}
.nav-main a{display:block;text-decoration:none;font-weight:600;font-size:1rem;padding:10px 12px;border-radius:8px}
.nav-main a:hover{text-decoration:underline;text-decoration-color:#fff;text-underline-offset:8px}
.nav-main a[aria-current]{text-decoration:underline;text-decoration-color:var(--navy);text-underline-offset:8px;text-decoration-thickness:3px}
.lang-link{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:.95rem;text-decoration:none;padding:10px 12px;border-radius:999px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.lang-link svg{width:18px;height:18px}
.lang-link:hover{box-shadow:inset 0 0 0 2px #fff}
.menu-btn{display:none;align-items:center;gap:8px;font-weight:800;background:none;border:0;border-radius:999px;padding:10px 16px;box-shadow:inset 0 0 0 2px #fff;cursor:pointer;min-height:44px}
.menu-btn svg{width:20px;height:20px}
.menu-panel{position:fixed;inset:0;z-index:50;background:var(--blue);overflow:auto;padding:20px 0 40px}
.menu-panel[hidden]{display:none}
.menu-close{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font-weight:800;background:none;border:0;border-radius:999px;padding:10px 16px;box-shadow:inset 0 0 0 2px #fff;cursor:pointer;min-height:44px}
.menu-panel .wrap>.menu-close{display:flex;margin:0 0 24px auto}
.menu-close svg{width:20px;height:20px}
.menu-panel ul{list-style:none;border-top:var(--rule) solid #fff}
.menu-panel li a{display:block;padding:14px 0;border-bottom:var(--rule) solid #fff;font-size:clamp(2.4rem,11vw,4rem);text-decoration:none}
.menu-panel li a[aria-current]{color:var(--navy)}
.menu-foot{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:32px;font-weight:700}
body.menu-open{overflow:hidden}

/* ===== Portada ===== */
.hero{position:relative;min-height:calc(100svh - 112px);display:grid;align-items:end;overflow:hidden;padding:56px 0 120px}
.hero .duo{position:absolute;right:max(0px,calc(50% - 700px));bottom:0;width:min(44vw,620px);height:94%;background:var(--blue)}
.hero .duo img{position:absolute;inset:auto 0 0 0;margin:auto;height:100%;width:auto;object-fit:contain}  /* fotos a color original, sin velo (cliente, 2026-10-27) */
.hero .wrap{position:relative;z-index:2}
.hero h1{font-size:clamp(4.4rem,13vw,12rem);max-width:9ch}
.hero h1 span{display:block}
.hero h1 .o{color:var(--orange)}
.hero .line{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;margin-top:36px}
.hero .line p{max-width:36ch;font-size:clamp(1.1rem,1.5vw,1.3rem);color:var(--ink-on-navy)}
.who-tag{position:absolute;z-index:3;right:max(0px,calc(50% - 700px));bottom:0;width:min(44vw,620px);background:var(--blue);border-top:6px solid var(--orange);padding:18px 24px 20px;text-decoration:none}
.who-tag strong{display:block;font-size:clamp(1.6rem,2.6vw,2.4rem)}
.who-tag span{color:var(--ink-on-navy);font-weight:600;font-size:.98rem}
.who-tag:hover strong{text-decoration:underline;text-decoration-color:#fff;text-decoration-thickness:3px}
.js .hero h1 span{animation:slam .9s var(--ease) both}
.js .hero h1 span:nth-child(2){animation-delay:.1s}
.js .hero h1 span:nth-child(3){animation-delay:.2s}
@keyframes slam{from{opacity:0;transform:translateY(.22em) scale(1.03)}to{opacity:1;transform:none}}

.tape{background:var(--blue-2);color:#fff;overflow:hidden;white-space:nowrap;padding:14px 16px}
.tape ul{display:flex;gap:40px;list-style:none;font-size:1.6rem;justify-content:center;flex-wrap:wrap;row-gap:4px}
.tape li+li::before{content:"";display:inline-block;width:12px;height:12px;background:var(--orange);margin-right:40px;vertical-align:middle;border-radius:50%}

.big{font-size:clamp(3rem,8vw,7rem);margin-bottom:28px}
.big em{font-style:normal;color:var(--orange)}
.mid{font-size:clamp(2.6rem,6vw,5.4rem);margin-bottom:24px}
.split{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(32px,5vw,72px);align-items:end}
.split .acts{margin-top:28px}
.head-row{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.head-row h2{margin:0}

/* Listado de cartel (propuestas, enlaces) */
.list{list-style:none;border-top:var(--rule) solid currentColor}
.list a,.list .row{display:grid;grid-template-columns:5ch 1fr 1.1fr 40px;gap:24px;align-items:center;padding:22px 8px;border-bottom:var(--rule) solid currentColor;text-decoration:none;transition:background-color .25s,color .25s}
.list strong{font-size:clamp(2rem,4.2vw,3.6rem);transition:transform .35s var(--ease)}
.list p{font-size:1.02rem}
.s-navy .list p,.s-navy2 .list p,.s-orange .list p,.s-paper .list p{color:var(--ink-on-navy)}

.list svg{width:34px;height:34px;transition:transform .25s var(--ease)}
.s-navy .list a:hover,.s-navy2 .list a:hover,.s-orange .list a:hover,.s-paper .list a:hover{background:#fff;color:var(--navy)}
.s-navy .list a:hover p,.s-navy2 .list a:hover p,.s-orange .list a:hover p,.s-paper .list a:hover p{color:var(--ink-soft)}


.list a:hover strong{transform:translateX(12px)}
.list a:hover svg{transform:translate(4px,-4px)}
.list.compact strong{font-size:clamp(1.6rem,3vw,2.4rem)}
.list.no-num a,.list.no-num .row{grid-template-columns:1fr 1.1fr 40px}

/* Candidato (foto a dos tintas) */
.duo-photo{position:relative;background:var(--blue);aspect-ratio:4/5;overflow:hidden}
.duo-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}  /* color original (cliente, 2026-10-27) */

.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:center}
.two .lead+.lead{margin-top:14px}
.two .acts{margin-top:30px}

/* Carteles reales */
.posters{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.posters img{width:100%;aspect-ratio:4/5;object-fit:cover;box-shadow:0 22px 36px -24px rgba(0,0,0,.7);transition:transform .35s var(--ease)}
.posters a:hover img{transform:translateY(-6px) rotate(-1deg)}

/* Territorios: franjas */
.strip{display:block;text-decoration:none;border-top:var(--rule) solid currentColor}
.strip .wrap{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;padding:26px 0}
.strip strong{font-size:clamp(2.8rem,9vw,8rem)}
.strip span{font-weight:700;font-size:1.05rem;text-align:right;max-width:26ch}
.strip.t1{background:var(--blue-2);color:#fff}
.strip.t2{background:var(--blue);color:#fff}
.strip.t3{background:var(--blue);color:#fff}
.strip.t4{background:var(--blue);color:#fff}
.strip:hover strong{text-decoration:underline;text-decoration-thickness:6px;text-underline-offset:10px}

/* Noticias */
.news{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--rule);background:var(--blue);border:var(--rule) solid var(--blue);margin-top:40px}
.news.one{grid-template-columns:1fr}
.news a{background:var(--paper);color:var(--navy);display:flex;flex-direction:column;gap:12px;padding:32px;text-decoration:none;transition:background-color .2s}
.news a:hover{background:var(--blue);color:#fff}
.news a:hover p,.news a:hover .byline{color:#fff}
.news .byline{font-weight:600;font-size:.98rem;color:var(--ink-soft)}
.news strong{font-size:clamp(1.9rem,3vw,2.6rem)}
.news p{color:var(--ink-soft)}
.news .more{margin-top:auto;font-weight:800;display:inline-flex;gap:8px;align-items:center}
.news .more svg{width:18px;height:18px}

/* Participa (cierre) */
.join{text-align:center}
.join h2{font-size:clamp(3.4rem,10vw,9rem);max-width:12ch;margin:0 auto 24px}
.join .lead{margin:0 auto 36px}
.join .acts{justify-content:center}

/* ===== Páginas interiores ===== */
.page-hero{padding:clamp(56px,8vw,112px) 0 clamp(56px,7vw,96px);position:relative;overflow:hidden}
.page-hero .wrap{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(28px,5vw,72px);align-items:end}
.page-hero.solo .wrap{grid-template-columns:1fr}
.page-hero h1{font-size:clamp(3.2rem,9vw,8.4rem);max-width:14ch}
.page-hero h1 .o{color:var(--orange)}
.page-hero .lead{margin-top:24px}
.page-hero .over{font-weight:800;font-size:1rem;margin-bottom:18px;display:inline-flex;gap:10px;align-items:center;text-decoration:none}
.page-hero .over:hover{text-decoration:underline}
.page-hero .over svg{width:18px;height:18px;transform:rotate(180deg)}
.page-hero figure img{width:100%;max-height:520px;object-fit:cover}
.page-hero .cover{box-shadow:0 30px 50px -28px rgba(0,0,0,.8);max-width:360px;margin-left:auto}
.page-hero .acts{margin-top:30px}
.fallback-note{margin-top:16px;font-size:.95rem;color:var(--ink-on-navy)}

/* Bloques */
.b-text .wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,5vw,80px);align-items:start}
.b-text h2{font-size:clamp(2.4rem,5vw,4.4rem)}
.prose{max-width:68ch;font-size:clamp(1.15rem,1.4vw,1.28rem);line-height:1.6}
.prose p,.prose ul,.prose ol{margin-bottom:1.1em}
.prose ul,.prose ol{padding-left:1.2em}
.prose li{margin:.35em 0}
.prose li::marker{color:var(--orange)}
.prose h3{font-size:1.5rem;font-weight:800;margin:1.6em 0 .5em;line-height:1.15}
.prose strong{font-weight:800}

.s-navy .prose,.s-navy2 .prose,.s-orange .prose,.s-paper .prose{color:var(--ink-on-navy)}
.s-navy .prose strong,.s-navy .prose h3,.s-paper .prose strong,.s-paper .prose h3{color:#fff}
.b-text.single .wrap{grid-template-columns:1fr;gap:0}
.b-text.single h2{margin-bottom:28px}

.rally{list-style:none;border-top:var(--rule) solid currentColor;margin-top:36px}
.rally li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:baseline;padding:20px 4px;border-bottom:var(--rule) solid currentColor}
.rally h3{font-size:clamp(1.8rem,3.4vw,2.9rem)}
.rally p{font-size:1.08rem;line-height:1.45}
.rally.steps{counter-reset:st}
.rally.steps li{counter-increment:st;grid-template-columns:auto minmax(0,1fr) minmax(0,1.1fr)}
.rally.steps li::before{content:counter(st);font-weight:900;font-stretch:62%;font-size:clamp(2.4rem,4vw,3.4rem);line-height:.9;color:var(--orange);min-width:1.2ch}
.s-navy .rally p,.s-navy2 .rally p,.s-orange .rally p,.s-paper .rally p{color:var(--ink-on-navy)}


.b-callout{text-align:left}
.b-callout p.poster-type{font-size:clamp(2.6rem,7vw,6rem);max-width:18ch}
.b-callout .acts{margin-top:32px}

.downloads{list-style:none;border-top:var(--rule) solid currentColor;margin-top:32px}
.downloads a{display:grid;grid-template-columns:44px 1fr auto;gap:20px;align-items:center;padding:20px 8px;border-bottom:var(--rule) solid currentColor;text-decoration:none;transition:background-color .2s,color .2s}
.downloads svg{width:30px;height:30px}
.downloads strong{display:block;font-size:1.25rem;font-weight:800;line-height:1.2}
.downloads span{font-size:.95rem}

.s-navy .downloads span,.s-paper .downloads span{color:var(--ink-on-navy)}
.downloads .ext{font-weight:900;font-stretch:62%;font-size:1.4rem;text-transform:uppercase}


.s-navy .downloads a:hover,.s-paper .downloads a:hover{background:#fff;color:var(--navy)}
.s-navy .downloads a:hover span,.s-paper .downloads a:hover span{color:var(--ink-soft)}

.b-image figure img{width:100%;max-height:640px;object-fit:cover}
.b-image figcaption{margin-top:12px;font-size:.95rem}


.faq{border-top:var(--rule) solid currentColor;margin-top:32px}
.faq details{border-bottom:var(--rule) solid currentColor}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 4px;font-weight:800;font-size:1.3rem;line-height:1.25}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:900;font-size:2rem;line-height:1;color:var(--orange);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .prose{padding:0 4px 24px}

.b-notice{padding:clamp(32px,5vw,64px) 0}
.notice{display:flex;gap:16px;align-items:flex-start;padding:22px 24px;background:var(--blue);color:#fff;font-weight:700;margin-top:28px;font-size:1.02rem}
.notice svg{width:24px;height:24px;flex:none;color:#fff;margin-top:2px}

/* Formularios */
.form-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(28px,5vw,80px);align-items:start}
.form{display:grid;gap:22px}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.field label{display:block;font-weight:800;font-size:1.02rem;margin-bottom:8px}
.field label small{font-weight:600;opacity:.75}
.field input:not([type=checkbox]),.field textarea,.field select{width:100%;font:500 1.1rem/1.4 var(--font);color:var(--navy);background:#fff;border:2px solid var(--navy);border-radius:0;padding:14px 16px;min-height:54px;transition:box-shadow .15s}
.s-navy .field input:not([type=checkbox]),.s-navy .field textarea,.s-navy .field select,.s-paper .field input:not([type=checkbox]),.s-paper .field textarea,.s-paper .field select{border-color:#fff}
.field textarea{min-height:170px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;box-shadow:0 0 0 4px var(--orange)}
.field input::placeholder,.field textarea::placeholder{color:#5d6b88}
.field .err{display:flex;gap:8px;align-items:center;margin-top:8px;font-weight:700;font-size:.98rem;color:#b3261e}
.s-navy .field .err,.s-paper .field .err{color:#ffb4a8}
.field [aria-invalid="true"]{border-color:#b3261e;box-shadow:0 0 0 2px #b3261e}
.field label.check,.check{display:grid;font-weight:500;grid-template-columns:28px 1fr;gap:12px;align-items:start;font-size:1rem}
.check input{width:26px;height:26px;margin-top:2px;accent-color:var(--orange)}
.check a{font-weight:700}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-alert{padding:20px 22px;font-weight:700;display:flex;gap:14px;align-items:flex-start}
.form-alert svg{width:24px;height:24px;flex:none}
.form-alert.ok{background:#e3f4e8;color:#14532d}
.form-alert.bad{background:#fde4e1;color:#8a1c12}
.form-note{font-size:.95rem}

.s-navy .form-note,.s-paper .form-note{color:var(--ink-on-navy)}
.contact-lines{list-style:none;display:grid;gap:14px;margin-top:28px}
.contact-lines a{display:inline-flex;gap:12px;align-items:center;font-weight:800;font-size:1.3rem;text-decoration:none}
.contact-lines a:hover{text-decoration:underline;text-decoration-color:var(--orange)}
.contact-lines svg{width:26px;height:26px;color:var(--orange)}

/* Propuesta / programa */
.measures{list-style:none;counter-reset:m;border-top:var(--rule) solid currentColor;margin-top:28px}
.measures li{counter-increment:m;display:grid;grid-template-columns:4ch 1fr;gap:18px;padding:20px 4px;border-bottom:var(--rule) solid currentColor;font-size:1.15rem;line-height:1.45}
.measures li::before{content:counter(m,decimal-leading-zero);font-weight:900;font-stretch:62%;font-size:1.6rem;color:var(--orange-ink)}
.s-navy .measures li::before,.s-paper .measures li::before{color:var(--navy)}
.s-navy2 .measures li::before,.s-orange .measures li::before{color:var(--navy)}
.disclaimer{font-size:.95rem;margin-top:24px;max-width:70ch}


/* Noticia */
.byline{margin-top:18px;font-weight:600;font-size:1.05rem;color:var(--ink-on-navy)}
.article-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(28px,5vw,72px);align-items:start}
.article-body aside{position:sticky;top:24px;display:grid;gap:16px}
.article-body aside img{width:100%;box-shadow:0 20px 40px -26px rgba(11,31,75,.7)}

/* ===== Píldora flotante ===== */
.pill{position:fixed;left:max(16px,calc(50% - 644px));bottom:18px;z-index:40;display:flex;gap:6px;padding:6px;background:var(--blue);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:999px;box-shadow:0 14px 30px -12px rgba(0,0,0,.6);border:2px solid #fff;transition:transform .35s var(--ease),opacity .35s}
.pill a{padding:12px 18px;border-radius:999px;font-weight:800;font-size:.98rem;text-decoration:none;white-space:nowrap;color:#fff}
.pill a:first-child{background:var(--orange);color:var(--navy)}
.pill a:not(:first-child):hover{background:rgba(255,255,255,.14)}
.pill.away{transform:translateY(140%);opacity:0}

/* ===== Pie ===== */
.site-foot{background:var(--navy-3);color:var(--ink-on-navy);padding:64px 0 120px}
.site-foot .wrap{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:32px}
.site-foot img{height:54px;width:auto;filter:brightness(0) invert(1)}
.foot-brand p{margin-top:16px;max-width:30ch}
.site-foot h2{color:#fff;font-weight:900;font-stretch:75%;text-transform:uppercase;letter-spacing:.06em;font-size:1.1rem;margin-bottom:12px}
.site-foot ul{list-style:none;display:grid;gap:8px}
.site-foot a{text-decoration:none}
.site-foot a:hover{text-decoration:underline;text-decoration-color:#fff}
.foot-legal{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.18);padding-top:20px;display:flex;flex-wrap:wrap;gap:12px 24px;font-size:.92rem}

/* ===== Responsive ===== */
@media (max-width:1100px){
  .nav-main{display:none}
  .menu-btn{display:inline-flex}
  .lang-link{margin-left:auto}
}
@media (max-width:980px){
  .split,.two,.b-text .wrap,.form-wrap,.page-hero .wrap,.article-body{grid-template-columns:1fr}
  .page-hero .cover{margin-left:0;max-width:260px}
  .posters{grid-template-columns:repeat(2,1fr)}
  .list a,.list .row{grid-template-columns:4ch 1fr 34px}
  .list.no-num a,.list.no-num .row{grid-template-columns:1fr 34px}
  .list p{display:none}
  .rally li{grid-template-columns:1fr;gap:6px}
  .rally.steps li{grid-template-columns:auto 1fr;column-gap:16px}
  .rally.steps li p{grid-column:2}
  .site-foot .wrap{grid-template-columns:1fr 1fr}
  .article-body aside{position:static}
}
@media (max-width:640px){
  .hero{display:flex;flex-direction:column;padding:40px 0 0;min-height:0}
  .hero .wrap{order:1}
  .hero .duo{order:2;position:relative;right:auto;width:100%;height:440px;margin-top:36px}
  .who-tag{order:3;position:relative;right:auto;width:100%;padding:18px 16px 96px}
  .hero h1{font-size:4.6rem}
  .hero .line{margin-top:20px}
  .strip .wrap{grid-template-columns:1fr}.strip span{text-align:left}
  .tape ul{gap:4px 22px;font-size:1.25rem;white-space:normal;justify-content:flex-start}
  .tape li+li::before{display:none}
  .news{grid-template-columns:1fr}
  .form .row2{grid-template-columns:1fr}
  .pill{left:50%;transform:translateX(-50%)}
  .pill.away{transform:translate(-50%,140%)}
  .pill a{padding:11px 13px;font-size:.92rem}
  .site-foot .wrap{grid-template-columns:1fr}
  .downloads a{grid-template-columns:32px 1fr}
  .downloads .ext{display:none}
  .page-hero h1{font-size:clamp(2.8rem,13vw,4.4rem)}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
@media print{.site-head,.pill,.site-foot,.menu-panel{display:none}body{background:#fff;color:#000}}

/* =========================================================================
   Texto sobre azul eléctrico (#007dfe). Blanco da 3,9:1: solo vale como
   «texto grande» (≥24px, o ≥18,7px en negrita). Por eso, sobre azul,
   todo el texto de lectura va en negrita y a ≥18,7px, y los destacados
   pasan de naranja (1,3:1, ilegible) a azul marino (4,1:1, solo tamaño grande).
   ========================================================================= */
.s-navy,.site-head,.menu-panel,.who-tag,.site-foot,.s-paper{--rd:700}
.s-navy :is(p,li,dd,dt,summary,label,figcaption,td,th),.s-navy .prose,.s-navy .lead,.s-navy2 :is(p,li,summary,label),.s-navy2 .lead,.hero .line p,.who-tag span,.byline,.fallback-note,.site-foot,.site-foot :is(p,li,a,span),.s-orange :is(p,li,summary,label),.s-orange .lead,.s-paper :is(p,li,dd,dt,summary,label,figcaption,td,th),.s-paper .prose,.s-paper .lead{font-weight:700}
.s-navy .prose,.s-navy .lead,.s-navy p:not(.poster-type),.s-navy li,.s-navy label,.s-navy .form-note,.hero .line p,.who-tag span,.byline,.fallback-note,.s-navy .downloads span,.s-navy .list p,.s-navy .rally p,.s-paper .prose,.s-paper .lead,.s-paper p:not(.poster-type),.s-paper li,.s-paper label,.s-paper .form-note,.s-paper .downloads span,.s-paper .list p,.s-paper .rally p{font-size:max(1.17rem,1em)}
.s-navy .poster-type,.s-navy h1,.s-navy h2,.s-navy h3,.s-paper .poster-type,.s-paper h1,.s-paper h2,.s-paper h3{font-weight:900}
.s-navy .o,.s-navy em,.hero h1 .o,.page-hero.s-navy h1 .o,.s-navy .big em,.s-paper .o,.s-paper em,.page-hero.s-paper h1 .o,.s-paper .big em{color:var(--navy)}
.s-navy2 .o,.s-navy2 em,.s-orange .o,.s-orange em,.s-cerulean .o,.s-cerulean em{color:var(--navy)}
.s-navy .rally.steps li::before,.s-paper .rally.steps li::before{color:var(--navy)}
.s-navy .prose li::marker,.s-navy2 .prose li::marker,.s-orange .prose li::marker,.s-paper .prose li::marker{color:#fff}
.s-navy .faq summary::after,.s-navy2 .faq summary::after,.s-navy .contact-lines svg,.s-orange .faq summary::after,.s-paper .faq summary::after,.s-paper .contact-lines svg{color:#fff}
.s-navy .field .err,.s-paper .field .err{color:#fff;text-decoration:underline;text-decoration-thickness:2px}
.s-navy :focus-visible,.s-navy2 :focus-visible,.site-head :focus-visible,.menu-panel :focus-visible,.site-foot :focus-visible,.s-orange :focus-visible,.s-paper :focus-visible{outline-color:#fff}
.btn{font-size:1.17rem}
.nav-main a{font-size:1.17rem;font-weight:700;padding:10px 8px}
.site-foot{font-size:1.17rem}
.foot-legal{font-size:1.17rem}

/* Un único azul: todas las superficies azules (navy, navy2, orange, cerulean) son #007dfe.
   Mismas reglas de texto que .s-navy, y un filete blanco cuando se juntan dos secciones azules. */
.s-navy2 .prose,.s-navy2 .lead,.s-navy2 p:not(.poster-type),.s-navy2 li,.s-navy2 label,.s-navy2 .list p,.s-navy2 .rally p,.s-orange .prose,.s-orange .lead,.s-orange p:not(.poster-type),.s-orange li,.s-orange label,.s-orange .list p,.s-orange .rally p,.s-cerulean .prose,.s-cerulean .lead,.s-cerulean p:not(.poster-type),.s-cerulean li,.notice{font-size:max(1.17rem,1em);font-weight:700}
.s-orange .rally.steps li::before,.s-navy2 .rally.steps li::before{color:var(--navy)}
:is(.s-navy,.s-navy2,.s-orange,.s-cerulean,.hero) + :is(.s-navy,.s-navy2,.s-orange,.s-cerulean,section:has(> .s-navy)),:is(.s-paper,.s-navy2,.s-orange,.s-cerulean,.hero) + :is(.s-paper,.s-navy2,.s-orange,.s-cerulean,section:has(> .s-paper)){box-shadow:inset 0 3px 0 #fff}
.tape{border-block:3px solid #fff}
.notice a{color:#fff}
.site-foot{box-shadow:inset 0 3px 0 #fff}

/* Portada: foto del fundador recortada (fondo transparente, colores reales) sobre el azul */
.hero .duo.cutout{background:transparent}
.hero .duo.cutout img{filter:none;mix-blend-mode:normal;object-position:bottom center}

/* Secciones azules contiguas (todas son #007dfe): filete blanco de separación */
:is(.s-navy,.s-navy2,.s-orange,.s-cerulean,.s-paper,.hero,.tape) + :is(.s-paper,.s-navy,.s-navy2,.s-orange,.s-cerulean),
.strip + .strip{box-shadow:inset 0 3px 0 #fff}

/* =========================================================================
   Peticiones del cliente, 2026-10-27
   ========================================================================= */
:root{--mandarina:#FF7F00}

/* Titulares a dos colores: el segundo color pasa de azul marino a mandarina */
.s-navy .o,.s-navy em,.hero h1 .o,.page-hero.s-navy h1 .o,.s-navy .big em,.s-paper .o,.s-paper em,.page-hero.s-paper h1 .o,.s-paper .big em,
.s-navy2 .o,.s-navy2 em,.s-orange .o,.s-orange em,.s-cerulean .o,.s-cerulean em,.page-hero h1 .o,.big em{color:var(--mandarina)}

/* Todos los botones en naranja */
.btn-n,.btn-w,.s-navy .btn-w,.s-navy2 .btn-w,.s-orange .btn-w,.s-paper .btn-w{background:var(--orange);color:var(--navy);box-shadow:none}
.btn-o:hover,.btn-n:hover,.btn-w:hover,.s-navy .btn-w:hover,.s-navy2 .btn-w:hover,.s-orange .btn-w:hover,.s-paper .btn-w:hover{background:#fff;color:var(--navy)}
.menu-btn,.menu-close{background:var(--orange);color:var(--navy);box-shadow:none}

/* Botón de idioma en naranja */
.lang-link{background:var(--orange);color:var(--navy);box-shadow:none}
.lang-link:hover{background:#fff;box-shadow:none}

/* Menú superior con todas las secciones (también las del pie): en dos filas a la derecha */
.site-head .wrap{gap:20px}
.nav-main ul{flex-wrap:wrap;justify-content:flex-end;row-gap:0}
.nav-main a{font-size:1.05rem;padding:8px 9px}

/* Píldora de acciones (Afíliate, Donativo…): arriba a la derecha, justo bajo el menú; acompaña al bajar */
.pill-bar{position:sticky;top:0;height:0;z-index:40}
.pill-bar .wrap{display:flex;justify-content:flex-end;padding-top:12px}
.pill{position:static;left:auto;bottom:auto}
.pill a{background:var(--orange);color:var(--navy)}
.pill a:hover,.pill a:not(:first-child):hover{background:#fff;color:var(--navy)}
.pill.away{transform:translateY(-160%);opacity:0;pointer-events:none}
.hero .duo{height:calc(100% - 84px)}

/* Pie de la foto del fundador en una sola línea */
.who-tag{display:flex;align-items:baseline;gap:.7em;white-space:nowrap;padding:16px 24px 18px}
.who-tag strong{display:inline;font-size:clamp(1rem,1.75vw,1.5rem)}
.hero .who-tag span{font-size:clamp(.8rem,1.1vw,1rem)}

/* Afiliación y donaciones: cabecera compacta para que la información se vea desde el principio */
.page-hero.compact{padding:clamp(28px,4vw,48px) 0 clamp(20px,3vw,32px)}
.page-hero.compact h1{font-size:clamp(2.6rem,5vw,4.6rem);max-width:none}
.page-hero.compact .lead{margin-top:12px}
.page-hero.compact .acts{margin-top:18px}
.page-hero.compact + .b-notice{padding-top:0}

@media (max-width:1180px){
  .nav-main{display:none}
  .menu-btn{display:inline-flex}
  .lang-link{margin-left:auto}
}
@media (max-width:640px){
  .pill-bar .wrap{justify-content:center}
  .pill{transform:none}
  .pill.away{transform:translateY(-160%)}
  .pill .pill-x{display:none}
  .who-tag{flex-wrap:wrap;white-space:normal;row-gap:2px;padding:14px 16px 20px}
  .hero .duo{height:440px}
}