/* ============================================================
   OTHER/VERSE — shared stylesheet · Visual Code v2
   Tokens come from the visual code (identity.html).
   Each series page sets its own flag with a body class:
   .s-lupatu (lime) · .s-sober (pink) · .s-disco (magenta)
   ============================================================ */

:root{
  --night:#001514;      /* neutral 2 — the room with the lights off */
  --night-2:#062624;
  --plum:#4a4063;       /* neutral 1 — the "verse" colour */
  --magenta:#e952de;    /* primary */
  --pink:#ffa0fd;       /* secondary */
  --lime:#c2d076;       /* accent */
  --cream:#f7f3ea;      /* paper */

  --bg:var(--night);
  --fg:var(--cream);
  --muted:rgba(247,243,234,.66);
  --line:rgba(247,243,234,.16);
  --accent:var(--magenta);

  --serif:'Cormorant Garamond',Georgia,serif;
  --tall:'Six Caps','Oswald',Impact,sans-serif;
  --sans:'DM Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;

  --ease:cubic-bezier(.22,.9,.24,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --gutter:clamp(16px,4vw,40px);
}
body.s-lupatu{--accent:var(--lime);}
body.s-sober{--accent:var(--pink);}
body.s-disco{--accent:var(--magenta);}

/* light surfaces — cream paper, night ink */
.light{
  --bg:var(--cream);--fg:var(--night);
  --muted:rgba(0,21,20,.68);--line:rgba(0,21,20,.16);
  background:var(--bg);color:var(--fg);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);color:var(--fg);
  font:400 17px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;}
img,video{max-width:100%;display:block;}
::selection{background:var(--magenta);color:var(--night);}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--gutter);}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.serif{font-family:var(--serif);}
.mono{font-family:var(--mono);}

/* the signature move — one word per composition, turned over */
.flip{display:inline-block;transform:rotate(180deg);}
a .flip,.flip.spin{transition:transform .9s var(--spring);}
a:hover .flip,.flip.spin:hover{transform:rotate(540deg);}

/* grain — the whole site sits under a thin layer of film */
body::after{
  content:"";position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.08;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}
  60%{transform:translate(-2%,6%)}80%{transform:translate(5%,-2%)}100%{transform:translate(0,0)}
}

/* scroll progress */
.progress{position:fixed;left:0;top:0;height:3px;width:100%;z-index:80;background:var(--accent);
  transform-origin:0 50%;transform:scaleX(var(--p,0));}

/* ---------- header / nav ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(0,21,20,.78);
  border-bottom:1px solid rgba(247,243,234,.1);color:var(--cream);
}
/* blur lives on a pseudo so the fixed mobile menu isn't trapped inside the header */
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
.site-header .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:14px;padding-bottom:14px;gap:24px;}
.logo{position:relative;z-index:2;display:inline-flex;align-items:baseline;gap:6px;text-decoration:none;line-height:1;white-space:nowrap;}
.logo .lo-o{font:600 26px/1 var(--serif);color:var(--magenta);letter-spacing:-.01em;}
.logo .lo-v{display:inline-block;font:400 24px/1 var(--tall);letter-spacing:.32em;color:var(--cream);
  transform:rotate(180deg);transition:transform .9s var(--spring);padding-left:.32em;}
.logo:hover .lo-v{transform:rotate(540deg);}

.site-nav{display:flex;gap:28px;align-items:center;}
.site-nav a{
  position:relative;display:inline-block;overflow:hidden;padding:6px 0;
  font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
}
.site-nav a > span{display:block;transition:transform .45s var(--ease);}
.site-nav a::after{
  content:attr(data-text);position:absolute;left:0;right:0;top:6px;white-space:nowrap;
  color:var(--accent);transform:translateY(130%) rotate(180deg);transition:transform .45s var(--ease);
}
.site-nav a:hover > span{transform:translateY(-130%);}
.site-nav a:hover::after{transform:translateY(0) rotate(180deg);}
.site-nav a[aria-current="page"]{color:var(--accent);}
.site-nav a[aria-current="page"] > span::before{content:"● ";font-size:8px;vertical-align:2px;}
.site-nav .lang{border:1px solid var(--line);border-radius:99px;padding:6px 12px;}
.site-nav .lang::after{left:12px;top:6px;}

.menu-toggle{display:none;background:none;border:1px solid var(--line);color:var(--cream);border-radius:99px;
  font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;padding:9px 16px;cursor:pointer;position:relative;z-index:2;}

@media (max-width:980px){
  .menu-toggle{display:block;}
  .site-nav{
    position:fixed;inset:0;z-index:1;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;
    padding:90px var(--gutter) 40px;background:var(--night);
    clip-path:circle(0% at calc(100% - 50px) 34px);transition:clip-path .7s var(--ease);visibility:hidden;
  }
  .site-nav.open{clip-path:circle(150% at calc(100% - 50px) 34px);visibility:visible;}
  .site-nav a{font:400 clamp(56px,15vw,110px)/1 var(--tall);letter-spacing:.02em;padding:2px 0;}
  .site-nav a::after{top:2px;}
  .site-nav .lang{border:none;padding:2px 0;margin-top:18px;font:500 14px var(--mono);letter-spacing:.14em;}
  body.nav-open{overflow:hidden;}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:12px;
  padding:16px 26px;border-radius:999px;border:1.5px solid var(--accent);
  background:var(--accent);color:var(--night);
  font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  transition:background .25s,color .25s,transform .2s ease-out;cursor:pointer;
}
.btn::after{content:"→";display:inline-block;font-size:15px;transition:transform .6s var(--spring);}
.btn:hover{background:transparent;color:var(--accent);}
.btn:hover::after{transform:rotate(180deg);}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line);}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent);}
.btn.dark{--accent:var(--night);color:var(--cream);}
.btn.dark:hover{color:var(--night);}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- labels ---------- */
.kicker{font:500 12px/1.4 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid currentColor;border-radius:99px;padding:6px 12px;
  font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;}
