/* ===== CHANIPEN · sistema visual =====
   Papel del grabado #E9D8BC · azul marino #0E283F · verde #2F6B33 · rojo #CE3520 · azul #1B5390 */
:root{
  color-scheme: light;
  --marino:#0E283F;
  --marino-2:#16344F;
  --papel:#FBFAF7;
  --papel-2:#F1EFE9;
  --surface:#FFFFFF;
  --ink:#14202C;
  --ink-soft:#586471;
  --filete:#E0DDD4;
  --verde:#2F6B33;
  --rojo:#CE3520;
  --azul:#1B5390;
  --violeta:#5B1BE8;
  --naranja:#C2600F;
  --navy:#0E283F;
  --oro:#C99A2E;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--papel); color:var(--ink);
  font-family:"Source Sans 3", ui-sans-serif, system-ui, sans-serif; font-size:17.5px; line-height:1.68;
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0; line-height:1.08; font-weight:500;
  font-family:"Cormorant Garamond", Garamond, Georgia, serif; text-wrap:balance}
.display{font-family:"Cormorant Garamond", Garamond, serif; font-weight:500; line-height:1.06; text-wrap:balance}
p{margin:0}
a{color:inherit}
img{max-width:100%; display:block}
.wrap{width:min(1220px,100%); margin-inline:auto; padding-inline:26px}
.eyebrow{
  font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.3em;
  font-size:13px; font-weight:600; color:var(--ink-soft);
}
.tricolor{height:4px; display:flex}
.tricolor i{flex:1}
.tricolor i:nth-child(1){background:var(--verde)}
.tricolor i:nth-child(2){background:var(--rojo)}
.tricolor i:nth-child(3){background:var(--azul)}
.rule{display:flex; gap:6px; margin-bottom:16px}
.rule i{width:34px; height:4px}
.rule i:nth-child(1){background:var(--verde)} .rule i:nth-child(2){background:var(--rojo)} .rule i:nth-child(3){background:var(--azul)}

.draftbar{background:var(--marino); color:#E7EBEF; font-size:13px}
.draftbar .wrap{display:flex; justify-content:center; padding-block:8px; text-align:center}
.draftbar b{font-family:"Cormorant Garamond",serif; letter-spacing:.26em; font-weight:600; font-size:12.5px}
@media (max-width:760px){
  .draftbar{font-size:11.5px}
  .draftbar b{font-size:11px; letter-spacing:.2em}
  .draftbar .larga{display:none}
  .cloudhint{font-size:10px; letter-spacing:.18em}
}

/* ---------- cabecera ---------- */
.topbar{position:sticky; top:env(safe-area-inset-top,0px); z-index:60}
header.site{ background:color-mix(in srgb, var(--papel) 95%, transparent); backdrop-filter:blur(10px)}
.bar{display:flex; align-items:center; gap:20px; padding-block:16px}
.brand{margin-right:auto; display:block; text-decoration:none; flex:none}
.brand img{height:58px; width:auto; max-width:none; flex:none}
nav.main{display:flex; gap:6px; align-items:center}
nav.main>.item{position:relative}
nav.main a.lnk, nav.main button.lnk{
  font-family:"Cormorant Garamond",serif; font-weight:600; font-size:17px; text-transform:uppercase; letter-spacing:.14em;
  background:none; border:0; cursor:pointer; color:var(--ink); padding:9px 12px; text-decoration:none;
  display:inline-flex; align-items:center; gap:8px; border-bottom:2px solid transparent;
}
nav.main a.lnk:hover, nav.main button.lnk:hover{border-bottom-color:var(--rojo)}
nav.main .caret{width:6px;height:6px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6}
.menu{position:absolute; top:calc(100% + 10px); left:0; min-width:300px; background:var(--surface);
  border:1px solid var(--filete); border-top:3px solid var(--marino); padding:10px; display:grid; gap:1px;
  box-shadow:0 18px 40px rgba(14,40,63,.13)}
.menu a{display:block; padding:10px 12px; text-decoration:none; font-size:15.5px}
.menu a:hover{background:var(--papel-2)}
.menu a small{display:block; color:var(--ink-soft); font-size:13px; line-height:1.4}
.redes-top{display:flex; gap:4px; align-items:center; padding-right:14px; margin-right:2px;
  border-right:1px solid var(--filete)}
.redes-top a{width:32px; height:32px; display:grid; place-items:center}
.redes-top svg{width:18px; height:18px; fill:none; stroke:var(--ink-soft); stroke-width:1.6;
  stroke-linejoin:round; transition:stroke .18s ease}
.redes-top svg .pt,.redes-top svg .pl{fill:var(--ink-soft); stroke:none; transition:fill .18s ease}
.redes-top a:hover svg{stroke:var(--rojo)}
.redes-top a:hover svg .pt,.redes-top a:hover svg .pl{fill:var(--rojo)}

.langs{display:flex; gap:12px; align-items:center}
.langs button{font-family:"Cormorant Garamond",serif; font-size:15px; letter-spacing:.2em; font-weight:600; border:0; background:none;
  cursor:pointer; color:var(--ink-soft); padding:2px 0; border-bottom:2px solid transparent}
.langs button[aria-pressed="true"]{color:var(--ink); border-bottom-color:var(--rojo)}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px; text-decoration:none; cursor:pointer;
  font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em; font-size:14.5px; font-weight:600;
  padding:14px 30px; border:1px solid var(--marino); background:var(--marino); color:#FBFAF7;
  transition:background .18s ease, color .18s ease;
}
.btn:hover{background:transparent; color:var(--marino)}
.btn.ghost{background:transparent; color:var(--marino)}
.btn.ghost:hover{background:var(--marino); color:var(--papel)}
.btn.rojo{background:var(--rojo); border-color:var(--rojo); color:#fff}
.btn.rojo:hover{background:transparent; color:var(--rojo)}
.btn.light{border-color:var(--papel); background:transparent; color:var(--papel)}
.btn.light:hover{background:var(--papel); color:var(--marino)}
.burger{display:none; width:46px;height:42px; border:1px solid var(--filete); background:var(--surface); cursor:pointer; padding:0}
.cerrarnav{display:none; position:absolute; top:22px; right:22px; width:46px; height:46px; place-items:center;
  border:1px solid var(--filete); background:var(--surface); cursor:pointer; padding:0;
  font-family:"Cormorant Garamond",serif; font-size:26px; line-height:1; color:var(--ink)}
.cerrarnav:hover{background:var(--ink); color:var(--papel); border-color:var(--ink)}
.burger span{display:block; width:20px;height:1.5px; background:var(--ink); margin:4px auto}

/* ---------- portada ---------- */
.hero{padding-block:0 clamp(30px,4vw,58px)}
.stage{height:200svh; position:relative}
.stagefix{position:sticky; top:var(--head,120px); height:calc(100svh - var(--head,120px)); display:grid; place-items:stretch; overflow:hidden}
.cloudwrap{position:relative; display:grid; grid-template-rows:1fr; align-items:start; justify-items:center;
  height:100%; padding-block:0; will-change:transform; transform-origin:50% 0%}
.cloud{--cw:88vw; position:relative; aspect-ratio:1375/1448; width:auto; max-width:var(--cw);
  height:min(84%, calc(var(--cw) * 1448 / 1375));   /* así nunca se ovala al estrechar */
  margin-inline:auto; touch-action:pan-y; user-select:none; cursor:crosshair}
.cloud .piece{position:absolute; will-change:transform}
.cloud .piece img{width:100%; height:auto; pointer-events:none; -webkit-user-drag:none; image-rendering:auto}
#halo{position:absolute; left:0; top:0; width:56px; height:56px; border-radius:50%; pointer-events:none; opacity:0;
  border:1px solid color-mix(in srgb, var(--rojo) 45%, transparent);
  background:radial-gradient(circle, color-mix(in srgb, var(--rojo) 8%, transparent), transparent 70%);
  transition:opacity .3s ease; z-index:5}
