/* advisor-science — "The cardiologist behind the formula." (brief/advisor-science.md) — NESTED in science-index's
   main column (Pattern C), root id="advisor" (cross-page link /science#advisor + TOC "Our cardiologist").
   Desktop 1817:4690 (1050 x 849) · Mobile 1849:17795 (358 x 1257) · no tablet layer (pseudo-tablet 768–1023).
   No .container, no outer padding / margin: the 100 / 80 gaps belong to science-index.
   Mobile-first: base = mobile (anchor 390, 0.015) · 768–1023 pseudo-tablet (0.025, from M-767) · 1024+ desktop (x · s).
   Every rule is .advisor-science-scoped (GLOBAL-SCOPE LOCK). No JS, no interactive elements (D-AS-9). */

/* ---------- Mobile (base) ---------- */
.advisor-science {
  --as-gap-panels-top: clamp(26px, calc(32px + (var(--max-vw) - 390px) * 0.015), 32px);   /* intro → panels */
  --as-gap-disclosure: clamp(16px, calc(20px + (var(--max-vw) - 390px) * 0.015), 32px);   /* panels → disclosure */
  --as-gap-intro:      clamp(20px, calc(24px + (var(--max-vw) - 390px) * 0.015), 24px);   /* text ↔ photo */
  --as-gap-text:       clamp(26px, calc(32px + (var(--max-vw) - 390px) * 0.015), 40px);   /* title → quote → signature */
  --as-pad-text:       0px;
  --as-gap-signature:  clamp(3px, calc(4px + (var(--max-vw) - 390px) * 0.015), 4px);
  --as-gap-panels:     clamp(16px, calc(20px + (var(--max-vw) - 390px) * 0.015), 24px);   /* reviews ↔ warnings */
  --as-pad-box:        clamp(16px, calc(20px + (var(--max-vw) - 390px) * 0.015), 24px);
  --as-gap-box:        clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 20px);   /* heading → body */
  --as-gap-list:       clamp(10px, calc(12px + (var(--max-vw) - 390px) * 0.015), 16px);
  --as-gap-bullet:     clamp(8px, calc(10px + (var(--max-vw) - 390px) * 0.015), 10px);
  --as-bullet-w:       6px;
  --as-bullet-h:       16px;
  --as-dot-top:        10px;
  --as-dot:            6px;
  --as-quote-lh:       var(--lh-h4);                                                       /* M: Mobile/Heading/H4 1.2 */

  display: flex;
  flex-direction: column;
  align-items: stretch;
}

/* ---- Intro "Quote + photo" (1849:17796 column / 1817:4691 row) ---- */
.advisor-science__intro {
  display: flex;
  flex-direction: column;
  gap: var(--as-gap-intro);
}

/* Text column "Quote" (1849:17797 / 1817:4692) */
.advisor-science__text {
  display: flex;
  flex-direction: column;
  gap: var(--as-gap-text);
  padding-right: var(--as-pad-text);
  min-width: 0;
}

/* Title — Body/XL/Regular (Denim 400), ink (D-AS-2) */
.advisor-science__title {
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: var(--text-body-xl);
  line-height: var(--lh-body-xl);
  letter-spacing: var(--ls-body-xl);
  color: var(--color-ink);
}

/* Quote — Bethany 400, h4 size + ls; lh 1.2 M / 1.3 from 768 (D-AS-1); straight quotes verbatim (D-AS-5) */
.advisor-science__quote {
  margin: 0;
  font-family: var(--font-display);
  font-weight: var(--weight-regular);
  font-size: var(--text-h4);
  line-height: var(--as-quote-lh);
  letter-spacing: var(--ls-h4);
  color: var(--color-ink);
}

/* Signature (1849:17800 / 1817:4696) */
.advisor-science__signature {
  display: flex;
  flex-direction: column;
  gap: var(--as-gap-signature);
}

.advisor-science__name {
  font-family: var(--font-body);
  font-weight: var(--weight-medium);
  font-size: var(--text-body-lg);
  line-height: var(--lh-body-lg);
  letter-spacing: var(--ls-body-lg);
  color: var(--color-ink);
}

.advisor-science__role {
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: var(--text-body-sm);
  line-height: var(--lh-body-sm);
  letter-spacing: var(--ls-body-sm);
  color: var(--color-ink-80);
}

/* Photo (1849:17803 / 1817:4699) — 1:1 box, crop baked into the render (D-AS-7) */
.advisor-science__photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  min-width: 0;
}

.advisor-science__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---- Panels "Reviews + warnings" (1849:17805 column / 1817:4701 row) ---- */
.advisor-science__panels {
  display: flex;
  flex-direction: column;
  gap: var(--as-gap-panels);
  margin-top: var(--as-gap-panels-top);
}

/* Box ×2 — padding all sides, heading → body gap; children fill the box (Figma: fixed = box content width) */
.advisor-science__box {
  display: flex;
  flex-direction: column;
  gap: var(--as-gap-box);
  padding: var(--as-pad-box);
  min-width: 0;
}

.advisor-science__box--reviews {
  background: var(--color-off-white);
}

/* Warnings: no fill, no stroke — padding kept (D-AS-4) */
.advisor-science__box--warnings {
  background: none;
}

