:root {
  --ink: #0a0a0a;
  --ink-2: #141414;
  --bone: #ece6dc;
  --bone-dim: rgba(236, 230, 220, .55);
  --line: rgba(236, 230, 220, .14);
  --red: #e3261b;
  --pad: clamp(16px, 3.2vw, 48px);
  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --serif: "Instrument Serif", Georgia, serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --ease: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--bone);
  font-family: var(--display);
  font-variation-settings: "wdth" 100;
  font-size: 16px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.is-loading { overflow: hidden; }
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
em { font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: 0; font-variation-settings: normal; }
.mono { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
::selection { background: var(--red); color: var(--bone); }

/* ---------- grain + cursor ---------- */
.grain {
  position: fixed; inset: -100%; z-index: 90; pointer-events: none; opacity: .09;
  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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: grain 1s steps(6) infinite;
}
@keyframes grain {
  0% { transform: translate(0, 0); } 20% { transform: translate(-6%, 4%); } 40% { transform: translate(4%, -8%); }
  60% { transform: translate(-10%, 2%); } 80% { transform: translate(8%, 6%); } 100% { transform: translate(0, 0); }
}
.cursor {
  position: fixed; left: 0; top: 0; z-index: 100; pointer-events: none;
  width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%;
  background: var(--bone); mix-blend-mode: difference;
  display: grid; place-items: center;
  transition: width .5s var(--ease), height .5s var(--ease), margin .5s var(--ease), background .3s;
}
.cursor__label { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); opacity: 0; transition: opacity .2s; }
.cursor.is-big { width: 92px; height: 92px; margin: -46px 0 0 -46px; mix-blend-mode: normal; background: var(--red); }
.cursor.is-big .cursor__label { opacity: 1; color: var(--bone); }
@media (hover: none), (pointer: coarse) { .cursor { display: none; } }

/* ---------- loader ---------- */
.loader {
  position: fixed; inset: 0; z-index: 200; background: var(--ink);
  display: flex; flex-direction: column; justify-content: space-between; padding: var(--pad);
}
.loader__top { display: flex; justify-content: space-between; color: var(--bone-dim); }
.loader__count { overflow: hidden; }
.loader__num {
  display: block; font-weight: 800; font-variation-settings: "wdth" 62;
  font-size: clamp(120px, 34vw, 520px); line-height: .8; letter-spacing: -.02em;
}
.loader__bar { height: 1px; background: var(--line); }
.loader__bar i { display: block; height: 100%; width: 0; background: var(--red); }

/* ---------- nav ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 18px var(--pad); mix-blend-mode: difference; color: #fff;
}
.nav__logo { font-weight: 800; font-variation-settings: "wdth" 125; letter-spacing: -.01em; font-size: 15px; }
.nav__logo sup { font-size: 8px; margin-left: 1px; }
.nav__links { display: flex; gap: clamp(16px, 2.6vw, 40px); }
.nav__links a { position: relative; }
.nav__links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .5s var(--ease); }
.nav__links a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav__right { display: flex; align-items: center; gap: 18px; }
.lang { display: flex; align-items: center; gap: 6px; }
.lang a { opacity: .5; transition: opacity .3s; }
.lang a.is-on, .lang a:hover { opacity: 1; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lang span { opacity: .4; }
.nav__reel { display: inline-flex; align-items: center; gap: 8px; border: 1px solid currentColor; border-radius: 99px; padding: 8px 14px; }
.dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: blink 1.4s infinite; }
@keyframes blink { 50% { opacity: .2; } }
@media (max-width: 760px) { .nav__links { display: none; } }

/* ---------- hero ---------- */
.hero { position: relative; height: 100svh; min-height: 560px; overflow: hidden; }
.hero__media { position: absolute; inset: 0; will-change: clip-path, transform; }
.hero__video { width: 100%; height: 100%; object-fit: cover; }
.hero__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,10,10,.45) 0%, rgba(10,10,10,0) 25%, rgba(10,10,10,0) 50%, rgba(10,10,10,.85) 100%); }

