/* NutriDrip — Styled after drip-hydration.webflow.io */
:root {
  /* Dark navy — nav, footer, rich sections */
  --navy: #080F1E;
  --navy-mid: #0D1830;
  --navy-light: #162540;

  /* Primary teal — brighter, cleaner */
  --teal: #0B9EC8;
  --teal-dark: #0880A8;
  --teal-light: #14C0ED;

  /* Sky accents */
  --sky: #32CCEE;
  --sky-light: #7EE3F8;
  --sky-pale: #DCF7FD;
  --sky-bg: #F2FBFE;

  /* Surfaces */
  --white: #FFFFFF;
  --off-white: #F7F9FA;
  --card-bg: #FFFFFF;

  /* Text */
  --text: #080F1E;
  --text-2: #2E4460;
  --text-3: #6B8BA4;

  /* Borders — neutral gray (not blue-tinted) */
  --border: rgba(0,0,0,0.09);
  --border-strong: rgba(0,0,0,0.16);

  /* Typography */
  --font-display: 'Bricolage Grotesque', sans-serif;
  --font-serif: 'Lora', serif;

  /* Shadows — neutral depth */
  --shadow: 0 2px 16px rgba(0,0,0,0.07);
  --shadow-lg: 0 8px 40px rgba(0,0,0,0.11);

  /* Radius */
  --radius: 16px;
  --radius-sm: 10px;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--white); color:var(--text); font-family:var(--font-display); font-weight:300; overflow-x:hidden; }

/* NAV — dark navy, inspired by drip-hydration.webflow.io */
.nd-nav {
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 56px;
  background:var(--navy);
  border-bottom:1px solid rgba(255,255,255,0.07);
  transition:box-shadow .3s;
}
.nd-nav.scrolled { box-shadow:0 4px 32px rgba(0,0,0,0.35); }
.logo { font-size:24px;font-weight:700;color:#fff;letter-spacing:-0.5px;text-decoration:none; }
.logo em { font-style:normal;color:var(--sky); }
.nav-links { display:flex;gap:36px;align-items:center; }
.nav-links a { font-size:14px;color:rgba(255,255,255,0.65);text-decoration:none;font-weight:400;transition:color .2s; }
.nav-links a:hover, .nav-links a.active { color:#fff; }
.nav-cta {
  background:var(--teal)!important;color:#fff!important;
  padding:11px 26px;border-radius:50px;font-weight:600!important;
  transition:background .2s,transform .2s;
}
.nav-cta:hover { background:var(--teal-light)!important;transform:translateY(-1px); }

/* HERO */
.hero-home {
  min-height:100vh;
  background: linear-gradient(155deg, #212121 0%, #272727 35%, #028cb7 70%, #03AFE5 100%);
  display:grid;
  grid-template-columns:55% 45%;
  align-items:center;
  padding:120px 56px 80px;
  position:relative;overflow:hidden;
}

/* HERO VISUAL (right column) */
.hero-visual {
  position:relative;
  display:flex;align-items:center;justify-content:center;
  height:540px;z-index:2;
  animation:fadeUp .8s ease .4s both;
}

/* Pulse rings */
.hero-pulse-ring {
  position:absolute;border-radius:50%;
  border:1.5px solid rgba(255,255,255,0.35);
  animation:ripple 4s ease-in-out infinite;
  pointer-events:none;
}
.hero-pulse-ring:nth-child(1){width:220px;height:220px;}
.hero-pulse-ring:nth-child(2){width:330px;height:330px;animation-delay:1.4s;}
.hero-pulse-ring:nth-child(3){width:440px;height:440px;animation-delay:2.8s;}

/* IV Bag */
.iv-bag {
  position:relative;
  width:200px;height:280px;
  background:rgba(255,255,255,0.70);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.85);
  border-radius:24px;
  box-shadow:0 20px 60px rgba(10,50,80,0.18),0 4px 20px rgba(255,255,255,0.4) inset;
  display:flex;flex-direction:column;align-items:center;
  overflow:hidden;
  z-index:4;
}

/* hook / hanger at top */
.iv-bag-hook {
  width:38px;height:22px;
  border:2.5px solid rgba(3,175,229,0.55);
  border-bottom:none;
  border-radius:19px 19px 0 0;
  margin-top:-11px;
  background:rgba(255,255,255,0.5);
  flex-shrink:0;
}

.iv-bag-label {
  font-family:var(--font-serif);
  font-style:italic;
  font-size:14px;
  color:rgba(3,175,229,0.8);
  letter-spacing:0.4px;
  padding:10px 0 6px;
  flex-shrink:0;
  z-index:2;
  position:relative;
}

.iv-bag-inner {
  position:relative;
  flex:1;width:100%;
  overflow:hidden;
  border-radius:0 0 22px 22px;
}

/* Fluid fill with descent animation */
.iv-fluid {
  position:absolute;bottom:0;left:0;right:0;
  height:68%;
  background:linear-gradient(180deg,rgba(125,221,250,0.55) 0%,rgba(3,175,229,0.70) 100%);
  animation:fluidDescent 8s ease-in-out infinite;
  border-radius:0 0 20px 20px;
}
@keyframes fluidDescent {
  0%,100%{height:68%;opacity:1;}
  50%{height:64%;opacity:0.9;}
}

/* Fluid surface shimmer */
.iv-fluid::before {
  content:'';
  position:absolute;top:0;left:-40%;
  width:180%;height:12px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.45),transparent);
  animation:fluidShimmer 3s ease-in-out infinite;
  border-radius:50%;
}
@keyframes fluidShimmer {
  0%{transform:translateX(-30%) scaleY(1);}
  50%{transform:translateX(0%) scaleY(1.4);}
  100%{transform:translateX(-30%) scaleY(1);}
}

