/* ============================================================
   TEMP-FX PACK (2026-10-03)
   Marquee strip + kinetic hero statement + film grain.
   TO REVERT: delete this file, remove its <link> in index.html,
   and delete the <!-- TEMP-FX --> blocks in index.html.
   Everything here is CSS-only: no JS, no images, no new fonts.
   ============================================================ */

/* ---------- 1. film grain: whisper of noise over the page ---------- */
body::after{
  content:"";position:fixed;inset:0;z-index:250;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}

/* ---------- 2. marquee strip ---------- */
.marquee{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;padding:15px 0;white-space:nowrap;
  margin-left:-22px;margin-right:-22px; /* full-bleed inside .wrap */
}
.marquee-track{display:flex;width:max-content;animation:fx-marquee 26s linear infinite}
.mq{display:flex;align-items:center;gap:2.4rem;padding-right:2.4rem}
.mq span{
  font-weight:800;font-size:.92rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text);white-space:nowrap;
}
.mq i{font-style:normal;color:var(--accent);font-size:.8rem}
@keyframes fx-marquee{to{transform:translateX(-50%)}}
@media(max-width:640px){
  .mq span{font-size:.78rem}
  .marquee{padding:12px 0}
}

/* ---------- 3. kinetic hero statement: masked word rises ---------- */
.hero .statement.reveal{opacity:1;transform:none;transition:none}
.hero .statement .mask{
  display:inline-block;overflow:hidden;vertical-align:bottom;
  padding-bottom:.1em;margin-bottom:-.1em;
}
.hero .statement .mask>span{
  display:inline-block;transform:translateY(115%);
  animation:fx-rise .9s cubic-bezier(.2,.7,.2,1) forwards;
}
.hero .statement .mask:nth-of-type(1)>span{animation-delay:.3s}
.hero .statement .mask:nth-of-type(2)>span{animation-delay:.38s}
.hero .statement .mask:nth-of-type(3)>span{animation-delay:.46s}
.hero .statement .mask:nth-of-type(4)>span{animation-delay:.54s}
@keyframes fx-rise{to{transform:translateY(0)}}
/* slow sheen drift on the gold "move" */
.hero .statement em{background-size:220% 100%;animation:fx-sheen 7s ease-in-out infinite alternate}
@keyframes fx-sheen{to{background-position:100% 0}}

/* ---------- reduced motion: everything settles to its final state ---------- */
@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none}
  .hero .statement .mask>span{animation:none;transform:none}
  .hero .statement em{animation:none}
}
