/* =========================================================
   A UMBRAL — Diseño nuevo, piezas comunes (portada, plataforma…).
   Se carga solo en las plantillas rediseñadas (aumbral_diseno_nuevo()).
   Cada sección nueva lleva la clase .ph; el <body>, .au-nuevo.
   ========================================================= */

.au-nuevo{
  --c-bg:#f5f4f0; --c-alt:#eae8e1; --c-dark:#1a1a1a; --c-red:#ed4044;
  --c-line:#d0cfc8; --c-grey:#888; --c-txt:#555;
  --pad:clamp(20px,4vw,56px);
  --max:1320px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --f-tit:'PP Neue Machina',sans-serif;
}
.au-nuevo .ph em{font-style:normal;color:var(--c-red);}

/* style.css fuerza p, a, span y li a 14px mono con !important en toda la web.
   En las secciones nuevas se anula y cada pieza fija su letra con
   --ff/--fs/--lh (las variables no se ven afectadas por ese !important). */
.au-nuevo .ph :is(p,a,span,li){
  font-family:var(--ff,inherit) !important;font-size:var(--fs,inherit) !important;line-height:var(--lh,inherit) !important;
}
/* …y pinta todos los <button> de rojo, también con !important. */
.au-nuevo .ph button{font-family:'PP Neue Montreal Mono',monospace !important;text-transform:none !important;border-radius:0 !important;}

/* ── Piezas comunes ─────────────────────────────────────── */
.ph-lbl{display:block;font-size:10px;letter-spacing:.2em;color:var(--c-grey);margin-bottom:18px;}
.ph-h2{font-family:var(--f-tit);font-weight:300;font-size:clamp(30px,4.4vw,60px);line-height:1.02;color:var(--c-dark);letter-spacing:-.01em;}
.ph-sec{padding:clamp(72px,10vw,140px) var(--pad);max-width:var(--max);margin:0 auto;}
.ph-head{margin-bottom:clamp(36px,5vw,64px);}

.ph-btn{display:inline-flex;align-items:center;gap:12px;background:var(--c-red);color:#fff;--fs:11px;letter-spacing:.12em;padding:16px 26px;border:1px solid var(--c-red);transition:background .25s,color .25s;}
.ph-btn span{display:inline-block;transition:transform .35s var(--ease);}
.ph-btn:hover{background:var(--c-dark);border-color:var(--c-dark);color:#fff;}
.ph-btn:hover span{transform:translateX(5px);}
.ph-btn-o{background:transparent;color:var(--c-dark);border-color:var(--c-dark);}
.ph-btn-o:hover{background:var(--c-dark);color:#fff;}
.ph-link{--fs:11px;letter-spacing:.12em;color:var(--c-dark);padding:16px 4px;background:linear-gradient(var(--c-red),var(--c-red)) left calc(100% - 12px)/0 1px no-repeat,linear-gradient(var(--c-line),var(--c-line)) left calc(100% - 12px)/100% 1px no-repeat;transition:background-size .4s var(--ease),color .25s;}
.ph-link:hover{color:var(--c-red);background-size:100% 1px,100% 1px;}
.ph-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;}
.ph-eyebrow{display:block;--fs:10px;letter-spacing:.22em;color:var(--c-red);margin-bottom:26px;}
.ph-h1{font-family:var(--f-tit);font-weight:300;font-size:clamp(44px,7.6vw,118px);line-height:.96;letter-spacing:-.02em;color:var(--c-dark);margin-bottom:30px;}
.ph-ln{display:block;overflow:hidden;padding-bottom:.06em;}
.ph-ln>span{display:inline-block;}
.ph-lista{list-style:none;margin:0 0 30px;border-top:1px solid var(--c-line);}
.ph-lista li{--fs:12px;color:var(--c-dark);padding:12px 0 12px 22px;border-bottom:1px solid var(--c-line);position:relative;}
.ph-lista li::before{content:"";position:absolute;left:0;top:18px;width:9px;height:1px;background:var(--c-red);}

/* Citas */
.ph-voz{margin:0;}
.ph-voz blockquote{font-family:var(--f-tit);font-weight:300;font-size:clamp(22px,3vw,40px);line-height:1.22;color:var(--c-dark);margin:0 0 28px;max-width:1000px;}
.ph-voz blockquote::before{content:"“";color:var(--c-red);}
.ph-voz blockquote::after{content:"”";color:var(--c-red);}
.ph-voz figcaption{font-size:11px;letter-spacing:.16em;color:var(--c-dark);display:flex;align-items:center;gap:14px;}
.ph-voz figcaption::before{content:"";width:28px;height:1px;background:var(--c-red);}

/* Cierre */
.ph-cierre{padding:clamp(90px,13vw,180px) var(--pad);max-width:var(--max);margin:0 auto;border-top:1px solid var(--c-line);}
.ph-cierre-t{--ff:var(--f-tit);font-weight:300;--fs:clamp(40px,8vw,128px);--lh:.98;letter-spacing:-.02em;color:var(--c-dark);margin-bottom:clamp(36px,4vw,56px);}
.ph-cierre-t>span{display:block;}

/* ── Animaciones ───────────────────────────────────────── */
/* Entrada al cargar */
.au-anim .ph-load{animation:ph-sube 1s var(--ease) both;animation-delay:calc(.15s + var(--d,0) * .11s);}
.au-anim .ph-ln>.ph-load{animation-name:ph-linea;}
@keyframes ph-sube{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
@keyframes ph-linea{from{transform:translateY(105%);}to{transform:none;}}
@keyframes ph-zoom{from{opacity:0;transform:scale(1.08);}to{opacity:1;transform:scale(1);}}

/* Aparición al llegar con el scroll (aumbral-diseno.js añade .in) */
.au-anim .rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--d,0) * .1s);}
.au-anim .rv.in{opacity:1;transform:none;}
/* Red de seguridad: si el JS no llega, a los 3 s se ve todo igual. */
.au-anim .rv:not(.in){animation:ph-visible 0s 3s forwards;}
.au-anim.ph-js .rv:not(.in){animation:none;}
@keyframes ph-visible{to{opacity:1;transform:none;}}

/* Aparición en cascada de los hijos de .ph-cascada (aumbral-diseno.js) */
.au-anim .ph-cascada>*{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease),background .3s;}
.au-anim .ph-cascada.in>*{opacity:1;transform:none;}
.au-anim .ph-cascada:not(.in)>*{animation:ph-visible 0s 3s forwards;}
.au-anim.ph-js .ph-cascada:not(.in)>*{animation:none;}
@media (prefers-reduced-motion:reduce){
  .au-anim .ph-cascada>*{opacity:1;transform:none;transition:none;animation:none;}
}

@media (prefers-reduced-motion:reduce){
  .au-anim .ph-load{animation:none;}
  .au-anim .rv{opacity:1;transform:none;transition:none;animation:none;}
}