/* === BASE & ROOT === */
* {box-sizing: border-box; padding: 0; margin: 0; -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
:root { --background-rgb: 0 0 0; --blue-rgb: 0 0 0; --primary-rgb: 50 50 50; }

body, html { width: 100vw; min-height: 100vh; overflow-x: hidden; overflow-y: auto; margin: 0; font-family:'Audemars', 'Darkella', "Inter", sans-serif; color: #000;background-color: transparent;}

a {text-decoration: none;}
@font-face { font-family:'Black'; src:url('./assets/BlackFlag.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Darkella'; src:url('./assets/Darkella\ Demo.otf') format('opentype'); font-display:swap; }
@font-face { font-family:'Audemars'; src:url('./assets/JHCAudemars-Medium.otf') format('opentype'); font-display:swap; }


#grid-bg { position: fixed; inset: 0; z-index: -1; pointer-events: none; }

.circleII {height: 24px; width: 24px; border-radius: 24px; background-color: black;position: fixed;top: 0; left: 0; pointer-events: none; z-index: 100; /* so that it stays on top of all other elements */} 
@media (max-width: 1000px) {.circleII{display: none;}}

/* === MAIN CONTAINER === */
.lp { position: relative; width: 100vw; height: 100vh; z-index: 10; display: flex; align-items: center; justify-content: center; overflow: hidden !important;}
.hero-title {position:absolute;top:2%;left:50%;transform:translate(-50%,0%); font-family:'Black','Audemars','Darkella',"Inter",sans-serif;font-size:3rem;}
.hero-title::before{content:'';position:absolute;z-index:-1;top:40%;bottom:40%;left:-.25em;right:-.25em;background:#fffb00;transform-origin: center left;transform: scaleX(var(--hero-reveal, 0));transition:transform .33s ease-in-out;}
.skull { position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); transform: scale(1.4);}
.hero-image-wrap{position:absolute;width:37vw;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;perspective:2000px;z-index:1; -webkit-mask-image: linear-gradient( to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100% ); mask-image: linear-gradient( to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100% );}
.hero-image{width:100%;height:100%;object-fit:cover;opacity:1;transform-style:preserve-3d;}
.informant-tv{position:absolute;left:50%;top:40%; transform:translate(-50%, -50%) rotate(0deg);z-index:0;width:min(36vw,550px);aspect-ratio:1.45 / 1;background:#080808;background:transparent;/*border:4px solid #000;box-shadow:12px 12px 0 #fff,0 0 0 2px #fff;*/padding:14px;overflow:visible;font-family:"Audemars","Inter",sans-serif;pointer-events:none;}
.tv-screen{position:relative;width:100%;height:calc(100% - 54px);overflow:hidden;background:radial-gradient(ellipse at center,#292929 0%,#111 55%,#050505 100%);border:3px solid #222;border-radius:12px / 8px;box-shadow:inset 0 0 25px rgba(0,0,0,.9),inset 0 0 5px rgba(255,255,255,.15);isolation:isolate;}
.tv-screen::before{content:"";position:absolute;inset:-2px;z-index:10;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 35px rgba(0,0,0,.9),inset 0 0 10px rgba(255,255,255,.08);background:linear-gradient(90deg,rgba(255,255,255,.04),transparent 12%,transparent 88%,rgba(255,255,255,.04));}
.tv-scanlines{position:absolute;inset:0;z-index:8;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.07) 0px,rgba(255,255,255,.07) 1px,transparent 1px,transparent 4px);mix-blend-mode:screen;opacity:.5;}
.tv-noise{position:absolute;inset:-50%;z-index:7;pointer-events:none;opacity:.06;background-image:repeating-radial-gradient(circle at 0 0,#fff 0,#fff 1px,transparent 1px,transparent 3px);background-size:4px 4px;animation:tvNoise .15s steps(2) infinite;}
@keyframes tvNoise{ 0%{transform:translate(0,0);} 25%{transform:translate(-2%,3%);} 50%{transform:translate(3%,-2%);} 75%{transform:translate(-3%,-1%);} 100%{transform:translate(2%,2%);} }
.tv-vignette{position:absolute;inset:0;z-index:9;pointer-events:none;background:radial-gradient(ellipse at center,transparent 45%,rgba(0,0,0,.3) 75%,rgba(0,0,0,.8) 100%);}
.tv-broadcast{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fffb00;text-shadow:0 0 4px rgba(255,251,0,.5);animation:tvFlicker 5s infinite;}
@keyframes tvFlicker{ 0%,92%,100%{opacity:1;} 93%{opacity:.7;} 94%{opacity:1;} 96%{opacity:.85;} 97%{opacity:1;} }
.tv-corner{position:absolute;display:flex;flex-direction:column;gap:3px;font-family:"Inter",sans-serif;font-size:7px;line-height:1.2;letter-spacing:.14em;opacity:.8;}
.tv-corner-tl{top:15px;left:18px;}
.tv-corner-br{right:18px;bottom:32px;align-items:flex-end;}
.tv-center{display:flex;flex-direction:column;align-items:center;text-align:center;transform:scale(.9);}
.tv-eyebrow{font-family:"Inter",sans-serif;font-size:8px;letter-spacing:.3em;margin-bottom:8px;}
.tv-main-title{font-family:"Black","Audemars",sans-serif;font-size:clamp(2rem,4vw,5rem);line-height:.78;letter-spacing:-.02em;}
.tv-line{width:90px;height:2px;margin:14px 0 10px;background:#fffb00;box-shadow:0 0 8px #fffb00;}
.tv-subtitle{font-family:"Inter",sans-serif;font-size:7px;letter-spacing:.18em;}
.tv-ticker{position:absolute;left:0;bottom:0;width:100%;overflow:hidden;height:20px;display:flex;align-items:center;background:#fffb00;color:#000;font-family:"Inter",sans-serif;font-size:7px;letter-spacing:.15em;}
.tv-ticker span{white-space:nowrap;animation:tvTicker 18s linear infinite;}
@keyframes tvTicker{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
/* =========================================================
   MOBILE
========================================================= */
@media(max-width:1000px){
   .skull {top:50%;}
   .hero-image-wrap{width:150vw;top:50%;}
   .informant-tv{width:98vw;left:50%;top:45%;}
}

/* =========================
   EDITORIAL META SYSTEM
========================= */
.editorial-meta,.editorial-side,.editorial-description,.editorial-bottom{position:absolute;z-index:20;font-family:"Inter",sans-serif;color:#111;pointer-events:none;text-transform:uppercase;}
.editorial-top-left{top:3%;left:3%;display:flex;flex-direction:column;gap:3px;font-size:10px;line-height:1.2;letter-spacing:.12em;}
.editorial-top-left span:first-child{font-family:"Audemars","Inter",sans-serif;font-size:15px;}
.editorial-top-right{top:3%;right:3%;display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:10px;line-height:1.2;letter-spacing:.12em;}
.editorial-top-right span:first-child{font-family:"Audemars","Inter",sans-serif;font-size:15px;}
.editorial-left{left:3%;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:7px;font-size:9px;letter-spacing:.16em;opacity:.65;}
.editorial-left span:first-child{font-family:"Audemars","Inter",sans-serif;font-size:15px;opacity:1;}
.editorial-left span:first-child{position:relative;z-index:1;width:fit-content;}
.editorial-left span:first-child::before{content:"";position:absolute;z-index:-1;left:-4px;right:-4px;top:35%;bottom:20%;background:#fffb00;}
.editorial-right{right:3%;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-end;gap:5px;font-size:9px;letter-spacing:.16em;opacity:.65;}
.editorial-right span:first-child{font-family:"Audemars","Inter",sans-serif;color:#111;font-size:15px;}
.editorial-description{left:3%;bottom:15%;font-family:"Inter",sans-serif;font-size:10px;line-height:1.45;letter-spacing:.04em;text-transform:none;opacity:.75;}
.editorial-description p{margin:0;}
.editorial-bottom{left:50%;bottom:12%;transform:translateX(-50%);width:94%;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:.16em;opacity:.5;}
.editorial-bottom::before{content:"";position:absolute;left:0;right:0;top:-10px;height:1px;background:#111;opacity:.2;}
@media(max-width:1000px){
.editorial-top-left,.editorial-top-right{font-size:8px;top:15%;}
.editorial-left,.editorial-right{display:none;}
.editorial-description{left:5%;bottom:13%;font-size:8px;}
.editorial-bottom{width:90%;font-size:7px;bottom:10%;}

}
/* ================= MARQUEE CONTAINER ================= */
.marquee-container { position: absolute; display: flex; align-items: center; bottom: 0; left: 0; z-index: 1; width: 100vw; overflow: hidden; background-color: #fffb00; opacity: 0; /*backdrop-filter: blur(10px);*/ border-bottom: 2px solid #fffb00; transform: translateY(200px); } /* Main marquee wrapper */
.marquee-content { display: flex; flex-direction: row; flex-wrap: nowrap; white-space: nowrap; will-change: transform; } /* Moving marquee track */
.marquee-content span { display: block; padding: 0 40px; color: black; flex-shrink: 0; } /* Individual marquee item */
.ms {font-size: 4rem;font-family: 'Audemars', 'Darkella', "Inter", sans-serif;font-weight: lighter; text-transform: initial;}
.BF {font-family: 'Black','Audemars', 'Darkella', "Inter", sans-serif; font-size: 3rem; text-transform: initial;}
@media (max-width: 1000px) { .ms {font-size: 3rem;} .BF {font-size: 2rem;} }

/* === CONTENT SECTION === */
.content-section { position: relative;width: 100%;padding: 10vh 2vw; display: flex;flex-direction: column;align-items: center; background: transparent; z-index: 20; overflow: hidden !important; }
.content-wrapper { max-width: 2000px; margin: 0 auto; color: #000; animation: contentBreath 6s ease-in-out infinite; }
@keyframes contentBreath { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.01); } }

.mt {position: relative;width: fit-content; margin-top: 10px; color:#000;text-align:center;font-family: 'Black', 'Audemars', 'Darkella', "Inter", sans-serif;font-size:8rem;font-weight:lighter;}
.content-marquee { display: flex;align-items: center; position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width: 100%;height:min-content; overflow: hidden; pointer-events: none; z-index: 1;  background-color: #fffb00; border: 2px solid #fffb00;}
.content-marquee-track {  display: flex;align-items: center; white-space: nowrap; animation: contentMarquee 40s linear infinite;}
.content-marquee span { font-family: 'Audemars', 'Darkella', "Inter", sans-serif; font-size: 2rem; line-height: 1; color: rgb(0, 0, 0); letter-spacing: 10px; }
@keyframes contentMarquee { from { transform: translateX(0%); } to { transform: translateX(-50%); } }
@media (max-width: 1000px) {.mt{font-size: 3rem;} .content-marquee span{font-size: 1rem;}}

/* === INVERSION LENS === */
.inversion-lens{position:relative; /*top:50%;left:50%;transform:translate(-50%,-50%);*/ left: 0; width:100%; height: 88vh; object-fit:cover;overflow:hidden;border:4px solid transparent;box-shadow:0 0 0 2px #fff;backdrop-filter:blur(8px);border-radius:0px;}
.inversion-lens img{display:none; pointer-events: none;}
.story { font-size: 5.5rem; line-height: 1.3; text-align: center;  color: #000; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; gap: 10px; position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-user-drag: none;}
@media (orientation: portrait) {.rotate-on-portrait {transform: rotate(90deg); transform-origin: center center;}}
@media screen and (max-width:2000px){ .story { font-size: 4.2rem;} .chaos { font-size: 4.8rem; line-height: 1.1; } }
@media screen and (max-width:1500px){ .chaos { font-size: 4.8rem; line-height: .6; } }
@media screen and (max-width:1000px){ .story { font-size: 1.8rem;} .chaos { font-size: 3rem; line-height: .6; } }
@media (max-width: 500px) and (max-height: 800px) { .chaos { font-size: 2.5rem; line-height: .6; } }

/* === CARDS === */
.cards {position:relative;width:100vw; min-height:100vh; overflow-x: hidden !important;}
h1{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;text-align:center;font-size:5vw;font-weight:lighter;line-height:100%;}
.card{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20vw;aspect-ratio: 1/1;height:auto;perspective:1000px;}
.card p{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%; text-align:center;font-size:4rem;font-weight:600;font-family: 'Audemars', 'Darkella', "Inter", sans-serif;line-height:1;letter-spacing:4px; mix-blend-mode:overlay; }
.card-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;animation:floating 3s infinite ease-in-out;}
#card-1 .card-wrapper{animation-delay:0;}
#card-2 .card-wrapper{animation-delay:.2s;}
#card-3 .card-wrapper{animation-delay:.4s;}
#card-4 .card-wrapper{animation-delay:.6s;}
.flip-card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;}
.flip-card-front,.flip-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;border:1px solid #fff;border-radius:0em;overflow:hidden;}
.flip-card-front img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); pointer-events:none; height: 100%;}
.flip-card-back{background-color:#000;transform:rotateY(180deg);overflow:hidden;}
.fcbttl {position:absolute;width:96%;height:88%;top:46%;left:50%;transform:translate(-50%,-50%);background-color:#fff;padding:.2em;}
.fcbttl img{width:100%;height:100%;object-fit:cover;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.flip-card-back span {color:#fff;text-align: left;font-size: 1.5rem;letter-spacing: 2px;text-transform: uppercase; position:absolute;width:96%;height:10%;top:97%;left:50%;transform:translate(-50%,-50%);}
@keyframes floating{0%{transform:translate(-50%,-50%);}50%{transform:translate(-50%,-60%);}100%{transform:translate(-50%,-50%);}}
html.lenis,html.lenis body{height:auto;}
.lenis.lenis-smooth{scroll-behavior:auto!important;}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain;}
.lenis.lenis-stopped{overflow:hidden;}
.lenis.lenis-smooth iframe{pointer-events:none;}
/*@media (max-width: 1000px) {.card{width:20vw;aspect-ratio: 1/5;} .card p {font-size: 1rem;} .flip-card-back span {font-size: 1rem;}}*/
@media (max-width: 1000px) {
    .cards { width: 100vw; height: 120vh; min-height: 100vh; overflow: hidden !important; }
    .card { width: 58vw; max-width: 280px; aspect-ratio: 1 / 1; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    .card p { font-size: 1.2rem; line-height: .95; }
    .flip-card-back span { font-size: .8rem; letter-spacing: 1.5px; }
    .fcbttl { padding: .7em; }
    .flip-card-front, .flip-card-back { border-width: 1px; }
}

/* ================= WORK SECTION ================= */
.work-section { position: relative; width: 100%; padding: 0vh 0vw; display: flex;flex-direction: column;align-items: center; -webkit-mask-image: linear-gradient( to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,.5) 66%, rgba(0,0,0,0) 100% ); mask-image: linear-gradient( to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,.5) 66%, rgba(0,0,0,0) 100% );}
.wt {top:-10%;}
@media (max-width: 1000px) {.wt {top:-12%;}}
/* ================= BLOCK ================= */
.block {padding: 2rem 2rem 2rem 2rem; display: flex; justify-content: space-between; align-items: center; width: 90vw; height: fit-content; background:#fff;border:2px solid #000;box-shadow:6px 6px 0 #000;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1); } /* Main block row */
.block:hover{/*transform:translate(-6px,-6px);*/box-shadow:14px 14px 0 #000;}
.block__title, .block a { position: relative; font-size: 5rem; margin: 0 0 0 0; padding: 0; cursor: pointer; font-family: 'Audemars', 'Darkella', "Inter", sans-serif; font-weight: lighter; color: #000; text-align: center; line-height: 1; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } /* Heading and links */
.block__title::before{content:'';position:absolute;z-index:-1;top:35%;bottom:35%;left:-.25em;right:-.25em;background:#fffb00;transform-origin:center right;transform:scaleX(0);transition:transform .33s ease-in-out;}
.block__title:hover::before{transform:scaleX(1);transform-origin:center left;}
.PLAY { position: relative; display: inline-block; font-size: 4rem; font-weight: bold; color: #000; text-decoration: none; overflow: hidden; } /* Play button style */
.block__title:hover { color: #000; } /* Maintain title color on hover */
.block__title span { display: inline-block; white-space: pre; } /* Individual animated characters */
.block[data-fx="6"] a::after, a.content__text-link[data-fx="6"]::after { content: ''; z-index: -1; width: 100%; bottom: .25rem; left: 0; position: absolute; height: 2px; background: currentColor; transform: scale3d(0,1,1); transform-origin: 100% 50%; transition: transform .7s cubic-bezier(.860,0,.070,1); } /* Animated underline */
a.content__text-link[data-fx="6"]::after { bottom: 0; } /* Text-link underline position */
.block[data-fx="6"] a:hover::after, a.content__text-link[data-fx="6"]:hover::after { transform: scale3d(1,1,1); } /* Reveal underline */
.hover-reveal { position: fixed; width: 250px;aspect-ratio: 4/5;height: auto; top: 0; left: 0; pointer-events: none; opacity: 0; } /* Floating preview container */
.hover-reveal__inner, .hover-reveal__img { width: 100%; height: 100%; position: relative; } /* Preview wrappers */
.hover-reveal__deco { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #000; } /* Background layer */
.hover-reveal__img { background-size: cover; background-position: 50% 50%; } /* Preview image */
.visit-btn { display: flex; align-items: center; gap: 12px; padding: 2px 18px; background: transparent; border: 1px solid rgba(0, 0, 0, 0); color: #000; cursor: pointer; position: relative; transition: 0.3s ease; cursor: not-allowed;}
.visit-btn:hover { transform: translateY(-2px); }
.text { font-family: 'Audemars', 'Darkella', "Inter", sans-serif; font-size: 3rem; letter-spacing: 1px; }
.arrows { display: flex; gap: 3px; }
.arrow { width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 10px solid #000; opacity: 0.3; transform-origin: center; animation: pulseArrow 1.2s infinite; }
.arrow:nth-child(2) { animation-delay: 0.15s; }
.arrow:nth-child(3) { animation-delay: 0.3s; }
@keyframes pulseArrow { 0% { opacity: 0.2; transform: translateX(0) scale(1); } 50% { opacity: 1; transform: translateX(4px) scale(1.1); } 100% { opacity: 0.2; transform: translateX(0) scale(1); } }
.visit-btn::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: linear-gradient(90deg, transparent, Black, transparent); transform: translateX(-120%); transition: 0.6s ease; }
.visit-btn:hover::after { transform: translateX(120%); }
/* ================= DESKTOP LAYOUT ================= */
@media screen and (min-width:53em){
  .block { align-items: center; } /* Center block content */
  .content { position: relative; display: flex; flex-direction: column; justify-content: start; align-items: center; gap: 20px; margin: 0 auto; padding-top: 0vh; min-width: 80vw; height: fit-content; text-align: left; } /* Content wrapper */
}
/* ================= MOBILE HOVER REVEAL ================= */
@media (max-width:1000px){
  .hover-reveal { left: 50% !important; transform: translateX(-50%) !important; top: auto !important; bottom: 20px !important; position: fixed !important; } /* Center preview on mobile */
}
/* ================= SMALL DEVICES ================= */
@media only screen and (max-device-width:1000px){
  .title { font-size: .5rem; } /* Small title */
  .block { flex-direction: column; margin-top: 2vh;} /* Stack block content */
  .block__title { font-size: 5rem; } /* Smaller heading */
  .block__title::before {display: none;}
  .block a { font-size: 2.5rem; } /* Smaller link */
  .content { padding-top: 0vh; } /* Reset spacing */
  .text {font-size: 2rem;}
}

/* =========================================================
   ARCHIVE
========================================================= */
.archive-section{position:relative;width:100vw;min-height:100vh;padding:0;display:flex;flex-direction:column;align-items:center;overflow:hidden;}
.editorial-walls{position:absolute;top:66%;left:50%;transform:translate(-50%,-50%);display:flex;gap:2vw;max-width:90vw;padding: 2rem;}
.informant-bg-text{position:absolute;width:120vw;pointer-events:none;color:#000;opacity:.2;z-index:-1;}
.editorial-wall{position:relative;display:flex;flex-direction:column;width:fit-content;}
.informant-bg-text span{display:inline-block;white-space:nowrap;font-family:"Audemars",sans-serif;font-size:clamp(1rem,2vw,2.2rem);line-height:1.2;letter-spacing:.25em;text-transform:uppercase;}
.archive-monument{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90vw;height:100%;min-height:500px;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.archive-index{position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);font-family:"Black","Audemars",sans-serif;font-size:clamp(18rem,42vw,48rem);line-height:.7;letter-spacing:-.08em;color:#000;opacity:.035;pointer-events:none;user-select:none;}
.archive-statement{position:relative;z-index:2;width:90vw;display:flex;flex-direction:column;align-items:center;text-align:center;line-height:.72;transform:translateY(2vh);}
/* =========================================================
   ARCHIVE BILLBOARD
========================================================= */
.archive-billboard{position:relative;width:min(86vw,1250px);transform:rotate(-1.2deg);z-index:3;background:#050505;padding:8px;box-shadow:18px 18px 0 rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.8);}
.billboard-topline,.billboard-bottomline{height:24px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#fffb00;font-family:"Inter",sans-serif;font-size:7px;letter-spacing:.18em;text-transform:uppercase;}
.billboard-topline{border-bottom:1px solid rgba(255,251,0,.25);}
.billboard-bottomline{border-top:1px solid rgba(255,251,0,.25);}
.billboard-screen{position:relative;height:clamp(190px,20vw,300px);overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#292900 0%,#101000 45%,#050505 100%);border:1px solid rgba(255,251,0,.25);}
.billboard-content{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;text-align:center;color:#fffb00;animation:billboardFlicker 7s infinite;}
.billboard-label{font-family:"Inter",sans-serif;font-size:8px;letter-spacing:.5em;margin-bottom:18px;opacity:.75;}
.billboard-message{display:flex;align-items:center;justify-content:center;gap:.5em;font-family:"Black","Audemars",sans-serif;font-size:2rem;line-height:.75;letter-spacing:-.06em;padding: 2rem; white-space:nowrap;text-shadow:0 0 8px rgba(255,251,0,.25),0 0 30px rgba(255,251,0,.08);animation:billboardGlitch 9s infinite;}
.billboard-message span:nth-child(1){animation:billboardWord 8s infinite;}
.billboard-message span:nth-child(2){animation:billboardWord 8s .2s infinite;}
.billboard-message span:nth-child(3){animation:billboardWord 8s .4s infinite;}
.billboard-message span:nth-child(4){animation:billboardWord 8s .6s infinite;}
.billboard-sub{margin-top:25px;font-family:"Inter",sans-serif;font-size:7px;letter-spacing:.35em;opacity:.7;}
.billboard-scan{position:absolute;left:0;right:0;height:2px;background:#fffb00;opacity:.35;box-shadow:0 0 12px #fffb00,0 0 30px #fffb00;z-index:5;animation:billboardScan 4s linear infinite;}
@keyframes billboardScan{0%{top:-5%;}100%{top:105%;}}
.billboard-noise{position:absolute;inset:-50%;z-index:3;pointer-events:none;opacity:.08;background-image:repeating-radial-gradient(circle at 0 0,#fffb00 0,#fffb00 1px,transparent 1px,transparent 4px);background-size:5px 5px;animation:billboardNoise .15s steps(2) infinite;}
@keyframes billboardNoise{0%{transform:translate(0,0);}25%{transform:translate(-2%,3%);}50%{transform:translate(3%,-2%);}75%{transform:translate(-3%,-1%);}100%{transform:translate(2%,2%);}}
.billboard-corner{position:absolute;z-index:6;color:#fffb00;font-family:"Inter",sans-serif;font-size:6px;letter-spacing:.15em;opacity:.65;}
.billboard-corner-tl{top:12px;left:14px;}
.billboard-corner-tr{top:12px;right:14px;}
.billboard-corner-bl{bottom:12px;left:14px;}
.billboard-corner-br{bottom:12px;right:14px;}
@keyframes billboardFlicker{0%,88%,100%{opacity:1;}89%{opacity:.65;}90%{opacity:1;}93%{opacity:.8;}94%{opacity:1;}}
@keyframes billboardGlitch{0%,86%,100%{transform:translateX(0);}87%{transform:translateX(-5px);}88%{transform:translateX(4px);}89%{transform:translateX(-2px);}90%{transform:translateX(0);}}
@keyframes billboardWord{0%,92%,100%{opacity:1;}93%{opacity:.2;}94%{opacity:1;}}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width:1000px){
  .archive-monument{height:100vh;min-height:350px;}
  .archive-billboard{width:94vw;transform:rotate(-.7deg);}
  .billboard-screen{height:50vh;}
  .billboard-message{font-size:8vw;line-height: 1.5; gap:.15em;flex-wrap: wrap;}
  .billboard-sub{font-size:5px;letter-spacing:.2em;}
  .billboard-topline,.billboard-bottomline{font-size:5px;}
  .billboard-progress i{width:6px;}
  .billboard-meta{font-size:5px;}
}
.archive-meta{position:absolute;top:3vh;display:flex;flex-direction:column;gap:3px;font-family:"Inter",sans-serif;font-size:8px;line-height:1.3;letter-spacing:.18em;text-transform:uppercase;z-index:5;color:#000;}
.archive-meta-left{left:3vw;align-items:flex-start;}
.archive-meta-right{right:3vw;align-items:flex-end;text-align:right;}
.archive-caption{position:absolute;left:3vw;bottom:3.5vh;display:flex;flex-direction:column;font-family:"Inter",sans-serif;font-size:8px;line-height:1.4;letter-spacing:.16em;z-index:5;}
.archive-caption span:last-child{font-weight:700;}
.archive-rule{position:absolute;left:3vw;right:3vw;bottom:0%;height:20px;border-top:1px solid rgba(0,0,0,1);display:flex;align-items:center;justify-content:space-between;font-family:"Inter",sans-serif;font-size:7px;letter-spacing:.2em;text-transform:uppercase;z-index:5;}
/* =========================================================
   MOBILE
========================================================= */
@media(max-width:1000px){
  .archive-monument{height:66vh;min-height:340px;}
  .archive-word-top{transform:translateX(-8vw);}
  .archive-word-main{transform:translateX(2vw);}
  .archive-word-bottom{transform:translateX(-5vw);}
  .archive-meta{font-size:6px;}
  .archive-caption{font-size:6px;}
  .informant-bg-text{width:180vw;gap:0 5vw;opacity:.07;}
  .informant-bg-text span{font-size:1rem;letter-spacing:.15em;}
}

/* === FOOTER === */
.footer { position: relative; width: 90vw; padding: 2vh 5vw;margin: 2vh 5vw; color: #000; overflow: hidden; background:#fff;border:2px solid #000;box-shadow:6px 6px 0 #000;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1); /*background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 20%,rgba(0,0,0,0.6) 40%,rgba(0,0,0,0.8) 60%,rgba(0,0,0,1) 100%);*/}
.footer:hover{transform:translate(-6px,-6px);box-shadow:14px 14px 0 #000;}
.footer-content { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 4rem; flex-wrap: wrap; animation: footerBreath 6s ease-in-out infinite; /*mix-blend-mode: screen;*/}
.footer-left {position: relative;width: 50%;display: flex;flex-direction: column; align-items: center;justify-content: center; mix-blend-mode: lighten;}
.footer-left a { display: flex;flex-direction: column; align-items: center;justify-content: center;width:100%;}
.footer-logo { text-align: center;width:100%; position:relative;width:fit-content;overflow:hidden; font-family: 'Black'; font-size: 5rem;font-weight: lighter; letter-spacing: 10px; }
.footer-logo::before{content:"";position:absolute;z-index:-1;left:-4px;right:-4px;top:50%;bottom:30%;background:#fffb00;}
.footer-tagline { font-size: 3rem; margin-top: 10px; color: #000;}
.text-draw__box { color: #000; width: 18%; height: .625em; position: relative; }
.text-draw__box-svg { width: 100%; height: 100%; position: absolute; overflow: visible !important; }

.footer-center { display: flex; flex-direction: column; gap: 0px; }
.footer-center a { text-decoration: none; color: #000; font-family: 'Audemars', 'Darkella', 'Black'; font-size: 3rem; line-height: 1.5; transition: 0.3s; cursor: pointer;}
.footer-center a:hover { transform: translateX(10px); color: #fffb00; }

.footer-socials { display: flex;justify-content: space-between;align-items: center; gap: 1rem; font-size: 3rem; }
.footer-socials i { cursor: pointer; transition: 0.3s; color: #000;}
.footer-socials i:hover { transform: scale(1.2) rotate(10deg); color: #fffb00; }
.footer-copy { font-size: 2.5rem; margin-top: 10px; }
@keyframes footerBreath { 0%,100% { transform: scale(1); } 50% { transform: scale(1.02); } }
@media (max-width: 2000px) {.text-draw__box {width: 30%;}}
@media (max-width: 1000px) { .footer-logo{font-size: 2.5rem;letter-spacing: 0;} .footer-left {width: 100%;}.footer-tagline { font-size: 2rem;}.motorlivered {width: 80%;filter: drop-shadow(0 0 1px #fff);} .footer-center { width: 100%; text-align: center; }.footer-center a {font-size: 4rem;} .footer-right {width: 100%;}.footer-socials {justify-content: space-evenly;gap: 0;} .footer-copy {text-align: center;}}
@media (max-width: 600px) and (max-height: 800px) {.footer-center a {font-size: 3.3rem;}}


/* === LOADER CSS === */
.loading { display: flex; align-items: center; justify-content: center; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 110; background: #000; opacity: 0; transition: 0.5s; }
.before-load .loading { opacity: 1; }
.load-counter { position: absolute;bottom: 0;left: 0;width: 100%; /* ✅ full width */ display: flex;justify-content: center;gap: 10px; /* ✅ true centering */ font-family: 'Audemars', 'Darkella', "Inter", sans-serif; font-size: clamp(9rem, 15vw, 18rem); font-weight: lighter; color: #fff;text-shadow: 0 0 0.02em #fff; letter-spacing: 10px;text-align: center; z-index: 50;pointer-events: none; }
.footer-marquee { background-color: #fffb00; position: absolute; width: 300%; top: 0%; left: -50%; z-index: 1; pointer-events: none; }
.footer-marquee-track { white-space: nowrap; animation: footerMarquee 60s linear infinite; }
.footer-marquee span { font-family: 'Audemars', 'Darkella', 'Black'; font-size: 5rem; color: #000; }
@keyframes footerMarquee { from { transform: translateX(0%); } to { transform: translateX(-50%); } }
@media (max-width: 2000px) { .load-counter{font-size: 15vw;}}
@media (max-width: 1000px) { .load-counter{font-size: 10rem;bottom:20%;}}