:root{
  --anil:#0C1C4A;
  --anil-hondo:#06163D;
  --anil-suave:#16295C;
  --cal:#EDEFE8;
  --cal-mudo:#9AA3B8;
  --azafran:#F4BD41;
  --azulejo:#37A0A8;
  --granate:#A32149;
  --acento:var(--azafran);

  --display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --cuerpo:"Newsreader",Georgia,"Times New Roman",serif;
  --util:"DM Mono","SFMono-Regular",Menlo,monospace;

  --max:1180px;
  --gut:clamp(20px,5vw,56px);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}
body{
  background:var(--anil);
  color:var(--cal);
  font-family:var(--cuerpo);
  font-size:clamp(16px,1.05vw,18px);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--azafran);color:var(--anil-hondo)}

/* ---------- utilidades ---------- */
.env{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.eyebrow{
  font-family:var(--util);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--acento);display:flex;align-items:center;gap:.7em;
}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;flex:none}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;line-height:.98;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,7.4vw,5.4rem)}
h2{font-size:clamp(2rem,4.6vw,3.4rem)}
h3{font-size:clamp(1.3rem,2.2vw,1.75rem);letter-spacing:-.01em}
p{max-width:62ch}
.lede{font-size:clamp(1.1rem,1.6vw,1.35rem);color:#DDE1DA;font-weight:300}
.mudo{color:var(--cal-mudo)}
a{color:inherit}
.salto{position:absolute;left:-9999px;top:0;z-index:100;background:var(--azafran);color:var(--anil-hondo);
  padding:.8em 1.2em;font-family:var(--util);font-size:.8rem;text-decoration:none}
.salto:focus{left:0}
:focus-visible{outline:2px solid var(--azafran);outline-offset:3px;border-radius:2px}

.btn{
  display:inline-flex;align-items:center;gap:.6em;
  font-family:var(--util);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;
  padding:.95em 1.5em;border:1px solid var(--cal);background:transparent;color:var(--cal);
  text-decoration:none;cursor:pointer;transition:background .25s,color .25s,border-color .25s;
}
.btn:hover{background:var(--cal);color:var(--anil)}
.btn--lleno{background:var(--azafran);border-color:var(--azafran);color:var(--anil-hondo)}
.btn--lleno:hover{background:var(--cal);border-color:var(--cal)}

/* ---------- nav ---------- */
header.top{
  position:sticky;top:0;z-index:50;background:rgba(12,28,74,.9);
  backdrop-filter:blur(14px);border-bottom:1px solid rgba(237,239,232,.13);
}
.top .env{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;height:82px}
.marca{display:flex;align-items:center;text-decoration:none;flex:none}
.marca img{height:36px;width:auto;display:block}
@media(max-width:860px){.marca img{height:32px}}
@media(max-width:420px){.marca img{height:27px}}
.claim-img{width:min(440px,84vw);height:auto;display:block;margin-top:1.8rem}
nav.principal{display:flex;align-items:center;gap:clamp(.9rem,2vw,1.9rem)}
nav.principal a{
  font-family:var(--util);font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;
  text-decoration:none;color:var(--cal-mudo);padding:.4em 0;position:relative;transition:color .2s;
}
nav.principal a:hover{color:var(--cal)}
nav.principal a[aria-current="page"]{color:var(--cal)}
nav.principal a[aria-current="page"]::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--azafran);
}
nav.principal .btn{padding:.7em 1.1em;font-size:.72rem}
.menu-btn{display:none;background:none;border:1px solid rgba(237,239,232,.35);color:var(--cal);
  font-family:var(--util);font-size:.72rem;letter-spacing:.1em;padding:.6em .9em;cursor:pointer;text-transform:uppercase}
@media(max-width:860px){
  .menu-btn{display:block}
  nav.principal{
    position:absolute;top:82px;left:0;right:0;background:var(--anil-hondo);
    flex-direction:column;align-items:flex-start;gap:0;padding:0 var(--gut);
    max-height:0;overflow:hidden;transition:max-height .3s ease;border-bottom:1px solid rgba(237,239,232,.13);
  }
  nav.principal.abierto{max-height:400px;padding-block:1rem 1.6rem}
  nav.principal a{padding:.75em 0;font-size:.9rem;width:100%}
  nav.principal a[aria-current="page"]::after{width:22px;right:auto}
}

