@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400;1,500&family=Jost:wght@200;300;400;500&family=Pinyon+Script&display=swap');

/* ═══════════════════════════════════════════════════════════
   DESIGN TOKENS
═══════════════════════════════════════════════════════════ */
:root {
  --navy-900: #03060C;
  --navy-800: #060A14;
  --navy-700: #0A1020;
  --navy-600: #0D1529;
  --navy-500: #111E35;
  --navy-400: #162545;

  --gold-100: #FFF8E8;
  --gold-200: #F5DFA0;
  --gold-300: #E8C86B;
  --gold-400: #D4A843;
  --gold-500: #C5A24A;
  --gold-600: #A8852F;
  --gold-700: #7A5E1A;

  --cream: #EDE9DF;
  --cream-60: rgba(237,233,223,0.60);
  --cream-40: rgba(237,233,223,0.40);
  --cream-20: rgba(237,233,223,0.20);
  --cream-10: rgba(237,233,223,0.10);

  --gold-glow: rgba(197,162,74,0.22);
  --gold-bd: rgba(197,162,74,0.20);
  --gold-bd2: rgba(197,162,74,0.38);
  --gold-bg: rgba(197,162,74,0.06);

  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Jost', system-ui, sans-serif;
  --script: 'Pinyon Script', cursive;

  --radius: 0px;
  --transition: cubic-bezier(0.22, 1, 0.36, 1);
  --transition-slow: cubic-bezier(0.16, 1, 0.30, 1);
}

/* ═══ RESET ═══════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  background: var(--navy-900);
  color: var(--cream);
  font-family: var(--sans);
  font-weight: 300;
  overflow-x: hidden;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: var(--sans); }
::selection { background: rgba(197,162,74,0.25); color: var(--cream); }

/* ═══ GRAIN OVERLAY ════════════════════════════════════════ */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 998;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
  background-size: 200px 200px;
  pointer-events: none;
  opacity: 0.6;
  mix-blend-mode: overlay;
}

/* ═══ KEYFRAMES ════════════════════════════════════════════ */
@keyframes fadeIn       { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes fadeUpLux    { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes fadeUpSoft   { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes slideLeft    { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: none; } }
@keyframes slideRight   { from { opacity: 0; transform: translateX(30px);  } to { opacity: 1; transform: none; } }
@keyframes scaleReveal  { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } }
@keyframes shineSweep   { from { transform: translateX(-220%); } to { transform: translateX(220%); } }
@keyframes shimmer      { from { background-position: -300% center; } to { background-position: 300% center; } }
@keyframes rotateSlow   { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes pulseGlow    { 0%,100% { opacity: 0.4; transform: scale(1); } 50% { opacity: 0.85; transform: scale(1.04); } }
@keyframes flowDash     { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }
@keyframes marquee      { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes dotPulse     { 0%,100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(197,162,74,0.35); }
                          50% { transform: scale(1.12); box-shadow: 0 0 0 9px rgba(197,162,74,0); } }
@keyframes lineGrow     { from { width: 0; opacity: 0; } to { width: 100%; opacity: 1; } }
@keyframes bodyEnter    { from { opacity: 0; } to { opacity: 1; } }
@keyframes float        { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes navEnter     { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }

body { animation: bodyEnter 0.35s ease forwards; }

/* ═══ GOLD SHIMMER TEXT UTILITY ═══════════════════════════ */
.gold-shimmer {
  background: linear-gradient(120deg,
    var(--gold-600) 0%,
    var(--gold-400) 20%,
    var(--gold-300) 40%,
    var(--gold-100) 50%,
    var(--gold-300) 60%,
    var(--gold-400) 80%,
    var(--gold-600) 100%);
  background-size: 300% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 5s linear infinite;
}
.gold-shimmers {
  background: linear-gradient(120deg,
    var(--gold-600) 0%,
    var(--gold-400) 20%,
    var(--gold-300) 40%,
    var(--gold-100) 50%,
    var(--gold-300) 60%,
    var(--gold-400) 80%,
    var(--gold-600) 100%);
	font-family: var(--serif);
	font-style: bold; italic;
	font-weight: 800;
	font-size: 25.5px;
  background-size: 300% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 5s linear infinite;
}
/* ═══ NAVIGATION ═══════════════════════════════════════════ */
.site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 500;
  background: rgba(3,6,12,0.92);
  backdrop-filter: blur(32px) saturate(1.6);
  -webkit-backdrop-filter: blur(32px) saturate(1.6);
  border-bottom: 1px solid rgba(197,162,74,0.12);
  transition: background 0.4s, box-shadow 0.4s;
}
.site-nav.scrolled {
  background: rgba(3,6,12,0.97);
  box-shadow: 0 2px 60px rgba(0,0,0,0.8), 0 1px 0 rgba(197,162,74,0.10);
}
.nav-topbar {
  display: flex; justify-content: flex-end; gap: 28px;
  padding: 6px 48px;
  border-bottom: 1px solid rgba(197,162,74,0.06);
  font-size: 10.5px; font-weight: 300; letter-spacing: 0.06em;
  color: var(--cream-40);
}
.nav-topbar a { color: var(--gold-500); transition: opacity 0.2s; }
.nav-topbar a:hover { opacity: 0.7; }
.nav-topbar span { display: flex; align-items: center; gap: 5px; }
.nav-main {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 48px; max-width: 1440px; margin: 0 auto;
}
.nav-brand {
  display: flex; align-items: center; gap: 14px;
}
.nav-brand img { height: 44px; width: auto; object-fit: contain; }
.nav-brand-words { display: flex; flex-direction: column; }
.nav-sig {
  font-family: var(--script);
  font-size: 24px; color: var(--gold-300);
  letter-spacing: 0.01em; line-height: 1;
}
.nav-sub {
  font-size: 7.5px; font-weight: 400;
  letter-spacing: 0.32em; text-transform: uppercase;
  color: rgba(197,162,74,0.50); margin-top: 2px;
}
.nav-links {
  display: flex; list-style: none; align-items: center; gap: 2px;
}
.nav-links li a {
  display: block;
  font-size: 10px; font-weight: 400;
  letter-spacing: 0.16em; text-transform: uppercase;
  padding: 9px 16px; color: var(--cream-40);
  position: relative; transition: color 0.25s;
}
.nav-links li a::after {
  content: ''; position: absolute; bottom: 4px;
  left: 16px; right: 16px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-400), transparent);
  transform: scaleX(0); transform-origin: center;
  transition: transform 0.3s var(--transition);
}
.nav-links li a:hover { color: var(--cream); }
.nav-links li a:hover::after, .nav-links li a.active::after { transform: scaleX(1); }
.nav-links li a.active { color: var(--gold-400); }
.nav-cta-wrap { display: flex; align-items: center; gap: 10px; }
.btn-nav {
  font-size: 9.5px; font-weight: 400;
  letter-spacing: 0.18em; text-transform: uppercase;
  padding: 10px 24px;
  border: 1px solid var(--gold-bd2);
  color: var(--gold-400); cursor: pointer;
  background: transparent; transition: all 0.28s;
  position: relative; overflow: hidden;
}
.btn-nav::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(197,162,74,0.10), transparent);
  transform: translateX(-100%); transition: transform 0.45s ease;
}
.btn-nav:hover::before { transform: translateX(100%); }
.btn-nav:hover { background: var(--gold-500); color: var(--navy-900); border-color: var(--gold-500); }
.btn-nav.filled { background: var(--gold-500); color: var(--navy-900); border-color: var(--gold-500); }
.btn-nav.filled:hover { background: var(--gold-300); }
.hamburger {
  display: none; width: 38px; height: 38px;
  align-items: center; justify-content: center;
  background: none; border: 1px solid var(--gold-bd);
  color: var(--cream); font-size: 18px; cursor: pointer;
  transition: border-color 0.2s;
}
.hamburger:hover { border-color: var(--gold-bd2); }
.ham-span, .close-span { position: absolute; transition: opacity 0.2s, transform 0.2s; }
.close-span { opacity: 0; transform: rotate(-90deg); font-size: 20px; }
.hamburger.open .ham-span { opacity: 0; transform: rotate(90deg); }
.hamburger.open .close-span { opacity: 1; transform: rotate(0deg); }

