/* ============================================================
   UMAMI — Poisonous Scorpio
   Neón de Kabukichō, tinta de tatuaje, papel de recibo y cadenas.
   ============================================================ */

:root{
  --ink:#0a0807;
  --soot:#14100e;
  --coal:#1d1815;
  --bone:#e9dfcc;
  --bone-2:#d5c8ad;
  --bone-3:#b9ab90;
  --ash:#8a7e72;
  --blood:#b5121b;
  --blood-2:#e2242f;
  --neon:#ff3b5c;
  --neon-2:#ff8fa3;
  --line:rgba(233,223,204,.13);
  --line-strong:rgba(233,223,204,.28);

  --display:"Dela Gothic One","Arial Black",Impact,sans-serif;
  --voice:"Fraunces","Iowan Old Style",Georgia,serif;
  --mono:"Sometype Mono","IBM Plex Mono",Consolas,monospace;
  --brush:"Yuji Syuku","Dela Gothic One",serif;

  --gutter:clamp(18px,4vw,64px);
  --index-w:0px;
  --ease:cubic-bezier(.16,1,.3,1);
}
@media (min-width:1100px){ :root{ --index-w:96px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:clip; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0; background:var(--ink); color:var(--bone);
  font-family:var(--voice); font-variation-settings:"opsz" 14,"SOFT" 30,"WONK" 0;
  font-weight:400; font-size:17px; line-height:1.55;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }
::selection{ background:var(--blood); color:var(--bone); }

img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{ margin:0; padding:0; }
ul,ol{ list-style:none; }
svg{ display:block; }
main{ padding-left:var(--index-w); }

/* Voces tipográficas */
.display,h1,h2,h3{
  font-family:var(--display); font-weight:400; text-transform:uppercase;
  letter-spacing:-.005em; line-height:.95;
}
em{
  font-family:var(--voice); font-style:italic; font-weight:400;
  font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1;
  text-transform:none; letter-spacing:0;
}
.mono{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.14em;
  text-transform:uppercase; font-weight:500;
}
.kanji{ font-family:var(--brush); font-weight:400; color:var(--blood-2); letter-spacing:.06em; }
.kanji--v{ writing-mode:vertical-rl; text-orientation:upright; }

/* Neón */
.neon{
  font-family:var(--display); text-transform:none;
  color:var(--neon-2);
  -webkit-text-stroke:1px var(--neon);
  text-shadow:
    0 0 2px #fff,
    0 0 8px var(--neon),
    0 0 22px var(--neon),
    0 0 48px rgba(226,36,47,.7),
    0 0 90px rgba(226,36,47,.45);
  animation:neon 7s linear infinite;
}
.neon--tube{ color:transparent; -webkit-text-stroke:2px var(--neon-2); text-shadow:0 0 6px var(--neon),0 0 18px var(--neon),0 0 44px rgba(226,36,47,.6); }
@keyframes neon{
  0%,86%,90%,100%{ opacity:1; }
  87%{ opacity:.45; } 88%{ opacity:.95; } 89%{ opacity:.35; }
  40%{ opacity:1; } 41%{ opacity:.7; } 42%{ opacity:1; }
}
@media (prefers-reduced-motion:reduce){ .neon{ animation:none; } }

/* Tinta, cadenas y alambre (máscaras: se tiñen con background-color) */
.splat{
  position:absolute; pointer-events:none; background:var(--blood);
  -webkit-mask:url("/art/splat-1.svg") center/contain no-repeat; mask:url("/art/splat-1.svg") center/contain no-repeat;
}
.splat--2{ -webkit-mask-image:url("/art/splat-2.svg"); mask-image:url("/art/splat-2.svg"); }
.splat--3{ -webkit-mask-image:url("/art/splat-3.svg"); mask-image:url("/art/splat-3.svg"); }
.chain{
  height:14px; background:var(--bone-3); opacity:.55;
  -webkit-mask:url("/art/chain.svg") left center/auto 14px repeat-x; mask:url("/art/chain.svg") left center/auto 14px repeat-x;
}
.wire{
  height:16px; background:var(--bone-3); opacity:.6;
  -webkit-mask:url("/art/barbed.svg") left center/auto 16px repeat-x; mask:url("/art/barbed.svg") left center/auto 16px repeat-x;
}
.brushline{
  display:block; height:.32em; margin-top:-.12em; background:var(--blood-2);
  -webkit-mask:url("/art/brush.svg") left center/100% 100% no-repeat; mask:url("/art/brush.svg") left center/100% 100% no-repeat;
}
.scorpion{ color:var(--bone); }
.scorpion path,.scorpion ellipse{ stroke-dasharray:1200; stroke-dashoffset:0; }
.scorpion.draw path,.scorpion.draw ellipse{ animation:draw 3.2s var(--ease) both; }
@keyframes draw{ from{ stroke-dashoffset:1200; } }

/* Hanko (sello japonés) */
.hanko{
  display:grid; place-items:center; width:64px; height:64px;
  background:var(--blood); color:var(--bone);
  font-family:var(--brush); font-size:34px; line-height:1;
  box-shadow:inset 0 0 0 2px var(--blood), inset 0 0 0 4px var(--bone);
  transform:rotate(-6deg);
}

/* ---------- Grano ---------- */
.grain{
  pointer-events:none; position:fixed; inset:-50%; z-index:60; width:200%; height:200%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:.16; mix-blend-mode:overlay; will-change:transform;
  animation:grain 1.2s steps(6) infinite;
}
@keyframes grain{ 0%{transform:translate(0,0)} 20%{transform:translate(-3%,2%)} 40%{transform:translate(2%,-4%)} 60%{transform:translate(-1%,4%)} 80%{transform:translate(4%,-1%)} 100%{transform:translate(0,0)} }
@media (prefers-reduced-motion:reduce){ .grain{ animation:none; } }

/* ---------- Cursor ---------- */
.cursor{ display:none; }
@media (hover:hover) and (pointer:fine){
  .cursor{ display:block; position:fixed; left:0; top:0; z-index:70; pointer-events:none; width:10px; height:10px; margin:-5px 0 0 -5px; transform:translate(-100px,-100px); }
  .cursor span{ display:block; width:100%; height:100%; background:var(--bone); mix-blend-mode:difference; transition:transform .35s var(--ease), background .25s; }
  .cursor.is-link span{ transform:scale(4.2); background:var(--neon); mix-blend-mode:normal; opacity:.55; }
  .cursor.is-drag span{ transform:scale(6); background:var(--bone); opacity:.25; }
}

/* ---------- Botones ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; gap:14px;
  padding:0 26px; height:56px;
  font-family:var(--display); font-size:13px; letter-spacing:.06em; text-transform:uppercase;
  border:1px solid transparent; overflow:hidden; isolation:isolate;
  transition:color .35s var(--ease), border-color .35s;
}
.btn > span{ position:relative; z-index:1; }
.btn > small{ position:relative; z-index:1; font-family:var(--mono); font-size:11px; letter-spacing:.04em; text-transform:none; opacity:.75; }
.btn > b{ position:relative; z-index:1; font-family:var(--brush); font-weight:400; font-size:18px; line-height:1; opacity:.9; }
.btn::before{ content:""; position:absolute; inset:0; z-index:0; transform:translateY(101%); transition:transform .5s var(--ease); }
.btn:hover::before,.btn:focus-visible::before{ transform:translateY(0); }
.btn:focus-visible{ outline:2px solid var(--bone); outline-offset:3px; }
.btn--blood{ background:var(--blood); color:var(--bone); border-color:var(--blood); box-shadow:0 0 0 rgba(226,36,47,0); transition:color .35s, box-shadow .5s; }
.btn--blood::before{ background:var(--bone); }
.btn--blood:hover,.btn--blood:focus-visible{ color:var(--ink); box-shadow:0 0 34px rgba(226,36,47,.45); }
.btn--line{ border-color:var(--line-strong); color:var(--bone); }
.btn--line::before{ background:var(--bone); }
.btn--line:hover,.btn--line:focus-visible{ color:var(--ink); border-color:var(--bone); }
.btn--ghost{ color:var(--ash); border-color:transparent; }
.btn--ghost::before{ background:rgba(233,223,204,.08); }
.btn--ghost:hover{ color:var(--bone); }
.btn--live{ box-shadow:0 0 28px rgba(226,36,47,.35); }
.btn--live .live-dot{ position:relative; z-index:1; background:var(--bone); box-shadow:0 0 10px var(--bone); }
.btn--live:hover .live-dot{ background:var(--neon); box-shadow:0 0 10px var(--neon); }
.btn--big{ height:74px; padding:0 40px; font-size:16px; }

.link-arrow{
  display:inline-flex; align-items:center; gap:12px;
  font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--bone-2); padding-bottom:6px; border-bottom:1px solid var(--line-strong);
  transition:color .3s, border-color .3s;
}
.link-arrow::after{ content:"→"; transition:transform .4s var(--ease); }
.link-arrow:hover{ color:var(--neon); border-color:var(--neon); }
.link-arrow:hover::after{ transform:translateX(6px); }

/* ---------- Sello de tinta ---------- */
.stamp{
  position:absolute; display:grid; place-items:center; text-align:center;
  font-family:var(--mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; line-height:1.4;
  color:var(--blood-2); border:2px solid var(--blood-2); padding:14px 18px;
  transform:rotate(-12deg); opacity:.85;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='r'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -3 3.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23r)'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='r'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -3 3.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23r)'/%3E%3C/svg%3E");
}

/* ---------- Reveal ---------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform 1s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal--mask{ transform:none; transition:opacity .3s; }
.reveal--mask picture{ display:block; clip-path:inset(0 0 100% 0); transition:clip-path 1.3s var(--ease); }
.reveal--mask.in picture{ clip-path:inset(0 0 0 0); }
.reveal--mask img{ transform:scale(1.14); transition:transform 1.8s var(--ease); }
.reveal--mask.in img{ transform:scale(1); }
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal--mask{ opacity:1; transform:none; transition:none; }
  .reveal--mask picture{ clip-path:none; }
  .reveal--mask img{ transform:none; }
}

/* ---------- Cabecera de sección ---------- */
.sec-head{ display:flex; align-items:center; gap:16px; padding:0 var(--gutter); margin-bottom:clamp(22px,3.5vw,40px); color:var(--ash); }
.sec-head::after{ content:""; flex:1; height:1px; background:var(--line); }
.sec-head__num{ color:var(--blood-2); }
.sec-head__k{ font-size:22px; line-height:1; color:var(--blood-2); margin-top:-4px; }
.sec-head__hint{ order:3; margin-left:auto; padding-left:18px; }
.sec-head--dark{ color:rgba(10,8,7,.55); }
.sec-head--dark::after{ background:rgba(10,8,7,.18); }
.sec-head--dark .sec-head__num,.sec-head--dark .sec-head__k{ color:var(--blood); }

/* ============================================================
   PUERTA 18+
   ============================================================ */
.gate{
  position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px;
  background:rgba(10,8,7,.94); overflow:hidden;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  transition:opacity .7s var(--ease), visibility 0s .7s;
}
.gate.is-gone{ opacity:0; visibility:hidden; pointer-events:none; }
.gate__neon{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-4deg); font-size:clamp(120px,32vw,360px); opacity:.16; pointer-events:none; white-space:nowrap; }
.gate__ticket{
  position:relative; width:min(560px,100%); background:var(--bone); color:var(--ink);
  display:grid; grid-template-columns:44px 1fr;
  box-shadow:0 40px 80px -20px rgba(0,0,0,.7); transform:rotate(-1deg);
  animation:ticket .9s var(--ease) both;
}
@keyframes ticket{ from{ transform:translateY(40px) rotate(-4deg); opacity:0; } to{ transform:rotate(-1deg); opacity:1; } }
.gate__stub{ position:relative; border-right:2px dashed rgba(10,8,7,.35); display:grid; place-items:center; background:var(--blood); color:var(--bone); }
.gate__stub-text{ writing-mode:vertical-rl; transform:rotate(180deg); font-family:var(--mono); font-size:10px; letter-spacing:.22em; text-transform:uppercase; white-space:nowrap; }
.gate__body{ padding:clamp(26px,5vw,44px); position:relative; }
.gate__title{ font-size:clamp(26px,5.6vw,42px); margin-bottom:20px; padding-right:60px; }
.gate__title em{ color:var(--blood); font-size:1.15em; }
.gate__actions{ display:flex; flex-wrap:wrap; gap:10px; }
@media (max-width:520px){ .gate__actions .btn{ width:100%; justify-content:center; height:52px; font-size:12px; } .gate__actions .btn--ghost{ height:44px; } }
.gate .btn--ghost{ color:rgba(10,8,7,.6); }
.gate .btn--ghost::before{ background:rgba(10,8,7,.08); }
.gate .btn--ghost:hover{ color:var(--ink); }
.gate .btn--blood::before{ background:var(--ink); }
.gate .btn--blood:hover{ color:var(--bone); }
.gate .hanko{ position:absolute; right:clamp(14px,4vw,34px); top:clamp(14px,4vw,34px); width:52px; height:52px; font-size:28px; }

