:root{
  --yellow:#f4ee2a;
  --red:#e63946;
  --blue:#2257e9;
  --ink:#0a0a0a;
  --paper:#fffaf0;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{margin:0;background:var(--yellow);color:var(--ink);font-family:"Archivo",sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

nav.top{position:sticky;top:0;z-index:50;background:var(--yellow);border-bottom:3px solid var(--ink);display:flex;justify-content:space-between;align-items:center;padding:14px 32px;transition:background .2s}
nav.top.scrolled{background:rgba(244,238,42,.94);backdrop-filter:blur(12px)}
.logo{display:flex;align-items:center;gap:10px;font-family:"Archivo Black",sans-serif;font-size:17px;letter-spacing:-0.02em}
.logo .dot{width:24px;height:24px;background:var(--red);border-radius:50%;animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
nav.top ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
nav.top li a{padding:8px 14px;font-family:"Archivo Black",sans-serif;font-size:12px;letter-spacing:.04em;border:2px solid transparent;border-radius:999px;transition:all .15s;display:block}
nav.top li a:hover{border-color:var(--ink);transform:rotate(-2deg)}
nav.top li.cta a{background:var(--red);color:#fff;border-color:var(--ink)}
nav.top li.cta a:hover{background:var(--ink);color:var(--yellow);transform:rotate(2deg) scale(1.05)}
.burger{display:none;width:40px;height:40px;background:var(--red);border-radius:50%;color:#fff;font-weight:900;font-size:22px;align-items:center;justify-content:center;cursor:pointer;border:2px solid var(--ink)}

.first-screen{height:calc(100vh - var(--nav-h,62px));display:flex;flex-direction:column;overflow:hidden}
.first-screen .hero{flex:1 1 0;min-height:0}
.hero{padding:28px 32px 20px;position:relative;display:grid;grid-template-columns:1.4fr 1fr;gap:32px;align-items:center;overflow:hidden}
.hero-text h1{font-family:"Archivo Black",sans-serif;font-size:clamp(72px,min(12vw,15vh),220px);line-height:.85;letter-spacing:-0.05em;margin:0}
/* Las dos lineas del titular van en bloques propios para poder separarlas sin depender
   del line-height: el rectangulo rojo necesita crecer hacia arriba y abrazar la tilde. */
.hero-text h1 .l1,.hero-text h1 .l2{display:block}
.hero-text h1 .l2{margin-top:.1em}
.hero-text h1 .accent{display:inline-block;background:var(--red);color:var(--yellow);padding:.17em 18px .03em;transform:rotate(-2deg);margin-left:.15em}
.hero-text h1 .it{font-family:"Fraunces",serif;font-weight:400;font-style:italic;letter-spacing:-0.02em;font-size:.78em}
.hero-text h1 .dot-blue{color:var(--blue)}
.hero-cta{display:flex;gap:14px;align-items:center;margin-top:20px;flex-wrap:wrap}
.btn{font-family:"Archivo Black",sans-serif;font-size:13px;letter-spacing:.04em;padding:16px 24px;border:2px solid var(--ink);cursor:pointer;background:var(--ink);color:var(--yellow);transition:transform .15s,box-shadow .15s;display:inline-flex;align-items:center;gap:8px}
.btn:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.red{background:var(--red);color:#fff}
.hero-subline{font-family:"JetBrains Mono",monospace;font-size:12px;max-width:280px;line-height:1.45;color:#333;margin:0}
.hero-subline span{opacity:.5}
.hero-role{font-family:"Archivo Black",sans-serif;font-size:clamp(14px,2vw,28px);letter-spacing:-0.02em;line-height:1.05;margin:20px 0 0}
.hero-role .ast{color:var(--red)}
.hero-note{font-family:"Fraunces",serif;font-style:italic;font-size:clamp(14px,1.5vw,22px);color:var(--red);margin:4px 0 0}

.hero-photo{position:relative}
.hero-photo .frame{aspect-ratio:4/5;border:3px solid var(--ink);background:#1a1a1a center/cover;transform:rotate(2deg);transition:transform .4s cubic-bezier(.2,.7,.3,1);position:relative;overflow:hidden;box-shadow:12px 12px 0 var(--ink)}
.hero-photo:hover .frame{transform:rotate(-1deg) scale(1.02)}
.sticker{position:absolute;font-family:"Archivo Black",sans-serif;font-size:12px;padding:6px 12px;border:2px solid var(--ink);background:var(--yellow);transform:rotate(-6deg);z-index:2}
.sticker.tl{top:-14px;left:-14px}
.sticker.br{bottom:-14px;right:-14px;background:var(--blue);color:#fff;transform:rotate(4deg)}
.badge-round{position:absolute;top:24px;right:24px;width:96px;height:96px;background:var(--blue);border-radius:50%;display:grid;place-items:center;color:#fff;font-family:"Archivo Black",sans-serif;font-size:11px;text-align:center;line-height:1.1;animation:spinSlow 18s linear infinite;z-index:2}
@keyframes spinSlow{from{transform:rotate(-12deg)}to{transform:rotate(348deg)}}

.marquee{display:block;text-decoration:none;background:var(--ink);color:var(--yellow);padding:14px 0;overflow:hidden;white-space:nowrap;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.marquee:hover{color:#fff}
.marquee-track{display:inline-block;animation:marq 22s linear infinite;font-family:"Archivo Black",sans-serif;font-size:30px;letter-spacing:-0.02em}
.marquee-track span{margin-right:40px}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

section{padding:80px 32px;border-bottom:3px solid var(--ink)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:40px;gap:20px;flex-wrap:wrap}
.section-head h2{font-family:"Archivo Black",sans-serif;font-size:clamp(48px,8vw,96px);letter-spacing:-0.04em;line-height:.88;margin:0}
.section-head h2 em{font-family:"Fraunces",serif;font-style:italic;font-weight:400;color:var(--red)}
.section-tag{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;background:var(--ink);color:var(--yellow);padding:8px 14px}

.filters{display:flex;gap:8px;margin-bottom:28px;flex-wrap:wrap}
.filter{font-family:"Archivo Black",sans-serif;font-size:11px;letter-spacing:.05em;padding:8px 14px;border:2px solid var(--ink);border-radius:999px;background:transparent;cursor:pointer;transition:all .12s}
.filter:hover{background:var(--ink);color:var(--yellow)}
.filter.active{background:var(--red);color:#fff;border-color:var(--ink)}

/* CV / Currículum */
#cv{background:var(--paper)}
.cv-tabs{display:flex;gap:8px;margin-bottom:32px;flex-wrap:wrap}
.cv-tab{font-family:"Archivo Black",sans-serif;font-size:12px;letter-spacing:.05em;padding:10px 18px;border:3px solid var(--ink);background:#fff;cursor:pointer;transition:all .15s}
.cv-tab:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
.cv-tab.active{background:var(--red);color:#fff}
.cv-panel{display:none}
.cv-panel.active{display:block;animation:fade .25s}
.cv-row{display:grid;grid-template-columns:140px 1fr;gap:24px;padding:20px 0;border-bottom:1px dashed rgba(10,10,10,.2);align-items:start}
.cv-row:first-child{border-top:3px solid var(--ink)}
.cv-row:last-child{border-bottom:3px solid var(--ink)}
.cv-year{font-family:"Archivo Black",sans-serif;font-size:18px;color:var(--red);letter-spacing:.02em}
.cv-row h4{font-family:"Fraunces",serif;font-style:italic;font-size:24px;font-weight:600;margin:0 0 4px;letter-spacing:-0.01em}
.cv-row p{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.05em;color:#444;margin:0;line-height:1.5}
.cv-cta{margin-top:32px;text-align:center}
.cv-tabs-bottom{margin-top:32px;margin-bottom:0}
.cv-top-link{margin-top:20px;text-align:center}
.cv-back-top{font-family:"Archivo Black",sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--ink);padding-bottom:2px;transition:color .15s}
.cv-back-top:hover{color:var(--red);border-color:var(--red)}
.cv-subhead{font-family:"Archivo Black",sans-serif;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--red);margin:40px 0 0;padding-bottom:6px;border-bottom:2px solid var(--ink)}
.cv-subhead:first-child{margin-top:0}

/* WORK CARDS (carteles reales) */
.works-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.work-card{display:flex;flex-direction:column;gap:14px;transition:transform .25s}
.work-card:hover{transform:translateY(-6px)}
.work-poster{aspect-ratio:2/3;background:#1a1a1a center/cover;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);position:relative;cursor:pointer;overflow:hidden;transition:box-shadow .2s,transform .25s}
.work-card:nth-child(odd) .work-poster{transform:rotate(-1deg)}
.work-card:nth-child(even) .work-poster{transform:rotate(1deg)}
.work-card:hover .work-poster{transform:rotate(0);box-shadow:12px 12px 0 var(--ink)}
.work-poster.fit{background-size:contain;background-repeat:no-repeat;background-color:#111}
.work-tag{position:absolute;top:12px;left:12px;background:var(--yellow);color:var(--ink);padding:5px 10px;font-family:"Archivo Black",sans-serif;font-size:10px;letter-spacing:.1em;border:2px solid var(--ink);z-index:2}
.work-zoom{position:absolute;bottom:12px;right:12px;width:36px;height:36px;background:var(--ink);color:var(--yellow);border-radius:50%;display:grid;place-items:center;font-size:18px;opacity:0;transition:opacity .2s;z-index:2}
.work-card:hover .work-zoom{opacity:1}
.work-meta h3{font-family:"Fraunces",serif;font-style:italic;font-size:24px;font-weight:600;margin:0;letter-spacing:-0.01em;line-height:1.1}
.work-meta .work-role{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.1em;color:#333;margin:6px 0 8px}
.work-meta .work-desc{font-size:14px;line-height:1.45;margin:0;color:#1a1a1a}

/* VIDEOBOOK */
#videobook{background:var(--ink);color:var(--yellow)}
#videobook .section-head h2 em{color:var(--yellow)}
#videobook .section-tag{background:var(--red);color:#fff}
.videobook-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:32px;align-items:start}
.vb-main{position:relative;aspect-ratio:16/9;border:3px solid var(--yellow);box-shadow:12px 12px 0 var(--red);cursor:pointer;overflow:hidden;transition:transform .2s,box-shadow .2s}
.vb-main:hover{transform:translate(-3px,-3px);box-shadow:16px 16px 0 var(--red)}
.vb-thumb{position:absolute;inset:0;background:#000 center/cover;filter:saturate(.85) contrast(1.05)}
.vb-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:24px;background:linear-gradient(180deg,transparent 0%,transparent 50%,rgba(0,0,0,.85) 100%)}
.vb-overlay svg{width:88px;height:88px;align-self:center;margin:auto 0;filter:drop-shadow(0 6px 18px rgba(0,0,0,.5));transition:transform .2s}
.vb-main:hover .vb-overlay svg{transform:scale(1.1)}
.vb-label{display:flex;flex-direction:column;gap:4px;color:#fff}
.vb-kind{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.2em;color:var(--yellow);text-transform:uppercase}
.vb-title{font-family:"Archivo Black",sans-serif;font-size:22px;letter-spacing:-0.02em}
.vb-list{display:flex;flex-direction:column;gap:8px}
.vb-item{display:grid;grid-template-columns:80px 1fr 24px;gap:14px;align-items:center;padding:10px;background:rgba(244,238,42,.06);border:2px solid rgba(244,238,42,.2);cursor:pointer;transition:all .15s}
.vb-item:hover{background:rgba(244,238,42,.16);border-color:var(--yellow);transform:translateX(4px)}
.vb-item:hover .vb-arrow{color:var(--red);transform:scale(1.3)}
.vb-mini{width:80px;height:60px;background:#000 center/cover;border:2px solid var(--ink)}
.vb-item .vb-kind{font-size:9px;letter-spacing:.15em;display:block}
.vb-item .vb-title{font-size:15px;font-family:"Archivo Black",sans-serif;letter-spacing:-0.01em;color:var(--yellow);display:block;margin-top:2px}
.vb-arrow{font-family:"Archivo Black",sans-serif;color:var(--yellow);transition:transform .2s,color .2s;text-align:center}
.vb-cta{grid-template-columns:1fr;background:var(--red);border-color:var(--red);padding:16px;text-decoration:none}
.vb-cta:hover{background:var(--yellow);border-color:var(--yellow)}
.vb-cta:hover .vb-title,.vb-cta:hover .vb-kind{color:var(--ink)}
.vb-cta .vb-kind{color:#fff;opacity:.85}
.vb-cta .vb-title{color:#fff}
.grid-mosaic{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:160px;gap:14px}
.card{position:relative;overflow:hidden;padding:20px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:transform .2s,box-shadow .2s;border:3px solid transparent}
.card:hover{transform:translateY(-4px) rotate(-1deg);border-color:var(--ink);box-shadow:8px 8px 0 var(--ink);z-index:2}
.card .k{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.15em}
.card .n{font-family:"Archivo Black",sans-serif;font-size:clamp(18px,2vw,30px);letter-spacing:-0.02em;line-height:.95}
.card .play{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;opacity:0;transition:opacity .2s}
.card:hover .play{opacity:1}
.card.hidden{display:none}

#stand{background:var(--red);color:#fff}
#stand .section-head h2 em{color:var(--yellow)}
.stand-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center}
.video-block{aspect-ratio:16/9;background:#000 center/cover;position:relative;border:3px solid var(--ink);box-shadow:12px 12px 0 var(--ink);cursor:pointer;overflow:hidden}
.video-block .play-big{position:absolute;inset:0;display:grid;place-items:center;color:#fff;transition:transform .2s}
.video-block:hover .play-big{transform:scale(1.1)}
.play-big svg{width:80px;height:80px;filter:drop-shadow(0 4px 14px rgba(0,0,0,.4))}
.stand-info p{font-family:"Fraunces",serif;font-size:22px;line-height:1.45;font-style:italic}
.quote-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.quote-tags span{background:var(--yellow);color:var(--ink);padding:6px 12px;font-family:"Archivo Black",sans-serif;font-size:11px;border:2px solid var(--ink)}

#teatro{background:var(--paper)}
.teatro-list{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.teatro-card{padding:28px;border:3px solid var(--ink);background:#fff;display:grid;grid-template-columns:80px 1fr;gap:20px;transition:transform .2s,box-shadow .2s}
.teatro-card:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--ink)}
.teatro-card .y{font-family:"Archivo Black",sans-serif;font-size:36px;color:var(--red);letter-spacing:-0.02em;line-height:1}
.teatro-card h3{font-family:"Fraunces",serif;font-style:italic;font-size:28px;font-weight:500;margin:0 0 6px;letter-spacing:-0.01em}
.teatro-card .meta{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.1em;color:#555}
.teatro-card p{margin:10px 0 0;font-size:15px;line-height:1.45;color:#333}

#book{background:var(--blue);color:#fff}
#book .section-head h2 em{color:var(--yellow)}
.book-tabs{display:flex;gap:8px;margin-bottom:32px;flex-wrap:wrap}
.book-tab{font-family:"Archivo Black",sans-serif;font-size:13px;letter-spacing:.05em;padding:12px 22px;border:3px solid var(--ink);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;transition:all .15s}
.book-tab:hover{background:var(--yellow);color:var(--ink);transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.book-tab.active{background:var(--yellow);color:var(--ink)}
.book-panel{display:none}
.book-panel.active{display:block;animation:fade .25s}
/* Masonry vía CSS columns — soporta verticales y horizontales */
.masonry{column-count:4;column-gap:14px}
.m-item{break-inside:avoid;margin:0 0 14px;cursor:pointer;border:3px solid var(--ink);overflow:hidden;display:block;position:relative;transition:transform .2s,box-shadow .2s;background:#000}
.m-item:nth-child(3n) {transform:rotate(-.6deg)}
.m-item:nth-child(3n+1){transform:rotate(.4deg)}
.m-item:hover{transform:scale(1.03) rotate(0);z-index:3;box-shadow:8px 8px 0 var(--ink)}
.m-item img{width:100%;height:auto;display:block}
.m-item::after{content:attr(data-cap);position:absolute;bottom:0;left:0;right:0;padding:18px 12px 10px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.8));color:#fff;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;opacity:0;transition:opacity .2s;pointer-events:none}
.m-item:hover::after{opacity:1}

/* OLD gallery — mantener compatible si se usa */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gallery-grid .gitem{aspect-ratio:4/5;background:#000 center/cover;border:3px solid var(--ink);cursor:pointer;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.gallery-grid .gitem:nth-child(odd){transform:rotate(-1deg)}
.gallery-grid .gitem:nth-child(even){transform:rotate(1deg)}
.gallery-grid .gitem:hover{transform:scale(1.04) rotate(0);z-index:3;box-shadow:8px 8px 0 var(--ink)}

#prensa{background:var(--paper)}
.press-grid{display:flex;flex-wrap:wrap;gap:28px;justify-content:center;padding:20px 0}
.press{padding:22px;max-width:320px;border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);transition:transform .2s}
.press:hover{transform:rotate(0) scale(1.04) !important;z-index:2}
.press:nth-child(1){background:var(--yellow);transform:rotate(-3deg)}
.press:nth-child(2){background:#fff;transform:rotate(2deg)}
.press:nth-child(3){background:var(--red);color:#fff;transform:rotate(-1deg)}
.press:nth-child(4){background:var(--blue);color:#fff;transform:rotate(3deg)}
.press q{font-family:"Fraunces",serif;font-style:italic;font-size:20px;line-height:1.3;display:block;quotes:none}
.press q::before,.press q::after{content:""}
.press .src{font-family:"Archivo Black",sans-serif;font-size:11px;margin-top:14px;letter-spacing:.1em}

/* NOTICIAS */
#noticias{background:var(--paper)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.news-card{background:#fff;border:3px solid var(--ink);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s;cursor:pointer}
.news-card:hover{transform:translate(-4px,-4px);box-shadow:10px 10px 0 var(--ink)}
.news-img{aspect-ratio:4/3;background:#1a1a1a center/contain no-repeat;border-bottom:3px solid var(--ink)}
.news-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px}
.news-date{font-family:"Archivo Black",sans-serif;font-size:10px;letter-spacing:.15em;color:var(--red);align-self:flex-start;background:var(--yellow);padding:4px 10px;border:2px solid var(--ink)}
.news-card h3{font-family:"Fraunces",serif;font-style:italic;font-size:24px;font-weight:600;margin:0;letter-spacing:-0.01em;line-height:1.1}
.news-card p{font-size:14px;line-height:1.5;margin:0;color:#222}
.news-card p em{color:var(--red);font-style:italic}
.news-meta{margin-top:6px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.15em;color:#555;text-transform:uppercase;padding-top:12px;border-top:1px dashed rgba(0,0,0,.2)}
.news-note{margin-top:32px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.1em;color:#888;text-align:center;font-style:italic}

#sobre{background:#fff}
.about-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:48px}
.about-photo{position:relative}
.about-photo .frame{aspect-ratio:4/5;border:3px solid var(--ink);background:#1a1a1a center/cover;position:relative}
.about-photo .accent-frame{position:absolute;inset:0;border:3px solid var(--red);transform:translate(14px,14px);z-index:-1}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tag{padding:6px 12px;background:var(--yellow);border:2px solid var(--ink);font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.05em;transition:transform .12s}
.tag:hover{transform:rotate(-2deg) scale(1.05)}
.qa{margin-bottom:32px}
.qa .q{font-family:"Archivo Black",sans-serif;font-size:28px;letter-spacing:-0.02em;line-height:1.05}
.qa .a{font-family:"Fraunces",serif;font-size:20px;font-style:italic;line-height:1.4;margin-top:10px;max-width:560px}

/* Bio "¿Quién soy?" */
.bio{max-width:620px;margin-bottom:32px}
.bio p{font-family:"Fraunces",serif;font-style:italic;font-size:20px;line-height:1.5;margin:0 0 20px;color:#1a1a1a}
.bio .bio-lead{font-family:"Archivo Black",sans-serif;font-size:clamp(20px,2.2vw,28px);line-height:1.15;letter-spacing:-0.02em;margin:26px 0 18px}
.bio .bio-quote{font-family:"Fraunces",serif;font-style:italic;font-size:19px;line-height:1.4;color:var(--red);border-left:4px solid var(--red);padding-left:18px;margin:0 0 26px}

/* Stand-up */
.stand-title{font-family:"Archivo Black",sans-serif;font-size:clamp(28px,3.4vw,44px);letter-spacing:-0.03em;line-height:1;margin:0 0 18px;text-transform:uppercase}

/* Instagram */
#instagram .ig-fallback{display:grid;grid-template-columns:1fr 1.15fr;gap:32px;align-items:center}
.ig-cta{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;border:3px solid var(--ink);background:var(--yellow);padding:32px;box-shadow:10px 10px 0 var(--ink);transition:transform .2s,box-shadow .2s}
.ig-cta:hover{transform:translate(-4px,-4px);box-shadow:14px 14px 0 var(--ink)}
.ig-at{font-family:"Archivo Black",sans-serif;font-size:clamp(22px,2.6vw,36px);letter-spacing:-0.03em;line-height:1}
.ig-follow{font-family:"Archivo Black",sans-serif;font-size:14px;letter-spacing:.04em;color:var(--red)}
.ig-note{font-family:"Fraunces",serif;font-style:italic;font-size:17px;opacity:.75}
.ig-teaser-wrap{display:flex;flex-direction:column;gap:12px}
.ig-teaser{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.ig-teaser a{aspect-ratio:1;background:#1a1a1a center/cover;border:3px solid var(--ink);transition:transform .2s}
.ig-teaser a:hover{transform:scale(1.03)}
.ig-hint{margin:0;text-align:right;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.65}

#contacto{background:var(--ink);color:var(--yellow);border-bottom:none}
#contacto h2{font-family:"Archivo Black",sans-serif;font-size:clamp(72px,12vw,180px);letter-spacing:-0.06em;line-height:.85;margin:0 0 48px}
#contacto h2 em{font-family:"Fraunces",serif;font-style:italic;font-weight:400;color:var(--red)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}
form .row{margin-bottom:18px}
form label{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;opacity:.6;display:block;margin-bottom:6px}
form input,form select,form textarea{width:100%;background:transparent;border:none;border-bottom:2px solid var(--yellow);color:var(--yellow);font-family:"Fraunces",serif;font-size:22px;padding:6px 0;outline:none;font-style:italic}
form input::placeholder,form textarea::placeholder{color:rgba(244,238,42,.35);font-style:italic}
form select{font-style:normal;font-family:"Archivo",sans-serif;font-size:18px}
form select option{background:var(--ink)}
form textarea{resize:vertical;min-height:80px}
form .submit{margin-top:16px}
form .submit[disabled]{opacity:.6;cursor:wait}
/* Honeypot antispam: fuera de pantalla, invisible para las personas */
form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-legal{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.08em;opacity:.45;margin:14px 0 0}
.form-legal a{text-decoration:underline;text-underline-offset:3px}
.form-legal a:hover{color:var(--red)}
.form-msg{display:none;margin-top:14px;font-family:"Fraunces",serif;font-style:italic;font-size:18px}
.form-msg.show{display:block}
.form-msg.ok{color:var(--yellow)}
.form-msg.ko{color:var(--red)}
.form-msg.ko a{color:var(--red)}
.contact-info{font-family:"JetBrains Mono",monospace;font-size:13px;line-height:1.7}
.contact-info h4{font-family:"Archivo Black",sans-serif;font-size:14px;letter-spacing:.05em;color:var(--red);margin:0 0 6px;text-transform:uppercase}
.contact-info .block{margin-bottom:28px}
.contact-info a{border-bottom:1px dashed var(--yellow)}

footer{padding:32px;background:var(--ink);color:var(--yellow);border-top:3px solid var(--yellow);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;opacity:.6}
/* Enlaces legales del pie: mismo tono que el resto pero clicables de verdad */
footer .legal-links{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
footer .legal-links a{opacity:.8;transition:opacity .15s,color .15s}
footer .legal-links a:hover{opacity:1;color:#fff;text-decoration:underline;text-underline-offset:3px}

.modal{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:100;display:none;align-items:center;justify-content:center;padding:32px}
.modal.open{display:flex;animation:fade .2s}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal-content{max-width:1200px;width:100%;aspect-ratio:16/9;background:#000;position:relative;border:3px solid var(--yellow);box-shadow:0 20px 80px rgba(244,238,42,.2)}
.modal-content iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;display:block}
.modal .close{position:absolute;top:-20px;right:-20px;width:48px;height:48px;background:var(--red);color:#fff;border:3px solid var(--yellow);border-radius:50%;cursor:pointer;font-size:24px;font-weight:900;display:grid;place-items:center}

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.94);z-index:100;display:none;align-items:center;justify-content:center;padding:32px}
.lightbox.open{display:flex;animation:fade .2s}
.lightbox img{max-height:88vh;max-width:90vw;border:3px solid var(--yellow);box-shadow:0 20px 80px rgba(0,0,0,.6)}
.lightbox .nav-btn{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;background:var(--yellow);color:var(--ink);border:3px solid var(--ink);border-radius:50%;cursor:pointer;font-family:"Archivo Black",sans-serif;font-size:22px;display:grid;place-items:center}
.lightbox .prev{left:32px}.lightbox .next{right:32px}
.lightbox .close{top:32px;right:32px;transform:none;position:absolute;width:48px;height:48px;background:var(--red);color:#fff;border:3px solid var(--yellow);border-radius:50%;cursor:pointer;font-size:22px;font-weight:900}

@media (max-width:1100px){
  /* Tablet — colapsar nav a hamburguesa antes de que rompa */
  .works-grid{grid-template-columns:repeat(3,1fr)}
  .gallery-grid{grid-template-columns:repeat(3,1fr)}
  .masonry{column-count:3}
  .teatro-list{grid-template-columns:1fr 1fr}
  section{padding:64px 28px}
  nav.top{padding:14px 24px}
  .hero{padding:40px 28px 28px}
  nav.top ul{display:none;position:fixed;top:60px;left:0;right:0;flex-direction:column;background:var(--yellow);padding:18px;gap:6px;border-bottom:3px solid var(--ink);z-index:49;max-height:calc(100vh - 60px);overflow:auto}
  nav.top.menu-open ul{display:flex}
  nav.top li a{padding:12px 14px;font-size:14px;text-align:center}
  .burger{display:flex}
}

@media (max-width:900px){
  /* Tablet pequeña */
  .hero{grid-template-columns:1.2fr 1fr;gap:24px}
  .hero-text h1{font-size:clamp(56px,9vw,120px)}
  .stand-grid{grid-template-columns:1fr;gap:32px}
  .about-grid{grid-template-columns:1fr;gap:36px}
  .about-photo{max-width:420px}
  .contact-grid{grid-template-columns:1fr;gap:36px}
  .videobook-grid{grid-template-columns:1fr;gap:24px}
  .works-grid{grid-template-columns:repeat(3,1fr);gap:20px}
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .teatro-list{grid-template-columns:1fr;gap:18px}
  .gallery-grid{grid-template-columns:repeat(3,1fr)}
  .masonry{column-count:3;column-gap:12px}
  .press{max-width:none;flex:1 1 280px}
}

@media (max-width:760px){
  /* Mobile grande */
  .hero{grid-template-columns:1fr;min-height:0;padding:0;gap:0}
  .hero-photo{order:1;max-width:none;width:100%;margin:0}
  /* Portada movil: alto casi cuadrado y encuadre bajado un 25% para que no se corte la barbilla */
  .hero-photo .frame{width:100%;height:min(100vw,480px);max-height:none;transform:none;box-shadow:none;border-left:none;border-right:none;border-top:none;background-position:center 25%}
  .badge-round{display:none}
  .sticker{display:none}
  .hero-text{order:2;padding:28px 18px}
  .hero-text h1{font-size:clamp(52px,14vw,86px)}
  .hero-text h1 .it{font-size:.72em}
  .hero-cta{margin-top:24px}
  .hero-cta .btn{padding:14px 18px;font-size:12px}
  .hero-subline{font-size:11px;width:100%;max-width:none;margin-top:8px}

  nav.top{padding:12px 18px}
  nav.top ul{display:none;position:fixed;top:60px;left:0;right:0;flex-direction:column;background:var(--yellow);padding:18px;gap:6px;border-bottom:3px solid var(--ink);z-index:49;max-height:calc(100vh - 60px);overflow:auto}
  nav.top.menu-open ul{display:flex}
  nav.top li a{padding:12px 14px;font-size:14px;text-align:center}
  .burger{display:flex}
  .logo{font-size:15px}
  .logo .dot{width:20px;height:20px}

  section{padding:48px 18px}
  .section-head{flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:28px}
  .section-head h2{font-size:clamp(40px,10vw,64px)}
  .section-tag{font-size:10px;padding:6px 10px}

  .works-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .work-meta h3{font-size:20px}
  .work-meta .work-role{font-size:10px}
  .work-meta .work-desc{font-size:13px}

  .vb-main{box-shadow:6px 6px 0 var(--red)}
  .vb-main:hover{transform:none;box-shadow:6px 6px 0 var(--red)}
  .vb-overlay{padding:16px}
  .vb-overlay svg{width:56px;height:56px}
  .vb-title{font-size:16px}
  .vb-item{grid-template-columns:64px 1fr 22px;padding:8px;gap:10px}
  .vb-mini{width:64px;height:48px}
  .vb-item .vb-title{font-size:13px}

  .video-block{box-shadow:6px 6px 0 var(--ink)}
  .play-big svg{width:56px;height:56px}
  .stand-info p{font-size:18px}

  .gallery-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .gallery-grid .gitem{border-width:2px}
  .masonry{column-count:2;column-gap:10px}
  .m-item{margin-bottom:10px}
  .book-tab{font-size:12px;padding:10px 16px}

  .teatro-card{padding:20px;grid-template-columns:60px 1fr;gap:14px}
  .teatro-card .y{font-size:28px}
  .teatro-card h3{font-size:22px}
  .teatro-card .meta{font-size:10px}
  .teatro-card p{font-size:14px}

  .press-grid{gap:18px;padding:8px 0}
  .press{padding:18px;max-width:none;flex:1 1 100%}
  .press q{font-size:17px}
  .news-grid{grid-template-columns:1fr;gap:18px}
  .news-card h3{font-size:20px}
  .news-body{padding:18px}

  .qa .q{font-size:22px}
  .qa .a{font-size:17px}
  .tag{font-size:10px;padding:5px 10px}

  .bio p{font-size:17px}
  .bio .bio-quote{font-size:17px;padding-left:14px}
  #instagram .ig-fallback{grid-template-columns:1fr;gap:22px}
  .ig-cta{padding:24px;box-shadow:6px 6px 0 var(--ink)}
  .ig-cta:hover{transform:none;box-shadow:6px 6px 0 var(--ink)}
  .ig-teaser{gap:10px}

  .marquee{padding:10px 0}
  .marquee-track{font-size:18px}
  .marquee-track span{margin-right:24px}

  #contacto{padding:56px 18px}
  #contacto h2{font-size:clamp(52px,16vw,80px);margin-bottom:32px}
  form input,form textarea{font-size:18px}
  form select{font-size:16px}
  .contact-info{font-size:12px}

  footer{padding:24px 18px;flex-direction:column;align-items:flex-start;gap:8px;text-align:left}

  .modal{padding:18px}
  .modal-content{aspect-ratio:auto;min-height:200px}
  .modal-content{aspect-ratio:16/9}
  .modal .close{top:-14px;right:-14px;width:40px;height:40px;font-size:20px}

  .lightbox{padding:18px}
  .lightbox img{max-height:80vh;border-width:2px}
  .lightbox .nav-btn{width:40px;height:40px;font-size:18px}
  .lightbox .prev{left:8px}.lightbox .next{right:8px}
  .lightbox .close{top:12px;right:12px;width:40px;height:40px;font-size:18px}

  .cv-row{grid-template-columns:1fr;gap:6px;padding:16px 0}
  .cv-year{font-size:14px}
  .cv-row h4{font-size:18px}
  .cv-tab{font-size:11px;padding:8px 12px}
}

@media (max-width:420px){
  /* Mobile pequeño */
  .works-grid{grid-template-columns:1fr;gap:24px}
  .gallery-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .teatro-card{grid-template-columns:1fr;gap:6px}
  .teatro-card .y{font-size:24px}
  .hero-text h1{font-size:54px}
  .section-head h2{font-size:42px}
  #contacto h2{font-size:54px}
  .marquee-track{font-size:16px}
  .work-poster{box-shadow:5px 5px 0 var(--ink)}
  .vb-item{grid-template-columns:56px 1fr 18px}
  .vb-mini{width:56px;height:42px}
}