/* ═══════════════════════════════════════════════════════════
   YouPlanFit · Design System V2 — Grupo H: páginas de perfil
   (mujeres.html, hombres.html, adultos.html)
   ═══════════════════════════════════════════════════════════
   Ver AUDIENCE_PAGES_V2_MAP.md. Mismo patrón aditivo que legal-v2.css:
   se SUPERPONE a portada.css + anuncios.css (que siguen cargados), sin
   quitarlos, todo escopado a body.perfil-v2. No se reutiliza
   body.portada-v2: su .hero es un grid de dos columnas para un marcado
   que aquí no existe (el hero de perfil es foto de fondo + velo + caja,
   .hero--perfil).

   PROTECCIÓN: cero cambios de HTML salvo los 3 <link> nuevos y
   class="perfil-v2 perfil-v2--<audiencia>" en <body> de cada página.
   No se toca copy, meta, SEO, ids, data-*, hrefs. La barra de cookies
   (#consent) la sigue inyectando track.js sin marcado propio en el
   HTML — se estila aquí a ciegas, sin tocar track.js. Cero data-t
   (publicaría /en/ con contenido en castellano, ver mapa riesgo 8).
   ═══════════════════════════════════════════════════════════ */

body.perfil-v2{
  --perfil-acento:var(--v2-cyan);
  background:var(--v2-bg);color:var(--v2-text);
}
/* +50: nunca reducir tamaño de fuente ni contraste al pasar a fondo
   oscuro (ver AUDIENCE_PAGES_V2_MAP.md). El body base es 17px
   (portada.css); aquí se sube, nunca se baja. */
body.perfil-v2--adultos{ font-size:18px }

/* ── Nav — mismo marcado (.nav.nav--solida), solo se oscurece ──
   .nav .btn--claro es el selector que lee sesion-portada.js:37 para
   canjear el CTA por "Ver mi plan"; se conserva la clase y solo se
   cambia su apariencia. */
