/** Shopify CDN: Minification failed

Line 419:2 Unexpected "{"
Line 419:3 Expected identifier but found "%"
Line 419:86 Unexpected "{"
Line 419:87 Expected identifier but found "%"

**/


  /* ── Reset & Base ── */
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; font-size: 16px; }
  body { font-family: 'Poppins', sans-serif; background: #F7F9F9; color: #141516; -webkit-font-smoothing: antialiased; font-size: 15px; }
  img { max-width: 100%; display: block; }
  button { cursor: pointer; font-family: 'Poppins', sans-serif; border: none; }
  a { text-decoration: none; }
  ul { list-style: none; }

  /* ── Tokens ── */
  :root {
    --black: #141516;
    --navy: #1C2C3A;
    --aqua: #BBD7DC;
    --pearl: #F7F9F9;
    --navy2: #2A3D4A;
    --teal: #5A8A94;
    --bg-light: #E8F2F5;
    --bg-mid: #EFF6F8;
    --border: #D6E6EA;
    --text-mid: #4A5A66;
    --text-muted: #8FA5AD;
  }

  /* ── Utilities ── */
  .container { max-width: 1140px; margin: 0 auto; padding: 0 20px; }
  .section-py { padding: 30px 20px; }
  @media (min-width: 768px) { .section-py { padding: 40px 20px; } }
  .eyebrow { font-size: 15px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); font-weight: 600; }
  .heading-xl { font-size: clamp(30px, 4vw, 46px); font-weight: 700; color: var(--black); line-height: 1.18; }
  .heading-xl em { color: var(--navy); font-style: italic; font-weight: 600; }
  .body-sm { font-size: 15px; color: var(--text-mid); line-height: 1.8; margin: 0;}
  .divider { height: 1px; background: var(--border); }
  .pill { display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 999px; font-size: 15px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }

  /* ── NAV ── */
  nav.site-nav {
    position: sticky; top: 0; z-index: 100;
    background: var(--pearl); border-bottom: 1px solid var(--border);
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 24px;
  }
  .nav-logo { display: flex; align-items: center; gap: 10px; }
  .nav-logo-icon { width: 28px; height: 28px; border-radius: 50%; background: var(--navy); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; }
  .nav-logo-text { font-size: 15px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: var(--navy); }
  .nav-links { display: none; gap: 28px; }
  @media (min-width: 768px) { .nav-links { display: flex; } }
  .nav-links a { font-size: 15px; letter-spacing: 0.04em; color: var(--text-mid); transition: color 0.2s; }
  .nav-links a:hover { color: var(--navy); }
  .btn-nav { padding: 8px 16px; border-radius: 8px; background: var(--navy); color: #fff; font-size: 15px; font-weight: 500; transition: opacity 0.2s; }
  .btn-nav:hover { opacity: 0.88; }

  /* ── HERO CAROUSEL ── */
  .hero-carousel { position: relative; border-radius: 20px; overflow: hidden; aspect-ratio: 1/1; background: var(--bg-light); }
  .hc-track { display: flex; height: 100%; transition: transform 0.4s cubic-bezier(0.4,0,0.2,1); will-change: transform; }
  .hc-slide { min-width: 100%; height: 100%; }
  .hc-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .hc-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.9); border: none; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.2s; color: var(--navy); box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
  .hc-arrow:hover { background: #fff; }
  .hc-prev { left: 12px; }
  .hc-next { right: 12px; }
  .hc-dots { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; }
  .hc-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.5); border: none; cursor: pointer; padding: 0; transition: all 0.2s; }
  .hc-dot.active { background: #fff; width: 18px; border-radius: 3px; }
  /* Thumbnails */
  .hc-thumbs { display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .hc-thumbs::-webkit-scrollbar { display: none; }
  .hc-thumb { flex-shrink: 0; width: 60px; height: 60px; border-radius: 10px; overflow: hidden; border: 2px solid var(--border); background: none; padding: 0; cursor: pointer; transition: border-color 0.2s; }
  .hc-thumb.active { border-color: var(--navy); }
  .hc-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

  /* ── HERO ── */
  #hero { background: var(--pearl); }
  .hero-grid { display: grid; grid-template-columns: 1fr; gap: 32px; align-items: start; }
  @media (min-width: 768px) { .hero-grid { grid-template-columns: 1fr 1fr; gap: 56px; } }
  .hero-img-wrap { position: relative; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; }
  .hero-img-wrap img { width: 100%; height: 100%; object-fit: cover; }
  .hero-badge-overlay { position: absolute; top: 16px; left: 16px; background: var(--navy); color: var(--pearl); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; padding: 6px 12px; border-radius: 999px; font-weight: 600; }
  .hero-trust-row { display: flex; justify-content: center; gap: 24px; margin-top: 20px; }
  .trust-item { display: flex; flex-direction: column; align-items: center; gap: 6px; }
  .trust-icon { width: 32px; height: 32px; border-radius: 50%; background: #D6E9ED; color: var(--navy); display: flex; align-items: center; justify-content: center; }
  .trust-label { font-size: 11px; color: var(--text-mid); text-align: center; }

  /* Hero info column */
  .hero-info { display: flex; flex-direction: column; gap: 12px; }
  .stars { display: flex; gap: 3px; }
  .rating-row { display: flex; align-items: center; gap: 8px; }
  .rating-text { font-size: 15px; color: var(--text-mid); }

  /* Kit selector */
  .kit-selector { display: flex; flex-direction: column; gap: 8px; }
  .kit-label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--navy); font-weight: 700; }
  .kit-option { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-radius: 12px; border: 2px solid var(--border); background: #fff; cursor: pointer; transition: all 0.18s; }
  .kit-option.active { border-color: var(--navy); background: var(--bg-light); }
  .kit-option-left { display: flex; align-items: center; gap: 10px; }
  .radio-circle { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--border); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: border-color 0.18s; }
  .kit-option.active .radio-circle { border-color: var(--navy); }
  .radio-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--navy); display: none; }
  .kit-option.active .radio-dot { display: block; }
  .kit-option--soldout { opacity: 0.5; pointer-events: none; }
  .kit-option-name { font-size: 15px; color: var(--black); }
  .kit-option-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
  .best-val { background: var(--navy); color: var(--aqua); font-size: 10px; padding: 3px 8px; border-radius: 999px; font-weight: 600; letter-spacing: 0.07em; }
  .kit-price { font-size: 15px; font-weight: 700; color: var(--navy); }

  /* Pricing display */
  .price-row { display: flex; align-items: flex-end; gap: 12px; }
  .price-main { font-size: 32px; font-weight: 700; color: var(--navy); }
  .price-mrp { font-size: 15px; text-decoration: line-through; color: var(--text-muted); padding-bottom: 4px; }
  .save-badge { font-size: 11px; padding: 4px 10px; border-radius: 999px; background: #D6E9ED; color: var(--navy); font-weight: 700; margin-bottom: 4px; }

  /* CTA buttons */
  .btn-primary { width: 100%; padding: 16px; border-radius: 12px; background: var(--navy); color: var(--pearl); font-size: 15px; font-weight: 700; letter-spacing: 0.04em; transition: opacity 0.18s; }
  .btn-primary:hover { opacity: 0.88; }
  .btn-primary:active { transform: scale(0.98); }
  .delivery-note { font-size: 15px; color: var(--text-muted); text-align: center; }

  /* ── TRUST BAR ── */
  .trust-bar { background: var(--navy); overflow: hidden; }
  .trust-bar-marquee { overflow: hidden; }
  .trust-bar-track { display: flex; width: max-content; will-change: transform; }
  .trust-bar-inner { display: flex; overflow-x: auto; scrollbar-width: none; }
  .trust-bar-inner::-webkit-scrollbar { display: none; }
  .trust-bar-item { display: flex; align-items: center; gap: 18px; padding: 12px 20px; white-space: nowrap; flex-shrink: 0; border-right: 1px solid rgba(187,215,220,0.15); }
  .trust-bar-item span { font-size: 15px; color: var(--aqua); letter-spacing: 0.04em; }

  /* ── DESCRIPTION / PHILOSOPHY ── */
  #philosophy { background: var(--pearl); }
  .phil-header { text-align: center; max-width: 700px; margin: 0 auto 48px; }
  .phil-header p.body-sm { margin-top: 16px; }
  .stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 48px; }
  @media (min-width: 768px) { .stats-grid { grid-template-columns: repeat(3, 1fr); } }
  .stat-card { border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 8px; }
  .stat-card.dark { background: var(--navy); }
  .stat-card.light { background: #fff; border: 1px solid var(--border); }
  .stat-card.dark .stat-num { color: var(--aqua); }
  .stat-card.light .stat-num { color: var(--navy); }
  .stat-num { font-size: 32px; font-weight: 700; }
  .stat-card.dark .stat-desc { color: rgba(187,215,220,0.8); font-size: 15px; line-height: 1.6; }
  .stat-card.light .stat-desc { color: var(--text-mid); font-size: 15px; line-height: 1.6; }
  .stat-card.dark .stat-source { color: rgba(247,249,249,0.3); font-size: 11px; margin-top: auto; }
  .stat-card.light .stat-source { color: var(--text-muted); font-size: 11px; margin-top: auto; }

  .phil-prose { font-size: 15px; color: var(--text-mid); line-height: 1.9; }
  .phil-prose + .phil-prose { margin-top: 0px; }
  .phil-inner { padding: 28px 28px 36px; display: flex; flex-direction: column; gap: 0; }

  /* plain bullet list */
  .for-list-plain { display: flex; flex-direction: column; gap: 12px; list-style: disc; padding-left: 18px; }
  .for-list-plain li { font-size: 15px; color: var(--black); line-height: 1.6; padding-left: 4px; }

  /* ── LIGHT COMPARISON TABLE ── */
  .light-comp-table { border-radius: 16px; overflow: hidden; border: 1px solid var(--border); max-width: 860px; margin: 0 auto; }
  .lct-header { display: grid; grid-template-columns: 1fr 1fr; }
  .lct-th { padding: 12px 20px; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; text-align: center; }
  .lct-th-surface { background: #FFF4F3; color: #B04040; }
  .lct-th-internal { background: var(--bg-light); color: var(--navy); }
  .lct-row { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border); }
  .lct-cell { padding: 11px 20px; font-size: 15px; line-height: 1.55; }
  .lct-surface { color: #999; background: #fff; }
  .lct-row:nth-child(even) .lct-surface { background: #FAFAFA; }
  .lct-internal { color: var(--navy); font-weight: 500; }
  .lct-row:nth-child(even) .lct-internal { background: #EFF6F8; }
  .lct-row:nth-child(odd) .lct-internal { background: #F5FAFB; }

  /* ── PHIL HEADER kept for internal use ── */
  .phil-header-static { text-align: center; margin-bottom: 40px; }
.quote-mark img {
    width: 16px;
}
  /* Pillars */
  .pillars-label { text-align: center; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); font-weight: 600; margin-bottom: 24px; }
  .pillars-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
  @media (min-width: 600px) { .pillars-grid { grid-template-columns: 1fr 1fr; } }
  @media (min-width: 1024px) { .pillars-grid { grid-template-columns: repeat(5, 1fr); } }
  .pillar-card { border-radius: 16px; padding: 20px; background: #fff; border: 1px solid var(--border); display: flex; flex-direction: column; gap: 10px; }
  .pillar-top { display: flex; align-items: center; gap: 8px; }
  .pillar-title { font-size: 15px; font-weight: 700; color: var(--black); line-height: 1.4; }
  .pillar-body { font-size: 15px; color: var(--text-mid); line-height: 1.75; }
  .callout-quote { border-radius: 16px; padding: 28px 32px; text-align: center; background: var(--bg-light); border: 1px solid #C5DDE3; margin-top: 40px; }
  .callout-quote p { font-size: 15px; font-style: italic; color: var(--navy); line-height: 1.75; font-weight: 500; }
  .callout-quote .attr { font-size: 15px; color: var(--teal); font-weight: 700; margin-top: 10px; font-style: normal; }

  /* ── PROTOCOL TIMELINE ── */
  #protocol { background: #fff; }
  .timeline-header { text-align: center; margin-bottom: 48px; }
  .timeline-header p.body-sm { max-width: 500px; margin: 16px auto 0; }
  .phases-grid { display: grid; grid-template-columns: 1fr; gap: 24px; position: relative; }
  @media (min-width: 768px) { .phases-grid { grid-template-columns: repeat(3, 1fr); } }
  .connector-line { display: none; }
  @media (min-width: 768px) {
    .connector-line { display: block; position: absolute; top: 56px; left: 16.666%; right: 16.666%; height: 2px; background: linear-gradient(to right, #1C2C3A, #BBD7DC, #1C2C3A); z-index: 0; }
  }
  .phase-col { display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; z-index: 1; }
  .phase-card { border-radius: 20px; padding: 24px; width: 100%; display: flex; flex-direction: column; gap: 12px; }
  .phase-card-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
  .phase-heading { font-size: 26px; font-weight: 800; }
  .phase-kit-name { font-size: 15px; font-weight: 600; color: var(--navy); }
  .phase-hr { height: 1px; }
  .phase-goal { font-size: 15px; font-style: italic; color: var(--text-mid); line-height: 1.75; }
  .phase-pills { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 4px; }
  .phase-pill { font-size: 11px; padding: 4px 10px; border-radius: 999px; font-weight: 600; }

  /* Phase labels in timeline */
  .phase-eyebrow { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--teal); font-weight: 700; }
.cst-qut {
    display: flex;
    gap: 10px;
}
  /* Bundle callout */
  .bundle-callout { margin-top: 40px; border-radius: 20px; padding: 28px 32px; background: var(--navy); display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
  @media (min-width: 768px) { .bundle-callout { flex-direction: row; align-items: center; justify-content: space-between; } }
  .bundle-callout p.sub { font-size: 15px; color: rgba(187,215,220,0.7); }
  .bundle-callout p.price { font-size: 26px; font-weight: 800; color: var(--pearl); }
  .bundle-callout p.price span { font-size: 15px; text-decoration: line-through; color: rgba(247,249,249,0.3); margin-left: 8px; }
  .bundle-callout p.note { font-size: 15px; color: var(--aqua); }
  .btn-bundle { padding: 14px 28px; border-radius: 12px; background: var(--aqua); color: var(--black); font-size: 15px; font-weight: 700; white-space: nowrap; transition: opacity 0.18s; flex-shrink: 0; }
  .btn-bundle:hover { opacity: 0.88; }

  /* ── UNIFIED PHASE TABS ── */
  #phases-section { background: var(--pearl); }
  .phases-wrap { padding: 30px 20px; }
  @media (min-width: 768px) { .phases-wrap { padding: 40px 0; } }

  /* Tab selector row */
  .phase-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 40px; border-radius: 20px; background: #E4EEF1; padding: 8px; }
  .phase-tab-btn {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 14px 10px; border-radius: 14px; cursor: pointer; transition: all 0.25s;
    background: transparent; border: none; gap: 4px;
  }
  .phase-tab-btn.active { background: #fff; box-shadow: 0 2px 12px rgba(28,44,58,0.1); }
  .ptb-number { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; transition: color 0.2s; }
  .ptb-name { font-size: 15px; font-weight: 700; color: var(--black); }
  .ptb-days { font-size: 11px; color: var(--text-muted); }
  .ptb-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 4px; }
  .phase-tab-btn[data-phase="1"] .ptb-number { color: #1C2C3A; }
  .phase-tab-btn[data-phase="2"] .ptb-number { color: #141516; }
  .phase-tab-btn[data-phase="3"] .ptb-number { color: #2A3D4A; }
  .phase-tab-btn[data-phase="1"] .ptb-dot { background: #1C2C3A; }
  .phase-tab-btn[data-phase="2"] .ptb-dot { background: #141516; }
  .phase-tab-btn[data-phase="3"] .ptb-dot { background: #2A3D4A; }
  @media (max-width: 480px) {
    .ptb-name { font-size: 15px; }
    .ptb-days { display: none; }
  }

  /* Phase panel */
  .phase-panel { display: none; }
  .phase-panel.active { display: block; }
  .phase-layout {
    display: grid; grid-template-columns: 1fr; gap: 32px; align-items: start;
  }
  @media (min-width: 768px) {
    .phase-layout { grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
  }

  /* Image side */
  .phase-img-col { display: flex; flex-direction: column; gap: 16px; }
  .phase-img-frame {
    border-radius: 24px; overflow: hidden; aspect-ratio: 4/4; position: relative;
  }
  .phase-img-frame img { width: 100%; object-fit: cover; }
  .phase-img-badge {
    position: absolute; bottom: 16px; left: 16px; right: 16px;
    border-radius: 14px; padding: 14px 18px; backdrop-filter: blur(0px);
  }
  .phase-img-badge .pib-label { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--aqua); font-weight: 700; margin-bottom: 4px; }
  .phase-img-badge .pib-products { font-size: 15px; font-weight: 700; color: #fff; }

  /* Content side */
  .phase-content-col { display: flex; flex-direction: column; gap: 22px; }
  .phase-header-block {}
  .phase-eyebrow-tag {
    display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px;
    border-radius: 999px; margin-bottom: 14px;
  }
  .pet-dot { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 15px; }
  .pet-text { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
  .phase-title { font-size: clamp(26px, 3.5vw, 38px); font-weight: 800; color: var(--black); line-height: 1.18; margin-bottom: 6px; }
  .phase-title em { font-style: italic; font-weight: 700; }
  .phase-products-label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; color: var(--teal); }

  /* Ingredient cards */
  .ingredient-card { border-radius: 16px; padding: 18px 20px; border: 1px solid var(--border); display: flex; flex-direction: column; gap: 10px; }
  .ingredient-card + .ingredient-card { margin-top: 10px; }
  .ingr-name { font-size: 15px; font-weight: 700; color: var(--black); }
  .ingr-list { font-size: 15px; color: var(--teal); }
  .ingr-benefits { display: flex; flex-direction: column; gap: 5px; }
  .ingr-benefit { display: flex; align-items: flex-start; gap: 8px; font-size: 15px; color: var(--text-mid); line-height: 1.6; }
  .ingr-benefit .check { color: var(--navy); flex-shrink: 0; font-size: 15px; margin-top: 1px; }

  /* Before/After compact */
  .ba-compact { border-radius: 14px; overflow: hidden; border: 1px solid var(--border); }
  .ba-compact-header { display: grid; grid-template-columns: 1fr 1fr; }
  .bac-th { padding: 8px 14px; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; text-align: center; }
  .bac-th.bef { background: #FFF0EE; color: #B04040; }
  .bac-th.aft { background: var(--bg-light); color: var(--navy); }
  .bac-row { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border); }
  .bac-cell { padding: 9px 14px; font-size: 15px; line-height: 1.5; }
  .bac-cell.bef { color: #B04040; }
  .bac-cell.aft { color: var(--navy); }
  .bac-row:nth-child(even) .bac-cell.bef { background: #FFF8F7; }
  .bac-row:nth-child(odd) .bac-cell.bef { background: #fff; }
  .bac-row:nth-child(even) .bac-cell.aft { background: #EFF6F8; }
  .bac-row:nth-child(odd) .bac-cell.aft { background: #F5FAFB; }

  /* Week timeline pills */
  .weeks-row { display: flex; flex-direction: column; gap: 8px; }
  .wk-pill { border-radius: 12px; padding: 12px 16px; background: #fff; border: 1px solid var(--border); }
  .wk-pill-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
  .wk-badge { font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; background: var(--navy); color: var(--aqua); padding: 2px 8px; border-radius: 4px; }
  .wk-days { font-size: 11px; color: var(--text-muted); }
  .wk-results { display: flex; flex-direction: column; gap: 3px; }
  .wk-result { font-size: 15px; color: var(--text-mid); line-height: 1.55; display: flex; gap: 6px; }
  .wk-result span.ar { color: var(--navy); flex-shrink: 0; }

  /* Pricing bar */
  .kit-pricing-bar { border-radius: 14px; padding: 16px 20px; background: var(--navy); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .kit-pricing-bar .kp-price { font-size: 20px; font-weight: 800; color: var(--pearl); }
  .kit-pricing-bar .kp-price span { font-size: 15px; text-decoration: line-through; color: rgba(247,249,249,0.35); margin-left: 6px; }
  .btn-kit-add { padding: 10px 22px; border-radius: 10px; background: var(--aqua); color: var(--black); font-size: 15px; font-weight: 700; transition: opacity 0.18s; white-space: nowrap; }
  .btn-kit-add:hover { opacity: 0.85; }

  /* KEEP old kit-img-wrap for compatibility */
  .kit-img-wrap { border-radius: 20px; overflow: hidden; aspect-ratio: 4/3; }
  .kit-img-wrap img { width: 100%; height: 100%; object-fit: cover; }


  /* ── COMPARISON ── */
  #comparison { background: var(--black); padding: 64px 0; }
  @media (min-width: 768px) { #comparison { padding: 96px 0; } }
  .comp-header { text-align: center; margin-bottom: 48px; }
  .comp-header .eyebrow { color: var(--aqua); }
  .comp-header h2 { color: var(--pearl); }
  .comp-header h2 em { color: var(--aqua); }
  .comp-header p { color: rgba(247,249,249,0.55); max-width: 500px; margin: 16px auto 0; font-size: 15px; line-height: 1.8; }
  .comp-table { border-radius: 20px; overflow: hidden; border: 1px solid rgba(187,215,220,0.15); }
  .comp-table-header { display: grid; grid-template-columns: 1fr 1fr; }
  .comp-th { padding: 16px 24px; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; text-align: center; }
  .comp-th.surface { background: rgba(255,255,255,0.04); color: rgba(247,249,249,0.3); }
  .comp-th.internal { background: rgba(187,215,220,0.08); color: var(--aqua); }
  .comp-row { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(187,215,220,0.08); }
  .comp-cell { padding: 14px 20px; font-size: 15px; line-height: 1.6; display: flex; align-items: flex-start; gap: 8px; }
  .comp-cell.surface { color: rgba(247,249,249,0.45); }
  .comp-row:nth-child(even) .comp-cell.surface { background: rgba(255,255,255,0.02); }
  .comp-cell.internal { color: rgba(247,249,249,0.85); }
  .comp-row:nth-child(even) .comp-cell.internal { background: rgba(187,215,220,0.06); }
  .comp-row:nth-child(odd) .comp-cell.internal { background: rgba(187,215,220,0.03); }
  .comp-x { color: #B04040; flex-shrink: 0; font-size: 15px; margin-top: 2px; }
  .comp-check { color: var(--aqua); flex-shrink: 0; font-size: 15px; margin-top: 2px; }
  .comp-quote { border-radius: 16px; padding: 28px; text-align: center; background: rgba(187,215,220,0.08); border: 1px solid rgba(187,215,220,0.18); margin-top: 28px; }
  .comp-quote p { font-size: 15px; font-style: italic; color: var(--pearl); line-height: 1.75; font-weight: 500; }
  .comp-cta { text-align: center; margin-top: 28px; }
  .btn-comp { padding: 16px 40px; border-radius: 12px; background: var(--aqua); color: var(--black); font-size: 15px; font-weight: 700; transition: opacity 0.18s; }
  .btn-comp:hover { opacity: 0.88; }

  /* ── RESULTS ── */
  #results { background: var(--pearl); }
  .results-header { text-align: center; margin-bottom: 48px; }
  .results-header p.disclaimer { font-size: 15px; color: var(--text-muted); max-width: 500px; margin: 12px auto 0; line-height: 1.7; }
  .results-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 56px; }
  @media (min-width: 600px) { .results-grid { grid-template-columns: 1fr 1fr; } }
  @media (min-width: 1024px) { .results-grid { grid-template-columns: repeat(3, 1fr); } }
  .result-card { border-radius: 20px; padding: 24px; background: #fff; border: 1px solid var(--border); display: flex; flex-direction: column; gap: 12px; }
  .result-title { font-size: 15px; font-weight: 700; color: color: var(--black, var(--text-mid)); }
  .result-desc { font-size: 15px; color: var(--text-mid); line-height: 1.75; }

  /* 90-day journey timeline */
  .journey-label { text-align: center; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--teal); font-weight: 700; margin-bottom: 32px; }
  .journey-steps { display: flex; flex-direction: column; gap: 0; }
  @media (min-width: 768px) { .journey-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; } }
  .journey-step { display: flex; flex-direction: row; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--border); align-items: flex-start; }
  @media (min-width: 768px) { .journey-step { flex-direction: column; padding: 0 20px 0 0; border-bottom: none; border-right: 1px solid var(--border); } .journey-step:last-child { border-right: none; } }
  .jday { font-size: 15px; font-weight: 800; color: var(--teal); letter-spacing: 0.05em; white-space: nowrap; }
  .jevt { font-size: 15px; font-weight: 600; color: var(--black); }
  .jnote { font-size: 11px; color: var(--text-muted); }

  /* ── WHO IS IT FOR ── */
  #who { background: #fff; }
  .who-header { text-align: center; margin-bottom: 48px; }
  .who-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
  @media (min-width: 768px) { .who-grid { grid-template-columns: 1fr 1fr; } }
  .for-card { border-radius: 20px; padding: 28px 32px; background: var(--bg-light); border: 1px solid #C5DDE3; }
  .not-card { border-radius: 20px; padding: 28px 32px; background: #FFF8F7; border: 1px solid #FFCCCC; }
  .for-card-title { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
  .for-card-badge { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; }
  .for-card-badge.yes { background: var(--navy); color: #fff; }
  .for-card-badge.no { background: #B04040; color: #fff; }
  .for-card-title span { font-size: 15px; font-weight: 700; }
  .for-list { display: flex; flex-direction: column; gap: 16px; }
  .for-item { display: flex; align-items: flex-start; gap: 12px; }
  .for-item .icon { font-size: 16px; flex-shrink: 0; margin-top: 1px; }
  .for-item p { font-size: 15px; color: var(--black); line-height: 1.6; }
  .not-list { display: flex; flex-direction: column; gap: 10px; }
  .not-item { display: flex; align-items: flex-start; gap: 8px; font-size: 15px; color: #B04040; line-height: 1.6; }

  /* ── FOUNDER ── */
  #founder { background: var(--pearl); }
  .founder-grid { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
  @media (min-width: 768px) { .founder-grid { grid-template-columns: 1fr 1fr; } }
  .founder-img-wrap { position: relative; }
  .founder-img-bg { position: absolute; inset: -12px; border-radius: 28px; background: linear-gradient(135deg, rgba(187,215,220,0.2), rgba(28,44,58,0.12)); }
  .founder-img-inner { position: relative; border-radius: 20px; overflow: hidden; }
  .founder-img-inner img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
  .founder-overlay { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px; background: linear-gradient(to top, rgba(28,44,58,0.95), transparent); }
  .founder-overlay .fn { font-size: 15px; font-weight: 700; color: var(--pearl); }
  .founder-overlay .ft { font-size: 15px; color: var(--aqua); }
  {% comment %} .founder-content { display: flex; flex-direction: column; gap: 0px; } {% endcomment %}
  .quote-mark { font-size: 60px; color: var(--aqua); line-height: 0.8; }
  .founder-quote { font-size: 15px; font-style: italic; font-weight: 600; color: var(--black); line-height: 1.8; }
  .founder-text { font-size: 15px; color: var(--text-mid); }
  .founder-sig { font-size: 15px; color: var(--teal); font-weight: 700; }
.founder-sig .line {
  display: block;
}
.founder-sig {
  line-height: 1.6;
}

.founder-content p {
    margin-bottom: 6px;
}

.founder-sig .irn {
  font-size: 13px;
  opacity: 0.8;
}
  /* ── FAQ ── */
  #faq { background: var(--pearl); }
  .faq-header { text-align: center; margin-bottom: 48px; }
  .faq-list { display: flex; flex-direction: column; gap: 10px; max-width: 740px; margin: 0 auto; }
  .faq-item { border-radius: 16px; overflow: hidden; background: #fff; border: 1px solid var(--border); }
  .faq-item.open { border-color: #C5DDE3; }
  .faq-q { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; cursor: pointer; gap: 16px; }
  .faq-q span { font-size: 15px; font-weight: 600; color: var(--black); line-height: 1.5; flex: 1; }
  .faq-chevron { width: 22px; height: 22px; border-radius: 50%; background: var(--bg-light); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: transform 0.25s, background 0.2s; }
  .faq-item.open .faq-chevron { transform: rotate(180deg); background: var(--aqua); }
  .faq-a { padding: 0 22px; max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.25s; }
  .faq-item.open .faq-a { padding: 0 22px 18px; max-height: 400px; }
  .faq-a p { font-size: 15px; color: var(--text-mid); line-height: 1.8; border-top: 1px solid var(--border); padding-top: 14px; }

  /* ── FINAL CTA ── */
  #final-cta { background: var(--black); padding: 64px 0; overflow: hidden; position: relative; }
  @media (min-width: 768px) { #final-cta { padding: 96px 0; } }
  .final-cta-bg { position: absolute; inset: 0; opacity: 0.08; }
  .final-cta-bg img { width: 100%; height: 100%; object-fit: cover; }
  .final-cta-inner { position: relative; text-align: center; max-width: 860px; margin: 0 auto; }
  .final-cta-inner .eyebrow { color: var(--aqua); }
  .final-cta-inner h2 { color: var(--pearl); margin: 16px 0 20px; }
  .final-cta-inner h2 em { color: var(--aqua); }
  .final-cta-inner p.sub { color: rgba(247,249,249,0.55); font-size: 15px; max-width: 500px; margin: 0 auto 40px; line-height: 1.8; }
  .pricing-cards { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 36px; }
  @media (min-width: 768px) { .pricing-cards { grid-template-columns: repeat(3, 1fr); } }
  .pricing-card { border-radius: 20px; padding: 22px; text-align: left; display: flex; flex-direction: column; gap: 12px; }
  .pricing-card.highlight { background: var(--navy); border: 1px solid var(--aqua); }
  .pricing-card.normal { background: rgba(255,255,255,0.04); border: 1px solid rgba(187,215,220,0.12); }
  .pc-tag { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
  .pricing-card.highlight .pc-tag { color: var(--aqua); }
  .pricing-card.normal .pc-tag { color: rgba(187,215,220,0.5); }
  .pc-name { font-size: 15px; font-weight: 700; color: var(--pearl); }
  .pc-price { font-size: 26px; font-weight: 800; color: var(--pearl); }
  .pc-price span { font-size: 15px; text-decoration: line-through; color: rgba(247,249,249,0.3); margin-left: 8px; }
  .pc-sub { font-size: 15px; }
  .pricing-card.highlight .pc-sub { color: var(--aqua); }
  .pricing-card.normal .pc-sub { color: rgba(187,215,220,0.5); }
  .btn-pc { width: 100%; padding: 11px; border-radius: 10px; font-size: 15px; font-weight: 700; margin-top: auto; transition: opacity 0.18s; }
  .btn-pc:hover { opacity: 0.88; }
  .pricing-card.highlight .btn-pc { background: var(--aqua); color: var(--black); }
  .pricing-card.normal .btn-pc { background: rgba(255,255,255,0.08); color: var(--pearl); border: 1px solid rgba(255,255,255,0.12); }
  .trust-signals { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; }
  .trust-signals span { font-size: 15px; color: rgba(247,249,249,0.4); }

  /* ── RESPONSIVE HELPERS ── */
  @media (max-width: 767px) {
    .hide-mobile { display: none !important; }
  }

  /* ── HERO READ MORE ── */
  .hero-tagline-block { display: flex; flex-direction: column; gap: 0; }
  .hero-readmore-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
  .hero-readmore-content.open { max-height: max-content; }
  .hero-rm-btn {
    display: inline-flex; align-items: center; gap: 5px;
    background: none; border: none; padding: 6px 0; margin-top: 6px;
    font-size: 15px; font-weight: 600; color: var(--teal); cursor: pointer;
    transition: color 0.2s;
  }
  .hero-rm-btn:hover { color: var(--navy); }

  /* ── PHILOSOPHY ACCORDION ── */
  .phil-accordion-btn {
    width: 100%; display: flex; align-items: center; justify-content: space-between;
    gap: 16px; padding: 20px 24px; border-radius: 20px; cursor: pointer;
    background: #fff; border: 1px solid var(--border);
    transition: all 0.22s; text-align: left;
    margin-bottom: 0;
  }
  .phil-accordion-btn:hover { border-color: #A8CDD4; background: var(--bg-light); }
  .phil-accordion-btn.open { border-color: #A8CDD4; background: var(--bg-light); border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-bottom: none; }
  .phil-btn-left { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; }
  .phil-btn-icon { font-size: 22px; flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px; background: var(--bg-light); display: flex; align-items: center; justify-content: center; }
  .phil-accordion-btn.open .phil-btn-icon { background: #C5DDE3; }
  .phil-btn-title { font-size: 15px; font-weight: 700; color: var(--black); }
  .phil-btn-sub { font-size: 15px; color: var(--text-muted); margin-top: 2px; }
  .phil-btn-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
  .phil-btn-label { font-size: 15px; font-weight: 600; color: var(--teal); white-space: nowrap; }
  .phil-accordion-btn.open .phil-btn-label { color: var(--navy); }
  .phil-chevron {
    width: 28px; height: 28px; border-radius: 50%; background: var(--bg-light);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    transition: transform 0.3s, background 0.2s;
  }
  .phil-accordion-btn.open .phil-chevron { transform: rotate(180deg); background: var(--aqua); }
  .phil-accordion-body {
    max-height: 0; overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.4,0,0.2,1);
    background: var(--bg-light);
    border: 1px solid #A8CDD4; border-top: none;
    border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;
  }
  .phil-accordion-body.open { max-height: 2400px; }
  .phil-inner { padding: 40px 24px 48px; }
  .phil-header { text-align: center; margin-bottom: 40px; }

  /* ── Shopify template overrides ── */
  .shopify-section[class*="skin-reset-"] { font-family: 'Poppins', sans-serif; }
  .shopify-section[class*="skin-reset-"] *, .shopify-section[class*="skin-reset-"] *::before, .shopify-section[class*="skin-reset-"] *::after { box-sizing: border-box; }
  .shopify-section[class*="skin-reset-"] img { max-width: 100%; display: block; }
  .shopify-section[class*="skin-reset-"] button { cursor: pointer; font-family: 'Poppins', sans-serif; border: none; }
  .shopify-section[class*="skin-reset-"] ul { list-style: disc; padding: 0; margin: 0; }
  .shopify-section[class*="skin-reset-"] .for-list-plain { list-style: disc; padding-left: 18px; }
  .shopify-section[class*="skin-reset-"] a { text-decoration: none; }


@media screen and (max-width: 768px) {

  .hero-grid {
    overflow: hidden;
}
.phil-accordion-btn {
    flex-direction: column;
}

.hc-thumbs {
    
    overflow: scroll;
    max-width: 100%;
        flex-wrap: wrap;
}


.hc-slide {
    min-width: 100%;
    height: auto;
}

.hc-slide img {
    width: 100%;
    height: auto;
   
}

.hero-carousel {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: var(--bg-light);
}

section#hero .container {
    padding-top: 20px !important;
}

}


.mdj-section { background:#fff; padding:56px 0; }
.mdj-header { text-align:center; margin-bottom:48px; }

/* Tabs */
.mdj-tabs {
  display:flex; gap:8px; overflow-x:auto;
  border-bottom:1px solid #D6E6EA;
  margin-bottom:36px;
}
.mdj-tab {
  flex:1; text-align:center; padding:14px 10px;
  font-size:13px; font-weight:700;
  color:#8FA5AD; cursor:pointer; position:relative;
}
.mdj-tab::after {
  content:''; position:absolute; bottom:-1px; left:50%;
  transform:translateX(-50%);
  width:0%; height:2px; background:#1C2C3A;
  transition:0.25s;
}
.mdj-tab.active { color:#1C2C3A; }
.mdj-tab.active::after { width:60%; }

/* Panels */
.mdj-panel { display:none; animation:fade 0.3s ease; }
.mdj-panel.active { display:block; }
@keyframes fade { from{opacity:0} to{opacity:1} }

.mdj-panel-content { display:flex; flex-direction:column; gap:16px; }

.mdj-panel-phase-tag {
  padding:4px 12px; border-radius:999px;
  font-size:11px; font-weight:700;
  text-transform:uppercase;
}
.mdj-panel-period { font-size:28px; font-weight:800; }
.mdj-panel-title { font-size:16px; font-weight:700; }

/* Table */
.mdj-weeks-table {
  border:1px solid #D6E6EA;
  border-radius:14px; overflow:hidden;
}
.mdj-weeks-header {
  display:grid; grid-template-columns:1fr 1fr;
}
.mdj-wh-cell {
  padding:10px; font-size:12px;
  font-weight:700; text-align:center;
}
.mdj-week-row {
  display:grid; grid-template-columns:1fr 1fr;
  border-top:1px dashed #D6E6EA;
}
.mdj-week-cell {
  padding:12px; font-size:14px;
  text-align:center;
}

/* Phase colors */
[data-phase="1"] .mdj-panel-phase-tag { background:#E8F2F5; }
[data-phase="2"] .mdj-panel-phase-tag { background:#EBEBEB; }


.scistudies-hidden-9xA {
  height: 0;
  overflow: hidden;
  transition: height 0.4s ease;
}

.scistudies-toggle-9xA {
  margin-top: 15px;
  background: none;
  border: none;
  color: #0073e6;
  font-size: 16px;
  cursor: pointer;
  text-decoration: underline;
}
  .scistudies-main-9xA{
  background-color: #f5f5f5;
  }
  .scistudies-wrapper-9xA {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
}

.scistudies-content-9xA {
  max-width: 55%;
}

.scistudies-title-9xA {
  font-weight: 600;
    font-size: 28px;
    color: #141516;
}

.scistudies-list-9xA {
  list-style: none;
  padding: 0;
  margin: 0;
}

.scistudies-item-9xA {
  margin-bottom: 20px;
  font-size: 18px;
  line-height: 1.6;
  color: #333;
}


.scistudies-item-9xA a {
  color: #222;
  text-decoration: underline;
  transition: color 0.3s ease;
}

.scistudies-item-9xA a:hover {
  color: #0073e6;
}

.scistudies-image-9xA {
  max-width: 40%;
}

.scistudies-image-9xA img {
  width: 100%;
  height: auto;
  border-radius: 4px;
  object-fit: cover;
}

/* Responsive */
@media (max-width: 900px) {
  .scistudies-wrapper-9xA {
    flex-direction: column;
  }

  .scistudies-content-9xA,
  .scistudies-image-9xA {
    max-width: 100%;
  }

  .bundle-callout {
 
    align-items: center;
} 
}