/* Box heading — Body/XL/Medium (Denim 500), coal */
.advisor-science__box-title {
  font-family: var(--font-body);
  font-weight: var(--weight-medium);
  font-size: var(--text-body-xl);
  line-height: var(--lh-body-xl);
  letter-spacing: var(--ls-body-xl);
  color: var(--color-coal);
}

/* Reviews list (1849:17808 / 1834:14764) */
.advisor-science__list {
  display: flex;
  flex-direction: column;
  gap: var(--as-gap-list);
  margin: 0;
  padding: 0;
  list-style: none;
}

.advisor-science__item {
  display: flex;
  align-items: flex-start;
  gap: var(--as-gap-bullet);
}

/* Bullet frame 6 x 16, padding-top 10 → 6 x 6 ink dot (D-AS-8: CSS, not an asset) */
.advisor-science__bullet {
  flex: none;
  display: block;
  width: var(--as-bullet-w);
  height: var(--as-bullet-h);
  padding-top: var(--as-dot-top);
}

.advisor-science__bullet::before {
  content: "";
  display: block;
  width: var(--as-dot);
  height: var(--as-dot);
  border-radius: 50%;
  background: var(--color-ink);
}

.advisor-science__item-text,
.advisor-science__box-text {
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: var(--text-body-lg);
  line-height: var(--lh-body-lg);
  letter-spacing: var(--ls-body-lg);
  color: var(--color-coal);
}

.advisor-science__item-text {
  flex: 1 1 0;
  min-width: 0;
}

/* Disclosure (1849:17826 / 1817:4712) — root child on both layers (D-AS-6) */
.advisor-science__disclosure {
  margin-top: var(--as-gap-disclosure);
  font-family: var(--font-body);
  font-weight: var(--weight-regular);
  font-size: var(--text-body-sm);
  line-height: var(--lh-body-sm);
  letter-spacing: var(--ls-body-sm);
  color: var(--color-ink-80);
}

/* ============================================
   PSEUDO-TABLET (768–1023): intro + panels desktop-compressed (2 columns), disclosure stack
============================================ */
@media (min-width: 768px) and (max-width: 1023px) {
  .advisor-science {
    --as-gap-panels-top: 32px;
    --as-gap-disclosure: clamp(25.66px, calc(25.66px + (var(--max-vw) - 768px) * 0.025), 32px);
    --as-gap-intro:      24px;
    --as-gap-text:       clamp(37.66px, calc(37.66px + (var(--max-vw) - 768px) * 0.025), 40px);
    --as-pad-text:       24px;
    --as-gap-signature:  4px;
    --as-gap-panels:     24px;
    --as-pad-box:        24px;
    --as-gap-box:        clamp(17.66px, calc(17.66px + (var(--max-vw) - 768px) * 0.025), 20px);
    --as-gap-list:       16px;
    --as-gap-bullet:     10px;
  }
}

/* ---------- Shared 2-column composition from 768 (D-AS-3: one rule for both rows) ---------- */
@media (min-width: 768px) {
  .advisor-science {
    --as-quote-lh: 1.3;                     /* desktop quote 41.6 / 32 (unstyled, D-AS-1) */
  }

  .advisor-science__intro,
  .advisor-science__panels {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .advisor-science__intro {
    column-gap: var(--as-gap-intro);
    align-items: center;                    /* 1817:4691 alignItems CENTER */
  }

  .advisor-science__panels {
    column-gap: var(--as-gap-panels);
    align-items: stretch;                   /* equal-height boxes (warnings drawn self-stretch) */
  }
}

/* ============================================
   DESKTOP (1024+): uniform scale of the 1920 drawing — clamp(D-min, calc(D-base · s), D-base)
============================================ */
@media (min-width: 1024px) {
  .advisor-science {
    --as-gap-panels-top: clamp(17px, calc(32px * (var(--max-vw) / var(--vw-base))), 32px);
    --as-gap-disclosure: clamp(17px, calc(32px * (var(--max-vw) / var(--vw-base))), 32px);
    --as-gap-intro:      clamp(13px, calc(24px * (var(--max-vw) / var(--vw-base))), 24px);
    --as-gap-text:       clamp(21px, calc(40px * (var(--max-vw) / var(--vw-base))), 40px);
    --as-pad-text:       clamp(13px, calc(24px * (var(--max-vw) / var(--vw-base))), 24px);
    --as-gap-signature:  clamp(2px, calc(4px * (var(--max-vw) / var(--vw-base))), 4px);
    --as-gap-panels:     clamp(13px, calc(24px * (var(--max-vw) / var(--vw-base))), 24px);
    --as-pad-box:        clamp(13px, calc(24px * (var(--max-vw) / var(--vw-base))), 24px);
    --as-gap-box:        clamp(11px, calc(20px * (var(--max-vw) / var(--vw-base))), 20px);
    --as-gap-list:       clamp(9px, calc(16px * (var(--max-vw) / var(--vw-base))), 16px);
    --as-gap-bullet:     clamp(5px, calc(10px * (var(--max-vw) / var(--vw-base))), 10px);
    --as-bullet-w:       clamp(3px, calc(6px * (var(--max-vw) / var(--vw-base))), 6px);
    --as-bullet-h:       clamp(9px, calc(16px * (var(--max-vw) / var(--vw-base))), 16px);
    --as-dot-top:        clamp(5px, calc(10px * (var(--max-vw) / var(--vw-base))), 10px);
    --as-dot:            clamp(3px, calc(6px * (var(--max-vw) / var(--vw-base))), 6px);
  }
}