/* ═══ HERO ═════════════════════════════════════════════════ */
.hero {
  min-height: 100vh;
  display: flex; align-items: center;
  padding: 160px 6vw 100px;
  position: relative; overflow: hidden;
}

/* ANIMATED MESH BACKGROUND */
.hero-bg {
  position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(ellipse 80% 80% at 70% 30%, rgba(14,24,60,0.55) 0%, transparent 60%),
    radial-gradient(ellipse 50% 60% at 20% 70%, rgba(197,162,74,0.05) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 80% 80%, rgba(6,9,15,0.8) 0%, transparent 50%),
    var(--navy-900);
}

/* GRID OVERLAY */
.hero-grid {
  position: absolute; inset: 0; z-index: 1;
  background-image:
    linear-gradient(rgba(197,162,74,0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(197,162,74,0.015) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(ellipse 65% 65% at 50% 50%, black 30%, transparent 100%);
}

/* ORBITING RING */
.hero-ring {
  position: absolute; z-index: 1;
  top: 50%; left: 65%;
  transform: translate(-50%, -50%);
  width: min(60vw, 700px); height: min(60vw, 700px);
  border-radius: 50%;
  border: 1px solid rgba(197,162,74,0.08);
  animation: rotateSlow 80s linear infinite;
  pointer-events: none;
}
.hero-ring::before {
  content: ''; position: absolute; inset: 40px;
  border-radius: 50%; border: 1px solid rgba(197,162,74,0.05);
  animation: rotateSlow 60s linear infinite reverse;
}
.hero-ring::after {
  content: ''; position: absolute; inset: 90px;
  border-radius: 50%; border: 1px dashed rgba(197,162,74,0.04);
}

/* WATERMARK SIG */
.hero-wm {
  position: absolute; z-index: 1;
  font-family: var(--script);
  font-size: clamp(200px, 28vw, 420px);
  color: rgba(197,162,74,0.018);
  line-height: 1;
  right: -2vw; top: 50%; transform: translateY(-48%);
  pointer-events: none; user-select: none;
  letter-spacing: -0.02em;
}

.hero-inner {
  position: relative; z-index: 2;
  max-width: 1380px; margin: 0 auto; width: 100%;
  display: grid; grid-template-columns: 1.15fr 1fr;
  gap: 100px; align-items: center;
}

.hero-left { display: flex; flex-direction: column; }

.hero-eyebrow {
  display: flex; align-items: center; gap: 14px;
  font-size: 9.5px; font-weight: 400;
  letter-spacing: 0.30em; text-transform: uppercase;
  color: var(--gold-500); margin-bottom: 24px;
  opacity: 0; animation: fadeIn 0.8s 0.2s var(--transition) forwards;
}
.hero-eyebrow::before {
  content: ''; width: 30px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-500));
  flex-shrink: 0;
}

.hero-sig-large {
  font-family: var(--script);
  font-size: clamp(56px, 8vw, 110px);
  line-height: 1.3;
  margin-bottom: 6px;
  background: linear-gradient(120deg,
    var(--gold-600) 0%, var(--gold-400) 25%,
    var(--gold-300) 45%, var(--gold-100) 55%,
    var(--gold-300) 65%, var(--gold-400) 80%, var(--gold-600) 100%);
  background-size: 250% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 6s linear infinite, fadeIn 0.8s 0.3s var(--transition) forwards;
  opacity: 0;
}

.hero-wordmark {
  font-family: var(--serif);
  font-size: clamp(14px, 1.5vw, 18px);
  font-weight: 300; letter-spacing: 0.35em;
  text-transform: uppercase; color: var(--cream-60);
  margin-bottom: 40px;
  opacity: 0; animation: fadeIn 0.8s 0.45s var(--transition) forwards;
}

.hero-hr {
  width: 0; height: 1px;
  background: linear-gradient(90deg, var(--gold-500), transparent);
  margin-bottom: 32px;
  animation: lineGrow 1s 0.5s ease forwards;
}