/* el aviso va al pie del escenario, no pegado a la nube: si no, sube y se sale al encogerse */
.cloudhint{position:absolute; left:50%; translate:-50% 0; bottom:clamp(10px,2.2svh,26px); width:min(90vw,60ch);
  margin:0; font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.26em;
  font-size:11.5px; color:var(--ink-soft); font-weight:600; opacity:.7; text-align:center; pointer-events:none}
.herotext{position:absolute; left:50%; translate:-50% 0; top:0; width:min(60ch,90vw);
  text-align:center; opacity:0; pointer-events:none}
.herotext.visible{pointer-events:auto}
.herotext h1{font-size:clamp(28px,3.4vw,48px); letter-spacing:-.005em}
.herotext h1 em{font-style:italic; color:var(--rojo)}
.herolead{margin-top:14px; max-width:54ch; margin-inline:auto; font-size:clamp(16.5px,1.4vw,18.5px); color:var(--ink-soft)}
.herolead b{color:var(--ink); font-weight:600}
.heroctas{display:flex; flex-wrap:wrap; gap:14px; margin-top:20px; justify-content:center}
.scrollcue{position:absolute; bottom:18px; left:50%; translate:-50% 0; width:1px; height:42px; background:linear-gradient(var(--filete), transparent)}

/* ---------- accesos ---------- */
nav.main .menu[hidden]{display:none}
.tiles{display:grid; grid-template-columns:repeat(5,1fr); gap:22px; margin-top:clamp(34px,4vw,60px)}
@media (max-width:1240px){ .tiles{grid-template-columns:repeat(3,1fr)} }
@media (max-width:1180px) and (min-width:1001px){
  .redes-top{display:none}
  /* con «Tienda» en el menú, en pantallas medianas hay que apretar un poco los enlaces */
  .bar{gap:14px}
  nav.main a.lnk, nav.main button.lnk{padding:9px 7px; font-size:16px; letter-spacing:.10em}
}
.tile{
  background:var(--surface); border:1px solid var(--filete); padding:0 24px 20px; text-decoration:none;
  display:grid; gap:18px; align-content:space-between; min-height:212px; position:relative;
  transition:border-color .2s ease, transform .2s ease;
}
.tile::before{content:""; display:block; height:4px; margin-inline:-24px; background:var(--c,var(--rojo))}
.tile:hover{transform:translateY(-3px); border-color:var(--marino)}
.tile .logo{display:grid; place-items:center; min-height:98px; padding-top:8px}
.tile .logo img{width:100%; max-height:100px; object-fit:contain}
.tile .lbl{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.19em; font-size:12px;
  color:var(--ink-soft); text-align:center; border-top:1px solid var(--filete); padding-top:15px; font-weight:600;
  min-height:53px; line-height:1.5; text-wrap:balance}

/* ---------- banda del grabado ---------- */
.manifesto{position:relative; isolation:isolate; color:#FBFAF7; overflow:hidden}
.manifesto img.bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2;
  /* anclado abajo: en pantallas anchas el recorte se comía el libro abierto del grabado */
  object-position:50% 93%}
.manifesto::after{content:""; position:absolute; inset:0; background:rgba(14,40,63,.82); z-index:-1}
.manifesto .wrap{padding-block:clamp(72px,9vw,128px); text-align:center; display:grid; justify-items:center; gap:24px}
.manifesto blockquote{margin:0; font-size:clamp(31px,4.6vw,58px); max-width:20ch; line-height:1.12}
.manifesto blockquote em{font-style:italic; color:#EBC98A}
.manifesto cite{font-style:normal; font-family:"Cormorant Garamond",serif; font-size:13.5px; letter-spacing:.24em; text-transform:uppercase; color:#A9BACB}

section.band{padding-block:clamp(54px,6.6vw,96px)}
main.band{padding-block:clamp(30px,3.4vw,46px) clamp(56px,7vw,104px)}
.band.alt{background:var(--papel-2)}
.head{margin-bottom:40px; display:flex; flex-wrap:wrap; gap:18px 30px; align-items:end; justify-content:space-between}
.head h2{font-size:clamp(36px,4.8vw,62px)}
.lead{max-width:64ch; color:var(--ink-soft); font-size:18.5px; margin-top:18px}

.axes{display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--filete)}
.axis{padding:34px 30px 30px; border-right:1px solid var(--filete); border-top:4px solid var(--c)}
.axis:last-child{border-right:0}
.axis.r{--c:var(--rojo)} .axis.m{--c:var(--azul)} .axis.j{--c:var(--verde)}
.axis .badge{display:none}
.axis .k{font-family:"Cormorant Garamond",serif; font-size:34px; font-weight:600; line-height:1; color:var(--c)}
.axis .sub{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.24em; font-size:12px; color:var(--ink-soft); margin:10px 0 16px; font-weight:600}
.axis p{font-size:16.5px; color:var(--ink-soft)}

.projects{display:grid; border-top:1px solid var(--filete)}
.proj{border-bottom:1px solid var(--filete); transition:background .2s ease, box-shadow .2s ease}
.proj>summary{list-style:none; cursor:pointer; padding:28px 8px 28px 4px; display:flex; gap:24px; align-items:center;
  transition:padding .2s ease}
.proj>summary::-webkit-details-marker{display:none}
.proj .num{font-family:"Cormorant Garamond",serif; font-size:15px; letter-spacing:.1em; color:var(--pc); font-weight:600; width:26px; flex:none; align-self:flex-start; padding-top:8px}
.proj .tbox{flex:1; min-width:0}
.proj .ttl{display:block; font-family:"Cormorant Garamond",serif; font-size:clamp(25px,2.7vw,33px); font-weight:500; line-height:1.08; transition:color .18s ease}
.proj .claim{display:block; font-family:"Cormorant Garamond",serif; font-style:italic; font-size:17.5px; line-height:1.3; color:var(--ink-soft); margin-top:6px}
.proj:hover>summary .ttl{color:var(--pc)}
.proj .kind{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.22em; font-size:12px; color:var(--ink-soft); font-weight:600; flex:none}
.proj .plus{width:20px;height:20px;position:relative;flex:none;opacity:.5}
.proj .plus::before,.proj .plus::after{content:"";position:absolute;inset:50% 0 auto;height:1.5px;background:var(--ink)}
.proj .plus::after{transform:rotate(90deg); transition:transform .22s ease}
.proj[open] .plus::after{transform:rotate(0)}
.proj[open]{background:var(--surface); box-shadow:inset 4px 0 0 var(--pc)}
.proj[open]>summary{padding-left:24px}
.proj[open] .ttl{color:var(--pc)}
.proj .body{padding:0 8px 34px 74px; display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,.88fr); gap:38px; align-items:start}
.proj[open] .body{padding-left:94px}
.proj .body p{color:var(--ink-soft); margin:0}
.proj .body .lateral{display:grid; gap:18px; justify-items:start;
  border-left:1px solid var(--filete); padding-left:28px}