/* ============================================================
   CABECERA
   ============================================================ */
.top{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:grid; grid-template-columns:1fr auto; align-items:center;
  padding:18px var(--gutter) 30px; background:linear-gradient(180deg, rgba(10,8,7,.78) 0%, rgba(10,8,7,.35) 60%, rgba(10,8,7,0) 100%); pointer-events:none;
  transition:transform .6s var(--ease);
}
.top.is-hidden{ transform:translateY(-110%); }
.top > *{ pointer-events:auto; }
.top__brand{ display:inline-flex; align-items:center; gap:12px; justify-self:start; }
.top__brand svg{ width:26px; height:22px; color:var(--bone); }
.top__name{ font-family:var(--display); font-size:15px; letter-spacing:.12em; text-transform:uppercase; }
.top__nav{ display:none; gap:34px; }
.top__nav a{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--bone); opacity:.65; transition:opacity .3s; }
.top__nav a:hover{ opacity:1; }
.top__cta{ justify-self:end; display:inline-flex; align-items:center; gap:10px; font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; padding:12px 16px; border:1px solid var(--line-strong); transition:border-color .3s; }
.top__cta:hover{ border-color:var(--bone); }
.top__cta-dot{ width:6px; height:6px; background:var(--neon); box-shadow:0 0 8px var(--neon); animation:pulse 2s infinite; }
.live-dot{ display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--neon); box-shadow:0 0 10px var(--neon),0 0 22px rgba(255,59,92,.6); animation:pulse 1.6s infinite; flex:none; }
.top__cta small{ font-size:9px; letter-spacing:.2em; color:var(--neon); text-shadow:0 0 8px var(--neon); margin-right:2px; }
.top__cta{ border-color:rgba(255,59,92,.45); }
.top__cta-dot{ border-radius:50%; }
@keyframes pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } }
@media (min-width:900px){ .top{ grid-template-columns:1fr auto 1fr; } .top__nav{ display:flex; } }