/* Nutrient bubbles inside fluid */
.iv-bubble {
  position:absolute;
  border-radius:50%;
  background:rgba(255,255,255,0.55);
  border:1px solid rgba(255,255,255,0.7);
  animation:bubbleFloat linear infinite;
}
.iv-bubble:nth-child(1){width:9px;height:9px;left:22%;animation-duration:3.8s;animation-delay:0s;}
.iv-bubble:nth-child(2){width:6px;height:6px;left:48%;animation-duration:4.4s;animation-delay:1.1s;}
.iv-bubble:nth-child(3){width:11px;height:11px;left:68%;animation-duration:3.2s;animation-delay:2s;}
.iv-bubble:nth-child(4){width:7px;height:7px;left:34%;animation-duration:5s;animation-delay:0.6s;}
.iv-bubble:nth-child(5){width:8px;height:8px;left:58%;animation-duration:4.1s;animation-delay:1.8s;}
@keyframes bubbleFloat {
  0%{bottom:4px;opacity:0;}
  10%{opacity:1;}
  90%{opacity:0.6;}
  100%{bottom:85%;opacity:0;}
}

/* Drip tube */
.iv-tube-wrap {
  position:absolute;
  bottom:-72px;
  left:50%;transform:translateX(-50%);
  z-index:5;
  display:flex;flex-direction:column;align-items:center;
}
.iv-tube-line {
  width:2px;height:52px;
  background:linear-gradient(180deg,rgba(3,175,229,0.6) 0%,rgba(3,175,229,0.25) 100%);
  border-radius:2px;
}
.iv-droplet {
  width:9px;height:12px;
  background:radial-gradient(ellipse at 40% 30%,rgba(255,255,255,0.9),rgba(125,221,250,0.85));
  border-radius:50% 50% 60% 60%;
  margin-top:2px;
  animation:dropFall 2.5s ease-in infinite;
  box-shadow:0 2px 6px rgba(3,175,229,0.3);
}
@keyframes dropFall {
  0%{opacity:0;transform:translateY(0) scaleY(0.7);}
  15%{opacity:1;transform:translateY(0) scaleY(1);}
  80%{opacity:0.9;transform:translateY(38px) scaleY(1.1);}
  100%{opacity:0;transform:translateY(48px) scaleY(0.6);}
}

