/* ═══════════════════════════════════════════
   TEMPLATE: HORIZON — Parallax Fullscreen Scroll
   Fullscreen secties, parallax, scroll indicator
   ═══════════════════════════════════════════ */

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

:root {
  --c: #0ea5e9;
  --c-dark: #0284c7;
  --c-10: rgba(14,165,233,.08);
  --accent: #f59e0b;
  --bg: #ffffff;
  --text: #0f172a;
  --text-muted: #64748b;
  --border: #e2e8f0;
  --ease: cubic-bezier(.22,1,.36,1);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-snap-type:y proximity; -webkit-font-smoothing:antialiased; }
body { font-family:'Outfit',system-ui,sans-serif; background:var(--bg); color:var(--text); line-height:1.7; overflow-x:hidden; }
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }

/* Typography */
h1,h2,h3 { font-weight:800; letter-spacing:-.03em; }
.serif { font-family:'Cormorant Garamond',Georgia,serif; font-style:italic; font-weight:400; }
.mega { font-size:clamp(3rem,9vw,7rem); line-height:.88; letter-spacing:-.05em; }
.xl { font-size:clamp(2rem,5vw,3.5rem); line-height:1; }
.tag { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.18em; color:var(--c); }

.w { max-width:1140px; margin:0 auto; padding:0 28px; }

/* Fullscreen sections */
.panel { min-height:100vh; position:relative; scroll-snap-align:start; display:flex; align-items:center; overflow:hidden; }

/* Parallax image */
.parallax-bg { position:absolute; inset:-20% 0; }
.parallax-bg img { width:100%; height:100%; object-fit:cover; will-change:transform; }
.parallax-ov { position:absolute; inset:0; }

/* Nav — floating pill */
.nav-pill { position:fixed; top:20px; left:50%; transform:translateX(-50%); z-index:100; background:rgba(255,255,255,.85); backdrop-filter:blur(16px); border-radius:50px; padding:8px 8px 8px 20px; display:flex; align-items:center; gap:16px; box-shadow:0 4px 24px rgba(0,0,0,.08); border:1px solid rgba(0,0,0,.04); }
.nav-pill-logo { font-weight:800; font-size:.92rem; }
.nav-pill-links { display:flex; gap:4px; }
.nav-pill-links a { font-size:.78rem; font-weight:500; padding:8px 14px; border-radius:50px; color:var(--text-muted); transition:all .2s; }
.nav-pill-links a:hover,.nav-pill-links a.active { background:var(--c-10); color:var(--c); }
.nav-pill-cta { background:var(--c); color:#fff; padding:8px 20px; border-radius:50px; font-size:.78rem; font-weight:700; transition:all .3s; }
.nav-pill-cta:hover { background:var(--c-dark); }

/* Hero panel */
.hero-panel { background:#000; }
.hero-panel .parallax-ov { background:linear-gradient(180deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.2) 40%, rgba(0,0,0,.6) 100%); }
.hero-panel .w { position:relative; z-index:2; }
.hero-panel .mega { color:#fff; }
.hero-panel .serif { color:var(--c); -webkit-text-fill-color:var(--c); }
.hero-desc { color:rgba(255,255,255,.7); font-size:1.1rem; max-width:500px; margin:24px 0 36px; }
.hero-btns { display:flex; gap:12px; }
.btn-glow { background:var(--c); color:#fff; padding:16px 36px; border-radius:50px; font-weight:700; font-size:.88rem; display:inline-flex; align-items:center; gap:10px; transition:all .3s; box-shadow:0 0 24px rgba(14,165,233,.3); }
.btn-glow:hover { box-shadow:0 0 40px rgba(14,165,233,.5); transform:translateY(-3px); }
.btn-ghost { border:1.5px solid rgba(255,255,255,.25); color:#fff; padding:16px 36px; border-radius:50px; font-weight:600; font-size:.88rem; display:inline-flex; align-items:center; gap:10px; transition:all .3s; }
.btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,.08); }

/* Scroll indicator */
.scroll-indicator { position:absolute; bottom:40px; left:50%; transform:translateX(-50%); z-index:3; display:flex; flex-direction:column; align-items:center; gap:8px; }
.scroll-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.4); animation:dotBounce 2s infinite; }
@keyframes dotBounce { 0%,100%{transform:translateY(0);opacity:.4} 50%{transform:translateY(12px);opacity:1} }
.scroll-line { width:1px; height:48px; background:linear-gradient(180deg, rgba(255,255,255,.4), transparent); }

/* Content panels */
.content-panel { background:var(--bg); }
.content-panel.alt { background:#f8fafc; }
.split { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.split-img { border-radius:20px; overflow:hidden; height:400px; }
.split-img img { width:100%; height:100%; object-fit:cover; }
.split-text .tag { margin-bottom:12px; }
.split-text .xl { margin-bottom:16px; }
.split-text p { color:var(--text-muted); margin-bottom:20px; }

/* Feature list */
.features { display:flex; flex-direction:column; gap:12px; margin-top:20px; }
.feature { display:flex; align-items:center; gap:12px; padding:12px 16px; border-radius:12px; transition:background .2s; }
.feature:hover { background:var(--c-10); }
.feature-dot { width:8px; height:8px; border-radius:50%; background:var(--c); flex-shrink:0; }
.feature span { font-weight:600; font-size:.88rem; }

/* Numbers panel */
.numbers-panel { background:var(--text); color:#fff; }
.numbers-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; text-align:center; }
.num-val { font-size:clamp(2.5rem,5vw,4rem); font-weight:900; color:var(--c); }
.num-label { font-size:.78rem; color:rgba(255,255,255,.5); margin-top:4px; text-transform:uppercase; letter-spacing:.08em; }

/* CTA panel */
.cta-panel { background:linear-gradient(135deg, #0c4a6e, var(--c-dark)); color:#fff; text-align:center; }
.cta-panel .xl { color:#fff; margin-bottom:12px; }
.cta-panel p { color:rgba(255,255,255,.7); max-width:480px; margin:0 auto 28px; }
.btn-white { background:#fff; color:var(--text); padding:16px 36px; border-radius:50px; font-weight:700; font-size:.88rem; display:inline-flex; align-items:center; gap:10px; transition:all .3s; }
.btn-white,.btn-white * { color:var(--text) !important; -webkit-text-fill-color:var(--text) !important; }
.btn-white:hover { transform:translateY(-3px); box-shadow:0 12px 32px rgba(0,0,0,.2); }

/* Footer */
.footer { background:var(--text); color:#94a3b8; padding:32px 0; text-align:center; font-size:.76rem; }
.footer a { color:var(--c); }

/* Reveals */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.visible { opacity:1; transform:translateY(0); }

/* Responsive */
@media(max-width:1024px) {
  .split { grid-template-columns:1fr; gap:32px; }
  .numbers-grid { grid-template-columns:1fr 1fr; }
  .nav-pill-links { display:none; }
}
@media(max-width:640px) {
  .hero-btns { flex-direction:column; }
  .btn-glow,.btn-ghost,.btn-white { width:100%; justify-content:center; }
  .numbers-grid { gap:20px; }
}