/* ---------- Índice lateral ---------- */
.index{ display:none; }
@media (min-width:1100px){
  .index{ position:fixed; left:0; top:0; bottom:0; width:var(--index-w); z-index:40; display:flex; flex-direction:column; justify-content:center; align-items:center; border-right:1px solid var(--line); }
  .index__list{ display:flex; flex-direction:column; gap:26px; background:var(--ink); padding:28px 0; }
  .index__list a{ display:flex; flex-direction:column; align-items:center; gap:2px; color:var(--ash); transition:color .3s; }
  .index__list i{ font-style:normal; font-family:var(--brush); font-size:17px; line-height:1; }
  .index__list span{ font-family:var(--mono); font-size:9px; letter-spacing:.18em; text-transform:uppercase; opacity:0; transform:translateX(-6px); transition:opacity .3s, transform .3s; }
  .index__list a:hover span,.index__list a.is-on span{ opacity:1; transform:none; }
  .index__list a.is-on{ color:var(--neon); text-shadow:0 0 10px var(--neon); }
  .index__bar{ position:absolute; left:calc(50% - .5px); top:8%; bottom:8%; width:1px; background:var(--line); z-index:-1; }
  .index__bar span{ display:block; width:100%; height:0; background:var(--neon); box-shadow:0 0 8px var(--neon); transition:height .2s linear; }
}

/* ============================================================
   01 · HERO
   ============================================================ */