.chip.live::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;animation:blink 1.2s steps(2) infinite;}
@keyframes blink{50%{opacity:0}}

/* ---------- hero (home + series posters) ---------- */
.hero{
  position:relative;overflow:hidden;isolation:isolate;
  min-height:calc(100svh - 62px);
  display:flex;flex-direction:column;justify-content:center;
  padding:110px var(--gutter) 60px;
  background:
    radial-gradient(640px circle at var(--mx,72%) var(--my,30%),color-mix(in srgb,var(--accent) 22%,transparent),transparent 62%),
    var(--night);
  color:var(--cream);
}
.blobs{position:absolute;inset:0;z-index:-1;filter:blur(90px);opacity:.55;pointer-events:none;}
.blobs i{position:absolute;border-radius:50%;animation:drift 22s ease-in-out infinite alternate;}
.blobs i:nth-child(1){width:44vw;height:44vw;left:-10vw;top:-12vw;background:var(--plum);}
.blobs i:nth-child(2){width:30vw;height:30vw;right:-6vw;bottom:-8vw;background:var(--accent);opacity:.45;animation-duration:17s;}
.blobs i:nth-child(3){width:18vw;height:18vw;left:48vw;top:40%;background:var(--lime);opacity:.18;animation-duration:26s;}
@keyframes drift{to{transform:translate(8vw,6vw) scale(1.2);}}

.corner{position:absolute;font:500 11px/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);z-index:2;}
.corner.tl{left:var(--gutter);top:28px;}
.corner.tr{right:var(--gutter);top:28px;text-align:right;}
.corner.bl{left:var(--gutter);bottom:26px;}
.corner.br{right:var(--gutter);bottom:26px;text-align:right;}
.corner.br.scroll{animation:bob 2s ease-in-out infinite;}
@keyframes bob{50%{transform:translateY(6px)}}

/* the wordmark as hero */
.wordmark{margin:0 auto;display:flex;flex-direction:column;align-items:flex-start;line-height:.8;font-weight:inherit;position:relative;z-index:2;}
.wordmark .wm-o{font:600 clamp(96px,20vw,310px)/.9 var(--serif);color:var(--magenta);letter-spacing:-.02em;margin-left:.45em;}
.wordmark .wm-v{display:block;margin-top:.04em;}
.wordmark .wm-v .flipper{
  display:inline-block;font:400 clamp(112px,23vw,360px)/.86 var(--tall);letter-spacing:.34em;padding-left:.34em;
  color:var(--plum);transform:rotate(180deg);animation:turnover 9s var(--ease) infinite;
  text-shadow:0 0 40px rgba(233,82,222,.0);transition:color .4s,text-shadow .4s;
}
.wordmark:hover .wm-v .flipper{color:var(--pink);text-shadow:0 0 60px rgba(255,160,253,.45);}
@keyframes turnover{0%,72%{transform:rotate(180deg)}88%,100%{transform:rotate(540deg)}}

/* hoverable letters (split by main.js) */
.ltr{display:inline-block;transition:transform .35s var(--spring),color .25s;}
.split-pop .ltr:hover{transform:translateY(-.1em) rotate(-8deg);color:var(--lime);}
.flip .ltr:hover,.flipper .ltr:hover{transform:translateY(.1em) rotate(8deg);}

.hero-foot{display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:28px;align-items:end;margin-top:clamp(28px,5vw,56px);position:relative;z-index:2;max-width:1240px;width:100%;margin-left:auto;margin-right:auto;}
.lede{font:500 clamp(22px,2.4vw,32px)/1.25 var(--serif);margin:0;max-width:30ch;}
.lede em{color:var(--accent);}

/* spinning badge */
.spin-badge{position:absolute;width:clamp(120px,13vw,190px);aspect-ratio:1;z-index:3;pointer-events:none;}
.spin-badge svg{width:100%;height:100%;animation:spin 16s linear infinite;overflow:visible;}
.spin-badge text{font:500 15.5px var(--mono);letter-spacing:.2em;fill:var(--cream);text-transform:uppercase;}
.spin-badge .disc{fill:var(--accent);}
.spin-badge .core{position:absolute;inset:0;display:grid;place-items:center;font:600 clamp(26px,3vw,40px)/1 var(--serif);color:var(--night);}
@keyframes spin{to{transform:rotate(360deg)}}

