/* Loader */
.loader { position: fixed; inset: 0; z-index: 300; background: var(--obsidian); display: grid; place-items: center; transition: opacity 0.8s var(--ease), visibility 0.8s; }
.loader.is-done { opacity: 0; visibility: hidden; }
.loader__mark { width: 130px; height: 130px; position: relative; display: grid; place-items: center; }
.loader__mark img { width: 100%; filter: drop-shadow(0 0 24px rgba(198,161,91,0.35)); }
.loader__mark::after {
  content: ""; position: absolute; inset: -12%; border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0 70%, rgba(232,204,145,0.9) 85%, transparent 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));
  animation: spin 1.4s linear infinite;
}
.loader__line { position: absolute; bottom: -34px; left: 50%; transform: translateX(-50%); width: 0; height: 1px; background: var(--gold); animation: grow 1.6s var(--ease) forwards; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes grow { to { width: 160px; } }

/* Scroll reveal (JS adds .is-visible) */
[data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
[data-reveal].is-visible { opacity: 1; transform: none; }
[data-reveal="left"] { transform: translateX(-40px); }
[data-reveal="right"] { transform: translateX(40px); }
[data-reveal="zoom"] { transform: scale(0.92); }
[data-reveal].is-visible { transform: none; }
[data-reveal-delay="1"] { transition-delay: 0.12s; }
[data-reveal-delay="2"] { transition-delay: 0.24s; }
[data-reveal-delay="3"] { transition-delay: 0.36s; }
[data-reveal-delay="4"] { transition-delay: 0.48s; }

/* Line-mask reveal for headings */
.line-mask { display: block; overflow: hidden; }
.line-mask > span { display: block; transform: translateY(105%); transition: transform 1s var(--ease); }
.is-visible .line-mask > span, .line-mask.is-visible > span { transform: none; }

/* Image reveal (clip wipe) */
.img-reveal { position: relative; }
.img-reveal::after { content: ""; position: absolute; inset: 0; background: var(--obsidian); transform-origin: right; transition: transform 1.1s var(--ease); z-index: 2; }
.img-reveal.is-visible::after { transform: scaleX(0); }

/* Gold sweep on headings */
.gold-sweep { position: relative; }
.gold-sweep::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(105deg, transparent 40%, rgba(232,204,145,0.55) 50%, transparent 60%);
  background-size: 250% 100%; background-position: 200% 0; opacity: 0;
}
.gold-sweep.is-visible::after { opacity: 1; animation: sweep 1.4s var(--ease) forwards; }
@keyframes sweep { to { background-position: -80% 0; } }

/* 3D tilt cards */
.tilt { transform-style: preserve-3d; will-change: transform; transition: transform 0.3s var(--ease); }
.tilt .media img { transform: translateZ(40px); }

/* Scroll cue */
.scroll-cue { display: inline-flex; flex-direction: column; align-items: center; gap: 0.6rem; font-size: 0.68rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--text-muted); }
.scroll-cue i { width: 1px; height: 46px; background: linear-gradient(var(--gold), transparent); position: relative; overflow: hidden; }
.scroll-cue i::after { content: ""; position: absolute; top: -50%; left: 0; width: 100%; height: 50%; background: var(--gold-bright); animation: cue 1.8s var(--ease) infinite; }
@keyframes cue { to { top: 120%; } }

/* Ken burns on hero */
@keyframes kenburns { from { transform: scale(1.05); } to { transform: scale(1.16); } }
.kenburns { animation: kenburns 20s var(--ease-in-out) forwards; }

/* Marquee */
.marquee { display: flex; overflow: hidden; gap: 3rem; -webkit-mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.marquee__track { display: flex; gap: 3rem; flex: none; animation: marquee 26s linear infinite; }
@keyframes marquee { to { transform: translateX(-50%); } }