.hero{ position:relative; min-height:100svh; display:grid; grid-template-columns:1fr; padding:120px var(--gutter) 90px; overflow:hidden; }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media picture,.hero__media img{ width:100%; height:100%; object-fit:cover; object-position:50% 25%; }
.hero__media img{ will-change:transform; filter:saturate(1.05) contrast(1.05); }
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,8,7,.15) 0%, rgba(10,8,7,.55) 55%, var(--ink) 100%), linear-gradient(90deg, rgba(10,8,7,.75) 0%, rgba(10,8,7,.2) 60%);
}
.hero__sign{
  position:absolute; z-index:2; right:clamp(10px,3vw,40px); top:clamp(84px,12vh,120px);
  font-size:clamp(34px,5vw,64px); line-height:1.05; letter-spacing:.18em;
}
.hero__sign small{ display:block; margin-top:14px; font-family:var(--mono); font-size:10px; letter-spacing:.3em; color:var(--neon-2); text-shadow:0 0 8px var(--neon); writing-mode:vertical-rl; text-orientation:mixed; -webkit-text-stroke:0; }
.hero__splat{ width:clamp(240px,34vw,480px); aspect-ratio:1; left:-10%; top:-6%; opacity:.42; z-index:1; }
.hero__copy{ position:relative; z-index:2; align-self:end; max-width:760px; container-type:inline-size; }
.hero__kicker{ color:var(--bone-3); margin-bottom:26px; display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; }
.hero__kicker .kanji{ font-size:15px; }
.hero__title{ margin-bottom:24px; }
.hero__word{ display:block; white-space:nowrap; font-size:min(clamp(58px,15.5vw,150px), 19.5cqw); line-height:.92; letter-spacing:-.01em; color:var(--bone); }
.hero__sub{ display:block; white-space:nowrap; margin-top:.1em; font-family:var(--voice); font-style:italic; font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1; text-transform:none; font-size:min(clamp(30px,6.2vw,76px), 11cqw); line-height:1; color:var(--blood-2); letter-spacing:-.01em; }
[data-split] .ch{ display:inline-block; opacity:0; transform:translateY(.6em) rotate(4deg); transform-origin:0 100%; }
[data-split] .ch.in{ animation:ch .9s var(--ease) forwards; }
@keyframes ch{ to{ opacity:1; transform:none; } }
[data-split] .sp{ display:inline-block; width:.28em; }
.hero__claim{ font-size:clamp(22px,3vw,32px); line-height:1.15; color:var(--bone); margin-bottom:18px; max-width:24ch; font-variation-settings:"opsz" 72,"SOFT" 60,"WONK" 0; }
.hero__claim em{ color:var(--bone-3); }
.hero__lead{ color:var(--bone-3); max-width:54ch; font-size:16.5px; margin-bottom:34px; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:12px; }
@keyframes line{ 0%{transform:translateX(-100%)} 60%,100%{transform:translateX(100%)} }
@media (min-width:900px){
  .hero{ grid-template-columns:1fr; padding-top:140px; }
  .hero__copy{ max-width:min(760px,64%); }
  .hero__media{ left:auto; right:0; width:50%; }
  .hero__media::after{ background:linear-gradient(90deg, var(--ink) 0%, rgba(10,8,7,.5) 30%, rgba(10,8,7,0) 65%), linear-gradient(180deg, rgba(10,8,7,.3) 0%, rgba(10,8,7,0) 30%, rgba(10,8,7,.85) 100%); }
  .hero__copy{ grid-column:1; }
  .hero__sign{ right:clamp(24px,4vw,64px); top:clamp(120px,16vh,170px); }
}

/* ---------- Cinta ---------- */

/* ============================================================
   02 · QUIÉN
   ============================================================ */
.who{ position:relative; padding:clamp(48px,7vw,96px) 0 clamp(40px,6vw,80px); overflow:hidden; }
.who__halftone{ position:absolute; right:-6%; top:6%; width:min(52vw,560px); aspect-ratio:560/843; opacity:.2; pointer-events:none; background:url("/art/halftone.png") center/contain no-repeat; -webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 45%,#000 30%,transparent 75%); mask-image:radial-gradient(ellipse 60% 55% at 50% 45%,#000 30%,transparent 75%); }
.who__grid{ position:relative; display:grid; grid-template-columns:1fr; gap:48px; padding:0 var(--gutter); }
.who__figure{ position:relative; max-width:520px; }
.who__figure img{ width:100%; aspect-ratio:2/3; object-fit:cover; }
.who__figure .kanji--v{ position:absolute; right:16px; top:16px; font-size:clamp(22px,2.4vw,30px); color:var(--neon); text-shadow:0 0 12px var(--neon),0 0 30px rgba(226,36,47,.6); }
.who__text{ container-type:inline-size; }
.who__title{ font-size:min(clamp(40px,7.4vw,96px), 10.4cqw); margin-bottom:clamp(22px,3.5vw,40px); }
.who__title em{ display:inline-block; position:relative; color:var(--blood-2); font-size:1.12em; }
.who__title .brushline{ position:absolute; left:0; right:0; bottom:-.1em; height:.3em; margin:0; }
.facts{ display:flex; flex-direction:column; }
.facts__item{ display:grid; grid-template-columns:1fr; gap:10px; padding:26px 0; border-top:1px solid var(--line); font-size:clamp(17px,1.7vw,21px); line-height:1.5; color:var(--bone-2); }
.facts__item:last-child{ border-bottom:1px solid var(--line); }
.facts__label{ color:var(--blood-2); }
.facts dd{ margin:0; }
.facts__item strong{ color:var(--bone); font-weight:600; }
.who__foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; margin-top:28px; }
.tags{ display:flex; flex-wrap:wrap; gap:8px; color:var(--bone-3); }
.tags span{ border:1px solid var(--line-strong); padding:9px 14px; }
.who__scorpion{ width:96px; opacity:.85; }
@media (min-width:900px){
  .who__grid{ grid-template-columns:38% 1fr; gap:clamp(48px,7vw,120px); align-items:start; }
  .who__figure{ position:sticky; top:120px; }
}

/* ============================================================
   03 · DINÁMICAS
   ============================================================ */