.hud { position: absolute; inset: 0; pointer-events: none; color: rgba(255,255,255,.85); }
.hud > span { position: absolute; }
.hud__tl { top: 76px; left: calc(var(--pad) + 22px); display: flex; align-items: center; gap: 8px; }
.hud__tr { top: 76px; right: calc(var(--pad) + 22px); }
.hud__bl { bottom: calc(var(--pad) + 4px); left: calc(var(--pad) + 22px); font-variant-numeric: tabular-nums; }
.hud__br { bottom: calc(var(--pad) + 4px); right: calc(var(--pad) + 22px); }
.rec { width: 8px; height: 8px; border-radius: 50%; background: var(--red); animation: blink 1s infinite; }
.hud__corner { width: 18px; height: 18px; border: 1px solid rgba(255,255,255,.7); }
.c1 { top: 64px; left: var(--pad); border-right: 0; border-bottom: 0; }
.c2 { top: 64px; right: var(--pad); border-left: 0; border-bottom: 0; }
.c3 { bottom: var(--pad); left: var(--pad); border-right: 0; border-top: 0; }
.c4 { bottom: var(--pad); right: var(--pad); border-left: 0; border-top: 0; }
@media (max-width: 760px) { .hud__br, .hud__tr { display: none; } }

.hero__content {
  position: absolute; left: 0; right: 0; bottom: calc(var(--pad) + 34px);
  padding: 0 var(--pad); display: flex; flex-direction: column; gap: 14px;
}
.hero__kicker { color: rgba(255,255,255,.85); }
.hero__title { margin: 0; line-height: .78; }
.hero__word {
  display: flex; justify-content: space-between; width: 100%;
  font-weight: 900; font-variation-settings: "wdth" 125;
  font-size: 13vw; letter-spacing: -.035em;
}
.hero__word > span { display: inline-block; will-change: transform; }
.hero__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.hero__lead { margin: 0; font-size: clamp(20px, 2.6vw, 38px); font-weight: 500; letter-spacing: -.02em; line-height: 1.05; max-width: 16ch; }
.hero__play { position: relative; width: 112px; height: 112px; flex: none; display: grid; place-items: center; }
.hero__play-ring { position: absolute; inset: 0; animation: spin 14s linear infinite; }
.hero__play-ring svg { width: 100%; height: 100%; overflow: visible; }
.hero__play-ring text { fill: var(--bone); font-family: var(--mono); font-size: 9.6px; letter-spacing: .14em; }
.hero__play-icon { width: 46px; height: 46px; border-radius: 50%; background: var(--red); display: grid; place-items: center; font-size: 14px; padding-left: 3px; transition: transform .5s var(--ease); }
.hero__play:hover .hero__play-icon { transform: scale(1.18); }
@keyframes spin { to { transform: rotate(360deg); } }
.hero__scroll { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 8px; color: rgba(255,255,255,.7); }
.hero__scroll i { width: 1px; height: 28px; background: rgba(255,255,255,.4); position: relative; overflow: hidden; }
.hero__scroll i::after { content: ""; position: absolute; left: 0; top: -100%; width: 100%; height: 100%; background: var(--bone); animation: drop 1.8s var(--ease) infinite; }
@keyframes drop { to { top: 100%; } }
@media (max-width: 760px) { .hero__play { width: 84px; height: 84px; } .hero__scroll { display: none; } }

/* ---------- marquee ---------- */
.marquee { border-block: 1px solid var(--line); overflow: hidden; padding: 18px 0; background: var(--ink); }
.marquee__track { display: flex; align-items: center; gap: 36px; width: max-content; will-change: transform; }
.marquee__track span { font-weight: 800; font-variation-settings: "wdth" 75; text-transform: uppercase; font-size: clamp(32px, 5vw, 76px); letter-spacing: -.01em; line-height: 1; }
.marquee__track span:nth-of-type(even) { font-family: var(--serif); font-style: italic; font-weight: 400; text-transform: none; font-variation-settings: normal; }
.marquee__track b { color: var(--red); font-size: clamp(20px, 2.4vw, 36px); }

/* ---------- common ---------- */
section { position: relative; }
.label { display: flex; gap: 10px; color: var(--bone-dim); margin: 0 0 28px; }
.label span { color: var(--red); }
.section-head { padding: 0 var(--pad); margin-bottom: clamp(40px, 6vw, 90px); }
.big-title { margin: 0; font-weight: 800; font-variation-settings: "wdth" 70; text-transform: uppercase; font-size: clamp(54px, 11vw, 190px); line-height: .86; letter-spacing: -.02em; }
.big-title em, .contact__title em { text-transform: none; font-size: 1.04em; letter-spacing: -.02em; }
.line { display: block; overflow: hidden; padding-bottom: .04em; }
.line > span { display: inline-block; will-change: transform; }