.meta{display:flex; flex-wrap:wrap; gap:9px}
.chip{font-family:"Cormorant Garamond",serif; font-size:13px; letter-spacing:.14em; text-transform:uppercase; font-weight:600;
  border:1px solid var(--filete); padding:5px 12px; color:var(--ink-soft)}
.proj .body .btn{justify-self:start; padding:11px 22px; font-size:13px}

/* --- quiénes somos --- */
.qshero{display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,1fr); gap:clamp(30px,4vw,58px); align-items:start}
.qshero .display{font-size:clamp(38px,6vw,82px); line-height:.99; margin-top:6px}
.qshero .tagline{margin-top:16px}
.qsintro{display:grid; gap:19px; padding-top:clamp(6px,2.4vw,34px); max-width:56ch}
.qsintro p{color:var(--ink-soft); margin:0}
.qsintro .grande{font-size:20.5px; color:var(--ink)}

.cita{font-family:"Cormorant Garamond",serif; font-style:italic; text-align:center; color:var(--ink);
  font-size:clamp(27px,4.2vw,50px); line-height:1.12; max-width:26ch; margin:clamp(46px,6vw,74px) auto}
.cita::before{content:""; display:block; width:56px; height:2px; background:var(--rojo); margin:0 auto 24px}
.cita.verde::before{background:var(--verde)}
.cita.azul::before{background:var(--azul)}
.trascita{max-width:60ch; margin:calc(-1 * clamp(22px,3vw,34px)) auto 0; display:grid; gap:16px; text-align:center}
.trascita p{margin:0; color:var(--ink-soft)}
.trascita .fuerte{color:var(--ink); font-size:19.5px}

.qs2{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.55fr); gap:clamp(26px,4vw,54px);
  align-items:start; margin-top:56px; padding-top:30px; border-top:1px solid var(--filete)}
.qs2 .lado{position:sticky; top:152px}
.qs2 .lado h3{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.07;
  font-size:clamp(26px,2.9vw,36px)}
.qs2 .txt{display:grid; gap:20px; max-width:64ch}
.qs2 .txt p{color:var(--ink-soft); margin:0}
.qs2 .txt .destacado{border-left:3px solid var(--rojo); padding-left:20px; color:var(--ink); font-size:18.5px}

.bloque{margin-top:60px; padding-top:30px; border-top:1px solid var(--filete)}
.bloque>h3{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.05;
  font-size:clamp(28px,3.4vw,42px)}
.bloque>.sub{max-width:64ch; color:var(--ink-soft); font-size:18px; margin-top:14px}

.razones{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:32px; border-top:1px solid var(--filete)}
.razon{padding:26px 26px 30px; border-right:1px solid var(--filete); border-bottom:1px solid var(--filete)}
.razon:nth-child(3n){border-right:0}
.razon .n{display:block; font-family:"Cormorant Garamond",serif; font-size:14px; letter-spacing:.22em;
  font-weight:600; margin-bottom:12px; color:var(--rojo)}
.razon:nth-child(3n+2) .n{color:var(--verde)}
.razon:nth-child(3n) .n{color:var(--azul)}
.razon p{color:var(--ink-soft); font-size:16.5px; margin:0}


.ejes3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:36px;
  border-top:1px solid var(--filete)}
.eje{display:flex; flex-direction:column; gap:14px; padding:0 clamp(20px,2.2vw,32px) 34px;
  border-right:1px solid var(--filete); position:relative}
.eje::before{content:""; position:absolute; top:-1px; left:0; right:0; height:3px; background:var(--c)}
.eje:first-child{padding-left:0}
.eje:last-child{border-right:0; padding-right:0}

.eje .ejekick{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.26em;
  font-size:14.5px; font-weight:600; color:var(--c); margin:30px 0 2px;
  padding-bottom:16px; border-bottom:1px solid var(--filete)}
.eje .ejetag{font-family:"Cormorant Garamond",serif; font-style:italic; line-height:1.16; margin:6px 0 2px;
  font-size:clamp(20px,2vw,26px); color:var(--ink)}
.eje p{color:var(--ink-soft); font-size:16.5px; line-height:1.62; margin:0}
.eje .cierraeje{margin-top:auto; padding-top:19px; border-top:2px solid var(--c);
  font-family:"Cormorant Garamond",serif; font-size:20.5px; line-height:1.3;
  color:var(--ink); font-weight:500}

.haceres{display:grid; gap:0; border-top:1px solid var(--filete); margin:2px 0}
.haceres span{padding:13px 0 13px 24px; border-bottom:1px solid var(--filete); position:relative;
  color:var(--ink); font-size:17px}
.haceres span::before{content:""; position:absolute; left:0; top:22px; width:11px; height:2px; background:var(--verde)}

.manifiesto{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:30px; border-top:1px solid var(--filete)}
.manifiesto div{padding:24px 24px 28px; border-right:1px solid var(--filete); border-bottom:1px solid var(--filete);
  color:var(--ink); font-size:17px; font-family:"Cormorant Garamond",serif; line-height:1.3}
.manifiesto div{font-size:19.5px}
.manifiesto div:nth-child(3n){border-right:0}

.firma{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.24em;
  font-size:13px; font-weight:600; color:var(--ink-soft); text-align:center; margin-top:-26px}

#qs-top,#qs-porque,#qs-ejes,#qs-equipo,#qs-colab,#qs-alianzas,#eps-droma,#sq-droma,
#sec-eps,#sec-sabias{scroll-margin-top:150px}
.ep[id^="ep-"]{scroll-margin-top:150px}
.ep.destacado{outline:2px solid var(--rojo); outline-offset:10px}

.trabajo{display:grid; gap:20px; max-width:66ch; margin-top:clamp(18px,2.4vw,30px)}
.trabajo p{margin:0; color:var(--ink-soft); font-size:19px; line-height:1.62}
.trabajo p:first-child{color:var(--ink); font-size:clamp(21px,2.2vw,26px); line-height:1.4;
  font-family:"Cormorant Garamond",serif}
.botonera{display:flex; flex-wrap:wrap; gap:12px; margin-top:8px}

/* --- formularios --- */
.ftabs{display:flex; flex-wrap:wrap; gap:8px; margin:32px 0 0}
.ftabs button{font-family:"Cormorant Garamond",serif; text-transform:uppercase;
  letter-spacing:.16em; font-size:12px; font-weight:600; color:var(--ink-soft);
  background:none; border:1px solid var(--filete); padding:11px 18px; cursor:pointer;
  transition:all .18s ease}
.ftabs button:hover{color:var(--ink); border-color:var(--ink-soft)}
.ftabs button[aria-pressed="true"]{color:var(--papel); background:var(--ink); border-color:var(--ink)}

.formbox{margin-top:30px; max-width:900px; background:var(--surface);
  border:1px solid var(--filete); border-top:3px solid var(--c);
  padding:clamp(28px,3.2vw,44px)}
.fhead{max-width:64ch; margin-bottom:34px}
.fhead h3{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.08;
  font-size:clamp(28px,3.4vw,42px); margin:0}
.fhead p{color:var(--ink-soft); font-size:18px; margin:14px 0 0}
.fhead .fnota{border-left:3px solid var(--c); padding-left:18px; font-size:16.5px; color:var(--ink)}

.dosformas{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:0;
  border-top:1px solid var(--filete); margin-bottom:42px}