/* Floating info cards */
.hero-info-card {
  position:absolute;
  background:rgba(255,255,255,0.88);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.95);
  border-radius:14px;
  box-shadow:0 8px 32px rgba(10,50,80,0.14);
  padding:14px 18px;
  z-index:6;
  animation:cardFloat ease-in-out infinite;
  min-width:160px;
}
.hero-info-card-title {
  font-size:11px;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--text-3);font-weight:500;margin-bottom:5px;
}
.hero-info-card-value {
  font-size:16px;font-weight:600;color:var(--teal);letter-spacing:-0.3px;
}
.hero-info-card-sub {
  font-size:11px;color:var(--text-2);margin-top:2px;
}

/* Progress ring inside bioavailability card */
.ic-ring-wrap {
  display:flex;align-items:center;gap:10px;
}
.ic-ring {
  flex-shrink:0;
}

/* Card positions & float timing */
.hero-info-card.card-bioavail {
  top:40px;right:-30px;
  animation-duration:5s;animation-delay:0s;
}
.hero-info-card.card-physician {
  top:38%;left:-50px;
  animation-duration:6s;animation-delay:1.5s;
}
.hero-info-card.card-schedule {
  bottom:80px;right:-20px;
  animation-duration:4.5s;animation-delay:0.8s;
}
@keyframes cardFloat {
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-10px);}
}

/* Sparkle particles */
.hero-sparkle {
  position:absolute;
  width:4px;height:4px;
  border-radius:50%;
  background:rgba(255,255,255,0.9);
  box-shadow:0 0 6px rgba(255,255,255,0.8);
  animation:sparkle ease-in-out infinite;
  z-index:3;
}
.hero-sparkle:nth-child(1){top:14%;left:62%;animation-duration:3s;animation-delay:0s;}
.hero-sparkle:nth-child(2){top:28%;right:12%;animation-duration:4s;animation-delay:1.2s;}
.hero-sparkle:nth-child(3){top:58%;left:55%;animation-duration:3.5s;animation-delay:2.1s;}
.hero-sparkle:nth-child(4){bottom:28%;right:20%;animation-duration:2.8s;animation-delay:0.5s;}
.hero-sparkle:nth-child(5){top:72%;left:62%;animation-duration:4.2s;animation-delay:1.8s;}
.hero-sparkle:nth-child(6){top:18%;left:80%;animation-duration:3.8s;animation-delay:0.9s;}
.hero-sparkle:nth-child(7){bottom:40%;left:52%;animation-duration:5s;animation-delay:2.5s;}
@keyframes sparkle {
  0%,100%{opacity:0.2;transform:scale(0.8);}
  50%{opacity:1;transform:scale(1.4);}
}
.hero-sub {
  padding:140px 56px 80px;
  background:linear-gradient(160deg,#212121 0%,#272727 40%,#028cb7 100%);
  position:relative;overflow:hidden;
}
.hero-dark {
  padding:140px 56px 80px;
  background:linear-gradient(160deg,#212121 0%,#0B3A58 40%,#03AFE5 100%);
  position:relative;overflow:hidden;
}
.hero-blobs { position:absolute;inset:0;pointer-events:none;overflow:hidden; }
.blob { position:absolute;border-radius:50%;filter:blur(90px);animation:blobFloat 8s ease-in-out infinite; }
.b1 { width:500px;height:500px;background:rgba(11,158,200,0.18);top:-100px;right:-100px; }
.b2 { width:300px;height:300px;background:rgba(50,204,238,0.10);bottom:0;left:10%;animation-delay:3s; }
.b3 { width:200px;height:200px;background:rgba(255,255,255,0.04);top:40%;right:25%;animation-delay:5s; }
@keyframes blobFloat {
  0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(20px,-30px) scale(1.05);}
}
.hero-content { position:relative;z-index:2;max-width:600px; }
.hero-badge {
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,0.6);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.8);
  padding:8px 18px;border-radius:50px;
  font-size:13px;color:var(--teal-dark);font-weight:500;
  margin-bottom:28px;animation:fadeUp .8s ease .1s both;
}
.badge-dot { width:7px;height:7px;background:var(--teal);border-radius:50%;animation:pulse2 2s ease-in-out infinite; }
@keyframes pulse2 { 0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.5;transform:scale(0.7);} }
.hero-title {
  font-size:clamp(46px,6vw,76px);font-weight:600;line-height:1.05;
  letter-spacing:-2px;color:#fff;margin-bottom:22px;
  animation:fadeUp .8s ease .25s both;
  text-shadow:0 2px 20px rgba(10,50,80,0.15);
}
.hero-title em { font-style:italic;font-family:var(--font-serif);font-weight:400; }
.hero-sub-text { font-size:17px;color:rgba(255,255,255,0.9);line-height:1.7;max-width:480px;margin-bottom:40px;font-weight:300;animation:fadeUp .8s ease .4s both; }
.hero-btns { display:flex;gap:14px;animation:fadeUp .8s ease .55s both;flex-wrap:wrap; }
.btn-white {
  background:#fff;color:var(--teal);border:none;padding:16px 32px;border-radius:50px;
  font-family:var(--font-display);font-size:14px;font-weight:500;cursor:pointer;
  transition:transform .2s,box-shadow .2s;box-shadow:0 4px 20px rgba(0,0,0,0.1);text-decoration:none;
}
.btn-white:hover { transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,0.15); }
.btn-ghost {
  background:rgba(255,255,255,0.2);color:#fff;border:1.5px solid rgba(255,255,255,0.5);
  padding:16px 32px;border-radius:50px;font-family:var(--font-display);font-size:14px;
  cursor:pointer;backdrop-filter:blur(8px);transition:background .2s,transform .2s;text-decoration:none;
}
.btn-ghost:hover { background:rgba(255,255,255,0.3);transform:translateY(-2px); }
.hero-trust { display:flex;gap:28px;margin-top:40px;animation:fadeUp .8s ease .7s both;flex-wrap:wrap; }
.trust-pill {
  display:flex;align-items:center;gap:10px;
  background:rgba(255,255,255,0.5);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.7);
  padding:10px 18px;border-radius:50px;font-size:13px;color:var(--teal-dark);
}
.trust-pill svg { width:16px;height:16px;flex-shrink:0; }