/* series poster hero */
.poster .giant{margin:18px 0 0;font:400 clamp(120px,23vw,380px)/.8 var(--tall);text-transform:uppercase;letter-spacing:.01em;position:relative;z-index:2;}
.poster .giant .row{display:block;}
.poster .giant .row.alt{color:transparent;-webkit-text-stroke:2px var(--accent);}
.poster .giant .row.fill{color:var(--accent);}
.poster .sub{font:500 clamp(22px,2.3vw,30px)/1.3 var(--serif);max-width:34ch;margin:24px 0 28px;position:relative;z-index:2;}
.poster .facts{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0;position:relative;z-index:2;}

/* intro rise */
.rise{opacity:0;transform:translateY(24px);animation:rise .9s var(--ease) forwards;}
.rise.d1{animation-delay:.12s}.rise.d2{animation-delay:.24s}.rise.d3{animation-delay:.36s}
@keyframes rise{to{opacity:1;transform:none}}

/* ---------- tickers — two crossed tapes ---------- */
.tapes{position:relative;height:clamp(170px,20vw,260px);overflow:hidden;background:var(--bg);}
.ticker{position:absolute;left:-6%;right:-6%;top:50%;overflow:hidden;padding:10px 0;}
.ticker.t1{background:var(--magenta);color:var(--night);transform:translateY(-50%) rotate(-4deg);z-index:2;}
.ticker.t2{background:var(--lime);color:var(--night);transform:translateY(-50%) rotate(3deg);}
.ticker-track{display:flex;width:max-content;animation:tick 34s linear infinite;}
.ticker.t2 .ticker-track{animation-direction:reverse;animation-duration:40s;}
.ticker-track span{font:400 clamp(44px,6vw,84px)/1 var(--tall);text-transform:uppercase;letter-spacing:.03em;padding:0 .35em;white-space:nowrap;}
.ticker-track .f{display:inline-block;transform:rotate(180deg);}
.ticker-track .o{color:transparent;-webkit-text-stroke:1.5px var(--night);}
.tapes:hover .ticker-track{animation-play-state:paused;}
@keyframes tick{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
.sec{padding:clamp(80px,11vw,150px) 0;position:relative;}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:end;margin-bottom:clamp(36px,5vw,64px);padding-bottom:26px;border-bottom:1px solid var(--line);}
.sec-head h2,.h-tall{font:400 clamp(72px,10vw,150px)/.84 var(--tall);text-transform:uppercase;letter-spacing:.01em;margin:14px 0 0;}
.sec-head .note{max-width:34ch;color:var(--muted);margin:0;font-size:16px;}
.ghost-num{position:absolute;right:var(--gutter);top:clamp(40px,6vw,90px);font:400 clamp(180px,26vw,380px)/.8 var(--tall);color:transparent;-webkit-text-stroke:1px var(--line);pointer-events:none;z-index:0;}
.sec > .wrap{position:relative;z-index:1;}

.statement{font:500 clamp(30px,4.4vw,62px)/1.12 var(--serif);letter-spacing:-.01em;margin:0;max-width:22ch;}
.statement em{font-style:italic;color:var(--accent);}
.statement .flip{color:var(--accent);}
.two-col{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(28px,6vw,90px);align-items:end;}
.two-col p{color:var(--muted);margin:0 0 1em;}

/* ---------- series cards ---------- */
.series-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);perspective:1200px;}
.s-card{
  position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:24px;
  min-height:clamp(460px,44vw,600px);padding:26px;border-radius:4px;text-decoration:none;
  transform-style:preserve-3d;transition:transform .5s var(--ease),box-shadow .35s var(--ease);will-change:transform;
  --tone:var(--accent);
}
.s-card:hover{box-shadow:14px 14px 0 var(--tone);}
.s-card .s-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;position:relative;z-index:2;}
.s-card h3{font:400 clamp(78px,8.4vw,128px)/.84 var(--tall);text-transform:uppercase;margin:0;letter-spacing:.01em;position:relative;z-index:2;}
.s-card .rule{font:600 italic 24px/1.2 var(--serif);margin:0 0 8px;}
.s-card p{margin:0;font-size:15.5px;line-height:1.5;position:relative;z-index:2;}
.s-card .go{font:600 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;position:relative;z-index:2;display:inline-flex;gap:10px;}
.s-card .go::after{content:"⟶";transition:transform .4s var(--ease);}
.s-card:hover .go::after{transform:translateX(8px);}
.s-card .body{position:relative;z-index:2;}
.c-lupatu{background:var(--lime);color:var(--night);--tone:var(--magenta);}
.c-sober{background:var(--pink);color:var(--night);--tone:var(--lime);}
.c-disco{background:var(--night-2);color:var(--cream);--tone:var(--magenta);}
.c-disco .bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;transition:transform 1.2s var(--ease),filter .6s;filter:saturate(1.1) brightness(.62);}
.c-disco:hover .bg{transform:scale(1.07);filter:saturate(1.3) brightness(.5);}
.c-disco::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,21,20,.2),rgba(0,21,20,.92));}
.c-disco h3{color:var(--magenta);text-shadow:0 0 28px rgba(233,82,222,.55);}
.c-sober .soon{position:absolute;right:-40px;top:44%;z-index:1;font:400 150px/.8 var(--tall);color:transparent;-webkit-text-stroke:1.5px rgba(0,21,20,.25);transform:rotate(90deg);pointer-events:none;}