/* ---------- manifesto ---------- */
.manifesto { padding: clamp(100px, 16vw, 240px) var(--pad); display: grid; grid-template-columns: 1fr; }
.manifesto__text { margin: 0; font-size: clamp(28px, 4.4vw, 72px); line-height: 1.04; letter-spacing: -.03em; font-weight: 500; max-width: 22ch; }
.manifesto__text .w { opacity: .14; transition: none; }
.manifesto__stack { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 56px; }
.manifesto__stack span { border: 1px solid var(--line); border-radius: 99px; padding: 9px 16px; color: var(--bone-dim); }

/* ---------- services ---------- */
.services { padding: clamp(60px, 8vw, 120px) 0 clamp(80px, 10vw, 160px); }
.services__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.svc { border-bottom: 1px solid var(--line); position: relative; }
.svc__row {
  display: grid; grid-template-columns: 70px 1fr minmax(0, 360px); gap: 24px; align-items: center;
  padding: clamp(22px, 3vw, 38px) var(--pad); position: relative; z-index: 1;
}
.svc::before { content: ""; position: absolute; inset: 0; background: var(--bone); transform: scaleY(0); transform-origin: bottom; transition: transform .6s var(--ease); }
.svc:hover::before { transform: scaleY(1); transform-origin: top; }
.svc:hover .svc__row { color: var(--ink); }
.svc:hover .svc__text, .svc:hover .svc__n { color: rgba(10,10,10,.7); }
.svc:hover .svc__tags span { border-color: rgba(10,10,10,.25); }
.svc__n { color: var(--bone-dim); transition: color .4s; }
.svc__title { margin: 0; font-weight: 800; font-variation-settings: "wdth" 70; text-transform: uppercase; font-size: clamp(34px, 6vw, 104px); line-height: .9; letter-spacing: -.02em; transition: transform .6s var(--ease); }
.svc:hover .svc__title { transform: translateX(14px); }
.svc__text { margin: 0 0 14px; color: var(--bone-dim); font-size: 15px; transition: color .4s; }
.svc__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.svc__tags span { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; border: 1px solid var(--line); border-radius: 99px; padding: 5px 10px; transition: border-color .4s; }
.svc__img { display: none; }
.services__preview {
  position: fixed; left: 0; top: 0; z-index: 40; pointer-events: none;
  width: clamp(280px, 28vw, 440px); aspect-ratio: 16 / 10; margin: 0; translate: -50% -50%;
  overflow: hidden; clip-path: inset(50% 50% 50% 50%); transition: clip-path .6s var(--ease);
}
.services__preview.is-on { clip-path: inset(0 0 0 0); }
.services__preview-inner { position: absolute; inset: 0; }
.services__preview img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.15); transition: opacity .4s, transform 1s var(--ease); }
.services__preview img.is-on { opacity: 1; transform: scale(1); }
@media (max-width: 900px) {
  .svc__row { grid-template-columns: 1fr; gap: 12px; }
  .svc__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; margin-top: 8px; }
  .svc__img img { width: 100%; height: 100%; object-fit: cover; }
  .services__preview { display: none; }
}
@media (hover: none) { .services__preview { display: none; } .svc::before { display: none; } }

/* ---------- reel block ---------- */
.reelblock { padding: 0 var(--pad) clamp(80px, 10vw, 160px); }
.reelblock__frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink-2); cursor: pointer; clip-path: inset(12% 18% 12% 18%); will-change: clip-path; }
.reelblock__video { width: 100%; height: 100%; object-fit: cover; transform: scale(1.25); will-change: transform; }
.reelblock__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: clamp(16px, 2.4vw, 32px); background: rgba(10,10,10,.25); }
.reelblock__overlay .mono { align-self: stretch; text-align: center; }
.reelblock__title { font-weight: 900; font-variation-settings: "wdth" 125; text-transform: uppercase; font-size: clamp(56px, 13vw, 240px); line-height: .8; letter-spacing: -.04em; mix-blend-mode: difference; }
.reelblock__title em { text-transform: none; font-weight: 400; }