.hero-card {
  position:absolute;right:80px;bottom:80px;z-index:3;
  background:rgba(255,255,255,0.9);backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.9);border-radius:var(--radius);
  padding:24px 28px;box-shadow:var(--shadow-lg);animation:fadeUp .8s ease .9s both;min-width:220px;
}
.hero-card-label { font-size:11px;letter-spacing:1.5px;color:var(--text-3);text-transform:uppercase;margin-bottom:6px; }
.hero-card-name { font-size:18px;font-weight:600;color:var(--text);margin-bottom:14px; }
.hero-card-btn { background:var(--sky-pale);color:var(--teal);border:none;padding:8px 18px;border-radius:50px;font-size:12px;font-weight:500;cursor:pointer;font-family:var(--font-display);text-decoration:none; }
.hero-card-doc { font-size:12px;color:var(--text-3);margin-top:12px;padding-top:12px;border-top:1px solid var(--border); }

.scroll-indicator {
  position:absolute;bottom:36px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  color:rgba(255,255,255,0.7);font-size:11px;letter-spacing:2px;text-transform:uppercase;
  animation:fadeUp .8s ease 1.1s both;
}
.scroll-line { width:1px;height:40px;background:linear-gradient(180deg,rgba(255,255,255,0.6) 0%,transparent 100%);animation:scrollAnim 2s ease-in-out infinite; }
@keyframes scrollAnim { 0%,100%{opacity:0.5;transform:scaleY(1);}50%{opacity:1;transform:scaleY(1.2);} }
@keyframes fadeUp { from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);} }