/* ---------- páginas ---------- */
.pagina{display:block;animation:entra .45s ease both}
@keyframes entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

section{padding-block:clamp(56px,8vw,110px)}
.linea{border-top:1px solid rgba(237,239,232,.13)}

/* ---------- HERO / rotador de ideas ---------- */
.hero{padding-block:clamp(48px,7vw,84px) clamp(56px,8vw,96px);position:relative;overflow:hidden}
.hero-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);
  gap:clamp(20px,4vw,48px);align-items:center;margin-bottom:clamp(30px,4vw,50px);position:relative}
.hero-texto{display:flex;flex-direction:column;gap:1.1rem}
.hero-ilus{width:100%;max-width:520px;height:auto;display:block;margin-left:auto}
.ilus-ancha{width:min(880px,100%);height:auto;display:block;margin:clamp(26px,4vw,44px) auto 0}
@media(max-width:900px){
  .hero-intro{grid-template-columns:1fr;gap:14px}
  .hero-ilus{max-width:440px;margin:0 auto}
}
.hero-intro h1{max-width:16ch}
.hero-intro h1 em{font-style:normal;color:var(--azafran)}

.ficha{
  position:relative;border:1px solid rgba(237,239,232,.22);background:var(--anil-hondo);
  padding:clamp(24px,4vw,46px);
  display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,3vw,32px);
}
.ficha::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--acento);transition:background .5s;
}
.ficha-fila{display:grid;grid-template-columns:110px minmax(0,1fr);gap:clamp(14px,2.5vw,28px);align-items:start}
.ficha-tag{
  font-family:var(--util);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cal-mudo);padding-top:.55em;
}
.ficha-brief{font-size:clamp(1rem,1.4vw,1.15rem);color:#CFD5CB;font-weight:300;max-width:52ch}
.ficha-claim{
  font-family:var(--display);font-weight:800;letter-spacing:-.028em;line-height:1.02;
  font-size:clamp(1.7rem,4.3vw,3.3rem);color:var(--cal);max-width:19ch;min-height:2.04em;
}
.ficha-claim b{color:var(--acento);font-weight:800;transition:color .5s}
.fade{animation:fade .45s ease both}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:680px){
  .ficha-fila{grid-template-columns:1fr;gap:.5rem}
  .ficha-tag{padding-top:0}
}
.ficha-pie{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;
  border-top:1px solid rgba(237,239,232,.14);padding-top:1.1rem}
.puntos{display:flex;gap:.5rem}
.puntos button{
  width:9px;height:9px;border-radius:50%;border:1px solid var(--cal-mudo);background:transparent;
  cursor:pointer;padding:0;transition:background .25s,border-color .25s,transform .25s;
}
.puntos button[aria-selected="true"]{background:var(--acento);border-color:var(--acento);transform:scale(1.25)}
.enlace-txt{
  font-family:var(--util);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;
  background:none;border:none;color:var(--cal);cursor:pointer;padding:.3em 0;
  border-bottom:1px solid var(--acento);transition:color .2s;
}
.enlace-txt:hover{color:var(--acento)}

.hero-nota{margin-top:1.6rem;font-family:var(--util);font-size:.76rem;letter-spacing:.05em;color:var(--cal-mudo);max-width:58ch}

/* ---------- tarjetas de servicio ---------- */
.rejilla-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:1px;background:rgba(237,239,232,.15);border:1px solid rgba(237,239,232,.15)}
.tarjeta{background:var(--anil);padding:clamp(26px,3.4vw,40px);display:flex;flex-direction:column;gap:1rem;transition:background .3s}
.tarjeta:hover{background:var(--anil-suave)}
.tarjeta .num{font-family:var(--util);font-size:.7rem;letter-spacing:.14em;color:var(--cal-mudo)}
.tarjeta h3{color:var(--cal)}
.tarjeta h3 span{display:block;font-family:var(--util);font-size:.7rem;font-weight:400;letter-spacing:.14em;
  text-transform:uppercase;margin-top:.65rem}