/* ---------- dates list ---------- */
.dates{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.dates li{border-bottom:1px solid var(--line);}
.date-row{
  position:relative;display:grid;grid-template-columns:150px minmax(0,1.6fr) minmax(0,1fr) 40px;gap:20px;align-items:center;
  padding:22px 8px;text-decoration:none;overflow:hidden;isolation:isolate;transition:color .35s,padding .35s var(--ease);
}
.date-row::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--row,var(--accent));transform:scaleY(0);transform-origin:50% 100%;transition:transform .45s var(--ease);}
.date-row:hover{color:var(--night);padding-left:22px;}
.date-row:hover::before{transform:scaleY(1);}
.date-row .d{font:400 64px/.9 var(--tall);}
.date-row .n{font:600 clamp(22px,2.4vw,32px)/1.1 var(--serif);}
.date-row .v{font:500 12px/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.date-row:hover .v{color:inherit;}
.date-row .a{font-size:24px;justify-self:end;transition:transform .5s var(--spring);}
.date-row:hover .a{transform:rotate(-45deg);}
.date-row.tba .d{color:transparent;-webkit-text-stroke:1px var(--fg);}
.date-row:hover.tba .d{-webkit-text-stroke-color:var(--night);}

/* ---------- manifesto teaser / theses ---------- */
.theses-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:56px 0 44px;counter-reset:t;}
.theses-mini div{border-top:2px solid var(--fg);padding-top:18px;}
.theses-mini b{display:block;font:400 54px/.9 var(--tall);color:var(--magenta);}
.theses-mini h4{font:600 26px/1.15 var(--serif);margin:10px 0 8px;}
.theses-mini p{margin:0;color:var(--muted);font-size:15.5px;}
.big-quote{font:500 italic clamp(40px,6.6vw,104px)/1 var(--serif);letter-spacing:-.02em;margin:18px 0 0;max-width:15ch;}
.big-quote .flip{font-style:normal;color:var(--magenta);}

.thesis{display:grid;grid-template-columns:clamp(90px,14vw,190px) minmax(0,1fr);gap:clamp(20px,4vw,56px);padding:clamp(34px,5vw,56px) 0;border-top:1px solid var(--line);}
.thesis .no{font:400 clamp(90px,12vw,170px)/.8 var(--tall);color:transparent;-webkit-text-stroke:1.5px var(--accent);transition:color .6s var(--ease);}
.thesis.in .no{color:var(--accent);}
.thesis h3{font:600 clamp(32px,4.4vw,60px)/1.02 var(--serif);letter-spacing:-.01em;margin:0 0 16px;max-width:20ch;}
.thesis h3 mark{background:linear-gradient(var(--accent),var(--accent)) 0 100%/0% 30% no-repeat;color:inherit;transition:background-size 1.1s var(--ease) .3s;}
.thesis.in h3 mark{background-size:100% 30%;}
.light .thesis h3 mark{background-image:linear-gradient(var(--pink),var(--pink));}
.thesis p{margin:0;max-width:56ch;color:var(--muted);font-size:clamp(17px,1.4vw,19px);}
.signed{display:flex;align-items:center;gap:28px;flex-wrap:wrap;padding-top:48px;border-top:1px solid var(--line);}
.signed img{width:min(360px,70vw);}
.signed p{font:500 italic 24px/1.3 var(--serif);margin:0;}

/* ---------- steps / rows ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);}
.step{border:1px solid var(--line);padding:28px;border-radius:4px;position:relative;overflow:hidden;transition:border-color .3s,transform .4s var(--ease);}
.step:hover{border-color:var(--accent);transform:translateY(-6px);}
.step .num{font:400 110px/.8 var(--tall);color:var(--accent);display:block;margin-bottom:18px;}
.step h4{font:600 34px/1 var(--serif);margin:0 0 10px;}
.step p{margin:0;color:var(--muted);font-size:16px;}

.svc-row{display:grid;grid-template-columns:120px minmax(0,1fr) minmax(0,1.3fr);gap:28px;align-items:baseline;padding:30px 0;border-bottom:1px solid var(--line);transition:padding .4s var(--ease);}
.svc-row:first-of-type{border-top:1px solid var(--line);}
.svc-row:hover{padding-left:14px;}
.svc-row .num{font:500 12px var(--mono);letter-spacing:.14em;color:var(--accent);}
.svc-row h3{font:600 clamp(28px,3vw,40px)/1.05 var(--serif);margin:0;}
.svc-row p{margin:0;color:var(--muted);}

/* ---------- ticket ---------- */
.ticket{
  display:grid;grid-template-columns:minmax(0,1fr) 150px;position:relative;
  background:var(--cream);color:var(--night);border-radius:6px;overflow:hidden;
  -webkit-mask:radial-gradient(circle 14px at calc(100% - 150px) 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 14px at calc(100% - 150px) 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
  mask:radial-gradient(circle 14px at calc(100% - 150px) 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 14px at calc(100% - 150px) 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
  transition:transform .5s var(--spring);
}
.ticket:hover{transform:rotate(-1.2deg) scale(1.01);}
.ticket .main{padding:26px 30px;}
.ticket .ev{font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;opacity:.7;}
.ticket .name{font:400 clamp(48px,5.6vw,76px)/.9 var(--tall);text-transform:uppercase;margin:10px 0 14px;}
.ticket .row{display:flex;flex-wrap:wrap;gap:8px 22px;font:500 13px var(--mono);letter-spacing:.1em;}
.ticket .stub{border-left:2px dashed rgba(0,21,20,.35);background:var(--accent);display:grid;place-items:center;}
.ticket .stub span{writing-mode:vertical-rl;transform:rotate(180deg);font:400 44px/1 var(--tall);letter-spacing:.14em;}
.tickets{display:grid;gap:20px;}

/* ---------- CTA band ---------- */
.cta-band{background:var(--magenta);color:var(--night);padding:clamp(80px,11vw,140px) 0;overflow:hidden;position:relative;}
.cta-band .inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;}
.cta-band h2{font:400 clamp(84px,13vw,200px)/.82 var(--tall);text-transform:uppercase;margin:0;}
.cta-band p{font:500 clamp(20px,2vw,26px)/1.3 var(--serif);max-width:34ch;margin:22px 0 0;}
.s-lupatu .cta-band{background:var(--lime);}
.s-sober .cta-band{background:var(--pink);}

/* ---------- footer ---------- */
.site-footer{background:var(--night);color:var(--cream);padding:80px 0 30px;border-top:1px solid rgba(247,243,234,.1);}
.site-footer{--line:rgba(247,243,234,.16);--muted:rgba(247,243,234,.62);}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;}
.footer-grid img{width:min(300px,80%);margin-bottom:20px;}
.footer-grid .tagline{color:var(--muted);max-width:34ch;margin:0;font-size:15px;}
.site-footer h5{font:500 11px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--magenta);margin:0 0 14px;}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;}
.site-footer li a{text-decoration:none;color:var(--muted);transition:color .2s;}
.site-footer li a:hover{color:var(--cream);}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:64px;padding-top:22px;border-top:1px solid var(--line);font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.footer-bottom a{text-decoration:none;}
.footer-bottom a:hover{color:var(--magenta);}