.hero-headline {
  font-family: var(--serif);
  font-size: clamp(28px, 3.5vw, 46px);
  font-weight: 300; line-height: 1.2;
  color: var(--cream); margin-bottom: 24px;
  opacity: 0; animation: fadeIn 0.8s 0.6s var(--transition) forwards;
}
.hero-headline em {
  font-style: italic;
  background: linear-gradient(120deg, var(--gold-400) 0%, var(--gold-200) 50%, var(--gold-400) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 4s linear infinite;
}

.hero-desc {
  font-size: 16px; font-weight: 300; line-height: 1.85;
  color: var(--cream-60); max-width: 480px; margin-bottom: 48px;
  border-left: 2px solid rgba(197,162,74,0.30);
  padding-left: 22px;
  opacity: 0; animation: fadeIn 0.8s 0.75s var(--transition) forwards;
}

.hero-actions {
  display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 44px;
  opacity: 0; animation: fadeIn 0.8s 0.9s var(--transition) forwards;
}

.hero-fine {
  display: flex; gap: 24px; flex-wrap: wrap;
  opacity: 0; animation: fadeIn 0.8s 1.05s var(--transition) forwards;
}
.hero-fine-item {
  font-size: 20.5px; font-weight: 300; letter-spacing: 0.10em;
  color: var(--gold-600); display: flex; align-items: center; gap: 7px;
}
.hero-fine-item::before {
  content: ''; width: 4px; height: 4px; border-radius: 50%;
  background: var(--gold-600); flex-shrink: 0;
}

/* HERO RIGHT — PILLARS PANEL */
.hero-panel {
  background: rgba(5,8,18,0.80);
  border: 1px solid rgba(197,162,74,0.14);
  backdrop-filter: blur(20px);
  position: relative; overflow: hidden;
  opacity: 0; animation: fadeIn 0.8s 0.5s var(--transition) forwards;
}
.hero-panel::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-300), var(--gold-500), var(--gold-300), transparent);
  background-size: 200% auto; animation: shimmer 4s linear infinite;
}
.hero-panel-header {
  padding: 24px 32px 20px;
  border-bottom: 1px solid rgba(197,162,74,0.08);
  font-size: 8.5px; font-weight: 400; letter-spacing: 0.28em;
  text-transform: uppercase; color: var(--gold-600);
  display: flex; align-items: center; gap: 10px;
}
.hero-panel-header::before {
  content: ''; width: 22px; height: 1px; background: var(--gold-600);
}
.hero-pillar {
  padding: 26px 32px;
  border-bottom: 1px solid rgba(197,162,74,0.07);
  display: flex; align-items: center; gap: 22px;
  cursor: default;
  border-left: 2px solid transparent;
  transition: all 0.35s var(--transition);
  position: relative; overflow: hidden;
}
.hero-pillar:last-child { border-bottom: none; }
.hero-pillar::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 60% 100% at 0% 50%, rgba(197,162,74,0.06) 0%, transparent 100%);
  opacity: 0; transition: opacity 0.35s;
}
.hero-pillar:hover { border-left-color: var(--gold-500); background: rgba(8,14,32,0.9); }
.hero-pillar:hover::before { opacity: 1; }
.pillar-ico-wrap {
  width: 52px; height: 52px; flex-shrink: 0;
  border: 1px solid rgba(197,162,74,0.18);
  background: rgba(197,162,74,0.04);
  display: flex; align-items: center; justify-content: center;
  transition: all 0.35s; color: var(--gold-400);
}
.hero-pillar:hover .pillar-ico-wrap {
  border-color: rgba(197,162,74,0.40);
  background: rgba(197,162,74,0.10);
  box-shadow: 0 0 18px rgba(197,162,74,0.18);
}
.pillar-ico-wrap svg { transition: transform 0.35s; }
.hero-pillar:hover .pillar-ico-wrap svg { transform: scale(1.1); }
.pillar-num {
  font-size: 8px; font-weight: 400; letter-spacing: 0.22em;
  text-transform: uppercase; color: rgba(197,162,74,0.45);
  margin-bottom: 4px;
}
.pillar-label {
  font-family: var(--serif); font-size: 20px; font-weight: 300;
  color: var(--cream); line-height: 1; transition: color 0.25s;
}
.hero-pillar:hover .pillar-label { color: var(--gold-200); }
.hero-panel-footer {
  padding: 18px 32px;
  background: rgba(197,162,74,0.03);
  border-top: 1px solid rgba(197,162,74,0.08);
  display: flex; align-items: center; justify-content: space-between;
}
.panel-footer-text {
  font-size: 8.5px; font-weight: 400; letter-spacing: 0.22em;
  text-transform: uppercase; color: rgba(197,162,74,0.35);
}
.panel-footer-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold-500);
  animation: dotPulse 2.5s ease-in-out infinite;
}

/* ═══ MARQUEE ══════════════════════════════════════════════ */
.marquee-band {
  background: linear-gradient(90deg, var(--gold-500) 0%, var(--gold-300) 40%, var(--gold-200) 55%, var(--gold-300) 70%, var(--gold-500) 100%);
  background-size: 200% auto;
  animation: shimmer 7s linear infinite;
  overflow: hidden; padding: 14px 0;
}
.marquee-track { display: flex; animation: marquee 40s linear infinite; width: max-content; }
.marquee-item {
  display: flex; align-items: center; gap: 22px;
  padding: 0 36px; font-size: 9px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: rgba(3,6,12,0.70); white-space: nowrap;
}
.marquee-dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(3,6,12,0.25); }

/* ═══ SECTION LAYOUTS ══════════════════════════════════════ */
.section { padding: 110px 6vw; position: relative; }
.section::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(197,162,74,0.15), transparent);
}
.section.bg-800 { background: var(--navy-800); }
.section.bg-900 { background: var(--navy-900); }
.section.bg-700 { background: var(--navy-700); }
.inner { max-width: 1380px; margin: 0 auto; }

.section-tag {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 9px; font-weight: 400; letter-spacing: 0.28em;
  text-transform: uppercase; color: var(--gold-500); margin-bottom: 14px;
}
.section-tag::before {
  content: ''; width: 24px; height: 1px;
  background: var(--gold-500); box-shadow: 0 0 6px rgba(197,162,74,0.5);
}
.section-title {
  font-family: var(--serif);
  font-size: clamp(28px, 3.8vw, 52px);
  font-weight: 300; line-height: 1.1;
}
.section-sub {
  font-size: 15px; font-weight: 300; line-height: 1.88;
  color: var(--cream-60); max-width: 620px; margin-top: 18px;
}