.ways{ position:relative; padding:clamp(48px,7vw,96px) 0; }
.ways__intro{ padding:0 var(--gutter); margin-bottom:clamp(22px,3.5vw,40px); display:grid; gap:20px; }
.ways__title{ font-size:clamp(38px,6.6vw,88px); }
.ways__title em{ color:var(--blood-2); }
.ways__lead{ color:var(--bone-3); max-width:52ch; font-size:17px; }
@media (min-width:900px){ .ways__intro{ grid-template-columns:1fr 1fr; align-items:end; } .ways__lead{ justify-self:end; } }
.ways .chain{ margin:0 var(--gutter) 6px; }
.ways__list{ border-top:1px solid var(--line); margin:0 var(--gutter); }
.way{ border-bottom:1px solid var(--line); }
.way__head{ width:100%; display:grid; grid-template-columns:40px 1fr auto; grid-template-areas:"n name k" ". tag k"; align-items:center; column-gap:16px; row-gap:2px; padding:14px 0; text-align:left; position:relative; }
.way__num{ grid-area:n; color:var(--ash); align-self:start; padding-top:.5em; transition:color .3s; }
.way__name{ grid-area:name; font-family:var(--display); font-size:clamp(18px,2.6vw,32px); line-height:1; text-transform:uppercase; transition:transform .6s var(--ease), color .3s; }
.way__tag{ grid-area:tag; font-style:italic; font-variation-settings:"opsz" 40,"SOFT" 80,"WONK" 1; font-size:clamp(16px,1.6vw,21px); color:var(--bone-3); }
.way__k{ grid-area:k; font-size:clamp(22px,3vw,40px); line-height:1; color:var(--neon); opacity:0; transform:translateX(8px); transition:opacity .4s, transform .5s var(--ease), text-shadow .4s; }
.way:hover .way__k,.way.is-open .way__k{ opacity:1; transform:none; text-shadow:0 0 14px var(--neon); }
.way__plus{ grid-area:plus; width:14px; height:14px; position:relative; }
.way__plus::before,.way__plus::after{ content:""; position:absolute; background:var(--bone-3); transition:transform .5s var(--ease), background .3s; }
.way__plus::before{ left:0; right:0; top:6px; height:1px; }
.way__plus::after{ top:0; bottom:0; left:6px; width:1px; }
.way.is-open .way__plus::after{ transform:rotate(90deg); }
.way__body{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .6s var(--ease); }
.way__body > p{ overflow:hidden; color:var(--bone-2); max-width:58ch; font-size:16.5px; line-height:1.6; padding-left:56px; opacity:0; transform:translateY(-6px); transition:opacity .5s .1s, transform .5s .1s var(--ease); }
.way.is-open .way__body{ grid-template-rows:1fr; }
.way.is-open .way__body > p{ opacity:1; transform:none; padding-bottom:26px; }
.way.is-open .way__num,.way:hover .way__num{ color:var(--blood-2); }
@media (hover:hover){ .way:hover .way__name{ transform:translateX(10px); } }
.ways__ghost{ display:none; position:fixed; left:0; top:0; z-index:35; pointer-events:none; width:230px; aspect-ratio:9/16; overflow:hidden; opacity:0; transform:translate(-50%,-50%) rotate(-4deg) scale(.9); transition:opacity .35s, transform .5s var(--ease); outline:1px solid var(--blood-2); outline-offset:6px; }
.ways__ghost img{ width:100%; height:100%; object-fit:cover; }
.ways__ghost.is-on{ opacity:1; transform:translate(-50%,-50%) rotate(-3deg) scale(1); }
@media (hover:hover) and (pointer:fine) and (min-width:900px){ .ways__ghost{ display:block; } }

/* ============================================================
   04 · VISTAZO
   ============================================================ */
.peek{ position:relative; padding:clamp(48px,7vw,96px) 0; background:var(--soot); border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; }
.peek__head{ padding:0 var(--gutter); margin-bottom:clamp(22px,3.5vw,40px); display:grid; gap:18px; }
.peek__title{ font-size:clamp(40px,7vw,96px); }
.peek__title em{ color:var(--blood-2); }
.peek__lead{ color:var(--bone-3); max-width:50ch; }
.peek .wire{ margin:0 0 26px; }
.peek .wire--b{ margin:8px 0 0; }
@media (min-width:900px){ .peek__head{ grid-template-columns:1fr 1fr; align-items:end; } .peek__lead{ justify-self:end; } }
.gallery{ display:grid; grid-template-columns:1fr; gap:clamp(14px,2.4vw,32px); padding:0 var(--gutter); }
@media (min-width:700px){ .gallery{ grid-template-columns:repeat(3,1fr); } }
.gallery__item{ position:relative; }
.gallery__item img{ width:100%; aspect-ratio:3/4; object-fit:cover; filter:contrast(1.04); }
.gallery__item figcaption{ display:flex; gap:12px; align-items:baseline; padding-top:12px; font-style:italic; font-variation-settings:"opsz" 40,"SOFT" 80,"WONK" 1; font-size:18px; color:var(--bone-2); }
.gallery__item figcaption .mono{ color:var(--blood-2); }
.peek__cta{ display:flex; justify-content:center; margin:clamp(26px,4vw,40px) var(--gutter) 0; }
.peek .wire--b{ margin-top:clamp(26px,4vw,40px); }
.strip{ display:flex; gap:clamp(12px,2vw,28px); padding:0 var(--gutter) 24px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scrollbar-width:none; cursor:grab; }
.strip::-webkit-scrollbar{ display:none; }
.strip.is-dragging{ cursor:grabbing; scroll-snap-type:none; }
.strip__item{ flex:0 0 auto; width:min(72vw,300px); scroll-snap-align:start; position:relative; user-select:none; -webkit-user-select:none; }
.strip__item:nth-child(2){ transform:translateY(34px); }
.strip__item:nth-child(4){ transform:translateY(20px); }
.strip__item img{ width:100%; aspect-ratio:9/14; object-fit:cover; filter:contrast(1.04); transition:filter .5s; }
.strip__item:hover img{ filter:contrast(1.04) saturate(1.1); }
.strip__item figcaption{ display:flex; gap:12px; align-items:baseline; padding-top:12px; font-style:italic; font-variation-settings:"opsz" 40,"SOFT" 80,"WONK" 1; font-size:19px; color:var(--bone-2); }
.strip__item figcaption .mono{ color:var(--blood-2); }
.strip__item--end{ display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--line-strong); padding:26px; aspect-ratio:9/14; width:min(72vw,320px); position:relative; overflow:hidden; color:var(--bone); transition:border-color .35s, color .35s; }
.strip__item--end .splat{ width:220px; aspect-ratio:1; right:-70px; top:-60px; opacity:.5; }
.strip__end-title{ position:relative; font-family:var(--display); font-size:clamp(26px,3vw,38px); line-height:1; color:var(--bone); text-transform:uppercase; }
.strip__end-title em{ display:block; color:var(--blood-2); font-size:1.1em; }
.strip__end-go{ position:relative; display:flex; justify-content:flex-end; }
.strip__end-go i{ width:44px; height:1px; background:currentColor; position:relative; transition:width .4s var(--ease); }
.strip__end-go i::after{ content:""; position:absolute; right:0; top:-4px; width:8px; height:8px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }
.strip__item--end:hover{ border-color:var(--neon); color:var(--neon); }
.strip__item--end:hover .strip__end-go i{ width:72px; }
@media (min-width:900px){ .strip__item{ width:clamp(260px,26vw,380px); } .strip__item--end{ width:clamp(260px,26vw,380px); } }

/* ============================================================
   05 · TINTA
   ============================================================ */
