/* REDLPM — página pública de un miembro. Tres plantillas (clase del body): t-retrato (clara, tipo revista), t-claqueta (oscura, de crew), t-estudio (productora).
   Sin JavaScript y sin estilos en línea (la página lo prohíbe por seguridad). */
*{box-sizing:border-box} h1,h2,p{margin:0}
body{margin:0;font:17px/1.6 'Poppins','Helvetica Neue',Arial,sans-serif;-webkit-font-smoothing:antialiased;background:var(--bg);color:var(--tx);
  --bg:#0e0f11;--tx:#f6f6f4;--tx2:#c9cdd1;--mut:#9aa0a6;--ln:#272b2f;--ac:#7fd3c4;--card:#15171a;--btn:#7fd3c4;--btntx:#0e0f11;
  --disp:'Anton',Impact,sans-serif;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace}
main{max-width:860px;margin:0 auto;padding:0 20px 56px}
a{color:var(--ac)} img{display:block;max-width:100%}
h2{font:500 13px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:14px}
section{margin-top:44px}

.hero{margin:0 -20px;position:relative}
.cover{width:100%;aspect-ratio:2.39/1;max-height:380px;object-fit:cover}
.quien{display:flex;gap:20px;align-items:flex-end;padding:0 20px;margin-top:22px}
.cover + .quien{margin-top:-60px;position:relative}
.foto{width:132px;height:132px;border-radius:50%;object-fit:cover;flex:none;border:4px solid var(--bg);background:var(--card)}
.foto.ini{display:grid;place-items:center;font:400 54px var(--disp);color:var(--ac)}
.logo{max-height:56px;max-width:220px;object-fit:contain;margin-bottom:10px}
h1{font:400 clamp(36px,7vw,60px)/1 var(--disp);text-transform:uppercase;letter-spacing:.01em;overflow-wrap:anywhere}
.oficio{font:500 13px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ac);margin-top:8px}
.zona{color:var(--mut);font-size:15px;margin-top:2px}
.lema{font-size:clamp(20px,3vw,26px);line-height:1.35;margin-top:30px;max-width:26ch;font-weight:500}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.chips span{padding:8px 14px;border:1px solid var(--ln);border-radius:18px;font-size:14px;color:var(--tx2);white-space:nowrap}
.bio p{max-width:62ch;color:var(--tx2)}

.serv div{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.serv article{background:var(--card);border:1px solid var(--ln);border-radius:10px;padding:18px}
.serv b{display:block;font-weight:600;font-size:18px} .serv span{display:block;color:var(--tx2);font-size:15px;margin-top:4px}
.gal div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.gal img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px;background:var(--card)}
.dias div{display:flex;gap:8px;flex-wrap:wrap}
.dias span{padding:10px 16px;border-radius:8px;background:var(--card);border:1px solid var(--ln);font:500 14px var(--mono);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}

.cta{padding:30px 24px;border:1px solid var(--ln);border-radius:14px;background:var(--card)}
.cta p{margin-top:12px} .contacto,.links{display:flex;gap:8px 22px;flex-wrap:wrap;font-weight:500}
.btn{display:inline-flex;align-items:center;min-height:50px;padding:0 26px;border-radius:25px;background:var(--btn);color:var(--btntx);font-weight:600;text-decoration:none;white-space:nowrap}
.btn:focus-visible,a:focus-visible{outline:2px solid var(--ac);outline-offset:3px}