/* ═══ THREE PILLARS ════════════════════════════════════════ */
.pillars-wrap {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: rgba(197,162,74,0.10);
  border: 1px solid rgba(197,162,74,0.10);
  margin-top: 64px;
}
.pillar-card {
  background: linear-gradient(155deg, rgba(10,16,32,0.96) 0%, rgba(3,6,12,0.99) 100%);
  padding: 60px 40px;
  display: flex; flex-direction: column; align-items: center;
  text-align: center; position: relative; overflow: hidden;
  transition: all 0.45s var(--transition); cursor: pointer;
}
.pillar-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-300), var(--gold-500), var(--gold-300), transparent);
  transform: scaleX(0); transition: transform 0.45s var(--transition);
}
.pillar-card::after {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 110%, rgba(197,162,74,0.08) 0%, transparent 60%);
  opacity: 0; transition: opacity 0.4s;
}
.pillar-card:hover { transform: translateY(-6px); box-shadow: 0 24px 64px rgba(0,0,0,0.6), 0 0 40px rgba(197,162,74,0.08); }
.pillar-card:hover::before { transform: scaleX(1); }
.pillar-card:hover::after { opacity: 1; }
.pillar-icon-circle {
  width: 84px; height: 84px; border-radius: 50%;
  border: 1px solid rgba(197,162,74,0.22);
  background: rgba(197,162,74,0.04);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 32px; color: var(--gold-400);
  position: relative; z-index: 1;
  transition: all 0.4s var(--transition);
}
.pillar-icon-circle::before {
  content: ''; position: absolute; inset: -8px; border-radius: 50%;
  border: 1px solid rgba(197,162,74,0.08);
  transition: border-color 0.4s;
}
.pillar-card:hover .pillar-icon-circle {
  border-color: rgba(197,162,74,0.50);
  background: rgba(197,162,74,0.10);
  box-shadow: 0 0 30px rgba(197,162,74,0.22);
  transform: scale(1.06);
}
.pillar-card:hover .pillar-icon-circle::before {
  border-color: rgba(197,162,74,0.18);
}
.pillar-card-num {
  font-size: 8.5px; font-weight: 400; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--gold-600);
  margin-bottom: 12px; position: relative; z-index: 1;
}
.pillar-card-title {
  font-family: var(--serif); font-size: 26px; font-weight: 300;
  color: var(--cream); line-height: 1.15; margin-bottom: 18px;
  position: relative; z-index: 1;
  transition: color 0.3s;
}
.pillar-card:hover .pillar-card-title { color: var(--gold-200); }
.pillar-card-desc {
  font-size: 13px; font-weight: 300; line-height: 1.82;
  color: var(--cream-60); position: relative; z-index: 1;
}

/* ═══ ENGINES GRID ═════════════════════════════════════════ */
.engines-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: rgba(197,162,74,0.08);
  border: 1px solid rgba(197,162,74,0.08);
}
.engine-card {
  background: linear-gradient(145deg, rgba(8,12,26,0.96) 0%, rgba(3,6,12,0.98) 100%);
  padding: 38px 28px;
  position: relative; overflow: hidden;
  transition: all 0.38s var(--transition);
}
.engine-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--gold-500), rgba(197,162,74,0.3));
  transform: scaleX(0); transform-origin: left;
  transition: transform 0.4s var(--transition);
}
.engine-card:hover { background: linear-gradient(145deg, rgba(12,18,40,0.98) 0%, rgba(6,10,22,0.99) 100%); transform: translateY(-2px); box-shadow: 0 12px 40px rgba(0,0,0,0.5); }
.engine-card:hover::after { transform: scaleX(1); }
.engine-num { font-family: var(--serif); font-size: 11px; font-weight: 300; color: rgba(197,162,74,0.28); letter-spacing: 0.1em; margin-bottom: 16px; }
.engine-ico { font-size: 22px; color: var(--gold-400); margin-bottom: 14px; transition: transform 0.3s, text-shadow 0.3s; }
.engine-card:hover .engine-ico { transform: translateY(-4px); text-shadow: 0 0 18px rgba(197,162,74,0.6); }
.engine-title { font-family: var(--serif); font-size: 17px; font-weight: 300; color: var(--cream); margin-bottom: 10px; line-height: 1.3; }
.engine-desc { font-size: 12px; font-weight: 300; line-height: 1.78; color: var(--cream-40); }

/* ═══ ECOSYSTEM FLOW ═══════════════════════════════════════ */
.flow-section { padding: 110px 6vw; background: var(--navy-900); position: relative; overflow: hidden; }
.flow-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(197,162,74,0.15), transparent); }
.flow-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 70% 50% at 50% 50%, rgba(14,22,50,0.35) 0%, transparent 65%); pointer-events: none; }
.flow-track {
  display: flex; align-items: center; justify-content: center;
  gap: 0; overflow-x: auto; padding: 48px 24px;
  background: rgba(197,162,74,0.025);
  border: 1px solid rgba(197,162,74,0.10);
  position: relative;
}
.flow-track::before {
  content: ''; position: absolute; top: 50%; left: 5%; right: 5%;
  height: 1px; transform: translateY(-50%);
  background: linear-gradient(90deg,
    transparent 0%, rgba(197,162,74,0.15) 10%,
    rgba(197,162,74,0.15) 90%, transparent 100%);
  z-index: 0;
}
.flow-node {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; flex-shrink: 0; position: relative; z-index: 1;
  padding: 0 12px;
}
.flow-circle {
  width: 76px; height: 76px; border-radius: 50%;
  border: 1px solid rgba(197,162,74,0.28);
  background: linear-gradient(145deg, rgba(12,18,44,0.98), rgba(4,7,16,0.99));
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: var(--gold-400); margin-bottom: 14px;
  box-shadow: 0 0 0 8px rgba(197,162,74,0.04);
  transition: all 0.35s var(--transition);
  position: relative;
}
.flow-circle::before {
  content: ''; position: absolute; inset: -10px; border-radius: 50%;
  border: 1px solid rgba(197,162,74,0.08);
}
.flow-node:hover .flow-circle {
  border-color: rgba(197,162,74,0.55);
  box-shadow: 0 0 0 10px rgba(197,162,74,0.06), 0 0 24px rgba(197,162,74,0.20);
  transform: scale(1.08);
}
.flow-label {
  font-size: 8.5px; font-weight: 500; letter-spacing: 0.20em;
  text-transform: uppercase; color: rgba(197,162,74,0.55);
  white-space: nowrap;
}
.flow-sub {
  font-size: 11px; font-weight: 300; color: var(--cream-40);
  margin-top: 4px; white-space: nowrap;
}
.flow-connector {
  display: flex; align-items: center; flex-shrink: 0;
  padding: 0 4px; color: rgba(197,162,74,0.25);
  font-size: 18px; margin-bottom: 28px;
  animation: float 3s ease-in-out infinite;
}