.ink{ position:relative; padding:clamp(48px,7vw,96px) 0; overflow:hidden; }
.ink__bg{ position:absolute; right:-4%; top:2%; width:min(70vw,720px); opacity:.07; pointer-events:none; }
.ink__grid{ position:relative; display:grid; grid-template-columns:1fr; gap:56px; padding:0 var(--gutter); }
.ink__text{ position:relative; }
.ink__text .splat{ width:240px; aspect-ratio:1; left:-90px; top:-70px; opacity:.6; z-index:-1; }
.ink__title{ font-size:clamp(46px,8vw,104px); margin-bottom:22px; }
.ink__title em{ color:var(--blood-2); }
.ink__lead{ font-size:clamp(22px,2.6vw,30px); line-height:1.2; color:var(--bone-2); margin-bottom:36px; max-width:22ch; font-variation-settings:"opsz" 72,"SOFT" 60,"WONK" 1; font-style:italic; }
.ink__facts{ display:grid; margin-bottom:34px; }
.ink__facts > div{ padding:22px 0; border-top:1px solid var(--line); display:grid; gap:10px; }
.ink__facts > div:last-child{ border-bottom:1px solid var(--line); }
.ink__facts dt{ color:var(--blood-2); display:flex; gap:12px; align-items:center; }
.ink__facts dt .kanji{ font-size:18px; }
.ink__facts dd{ color:var(--bone-2); max-width:52ch; }
.ink__media{ position:relative; min-height:420px; }
.ink__fig{ position:absolute; overflow:hidden; }
.ink__fig img{ width:100%; height:100%; object-fit:cover; }
.ink__fig--a{ left:0; top:0; width:64%; aspect-ratio:2/3; }
.ink__fig--b{ right:0; bottom:0; width:46%; aspect-ratio:2/3; outline:12px solid var(--ink); }
.ink__note{ position:absolute; right:0; top:0; font-size:clamp(28px,4vw,48px); opacity:.85; }
@media (min-width:900px){ .ink__grid{ grid-template-columns:1fr 1fr; align-items:center; gap:clamp(48px,7vw,120px); } .ink__media{ min-height:640px; } }

/* ============================================================
   06 · EL ORDEN (papel)
   ============================================================ */
