/* =========================================================
   PYRENE MEDIA® — shared stylesheet
   Technical-brutalist productora system
   ========================================================= */
:root{
  --bg:#000; --panel:#0A0A0A; --panel2:#0E0E0D;
  --ink:#F2F0EA; --dim:#8C8C86; --faint:#4A4A46;
  --line:rgba(242,240,234,.16); --line2:rgba(242,240,234,.07);
  --red:#ED1C24; --red-h:#ff2a32;
  --grot:'Archivo',system-ui,sans-serif; --mono:'Space Mono',ui-monospace,monospace;
  --pad:clamp(1.1rem,4.5vw,4.5rem);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html,body{ margin:0; padding:0; }
body{ background:var(--bg); color:var(--ink); font-family:var(--mono); font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
::selection{ background:var(--red); color:#fff; }
a{ color:inherit; text-decoration:none; }
img,video{ display:block; max-width:100%; }
address{ font-style:normal; }
h1,h2,h3,h4{ margin:0; font-family:var(--grot); font-weight:800; text-transform:uppercase; letter-spacing:-.015em; line-height:.94; }
.exp{ font-stretch:118%; }
.mono{ font-family:var(--mono); }
.red{ color:var(--red); }
.dim{ color:var(--dim); }
.lab{ font-family:var(--mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); }
.pad{ padding-inline:var(--pad); }
.bt{ border-top:1px solid var(--line); }
.skip{ position:absolute; left:-9999px; top:0; z-index:200; background:var(--red); color:#fff; padding:.6rem 1rem; font-family:var(--mono); font-size:.7rem; }
.skip:focus{ left:8px; top:8px; }
:focus-visible{ outline:1px solid var(--red); outline-offset:3px; }

/* ---------- overlays / texture ---------- */
.colgrid{ position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:repeating-linear-gradient(90deg, transparent 0, transparent calc(16.6666% - 1px), var(--line2) calc(16.6666% - 1px), var(--line2) 16.6666%); }
.scan{ position:fixed; inset:0; z-index:58; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(to bottom, rgba(255,255,255,.02) 0 1px, transparent 1px 3px); }
.grain{ position:fixed; inset:0; z-index:59; pointer-events:none; opacity:.045; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ---------- instrument frame ---------- */
.frame{ position:fixed; inset:0; z-index:55; pointer-events:none; border:1px solid var(--line2); margin:9px; }
.frame i{ position:absolute; color:var(--line); font-family:var(--mono); font-size:.8rem; line-height:1; font-style:normal; }
.frame i.tl{ top:-7px; left:-6px; } .frame i.tr{ top:-7px; right:-6px; }
.frame i.bl{ bottom:-8px; left:-6px; } .frame i.br{ bottom:-8px; right:-6px; }
.edge{ position:fixed; z-index:56; font-family:var(--mono); font-size:.56rem; letter-spacing:.26em; text-transform:uppercase; color:var(--faint); pointer-events:none; writing-mode:vertical-rl; }
.edge.l{ left:13px; bottom:18px; transform:rotate(180deg); }
.edge.r{ right:13px; top:18px; }
@media (max-width:860px){ .frame,.edge,.colgrid{ display:none; } }

/* ---------- custom cursor ---------- */
.cur{ position:fixed; top:0; left:0; z-index:210; pointer-events:none; mix-blend-mode:difference; will-change:transform; }
.cur-dot{ width:6px; height:6px; margin:-3px 0 0 -3px; background:#fff; border-radius:50%; }
.cur-ring{ width:34px; height:34px; margin:-17px 0 0 -17px; border:1px solid rgba(255,255,255,.55); border-radius:50%; transition:width .25s, height .25s, margin .25s, border-color .25s, background .25s; }
.cur-ring.hot{ width:58px; height:58px; margin:-29px 0 0 -29px; border-color:#fff; }
.cur-ring.press{ width:24px; height:24px; margin:-12px 0 0 -12px; }
@media (pointer:fine){ .cursor-on, .cursor-on *{ cursor:none !important; } }

/* ---------- transition curtain ---------- */
.curtain{ position:fixed; inset:0; z-index:130; background:#000; display:flex; align-items:center; justify-content:center;
  transform:translateY(0); animation:curtainUp .9s .5s cubic-bezier(.76,0,.24,1) forwards; }
.curtain img{ width:clamp(170px,42vw,360px); height:auto; opacity:0; animation:curtainBrand .5s .1s ease forwards, curtainBrandOut .35s .55s ease forwards; filter:drop-shadow(0 0 20px rgba(237,28,36,.3)); }
@keyframes curtainUp{ to{ transform:translateY(-101%); } }
@keyframes curtainBrand{ from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none} }
@keyframes curtainBrandOut{ to{opacity:0} }
.curtain.cover{ animation:none; transform:translateY(0); transition:transform .5s cubic-bezier(.76,0,.24,1); }
.curtain.cover img{ animation:none; opacity:0; }

/* ---------- reveal ---------- */
.rv{ opacity:0; transform:translateY(14px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.rv.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  .rv{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
  .marquee__row{ animation:none !important; }
  .lines .ln>span{ transform:none !important; }
  .curtain{ display:none !important; }
  .rec i{ animation:none !important; }
}

/* ---------- header ---------- */
header.nav{ position:fixed; inset:0 0 auto 0; z-index:60; transition:background .35s, border-color .35s, backdrop-filter .35s; border-bottom:1px solid transparent; }
header.nav.scrolled{ background:rgba(0,0,0,.82); border-color:var(--line2); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
.navtop{ display:flex; align-items:center; justify-content:space-between; padding:.8rem var(--pad); }
.brand{ display:flex; align-items:center; gap:.55rem; }
.brand img{ height:21px; width:auto; filter:drop-shadow(0 0 4px rgba(237,28,36,.16)); opacity:.96; transition:opacity .25s; }
.brand:hover img{ opacity:1; }
@media (max-width:560px){ .brand img{ height:19px; } }
.brand b{ font-family:var(--grot); font-weight:900; font-size:1rem; letter-spacing:-.01em; }
.brand sup,.navlinks sup,.foot sup{ color:var(--red); font-size:.55em; top:-.7em; }
.navlinks{ display:flex; gap:1.5rem; align-items:center; }
.navlinks a{ position:relative; font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); transition:color .25s; }
.navlinks a .i{ color:var(--faint); margin-right:.35rem; transition:color .25s; }
.navlinks a:not(.cta)::after{ content:''; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:var(--red); transition:right .4s cubic-bezier(.16,1,.3,1); }
.navlinks a:hover{ color:var(--ink); } .navlinks a:hover .i{ color:var(--red); }
.navlinks a:hover:not(.cta)::after{ right:0; }
.navlinks a.is-active{ color:var(--ink); } .navlinks a.is-active .i{ color:var(--red); }
.navlinks a.is-active:not(.cta)::after{ right:0; }
.navlinks a.cta{ color:var(--ink); border:1px solid var(--line); padding:.45rem .8rem; transition:border-color .25s, background .25s; }
.navlinks a.cta:hover,.navlinks a.cta.is-active{ border-color:var(--red); background:rgba(237,28,36,.1); }
.navmeta{ display:flex; justify-content:space-between; gap:1rem; padding:.4rem var(--pad); border-top:1px solid var(--line2); }
.navmeta span{ font-family:var(--mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); white-space:nowrap; }
.rec{ color:var(--red) !important; display:inline-flex; align-items:center; gap:.4rem; }
.rec i{ width:7px; height:7px; border-radius:50%; background:var(--red); box-shadow:0 0 7px var(--red); animation:blink 1.4s steps(1) infinite; }
@keyframes blink{ 0%,55%{opacity:1} 56%,100%{opacity:.25} }
.burger{ display:none; background:none; border:1px solid var(--line); color:var(--ink); font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; padding:.45rem .7rem; cursor:pointer; }
#mob{ display:none; }
@media (max-width:820px){
  .navlinks{ display:none; }
  .burger{ display:inline-block; }
  .navmeta span:nth-child(2),.navmeta span:nth-child(3){ display:none; }
  #mob.open{ display:flex; position:fixed; inset:0; z-index:59; background:rgba(0,0,0,.97); flex-direction:column; justify-content:center; gap:1rem; padding:var(--pad); }
  #mob a{ font-family:var(--grot); font-weight:800; font-stretch:115%; text-transform:uppercase; font-size:2.1rem; color:var(--ink); }
  #mob a .i{ color:var(--red); font-size:.5em; vertical-align:middle; margin-right:.4rem; }
  #mob .lab{ margin-top:1.6rem; }
}

/* ---------- buttons ---------- */
.btns{ display:flex; flex-wrap:wrap; gap:.7rem; }
.btn{ position:relative; font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; padding:.85rem 1.25rem; display:inline-flex; align-items:center; gap:.6rem; border:1px solid var(--line); transition:transform .25s, background .25s, border-color .25s, color .25s; }
.btn::before,.btn::after{ content:''; position:absolute; width:7px; height:7px; border:1px solid currentColor; opacity:0; transition:opacity .25s, transform .25s; }
.btn::before{ top:-3px; left:-3px; border-right:0; border-bottom:0; transform:translate(4px,4px); }
.btn::after{ bottom:-3px; right:-3px; border-left:0; border-top:0; transform:translate(-4px,-4px); }
.btn:hover::before,.btn:hover::after{ opacity:.75; transform:none; }
.btn--red{ background:var(--red); border-color:var(--red); color:#fff; }
.btn--red:hover{ transform:translateY(-2px); background:var(--red-h); }
.btn--ghost:hover{ border-color:var(--ink); transform:translateY(-2px); }

/* ---------- page hero (inner pages) ---------- */
.phero{ position:relative; padding:9.5rem var(--pad) clamp(2.6rem,6vh,4.5rem); border-bottom:1px solid var(--line); overflow:hidden; }
.phero .code{ font-family:var(--mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--red); margin-bottom:1.2rem; display:flex; gap:.8rem; align-items:center; }
.phero .code .ln{ width:30px; height:1px; background:var(--red); }
.phero h1{ font-size:clamp(2.6rem,9vw,7.5rem); font-weight:900; }
.phero .lead{ margin:clamp(1.2rem,3vh,2rem) 0 0; max-width:48ch; color:var(--dim); font-size:clamp(.95rem,1.3vw,1.1rem); }
.phero .lead b{ color:var(--ink); font-weight:400; }

/* ---------- hero (home) ---------- */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; }
.hero video,.hero .poster{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; filter:grayscale(.3) contrast(1.06) brightness(.8); }
.hero .veil{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(0,0,0,.74) 0%, rgba(0,0,0,.2) 32%, rgba(0,0,0,.45) 62%, rgba(0,0,0,.96) 100%); }
.hero .hud{ position:absolute; inset:0; z-index:2; pointer-events:none; }
.hero .hud .c{ position:absolute; font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }
.hero .hud .c.tl{ top:6.6rem; left:var(--pad); } .hero .hud .c.tr{ top:6.6rem; right:var(--pad); text-align:right; }
.hero .hud .c.bl{ bottom:1.3rem; right:var(--pad); text-align:right; color:var(--faint); }
.hero .inner{ position:relative; z-index:3; padding:0 var(--pad) clamp(1.4rem,4vh,2.6rem); }
.kick{ display:flex; align-items:center; gap:.7rem; margin-bottom:1.3rem; }
.kick .sq{ width:8px; height:8px; background:var(--red); box-shadow:0 0 10px var(--red); }
.hero h1{ font-size:clamp(2.7rem,10.4vw,9.4rem); font-weight:900; }
.lines .ln{ display:block; overflow:hidden; padding-bottom:.02em; }
.lines .ln>span{ display:block; transform:translateY(112%); transition:transform .95s cubic-bezier(.16,1,.3,1); }
body.ready .lines .ln>span{ transform:none; }
.lines .ln:nth-child(1)>span{ transition-delay:.45s; }
.lines .ln:nth-child(2)>span{ transition-delay:.51s; }
.lines .ln:nth-child(3)>span{ transition-delay:.57s; }
.lines .ln:nth-child(4)>span{ transition-delay:.63s; }
@media (max-height:620px){ .hero h1{ font-size:clamp(2rem,6.5vw,4.2rem); } .hero .hud .c.tl,.hero .hud .c.tr{ display:none; } }
.hero .sub{ display:flex; flex-wrap:wrap; gap:1rem 2.4rem; align-items:flex-end; justify-content:space-between; margin-top:clamp(1.4rem,3.5vh,2.4rem); }
.hero .sub p{ margin:0; max-width:42ch; color:var(--dim); font-size:.92rem; }
.hero .sub p b{ color:var(--ink); font-weight:400; }

/* ---------- marquee ---------- */
.marquee{ overflow:hidden; border-block:1px solid var(--line); background:var(--panel); }
.marquee__row{ display:flex; gap:0; white-space:nowrap; animation:scroll 30s linear infinite; }
.marquee__row span{ font-family:var(--grot); font-weight:800; font-stretch:112%; text-transform:uppercase; font-size:clamp(1.1rem,2.4vw,1.9rem); letter-spacing:.02em; padding:.7rem 1.5rem; color:var(--ink); }
.marquee__row span i{ color:var(--red); font-style:normal; }
@keyframes scroll{ to{ transform:translateX(-50%); } }

/* ---------- generic blocks ---------- */
.block{ padding-block:clamp(3.5rem,8vh,6.5rem); }
.manifesto{ font-family:var(--grot); font-weight:700; font-stretch:108%; text-transform:uppercase; font-size:clamp(1.5rem,4.2vw,3.4rem); line-height:1.02; letter-spacing:-.01em; max-width:18ch; }
.shead{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:clamp(1.6rem,3.5vh,2.6rem); }
.shead h2{ font-size:clamp(1.5rem,3.2vw,2.3rem); }
.shead .idx{ font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; color:var(--red); }
.measure{ max-width:60ch; color:var(--dim); }

/* ---------- index rows (services / steps) ---------- */
.idxrow{ display:grid; grid-template-columns:5.5rem minmax(0,1fr) minmax(0,1.1fr) auto; gap:1.4rem; align-items:center; padding:clamp(1.3rem,3vh,2.1rem) 0; border-top:1px solid var(--line); transition:background .3s, padding-left .3s; color:inherit; }
.idxrow:last-child{ border-bottom:1px solid var(--line); }
a.idxrow:hover{ background:var(--panel); padding-left:.7rem; }
.idxrow .id{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; color:var(--dim); }
.idxrow.new .id{ color:var(--red); }
.idxrow h3{ font-size:clamp(1.5rem,3.4vw,2.6rem); font-weight:800; }
.idxrow p{ margin:0; color:var(--dim); font-size:.9rem; }
.idxrow .tags{ font-family:var(--mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; color:var(--faint); text-align:right; white-space:nowrap; display:flex; align-items:center; gap:.8rem; justify-content:flex-end; }
.idxrow .arr{ color:var(--faint); transition:transform .3s, color .3s; }
a.idxrow:hover .arr{ color:var(--red); transform:translateX(4px); }
@media (max-width:820px){
  .idxrow{ grid-template-columns:auto 1fr; gap:.4rem 1rem; align-items:start; }
  .idxrow p{ grid-column:2; } .idxrow .tags{ grid-column:2; text-align:left; justify-content:flex-start; margin-top:.3rem; }
}

/* ---------- two-column feature ---------- */
.feat{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(1.4rem,4vw,4rem); align-items:stretch; }
.feat.rev{ grid-template-columns:1fr 1.1fr; }
.feat .media{ position:relative; overflow:hidden; border:1px solid var(--line); min-height:320px; }
.feat .media img{ width:100%; height:100%; object-fit:cover; filter:contrast(1.06); transition:transform .8s cubic-bezier(.16,1,.3,1); }
.feat .media:hover img{ transform:scale(1.04); }
.feat .media .tagcorner{ position:absolute; top:0; left:0; font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink); background:var(--red); padding:.35rem .6rem; }
.feat .media .coord{ position:absolute; bottom:.7rem; right:.8rem; font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; color:var(--ink); opacity:.85; }
.feat .media::after{ content:''; position:absolute; inset:0; pointer-events:none; background:repeating-linear-gradient(to bottom, rgba(255,255,255,.03) 0 1px, transparent 1px 4px); }
.feat .body{ display:flex; flex-direction:column; justify-content:center; }
.feat .body h2{ font-size:clamp(2rem,6vw,4.4rem); font-weight:900; }
.feat .body h2 sup{ color:var(--red); font-size:.32em; top:-1.3em; }
.feat .body p{ color:var(--dim); max-width:42ch; }
@media (max-width:860px){ .feat,.feat.rev{ grid-template-columns:1fr; } .feat .media{ aspect-ratio:4/3; min-height:0; } }

.steplist{ list-style:none; padding:0; margin:1.4rem 0 1.8rem; }
.steplist li{ display:grid; grid-template-columns:2.6rem 1fr; gap:.8rem; padding:.8rem 0; border-top:1px solid var(--line2); }
.steplist .k{ font-family:var(--mono); font-size:.64rem; letter-spacing:.1em; color:var(--red); }
.steplist b{ font-family:var(--grot); font-weight:700; text-transform:uppercase; font-size:.95rem; letter-spacing:0; }
.steplist span small{ color:var(--dim); font-family:var(--mono); display:block; font-size:.82rem; margin-top:.15rem; }

/* ---------- cards grid ---------- */
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.card{ background:var(--bg); padding:clamp(1.5rem,2.4vw,2.2rem); min-height:12rem; display:flex; flex-direction:column; gap:.7rem; transition:background .3s; }
.card:hover{ background:var(--panel); }
.card .n{ font-family:var(--mono); font-size:.66rem; letter-spacing:.16em; color:var(--red); }
.card h3{ font-size:clamp(1.2rem,2vw,1.6rem); font-weight:800; }
.card p{ margin:0; color:var(--dim); font-size:.88rem; }

/* ---------- works grid ---------- */
.works{ display:grid; grid-template-columns:repeat(12,1fr); gap:9px; }
.w{ position:relative; overflow:hidden; background:var(--panel); display:block; }
.w img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.35) brightness(.9) contrast(1.04); transition:transform .8s cubic-bezier(.16,1,.3,1), filter .5s; }
.w:hover img{ transform:scale(1.045); filter:grayscale(0) brightness(1) contrast(1.04); }
.w .meta{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; padding:.8rem; pointer-events:none; }
.w .meta .top{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); opacity:.85; mix-blend-mode:difference; }
.w .meta .btm{ opacity:0; transform:translateY(6px); transition:opacity .4s, transform .4s; }
.w:hover .meta .btm{ opacity:1; transform:none; }
.w .meta .btm .t{ font-family:var(--grot); font-weight:800; font-stretch:108%; text-transform:uppercase; font-size:1.05rem; line-height:1; }
.w .meta .btm .r{ font-family:var(--mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin-top:.25rem; }
.w::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.72), transparent 45%); opacity:0; transition:opacity .4s; }
.w:hover::after{ opacity:1; }
.c8{grid-column:span 8;} .c6{grid-column:span 6;} .c4{grid-column:span 4;}
.rwide{aspect-ratio:16/9;} .rtall{aspect-ratio:3/4;} .rsq{aspect-ratio:1/1;}
@media (max-width:820px){ .c8,.c6,.c4{ grid-column:span 6; } .rtall{aspect-ratio:1/1;} }
@media (max-width:520px){ .c8,.c6,.c4{ grid-column:span 12; } }

/* ---------- credits ---------- */
.credgrid{ display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(1.6rem,4vw,3.5rem); align-items:start; }
.posters{ display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.posters figure{ margin:0; position:relative; overflow:hidden; border:1px solid var(--line); aspect-ratio:2/3; }
.posters img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.25); transition:transform .7s, filter .5s; }
.posters figure:hover img{ transform:scale(1.05); filter:grayscale(0); }
.posters figcaption{ position:absolute; left:0; right:0; bottom:0; padding:.6rem; font-family:var(--mono); font-size:.56rem; letter-spacing:.1em; text-transform:uppercase; background:linear-gradient(to top, rgba(0,0,0,.85), transparent); }
.credlist{ list-style:none; padding:0; margin:0; }
.credlist li{ display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; border-top:1px solid var(--line2); font-family:var(--mono); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.credlist li span:last-child{ color:var(--faint); font-size:.62rem; letter-spacing:.12em; }
@media (max-width:760px){ .credgrid{ grid-template-columns:1fr; } }

/* ---------- studio / spec ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.6rem,4vw,4rem); align-items:center; }
.split h2{ font-size:clamp(1.8rem,4.4vw,3.2rem); }
.split p{ color:var(--dim); max-width:44ch; }
.spec{ border:1px solid var(--line); }
.spec .row{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:.85rem 1.1rem; border-top:1px solid var(--line2); }
.spec .row:first-child{ border-top:0; }
.spec .row .k{ font-family:var(--mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
.spec .row .v{ font-family:var(--grot); font-weight:800; text-transform:uppercase; font-size:1.25rem; }
.spec .row .v em{ font-style:normal; color:var(--red); }
@media (max-width:760px){ .split{ grid-template-columns:1fr; } }

.stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:2rem clamp(2rem,5vw,5rem); }
.stat .v{ font-family:var(--grot); font-weight:900; font-stretch:112%; font-size:clamp(2.4rem,5.5vw,3.8rem); line-height:1; letter-spacing:-.02em; }
.stat .v em{ font-style:normal; color:var(--red); }
.stat .l{ margin:.6rem 0 0; font-family:var(--mono); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }

/* ---------- contact / form ---------- */
.hello{ font-family:var(--grot); font-weight:900; font-stretch:118%; text-transform:uppercase; font-size:clamp(2.8rem,12.5vw,9rem); line-height:.86; letter-spacing:-.03em; }
.cont{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:1.4rem 2rem; align-items:flex-end; margin-top:clamp(1.4rem,3vh,2.2rem); }
.cont .mail{ font-family:var(--grot); font-weight:800; font-stretch:108%; text-transform:uppercase; font-size:clamp(1.3rem,3.4vw,2.2rem); border-bottom:2px solid var(--red); padding-bottom:.15rem; }
.cont .info{ font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); line-height:2; text-align:right; }
.cont .info a:hover{ color:var(--ink); }
.form{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
.form .f{ background:var(--bg); display:flex; flex-direction:column; }
.form .f.full{ grid-column:1 / -1; }
.form label{ font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); padding:.9rem 1rem 0; }
.form input,.form textarea{ background:transparent; border:0; color:var(--ink); font-family:var(--mono); font-size:.95rem; padding:.5rem 1rem 1rem; outline:none; resize:vertical; }
.form input::placeholder,.form textarea::placeholder{ color:var(--faint); }
.form .f:focus-within{ background:var(--panel); }
.form .submit{ grid-column:1 / -1; background:var(--bg); padding:1rem; }
@media (max-width:620px){ .form{ grid-template-columns:1fr; } }

/* ---------- footer ---------- */
footer.foot{ background:var(--panel); border-top:1px solid var(--line); position:relative; z-index:5; }
.foot-cta{ padding:clamp(3rem,7vh,5.5rem) var(--pad); border-bottom:1px solid var(--line); display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.5rem; }
.foot-cta h2{ font-size:clamp(1.8rem,5vw,3.4rem); font-weight:900; }
.footrow{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 2rem; padding:1.8rem var(--pad); }
.footrow .l{ font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); }
.footrow .l a{ color:var(--dim); } .footrow .l a:hover{ color:var(--ink); }
.bypyrene{ color:var(--red) !important; border:1px solid rgba(237,28,36,.5); border-radius:999px; padding:.28rem .7rem; white-space:nowrap; transition:background .25s, border-color .25s, box-shadow .25s; }
.bypyrene:hover{ color:#fff !important; background:var(--red); border-color:var(--red); box-shadow:0 0 14px rgba(237,28,36,.45); }
.footrow .links{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.footrow .links a{ font-family:var(--mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
.footrow .links a:hover{ color:var(--ink); }

/* ---------- video blocks ---------- */
.feat .media video{ width:100%; height:100%; object-fit:cover; }
.vidgrid{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.vidblock{ position:relative; overflow:hidden; border:1px solid var(--line); background:#000; }
.vidblock video{ width:100%; height:100%; aspect-ratio:16/9; object-fit:cover; display:block; }
.vidblock .tag{ position:absolute; top:0; left:0; z-index:2; pointer-events:none; font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:#fff; background:var(--red); padding:.35rem .6rem; }
.vidblock .note{ position:absolute; bottom:.7rem; right:.8rem; z-index:2; pointer-events:none; font-family:var(--mono); font-size:.58rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); opacity:.85; }
@media (max-width:760px){ .vidgrid{ grid-template-columns:1fr; } }

/* cursor exceptions: keep native cursor where interaction needs it */
.cursor-on input, .cursor-on textarea{ cursor:text !important; }
.cursor-on video[controls], .cursor-on video[controls] *{ cursor:auto !important; }

/* ---------- legal / prose pages ---------- */
.legal{ max-width:76ch; }
.legal .upd{ font-family:var(--mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); margin-bottom:1.6rem; }
.legal p{ color:var(--dim); line-height:1.85; margin:0 0 1.05rem; }
.legal p b{ color:var(--ink); font-weight:400; }
.legal h2{ font-size:clamp(1.2rem,2.6vw,1.7rem); letter-spacing:-.01em; margin:2.7rem 0 .9rem; display:flex; gap:.7rem; align-items:baseline; }
.legal h2 .n{ font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; color:var(--red); flex:none; }
.legal a{ color:var(--ink); border-bottom:1px solid var(--red); padding-bottom:1px; }
.legal ul{ margin:0 0 1.05rem; padding-left:1.1rem; color:var(--dim); line-height:1.85; }
.legal .data{ border:1px solid var(--line); display:grid; grid-template-columns:auto 1fr; gap:.75rem 1.6rem; padding:clamp(1.1rem,2.5vw,1.6rem); margin:1.6rem 0; max-width:48rem; }
.legal .data .k{ font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); }
.legal .data .v{ color:var(--ink); }
@media (max-width:520px){ .legal .data{ grid-template-columns:1fr; gap:.15rem; } .legal .data .k{ margin-top:.7rem; } }

/* ---------- video work cards (external links) ---------- */
.vidcards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:9px; }
.vcard{ display:block; position:relative; border:1px solid var(--line); background:var(--panel); overflow:hidden; }
.vthumb{ position:relative; aspect-ratio:16/9; overflow:hidden; background:#000; }
.vthumb img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.32) brightness(.82) contrast(1.05); transition:transform .8s cubic-bezier(.16,1,.3,1), filter .5s; }
.vcard:hover .vthumb img{ transform:scale(1.05); filter:grayscale(0) brightness(1) contrast(1.05); }
.vthumb .play{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.vthumb .play b{ width:54px; height:54px; border:1px solid rgba(255,255,255,.7); border-radius:50%; display:grid; place-items:center; color:#fff; font-size:.85rem; background:rgba(0,0,0,.28); transition:background .3s, border-color .3s, transform .3s; }
.vcard:hover .vthumb .play b{ background:var(--red); border-color:var(--red); transform:scale(1.08); }
.vthumb .src{ position:absolute; top:.6rem; right:.6rem; font-family:var(--mono); font-size:.54rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); background:rgba(0,0,0,.55); padding:.25rem .45rem; border:1px solid var(--line2); }
.vthumb::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.5), transparent 55%); }
.vcard .vmeta{ position:relative; display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:.85rem 1rem; border-top:1px solid var(--line2); }
.vcard .vmeta .t{ font-family:var(--grot); font-weight:800; text-transform:uppercase; font-size:.98rem; letter-spacing:-.01em; line-height:1; }
.vcard .vmeta .c{ font-family:var(--mono); font-size:.56rem; letter-spacing:.14em; text-transform:uppercase; color:var(--faint); white-space:nowrap; }