/* ═══ QUOTE ════════════════════════════════════════════════ */
.quote-section { padding: 100px 6vw; position: relative; overflow: hidden;
  border-top: 1px solid rgba(197,162,74,0.10);
  border-bottom: 1px solid rgba(197,162,74,0.10);
  background: radial-gradient(ellipse 80% 60% at 50% 50%, rgba(12,18,44,0.40) 0%, var(--navy-900) 65%);
}
.quote-wm-text {
  position: absolute; font-family: var(--script); font-size: clamp(300px,40vw,600px);
  color: rgba(197,162,74,0.02); line-height: 0.8; top: -20px; left: 2vw;
  pointer-events: none; user-select: none;
}
.quote-inner { max-width: 860px; margin: 0 auto; text-align: center; position: relative; }
.quote-text {
  font-family: var(--serif); font-size: clamp(20px,2.8vw,34px);
  font-weight: 300; font-style: italic; line-height: 1.5;
  color: var(--cream); margin-bottom: 32px;
}
.quote-attr {
  font-size: 9.5px; font-weight: 400; letter-spacing: 0.25em;
  text-transform: uppercase; color: rgba(197,162,74,0.50);
  display: flex; align-items: center; justify-content: center; gap: 14px;
}
.quote-attr::before, .quote-attr::after {
  content: ''; width: 44px; height: 1px; background: rgba(197,162,74,0.22);
}

/* ═══ CTA BAND ═════════════════════════════════════════════ */
.cta-section { padding: 110px 6vw; background: var(--navy-700); position: relative; overflow: hidden; }
.cta-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(197,162,74,0.20), transparent); }
.cta-bg-glow { position: absolute; top: -50%; right: -10%; width: 60%; height: 200%; background: radial-gradient(ellipse, rgba(20,30,80,0.14) 0%, transparent 65%); pointer-events: none; }
.cta-inner { max-width: 1380px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: center; position: relative; z-index: 1; }
.cta-title { font-family: var(--serif); font-size: clamp(32px,4vw,60px); font-weight: 300; line-height: 1.1; margin-bottom: 32px; }
.cta-details { display: flex; flex-direction: column; gap: 8px; margin-top: 24px; }
.cta-detail { font-size: 11px; font-weight: 300; color: var(--cream-20); letter-spacing: 0.06em; display: flex; align-items: center; gap: 8px; }
.cta-detail::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: rgba(197,162,74,0.35); flex-shrink: 0; }
.cta-desc { font-size: 15px; font-weight: 300; line-height: 1.9; color: var(--cream-60); margin-bottom: 36px; }

/* ═══ BUTTONS ══════════════════════════════════════════════ */
.btn-primary {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 10px; font-weight: 400; letter-spacing: 0.20em;
  text-transform: uppercase; cursor: pointer;
  background: linear-gradient(90deg, var(--gold-500) 0%, var(--gold-300) 50%, var(--gold-500) 100%);
  background-size: 200% auto;
  color: var(--navy-900); padding: 16px 40px;
  border: none; position: relative; overflow: hidden;
  transition: background-position 0.5s ease, transform 0.28s var(--transition), box-shadow 0.28s;
}
.btn-primary::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.20), transparent);
  transform: translateX(-100%); transition: transform 0.55s ease;
}
.btn-primary:hover { background-position: right center; transform: translateY(-2px); box-shadow: 0 12px 40px rgba(197,162,74,0.40); }
.btn-primary:hover::before { transform: translateX(100%); }
.btn-secondary {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 10px; font-weight: 400; letter-spacing: 0.18em;
  text-transform: uppercase; cursor: pointer;
  background: transparent; color: var(--cream-60);
  padding: 15px 36px; border: 1px solid rgba(197,162,74,0.28);
  transition: all 0.28s var(--transition);
}
.btn-secondary:hover { border-color: rgba(197,162,74,0.60); color: var(--gold-400); background: rgba(197,162,74,0.04); }

/* ═══ CARDS ════════════════════════════════════════════════ */
.glass-card {
  background: rgba(5,8,18,0.80);
  border: 1px solid rgba(197,162,74,0.12);
  backdrop-filter: blur(16px);
  padding: 40px 32px; position: relative; overflow: hidden;
  transition: all 0.4s var(--transition);
}
.glass-card::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(197,162,74,0.06) 0%, transparent 60%);
  opacity: 0; transition: opacity 0.4s;
}
.glass-card:hover { border-color: rgba(197,162,74,0.28); transform: translateY(-3px); box-shadow: 0 18px 52px rgba(0,0,0,0.55), 0 0 30px rgba(197,162,74,0.07); }
.glass-card:hover::before { opacity: 1; }
.card-num { font-family: var(--serif); font-size: 11px; font-weight: 300; color: rgba(197,162,74,0.28); letter-spacing: 0.12em; margin-bottom: 18px; }
.card-title { font-family: var(--serif); font-size: 20px; font-weight: 300; color: var(--cream); margin-bottom: 12px; line-height: 1.3; }
.card-body { font-size: 13px; font-weight: 300; line-height: 1.82; color: var(--cream-60); }
.card-list { list-style: none; display: flex; flex-direction: column; gap: 9px; margin-top: 14px; }
.card-list li { font-size: 13px; font-weight: 300; color: var(--cream-60); display: flex; gap: 10px; align-items: flex-start; }
.card-list li::before { content: '—'; color: var(--gold-500); flex-shrink: 0; font-size: 11px; margin-top: 3px; }

/* ═══ FORM ═════════════════════════════════════════════════ */
.form-group { display: flex; flex-direction: column; gap: 7px; }
.form-label { font-size: 9.5px; font-weight: 400; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cream-40); }
.form-input {
  background: rgba(10,16,32,0.70); border: none;
  border-bottom: 1px solid rgba(197,162,74,0.30);
  border-left: 2px solid transparent;
  color: var(--cream); font-family: var(--sans); font-size: 14px; font-weight: 300;
  padding: 14px 16px; outline: none; width: 100%;
  transition: border-color 0.25s, box-shadow 0.25s, background 0.25s;
}
.form-input:focus {
  border-bottom-color: var(--gold-400);
  border-left-color: var(--gold-400);
  background: rgba(12,18,40,0.80);
  box-shadow: 0 0 0 3px rgba(197,162,74,0.08);
}
.form-input::placeholder { color: rgba(237,233,223,0.20); }
textarea.form-input { resize: vertical; min-height: 140px; }
select.form-input option { background: var(--navy-600); }
.compliance-notice {
  background: rgba(197,162,74,0.04); border: 1px solid rgba(197,162,74,0.12);
  padding: 22px 24px; font-size: 11.5px; font-weight: 300;
  color: var(--cream-40); line-height: 1.85;
  border-left: 3px solid rgba(197,162,74,0.30);
}

