/* ===========================================================
   RecLaunch Ventures — shared styles (dark navy theme)
   navy #0E1A30 · panel #15243F · deep #0A1425
   paper #EEF2F8 · orange #FB5C00 · amber #FCA500
   =========================================================== */

:root {
  --navy: #0E1A30;
  --panel: #15243F;
  --deep: #0A1425;
  --paper: #EEF2F8;
  --amber: #FCA500;
  --orange: #FB5C00;
  --line: rgba(238,242,248,.12);
}

html { scroll-behavior: smooth; background: var(--navy); }
body { margin: 0; font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }

::selection { background: var(--orange); color: #fff; }

.brand-gradient { background: linear-gradient(120deg, #FCA500 0%, #FB7A00 44%, #FB5C00 74%, #E24E00 100%); }

/* ---------- Navigation (always light on dark) ---------- */
#nav { transition: background .5s ease, border-color .5s ease; border-bottom: 1px solid transparent; }
#nav.scrolled {
  background: rgba(10,20,37,.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(238,242,248,.10);
}

.nav-links a { position: relative; color: rgba(238,242,248,.72); transition: color .4s ease; }
.nav-links a:hover, .nav-links a.active { color: #fff; }
.nav-links a::after {
  content: ""; position: absolute; left: 0; bottom: -5px; height: 1px; width: 0;
  background: var(--orange); transition: width .3s ease;
}
.nav-links a:hover::after, .nav-links a.active::after { width: 100%; }

.nav-cta { color: var(--paper); border: 1px solid rgba(238,242,248,.28); transition: all .4s ease; }
.nav-cta:hover { background: var(--orange); border-color: var(--orange); color: #fff; }

.menu-btn { color: var(--paper); }

/* ---------- Mobile menu ---------- */
.mobile-menu {
  position: fixed; inset: 0; z-index: 60; background: var(--deep); color: var(--paper);
  display: flex; flex-direction: column; justify-content: center; gap: 1.75rem; padding: 2.5rem;
  transform: translateX(100%); transition: transform .5s cubic-bezier(.16,1,.3,1);
}
.mobile-menu.open { transform: none; }
.mobile-menu a { font-size: 2rem; font-weight: 700; letter-spacing: -.03em; color: var(--paper); }
.mobile-menu a.active { color: var(--orange); }
.mobile-close { position: absolute; top: 1.6rem; right: 1.6rem; color: var(--paper); }

/* ---------- Reveal on scroll ---------- */
.reveal { opacity: 0; transform: translateY(30px);
  transition: opacity 1s cubic-bezier(.16,1,.3,1), transform 1s cubic-bezier(.16,1,.3,1); will-change: opacity, transform; }
.reveal.in { opacity: 1; transform: none; }

/* ---------- Hero line mask (on load) ---------- */
.mask { display: block; overflow: hidden; padding-bottom: .08em; }
.mask > span { display: block; transform: translateY(110%); opacity: 0;
  transition: transform 1.1s cubic-bezier(.16,1,.3,1), opacity 1.1s cubic-bezier(.16,1,.3,1); }
body.loaded .mask > span { transform: none; opacity: 1; }

.fade-load { opacity: 0; transition: opacity 1s ease; }
body.loaded .fade-load { opacity: 1; }
.grow-line { transform: scaleX(0); transform-origin: left; }
body.loaded .grow-line { transform: scaleX(1); transition: transform 1s cubic-bezier(.16,1,.3,1) .2s; }

/* ---------- Hero Ken Burns ---------- */
@keyframes kenburns { from { transform: scale(1); } to { transform: scale(1.12); } }
.kenburns { animation: kenburns 26s ease-in-out infinite alternate; }

/* ---------- Marquee ---------- */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-track { animation: marquee 34s linear infinite; }

/* ---------- Sweep buttons ---------- */
.btn { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: .6rem;
  border-radius: 999px; padding: 1rem 2.25rem; font-weight: 600; font-size: .9rem; letter-spacing: -.01em;
  transition: transform .3s ease; cursor: pointer; text-decoration: none; }
.btn > * { position: relative; z-index: 1; }
.btn::before { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: 999px;
  transform: scaleY(0); transform-origin: bottom; transition: transform .5s cubic-bezier(.16,1,.3,1); }
.btn svg { transition: transform .5s ease; }
.btn:hover svg { transform: translate(2px,-2px); }
.btn-orange { background: var(--orange); color: #fff; }
.btn-orange::before { background: var(--paper); }
.btn-orange:hover { color: var(--navy); }
.btn-paper { background: var(--paper); color: var(--navy); }
.btn-paper::before { background: var(--orange); }
.btn-paper:hover { color: #fff; }
.btn-ghost { background: transparent; color: var(--paper); border: 1px solid rgba(238,242,248,.3); }
.btn-ghost::before { background: var(--orange); }
.btn-ghost:hover { color: #fff; border-color: var(--orange); }

/* ---------- Cards / misc ---------- */
.wwd-card { transition: background .5s ease, border-color .5s ease; }
.wwd-card .arrow { opacity: 0; transform: translate(8px,-8px); transition: all .5s ease; }
.wwd-card:hover .arrow { opacity: 1; transform: none; }
.gal img { transition: transform .9s ease; }
.gal:hover img { transform: scale(1.05); }
.zoom-wrap img { transition: transform .9s ease; }
.zoom-wrap:hover img { transform: scale(1.05); }

.who-row { transition: padding-left .5s ease; }
.who-row:hover { padding-left: 1rem; }

/* package list rows */
.pkg-row { transition: background .35s ease, padding-left .35s ease; }
.pkg-row:hover { background: rgba(251,92,0,.08); padding-left: 1.25rem; }

@media (prefers-reduced-motion: reduce) {
  .marquee-track, .kenburns { animation: none; }
  .reveal { opacity: 1; transform: none; }
  .mask > span { opacity: 1; transform: none; }
}