/* ---------- work ---------- */
.work { padding: 0 0 clamp(80px, 10vw, 160px); }
.work__grid { display: grid; grid-auto-flow: dense; grid-template-columns: repeat(2, 1fr); gap: clamp(16px, 2vw, 28px); padding: 0 var(--pad); }
.card { display: block; cursor: pointer; }
.card--wide { grid-column: span 2; }
.card[hidden] { display: none; }
.card__media { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: var(--ink-2); }
.card--wide .card__media { aspect-ratio: 21 / 9; }
.card__time { position: absolute; right: 12px; bottom: 12px; padding: 5px 9px; background: rgba(10,10,10,.6); backdrop-filter: blur(6px); border-radius: 99px; }
.card__media::after { content: ""; position: absolute; inset: 0; border: 1px solid transparent; transition: border-color .4s; }
.card:focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }
.card__media img, .card__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), opacity .5s; }
.card__media video { opacity: 0; }
.card.is-playing .card__media video { opacity: 1; }
.card:hover .card__media img, .card:hover .card__media video { transform: scale(1.04); }
.card__meta { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-top: 14px; border-bottom: 1px solid var(--line); padding-bottom: 14px; }
.card__title { margin: 0; font-weight: 700; font-variation-settings: "wdth" 80; text-transform: uppercase; font-size: clamp(22px, 2.6vw, 40px); letter-spacing: -.01em; line-height: 1; }
.card__kind { color: var(--bone-dim); }
.work__soon { grid-column: 1 / -1; color: var(--bone-dim); border: 1px dashed var(--line); padding: 28px; text-align: center; }
@media (max-width: 760px) { .work__grid { grid-template-columns: 1fr; } .card--wide { grid-column: auto; } .card--wide .card__media { aspect-ratio: 16 / 9; } }
.work__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; max-width: 560px; justify-content: flex-end; }
.filters button { border: 1px solid var(--line); border-radius: 99px; padding: 9px 14px; color: var(--bone-dim); transition: background .3s, color .3s, border-color .3s; }
.filters button sup { font-size: 8px; margin-left: 4px; opacity: .7; }
.filters button:hover { color: var(--bone); border-color: var(--bone-dim); }
.filters button.is-on { background: var(--bone); color: var(--ink); border-color: var(--bone); }
@media (max-width: 760px) { .filters { justify-content: flex-start; } }

/* ---------- archive (horizontal) ---------- */
.archive { background: var(--bone); color: var(--ink); }
.archive .label { color: rgba(10,10,10,.55); }
.archive__pin { height: 100svh; display: flex; align-items: center; overflow: hidden; position: relative; }
.archive__head { position: absolute; top: clamp(80px, 10vh, 120px); left: var(--pad); right: var(--pad); display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; z-index: 2; pointer-events: none; }
.archive__head .label { margin: 0; }
.archive__title { margin: 0; font-weight: 800; font-variation-settings: "wdth" 70; text-transform: uppercase; font-size: clamp(28px, 4.2vw, 68px); line-height: .9; letter-spacing: -.02em; text-align: center; }
.archive__title em { text-transform: none; }
.archive__count { font-variant-numeric: tabular-nums; }
.archive__track { display: flex; align-items: flex-end; gap: clamp(14px, 2vw, 28px); padding: 0 var(--pad); margin-top: 14vh; will-change: transform; }
.ph { flex: none; margin: 0; }
.ph__img { overflow: hidden; background: #d8d1c5; }
.ph__img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); will-change: transform; }
.ph--v .ph__img { height: 54vh; aspect-ratio: 3 / 4; }
.ph--h .ph__img { height: 40vh; aspect-ratio: 3 / 2; }
.ph figcaption { display: flex; justify-content: space-between; gap: 12px; padding-top: 10px; font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: rgba(10,10,10,.65); }
@media (max-width: 760px) {
  .archive__head { flex-direction: column; align-items: flex-start; gap: 12px; }
  .archive__title { text-align: left; }
  .archive__track { margin-top: 24vh; }
  .ph--v .ph__img { height: 46vh; }
  .ph--h .ph__img { height: 30vh; }
}

/* ---------- process ---------- */
.process { padding: clamp(100px, 14vw, 220px) 0; }
.process__grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); margin: 0 var(--pad); }
.step { padding: 26px 22px 0 0; border-right: 1px solid var(--line); margin-right: 22px; min-height: 280px; display: flex; flex-direction: column; justify-content: space-between; }
.step:last-child { border-right: 0; }
.step__n { font-weight: 900; font-variation-settings: "wdth" 62; font-size: clamp(64px, 8vw, 140px); line-height: .8; color: transparent; -webkit-text-stroke: 1px var(--bone-dim); }
.step__t { margin: 22px 0 10px; font-weight: 700; font-variation-settings: "wdth" 80; text-transform: uppercase; font-size: 24px; letter-spacing: -.01em; }
.step__d { margin: 0; color: var(--bone-dim); font-size: 15px; max-width: 34ch; }
@media (max-width: 900px) { .process__grid { grid-template-columns: 1fr 1fr; } .step { border-right: 0; margin-right: 0; padding-right: 0; border-bottom: 1px solid var(--line); padding-bottom: 26px; min-height: 0; } .step:nth-child(odd) { padding-right: 16px; } }
@media (max-width: 560px) { .process__grid { grid-template-columns: 1fr; } }

