/* AstroVenus · piel ilustrada del modo Punk (rediseño según la maqueta de la titular). Se encola solo con el módulo Punk encendido, tras punk.css.
   Todo bajo html.av-punk. A diferencia de punk.css (bloques planos), aquí SÍ se permiten degradados y box-shadow: la titular aprobó salirse de DESIGN.md
   únicamente dentro del modo Punk. Sin animaciones. Imágenes relativas a este archivo; solo se descarga una de las dos ilustraciones por pantalla. */

/* ---- 1. Fondo: ilustración fija y vívida; el contraste (>= 4.5:1) lo dan velos locales detrás del texto y los paneles opacos ---- */
html.av-punk body{background:#07050E;position:relative}
html.av-punk .av{background:transparent}
html.av-punk body::before,html.av-punk body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none}
html.av-punk body::before{background:#07050E center bottom/cover no-repeat}
@media (min-width:601px) and (min-aspect-ratio:1/1){html.av-punk body::before{background-image:url(../img/punk-fondo-ancho.webp)}}
@media (max-width:600px),(max-aspect-ratio:1/1){html.av-punk body::before{background-image:url(../img/punk-fondo-vertical.webp)}}
/* Velo global mínimo: solo oscurece la franja de la cabecera; el resto del arte se ve entero */
html.av-punk body::after{background:
  linear-gradient(180deg,rgba(7,5,14,.9) 0,rgba(7,5,14,.55) 12%,rgba(7,5,14,.12) 40%,rgba(7,5,14,0) 100%)}

/* Velo propio tras el texto de la portada (titular, párrafo y botones) */
html.av-punk .av-hero-text{position:relative;isolation:isolate}
html.av-punk .av-hero-text::before{content:"";position:absolute;inset:-40px -70px -40px -80px;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse closest-side at 50% 50%,rgba(7,5,14,.94) 0,rgba(7,5,14,.9) 72%,rgba(7,5,14,0) 100%)}
html.av-punk[data-theme="light"] .av-hero-text::before{background:none}