.dform{padding:26px clamp(20px,2.2vw,30px) 30px; border-right:1px solid var(--filete);
  display:flex; flex-direction:column; gap:12px; position:relative}
.dform::before{content:""; position:absolute; top:-1px; left:0; right:0; height:3px; background:var(--c)}
.dform:last-child{border-right:0}
.dform:first-child{padding-left:0}
.dform .dk{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em;
  font-size:12.5px; font-weight:600; color:var(--c); margin:0}
.dform .dt{margin:0; color:var(--ink); font-size:17px; line-height:1.55}
.dform .dpie{margin:auto 0 0; color:var(--ink-soft); font-size:14.5px; line-height:1.5}
.dform .btn{align-self:start}
.dcod{display:flex; align-items:baseline; gap:12px; margin:0; flex-wrap:wrap}
.dcod span{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.16em;
  font-size:11.5px; font-weight:600; color:var(--ink-soft)}
.dcod b{font-family:"Cormorant Garamond",serif; font-size:30px; letter-spacing:.24em;
  color:var(--ink); font-weight:600; line-height:1}
.dmaq{margin:0; color:var(--ink-soft); font-size:14.5px; border-left:2px solid var(--azul); padding-left:12px}
.fsub{font-family:"Cormorant Garamond",serif; font-weight:500; font-size:26px; margin:0 0 10px}

.fmgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 26px}
.fcampo{display:grid; gap:9px; grid-column:1/-1; align-content:start}
.fcampo.mitad{grid-column:auto}
.flabel{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.14em;
  font-size:12px; font-weight:600; color:var(--ink)}
.flabel .req{color:var(--rojo)}
.fcampo input[type="text"],.fcampo input[type="email"],.fcampo input[type="tel"],.fcampo textarea{
  font-family:inherit; font-size:16.5px; color:var(--ink); background:var(--papel);
  border:1px solid var(--filete); border-radius:0; padding:13px 14px; width:100%;
  transition:border-color .18s ease}
.fcampo textarea{resize:vertical; line-height:1.55}
.fcampo input:focus,.fcampo textarea:focus{outline:none; border-color:var(--c)}
.fcampo.mal input,.fcampo.mal textarea{border-color:var(--rojo)}
.fcampo.mal .opciones{outline:1px solid var(--rojo); outline-offset:8px}

.opciones{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px 22px}
.op{display:flex; align-items:center; gap:10px; cursor:pointer; color:var(--ink-soft);
  font-size:16.5px; transition:color .15s ease}
.op:hover{color:var(--ink)}
.op input{width:17px; height:17px; accent-color:var(--c); flex:0 0 auto; margin:0}

.fpie{display:flex; flex-wrap:wrap; align-items:center; gap:16px 22px; margin-top:34px;
  padding-top:26px; border-top:1px solid var(--filete)}
.dmes{margin:16px 0 8px; color:var(--ink-soft); font-size:14px}
.dcuotas{display:flex; flex-wrap:wrap; gap:8px}
.dcuotas a{display:inline-flex; align-items:baseline; gap:5px; padding:8px 13px; text-decoration:none;
  border:1px solid var(--filete); color:var(--ink); background:var(--surface); line-height:1}
.dcuotas a:hover{border-color:var(--c); color:var(--c)}
.dcuotas a b{font-size:16px; font-weight:600}
.dcuotas a span{font-size:12.5px; color:var(--ink-soft)}
.fobl{margin:0; color:var(--ink-soft); font-size:14.5px}
/* el campo trampa: invisible para las personas, no para los robots */
.ftrampa{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}
.ferror{flex:1 1 100%; margin:0; padding:12px 16px; background:#FBECE8; border-left:3px solid var(--rojo);
  color:var(--ink); font-size:15px; line-height:1.55}
.formu button[type=submit][disabled]{opacity:.6; cursor:progress}
.fok{border-left:3px solid var(--c); padding:6px 0 6px 22px; max-width:60ch}
.fok .fokt{font-family:"Cormorant Garamond",serif; font-size:26px; color:var(--ink); margin:0 0 10px}
.fok p{color:var(--ink-soft); margin:0}

/* --- noticias --- */
.ncard{display:grid; gap:9px; align-content:start; padding-top:17px;
  border-top:2px solid var(--c); text-decoration:none; color:inherit}
.ncard .nmeta{display:flex; flex-wrap:wrap; gap:4px 14px; align-items:baseline;
  font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.18em;
  font-size:11.5px; font-weight:600}
.ncard .ntipo{color:var(--c)}
.ncard .nfecha{color:var(--ink-soft)}
.ncard h3{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.14;
  font-size:clamp(21px,1.9vw,25px); color:var(--ink); margin:0; transition:color .18s ease}
.ncard p{color:var(--ink-soft); font-size:16.5px; line-height:1.58; margin:0}
.ncard .ncta{font-size:13.5px; color:var(--ink); justify-self:start; margin-top:3px;
  border-bottom:1px solid var(--c); padding-bottom:2px}
.ncard:hover h3{color:var(--c)}
.ncard.big h3{font-size:clamp(26px,2.9vw,38px)}
.ncard.big p{font-size:18px; max-width:52ch}

/* listado de noticias en filas */
.nlista{margin-top:clamp(28px,3.2vw,40px); border-top:1px solid var(--filete)}
.nrow{display:grid; grid-template-columns:minmax(0,150px) minmax(0,1fr) 230px;
  gap:clamp(20px,3vw,46px); align-items:start; padding:clamp(26px,3vw,36px) 0;
  border-bottom:1px solid var(--filete); text-decoration:none; color:inherit; position:relative}
.nrow::before{content:""; position:absolute; top:-1px; left:0; width:0; height:2px;
  background:var(--c); transition:width .32s ease}
.nrow:hover::before{width:100%}
.nrow .nlado{display:grid; gap:6px; align-content:start; padding-top:6px;
  font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.18em;
  font-size:11.5px; font-weight:600}
.nrow .ntipo{color:var(--c)}
.nrow .nfecha{color:var(--ink-soft); letter-spacing:.12em}
.nrow .ntxt{display:grid; gap:10px; align-content:start}
.nrow h3{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.14; margin:0;
  font-size:clamp(23px,2.2vw,29px); color:var(--ink); transition:color .18s ease}
.nrow p{margin:0; color:var(--ink-soft); font-size:16.5px; line-height:1.6; max-width:62ch}
.nrow .ncta{font-size:13.5px; color:var(--ink-soft); justify-self:start;
  border-bottom:1px solid var(--c); padding-bottom:2px; margin-top:2px; transition:color .18s ease}
.nrow:hover h3,.nrow:hover .ncta{color:var(--c)}
.nrow .nfoto{overflow:hidden}
.nrow .nfoto img{width:100%; aspect-ratio:3/2; object-fit:cover; display:block;
  transition:transform .4s ease}
.nrow:hover .nfoto img{transform:scale(1.04)}
.nrow.sinfoto .ntxt{grid-column:2/-1}
.nrow.dest{padding-top:clamp(30px,3.4vw,42px)}
.nrow.dest h3{font-size:clamp(28px,3.2vw,42px)}
.nrow.dest p{font-size:18px}
.nfiltros .cnt{font-size:10.5px; letter-spacing:.06em; opacity:.6; margin-left:8px; font-weight:600}

.nfiltros{display:flex; flex-wrap:wrap; gap:8px; margin:30px 0 4px}
.nfiltros button{font-family:"Cormorant Garamond",serif; text-transform:uppercase;
  letter-spacing:.16em; font-size:12px; font-weight:600; color:var(--ink-soft);
  background:none; border:1px solid var(--filete); padding:9px 16px; cursor:pointer;
  transition:all .18s ease}