/* ═══ STAT BOXES ═══════════════════════════════════════════ */
.stats-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(197,162,74,0.08); border: 1px solid rgba(197,162,74,0.08); }
.stat-box { background: var(--navy-900); padding: 40px 24px; text-align: center; position: relative; overflow: hidden; transition: background 0.3s; }
.stat-box::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--gold-400), var(--gold-200), var(--gold-400), transparent); transform: scaleX(0); transform-origin: center; transition: transform 0.4s; }
.stat-box:hover { background: rgba(8,12,26,0.95); }
.stat-box:hover::before { transform: scaleX(1); }
.stat-num { font-family: var(--serif); font-size: 50px; font-weight: 300; line-height: 1; letter-spacing: -0.025em; margin-bottom: 10px; background: linear-gradient(180deg, var(--gold-300) 0%, var(--gold-500) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; filter: drop-shadow(0 0 20px rgba(197,162,74,0.30)); }
.stat-label { font-size: 9px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cream-40); margin-bottom: 5px; }
.stat-sub { font-size: 11.5px; font-weight: 300; color: var(--cream-20); line-height: 1.5; }

/* ═══ FOOTER ═══════════════════════════════════════════════ */
footer { background: linear-gradient(180deg,#020408 0%,#030609 100%); border-top: 1px solid rgba(197,162,74,0.12); padding: 72px 6vw 40px; }
.footer-inner { max-width: 1380px; margin: 0 auto; display: grid; grid-template-columns: 2.4fr 1fr 1fr; gap: 72px; margin-bottom: 56px; }
.footer-sig { font-family: var(--script); font-size: 32px; color: var(--gold-400); margin-bottom: 3px; }
.footer-wordmark { font-size: 7.5px; font-weight: 400; letter-spacing: 0.32em; text-transform: uppercase; color: var(--gold-700); margin-bottom: 18px; }
.footer-brand img { height: 42px; width: auto; object-fit: contain; mix-blend-mode: luminosity; filter: brightness(1.1); opacity: 0.85; margin-bottom: 16px; }
.footer-brand p { font-size: 12.5px; font-weight: 300; color: var(--cream-20); line-height: 1.75; max-width: 300px; }
.footer-col-title { font-size: 9px; font-weight: 500; letter-spacing: 0.25em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 18px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 11px; }
.footer-col ul a { font-size: 13px; font-weight: 300; color: var(--cream-20); transition: color 0.2s, padding-left 0.2s; display: flex; align-items: center; gap: 8px; }
.footer-col ul a::before { content: '—'; font-size: 10px; color: var(--gold-700); flex-shrink: 0; }
.footer-col ul a:hover { color: var(--gold-400); padding-left: 4px; }
.footer-col p { font-size: 13px; font-weight: 300; color: var(--cream-20); margin-bottom: 5px; }
.footer-col p a { color: var(--gold-500); }
.footer-disc { max-width: 1380px; margin: 0 auto; font-size: 10.5px; font-weight: 300; color: rgba(237,233,223,0.15); line-height: 1.85; border-top: 1px solid rgba(197,162,74,0.08); padding-top: 26px; }
.footer-disc-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; flex-wrap: wrap; }
.footer-disc a { color: rgba(237,233,223,0.26); }

/* ═══ SCROLL REVEAL — PREMIUM SYSTEM ══════════════════════ */
.reveal { opacity: 1; transform: none; }
.js-on .reveal {
  opacity: 0; transform: translateY(26px);
  transition: opacity 0.85s var(--transition), transform 0.85s var(--transition);
}
.js-on .reveal.in { opacity: 1; transform: none; }
.js-on .r1 { transition-delay: 0.06s; }
.js-on .r2 { transition-delay: 0.14s; }
.js-on .r3 { transition-delay: 0.22s; }
.js-on .r4 { transition-delay: 0.30s; }

/* Directional variants */
.js-on .reveal-left  { opacity: 0; transform: translateX(-26px); transition: opacity 0.85s var(--transition), transform 0.85s var(--transition); }
.js-on .reveal-right { opacity: 0; transform: translateX(26px);  transition: opacity 0.85s var(--transition), transform 0.85s var(--transition); }
.js-on .reveal-scale { opacity: 0; transform: scale(0.97);        transition: opacity 0.85s var(--transition), transform 0.85s var(--transition); }
.js-on .reveal-left.in, .js-on .reveal-right.in, .js-on .reveal-scale.in { opacity: 1; transform: none; }

/* ═══ FLOAT BUTTONS ════════════════════════════════════════ */
.float-req {
  position: fixed; bottom: 28px; right: 28px; z-index: 600;
  display: flex; align-items: center; gap: 10px;
  font-size: 9.5px; font-weight: 400; letter-spacing: 0.16em; text-transform: uppercase;
  background: linear-gradient(90deg, var(--gold-500), var(--gold-300));
  color: var(--navy-900); padding: 13px 22px; cursor: pointer; border: none;
  box-shadow: 0 8px 36px rgba(197,162,74,0.40); transition: all 0.3s var(--transition);
  position: fixed;
}
.float-req::before {
  content: ''; position: absolute; inset: -4px;
  border: 1.5px solid rgba(197,162,74,0.40);
  animation: pulseGlow 2.4s ease-in-out infinite;
  pointer-events: none;
}
.float-req:hover { transform: translateY(-3px); box-shadow: 0 14px 44px rgba(197,162,74,0.55); }

.scroll-top-btn {
  position: fixed; bottom: 100px; right: 28px; z-index: 599;
  width: 44px; height: 44px;
  background: var(--navy-600); border: 1px solid var(--gold-bd2); color: var(--gold-400);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  opacity: 0; pointer-events: none; transform: translateY(10px);
  transition: opacity 0.3s, transform 0.3s, background 0.2s;
}
.scroll-top-btn.show { opacity: 1; pointer-events: auto; transform: none; }
.scroll-top-btn:hover { background: var(--gold-500); color: var(--navy-900); }

/* ═══ PAGE HERO ════════════════════════════════════════════ */
.page-hero {
  padding: 160px 6vw 96px; position: relative; overflow: hidden;
  background: radial-gradient(ellipse 90% 70% at 60% 40%, rgba(12,18,50,0.45) 0%, var(--navy-900) 65%);
  min-height: 56vh; display: flex; align-items: flex-end;
}
.ph-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(197,162,74,0.016) 1px,transparent 1px),linear-gradient(90deg,rgba(197,162,74,0.016) 1px,transparent 1px); background-size:80px 80px; mask-image:radial-gradient(ellipse 75% 75% at 50% 50%,black 30%,transparent 100%); }
.ph-wm { position: absolute; font-family: var(--script); font-size: clamp(180px,28vw,400px); color: rgba(197,162,74,0.020); line-height: 1; right: -1vw; top: 50%; transform: translateY(-50%); pointer-events: none; user-select: none; }
.ph-content { position: relative; z-index: 2; max-width: 1380px; width: 100%; margin: 0 auto; }
.ph-eyebrow { display: flex; align-items: center; gap: 14px; font-size: 9.5px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 20px; }
.ph-eyebrow::before { content: ''; width: 28px; height: 1px; background: var(--gold-500); flex-shrink: 0; }
.ph-title { font-family: var(--serif); font-size: clamp(44px,5.5vw,82px); font-weight: 300; line-height: 1.05; letter-spacing: -0.015em; margin-bottom: 24px; }
.ph-rule { width: 52px; height: 1px; background: var(--gold-500); margin-bottom: 22px; box-shadow: 0 0 10px rgba(197,162,74,0.5); }
.ph-desc { font-size: 16px; font-weight: 300; line-height: 1.82; color: var(--cream-60); max-width: 540px; border-left: 2px solid rgba(197,162,74,0.30); padding-left: 20px; }