body.perfil-v2 .nav--solida{
  background:rgba(7,16,22,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(90,184,222,.16);
}
body.perfil-v2 .nav--solida .logo__img{content:url('../img/logo-ypf.webp')}
body.perfil-v2 .nav--solida .nav__menu a{color:var(--v2-muted)}
body.perfil-v2 .nav--solida .nav__menu a:hover{color:var(--v2-cyan2)}
body.perfil-v2 .nav--solida .nav__entrar{color:var(--v2-text)}
body.perfil-v2 .nav--solida .nav__entrar:hover,
body.perfil-v2 .nav--solida .nav__entrar--pro{color:var(--v2-cyan2)}
body.perfil-v2 .nav--solida .btn--claro{
  background:linear-gradient(135deg,var(--v2-blue),var(--v2-cyan));
  color:#fff;border-color:transparent;box-shadow:0 8px 24px rgba(13,147,176,.25);
}

/* ── Hero ── */
body.perfil-v2 .hero--perfil{
  background:
    radial-gradient(circle at 80% 10%,rgba(19,185,231,.10),transparent 40%),
    var(--v2-bg);
}
body.perfil-v2 .hero__velo{
  background:
    linear-gradient(90deg,rgba(7,16,22,.82) 0%,rgba(7,16,22,.42) 40%,rgba(7,16,22,.06) 62%),
    linear-gradient(180deg,rgba(7,16,22,0) 78%,rgba(7,16,22,.7) 100%);
}
body.perfil-v2 .marca{
  color:var(--perfil-acento);border-color:rgba(90,184,222,.28);
  background:rgba(13,28,39,.5);
}
body.perfil-v2 .marca::before{background:var(--perfil-acento)}
body.perfil-v2 .hero .t{color:var(--v2-text);font-family:var(--v2-display)}
body.perfil-v2 .hero .t i{color:var(--perfil-acento);font-style:normal}
body.perfil-v2 .hero__sub{color:var(--v2-muted)}
body.perfil-v2 .hero__sub b{color:var(--v2-text)}
body.perfil-v2 .hero__acciones .btn--claro{
  background:linear-gradient(135deg,var(--v2-blue),var(--v2-cyan));
  color:#fff;border:0;box-shadow:0 8px 30px rgba(13,147,176,.25);
}
body.perfil-v2 .hero__acciones .btn--claro:hover{transform:translateY(-2px)}

/* ── Sección "Qué cambia" ── */
body.perfil-v2 .s__cap{color:#81dff8}
body.perfil-v2 .cab .t{color:var(--v2-text);font-family:var(--v2-display)}
body.perfil-v2 .cab .t i{color:var(--perfil-acento);font-style:normal}
body.perfil-v2 .senales{
  background:var(--v2-line);border-color:var(--v2-line);border-radius:16px;
}
body.perfil-v2 .senales li{
  background:linear-gradient(180deg,rgba(18,39,52,.9),rgba(8,23,32,.94));
  transition:transform var(--v2-dur) var(--v2-curva);
}
body.perfil-v2 .senales li:hover{transform:translateY(-2px)}
body.perfil-v2 .senales b{color:var(--perfil-acento)}
body.perfil-v2 .senales strong{color:var(--v2-text)}
body.perfil-v2 .senales span{color:var(--v2-muted)}

/* ── Publicidad — solo marco/etiqueta; anuncios.js sigue controlando
   display/dimensiones, no se toca su lógica. ── */
body.perfil-v2 .anuncio__marca{color:var(--v2-muted)}
body.perfil-v2 .anuncio__caja{
  background:rgba(13,28,39,.4);border:1px solid var(--v2-line);border-radius:12px;
}

/* ── Cierre — mismo tratamiento que la landing (portada-v2.css
   section.cierre), portado literalmente al mismo markup. ── */
body.perfil-v2 section.cierre{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,#08131a,#0a1620);
  border:1px solid rgba(72,138,166,.23);color:#c4d0d6;
}
body.perfil-v2 section.cierre::before{
  background:var(--v2-cyan);opacity:.12;
}
body.perfil-v2 section.cierre .s__cap{color:#81dff8}
body.perfil-v2 section.cierre .t{
  font-family:var(--v2-display);color:var(--v2-text);
}
body.perfil-v2 section.cierre .t i{color:var(--v2-cyan2);font-style:normal}
body.perfil-v2 section.cierre .s__sub{color:var(--v2-muted)}
body.perfil-v2 section.cierre .btn--claro{
  background:linear-gradient(135deg,var(--v2-blue),var(--v2-cyan));
  color:#fff;border:0;box-shadow:0 8px 30px rgba(13,147,176,.25);
}
body.perfil-v2 section.cierre .btn--claro:hover{transform:translateY(-2px)}

/* ── Pie ── */
body.perfil-v2 footer.pie{
  background:#050b0f;border-top:1px solid #122934;color:#8199a5;
}
body.perfil-v2 footer.pie a{color:#8199a5}
body.perfil-v2 footer.pie a:hover{color:var(--v2-cyan2)}
body.perfil-v2 .firma__nombre{color:#8199a5}
body.perfil-v2 .firma__nombre:hover{color:var(--v2-cyan2)}

/* ── Barra de cookies (#consent) — la inyecta track.js, sin marcado en
   el HTML; mismas clases que en las páginas legales. ── */
body.perfil-v2 #consent{
  background:linear-gradient(180deg,rgba(10,22,30,.94),rgba(5,13,18,.97));
  border-top:1px solid rgba(90,184,222,.22);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  color:var(--v2-text);box-shadow:0 -20px 50px rgba(0,0,0,.4);
}
body.perfil-v2 #consent .consent__txt{color:var(--v2-muted)}
body.perfil-v2 #consent .consent__panel{
  background:rgba(13,28,39,.75);border:1px solid var(--v2-line);
}
body.perfil-v2 #consent .consent__cat{color:var(--v2-muted)}
body.perfil-v2 #consent .consent__cat b{color:var(--v2-text)}
body.perfil-v2 #consent .consent__cat input{accent-color:var(--v2-cyan)}
body.perfil-v2 #consent .consent__mas{color:var(--v2-cyan2)}
body.perfil-v2 #consent .consent__mas:hover{color:var(--v2-text)}
body.perfil-v2 #consent .btn{
  border:0;color:#fff;
  background:linear-gradient(135deg,var(--v2-blue),var(--v2-cyan));
  box-shadow:0 8px 24px rgba(13,147,176,.25);
}
body.perfil-v2 #consent .btn--ghost{
  background:transparent;color:var(--v2-text);border:1px solid var(--v2-line);box-shadow:none;
}
body.perfil-v2 #consent .btn--ghost:hover{border-color:var(--v2-cyan);color:var(--v2-cyan2)}

@media (max-width:680px){
  body.perfil-v2 #consent .consent__panel{max-height:44vh;overflow-y:auto}
  body.perfil-v2 #consent .consent__mas{flex-basis:100%;text-align:left}
}