/* ---------- scroll reveal ---------- */
.js .reveal{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
.js .reveal.in{opacity:1;transform:none;}
.js .reveal.d1{transition-delay:.1s}.js .reveal.d2{transition-delay:.2s}.js .reveal.d3{transition-delay:.3s}

/* ---------- custom cursor ---------- */
.has-cursor,.has-cursor a,.has-cursor button{cursor:none;}
.cursor-dot,.cursor-ring{position:fixed;left:0;top:0;pointer-events:none;z-index:120;border-radius:50%;translate:-50% -50%;}
.cursor-dot{width:8px;height:8px;background:var(--cream);mix-blend-mode:difference;}
.cursor-ring{width:40px;height:40px;border:1.5px solid var(--accent);display:grid;place-items:center;
  transition:width .3s var(--ease),height .3s var(--ease),background .3s;
  font:600 10px var(--mono);letter-spacing:.14em;color:var(--night);text-transform:uppercase;}
.cursor-ring.grow{width:74px;height:74px;background:color-mix(in srgb,var(--accent) 18%,transparent);}
.cursor-ring.label{width:92px;height:92px;background:var(--accent);}

/* ============================================================
   80's MUSIC VIDEO DISCOTHEQUE
   ============================================================ */
.disco-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,4vw,64px);align-items:center;}
.disco-hero .giant{font-size:clamp(96px,12.4vw,210px);text-shadow:0 0 34px rgba(233,82,222,.45);}
.disco-hero .giant .row.alt{text-shadow:none;}
.synth-floor{position:absolute;left:-50%;right:-50%;bottom:-2px;height:46%;z-index:-1;
  background-image:linear-gradient(var(--magenta) 1.5px,transparent 1.5px),linear-gradient(90deg,var(--magenta) 1.5px,transparent 1.5px);
  background-size:70px 70px;transform:perspective(420px) rotateX(64deg);transform-origin:50% 100%;opacity:.4;
  -webkit-mask:linear-gradient(transparent,#000 70%);mask:linear-gradient(transparent,#000 70%);
  animation:floor 2.4s linear infinite;}
@keyframes floor{to{background-position:0 70px}}
.crt{position:relative;z-index:2;justify-self:center;width:min(100%,460px);padding:22px 22px 64px;border-radius:26px;
  background:linear-gradient(160deg,#4f4668,#2a2440 60%,#1c1830);box-shadow:0 40px 90px rgba(0,0,0,.6),inset 0 2px 0 rgba(255,255,255,.12);transform:rotate(3deg);}
.crt .screen{position:relative;border-radius:18px/22px;overflow:hidden;aspect-ratio:4/5;background:#000;box-shadow:inset 0 0 40px rgba(0,0,0,.9);}
.crt video,.crt .screen img{width:100%;height:100%;object-fit:cover;filter:saturate(1.15) contrast(1.05);}
.crt .screen::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 2px,transparent 2px 4px),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55));
  animation:flicker .12s steps(2) infinite;}