/* ═══ TWO-COL GRID ═════════════════════════════════════════ */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.two-col.center { align-items: center; }
.three-col { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: rgba(197,162,74,0.08); border: 1px solid rgba(197,162,74,0.08); }

/* ═══ RESPONSIVE ═══════════════════════════════════════════ */
@media (max-width: 1100px) {
  .hero-inner, .cta-inner, .two-col, .footer-inner { grid-template-columns: 1fr; }
  .hero-ring, .hero-wm, .hero-panel { display: none; }
  .engines-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 768px) {
  .pillars-wrap, .three-col, .stats-row, .engines-grid { grid-template-columns: 1fr; }
  .hamburger { display: flex; }
  .nav-links {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; background: rgba(3,6,12,0.98);
    padding: 12px 0; border-bottom: 1px solid rgba(197,162,74,0.10);
  }
  .nav-links.open { display: flex; }
  .nav-links li a { padding: 13px 32px; border-bottom: 1px solid rgba(197,162,74,0.05); }
  .nav-cta-wrap { display: none; }
  .nav-main { padding: 10px 20px; }
  .nav-topbar { padding: 6px 20px; gap: 16px; }
  .float-req { bottom: 16px; right: 16px; padding: 11px 16px; font-size: 8.5px; }
  .scroll-top-btn { bottom: 80px; right: 16px; }
  .section, .flow-section, .quote-section, .cta-section { padding: 72px 5vw; }
  .flow-track { flex-wrap: wrap; }
}


/* ══════════════════════════════════════════════════════════════
   ULTRA-PREMIUM ANIMATION SYSTEM
   Goldman Sachs · BlackRock · McKinsey Motion Language
══════════════════════════════════════════════════════════════ */

/* ── Page-load sequence — hero elements ──────────────────────
   JS overrides the inline CSS animations with controlled transitions.
   .seq-in is added by shared.js in a staggered sequence on DOMContentLoaded. */
.js-on #site-nav {
  animation: none;
  opacity: 0; transform: translateY(-10px);
  transition: opacity 0.55s var(--transition), transform 0.55s var(--transition);
}
.js-on #site-nav.seq-in { opacity: 1; transform: none; }

.js-on .hero-eyebrow,
.js-on .hero-sig-large,
.js-on .hero-wordmark,
.js-on .hero-hr,
.js-on .hero-headline,
.js-on .hero-desc,
.js-on .hero-actions,
.js-on .hero-fine,
.js-on .hero-panel,
.js-on .ph-eyebrow,
.js-on .ph-title,
.js-on .ph-rule,
.js-on .ph-desc {
  animation: none !important;
  opacity: 0; transform: translateY(22px);
  transition: opacity 0.95s var(--transition), transform 0.95s var(--transition);
}

.js-on .hero-eyebrow.seq-in,
.js-on .hero-sig-large.seq-in,
.js-on .hero-wordmark.seq-in,
.js-on .hero-hr.seq-in,
.js-on .hero-headline.seq-in,
.js-on .hero-desc.seq-in,
.js-on .hero-actions.seq-in,
.js-on .hero-fine.seq-in,
.js-on .hero-panel.seq-in,
.js-on .ph-eyebrow.seq-in,
.js-on .ph-title.seq-in,
.js-on .ph-rule.seq-in,
.js-on .ph-desc.seq-in { opacity: 1; transform: none; }

/* CTA buttons scale-in after hero-actions is revealed */
.js-on .hero-actions { transition-delay: 0s !important; }
.js-on .hero-actions.seq-in .btn-primary,
.js-on .hero-actions.seq-in .btn-secondary {
  animation: scaleReveal 0.65s var(--transition) both;
}
.js-on .hero-actions.seq-in .btn-secondary { animation-delay: 0.08s; }

/* Hero gold line — grow animation restored */
.js-on .hero-hr.seq-in { animation: lineGrow 1.1s var(--transition) forwards !important; opacity: 1 !important; transform: none !important; }

/* ── Staggered grid children ─────────────────────────────────
   JS adds .child-in with per-item delay to grid containers */
.js-on .pillars-wrap > *,
.js-on .engines-grid > *,
.js-on .three-col > *,
.js-on .stats-row > * {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.75s var(--transition), transform 0.75s var(--transition);
}
.js-on .pillars-wrap > *.child-in,
.js-on .engines-grid > *.child-in,
.js-on .three-col > *.child-in,
.js-on .stats-row > *.child-in { opacity: 1; transform: none; }

/* Suppress .reveal on items already handled as stagger children */
.js-on .pillars-wrap > .reveal,
.js-on .engines-grid > .reveal,
.js-on .three-col > .reveal,
.js-on .stats-row > .reveal {
  transition: opacity 0.75s var(--transition), transform 0.75s var(--transition) !important;
  transform: translateY(20px) !important;
}
.js-on .pillars-wrap > .reveal.child-in,
.js-on .engines-grid > .reveal.child-in,
.js-on .three-col > .reveal.child-in,
.js-on .stats-row > .reveal.child-in { opacity: 1; transform: none !important; }