/* BREADCRUMB */
.breadcrumb { font-size:12px;color:rgba(255,255,255,0.7);margin-bottom:16px; }
.breadcrumb a { color:rgba(255,255,255,0.7);text-decoration:none; }
.hero-sub h1, .hero-dark h1 { font-size:clamp(42px,5vw,68px);font-weight:600;color:#fff;letter-spacing:-2px;line-height:1.05;margin-bottom:16px; }
.hero-sub h1 em, .hero-dark h1 em { font-style:italic;font-family:var(--font-serif);font-weight:400; }
.hero-sub p, .hero-dark p { font-size:17px;color:rgba(255,255,255,0.85);max-width:520px;line-height:1.7; }

/* STATS */
.stats-row {
  background:var(--navy);padding:48px 56px;
  display:flex;justify-content:space-around;align-items:center;
  border-bottom:1px solid rgba(255,255,255,0.06);gap:24px;flex-wrap:wrap;
}
.stat-item { text-align:center; }
.stat-num { font-size:38px;font-weight:700;color:var(--sky);letter-spacing:-1px;display:block; }
.stat-label { font-size:12px;color:rgba(255,255,255,0.45);letter-spacing:1px;text-transform:uppercase;margin-top:4px; }

/* SECTIONS */
.section { padding:80px 56px; }
.section-alt { background:var(--off-white); }
.section-sky { background:var(--sky-bg); }
.eyebrow { font-size:11px;letter-spacing:2px;color:var(--teal);text-transform:uppercase;font-weight:500;margin-bottom:10px; }
.sec-title { font-size:clamp(28px,3.5vw,46px);font-weight:600;letter-spacing:-1.5px;margin-bottom:12px; }
.sec-title em { font-style:italic;font-family:var(--font-serif);color:var(--teal);font-weight:400; }
.sec-sub { font-size:15px;color:var(--text-2);line-height:1.75;max-width:480px;margin-bottom:56px; }

/* GOALS */
.goals-header { display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px; }
.goals-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.goal-card {
  background:var(--white);border-radius:var(--radius);padding:36px 32px;
  border:1px solid var(--border);cursor:pointer;
  box-shadow:var(--shadow);
  transition:border-color .25s,transform .25s,box-shadow .25s;
  position:relative;overflow:hidden;
}
.goal-card::after {
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--teal),var(--sky));
  transform:scaleX(0);transform-origin:left;transition:transform .35s;
}
.goal-card:hover { border-color:rgba(11,158,200,0.3);transform:translateY(-5px);box-shadow:var(--shadow-lg); }
.goal-card:hover::after { transform:scaleX(1); }
.goal-num {
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  background:var(--sky-pale);color:var(--teal);
  font-size:14px;font-weight:600;margin-bottom:24px;
}
.goal-title { font-size:20px;font-weight:600;margin-bottom:10px;letter-spacing:-0.5px; }
.goal-desc { font-size:14px;color:var(--text-2);line-height:1.7; }
.goal-link { display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--teal);font-weight:500;margin-top:20px; }