@keyframes flicker{50%{opacity:.86}}
.crt .osd{position:absolute;z-index:2;font:500 15px var(--mono);letter-spacing:.1em;color:var(--lime);text-shadow:0 0 8px var(--lime);}
.crt .osd.tl{left:16px;top:14px;}
.crt .osd.tr{right:16px;top:14px;color:#ff5a5a;text-shadow:0 0 8px #ff5a5a;}
.crt .osd.tr::before{content:"● ";animation:blink 1s steps(2) infinite;}
.crt .osd.bl{left:16px;bottom:14px;}
.crt .knobs{position:absolute;left:28px;right:28px;bottom:20px;display:flex;justify-content:space-between;align-items:center;}
.crt .knobs span{font:600 11px var(--mono);letter-spacing:.3em;color:rgba(247,243,234,.5);}
.crt .knobs i{display:inline-block;width:22px;height:22px;border-radius:50%;background:#15121f;box-shadow:inset 0 2px 3px rgba(255,255,255,.15);margin-left:8px;}
.crt .sound{position:absolute;z-index:3;right:14px;bottom:14px;background:rgba(0,21,20,.7);color:var(--cream);border:1px solid rgba(247,243,234,.3);border-radius:99px;padding:6px 10px;font:500 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;}

.countdown{display:flex;gap:clamp(10px,2vw,22px);margin:26px 0 30px;position:relative;z-index:2;}
.countdown div{min-width:74px;text-align:center;border:1px solid var(--line);border-radius:6px;padding:10px 8px 8px;background:rgba(0,21,20,.5);}
.countdown b{display:block;font:400 clamp(52px,5.4vw,76px)/.9 var(--tall);color:var(--lime);text-shadow:0 0 18px rgba(194,208,118,.5);}
.countdown b.tick{animation:tickflip .4s var(--ease);}
@keyframes tickflip{0%{transform:rotateX(90deg);opacity:.2}100%{transform:none;opacity:1}}
.countdown small{font:500 10px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}

.strip{display:flex;gap:22px;overflow-x:auto;padding:30px var(--gutter) 40px;scroll-snap-type:x proximity;cursor:grab;scrollbar-width:thin;scrollbar-color:var(--magenta) transparent;}
.strip.drag{cursor:grabbing;scroll-snap-type:none;}
.strip figure{flex:0 0 clamp(220px,24vw,320px);margin:0;scroll-snap-align:center;transition:transform .5s var(--spring);}
.strip figure:nth-child(odd){transform:rotate(-2.5deg);}
.strip figure:nth-child(even){transform:rotate(2deg) translateY(16px);}
.strip figure:hover{transform:rotate(0) scale(1.05);z-index:2;}
.strip img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:4px;box-shadow:0 20px 50px rgba(0,0,0,.5);pointer-events:none;user-select:none;}

/* ============================================================
   SOBER IS SEXY — coming soon
   ============================================================ */
.pulse{position:absolute;left:0;right:0;top:56%;z-index:0;width:100%;height:160px;pointer-events:none;opacity:.8;}
.pulse path{fill:none;stroke:var(--pink);stroke-width:2.5;stroke-dasharray:1400;stroke-dashoffset:1400;animation:ecg 3.2s linear infinite;filter:drop-shadow(0 0 8px var(--pink));}
@keyframes ecg{to{stroke-dashoffset:-1400}}
.heart{display:inline-block;animation:beat 1.1s ease-in-out infinite;color:var(--pink);}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.18)}}
.redacted{background:var(--fg);color:transparent;border-radius:2px;user-select:none;padding:0 .2em;}

/* ---------- forms ---------- */
.form{display:grid;gap:18px;}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form label{display:grid;gap:8px;font:500 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.form input,.form select,.form textarea{
  font:400 18px/1.4 var(--sans);color:var(--fg);background:transparent;border:none;border-bottom:1.5px solid var(--line);
  padding:10px 0;border-radius:0;transition:border-color .25s;width:100%;
}
.form select{appearance:none;background:linear-gradient(45deg,transparent 50%,var(--fg) 50%) calc(100% - 12px) 55%/6px 6px no-repeat,linear-gradient(-45deg,transparent 50%,var(--fg) 50%) calc(100% - 6px) 55%/6px 6px no-repeat;}
.form select option{color:var(--night);}
.form textarea{min-height:130px;resize:vertical;}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--accent);}
.form .hint{font:400 13px var(--sans);color:var(--muted);text-transform:none;letter-spacing:0;margin:0;}
.inline-form{display:flex;gap:10px;flex-wrap:wrap;max-width:560px;}
.inline-form input{flex:1 1 240px;font:400 18px var(--sans);color:var(--cream);background:rgba(247,243,234,.06);border:1.5px solid var(--line);border-radius:99px;padding:15px 22px;}
.inline-form input:focus{outline:none;border-color:var(--accent);}

.contact-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(30px,6vw,90px);}
.contact-side{display:grid;gap:28px;align-content:start;}
.contact-side .item{border-top:1px solid var(--line);padding-top:18px;}
.contact-side .item a,.contact-side .item strong{display:block;font:600 26px/1.2 var(--serif);text-decoration:none;}
.contact-side .item a:hover{color:var(--accent);}
.contact-side p{margin:6px 0 0;color:var(--muted);font-size:15px;}

/* ============================================================
   VISUAL CODE (identity.html)
   ============================================================ */