.order{ background:var(--bone); color:var(--ink); padding:clamp(48px,7vw,96px) 0; position:relative; }
.order .chain--top{ position:absolute; left:0; right:0; top:-7px; background:var(--ink); opacity:1; }
.order__inner{ position:relative; padding:0 var(--gutter); max-width:1180px; }
.order__k{ position:absolute; right:var(--gutter); top:0; font-size:clamp(60px,12vw,180px); line-height:1; color:rgba(181,18,27,.12); pointer-events:none; }
.order__title{ font-size:clamp(34px,6.4vw,88px); margin-bottom:26px; }
.order__title em{ color:var(--blood); font-size:1.1em; }
.order__lead{ font-size:clamp(17px,1.8vw,21px); color:rgba(10,8,7,.72); max-width:56ch; margin-bottom:clamp(28px,4vw,48px); }
.receipt{ position:relative; background:#f3ecdc; color:var(--ink); max-width:760px; padding:clamp(22px,4vw,40px); margin:14px 0; box-shadow:0 30px 60px -30px rgba(10,8,7,.45); }
.receipt::before,.receipt::after{ content:""; position:absolute; left:0; right:0; height:12px; background-size:8px 12px, 8px 12px; background-position:0 0, 8px 0; background-repeat:repeat-x; }
.receipt::before{ top:-12px; background-image:linear-gradient(135deg, transparent 50%, #f3ecdc 50%), linear-gradient(225deg, transparent 50%, #f3ecdc 50%); }
.receipt::after{ bottom:-12px; background-image:linear-gradient(45deg, transparent 50%, #f3ecdc 50%), linear-gradient(315deg, transparent 50%, #f3ecdc 50%); }
.tgband{ position:relative; display:grid; gap:10px 24px; align-items:center; margin:0 0 clamp(28px,4vw,48px); padding:clamp(20px,3vw,30px) clamp(22px,4vw,40px); background:var(--blood); color:var(--bone); overflow:hidden; isolation:isolate; box-shadow:0 20px 50px -24px rgba(181,18,27,.8); transition:color .5s, box-shadow .5s; }
.tgband::before{ content:""; position:absolute; inset:0; z-index:-1; background:var(--ink); transform:translateY(101%); transition:transform .55s var(--ease); }
.tgband:hover{ color:var(--bone); box-shadow:0 0 60px rgba(226,36,47,.45); }
.tgband:hover::before{ transform:translateY(0); }
.tgband__live{ display:inline-flex; align-items:center; gap:10px; color:var(--bone); opacity:.9; }
.tgband__live .live-dot{ background:var(--bone); box-shadow:0 0 10px var(--bone); }
.tgband:hover .tgband__live{ color:var(--neon); text-shadow:0 0 8px var(--neon); }
.tgband:hover .tgband__live .live-dot{ background:var(--neon); box-shadow:0 0 10px var(--neon); }
.tgband__name{ font-family:var(--display); font-size:clamp(30px,5vw,64px); line-height:.95; text-transform:uppercase; }
.tgband__handle{ font-style:italic; font-variation-settings:"opsz" 96,"SOFT" 100,"WONK" 1; font-size:clamp(20px,2.6vw,30px); }
.tgband__go{ display:inline-flex; align-items:center; gap:16px; justify-self:start; font-family:var(--display); font-size:13px; letter-spacing:.06em; text-transform:uppercase; border:1px solid currentColor; padding:0 22px; height:54px; }
.tgband__go i{ width:26px; height:1px; background:currentColor; position:relative; transition:width .4s var(--ease); }
.tgband__go i::after{ content:""; position:absolute; right:0; top:-4px; width:8px; height:8px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }
.tgband:hover .tgband__go i{ width:44px; }
@media (min-width:900px){ .tgband{ grid-template-columns:auto auto 1fr auto; } .tgband__handle{ padding-top:.3em; } }
.order__grid{ display:grid; gap:clamp(36px,5vw,64px); }
@media (min-width:1000px){ .order__grid{ grid-template-columns:minmax(0,440px) 1fr; align-items:start; } }
.receipt__head{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding-bottom:16px; border-bottom:1px dashed rgba(10,8,7,.4); color:rgba(10,8,7,.55); padding-right:84px; }
.receipt__big{ font-family:var(--display); font-size:clamp(36px,4.8vw,60px); line-height:1; text-transform:uppercase; padding:26px 0 6px; }
.receipt__big em{ display:block; font-size:.6em; color:var(--blood); margin-top:.15em; }
.receipt__text{ color:rgba(10,8,7,.75); padding-bottom:6px; }
.methods__title{ font-size:clamp(20px,2.4vw,30px); margin-bottom:12px; }
.methods__text{ color:rgba(10,8,7,.72); max-width:52ch; margin-bottom:22px; }
.order .plat{ margin:0; border-color:rgba(10,8,7,.2); }
.order .plat li{ border-color:rgba(10,8,7,.2); }
.order .plat a::before{ background:var(--ink); }
.order .plat a:hover{ color:var(--bone); }
.order .plat__handle{ color:var(--blood); }
.order .plat a:hover .plat__handle{ color:var(--neon); }
.order .plat__desc{ color:rgba(10,8,7,.65); }
.order .plat a:hover .plat__desc{ color:rgba(233,223,204,.75); }
@media (min-width:640px){ .order .plat{ grid-template-columns:1fr 1fr; } }
.order .local{ margin:24px 0 0; border-color:rgba(10,8,7,.2); }
.order .local__toggle{ color:rgba(10,8,7,.8); }
.order .local__toggle i::before,.order .local__toggle i::after{ background:rgba(10,8,7,.6); }
.order .local__panel,.order .local__panel a{ border-color:rgba(10,8,7,.2); }
.order .local__panel a:hover .plat__name{ color:var(--blood); }
.receipt__total{ display:flex; justify-content:space-between; gap:12px; padding:20px 0 12px; font-size:13px; color:var(--ink); border-bottom:2px solid var(--ink); }
.receipt__total span:last-child{ font-size:20px; letter-spacing:.05em; }
.receipt__foot{ padding-top:16px; color:rgba(10,8,7,.7); font-size:15px; max-width:56ch; }
.receipt .hanko{ position:absolute; right:clamp(16px,4vw,40px); top:-26px; }

/* ============================================================
   07 · TRIBUTAR
   ============================================================ */
.pay{ position:relative; padding:clamp(48px,7vw,96px) 0; overflow:hidden; }
.pay__neon{ position:absolute; right:var(--gutter); top:clamp(40px,8vw,110px); z-index:0; font-size:clamp(110px,20vw,300px); line-height:1; opacity:.2; white-space:nowrap; pointer-events:none; transform:rotate(-6deg); }
.pay > *{ position:relative; }
.pay__title{ padding:0 var(--gutter); font-size:clamp(28px,5.2vw,72px); margin-bottom:22px; }
.pay__title em{ color:var(--blood-2); font-size:1.15em; }
.pay__lead{ padding:0 var(--gutter); color:var(--bone-3); max-width:58ch; margin-bottom:clamp(28px,4vw,48px); }
.pay .chain{ margin:0 var(--gutter) 10px; }
.plat{ margin:0 var(--gutter); display:grid; grid-template-columns:1fr; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.plat li{ border-bottom:1px solid var(--line); border-right:1px solid var(--line); }
.plat a,.local__panel a{ display:grid; grid-template-columns:1fr auto; grid-template-areas:"name arrow" "handle arrow" "desc arrow"; gap:6px 16px; padding:22px; height:100%; position:relative; overflow:hidden; isolation:isolate; transition:color .35s; }
.plat a::before{ content:""; position:absolute; inset:0; z-index:-1; background:var(--bone); transform:translateY(101%); transition:transform .5s var(--ease); }
.plat a:hover{ color:var(--ink); }
.plat a:hover::before{ transform:translateY(0); }
.plat__name{ grid-area:name; font-family:var(--display); font-size:clamp(17px,1.8vw,24px); text-transform:uppercase; line-height:1; }
.plat__handle{ grid-area:handle; color:var(--neon); }
.plat a:hover .plat__handle{ color:var(--blood); }
.plat__desc{ grid-area:desc; font-style:italic; font-variation-settings:"opsz" 40,"SOFT" 80,"WONK" 1; font-size:17px; color:var(--bone-3); }
.plat a:hover .plat__desc{ color:rgba(10,8,7,.7); }
.plat--links a{ grid-template-areas:"name arrow" "handle arrow"; }
.plat__tg a{ background:var(--blood); }
.plat__tg .plat__name{ display:flex; align-items:center; gap:12px; }
.plat__tg .plat__handle{ color:var(--bone); }
.plat__tg a:hover .plat__handle{ color:var(--blood); }
.plat__tg .live-dot{ background:var(--bone); box-shadow:0 0 10px var(--bone); }
@media (min-width:1000px){ .plat--links{ grid-template-columns:repeat(4,1fr); } }
.plat__arrow{ grid-area:arrow; align-self:center; width:18px; height:18px; position:relative; }
.plat__arrow::before{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:currentColor; }
.plat__arrow::after{ content:""; position:absolute; right:0; top:50%; width:7px; height:7px; margin-top:-4px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }
.plat a:hover .plat__arrow{ animation:nudge .6s var(--ease); }
@keyframes nudge{ 50%{ transform:translateX(6px); } }
@media (min-width:640px){ .plat{ grid-template-columns:1fr 1fr; } }
@media (min-width:1000px){ .plat{ grid-template-columns:repeat(3,1fr); } }
.local{ margin:28px var(--gutter) 0; border:1px solid var(--line); }
.local__toggle{ width:100%; display:flex; align-items:center; gap:18px; padding:20px 22px; text-align:left; font-style:italic; font-variation-settings:"opsz" 40,"SOFT" 80,"WONK" 1; font-size:clamp(19px,2.2vw,24px); color:var(--bone-2); }
.local__toggle .mono{ color:var(--blood-2); font-style:normal; }
.local__toggle i{ margin-left:auto; width:14px; height:14px; position:relative; }
.local__toggle i::before,.local__toggle i::after{ content:""; position:absolute; background:var(--bone-3); transition:transform .5s var(--ease); }
.local__toggle i::before{ left:0; right:0; top:6px; height:1px; }
.local__toggle i::after{ top:0; bottom:0; left:6px; width:1px; }
.local__toggle[aria-expanded="true"] i::after{ transform:rotate(90deg); }
.local__panel{ display:grid; grid-template-columns:1fr; border-top:1px solid var(--line); }
.local__panel[hidden]{ display:none; }
.local__panel a{ border-bottom:1px solid var(--line); grid-template-columns:1fr; grid-template-areas:"name" "handle" "desc"; }
.local__panel a:hover .plat__name{ color:var(--neon); }
@media (min-width:640px){ .local__panel{ grid-template-columns:1fr 1fr; } .local__panel a:first-child{ border-right:1px solid var(--line); } }

/* ============================================================
   DECLARACIONES · NORMAS
   ============================================================ */
.said{ padding:clamp(48px,7vw,96px) 0; border-top:1px solid var(--line); }
.said__title,.rules__title{ padding:0 var(--gutter); font-size:clamp(28px,5.2vw,72px); margin-bottom:22px; }
.said__title em,.rules__title em{ color:var(--blood-2); }
.rules__title{ margin-bottom:clamp(22px,3.5vw,40px); }
.said__lead{ padding:0 var(--gutter); color:var(--bone-3); max-width:52ch; margin-bottom:clamp(22px,3.5vw,40px); }
.said__grid{ display:grid; grid-template-columns:1fr; margin:0 var(--gutter); border-top:1px solid var(--line); }
.said__item{ padding:30px 0; border-bottom:1px solid var(--line); display:grid; gap:18px; }
.said__item p{ font-size:clamp(21px,2.3vw,28px); line-height:1.2; color:var(--bone); font-style:italic; font-variation-settings:"opsz" 72,"SOFT" 80,"WONK" 1; }
.said__item footer{ color:var(--ash); }
@media (min-width:900px){ .said__grid{ grid-template-columns:repeat(3,1fr); gap:0 40px; } .said__item{ padding:36px 0 40px; } }
.rules{ padding:clamp(48px,7vw,96px) 0; }
.faq{ margin:0 var(--gutter); border-top:1px solid var(--line); max-width:920px; }
.faq__item{ border-bottom:1px solid var(--line); }
.faq__item summary{ list-style:none; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 0; cursor:pointer; font-family:var(--display); font-size:clamp(15px,1.7vw,21px); line-height:1.25; transition:color .3s; }
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary:hover,.faq__item[open] summary{ color:var(--neon); }
.faq__item summary i{ width:14px; height:14px; position:relative; flex:none; }
.faq__item summary i::before,.faq__item summary i::after{ content:""; position:absolute; background:currentColor; transition:transform .5s var(--ease); }
.faq__item summary i::before{ left:0; right:0; top:6px; height:1px; }
.faq__item summary i::after{ top:0; bottom:0; left:6px; width:1px; }
.faq__item[open] summary i::after{ transform:rotate(90deg); }
.faq__body{ padding:0 0 24px; color:var(--bone-2); max-width:60ch; font-size:16.5px; }
.faq__body p{ animation:fade .5s var(--ease); }
@keyframes fade{ from{ opacity:0; transform:translateY(-4px); } }

/* ============================================================
   CIERRE
   ============================================================ */

/* ============================================================
   PIE
   ============================================================ */
.foot{ padding:48px var(--gutter) 120px calc(var(--gutter) + var(--index-w)); border-top:1px solid var(--line); display:grid; gap:28px; }
.foot__row{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:14px 30px; }
.foot__brand{ display:flex; align-items:center; gap:14px; font-family:var(--display); font-size:16px; letter-spacing:.1em; text-transform:uppercase; }
.foot__brand .kanji{ font-size:18px; }
.foot__role{ color:var(--ash); font-size:10px; }
.foot__line{ font-style:italic; font-variation-settings:"opsz" 40,"SOFT" 80,"WONK" 1; font-size:clamp(18px,2vw,24px); color:var(--bone-3); }
.foot__row--links{ justify-content:flex-start; gap:12px 26px; }
.foot__row--links a{ color:var(--bone-3); transition:color .3s; }
.foot__row--links a:hover{ color:var(--neon); }
@media (min-width:900px){ .foot{ padding-bottom:64px; } }

/* ---------- Barra fija móvil ---------- */
.dock{ position:fixed; left:0; right:0; bottom:0; z-index:45; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px 10px 18px; background:rgba(10,8,7,.88); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-top:1px solid var(--line); transform:translateY(110%); transition:transform .6s var(--ease); }
.dock.is-on{ transform:none; }
.dock__alt{ flex:0 0 auto; padding:14px 16px; border:1px solid var(--line-strong); font-family:var(--display); font-size:12px; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.dock__cta{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:10px; text-align:center; background:var(--blood); color:var(--bone); padding:14px 18px; font-family:var(--display); font-size:12px; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; box-shadow:0 0 24px rgba(226,36,47,.35); }
@media (min-width:900px){ .dock{ display:none; } }

/* ============================================================
   MÓVIL Y TABLET
   ============================================================ */
@media (max-width:899px){
  .grain{ animation:none; opacity:.12; }
  .hero__sign{ top:82px; right:10px; font-size:clamp(26px,7vw,36px); letter-spacing:.12em; }
  .hero__sign small{ display:none; }
  .hero__kicker{ padding-right:56px; }
  .hero__splat{ left:auto; right:-28%; top:auto; bottom:-6%; width:64vw; opacity:.32; }
  .who__halftone{ right:-30%; top:2%; width:90vw; opacity:.14; }
  .ink__bg{ right:-30%; width:110vw; opacity:.05; }
}
@media (max-width:520px){
  .btn--big{ height:auto; min-height:64px; padding:16px 22px; flex-wrap:wrap; justify-content:center; text-align:center; row-gap:6px; }
}
@media (max-width:400px){
  .btn > small{ display:none; }
  .btn{ padding:0 20px; gap:12px; }
}