/* DRIP CARDS */
.drips-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.drip-card {
  background:var(--white);border-radius:var(--radius);border:1px solid var(--border);
  padding:36px 32px;cursor:pointer;box-shadow:var(--shadow);
  transition:border-color .25s,box-shadow .25s,transform .25s;
  position:relative;overflow:hidden;
}
.drip-card:hover { border-color:rgba(11,158,200,0.3);box-shadow:var(--shadow-lg);transform:translateY(-5px); }
.drip-icon {
  width:52px;height:52px;border-radius:14px;
  background:linear-gradient(135deg,var(--sky-pale),#fff);
  border:1px solid rgba(11,158,200,0.15);
  display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:24px;
  transition:background .25s,border-color .25s;
}
.drip-card:hover .drip-icon { background:linear-gradient(135deg,var(--sky-pale),var(--sky-pale));border-color:rgba(11,158,200,0.3); }
.drip-name { font-size:22px;font-weight:600;letter-spacing:-0.5px;margin-bottom:8px; }
.drip-tagline { font-size:13px;color:var(--text-2);line-height:1.7;margin-bottom:18px; }
.drip-tags { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px; }
.drip-tag { font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--teal);background:var(--sky-pale);padding:4px 10px;border-radius:50px;font-weight:600; }
.drip-price { font-size:26px;font-weight:700;color:var(--teal);letter-spacing:-0.5px; }
.drip-price span { font-size:13px;color:var(--text-3);font-weight:300; }
.drip-order-btn {
  display:block;width:100%;margin-top:20px;background:var(--navy);color:#fff;
  border:none;padding:13px;border-radius:50px;font-family:var(--font-display);
  font-size:13px;font-weight:600;cursor:pointer;transition:background .2s;text-align:center;text-decoration:none;
}
.drip-card:hover .drip-order-btn { background:var(--teal); }

/* HOW IT WORKS */
.how-layout { display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center; }
.steps { display:flex;flex-direction:column; }
.step { display:flex;gap:24px;padding:28px 0;border-bottom:1px solid rgba(125,221,250,0.2);cursor:pointer; }
.step:last-child { border-bottom:none; }
.step-num {
  width:44px;height:44px;border-radius:50%;background:var(--white);color:var(--teal);
  display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;
  flex-shrink:0;border:1.5px solid var(--border);box-shadow:0 2px 12px rgba(125,221,250,0.15);
  transition:background .3s,color .3s;
}
.step:hover .step-num { background:var(--teal);color:var(--white);border-color:var(--teal); }
.step-title { font-size:17px;font-weight:600;margin-bottom:6px;letter-spacing:-0.3px; }
.step-desc { font-size:14px;color:var(--text-2);line-height:1.7; }

/* IV VISUAL */
.how-visual { position:relative;display:flex;align-items:center;justify-content:center; }
.iv-visual {
  width:300px;height:420px;position:relative;
  background:rgba(255,255,255,0.6);backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.9);border-radius:var(--radius);
  box-shadow:var(--shadow-lg);display:flex;align-items:center;justify-content:center;
}
.ring { position:absolute;border-radius:50%;border:1.5px solid rgba(125,221,250,0.25);animation:ripple 4s ease-in-out infinite; }
.r1 { width:200px;height:200px; }
.r2 { width:300px;height:300px;animation-delay:1.3s; }
.r3 { width:400px;height:400px;animation-delay:2.6s; }
@keyframes ripple { 0%,100%{opacity:0.5;transform:scale(1);}50%{opacity:0.1;transform:scale(1.06);} }

/* CERTIFICATIONS */
.cert-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:60px; }
.cert-card {
  background:var(--white);border-radius:var(--radius);border:1px solid var(--border);
  box-shadow:var(--shadow);
  padding:32px 24px;transition:border-color .25s,box-shadow .25s,transform .25s;cursor:pointer;text-align:center;
}
.cert-card:hover { border-color:rgba(11,158,200,0.3);box-shadow:var(--shadow-lg);transform:translateY(-4px); }
.cert-icon { font-size:32px;margin-bottom:14px; }
.cert-name { font-size:17px;font-weight:600;letter-spacing:-0.3px;margin-bottom:8px; }
.cert-desc { font-size:13px;color:var(--text-2);line-height:1.6; }