/* Las franjas de la portada dejan ver el fondo, con un velo propio para el texto */
html.av-punk .wp-site-blocks>header,html.av-punk .wp-site-blocks>footer{background:transparent}
html.av-punk .wp-site-blocks>footer{background:rgba(7,5,14,.88);border-top:1px solid #C9A227}
html.av-punk .av-home-band{background:rgba(14,11,22,.86);border-block:1px solid rgba(201,162,39,.55)}

/* ---- 2. Cabecera: marco dorado de doble línea, estrellas en los extremos, tarjeta del logotipo ---- */
html.av-punk .wp-site-blocks>header{border-bottom:0;padding-top:14px}
html.av-punk .wp-site-blocks>header>.wp-block-group{position:relative;max-width:1320px;width:calc(100% - 40px);box-sizing:border-box;
  padding:10px 36px!important;background:rgba(10,7,18,.86);border:1px solid #C9A227!important;
  box-shadow:inset 0 0 0 4px rgba(10,7,18,.86),inset 0 0 0 5px rgba(201,162,39,.8),0 0 14px rgba(255,42,109,.25)}
html.av-punk .wp-site-blocks>header .wp-block-site-title a::before{width:44px;height:44px;border-radius:3px;border:1px solid #C9A227;
  background:#F4EBD0 url(../img/punk-logo-carta.webp) center/cover no-repeat}
html.av-punk .wp-site-blocks>header a:not(.av-btn):not(.wp-block-button__link){color:#F3EEDC}
html.av-punk .wp-site-blocks>header a:not(.av-btn):not(.wp-block-button__link):hover{color:#FCEE0A}
html.av-punk .wp-site-blocks>header .wp-block-site-title a:not(.av-btn):not(.wp-block-button__link){color:#FFF3D6}
html.av-punk .wp-site-blocks>header .av-lang a[aria-current],html.av-punk .wp-site-blocks>header .av-lang a.is-current{color:#FCEE0A}
html.av-punk .wp-site-blocks>header .wp-block-navigation .av-nav-cta>a.wp-block-navigation-item__content{color:#0E0B16!important}
html.av-punk .av-theme-toggle{border-color:#C9A227;border-radius:3px}
/* Menú: iconos dorados; la entrada de la página actual en amarillo */
html.av-punk .wp-site-blocks>header [class*="av-ic-"]>.wp-block-navigation-item__content::before{background:#E8C65A;opacity:1}
html.av-punk body.home .wp-site-blocks>header .av-ic-home>a.wp-block-navigation-item__content,
html.av-punk .wp-site-blocks>header .current-menu-item>a.wp-block-navigation-item__content,
html.av-punk .wp-site-blocks>header a.wp-block-navigation-item__content[aria-current]{color:#FCEE0A;font-weight:600}

/* ---- 3. Portada: titular crema con serif, botones enmarcados, rueda en marco ornamental ---- */
html.av-punk .av-hero-logo{border:2px solid #C9A227;border-radius:6px;width:min(220px,44vw);
  box-shadow:0 0 0 3px #07050E,0 0 0 4px rgba(201,162,39,.8),0 0 22px rgba(255,42,109,.3)}
html.av-punk img.av-hero-logo{content:url(../img/punk-logo-carta.webp);object-fit:cover}
html.av-punk .av-hero h1{font-family:var(--av-serif,'Source Serif 4',Georgia,serif);font-weight:600;letter-spacing:-.02em;color:#FFF3D6;
  text-shadow:0 2px 0 rgba(7,5,14,.6),0 0 8px rgba(255,42,109,.4)}
html.av-punk .av-hero-sub{color:#F3EEDC;text-shadow:0 1px 6px rgba(7,5,14,.9)}
html.av-punk .av-hero-fig figcaption{color:#F3EEDC;text-shadow:0 1px 6px rgba(7,5,14,.9);background:rgba(7,5,14,.78);padding:6px 10px;border-radius:4px;width:fit-content}
html.av-punk .av-btn,html.av-punk .wp-block-button .wp-block-button__link{border:2px solid #C9A227;border-radius:3px;
  box-shadow:0 0 0 3px #07050E,0 0 0 4px rgba(201,162,39,.8),0 0 16px rgba(252,238,10,.28)}
html.av-punk .av-btn.is-ghost,html.av-punk .wp-block-button.is-style-outline .wp-block-button__link{background:rgba(10,7,18,.82);color:#F3EEDC;border-color:#C9A227}
html.av-punk .av-btn.is-ghost:hover:not(:disabled){background:#FCEE0A;color:#0E0B16}
html.av-punk .av-hero-fig{position:relative}
html.av-punk .av-hero-fig>[data-av-hero-wheel]{position:relative;padding:6px;background:rgba(7,5,14,.84);border:2px solid #C9A227;border-radius:4px;
  box-shadow:inset 0 0 0 4px rgba(7,5,14,.84),inset 0 0 0 5px rgba(201,162,39,.75),0 0 22px rgba(255,42,109,.28)}
html.av-punk .av-hero-fig .av-wheelbox{position:relative;background:transparent;border:0;box-shadow:none}

/* ---- 4. El botón fijo «Modo Punk» (punk.css) nunca tapa el pie ni el texto de la rueda: se deja aire bajo el contenido y el pie de la rueda se alinea a la izquierda ---- */
html.av-punk .wp-site-blocks{padding-bottom:84px}
@media (min-width:1024px){html.av-punk .wp-site-blocks{padding-bottom:164px}}
html.av-punk .av-hero-fig figcaption{text-align:left;max-width:calc(100% - 80px)}
@media (max-width:1023px){html.av-punk .av-hero-fig figcaption{max-width:none}}

/* ---- 5. Resto de páginas: paneles oscuros con filo dorado y borde neón suave ---- */
html.av-punk .av-panel,html.av-punk:root:not([data-theme="punk"]) .fm--ill .fm-card.av-panel,html.av-punk:root:not([data-theme="punk"]) .fm-herobox,
html.av-punk:root:not([data-theme="punk"]) .ill .ill-hero,html.av-punk:root:not([data-theme="punk"]) .ill .av-panel,html.av-punk:root:not([data-theme="punk"]) .ill .hub-card,
html.av-punk:root:not([data-theme="punk"]) .av-wheelbox,html.av-punk .av-punk-notice{
  background-color:rgba(14,11,22,.88);border:1px solid #C9A227;border-left:1px solid #C9A227;border-radius:4px;
  box-shadow:inset 0 0 0 3px rgba(14,11,22,.88),inset 0 0 0 4px rgba(201,162,39,.35),0 0 14px rgba(255,42,109,.2)}
html.av-punk .av-home-grid article{background:rgba(14,11,22,.82);border:1px solid rgba(201,162,39,.7);border-radius:4px;padding:20px 20px 28px;margin-top:16px}
html.av-punk .av-home-end{background:rgba(7,5,14,.78);padding-inline:24px;margin-block:16px;border:1px solid rgba(201,162,39,.5);border-radius:4px}


/* Franjas de módulos: grabados Astropunk completos, con su marco de papel y sin el fundido clásico. */
html.av-punk .ill .ill-art,html.av-punk .fm-heroart,html.av-punk .af-heroart{min-height:0;align-self:center;padding:14px}
html.av-punk .ill .ill-art .av-banner,html.av-punk .fm-heroart .av-banner,html.av-punk .af-heroart .av-banner{position:relative;inset:auto;overflow:hidden}
html.av-punk .ill .ill-art .av-banner img,html.av-punk .fm-heroart .av-banner img,html.av-punk .af-heroart .av-banner img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;object-position:center;-webkit-mask-image:none;mask-image:none}
html.av-punk .av-banner:has(img[data-av-punk-src]){background:transparent}
html.av-punk .av-banner>img[data-av-punk-src]{aspect-ratio:3/2;object-fit:contain}
html.av-punk .av-banner[data-av-punk-only]{max-width:560px;margin-inline:auto}
@media (max-width:860px){
  html.av-punk .ill .ill-hero,html.av-punk .fm-herobox,html.av-punk .af-herobox{grid-template-columns:1fr}
  html.av-punk .ill .ill-art,html.av-punk .fm-heroart,html.av-punk .af-heroart{padding:14px;min-height:0;margin-top:0}
}

/* ---- 6. Contenido de TODAS las páginas salvo la portada: panel oscuro translúcido con filo dorado, para que ningún texto quede directo sobre el arte.
   La portada (body.home) conserva el arte a la vista y usa velos locales; el arte sigue visible en márgenes laterales, bajo el panel y tras el pie. ---- */
html.av-punk body:not(.home) .wp-site-blocks>main{box-sizing:border-box;width:calc(100% - 40px);max-width:1240px;margin:24px auto 32px;padding-block:24px 40px;
  background:rgba(8,6,20,.9);border:1px solid #C9A227;border-radius:4px;
  box-shadow:inset 0 0 0 3px rgba(8,6,20,.9),inset 0 0 0 4px rgba(201,162,39,.35),0 0 18px rgba(255,42,109,.22)}
@supports ((backdrop-filter:blur(6px)) or (-webkit-backdrop-filter:blur(6px))){
  html.av-punk body:not(.home) .wp-site-blocks>main{background:rgba(8,6,20,.84);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}}
html.av-punk[data-theme="light"] body:not(.home) .wp-site-blocks>main{background:rgba(251,245,228,.94);border-color:#7A6200;
  box-shadow:inset 0 0 0 3px rgba(251,245,228,.94),inset 0 0 0 4px rgba(122,98,0,.35)}
@media (max-width:600px){html.av-punk body:not(.home) .wp-site-blocks>main{width:calc(100% - 20px);margin-block:14px 20px;padding-block:14px 28px}}

/* ---- Esquinas ornamentales (punk-esquina.webp = esquina superior izquierda; el resto se obtiene girando/espejando) ---- */
html.av-punk .wp-site-blocks>header>.wp-block-group::before,html.av-punk .wp-site-blocks>header>.wp-block-group::after,
html.av-punk .wp-site-blocks>header .wp-block-site-title::before,html.av-punk .wp-site-blocks>header .av-lang::after,
html.av-punk .av-hero-fig>[data-av-hero-wheel]::before,html.av-punk .av-hero-fig>[data-av-hero-wheel]::after,
html.av-punk .av-hero-fig .av-wheelbox::before,html.av-punk .av-hero-fig .av-wheelbox::after{
  content:"";position:absolute;width:var(--pk-c,56px);height:var(--pk-c,56px);background:url(../img/punk-esquina.webp) 0 0/100% 100% no-repeat;pointer-events:none;z-index:3}
html.av-punk .wp-site-blocks>header>.wp-block-group{--pk-c:46px}
html.av-punk .av-hero-fig{--pk-c:68px}
/* arriba-izquierda / abajo-derecha en el propio contenedor */
html.av-punk .wp-site-blocks>header>.wp-block-group::before{left:-3px;top:-3px}
html.av-punk .wp-site-blocks>header>.wp-block-group::after{right:-3px;bottom:-3px;transform:rotate(180deg)}
html.av-punk .av-hero-fig>[data-av-hero-wheel]::before{left:-8px;top:-8px}
html.av-punk .av-hero-fig>[data-av-hero-wheel]::after{right:-8px;bottom:-8px;transform:rotate(180deg)}
/* arriba-derecha / abajo-izquierda: pseudo-elementos de hijos sin posición propia (se anclan al marco) */
html.av-punk .wp-site-blocks>header .av-lang::after{right:-3px;top:-3px;transform:scaleX(-1)}
html.av-punk .wp-site-blocks>header .wp-block-site-title::before{left:-3px;bottom:-3px;transform:scaleY(-1)}
html.av-punk .av-hero-fig .av-wheelbox::before{right:-14px;top:-8px;transform:scaleX(-1)}
html.av-punk .av-hero-fig .av-wheelbox::after{left:-14px;bottom:-8px;transform:scaleY(-1)}
html.av-punk[data-theme="light"] .av-hero-fig>[data-av-hero-wheel]::before,html.av-punk[data-theme="light"] .av-hero-fig>[data-av-hero-wheel]::after{filter:saturate(.7) brightness(.85)}
@media (max-width:600px){
  html.av-punk .wp-site-blocks>header>.wp-block-group{--pk-c:30px}
  html.av-punk .av-hero-fig{--pk-c:52px}
  html.av-punk .wp-site-blocks>header .av-lang::after,html.av-punk .wp-site-blocks>header .wp-block-site-title::before{display:none}
}

/* ---- Móvil: marco simplificado, sin estrellas desbordantes, composición apilada ---- */
@media (max-width:600px){
  html.av-punk .av-hero-text::before{inset:-14px -12px;background:rgba(7,5,14,.78);border-radius:8px}
  html.av-punk .wp-site-blocks>header{padding-top:8px}
  html.av-punk .wp-site-blocks>header>.wp-block-group{padding:8px 14px!important;box-shadow:inset 0 0 0 3px rgba(10,7,18,.86),inset 0 0 0 4px rgba(201,162,39,.7)}
}

/* ---- Tema claro: misma piel atenuada (papel crema, filo dorado oscuro, sin brillos) ---- */
html.av-punk[data-theme="light"] body{background:#F4EBD0}
html.av-punk[data-theme="light"] body::before{background-color:#F4EBD0;background-image:none!important}
html.av-punk[data-theme="light"] body::after{background:linear-gradient(180deg,rgba(244,235,208,.97) 0,rgba(244,235,208,.93) 60%,rgba(244,235,208,.82) 100%)}
html.av-punk[data-theme="light"] .wp-site-blocks>footer{background:rgba(251,245,228,.94);border-top-color:#7A6200}
html.av-punk[data-theme="light"] .av-home-band{background:rgba(251,245,228,.92);border-block-color:#7A6200}
html.av-punk[data-theme="light"] .wp-site-blocks>header>.wp-block-group{background:rgba(251,245,228,.94);border-color:#7A6200!important;
  box-shadow:inset 0 0 0 4px rgba(251,245,228,.94),inset 0 0 0 5px rgba(122,98,0,.7)}
html.av-punk[data-theme="light"] .wp-site-blocks>header a:not(.av-btn):not(.wp-block-button__link){color:#14101F}
html.av-punk[data-theme="light"] .wp-site-blocks>header a:not(.av-btn):not(.wp-block-button__link):hover{color:#C4154F}
html.av-punk[data-theme="light"] .wp-site-blocks>header .wp-block-site-title a::before{border-color:#7A6200}
html.av-punk[data-theme="light"] .wp-site-blocks>header [class*="av-ic-"]>.wp-block-navigation-item__content::before{background:#7A6200}
html.av-punk[data-theme="light"] body.home .wp-site-blocks>header .av-ic-home>a.wp-block-navigation-item__content{color:#7A6200}
html.av-punk[data-theme="light"] .av-theme-toggle{border-color:#7A6200}
html.av-punk[data-theme="light"] .av-hero-logo{border-color:#7A6200;box-shadow:0 0 0 3px #F4EBD0,0 0 0 4px rgba(122,98,0,.7)}
html.av-punk[data-theme="light"] .av-hero h1{color:#14101F;text-shadow:none}
html.av-punk[data-theme="light"] .av-hero-sub,html.av-punk[data-theme="light"] .av-hero-fig figcaption{color:#14101F;text-shadow:none}
html.av-punk[data-theme="light"] .av-hero-fig figcaption{background:rgba(251,245,228,.9)}
html.av-punk[data-theme="light"] .av-btn,html.av-punk[data-theme="light"] .wp-block-button .wp-block-button__link{border-color:#14101F;box-shadow:0 0 0 3px #F4EBD0,0 0 0 4px rgba(122,98,0,.7)}
html.av-punk[data-theme="light"] .av-btn.is-ghost,html.av-punk[data-theme="light"] .wp-block-button.is-style-outline .wp-block-button__link{background:rgba(251,245,228,.9);color:#14101F}
html.av-punk[data-theme="light"] .av-hero-fig>[data-av-hero-wheel]{background:rgba(251,245,228,.94);border-color:#7A6200;
  box-shadow:inset 0 0 0 4px rgba(251,245,228,.94),inset 0 0 0 5px rgba(122,98,0,.7)}
html.av-punk[data-theme="light"] .av-panel,html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .fm--ill .fm-card.av-panel,
html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .fm-herobox,html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .ill .ill-hero,
html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .ill .av-panel,html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .ill .hub-card,
html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .av-wheelbox,html.av-punk[data-theme="light"] .av-punk-notice{
  background-color:rgba(251,245,228,.94);border-color:#7A6200;box-shadow:inset 0 0 0 3px rgba(251,245,228,.94),inset 0 0 0 4px rgba(122,98,0,.35)}
html.av-punk[data-theme="light"] .av-home-grid article{background:rgba(251,245,228,.9);border-color:rgba(122,98,0,.6)}
html.av-punk[data-theme="light"] .av-home-end{background:rgba(251,245,228,.9);border-color:rgba(122,98,0,.5)}

@media (prefers-reduced-motion:reduce){html.av-punk body::before,html.av-punk body::after{transition:none}}

/* Cabecera: los rótulos del menú pueden ser largos (se editan desde WP); en pantallas medias se compacta para que nada se salga del marco */
@media (min-width:601px) and (max-width:1699px){
  html.av-punk .wp-site-blocks>header .wp-block-site-title{font-size:0!important}
  html.av-punk .wp-site-blocks>header .wp-block-navigation__container{gap:.7rem!important}
  html.av-punk .wp-site-blocks>header .wp-block-navigation{font-size:.875rem!important}
  html.av-punk .wp-site-blocks>header>.wp-block-group{padding-inline:28px!important}
  html.av-punk .wp-site-blocks>header .av-theme-toggle{margin-left:.25rem}
}

/* Almas Afines (.af--ill, afines.css): mismas reasignaciones de variables que la carta natal para que no quede un pergamino claro con texto pálido */
html.av-punk:root:not([data-theme="punk"]) .af.af--ill{--af-parch:var(--av-paper);--af-card:var(--av-surface);--af-line:var(--av-rule);--af-gold:var(--av-accent);--af-red:var(--av-tens);--af-navy:var(--av-harm);--af-ink:var(--av-ink);--af-pink:var(--av-surface);--af-blue:var(--av-surface);
  background:var(--av-surface);border-radius:4px}
html.av-punk:root:not([data-theme="punk"]) .af--ill .av-btn{background:var(--av-punk-yellow);border-color:#C9A227;color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .af--ill .av-btn:hover{background:var(--av-tens);color:var(--av-punk-on-yellow)}
html.av-punk:root:not([data-theme="punk"]) .af--ill .av-btn.is-ghost{background:rgba(10,7,18,.82);color:#F3EEDC}
html.av-punk:root:not([data-theme="punk"]) .af--ill .af-steps4 .af-num{background:var(--av-surface);color:var(--av-ink)}
html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .af--ill .av-btn{border-color:var(--av-punk-on-yellow)}
html.av-punk[data-theme="light"]:root:not([data-theme="punk"]) .af--ill .av-btn.is-ghost{background:rgba(251,245,228,.9);color:var(--av-ink)}