/* ── Navigation — premium scroll state ──────────────────────── */
.site-nav {
  transition: padding 0.45s var(--transition), backdrop-filter 0.45s, background 0.45s, box-shadow 0.45s;
}
.site-nav.scrolled {
  box-shadow: 0 2px 48px rgba(0,0,0,0.60), 0 0 0 1px rgba(197,162,74,0.07);
  backdrop-filter: blur(52px) saturate(2.0);
  -webkit-backdrop-filter: blur(52px) saturate(2.0);
}
.site-nav.scrolled .nav-main {
  padding-top: 9px; padding-bottom: 9px;
}
/* Gold underline — glow shimmer on hover */
.nav-links li a::after {
  background: linear-gradient(90deg, var(--gold-400), var(--gold-200), var(--gold-400));
  box-shadow: 0 0 10px rgba(197,162,74,0.45);
  transition: transform 0.38s var(--transition);
}
.nav-links li a { transition: color 0.28s, text-shadow 0.28s; }
.nav-links li a:hover { text-shadow: 0 0 16px rgba(197,162,74,0.18); }

/* ── Buttons — luxury upgrade ───────────────────────────────── */
.btn-primary {
  transition: background-position 0.65s ease, transform 0.35s var(--transition), box-shadow 0.35s var(--transition);
}
.btn-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 52px rgba(197,162,74,0.46), 0 4px 18px rgba(197,162,74,0.22);
}
.btn-primary::before { transition: transform 0.70s ease; }
.btn-primary:active  { transform: translateY(-1px); transition-duration: 0.08s; }

.btn-secondary {
  position: relative; overflow: hidden;
  transition: all 0.35s var(--transition);
}
.btn-secondary::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(197,162,74,0.07), transparent);
  transform: translateX(-110%);
  transition: transform 0.65s ease;
}
.btn-secondary:hover { transform: translateY(-2px); border-color: rgba(197,162,74,0.65); color: var(--gold-300); }
.btn-secondary:hover::before { transform: translateX(110%); }

.btn-nav { transition: all 0.30s var(--transition); }
.btn-nav:hover { transform: translateY(-2px); }

/* Submit button — shine sweep on hover */
.btn-primary[type="submit"] { overflow: hidden; }
.btn-primary[type="submit"]::after {
  content: '';
  position: absolute; top: 0; left: 0; bottom: 0; width: 35%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.20), transparent);
  transform: translateX(-200%);
}
.btn-primary[type="submit"]:hover::after {
  animation: shineSweep 0.75s ease forwards;
}

/* ── Cards — premium hover elevation ───────────────────────── */
.glass-card {
  transition: transform 0.50s var(--transition), box-shadow 0.50s var(--transition), border-color 0.50s;
}
.glass-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 28px 72px rgba(0,0,0,0.65), 0 0 44px rgba(197,162,74,0.10);
  border-color: rgba(197,162,74,0.36);
}

.pillar-card {
  transition: transform 0.50s var(--transition), box-shadow 0.50s var(--transition);
}
.pillar-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 32px 80px rgba(0,0,0,0.68), 0 0 52px rgba(197,162,74,0.10);
}

.engine-card {
  transition: transform 0.42s var(--transition), background 0.42s, box-shadow 0.42s var(--transition);
}
.engine-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 52px rgba(0,0,0,0.58), 0 0 22px rgba(197,162,74,0.08);
}

/* ── Form — premium glow focus ──────────────────────────────── */
.form-input {
  transition: border-color 0.38s var(--transition), box-shadow 0.38s var(--transition), background 0.38s;
}
.form-input:focus {
  border-bottom-color: var(--gold-400);
  border-left-color: var(--gold-500);
  background: rgba(14,20,46,0.88);
  box-shadow: 0 0 0 4px rgba(197,162,74,0.07), 0 3px 22px rgba(197,162,74,0.09);
}
.form-group { transition: transform 0.3s var(--transition); }
.form-group:focus-within { transform: translateX(3px); }

/* ── Stat numbers — count-up glow ───────────────────────────── */
.stat-num { transition: filter 0.45s; }
.stat-box:hover .stat-num {
  filter: drop-shadow(0 0 30px rgba(197,162,74,0.55));
}

/* ── Flow nodes — hover pulse ────────────────────────────────── */
.flow-node .flow-circle {
  transition: border-color 0.42s var(--transition), box-shadow 0.42s var(--transition), transform 0.42s var(--transition);
}

/* ── Hero panel pillars — refined hover ─────────────────────── */
.hero-pillar {
  transition: border-left-color 0.38s var(--transition), background 0.38s var(--transition);
}

/* ── Scroll-to-top ───────────────────────────────────────────── */
.scroll-top-btn {
  transition: opacity 0.42s var(--transition), transform 0.42s var(--transition), background 0.28s, box-shadow 0.28s;
}
.scroll-top-btn.show { opacity: 1; pointer-events: auto; transform: none; }
.scroll-top-btn:hover { box-shadow: 0 8px 28px rgba(197,162,74,0.28); }

/* ── Images — luxury hover zoom ─────────────────────────────── */
.glass-card img, .pillar-card img, .engine-card img,
.two-col img, .three-col img {
  transition: transform 0.65s var(--transition-slow), opacity 0.65s;
  overflow: hidden;
}
.glass-card:hover img, .pillar-card:hover img { transform: scale(1.03); }

/* ── Reduced motion — full override ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .js-on .reveal,
  .js-on .reveal-left, .js-on .reveal-right, .js-on .reveal-scale,
  .js-on .hero-eyebrow, .js-on .hero-sig-large, .js-on .hero-wordmark,
  .js-on .hero-hr, .js-on .hero-headline, .js-on .hero-desc,
  .js-on .hero-actions, .js-on .hero-fine, .js-on .hero-panel,
  .js-on .ph-eyebrow, .js-on .ph-title, .js-on .ph-rule, .js-on .ph-desc,
  .js-on #site-nav,
  .js-on .pillars-wrap > *, .js-on .engines-grid > *,
  .js-on .three-col > *, .js-on .stats-row > * {
    opacity: 1 !important; transform: none !important;
    transition: none !important; animation: none !important;
  }
}