/* TESTIMONIALS */
.testi-track { display:flex;gap:20px;animation:tickerScroll 30s linear infinite; }
.testi-track:hover { animation-play-state:paused; }
@keyframes tickerScroll { 0%{transform:translateX(0);}100%{transform:translateX(-50%);} }
.testi-card {
  background:var(--white);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:28px 32px;min-width:340px;flex-shrink:0;
}
.testi-stars { color:#F59E0B;font-size:14px;margin-bottom:14px;letter-spacing:2px; }
.testi-text { font-family:var(--font-serif);font-size:15px;color:var(--text);line-height:1.7;margin-bottom:16px;font-style:italic; }
.testi-name { font-size:12px;letter-spacing:1px;color:var(--text-3);text-transform:uppercase;font-weight:500; }

/* CTA STRIP */
.cta-strip {
  padding:80px 56px;
  background:linear-gradient(135deg,var(--navy) 0%,#0B3A58 50%,var(--teal) 100%);
  text-align:center;
}

/* FOOTER */
.nd-footer { background:var(--navy);padding:64px 56px 0; }
.footer-grid { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:56px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,0.08); }
.footer-logo { font-size:26px;font-weight:600;color:var(--sky-light);margin-bottom:14px;letter-spacing:-0.5px; }
.footer-tagline { font-size:14px;color:rgba(255,255,255,0.4);line-height:1.7;max-width:260px; }
.footer-col h4 { font-size:11px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.3);margin-bottom:18px;font-weight:500; }
.footer-col a { display:block;font-size:14px;color:rgba(255,255,255,0.5);text-decoration:none;margin-bottom:10px;transition:color .2s; }
.footer-col a:hover { color:var(--sky-light); }
.footer-bottom { padding:20px 0;display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,0.25); }

/* REVEAL */
.reveal { opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1;transform:translateY(0); }
.d1 { transition-delay:.1s; }
.d2 { transition-delay:.2s; }
.d3 { transition-delay:.3s; }
.d4 { transition-delay:.4s; }

/* CURSOR */
.cursor-dot { width:10px;height:10px;background:var(--teal);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .3s,height .3s; }
.cursor-ring { width:34px;height:34px;border:1.5px solid rgba(125,221,250,0.6);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:transform .12s ease-out,width .3s,height .3s; }

/* FORMS */
.form-group { display:flex;flex-direction:column;gap:7px; }
.form-label { font-size:11px;letter-spacing:1.5px;color:var(--text-3);text-transform:uppercase;font-weight:500; }
.form-input {
  background:var(--off-white);border:1.5px solid var(--border);color:var(--text);
  padding:13px 16px;font-family:var(--font-display);font-size:14px;
  border-radius:var(--radius-sm);outline:none;transition:border-color .2s,box-shadow .2s;
}
.form-input:focus { border-color:var(--sky);box-shadow:0 0 0 3px rgba(125,221,250,0.1); }
.form-input::placeholder { color:var(--text-3); }

/* ── RESPONSIVE ─────────────────────────────────────────────────── */

/* Tablet */
@media(max-width:1024px){
  .nd-nav { padding:16px 24px; }
  .hero-home { padding:100px 24px 60px; grid-template-columns:1fr; }
  .hero-visual { display:none; }
  .hero-sub, .hero-dark { padding:100px 24px 60px; }
  .hero-card { display:none; }
  .section, .stats-row, .cta-strip { padding-left:24px!important;padding-right:24px!important; }
  .goals-grid, .drips-grid { grid-template-columns:1fr 1fr; }
  .how-layout { grid-template-columns:1fr;gap:40px; }
  .cert-grid { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1fr 1fr;gap:32px; }
  .nd-footer { padding:48px 24px 0; }
}

/* Large mobile */
@media(max-width:768px){
  .section { padding-top:56px!important;padding-bottom:56px!important; }
  .hero-home { padding:88px 20px 48px!important; }
  .hero-title { font-size:clamp(34px,9vw,52px)!important;letter-spacing:-1.5px; }
  .hero-sub-text { font-size:15px!important; }
  .hero-btns { flex-direction:column;align-items:flex-start; }
  .hero-trust { gap:12px; }
  .trust-pill { font-size:12px;padding:8px 14px; }
  .stats-row { padding:28px 20px!important; }
  .stat-num { font-size:28px; }
  .goals-grid { grid-template-columns:1fr!important; }
  .drips-grid { grid-template-columns:1fr!important; }
  .goal-card,.drip-card { padding:24px 20px; }
  .cert-grid { grid-template-columns:1fr 1fr!important; }
  .testi-card { min-width:280px;padding:20px; }
  .cta-strip { padding:48px 20px!important; }
  .how-visual { display:none; }
  .scroll-indicator { display:none; }
  .goals-header { flex-direction:column;align-items:flex-start;gap:16px; }
  .hero-sub,.hero-dark { padding:88px 20px 48px!important; }
}