.nfiltros button:hover{color:var(--ink); border-color:var(--ink-soft)}
.nfiltros button[aria-pressed="true"]{color:var(--papel); background:var(--ink); border-color:var(--ink)}

.ngrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px 30px; margin-top:34px}
.ngrid .ncard.big{grid-column:span 2}
.nvacio{color:var(--ink-soft); font-size:17px; margin-top:34px}

.proxi{margin-top:30px; border-top:1px solid var(--filete); padding-top:22px}
.proxi .pxk{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.24em;
  font-size:12px; font-weight:600; color:var(--ink-soft); margin:0 0 16px}
.proxi .pxl{display:grid; gap:12px}
.proxi a{display:grid; grid-template-columns:minmax(0,190px) minmax(0,1fr); gap:20px;
  text-decoration:none; color:inherit; border-left:3px solid var(--verde); padding:12px 0 12px 20px}
.proxi a:hover .pxt{color:var(--verde)}
.proxi .pxf{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.16em;
  font-size:12px; font-weight:600; color:var(--verde); padding-top:5px}
.proxi .pxt{font-family:"Cormorant Garamond",serif; font-size:22px; line-height:1.18; transition:color .18s ease}
.proxi .pxs{color:var(--ink-soft); font-size:16px; margin:5px 0 0}

/* carrusel de portada */
.head.ultimo{align-items:end; margin-bottom:0}
.mandos{display:flex; align-items:center; gap:14px}
.carru-wrap{position:relative; margin-top:clamp(26px,3vw,38px); border-top:1px solid var(--filete)}
.carru-wrap::after{content:""; position:absolute; top:0; right:-1px; bottom:0; width:70px;
  background:linear-gradient(to right, transparent, var(--papel)); pointer-events:none}
.carru{display:flex; gap:0; overflow-x:auto; scroll-snap-type:x mandatory;
  scrollbar-width:none; padding-bottom:2px}
.carru::-webkit-scrollbar{display:none}
.carru .ncard{flex:0 0 clamp(260px,31%,360px); scroll-snap-align:start;
  display:flex; flex-direction:column; gap:10px; border-top:0;
  padding:26px clamp(20px,2.2vw,30px) 30px; border-right:1px solid var(--filete);
  position:relative; transition:background .22s ease}
.carru .ncard::before{content:""; position:absolute; top:-1px; left:0; right:0; height:3px;
  background:var(--c); transform:scaleX(.34); transform-origin:left; transition:transform .3s ease}
.carru .ncard:hover::before{transform:scaleX(1)}
.carru .ncard:hover{background:var(--surface)}
.carru .ncard:first-child{padding-left:0}
.carru .ncard .nmeta{flex-direction:column; gap:4px}
.carru .ncard h3{font-size:clamp(21px,2vw,25px)}
.carru .ncard p{display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;
  overflow:hidden; font-size:16px}
.carru .ncard .ncta{margin-top:auto; padding-top:14px; border-bottom:0; color:var(--ink-soft);
  transition:color .18s ease}
.carru .ncard:hover .ncta{color:var(--c)}

.carru-nav{display:flex; gap:8px}
.carru-nav button{width:42px; height:42px; border:1px solid var(--filete); background:none;
  cursor:pointer; color:var(--ink); font-size:16px; line-height:1; transition:all .18s ease}
.carru-nav button:hover{border-color:var(--ink); background:var(--ink); color:var(--papel)}
.carru-nav button[disabled]{opacity:.3; cursor:default}
.carru-nav button[disabled]:hover{border-color:var(--filete); background:none; color:var(--ink)}

/* ficha de una noticia */
.nficha{max-width:68ch}
.nficha .nmeta{display:flex; flex-wrap:wrap; gap:4px 16px; align-items:baseline;
  font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em;
  font-size:12px; font-weight:600; margin-bottom:14px}
.nficha .ntipo{color:var(--c)} .nficha .nfecha{color:var(--ink-soft)}
.nficha h2{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.06;
  font-size:clamp(32px,4.2vw,54px); margin:0}
.nficha .nlead{font-size:20px; color:var(--ink); margin:20px 0 0; line-height:1.5}
.nficha .ncuerpo{display:grid; gap:18px; margin-top:26px}
.nficha .ncuerpo p{color:var(--ink-soft); margin:0}
.nficha .nfoot{margin-top:34px; padding-top:24px; border-top:2px solid var(--c); display:flex; flex-wrap:wrap; gap:12px}
/* galería y medios dentro de la ficha de una noticia */
.ngal{display:grid; gap:14px; margin:12px 0 4px}
.ngal figure{margin:0}
.ngal img{width:100%; height:auto; display:block; background:var(--surface)}
.ngal > figure > img{aspect-ratio:3/2; object-fit:cover}
.ngal .fila{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px}
.ngal .fila img{aspect-ratio:4/3; object-fit:cover}
.ngal figcaption{margin-top:9px; font-size:14px; line-height:1.45; color:var(--ink-soft)}
.nmedia{margin:24px 0 4px}
.nmedia .npar{display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:18px}
.nmedia figure{margin:0}
.nmedia figcaption{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em;
  font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:10px}
.igbox{position:relative; height:690px; border:1px solid var(--filete); background:var(--surface); overflow:hidden}
.igbox iframe{position:relative; width:100%; height:100%; border:0; display:block}
.igmsg{position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  padding:24px; text-align:center; font-size:14px; line-height:1.5; color:var(--ink-soft)}


/* --- formaciones y talleres --- */
.cifras{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em; font-size:12.5px;
  font-weight:600; color:var(--ink-soft); margin:0 0 6px}
.fmsec{margin-top:52px}
.fmhead{display:flex; align-items:baseline; justify-content:space-between; gap:20px; flex-wrap:wrap;
  padding-top:22px; border-top:2px solid var(--pc,var(--rojo)); margin-bottom:10px}
.fmsec .fmkicker{font-family:"Cormorant Garamond",serif; font-size:clamp(26px,3vw,34px); font-weight:600; line-height:1.1; margin:0}
.fmcount{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em; font-size:12.5px;
  font-weight:600; color:var(--pc,var(--rojo)); margin:0}
.fmsec:nth-of-type(1){--pc:var(--naranja)}
.fmsec:nth-of-type(2){--pc:var(--azul)}
.fmsec .fmlead{color:var(--ink-soft); max-width:74ch; margin:0 0 22px; font-size:17.5px}
.fmcta{margin-top:46px; border-top:1px solid var(--filete); padding-top:26px; display:grid; gap:16px; justify-items:start}
.fmcta p{color:var(--ink-soft); max-width:62ch; margin:0}
.proj .body .chip.nuevo{border-color:var(--naranja); color:var(--naranja)}

/* --- quiénes lo hacemos --- */
.eqhead{text-align:center; max-width:64ch; margin:0 auto 4px}
.eqhead .rule{justify-content:center}
.eqhead .eyebrow{margin:0}
.eqhead .display{font-size:clamp(38px,5.4vw,70px); line-height:1.02; margin-top:8px}
.eqlead{color:var(--ink-soft); font-size:18.5px; margin:18px auto 0; max-width:58ch}
.eqsec{margin-top:clamp(52px,6vw,78px); text-align:center}
.eqkick{font-family:"Cormorant Garamond",serif; font-weight:500; line-height:1.06; margin:0;
  font-size:clamp(27px,3.1vw,38px)}
