/* MedPull Cluely-inspired theme (light, bright, low-sat) */
:root {
  --bg-hero-start: #f8fbff;
  --bg-hero-end: #ffffff;
  --blob-1: rgba(117, 144, 255, 0.18);
  --blob-2: rgba(122, 216, 255, 0.16);
  --blob-3: rgba(255, 182, 218, 0.16);
  --text-on-hero: #0b1220;
  --muted-on-hero: #66728a;
  --brand-grad-1: #7fb4ff;
  --brand-grad-2: #86ccff;
  --brand-grad-3: #a7ecff;
  --ring: rgba(31, 65, 114, 0.15);
}

html, body { font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; background: #fff; color: #0b1220; }

/* NAV */
.site-nav { background: rgba(255,255,255,.85); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid #eef2ff; box-shadow: 0 2px 12px rgba(31,65,114,.06); padding-top: .25rem; padding-bottom: .25rem; }
.site-nav .navbar-brand { letter-spacing: -0.02em; color: #0f1629; }
.site-nav .nav-link { color: rgba(31,42,68,.8); }
.site-nav .nav-link:hover, .site-nav .navbar-brand:hover { color: #1f2a44; }
.site-nav .navbar-toggler { border: 1px solid #d9e2ff; border-radius: 8px; }

/* HERO */
.hero-landing { position: relative; padding: 7rem 0 5rem; background: radial-gradient(1200px 600px at 10% -10%, var(--blob-1), transparent 55%), radial-gradient(900px 600px at 110% 0%, var(--blob-2), transparent 60%), radial-gradient(800px 500px at 60% 120%, var(--blob-3), transparent 60%), linear-gradient(180deg, var(--bg-hero-start), var(--bg-hero-end)); color: var(--text-on-hero); overflow: hidden; }
.hero-landing:before { content: ""; position: absolute; inset: -2px; pointer-events: none; background: radial-gradient(600px 300px at 25% -10%, rgba(13, 78, 254, 0.06), transparent 60%), radial-gradient(600px 300px at 120% -20%, rgba(9,176,244,.05), transparent 60%); }

.hero-title { font-family: "EB Garamond", serif; font-weight: 600; font-size: clamp(44px, 6.5vw, 80px); line-height: 1.02; letter-spacing: -0.02em; margin: 0; color: #0f1629; }
.hero-subtitle { font-size: clamp(16px, 1.6vw, 19px); line-height: 1.5; color: var(--muted-on-hero); max-width: 44ch; }

/* CTA button */
.btn-gradient { position: relative; display: inline-flex; align-items: center; gap: .5rem; color: #0b1220; background-image: linear-gradient(135deg, var(--brand-grad-1), var(--brand-grad-2) 50%, var(--brand-grad-3)); border: 1px solid #d9e2ff; border-radius: 10px; padding: 10px 20px; font-weight: 600; box-shadow: 0 10px 28px rgba(125, 191, 255, 0.28); transition: transform .15s ease, box-shadow .15s ease; }
.btn-gradient:hover { transform: translateY(-1px); box-shadow: 0 14px 36px rgba(125, 191, 255, 0.36); color: #0b1220; }
.btn-gradient:before { content: ""; position: absolute; inset: -1px; border-radius: 10px; background: linear-gradient(90deg, rgba(255,255,255,.75), rgba(255,255,255,0) 40%, rgba(255,255,255,.75)); filter: blur(1px); opacity: .45; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; padding: 1px; pointer-events: none; }

/* Ask bar */
.ask-bar { display: inline-flex; align-items: center; gap: .75rem; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #e6ecff; box-shadow: 0 4px 16px rgba(31,65,114,.06); width: 100%; max-width: 540px; }
.ask-bar .prefix { color: var(--muted-on-hero); }
.ask-bar .prompt { font-weight: 600; letter-spacing: -0.01em; transition: opacity .18s ease; }
.ask-bar .kbd { margin-left: auto; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace; font-size: 12px; color: #6b7790; border: 1px solid #e6ecff; background: #f7faff; padding: 2px 8px; border-radius: 8px; }

/* Preview card */
.hero-preview { position: relative; border-radius: 13px; overflow: hidden; padding: 14px; background: #fff; border: 1px solid #e6ecff; box-shadow: 0 24px 60px rgba(31,65,114,.08); }
.preview-top { padding: 6px 6px 4px; border-radius: 9px; background: #f7f9ff; color: #1f2a44; }
.stat { border: 1px solid #eef2ff; background: #fff; border-radius: 10px; padding: 12px; }
.stat-label { color: #61708a; font-size: 13px; }
.stat-value { font-weight: 700; font-size: 20px; color: #1f2a44; }
.stat-accent { background: linear-gradient(180deg, rgba(125,191,255,.16), #ffffff); }

/* Logos */
.logo-row .logo { height: 42px; display: grid; place-items: center; color: #8a93a7; border: 1px dashed #e5eaf7; border-radius: 10px; background: #fff; }

/* Playful cards */
.playful-card { border-radius: 14px; border: 1px solid #eaeefc; box-shadow: 0 10px 30px rgba(31,65,114,.06); }
.playful-card .step { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; font-weight: 700; background: linear-gradient(135deg, #f2f6ff, #e9fbff); color: #385073; border: 1px solid #e6ecff; }

/* Testimonials */
.testimonials-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 360px); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
.testimonials-track > * { scroll-snap-align: start; }

/* Utilities */
.py-6 { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
.with-fixed-nav { padding-top: 4.25rem; }

/* Layering */
.hero-landing + section .container, .hero-landing nav { isolation: isolate; }

@media (min-width: 992px) {
  .hero-landing { padding-top: 8.5rem; padding-bottom: 6rem; }
}