/* Mobile */
@media(max-width:640px){
  .nav-links { display:none; }
  .footer-bottom { flex-direction:column;gap:8px; }
  .goals-grid,.drips-grid { grid-template-columns:1fr!important; }
  .cert-grid { grid-template-columns:1fr!important; }
  .footer-grid { grid-template-columns:1fr!important;gap:24px; }
  .nd-footer { padding:40px 20px 0!important; }
  .stats-row { flex-wrap:wrap; }
  .stat-item { width:50%;padding:16px 8px;border-bottom:1px solid var(--border); }
  .stat-item:nth-child(odd){ border-right:1px solid var(--border); }
}

/* Small mobile */
@media(max-width:480px){
  .nd-nav { padding:12px 16px; }
  .logo { font-size:20px; }
  .hero-home { padding:76px 16px 40px!important; }
  .hero-badge { font-size:11px;padding:6px 14px; }
  .hero-title { font-size:clamp(28px,10vw,40px)!important; }
  .hero-btns .btn-white,.hero-btns .btn-ghost { width:100%;text-align:center;padding:15px 20px!important; }
  .section { padding-left:16px!important;padding-right:16px!important; }
  .sec-title { font-size:clamp(22px,7vw,34px); }
  .stats-row { padding-left:16px!important;padding-right:16px!important; }
  .goal-card,.drip-card { padding:18px 16px;border-radius:16px; }
  .drip-name { font-size:18px; }
  .drip-price { font-size:20px; }
  .cta-strip { padding:36px 16px!important; }
  .nd-footer { padding:28px 16px 0!important; }
  .testi-card { min-width:248px;padding:16px; }
  .hero-trust { flex-direction:column;gap:8px; }
  .form-input { font-size:16px; }
}

/* Safe area + tab bar body padding */
body { padding-bottom:env(safe-area-inset-bottom,0px); }
@media(max-width:768px){
  body.has-tab-bar { padding-bottom:calc(64px + env(safe-area-inset-bottom,0px)); }
  .nd-footer { padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))!important; }
}

/* Mobile table horizontal scroll */
@media(max-width:768px){
  .table-scroll { overflow-x:auto;-webkit-overflow-scrolling:touch; }
  .table-scroll table { min-width:520px; }
}

/* Tap target minimum */
@media(max-width:768px){
  .nav-cta,.btn-white,.btn-ghost,.drip-order-btn { min-height:48px;display:inline-flex;align-items:center;justify-content:center; }
}

/* ── MOBILE TAB BAR ─────────────────────────────────────────────── */
.mobile-tab-bar {
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:150;
  background:rgba(255,255,255,0.97);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-top:1px solid var(--border);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));
  flex-direction:row;justify-content:space-around;align-items:flex-end;
  box-shadow:0 -4px 20px rgba(125,221,250,0.10);
}
@media(max-width:768px){ .mobile-tab-bar { display:flex; } }
.tab-item {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;flex:1;text-decoration:none;padding:6px 2px;border-radius:12px;
  transition:background .15s,color .15s;border:none;background:transparent;
  cursor:pointer;font-family:var(--font-display);color:var(--text-3);min-height:44px;
}
.tab-item.active { color:var(--teal); }
.tab-item svg { width:22px;height:22px;flex-shrink:0; }
.tab-label { font-size:9px;font-weight:500;letter-spacing:0.2px;line-height:1; }
.tab-book {
  flex:1.2;background:var(--teal)!important;color:#fff!important;
  border-radius:16px;margin:0 4px;padding:8px 4px;
}
.tab-book.active { background:var(--teal-dark)!important; }
.tab-book .tab-label { color:#fff!important; }