.eqkick::after{content:""; display:block; width:48px; height:2px; background:var(--rojo); margin:16px auto 0}
.eqsec:nth-of-type(2) .eqkick::after{background:var(--verde)}
.eqsec:nth-of-type(3) .eqkick::after{background:var(--azul)}
.eqsub{color:var(--ink-soft); font-size:17.5px; margin:18px auto 34px; max-width:62ch}

.people{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0;
  max-width:880px; margin-inline:auto; border-top:1px solid var(--filete)}
.person{padding:42px 32px 46px; border-right:1px solid var(--filete); text-align:center}
.person:last-child{border-right:0}
.person h3{font-size:25px; margin-top:22px; line-height:1.12}
.person p{color:var(--ink-soft); font-size:16px; margin:14px auto 0; max-width:38ch; text-align:left}
.retrato{width:168px; height:168px; border-radius:50%; overflow:hidden; position:relative; margin-inline:auto;
  box-shadow:0 0 0 1px var(--papel-2), 0 0 0 4px var(--pc)}
.retrato img{width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(1) contrast(1.06) brightness(1.02); transition:filter .35s ease}
.person:hover .retrato img{filter:grayscale(0) contrast(1) brightness(1)}
.retrato.sinfoto{display:grid; place-items:center; background:var(--surface)}
.retrato.sinfoto span{font-family:"Cormorant Garamond",serif; font-size:30px; letter-spacing:.14em;
  color:var(--pc); font-weight:600}
.allies{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.ally{border-top:2px solid var(--ac); padding:24px 20px 28px;
  text-align:center; display:grid; align-content:start; gap:11px;
  transition:transform .18s ease}
.ally:nth-child(3n+1){--ac:var(--rojo)}
.ally:nth-child(3n+2){--ac:var(--verde)}
.ally:nth-child(3n){--ac:var(--azul)}
.ally:hover{transform:translateY(-3px)}
.ally .nm{font-family:"Cormorant Garamond",serif; font-size:22px; font-weight:600; line-height:1.18}
.ally .rl{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.16em;
  font-size:12px; font-weight:600; color:var(--ink-soft); margin:0; line-height:1.5}

.cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  border-top:1px solid var(--filete); margin-top:clamp(24px,3vw,34px)}
.card{padding:32px clamp(24px,2.4vw,34px) 38px; border-right:1px solid var(--filete);
  display:flex; flex-direction:column; gap:14px; position:relative; transition:background .22s ease}
.card::before{content:""; position:absolute; top:-1px; left:0; right:0; height:3px;
  background:var(--c,var(--rojo)); transform:scaleX(.3); transform-origin:left; transition:transform .32s ease}
.card:hover::before{transform:scaleX(1)}
.card:hover{background:var(--papel)}
.card:last-child{border-right:0}
.card h3{font-size:clamp(26px,2.6vw,32px); line-height:1.1; margin:0}
.card p{color:var(--ink-soft); font-size:16.5px; line-height:1.6; margin:0}
.card .btn{align-self:stretch; margin-top:auto; min-height:66px; text-align:center;
  padding-inline:20px; line-height:1.25}

.sheet{display:grid; grid-template-columns:1.62fr 1fr; gap:50px; align-items:start}
.facts{background:var(--surface); border:1px solid var(--filete); border-top:4px solid var(--azul); padding:30px; display:grid; gap:18px; position:sticky; top:112px}
.fact dt{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.22em; font-size:11.5px; color:var(--ink-soft); font-weight:600}
.fact dd{margin:0; font-size:16.5px}
.prose{display:grid; gap:22px}
.prose h2{font-size:clamp(38px,5vw,64px)}
.prose h3{font-size:30px; margin-top:14px}
.prose p{color:var(--ink-soft)}
.back{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.22em; font-size:12.5px; color:var(--ink-soft); text-decoration:none; display:inline-block; margin-bottom:24px; font-weight:600}
.ilo{border:1px solid var(--filete); background:var(--marino); padding:30px}
.ilo img{margin-inline:auto; max-width:min(100%,460px)}

/* ---------- ficha de la campaña: episodios y reels ---------- */
.subblock{margin-top:clamp(56px,7vw,92px)}
.subhead{max-width:66ch}
.subhead h3{font-size:clamp(30px,3.4vw,44px)}
.subhead p{color:var(--ink-soft); margin-top:14px}
.eps{display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-top:34px}
.ep{background:var(--surface); border:1px solid var(--filete); display:grid; grid-template-rows:auto 1fr}
.ep .frame{position:relative; aspect-ratio:16/9; background:var(--marino); display:grid; place-items:center; cursor:pointer; overflow:hidden; border:0; width:100%; padding:0}
.ep .frame::after{content:""; position:absolute; inset:0; z-index:1; background:
  radial-gradient(120% 90% at 50% 40%, rgba(255,255,255,.07), transparent 70%)}
.ep .frame:has(.cover)::after{background:linear-gradient(180deg, rgba(14,40,63,0), rgba(14,40,63,.16))}
.ep .cover{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; transition:transform .5s cubic-bezier(.22,.7,.3,1)}
.ep .frame:hover .cover{transform:scale(1.035)}
.ep .play{z-index:2}
.ep .dur{z-index:2}
.ep .tag{display:inline-block; font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em;
  font-size:10.5px; font-weight:600; color:var(--marino); border:1px solid var(--filete); padding:3px 8px; margin-right:9px;
  transform:translateY(-1px)}
.ep .frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0; z-index:2}
.ep .play{position:relative; width:78px; height:78px; border-radius:50%; border:2px solid rgba(255,255,255,.95);
  background:rgba(14,40,63,.62); box-shadow:0 2px 22px rgba(14,40,63,.35); display:grid; place-items:center; transition:transform .25s ease, background .25s ease, border-color .25s ease}