.swatches{display:grid;grid-template-columns:2fr 1.4fr 1.4fr 1fr 1fr 1fr;gap:10px;}
.swatch{min-height:280px;border-radius:4px;padding:20px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line);cursor:pointer;text-align:left;font:inherit;color:inherit;transition:transform .4s var(--spring);}
.swatch:hover{transform:translateY(-8px);}
.swatch b{font:400 44px/.9 var(--tall);text-transform:uppercase;display:block;}
.swatch code{font:500 12px var(--mono);letter-spacing:.1em;}
.swatch small{display:block;font:400 13px/1.4 var(--sans);opacity:.8;margin-top:8px;}
.swatch.copied code::after{content:" — copied";}
.logo-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.logo-tile{border-radius:4px;aspect-ratio:16/10;display:grid;place-items:center;padding:12%;border:1px solid var(--line);position:relative;}
.logo-tile img{max-height:100%;}
.logo-tile .cap{position:absolute;left:16px;bottom:12px;font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;opacity:.7;}
.type-row{display:grid;grid-template-columns:220px minmax(0,1fr);gap:30px;padding:34px 0;border-top:1px solid var(--line);align-items:baseline;}
.type-row .meta{font:500 12px/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.type-row .meta b{display:block;color:var(--fg);font-size:13px;}
.spec-tall{font:400 clamp(90px,11vw,170px)/.85 var(--tall);text-transform:uppercase;}
.spec-serif{font:600 clamp(48px,6vw,90px)/1 var(--serif);}
.spec-sans{font:400 22px/1.5 var(--sans);max-width:52ch;}
.spec-mono{font:500 14px/1.6 var(--mono);letter-spacing:.14em;text-transform:uppercase;}
.rules{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.rule-card{border:1px solid var(--line);border-radius:4px;padding:24px;}
.rule-card h4{font:600 26px/1.1 var(--serif);margin:0 0 8px;display:flex;gap:10px;align-items:baseline;}
.rule-card h4 span{font:500 12px var(--mono);letter-spacing:.14em;}
.rule-card.do h4 span{color:var(--lime);}
.rule-card.dont h4 span{color:#ff6b6b;}
.rule-card p{margin:0;color:var(--muted);font-size:15.5px;}
.series-code{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.series-code > div{border-radius:4px;padding:26px;min-height:220px;display:flex;flex-direction:column;justify-content:space-between;}
.series-code h4{font:400 64px/.85 var(--tall);text-transform:uppercase;margin:0;}
.series-code p{margin:0;font-size:15px;}
.motion-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.motion-grid > div{border:1px solid var(--line);border-radius:4px;padding:22px;}
.motion-grid .demo{height:110px;display:grid;place-items:center;font:400 72px/1 var(--tall);color:var(--magenta);}
.motion-grid h4{font:600 24px var(--serif);margin:12px 0 6px;}
.motion-grid p{margin:0;color:var(--muted);font-size:15px;}
.demo .flip.spin{cursor:pointer;}
.demo-pop{animation:popdemo 2.4s var(--spring) infinite;}
@keyframes popdemo{0%,60%,100%{transform:none}70%{transform:translateY(-12px) rotate(-8deg);color:var(--lime);}}
.demo-drift{width:60px;height:60px;border-radius:50%;background:var(--plum);filter:blur(6px);animation:drift2 3s ease-in-out infinite alternate;}
@keyframes drift2{to{transform:translate(30px,-10px) scale(1.3);background:var(--magenta);}}
.demo-tick{overflow:hidden;width:100%;}
.demo-tick span{display:inline-block;white-space:nowrap;animation:tick 6s linear infinite;font-size:44px;}

/* ============================================================
   responsive
   ============================================================ */
@media (max-width:980px){
  .series-grid,.steps,.theses-mini,.series-code{grid-template-columns:1fr;}
  .s-card{min-height:420px;}
  .two-col,.contact-grid,.disco-hero,.cta-band .inner,.hero-foot{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .footer-grid > div:first-child{grid-column:1/-1;}
  .swatches{grid-template-columns:repeat(3,1fr);}
  .motion-grid{grid-template-columns:repeat(2,1fr);}
  .crt{transform:rotate(2deg);width:min(100%,380px);}
}
@media (max-width:640px){
  body{font-size:16px;}
  .corner.tr,.corner.bl{display:none;}
  .hero{padding-top:80px;}
  .wordmark .wm-o{margin-left:.2em;}
  .sec-head{grid-template-columns:1fr;}
  .date-row{grid-template-columns:86px minmax(0,1fr) 24px;gap:14px;}
  .date-row .d{font-size:46px;}
  .date-row .v{grid-column:2;grid-row:2;}
  .date-row .a{grid-column:3;grid-row:1/3;}
  .svc-row,.type-row,.thesis{grid-template-columns:1fr;gap:10px;}
  .thesis .no{font-size:90px;}
  .ticket{grid-template-columns:minmax(0,1fr) 70px;
    -webkit-mask:radial-gradient(circle 12px at calc(100% - 70px) 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 12px at calc(100% - 70px) 100%,#0000 98%,#000) bottom/100% 51% no-repeat;
    mask:radial-gradient(circle 12px at calc(100% - 70px) 0,#0000 98%,#000) top/100% 51% no-repeat,radial-gradient(circle 12px at calc(100% - 70px) 100%,#0000 98%,#000) bottom/100% 51% no-repeat;}
  .ticket .main{padding:20px;}
  .ticket .stub span{font-size:30px;}
  .form .two,.rules,.logo-tiles{grid-template-columns:1fr;}
  .swatches{grid-template-columns:1fr 1fr;}
  .swatch{min-height:170px;}
  .motion-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .spin-badge{width:104px;}
  .countdown div{min-width:0;flex:1;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}
  body::after{animation:none;}
  .rise{opacity:1;transform:none;}
  .wordmark .wm-v .flipper{animation:none;transform:rotate(180deg);}
}

/* ============================================================
   LUPATU BALLE — cut-out lettering, borrowed from the swap poster
   ============================================================ */
.ransom{display:inline-flex;flex-wrap:wrap;gap:.04em;line-height:1;}
.ransom .ltr{padding:.04em .1em .02em;margin:0 .01em;border-radius:3px;box-shadow:3px 4px 0 rgba(0,0,0,.35);
  transition:transform .4s var(--spring);}
.ransom .ltr:nth-child(5n+1){background:var(--lime);color:var(--night);font-family:var(--serif);font-style:italic;font-weight:600;transform:rotate(-6deg);}
.ransom .ltr:nth-child(5n+2){background:var(--pink);color:var(--night);font-family:var(--tall);transform:rotate(4deg) translateY(.06em);}
.ransom .ltr:nth-child(5n+3){background:var(--cream);color:var(--night);font-family:var(--mono);font-weight:500;transform:rotate(-3deg);}
.ransom .ltr:nth-child(5n+4){background:var(--plum);color:var(--cream);font-family:var(--serif);font-weight:600;transform:rotate(7deg) translateY(-.04em);}
.ransom .ltr:nth-child(5n+5){background:var(--magenta);color:var(--night);font-family:var(--sans);font-weight:700;transform:rotate(-5deg);}
.ransom .ltr:hover{transform:rotate(0) scale(1.15);color:inherit;}
.poster .giant.lupatu{font-size:clamp(84px,15vw,250px);line-height:.95;}
.poster .giant.lupatu .ransom{font-size:.62em;margin-bottom:.12em;}
.vcr{color:var(--lime);font:400 1em var(--mono);letter-spacing:-.2em;}

.vframe{position:relative;justify-self:center;width:min(100%,400px);border:10px solid var(--lime);border-radius:6px;transform:rotate(-3deg);
  box-shadow:18px 18px 0 var(--magenta);background:#000;transition:transform .6s var(--spring);}
.vframe:hover{transform:rotate(0);}
.vframe video{width:100%;aspect-ratio:4/5;object-fit:cover;}
.vframe .tag{position:absolute;left:-14px;top:-22px;background:var(--cream);color:var(--night);padding:6px 12px;transform:rotate(-6deg);
  font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;box-shadow:3px 4px 0 rgba(0,0,0,.35);}
.split-media{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(30px,6vw,90px);align-items:center;}
.past{display:grid;gap:10px;margin:26px 0 0;padding:0;list-style:none;}
.past li{display:grid;grid-template-columns:130px minmax(0,1fr);gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:15.5px;}
.past li b{font:500 11px/1.8 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
@media (max-width:980px){.split-media{grid-template-columns:1fr;}}
@media (max-width:640px){.past li{grid-template-columns:1fr;gap:2px;}}

/* small screens — keep the wordmark on one line, park the badge */
.wordmark .wm-v .flipper{white-space:nowrap;}
@media (max-width:640px){
  .wordmark .wm-o{font-size:27vw;}
  .wordmark .wm-v .flipper{font-size:34vw;letter-spacing:.22em;padding-left:.22em;}
  .spin-badge{display:none;}
  .poster .giant{font-size:clamp(84px,30vw,160px);}
  .poster .giant.lupatu{font-size:clamp(64px,19vw,120px);}
  .disco-hero .giant{font-size:clamp(76px,24vw,140px);}
}
.logo-tiles{grid-template-columns:repeat(2,minmax(0,1fr));}
.logo-tile img{width:100%;height:auto;object-fit:contain;}
.swatches > *,.rules > *,.motion-grid > *,.type-row > *{min-width:0;}
@media (max-width:640px){.logo-tiles{grid-template-columns:minmax(0,1fr);}.spec-tall{font-size:84px;}.spec-serif{font-size:42px;}}

/* disco — three campaign posters, fanned */
.poster-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,3vw,40px);align-items:start;padding:10px 0 20px;}
.poster-trio figure{margin:0;transition:transform .6s var(--spring),box-shadow .4s;}
.poster-trio img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:4px;box-shadow:0 24px 60px rgba(0,0,0,.55);}
.js .poster-trio figure.reveal.in:nth-child(1){transform:rotate(-4deg);}
.js .poster-trio figure.reveal.in:nth-child(2){transform:translateY(34px) rotate(1.5deg);}
.js .poster-trio figure.reveal.in:nth-child(3){transform:rotate(4deg);}
.js .poster-trio figure.reveal.in:hover{transform:rotate(0) scale(1.05);z-index:2;}
.poster-trio figure:hover img{box-shadow:14px 14px 0 var(--magenta),0 24px 60px rgba(0,0,0,.55);}
@media (max-width:640px){
  .poster-trio{grid-template-columns:minmax(0,1fr);gap:28px;}
  .js .poster-trio figure.reveal.in:nth-child(2){transform:rotate(1.5deg);}
}