.tarjeta ul{list-style:none;font-size:.95rem;color:#C6CCC2;display:flex;flex-direction:column;gap:.45rem;margin-top:.3rem}
.tarjeta li{padding-left:1.1em;position:relative}
.tarjeta li::before{content:"—";position:absolute;left:0;color:var(--cal-mudo)}
.t-1 h3 span{color:var(--azafran)} .t-1 .num{color:var(--azafran)}
.t-2 h3 span{color:var(--azulejo)} .t-2 .num{color:var(--azulejo)}
.t-3 h3 span{color:#E0698C} .t-3 .num{color:#E0698C}

/* ---------- proceso ---------- */
.fases{display:grid;gap:0;margin-top:clamp(30px,4vw,48px)}
.fase{
  display:grid;grid-template-columns:88px minmax(0,1fr);gap:clamp(16px,3vw,34px);
  padding-block:clamp(20px,2.6vw,30px);border-top:1px solid rgba(237,239,232,.14);align-items:baseline;
}
.fase:last-child{border-bottom:1px solid rgba(237,239,232,.14)}
.fase-n{font-family:var(--util);font-size:.72rem;letter-spacing:.14em;color:var(--azulejo)}
.fase h3{margin-bottom:.5rem}
.fase p{font-size:.98rem;color:#C6CCC2}
@media(max-width:620px){.fase{grid-template-columns:1fr;gap:.4rem}}

/* ---------- bloque claro ---------- */
.claro{background:var(--cal);color:var(--anil-hondo)}
.claro .lede,.claro p{color:#33406B}
.claro .eyebrow{color:var(--granate)}
.claro .btn{border-color:var(--anil-hondo);color:var(--anil-hondo)}
.claro .btn:hover{background:var(--anil-hondo);color:var(--cal)}
.claro .btn--lleno{background:var(--anil-hondo);color:var(--cal)}
.claro .btn--lleno:hover{background:var(--granate);border-color:var(--granate)}

/* ---------- galería de ideas ---------- */
.ideas{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1px;background:rgba(20,31,69,.16);border:1px solid rgba(20,31,69,.16);margin-top:clamp(30px,4vw,48px)}
.idea{background:var(--cal);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:1rem;transition:background .3s}
.idea:hover{background:#E3E6DC}
.idea .brief{font-family:var(--util);font-size:.76rem;line-height:1.65;color:#5A6382}
.idea .claim{font-family:var(--display);font-weight:800;font-size:clamp(1.35rem,2.3vw,1.95rem);
  line-height:1.05;letter-spacing:-.022em;color:var(--anil-hondo)}
.idea .sello{font-family:var(--util);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;margin-top:auto;padding-top:.8rem;border-top:1px solid rgba(20,31,69,.15)}

/* ---------- cifras ---------- */
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:clamp(24px,4vw,48px);margin-top:clamp(28px,4vw,44px)}
.cifra .n{font-family:var(--display);font-weight:800;font-size:clamp(2.4rem,5vw,3.6rem);letter-spacing:-.03em;color:var(--azafran);line-height:1}
.cifra p{font-size:.92rem;color:#C6CCC2;margin-top:.6rem}
.cifra .fuente{font-family:var(--util);font-size:.66rem;color:var(--cal-mudo);margin-top:.5rem;letter-spacing:.04em}

/* ---------- CTA ---------- */
.cta{background:var(--azafran);color:var(--anil-hondo);text-align:center}
.cta h2{max-width:18ch;margin:0 auto .9rem}
.cta p{max-width:46ch;margin:0 auto 2rem;color:#3A3212}
.cta .btn{border-color:var(--anil-hondo);color:var(--anil-hondo)}
.cta .btn:hover{background:var(--anil-hondo);color:var(--azafran)}

/* ---------- contacto ---------- */
.contacto-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(24px,5vw,60px);align-items:center;margin-bottom:clamp(38px,6vw,72px)}
.contacto-hero img{width:100%;max-width:320px;height:auto;display:block;margin-left:auto;opacity:.94}
@media(max-width:820px){
  .contacto-hero{grid-template-columns:1fr;gap:8px}
  .contacto-hero img{max-width:210px;margin:0 auto}
}
.contacto-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(34px,5vw,70px);align-items:start}
@media(max-width:860px){.contacto-grid{grid-template-columns:1fr}}
.campo{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.35rem}
.campo label{font-family:var(--util);font-size:.72rem;letter-spacing:.11em;text-transform:uppercase;color:var(--cal-mudo)}
.campo input,.campo select,.campo textarea{
  background:var(--anil-hondo);border:1px solid rgba(237,239,232,.24);color:var(--cal);
  font-family:var(--cuerpo);font-size:1rem;padding:.85em 1em;width:100%;border-radius:0;
  transition:border-color .2s,background .2s;
}
.campo textarea{min-height:150px;resize:vertical;line-height:1.55}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--azafran);background:#08194A;outline:none}
.campo input::placeholder,.campo textarea::placeholder{color:#6A748F}
.campo select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--cal-mudo) 50%),linear-gradient(135deg,var(--cal-mudo) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:0 1.2rem}
@media(max-width:560px){.dos{grid-template-columns:1fr}}
.aviso{font-family:var(--util);font-size:.72rem;color:var(--cal-mudo);line-height:1.7;margin-top:.4rem}
.ok{border:1px solid var(--azulejo);background:rgba(55,160,168,.1);padding:1.6rem;margin-top:1.2rem}
.ok h3{color:var(--azulejo);margin-bottom:.5rem;font-size:1.2rem}
.ok p{font-size:.95rem;color:#C6CCC2}
.datos{border-left:2px solid var(--azafran);padding-left:1.6rem;display:flex;flex-direction:column;gap:1.8rem}
.dato h4{font-family:var(--util);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--cal-mudo);margin-bottom:.5rem}
.dato p,.dato a{font-size:1.02rem;color:var(--cal);text-decoration:none}
.dato a:hover{color:var(--azafran)}

/* ---------- equipo ---------- */
.equipo{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(24px,3vw,40px);margin-top:clamp(30px,4vw,46px)}
.persona .ini{font-family:var(--display);font-weight:800;font-size:2.2rem;color:var(--anil);background:var(--azulejo);
  width:66px;height:66px;display:grid;place-items:center;margin-bottom:1rem}
.persona h3{font-size:1.25rem;margin-bottom:.25rem}
.persona .rol{font-family:var(--util);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--azafran);margin-bottom:.7rem}
.persona p{font-size:.94rem;color:#C6CCC2}

/* ---------- creencias ---------- */
.creencias{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(26px,3.5vw,44px);margin-top:clamp(30px,4vw,48px)}
.creencia h3{font-size:1.28rem;margin-bottom:.6rem;color:var(--cal)}
.creencia p{font-size:.96rem;color:#C6CCC2}
.creencia .marca-n{font-family:var(--util);font-size:.7rem;letter-spacing:.14em;color:var(--granate);display:block;margin-bottom:.9rem}

/* ---------- footer ---------- */
footer{background:var(--anil-hondo);padding-block:clamp(34px,4vw,52px) 26px;border-top:1px solid rgba(237,239,232,.13)}
.pie-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,.8fr));gap:clamp(22px,3vw,38px)}
@media(max-width:720px){.pie-grid{grid-template-columns:1fr 1fr}.pie-grid>div:first-child{grid-column:1/-1}}
footer h4{font-family:var(--util);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--cal-mudo);margin-bottom:1rem}
footer ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
footer a{font-size:.94rem;text-decoration:none;color:#C6CCC2;transition:color .2s}
footer a:hover{color:var(--azafran)}
.pie-marca{display:block;margin-bottom:.45rem;margin-left:-6px}
.pie-marca img{width:min(330px,80vw);height:auto;display:block}
.pie-legal{margin-top:clamp(26px,3vw,40px);padding-top:18px;border-top:1px solid rgba(237,239,232,.13);
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;
  font-family:var(--util);font-size:.7rem;letter-spacing:.05em;color:var(--cal-mudo)}

/* ---------- reveal ---------- */
.rev{opacity:0;transform:translateY(18px)}
.rev.visto{opacity:1;transform:none;transition:opacity .65s ease,transform .65s ease}
@media (prefers-reduced-motion:reduce){.rev{opacity:1;transform:none}}


/* ── textos legales ─────────────────────────────── */
.h1-legal{font-size:clamp(1.8rem,3.6vw,2.7rem)}
.lede-legal{font-size:clamp(.95rem,1.15vw,1.05rem);line-height:1.6}
.legal-fecha{font-family:var(--util);font-size:.68rem;letter-spacing:.06em;color:var(--cal-mudo);margin-bottom:clamp(24px,3vw,36px)}
.legal{max-width:76ch;font-size:.88rem;line-height:1.68}
.legal h2{font-size:1.05rem;margin:clamp(26px,3vw,38px) 0 .7rem;padding-top:clamp(16px,2vw,22px);border-top:1px solid rgba(237,239,232,.14)}
.legal h2:first-child{margin-top:0;padding-top:0;border-top:0}
.legal h3{font-size:.92rem;margin:1.4rem 0 .45rem;color:var(--azafran);letter-spacing:0}
.legal p{margin-bottom:.8rem;color:#C0C7BC;font-size:1em}
.legal ul{list-style:none;margin:0 0 1rem;display:flex;flex-direction:column;gap:.4rem;color:#C0C7BC}
.legal li{padding-left:1.1em;position:relative;font-size:1em}
.legal li::before{content:"—";position:absolute;left:0;color:var(--cal-mudo)}
.legal strong{color:var(--cal);font-weight:500}
.legal a{color:var(--azafran);text-decoration:underline;text-underline-offset:3px}
.legal a:hover{color:var(--cal)}
.legal table{width:100%;border-collapse:collapse;margin:0 0 1.1rem;font-size:.82rem}
.legal th,.legal td{text-align:left;padding:.55em .7em;border:1px solid rgba(237,239,232,.16);vertical-align:top;color:#C0C7BC}
.legal th{font-family:var(--util);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cal-mudo);background:var(--anil-hondo)}
@media(max-width:620px){.legal table,.legal thead,.legal tbody,.legal tr,.legal td{display:block;width:100%}
  .legal thead{display:none}
  .legal tr{border:1px solid rgba(237,239,232,.16);margin-bottom:.7rem}
  .legal td{border:0;border-bottom:1px solid rgba(237,239,232,.1)}
  .legal td:last-child{border-bottom:0}}
.ck-estado{border:1px solid rgba(237,239,232,.2);background:var(--anil-hondo);padding:1.1rem 1.2rem;margin:.4rem 0 1.2rem}
.ck-estado p{margin-bottom:.9rem}
.ck-estado .btn{padding:.7em 1.1em;font-size:.7rem;margin-right:.5rem}

.pie-legales a{
  font-family:inherit;font-size:inherit;letter-spacing:inherit;color:inherit;
  text-decoration:none;margin-left:1.6rem;white-space:nowrap;
}
.pie-legales a:first-child{margin-left:0}
.pie-legales a:hover{color:var(--azafran)}
@media(max-width:520px){.pie-legales a{margin-left:1rem}}

/* ── aviso de cookies ───────────────────────────── */
.cookies{
  position:fixed;left:0;right:0;bottom:0;z-index:80;background:var(--anil-hondo);
  border-top:2px solid var(--azafran);padding:clamp(18px,3vw,26px) 0;
  box-shadow:0 -18px 40px rgba(0,0,0,.35);
}
.cookies[hidden]{display:none}
.cookies .env{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(16px,3vw,36px);align-items:center}
@media(max-width:820px){.cookies .env{grid-template-columns:1fr}}
.cookies h2{font-size:1.15rem;margin-bottom:.5rem}
.cookies p{font-size:.92rem;color:#C9CFC4;max-width:66ch;margin:0}
.cookies p a{color:var(--azafran);text-decoration:underline;text-underline-offset:3px}
.cookies-botones{display:flex;flex-wrap:wrap;gap:.6rem}
.cookies-botones .btn{padding:.8em 1.2em;font-size:.72rem;white-space:nowrap}
