/* =====================================================================
   Publicidad y Material Impreso — capa temática (v1.0)
   Se carga DESPUÉS de styles.css. Reutiliza el cableado de v47.js:
   la entrada bloqueada (#graphic-entry-v472), el modal de galería y el dock.
   Aquí solo re-tematizamos: escena del taller de impresión + revista-trigger,
   íconos volando en el warp y la portada del portafolio como revista cerrada.
   ===================================================================== */

/* ---------- Warp: íconos de impresión volando hacia la cámara ---------- */
.pub-warp-icons{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.pub-warp-icons span{position:absolute;left:50%;top:50%;width:clamp(30px,4vw,54px);height:clamp(30px,4vw,54px);margin:calc(clamp(30px,4vw,54px)/-2) 0 0 calc(clamp(30px,4vw,54px)/-2);color:var(--gold-light);opacity:0;transform:translate(-50%,-50%) scale(.2);animation:pub-warp-fly 1.15s cubic-bezier(.5,.05,.6,1) var(--d,0s) both}
.pub-warp-icons span:nth-child(1){--a:18deg}.pub-warp-icons span:nth-child(2){--a:62deg;color:#5ec6ff}
.pub-warp-icons span:nth-child(3){--a:104deg;color:#ff72b8}.pub-warp-icons span:nth-child(4){--a:150deg}
.pub-warp-icons span:nth-child(5){--a:198deg;color:#ffe27a}.pub-warp-icons span:nth-child(6){--a:236deg;color:#5ec6ff}
.pub-warp-icons span:nth-child(7){--a:288deg;color:#ff72b8}.pub-warp-icons span:nth-child(8){--a:326deg}
.pub-warp-icons span svg{width:100%;height:100%;display:block;filter:drop-shadow(0 0 10px rgba(var(--gold-rgb),.5))}
@keyframes pub-warp-fly{
  0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateY(0) scale(.15)}
  22%{opacity:1}
  100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--a)) translateY(-72vh) scale(1.9)}
}
.reduce-motion .pub-warp-icons{display:none}

/* ---------- Entrada interactiva: el taller de impresión ---------- */
/* Título: responsive, centrado arriba, envuelve por palabras (nunca corta) */
.pub-entry .graphic-entry-v472__title{max-width:min(90vw,640px);margin:0 auto;font-size:clamp(1.55rem,3.3vw,3.05rem);line-height:1.05;white-space:normal;text-wrap:balance;overflow-wrap:normal;word-break:keep-all;hyphens:none}
@media (min-width:1100px){.pub-entry .graphic-entry-v472__title{white-space:normal}}
@media (max-height:640px){.pub-entry .graphic-entry-v472__title{font-size:clamp(1.35rem,4.4vw,2.1rem)}}
.pub-entry__ambient{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.pub-entry__ink{position:absolute;border-radius:50%;filter:blur(46px);opacity:.5;mix-blend-mode:screen;animation:pub-drift 18s ease-in-out infinite alternate}
.pub-entry__ink--c{width:34vw;height:34vw;left:-6vw;top:8vh;background:#25b7ff}
.pub-entry__ink--m{width:30vw;height:30vw;right:-4vw;top:2vh;background:#ff4fa3;animation-delay:-6s}
.pub-entry__ink--y{width:26vw;height:26vw;left:38vw;bottom:-8vh;background:#ffd54a;animation-delay:-11s}
.pub-entry__token{position:absolute;font:800 .82rem/1 ui-monospace,"SFMono-Regular",monospace;letter-spacing:.28em;color:rgba(255,255,255,.14)}
.pub-entry__token--one{left:6vw;top:20vh}
.pub-entry__token--two{right:7vw;top:15vh}
.pub-entry__token--three{left:50%;bottom:9vh;transform:translateX(-50%)}
@keyframes pub-drift{to{transform:translate3d(4%,3%,0) scale(1.12)}}

.pub-entry__stage{position:absolute;inset:0;z-index:3;display:flex;align-items:flex-end;justify-content:space-around;gap:clamp(8px,3vw,50px);padding:0 clamp(14px,5vw,80px) clamp(16px,6vh,70px);transition:opacity .5s ease,transform .5s ease}
.pub-entry.is-impacting .pub-entry__stage{opacity:0;transform:scale(1.04)}
.pub-figure{position:relative;flex:0 0 auto}
.pub-figure svg{display:block;width:100%;height:auto;overflow:visible}

/* Título + hint sobre la escena */
.pub-entry__head{position:absolute;z-index:5;left:50%;top:clamp(26px,6vh,74px);transform:translateX(-50%);width:min(92vw,660px);padding:clamp(12px,2vh,20px) clamp(18px,3vw,32px);border-radius:20px;background:rgba(6,8,18,.36);border:1px solid rgba(var(--gold-rgb),.16);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);text-align:center;transition:opacity .45s ease,transform .45s ease}
.pub-entry.is-throwing .pub-entry__head,.pub-entry.is-impacting .pub-entry__head{opacity:0;transform:translateX(-50%) translateY(-24px)}
.pub-entry__hint{position:absolute;z-index:8;left:50%;top:auto;bottom:clamp(16px,3.4vh,34px);transform:translateX(-50%);margin:0;display:inline-flex;align-items:center;gap:9px;padding:9px 18px;border-radius:999px;background:rgba(8,10,22,.55);border:1px solid rgba(var(--gold-rgb),.3);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;font-weight:800;color:var(--gold-light);white-space:nowrap;transition:opacity .35s ease,transform .35s ease}
.pub-entry.is-throwing .pub-entry__hint,.pub-entry.is-impacting .pub-entry__hint{opacity:0;transform:translateX(-50%) translateY(10px)}
.pub-entry__hint::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(var(--gold-rgb),.6);animation:pub-hint-pulse 1.9s ease-out infinite}
@media (max-width:560px){.pub-entry__hint{bottom:clamp(12px,3vh,22px)}}
@keyframes pub-hint-pulse{0%{box-shadow:0 0 0 0 rgba(var(--gold-rgb),.55)}70%{box-shadow:0 0 0 13px rgba(var(--gold-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--gold-rgb),0)}}

/* Pendón / roll-up (izquierda) */
.pub-rollup{width:clamp(104px,14vw,206px);align-self:flex-end;animation:pub-sway 7s ease-in-out infinite alternate;transform-origin:bottom center}
@keyframes pub-sway{to{transform:rotate(1.6deg)}}

/* Figura derecha sosteniendo el catálogo con el logo */
.pub-holder{width:clamp(150px,20vw,300px);align-self:flex-end;animation:pub-hold-bob 4.6s ease-in-out infinite}
@keyframes pub-hold-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* Chica (centro) sosteniendo la revista */
.pub-girl{width:clamp(176px,23vw,326px);align-self:flex-end;transition:opacity .45s ease,transform .5s ease}
.pub-entry.is-throwing .pub-girl,.pub-entry.is-impacting .pub-girl{opacity:0;transform:translateY(18px) scale(.96)}
.pub-entry.is-throwing .pub-rollup,.pub-entry.is-throwing .pub-holder,
.pub-entry.is-impacting .pub-rollup,.pub-entry.is-impacting .pub-holder{opacity:0;transform:translateY(24px);transition:opacity .45s ease,transform .45s ease}

/* La revista = botón que dispara la secuencia (zoom hacia la cámara) */
.pub-mag{position:absolute;left:50%;top:63%;z-index:6;width:clamp(136px,14.5vw,166px);padding:0;border:0;background:transparent;cursor:pointer;transform:translate(-50%,-50%) rotate(-4deg);transform-origin:center center;transition:transform .55s cubic-bezier(.5,.08,.2,1),filter .5s ease,opacity .4s ease;filter:drop-shadow(0 26px 46px rgba(0,0,0,.6));will-change:transform}
.pub-mag svg{display:block;width:100%;height:auto;border-radius:6px}
.pub-mag__float{animation:pub-mag-float 4.6s ease-in-out infinite alternate}
@keyframes pub-mag-float{to{transform:translateY(-10px) rotate(1deg)}}
.pub-mag:hover{transform:translate(-50%,-50%) rotate(-1deg) scale(1.05)}
.pub-mag:focus-visible{outline:3px solid var(--gold-light);outline-offset:6px;border-radius:8px}
/* Anillo de invitación */
.pub-mag__ring{position:absolute;left:50%;top:50%;width:118%;height:118%;transform:translate(-50%,-50%);border-radius:14px;border:2px solid rgba(var(--gold-rgb),.55);opacity:0;pointer-events:none}
.pub-entry.is-ready .pub-mag__ring{opacity:1;animation:pub-ring 2.4s ease-out infinite}
@keyframes pub-ring{0%{opacity:.8;transform:translate(-50%,-50%) scale(.9)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}

/* Secuencia: la revista se acerca a la cámara y llena la pantalla */
.pub-entry.is-throwing .pub-mag{transform:translate(-50%,-52%) rotate(2deg) scale(2);filter:drop-shadow(0 50px 90px rgba(0,0,0,.6))}
.pub-entry.is-throwing .pub-mag__float,.pub-entry.is-throwing .pub-mag__ring{animation:none;opacity:0}
.pub-entry.is-impacting .pub-mag{transform:translate(-50%,-50%) rotate(0) scale(15);transition-duration:.95s;transition-timing-function:cubic-bezier(.62,0,.32,1)}
.pub-entry.is-clearing .pub-mag{opacity:0;transition:opacity .5s ease}

/* Flash blanco de impacto */
.pub-entry__flash{position:absolute;inset:0;z-index:7;background:#fff;opacity:0;pointer-events:none;transition:opacity .3s ease}
.pub-entry.is-confirming .pub-entry__flash{opacity:.92;transition:opacity .16s ease}
.pub-entry.is-clearing .pub-entry__flash{opacity:0;transition:opacity .5s ease}
.pub-entry.is-confirming .graphic-entry-v472__result,.pub-entry.is-clearing .graphic-entry-v472__result{z-index:9}

.reduce-motion .pub-mag{transition:none}
.reduce-motion .pub-mag__float,.reduce-motion .pub-rollup,.reduce-motion .pub-holder{animation:none}

@media (max-width:860px){
  .pub-rollup{width:clamp(78px,17vw,120px)}
  .pub-holder{width:clamp(118px,27vw,168px)}
  .pub-girl{width:clamp(150px,40vw,210px)}
  .pub-mag{width:clamp(120px,32vw,158px);top:62%}
  .pub-entry__stage{padding-inline:clamp(8px,3vw,20px);gap:4px}
}
@media (max-width:560px){
  .pub-rollup,.pub-holder{display:none}
  .pub-entry__stage{justify-content:center}
  .pub-girl{width:min(60vw,250px)}
  .pub-mag{top:60%}
}

/* ---------- Portafolio: revista cerrada "para hojear" ---------- */
.pub-portfolio-mag{position:relative;display:block;width:100%;min-height:520px;padding:clamp(28px,5vw,58px);overflow:hidden;border:1px solid rgba(var(--gold-rgb),.3);border-radius:34px;color:#fff;cursor:pointer;isolation:isolate;background:radial-gradient(circle at 50% 12%,rgba(var(--gold-rgb),.14),transparent 42%),linear-gradient(180deg,#140d09,#05060b);box-shadow:var(--shadow)}
.pub-portfolio-mag__desk{position:absolute;inset:auto 0 0;height:46%;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0));border-top:1px solid rgba(255,255,255,.06)}
.pub-portfolio-mag__book{position:relative;z-index:2;width:min(78%,440px);margin:clamp(10px,3vh,26px) auto 0;aspect-ratio:1.34/1;filter:drop-shadow(0 44px 60px rgba(0,0,0,.6));transition:transform .6s var(--ease)}
.pub-portfolio-mag:hover .pub-portfolio-mag__book{transform:translateY(-10px) rotate(-1deg)}
.pub-portfolio-mag__book svg{display:block;width:100%;height:100%;overflow:visible}
.pub-portfolio-mag__cta{position:relative;z-index:3;margin:clamp(18px,3vh,30px) auto 0;display:flex;width:max-content;align-items:center;gap:11px;padding:13px 26px;border-radius:999px;font-weight:850;color:#070914;background:linear-gradient(120deg,var(--gold-light),var(--gold));box-shadow:0 18px 42px -14px rgba(var(--gold-rgb),.8)}
.pub-portfolio-mag__cta svg{width:18px;height:18px}
.pub-portfolio-mag:hover .pub-portfolio-mag__cta{transform:translateY(-2px)}
.pub-portfolio-mag__hint{position:absolute;z-index:3;left:0;right:0;top:clamp(20px,4vw,40px);text-align:center;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.5)}
@media (max-width:640px){.pub-portfolio-mag{min-height:420px}.pub-portfolio-mag__book{width:82%}}


/* =====================================================================
   v2.0 — Hero de entrada reconstruido: marca integrada + composición fija
   ===================================================================== */
.pub-entry{
  background:
    radial-gradient(circle at 50% 78%,rgba(234,194,102,.2),transparent 27%),
    radial-gradient(circle at 10% 46%,rgba(37,183,255,.24),transparent 35%),
    radial-gradient(circle at 91% 37%,rgba(255,79,163,.23),transparent 36%),
    linear-gradient(145deg,#02050d 0%,#080a18 54%,#03030b 100%);
}
.pub-entry__head{
  top:clamp(22px,5.5vh,60px);
  width:min(92vw,760px);
  padding:clamp(10px,1.8vh,18px) clamp(16px,3vw,30px);
  background:linear-gradient(180deg,rgba(5,7,16,.62),rgba(5,7,16,.28));
  border-color:rgba(var(--gold-rgb),.24);
  box-shadow:0 22px 80px rgba(0,0,0,.26);
}
.pub-entry .pub-entry__title{
  max-width:100%;
  display:grid;
  justify-items:center;
  gap:.02em;
  margin:0;
  font-size:clamp(1.65rem,3.35vw,3.1rem);
  line-height:.98;
  letter-spacing:-.045em;
  text-align:center;
  white-space:normal;
}
.pub-entry__title span{display:block;max-width:100%;white-space:nowrap}

.pub-entry__stage{
  position:absolute;
  inset:clamp(128px,24vh,170px) 0 clamp(70px,11vh,90px);
  z-index:4;
  display:grid;
  grid-template-columns:minmax(100px,.82fr) minmax(220px,1.35fr) minmax(150px,1fr);
  align-items:end;
  justify-items:center;
  gap:clamp(8px,3vw,54px);
  width:min(1180px,96vw);
  margin-inline:auto;
  padding:0 clamp(10px,2.8vw,42px);
  transition:none;
}
.pub-entry.is-impacting .pub-entry__stage{opacity:1;transform:none}
.pub-entry__stage > *{min-width:0}

.pub-rollup{
  width:min(100%,clamp(112px,14vw,190px));
  justify-self:start;
  transform-origin:bottom center;
}
.pub-center{
  position:relative;
  align-self:end;
  width:min(100%,clamp(235px,29vw,390px));
  aspect-ratio:260/360;
  z-index:5;
  filter:drop-shadow(0 30px 42px rgba(0,0,0,.38));
}
.pub-center__person,.pub-center__hands{
  position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible;
  transition:opacity .42s ease,transform .5s ease;
}
.pub-center__hands{z-index:9;pointer-events:none}
.pub-center .pub-mag{
  left:50%;
  top:67.5%;
  z-index:8;
  width:clamp(108px,42%,166px);
  transform:translate(-50%,-50%) rotate(-2.5deg);
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.58));
}
.pub-center .pub-mag:hover{transform:translate(-50%,-50%) rotate(0deg) scale(1.045)}
.pub-holder{
  width:min(100%,clamp(165px,22vw,300px));
  justify-self:end;
}
.pub-entry.is-throwing .pub-center__person,
.pub-entry.is-throwing .pub-center__hands,
.pub-entry.is-impacting .pub-center__person,
.pub-entry.is-impacting .pub-center__hands,
.pub-entry.is-throwing .pub-rollup,
.pub-entry.is-throwing .pub-holder,
.pub-entry.is-impacting .pub-rollup,
.pub-entry.is-impacting .pub-holder{
  opacity:0;
  transform:translateY(18px) scale(.97);
}
.pub-entry.is-throwing .pub-center .pub-mag{
  transform:translate(-50%,-54%) rotate(1deg) scale(2.15);
}
.pub-entry.is-impacting .pub-center .pub-mag{
  transform:translate(-50%,-50%) rotate(0) scale(15);
  transition-duration:.95s;
}
.pub-entry.is-clearing .pub-center .pub-mag{opacity:0}

.pub-entry__hint{
  top:auto;
  bottom:max(clamp(12px,2.7vh,26px),env(safe-area-inset-bottom));
  z-index:14;
  padding:10px 20px;
  background:rgba(5,7,16,.78);
  border-color:rgba(var(--gold-rgb),.46);
  box-shadow:0 14px 44px rgba(0,0,0,.42);
}
.pub-entry__flash{z-index:15}
.pub-entry .graphic-entry-v472__result{z-index:16}

@media (max-height:690px){
  .pub-entry__head{top:18px}
  .pub-entry .pub-entry__title{font-size:clamp(1.45rem,3.1vw,2.45rem)}
  .pub-entry__stage{inset:112px 0 58px;width:min(1060px,97vw)}
  .pub-center{width:min(100%,clamp(210px,27vw,330px))}
  .pub-rollup{width:min(100%,clamp(96px,13vw,155px))}
  .pub-holder{width:min(100%,clamp(145px,20vw,245px))}
  .pub-entry__hint{bottom:10px}
}
@media (max-width:760px){
  .pub-entry__head{width:min(94vw,580px)}
  .pub-entry .pub-entry__title{font-size:clamp(1.55rem,6.4vw,2.45rem)}
  .pub-entry__stage{
    inset:clamp(126px,23vh,160px) 0 clamp(64px,10vh,84px);
    grid-template-columns:minmax(70px,.62fr) minmax(185px,1.45fr) minmax(90px,.72fr);
    gap:4px;
    width:100%;
    padding-inline:6px;
  }
  .pub-rollup{width:min(100%,110px)}
  .pub-holder{width:min(100%,150px)}
  .pub-center{width:min(100%,270px)}
  .pub-center .pub-mag{width:42%}
}
@media (max-width:520px){
  .pub-entry__title span{white-space:normal}
  .pub-entry__stage{grid-template-columns:1fr;inset:clamp(130px,25vh,170px) 0 66px}
  .pub-rollup,.pub-holder{display:none}
  .pub-center{width:min(78vw,290px)}
  .pub-entry__token{display:none}
  .pub-entry__hint{font-size:.64rem;letter-spacing:.16em;padding:9px 15px}
}
@media (max-height:500px) and (orientation:landscape){
  .pub-entry__head{top:9px;padding:7px 14px}
  .pub-entry .pub-entry__title{font-size:1.35rem}
  .pub-entry__stage{inset:76px 0 48px;grid-template-columns:.8fr 1.2fr .9fr}
  .pub-center{width:min(32vw,230px)}
  .pub-rollup{width:min(15vw,105px)}
  .pub-holder{width:min(20vw,150px)}
  .pub-entry__hint{bottom:5px}
}
@media (prefers-reduced-motion:reduce){
  .pub-entry__ink,.pub-rollup,.pub-holder,.pub-mag__float,.pub-entry__hint::before{animation:none!important}
}