.ep .frame:hover .play{transform:scale(1.07); background:var(--rojo); border-color:var(--rojo)}
.ep .play i{display:block; width:0; height:0; border-left:19px solid #fff; border-top:12px solid transparent; border-bottom:12px solid transparent; margin-left:6px}
.ep .dur{position:absolute; right:11px; bottom:10px; font-weight:600; font-size:12.5px; letter-spacing:.02em;
  font-variant-numeric:tabular-nums; color:#fff; background:rgba(14,40,63,.78); padding:4px 9px; border-radius:2px}
.ep .epmeta{padding:19px 24px 21px; display:grid; gap:0; align-content:start}
.ep .epmeta h4{margin-top:14px}
.ep .epmeta p{margin-top:1px; line-height:1.45}
.ep .epmeta .yt{margin-top:11px}
.ep .epkind{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.24em; font-size:11px; color:var(--ink-soft); font-weight:600}
.ep h4{font-family:"Cormorant Garamond",serif; font-weight:500; font-size:24px; line-height:1.15}
.ep .epmeta p{color:var(--ink-soft); font-size:15.5px}
.ep .extra{display:flex; align-items:center; gap:11px; margin-top:13px; padding:11px 13px; text-decoration:none;
  background:var(--papel-2); border:1px solid var(--filete); color:var(--ink-soft); font-size:14px; line-height:1.35;
  transition:border-color .2s ease, color .2s ease, background .2s ease}
.ep .extra b{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.18em; font-size:10.5px; color:var(--marino)}
.ep .extra i{flex:none; width:0; height:0; border-left:10px solid var(--rojo); border-top:6.5px solid transparent; border-bottom:6.5px solid transparent}
.ep .extra:hover{border-color:var(--marino); color:var(--ink); background:var(--surface)}
.ep .yt{font-size:13.5px; line-height:1.2; color:var(--azul); text-decoration:none; border-bottom:1px solid var(--filete); padding-bottom:2px; justify-self:start; margin-top:4px}
.ep .yt:hover{border-color:var(--azul)}
.reels{display:grid; grid-template-columns:292px 1fr; gap:30px; margin-top:34px; align-items:start}
.sqcover{border:1px solid var(--filete); overflow:hidden; background:var(--papel-2)}
.sqcover img{width:100%; height:100%; object-fit:cover; display:block}
.sqlist{display:grid; grid-template-columns:repeat(2,1fr); gap:20px; align-content:start}
.sq{position:relative; background:var(--c,var(--azul)); color:#fff; text-decoration:none; overflow:hidden;
  padding:26px 24px 22px; min-height:148px; display:grid; grid-template-rows:1fr auto; gap:14px; text-align:center;
  transition:transform .2s ease, box-shadow .2s ease}
.sq::after{content:""; position:absolute; inset:0; background:rgba(255,255,255,0); transition:background .2s ease}
.sq:nth-child(1){--c:var(--verde)} .sq:nth-child(2){--c:var(--violeta)} .sq:nth-child(3){--c:var(--naranja)}
.sq:nth-child(4){--c:var(--rojo)}  .sq:nth-child(5){--c:var(--marino)}
.sq:nth-child(5){grid-column:1 / -1}
.sq:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(14,40,63,.16)}
.sq:hover::after{background:rgba(255,255,255,.08)}
.sq .tt{position:relative; z-index:1; font-size:21px; font-weight:600; line-height:1.22; letter-spacing:.005em;
  align-self:center; text-wrap:balance}
.sq .foot{position:relative; z-index:1; display:flex; align-items:center; justify-content:center; gap:10px;
  border-top:1px solid rgba(255,255,255,.28); padding-top:13px}
.sq .c{text-transform:uppercase; letter-spacing:.2em; font-size:11px; font-weight:600; color:rgba(255,255,255,.82)}
.sq .ar{color:rgba(255,255,255,.82); font-size:14px; transition:transform .2s ease}
.sq:hover .ar{transform:translate(2px,-2px); color:#fff}
.facts.roja{border-top-color:var(--rojo)}
.hashbig{width:100%; max-width:420px; height:auto; margin:2px 0 6px}
.camplogo img{width:100%; max-width:340px; height:auto}
@media (max-width:1000px){
  .eps{grid-template-columns:1fr}
  .reels{grid-template-columns:1fr}
  .sqcover{max-height:300px}
  .sqcover img{object-position:50% 40%}
  .sqlist{grid-template-columns:1fr}
  .sq, .sq:nth-child(5){min-height:0}
}

footer.site{background:var(--marino); color:#B9C4D0; padding-block:0 36px}
footer.site a{color:#fff; text-decoration:none}
footer.site a:hover{text-decoration:underline}
.finner{padding-top:56px}
.fgrid{display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:40px}
footer .flogo{background:#fff; padding:18px 22px; display:inline-block}
footer .flogo img{height:116px; width:auto}
footer h4{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.24em; font-size:12.5px; color:#fff; margin-bottom:16px; font-weight:600}
footer ul{list-style:none; padding:0; margin:0; display:grid; gap:10px; font-size:15.5px}
footer ul a{color:inherit; text-decoration:none; border-bottom:1px solid transparent; transition:border-color .18s ease}
footer ul a:hover{border-color:currentColor}
.redes{display:flex; gap:12px; margin-top:22px}
.redes a{width:42px; height:42px; display:grid; place-items:center;
  border:1px solid rgba(251,250,247,.28); transition:all .2s ease}
.redes a:hover{border-color:#FBFAF7; background:#FBFAF7}
.redes svg{width:21px; height:21px; fill:none; stroke:#FBFAF7; stroke-width:1.6;
  stroke-linejoin:round; transition:stroke .2s ease, fill .2s ease}
.redes svg .pt{fill:#FBFAF7; stroke:none}
.redes svg .pl{fill:#FBFAF7; stroke:none}
.redes a:hover svg{stroke:var(--marino)}
.redes a:hover svg .pt,.redes a:hover svg .pl{fill:var(--marino)}
.legal{border-top:1px solid rgba(255,255,255,.15); margin-top:40px; padding-top:20px; font-size:13px; color:#8D99A6; line-height:1.6}

/* En WordPress cada vista es su propia página. */
.reveal{opacity:0; transform:translateY(16px)}
.reveal.in{opacity:1; transform:none; transition:opacity .7s cubic-bezier(.22,.7,.3,1), transform .7s cubic-bezier(.22,.7,.3,1)}

@media (max-width:1000px){
  .cloud{--cw:92vw}
  .stage{height:165svh}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .tiles .tile:last-child{grid-column:1 / -1}
  .axes,.people,.cards3,.allies{grid-template-columns:1fr}
  .axis,.person,.card,.ally{border-right:0; border-bottom:1px solid var(--filete)}
  .sheet{grid-template-columns:1fr}
  .facts{position:static}
  .fgrid{grid-template-columns:1fr}
  /* el desenfoque crea un bloque contenedor y el panel fijo no saldría de la cabecera */
  header.site{background:var(--papel); backdrop-filter:none}
  .cerrarnav{display:grid}
  nav.main{position:fixed; inset:0 0 0 auto; width:min(340px,86vw); background:var(--papel); z-index:70;
    flex-direction:column; align-items:stretch; padding:100px 24px 28px; gap:4px; overflow:auto; border-left:1px solid var(--filete)}
  nav.main:not(.open){display:none}
  nav.main .menu{position:static; box-shadow:none; border:0; border-top:1px solid var(--filete); background:transparent; padding-left:10px; min-width:0}
  nav.main a.lnk, nav.main button.lnk{font-size:20px; padding:12px 6px; justify-content:flex-start}
  .burger{display:block}
  .brand img{height:44px}
  .langs{gap:9px}
  .redes-top{padding-right:9px; gap:0}
  .redes-top a{width:28px; height:28px}
}
@media (prefers-reduced-motion: reduce){
  *:not(.piece){transition:none !important; animation:none !important}
  .reveal{opacity:1; transform:none}
}

/* pantallas pequeñas y bajas: la nube y el titular no caben juntos, así que van uno tras otro */
@media (max-width:900px) and (max-height:540px){
  .stage{height:auto}
  .stagefix{position:static; height:auto; overflow:visible; padding-bottom:34px}
  .cloudwrap{height:auto; transform:none !important; padding-block:26px 0}
  .cloud{height:auto; width:min(92vw, 560px); max-width:92vw}
  .herotext{position:static !important; top:auto !important; translate:none; opacity:1 !important;
    width:auto; max-width:56ch; margin:30px auto 0; pointer-events:auto}
  .scrollcue{display:none}
}

/* en el móvil el titular compite con la nube por la pantalla: se compacta */
@media (max-width:560px){
  .herotext .eyebrow{font-size:12px; letter-spacing:.17em}
  .herotext .herolead{margin-top:10px; font-size:16px; line-height:1.46}
  .herotext .heroctas{margin-top:14px; gap:10px; flex-wrap:nowrap}
  .herotext .heroctas .btn{flex:1 1 0; min-width:0; padding:12px 10px; font-size:12.5px; letter-spacing:.11em}
}

@media (max-width:460px){
  .wrap{padding-inline:16px}
  header .wrap{gap:12px}
  .brand img{height:32px}
  .langs{gap:6px}
  .langs button, .langs a{font-size:12.5px; letter-spacing:.1em}
  .burger{width:38px; height:36px}
  /* en pantallas muy estrechas los mosaicos no caben de dos en dos */
  .tiles{grid-template-columns:1fr}
  .tiles .tile{min-width:0}
  .tiles .tile:last-child{grid-column:auto}
}

/* móviles estrechos: la cabecera no cabe entera */
@media (max-width:400px){
  header .wrap{gap:8px}
  .brand img{height:28px}
  .redes-top{padding-right:6px}
  .redes-top a{width:24px; height:24px}
  .langs{gap:4px}
  .langs button, .langs a{font-size:11.5px; letter-spacing:.08em}
  .burger{width:34px; height:32px}
}
@media (max-width:1000px){
  .proj summary{gap:14px}
  .proj summary .ttl{min-width:0; overflow-wrap:anywhere}
  .proj summary .kind{display:none}
  .proj .body,.proj[open] .body{padding-left:24px; padding-right:4px; grid-template-columns:1fr; gap:20px}
  .proj .body .lateral{border-left:0; padding-left:0}
  .proj[open]>summary{padding-left:20px}
  .proj .claim{font-size:16.5px}
  .people{grid-template-columns:1fr}
  .person{border-right:0; border-bottom:1px solid var(--filete); padding-inline:0}
  .person:last-child{border-bottom:0}
  .retrato{width:128px; height:128px}
  .eqsec{text-align:left}
  .eqkick::after{margin-inline:0}
  .eqsub,.eqlead{margin-inline:0}
  .eqhead{text-align:left}
  .eqhead .rule{justify-content:flex-start}
  .person{text-align:center}
  .allies{grid-template-columns:repeat(2,minmax(0,1fr))}
}

.dromalogo{max-width:360px; margin-bottom:4px}
.tagline{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:clamp(21px,2.3vw,27px);
  color:var(--rojo); line-height:1.25; margin-top:-4px}
.prose .remate{border-left:3px solid var(--filete); padding-left:20px; color:var(--ink); font-size:18px}
.prose .cierre{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.2em;
  font-size:13px; font-weight:600; color:var(--ink-soft); border-top:1px solid var(--filete); padding-top:20px}

.facts .dosbtn{display:grid; gap:10px; margin-top:4px}
.facts .dosbtn .btn{width:100%; text-align:center; justify-content:center}

.facts.verde{border-top-color:var(--verde)}
.romanin{background:var(--papel-2); border:1px solid var(--filete); padding:26px; display:grid; place-items:center}
.romanin img{width:100%; max-width:380px; height:auto}
.prose .listado{list-style:none; margin:4px 0 0; padding:0; display:grid; gap:10px}
.prose .listado li{padding-left:22px; position:relative; color:var(--ink); font-size:17.5px}
.prose .listado li::before{content:""; position:absolute; left:0; top:11px; width:10px; height:2px; background:var(--verde)}

.creditos{margin:6px 0 0; padding:24px 26px; background:var(--surface); border:1px solid var(--filete);
  display:grid; gap:16px}
.creditos > div{display:grid; grid-template-columns:minmax(0,18em) minmax(0,1fr); gap:10px 26px; align-items:baseline}
.creditos dt{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.16em; font-size:10.5px;
  font-weight:600; color:var(--ink-soft)}
.creditos dd{margin:0; font-size:16.5px; color:var(--ink)}
.financiacion{margin-top:14px; border-top:1px solid var(--filete); padding-top:26px; display:grid; gap:20px; justify-items:start}
.financiacion .fila{display:flex; flex-wrap:wrap; align-items:center; gap:clamp(18px,2.4vw,34px)}
.financiacion .fila img{height:44px; width:auto; max-width:100%}
@media (max-width:700px){ .financiacion .fila{gap:24px} .financiacion .fila img{height:46px} }
@media (max-width:700px){ .creditos > div{grid-template-columns:1fr; gap:3px} }

.facts.violeta{border-top-color:var(--violeta)}
.romizorlogo{max-width:420px}
.palabras{display:flex; flex-wrap:wrap; gap:9px; margin:2px 0}
.palabras span{font-family:"Cormorant Garamond",serif; text-transform:uppercase; letter-spacing:.16em; font-size:11px;
  font-weight:600; color:var(--marino); border:1px solid var(--filete); background:var(--surface); padding:8px 13px}
.ejes{display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; border-top:1px solid var(--filete); padding-top:26px}
.ejes span{font-family:"Cormorant Garamond",serif; font-size:23px; font-weight:500; color:var(--violeta);
  border:1px solid var(--filete); padding:9px 18px; background:var(--surface)}

@media (max-width:1000px){
  .qshero{grid-template-columns:1fr; gap:24px}
  .qsintro{max-width:none; padding-top:0}
  .qs2{grid-template-columns:1fr; gap:20px; margin-top:44px}
  .qs2 .lado{position:static}
  .qs2 .txt{max-width:none}
  .razones,.manifiesto{grid-template-columns:repeat(2,minmax(0,1fr))}
  .razon:nth-child(3n),.manifiesto div:nth-child(3n){border-right:1px solid var(--filete)}
  .razon:nth-child(2n),.manifiesto div:nth-child(2n){border-right:0}
  .ejes3{grid-template-columns:1fr; margin-top:28px}
  .eje{border-right:0; padding-inline:0; padding-bottom:26px}
  .ngrid{grid-template-columns:1fr; gap:30px}
  .nrow{grid-template-columns:1fr; gap:14px; padding:26px 0}
  .nrow.sinfoto .ntxt,.nrow .ntxt{grid-column:auto}
  .nrow .nlado{display:flex; flex-wrap:wrap; gap:6px 14px; padding-top:0}
  .nrow p{font-size:16px}
  .nrow .nfoto{order:-1}
  .nrow.dest p{font-size:16.5px}
  .ngrid .ncard.big{grid-column:span 1}
  .carru .ncard{flex:0 0 84%; padding-inline:0 22px}
  .carru .ncard:hover{background:none}
  .head.ultimo .mandos{order:2}
  .carru-wrap::after{width:34px}
  .proxi a{grid-template-columns:1fr; gap:4px}
  .nficha .nlead{font-size:18px}
  .nmedia .npar{grid-template-columns:1fr}
  .ngal .fila{grid-template-columns:1fr}
  .formbox{padding:24px 20px 28px}
  .fmgrid{grid-template-columns:1fr; gap:20px}
  .dform{border-right:0; border-bottom:1px solid var(--filete); padding-inline:0}
  .dform:last-child{border-bottom:0}
  .fcampo.mitad{grid-column:1/-1}
  .opciones{grid-template-columns:1fr}
  .formbox{padding-top:26px}
  .igbox{height:580px}
  .eje::before{right:auto; width:88px}
  .eje .ejekick{margin-top:24px}
  .cita{font-size:clamp(25px,5.4vw,38px); max-width:20ch}
}
@media (max-width:640px){
  .razones,.manifiesto{grid-template-columns:1fr}
  .allies{grid-template-columns:1fr}
  .razon,.manifiesto div{border-right:0; padding-inline:0}
}