footer{border-top:1px solid var(--ln);padding:26px 20px 40px;text-align:center}
footer a{text-decoration:none;color:var(--tx);font:500 14px var(--mono)} footer span{color:var(--mut)}
footer b{font:400 22px/1 var(--disp);letter-spacing:.02em;margin-left:4px} footer em{font-style:normal;color:#f0293a}
footer small{display:block;color:var(--mut);font-size:14px;margin-top:8px}

/* Retrato: actores, modelos, locutores */
.t-retrato{--bg:#f4f1ea;--tx:#161617;--tx2:#3d362f;--mut:#574c41;--ln:#d6cfc2;--ac:#8a3324;--card:#ebe6db;--btn:#161617;--btntx:#f4f1ea}
.t-retrato h1{font:italic 500 clamp(40px,8vw,72px)/1 'Playfair Display',Georgia,serif;text-transform:none;letter-spacing:0}
.t-retrato .quien{flex-direction:column;align-items:flex-start}
.t-retrato .foto{width:min(100%,360px);height:auto;aspect-ratio:4/5;border-radius:4px;border:0}
.t-retrato .cover + .quien{margin-top:-120px}
.t-retrato .lema{font-family:'Playfair Display',Georgia,serif;font-style:italic;font-weight:500}
.t-retrato .chips span{border-radius:4px} .t-retrato .btn{border-radius:4px} .t-retrato .gal img{aspect-ratio:4/5}
.t-retrato footer em{color:#b3121f}

/* Estudio: productoras, directores, productores */
.t-estudio{--bg:#0e0e0e;--tx:#fafafa;--tx2:#cfcfcf;--mut:#a3a3a8;--ln:#2d2d30;--ac:#ff5a67;--card:#1b1b1d;--btn:#d91f2f;--btntx:#fff}
.t-estudio .foto{display:none} .t-estudio .cover + .quien{margin-top:26px}
.t-estudio .btn{border-radius:4px} .t-estudio .serv article{border-radius:4px}
.t-estudio .lema{max-width:30ch;font:400 clamp(26px,4.4vw,40px)/1.08 var(--disp);text-transform:uppercase}

@media (max-width:600px){ body{font-size:16px} .foto{width:104px;height:104px} .cover + .quien{margin-top:-46px} .quien{gap:14px} .gal div{grid-template-columns:repeat(2,minmax(0,1fr))} section{margin-top:36px} }

/* Reel y recomendaciones */
.reel div{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#000} .reel iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.recs div{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.recs blockquote{margin:0;background:var(--card);border:1px solid var(--ln);border-radius:10px;padding:18px} .recs blockquote p{margin:0;font-size:15.5px;white-space:pre-wrap;overflow-wrap:anywhere}
.recs footer{display:flex;gap:4px 10px;flex-wrap:wrap;align-items:baseline;margin-top:12px;font-size:14px;border:0;padding:0;text-align:left} .recs footer b{font-weight:600} .recs footer span{color:var(--tx2)} .recs footer i{font-style:normal;font-size:12px;border:1px solid var(--ln);border-radius:10px;padding:1px 8px;color:var(--tx2)}

/* Tarjeta digital: acciones arriba, formas de pago y código de la tarjeta */
.acc{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 4px} .acc .btn{min-height:46px;padding:0 20px} .btn.sec{background:none;border:1px solid var(--ln);color:var(--tx)}
.qr{display:block;width:100%;height:auto;border-radius:8px}
.pagos div{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.pagos article{background:var(--card);border:1px solid var(--ln);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:4px} .pagos article a{display:block;max-width:200px;margin-bottom:8px} .pagos b{font-weight:600;font-size:17px} .pagos span{overflow-wrap:anywhere} .pagos small{color:var(--tx2);font-size:13px}
.tarj{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:20px;border:1px solid var(--ln);border-radius:14px;background:var(--card)} .tarj div{flex:0 0 132px} .tarj p{flex:1 1 220px;margin:0} .tarj b{display:block;font-weight:600;font-size:18px} .tarj span{color:var(--tx2);font-size:15px}

footer .leg{font-size:13px;margin:0 0 10px} footer .leg a{color:inherit}
/* PORTADA QUE SE FUNDE (11-10-2026, Ignacio: "que el texto no se pierda por el fondo de la foto"): la parte baja de la portada se desvanece hacia el fondo de la página, así el nombre siempre queda sobre color liso. */
.cover{-webkit-mask-image:linear-gradient(#000 45%,rgba(0,0,0,.35) 72%,transparent 96%);mask-image:linear-gradient(#000 45%,rgba(0,0,0,.35) 72%,transparent 96%)}
.t-estudio .cover{-webkit-mask-image:none;mask-image:none}
/* sombra suave bajo el nombre y la especialidad cuando van sobre la portada */
.cover + .quien h1{text-shadow:0 2px 14px rgba(0,0,0,.75),0 1px 2px rgba(0,0,0,.6)} .cover + .quien .oficio,.cover + .quien .zona{text-shadow:0 1px 8px rgba(0,0,0,.8)}

footer b i{display:inline-block;width:.4em;height:.4em;margin:0 .17em;border-radius:50%;background:#f0293a;vertical-align:.1em}
.t-retrato footer b i{background:#b3121f}
@media (prefers-reduced-motion:no-preference){footer b i{animation:recp 2.2s ease-in-out infinite}} @keyframes recp{50%{opacity:.3}}

/* créditos y trabajos (13-10-2026) */
.creds ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.creds li{display:grid;gap:2px;padding:12px 14px;border:1px solid var(--ln);border-radius:10px;background:var(--card)}
.creds li b{font-weight:600} .creds li a{color:var(--tx)} .creds li span{color:var(--mut);font-size:14px}