/* ---------- wall ---------- */
.wall { height: 150svh; overflow: hidden; position: relative; }
.wall__cols { position: absolute; inset: -20% -4%; display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; transform: rotate(-6deg); }
.wall__col { display: flex; flex-direction: column; gap: 14px; will-change: transform; }
.wall__col img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; filter: grayscale(.2) brightness(.62); }
.wall__col img.h { aspect-ratio: 3 / 2; }
.wall__center { position: sticky; top: 0; height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 18px; padding: 0 var(--pad); z-index: 2; pointer-events: none; }
.wall__center h2 { margin: 0; font-weight: 900; font-variation-settings: "wdth" 125; text-transform: uppercase; font-size: clamp(48px, 10vw, 180px); line-height: .82; letter-spacing: -.04em; text-shadow: 0 10px 60px rgba(0,0,0,.5); }
.wall__center h2 em { text-transform: none; color: var(--red); }
@media (max-width: 760px) { .wall__cols { grid-template-columns: repeat(3, 1fr); } .wall__col:nth-child(n+4) { display: none; } }

/* ---------- contact ---------- */
.contact { padding: clamp(100px, 14vw, 220px) var(--pad) clamp(80px, 10vw, 140px); }
.contact__title { margin: 0 0 clamp(40px, 6vw, 80px); font-weight: 800; font-variation-settings: "wdth" 70; text-transform: uppercase; font-size: clamp(64px, 15vw, 280px); line-height: .84; letter-spacing: -.03em; }
.contact__title em { color: var(--red); }
.contact__mail { display: inline-flex; align-items: center; gap: clamp(12px, 2vw, 28px); font-size: clamp(26px, 5.4vw, 92px); font-weight: 500; letter-spacing: -.03em; border-bottom: 2px solid var(--bone); padding-bottom: 6px; max-width: 100%; }
.contact__mail-text { overflow-wrap: anywhere; }
.contact__arrow { display: inline-block; color: var(--red); transition: transform .6s var(--ease); }
.contact__mail:hover .contact__arrow { transform: rotate(45deg); }
.contact__copy { display: block; margin-top: 18px; color: var(--bone-dim); }
.contact__copy:hover { color: var(--bone); }
.contact__social { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 56px; }
.contact__social a { border: 1px solid var(--line); border-radius: 99px; padding: 12px 20px; transition: background .3s, color .3s; }
.contact__social a:hover { background: var(--bone); color: var(--ink); }

/* ---------- footer ---------- */
.footer { padding: 0 var(--pad) 24px; overflow: hidden; }
.footer__big { font-family: var(--display); font-weight: 900; font-variation-settings: "wdth" 125; font-size: 13vw; line-height: .78; letter-spacing: -.04em; text-transform: none; color: var(--red); margin: 0 0 18px; white-space: nowrap; }
.footer__row { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; color: var(--bone-dim); border-top: 1px solid var(--line); padding-top: 18px; }
.footer a:hover { color: var(--bone); }

/* ---------- player ---------- */
.player { position: fixed; inset: 0; z-index: 150; background: rgba(5,5,5,.96); display: grid; place-items: center; padding: var(--pad); }
.player[hidden] { display: none; }
.player { grid-template-rows: auto 1fr; align-content: center; gap: 16px; }
.player__bar { width: min(100%, 1600px); display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.player__info { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.player__title { font-weight: 800; font-variation-settings: "wdth" 80; text-transform: uppercase; font-size: clamp(20px, 2.4vw, 34px); letter-spacing: -.01em; }
.player__kind { color: var(--bone-dim); }
.player__video { width: min(100%, 1600px); max-height: 80svh; background: #000; }
.player__close { flex: none; border: 1px solid var(--line); border-radius: 99px; padding: 9px 16px; }
.player__close:hover { background: var(--bone); color: var(--ink); }

/* ---------- sin animaciones (movimiento reducido o sin JS de animación) ---------- */
.static .archive__pin { height: auto; display: block; padding: clamp(80px, 10vh, 120px) 0 60px; }
.static .archive__head { position: static; margin: 0 var(--pad) 40px; }
.static .archive__track { overflow-x: auto; margin-top: 0; padding-bottom: 24px; }
.static .reelblock__frame { clip-path: none; }
.static .reelblock__video { transform: none; }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .grain, .hero__play-ring, .dot, .rec, .hero__scroll i::after { animation: none; }
  .reelblock__frame { clip-path: none; }
  .reelblock__video { transform: none; }
  .manifesto__text .w { opacity: 1; }
}