/* ==========================================================================
   Fresh look (2026-11): soft, friendly blog style for moms 35-55.
   Loads after style.css and only overrides. Delete this file to go back.
   ========================================================================== */

@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("/fonts/playfair/playfair-display-latin-wght-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: italic;
  font-weight: 400 900;
  font-display: swap;
  src: url("/fonts/playfair/playfair-display-latin-wght-italic.woff2") format("woff2");
}
@font-face {
  font-family: "Lora";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/lora/lora-latin-wght-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Lora";
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/lora/lora-latin-wght-italic.woff2") format("woff2");
}

:root {
  /* type */
  --font-heading: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Lora", Georgia, "Times New Roman", serif;
  --font-size-base: 18px;
  --tracking-heading: 0;
  --display-weight: 600;

  /* palette: lavender leads, blush and cream support */
  --color-heading: #6f4f99;       /* lavender headings */
  --color-primary: #8a6fb0;       /* buttons, links */
  --color-primary-hover: #74589b;
  --color-primary-foreground: #ffffff;
  --color-link: #7a5ca3;
  --color-link-surface: #7a5ca3;
  --color-link-table: #7a5ca3;
  --color-lavender-soft: #efe8f8;
  --color-lavender-mist: #f7f3fc;
  --color-blush: #fbe9e3;
  --color-blush-deep: #f3d3c8;
  --color-surface: #fbf7f2;
  --color-muted: #fbf7f2;
  --color-tint: #fbe9e3;
  --color-dark: #5b4778;          /* plum band, now lighter and more lavender */
  --color-foreground: #3f3a45;
  --color-border: #e9e1f2;
  --ring: #d9c9ee;                /* thin border around product circles */
  --ring-blush: #f1cfc2;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --shadow-soft: 0 6px 18px rgba(110, 80, 150, 0.12);
}

body.composition-v2 {
  font-family: var(--font-body);
  color: var(--color-foreground);
  background: #fff;
}

/* ---------- headings ---------- */
body.composition-v2 h1,
body.composition-v2 h2,
body.composition-v2 h3,
body.composition-v2 h4,
body.composition-v2 .hero__title,
body.composition-v2 .category-tiles__heading,
body.composition-v2 .process-steps__heading {
  font-family: var(--font-heading);
  font-weight: 600;
  color: var(--color-heading);
  letter-spacing: 0;
}
body.composition-v2 .prose__inner h2 {
  position: relative;
  padding-bottom: 0.35em;
}
/* the little flourish under section headings, a classic blog-theme touch */
body.composition-v2 .prose__inner h2::after,
body.composition-v2 .band-head h2::after,
body.composition-v2 .process-steps__heading::after {
  content: "";
  display: block;
  width: 64px;
  height: 10px;
  margin-top: 0.4em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='10' viewBox='0 0 64 10'%3E%3Cpath d='M2 5 Q 10 0 18 5 T 34 5 T 50 5 T 62 5' fill='none' stroke='%23c98b6b' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
}
body.composition-v2 .process-steps__heading::after { margin-inline: auto; }

/* ---------- links and buttons ---------- */
body.composition-v2 .prose__inner a { color: var(--color-link); text-decoration-color: #d9c9ee; text-underline-offset: 3px; text-decoration-thickness: 2px; }
body.composition-v2 .prose__inner a:hover { text-decoration-color: var(--color-link); }

body.composition-v2 .button {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.95rem;
  border-radius: 999px;
  padding: 0.75em 1.6em;
  letter-spacing: 0.01em;
  transition: background-color 0.2s, box-shadow 0.2s, transform 0.2s;
}
body.composition-v2 .button--primary {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
  box-shadow: 0 4px 12px rgba(138, 111, 176, 0.35);
}
body.composition-v2 .button--primary:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  transform: translateY(-1px);
}
body.composition-v2 .button--secondary {
  background: #fff;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
}
body.composition-v2 .button--secondary:hover { background: var(--color-lavender-soft); }

/* ---------- top bar + header ---------- */
.topbar {
  background: var(--color-lavender-soft) url("/patterns/swirl.svg") repeat-x center / auto 120%;
  color: #5b4778;
  font-size: 0.82rem;
  text-align: center;
  padding: 0.45em 1em;
  font-family: var(--font-body);
}
body.composition-v2 .site-header {
  background: #fff;
  border-bottom: 1px solid var(--color-border);
  box-shadow: 0 2px 10px rgba(110, 80, 150, 0.06);
}
body.composition-v2 .site-header__wordmark {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 600;
  color: var(--color-heading);
  font-size: 1.45rem;
}
body.composition-v2 .site-header__disclosure,
body.composition-v2 .site-header__nav a { font-family: var(--font-body); }

/* ---------- home hero ---------- */
body.composition-v2 .hero--immersive { min-height: min(78vh, 640px); }
body.composition-v2 .hero--immersive .hero__image { object-position: center; }
body.composition-v2 .hero--immersive::after {
  /* soft white wash on the left so the headline reads on the photo */
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.86) 44%, rgba(255, 255, 255, 0) 70%);
  z-index: 0;
  pointer-events: none;
}
@media (max-width: 900px) {
  body.composition-v2 .hero--immersive::after {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0.72) 70%, rgba(255, 255, 255, 0.4) 100%);
  }
}
body.composition-v2 .hero--immersive .hero__inner { z-index: 2; }
body.composition-v2 .hero--immersive .hero__title {
  color: var(--color-heading);
  text-shadow: none;
  max-width: 11.5em;
}

/* ---------- article heroes: patterned soft band ---------- */
body.composition-v2 .hero--editorial {
  background:
    url("/patterns/circles.svg") repeat right top / 320px,
    linear-gradient(135deg, var(--color-lavender-mist) 0%, var(--color-blush) 100%);
  border-bottom: 1px solid var(--color-border);
}
body.composition-v2 .hero--editorial .hero__title { max-width: 18em; }

/* ---------- colour bands with patterns ---------- */
body.composition-v2 .scheme-tint {
  background: url("/patterns/swirl.svg") repeat center / 420px, var(--color-blush);
}
body.composition-v2 .scheme-surface:not(.hero) {
  background: url("/patterns/circles.svg") repeat 0 0 / 320px, var(--color-surface);
}
body.composition-v2 .scheme-dark {
  background:
    url("/patterns/circles.svg") repeat 0 0 / 280px,
    linear-gradient(135deg, #6b5391 0%, #8a6fb0 100%);
  color: #fff;
}
body.composition-v2 .scheme-dark .process-steps__heading,
body.composition-v2 .scheme-dark h2,
body.composition-v2 .scheme-dark h3 { color: #fff; }
body.composition-v2 .scheme-dark .process-steps__heading::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='10' viewBox='0 0 64 10'%3E%3Cpath d='M2 5 Q 10 0 18 5 T 34 5 T 50 5 T 62 5' fill='none' stroke='%23f3d3c8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
body.composition-v2 .scheme-dark .process-steps__item {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--radius-lg);
}

/* ---------- product images: circles with a thin pastel ring ---------- */
body.composition-v2 .gallery__image,
body.composition-v2 .category-tiles__image {
  aspect-ratio: 1 / 1;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
  border: 3px solid var(--ring);
  outline: 6px solid #fff;
  outline-offset: -9px;
  box-shadow: var(--shadow-soft);
  background: var(--color-lavender-soft);
}
body.composition-v2 .gallery__item:nth-child(2) .gallery__image { border-color: var(--ring-blush); }
body.composition-v2 .gallery__items { gap: 2.5rem; justify-items: center; }
body.composition-v2 .gallery__figure { max-width: 340px; text-align: center; }
body.composition-v2 .gallery { padding-bottom: 1rem; }
body.composition-v2 .gallery__caption { font-style: italic; color: #6b6474; margin-top: 0.8em; }

/* tile grids: circle on top, friendly card underneath */
body.composition-v2 .category-tiles:not(.category-tiles--rows) .category-tiles__item {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 1.2rem 1.2rem 1rem;
  text-align: center;
  box-shadow: 0 2px 8px rgba(110, 80, 150, 0.06);
  transition: box-shadow 0.2s, transform 0.2s;
}
body.composition-v2 .category-tiles:not(.category-tiles--rows) .category-tiles__item:hover {
  box-shadow: var(--shadow-soft);
  transform: translateY(-2px);
}
body.composition-v2 .category-tiles:not(.category-tiles--rows) .category-tiles__image {
  width: 72%;
  margin: 0 auto 0.8rem;
}
body.composition-v2 .category-tiles__label {
  font-family: var(--font-heading);
  color: var(--color-heading);
}

/* home "finder" rows: round thumbnail, softer row card */
body.composition-v2 .category-tiles--rows .category-tiles__item {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  margin-bottom: 0.9rem;
  padding: 0.9rem 1.2rem;
}
body.composition-v2 .category-tiles--rows .category-tiles__image {
  width: 112px;
  height: 112px;
  outline-width: 4px;
  outline-offset: -7px;
}
body.composition-v2 .category-tiles__kicker {
  color: #b0705a;
  font-family: var(--font-body);
  font-style: italic;
  text-transform: none;
  letter-spacing: 0;
}
body.composition-v2 .category-tiles__cta {
  background: var(--color-primary);
  color: #fff;
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.65em 1.4em;
  text-align: center;
  box-shadow: 0 3px 10px rgba(138, 111, 176, 0.3);
}
body.composition-v2 .category-tiles__item:hover .category-tiles__cta { background: var(--color-primary-hover); }

/* ---------- tables: softer, striped ---------- */
body.composition-v2 .prose__table-wrap {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: 0 2px 10px rgba(110, 80, 150, 0.06);
}
body.composition-v2 .prose__table thead th {
  background: var(--color-lavender-soft);
  color: #5b4778;
  font-family: var(--font-heading);
}
body.composition-v2 .prose__table tbody tr:nth-child(even) { background: #fcfaff; }
body.composition-v2 .prose__cell--row { color: #5b4778; }

/* FAQ boxes */
body.composition-v2 .faq { background: var(--color-lavender-mist); }

/* ---------- footer ---------- */
body.composition-v2 .site-footer {
  background: url("/patterns/swirl.svg") repeat center / 420px, #f3edf9;
  color: #5b4778;
  border-top: 1px solid var(--color-border);
}
body.composition-v2 .site-footer__org {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 1.3rem;
  color: var(--color-heading);
}

/* touch-ups after the first mockup */
body.composition-v2 .site-footer__note,
body.composition-v2 .site-footer__copyright { color: #6b5a82; }
body.composition-v2 .scheme-dark .process-steps__item::before { color: #f6d6ca; }
body.composition-v2 .category-tiles__cta { white-space: nowrap; }
@media (max-width: 480px) {
  body.composition-v2 .site-header__wordmark { font-size: 1.1rem; white-space: normal; }
}

/* ---------- share links ---------- */
.share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.6rem;
  font-family: var(--font-body);
}
.share--top {
  max-width: var(--container-max);
  margin: 1.1rem auto 0;
  padding-inline: var(--gutter);
}
.share--end {
  margin: 2.2rem 0 0;
  padding: 1.1rem 1.2rem;
  background: var(--color-lavender-mist);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}
.share__label { font-style: italic; color: #6b5a82; margin-right: 0.3rem; font-size: 0.95rem; }
body.composition-v2 .share__link {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  padding: 0.4em 0.95em 0.4em 0.45em;
  border-radius: 999px;
  background: #fff;
  border: 1.5px solid var(--color-border);
  color: #5b4778;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.2s, border-color 0.2s;
}
body.composition-v2 .share__link:hover { background: var(--color-lavender-soft); border-color: #d9c9ee; }
.share__link--pin { color: #c8232c !important; border-color: #f2c4c6 !important; }
.share__link--pin span { color: #5b4778; }
.share__link--fb { color: #4a67b3 !important; }
.share__link--x { color: #3f3a45 !important; }
.share__link--mail { color: #8a6fb0 !important; }
.share__link span { color: #5b4778; }

/* ---------- pin image inside the article ---------- */
.pin-figure {
  margin: 2.5rem auto 0;
  max-width: 360px;
  text-align: center;
}
.pin-figure img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.pin-figure figcaption { margin-top: 0.7rem; font-style: italic; color: #6b6474; font-size: 0.95rem; }

/* ---------- article + compare sidebar ---------- */
.compare-sidebar__box {
  background: url("/patterns/circles.svg") repeat 0 0 / 260px, var(--color-lavender-mist);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 1.4rem 1.2rem 1.3rem;
}
body.composition-v2 .compare-sidebar__heading {
  font-size: 1.25rem;
  margin: 0 0 0.6rem;
  color: var(--color-heading);
}
body.composition-v2 .compare-sidebar__heading::after { display: none; }
.compare-sidebar__heading + .compare-sidebar__list + .compare-sidebar__heading,
.compare-sidebar__list + .compare-sidebar__heading { margin-top: 1.3rem; }
.compare-sidebar__list { list-style: none; margin: 0; padding: 0; }
.compare-sidebar__list li + li { margin-top: 0.15rem; }
body.composition-v2 .compare-sidebar__list a {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.35rem 0.45rem;
  border-radius: var(--radius-md);
  color: #4a3f58;
  text-decoration: none;
  font-size: 0.95rem;
  line-height: 1.3;
}
body.composition-v2 .compare-sidebar__list a:hover { background: #fff; color: var(--color-heading); }
.compare-sidebar__list .is-current a { background: #fff; font-weight: 600; color: var(--color-heading); }
.compare-sidebar__list img {
  width: 48px;
  height: 48px;
  flex: none;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--ring);
  background: #fff;
}
.compare-sidebar__all { display: block; text-align: center; margin-top: 1.2rem; }

.with-sidebar { display: block; }
.with-sidebar .compare-sidebar { padding: 0 var(--gutter) 3rem; max-width: 640px; margin: 0 auto; }

@media (min-width: 1100px) {
  .with-sidebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 3rem;
    max-width: var(--container-max);
    margin: 0 auto;
    padding-inline: var(--gutter);
    align-items: start;
  }
  .with-sidebar > .prose { padding-inline: 0; }
  body.composition-v2 .with-sidebar .prose__inner { max-width: none; padding-inline: 0; margin: 0; }
  .with-sidebar .compare-sidebar {
    position: sticky;
    top: 1.5rem;
    padding: 0;
    margin: calc(var(--spacing-unit) * 12) 0 3rem;
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
  }
}

/* ---------- home hero, round 2: text panel left, photo right ---------- */
body.composition-v2 .hero--immersive::after { display: none; }
body.composition-v2 .hero--immersive {
  background: url("/patterns/circles.svg") repeat 0 0 / 320px, linear-gradient(135deg, var(--color-lavender-mist) 0%, var(--color-blush) 100%);
  min-height: 0;
}
@media (min-width: 900px) {
  body.composition-v2 .hero--immersive { min-height: 560px; display: flex; align-items: center; }
  body.composition-v2 .hero--immersive .hero__image {
    left: auto;
    right: 0;
    width: 56%;
    height: 100%;
    object-fit: cover;
    object-position: 38% 60%;
    border-radius: 0 0 0 120px;
  }
  body.composition-v2 .hero--immersive .hero__inner {
    width: 100%;
    max-width: var(--container-max);
    margin: 0 auto;
    padding-inline: var(--gutter);
  }
  body.composition-v2 .hero--immersive .hero__title,
  body.composition-v2 .hero--immersive .hero__cta { max-width: 40%; }
  body.composition-v2 .hero--immersive .hero__title { font-size: clamp(2.2rem, 3.4vw, 3.3rem); }
  body.composition-v2 .hero--immersive .hero__cta { flex-wrap: wrap; }
}
@media (max-width: 899px) {
  body.composition-v2 .hero--immersive { display: flex; flex-direction: column-reverse; }
  body.composition-v2 .hero--immersive .hero__image {
    position: static;
    width: 100%;
    height: 260px;
    object-fit: cover;
    object-position: 40% 65%;
  }
}

/* pin image and spacing inside the article */
body.composition-v2 .prose__inner .pin-figure { max-width: 340px; width: 100%; margin-inline: auto; }
body.composition-v2 .with-sidebar > .prose { padding-top: 1.5rem; }
@media (min-width: 1100px) { .with-sidebar .compare-sidebar { margin-top: 2.5rem; } }
body.composition-v2 .gallery { padding-bottom: 0; margin-bottom: 0; }

/* =====================================================================
   Round 3 (Greg's notes): plain two-column home hero, lighter buttons,
   static sidebar, no scrollbars anywhere, full-width tables.
   ===================================================================== */

/* home hero: text left, photo right, both inside the page container */
.home-hero {
  background: url("/patterns/circles.svg") repeat 0 0 / 320px, linear-gradient(135deg, var(--color-lavender-mist) 0%, var(--color-blush) 100%);
  border-bottom: 1px solid var(--color-border);
}
.home-hero__inner {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 3.5rem var(--gutter);
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: center;
}
@media (min-width: 900px) {
  .home-hero__inner { grid-template-columns: 5fr 6fr; gap: 3.5rem; padding-block: 4.5rem; }
}
.home-hero__kicker {
  font-style: italic;
  color: #b0705a;
  margin: 0 0 0.6rem;
  font-size: 1.05rem;
}
body.composition-v2 .home-hero__title {
  font-size: clamp(2rem, 3.6vw, 3rem);
  line-height: 1.15;
  margin: 0 0 1rem;
  max-width: 16em;
}
body.composition-v2 .home-hero__title::after { display: none; }
.home-hero__lede { font-size: 1.15rem; line-height: 1.6; margin: 0; max-width: 30em; color: #4a3f58; }
.home-hero__photo { margin: 0; }
.home-hero__photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  border: 6px solid #fff;
}

/* lighter buttons */
body.composition-v2 .site-header__cta.button--primary {
  background: transparent;
  color: var(--color-primary);
  border: 2px solid var(--color-primary);
  box-shadow: none;
  font-size: 0.85rem;
  padding: 0.5em 1.1em;
}
body.composition-v2 .site-header__cta.button--primary:hover { background: var(--color-lavender-soft); transform: none; }
body.composition-v2 .button--primary { box-shadow: none; }
body.composition-v2 .category-tiles__cta {
  background: none;
  box-shadow: none;
  padding: 0;
  color: var(--color-primary);
  font-size: 0.95rem;
  text-align: left;
  border-radius: 0;
}
body.composition-v2 .category-tiles__item:hover .category-tiles__cta { background: none; color: var(--color-primary-hover); text-decoration: underline; }
body.composition-v2 .compare-sidebar__all {
  background: none;
  border: 0;
  color: var(--color-primary);
  padding: 0;
  text-align: left;
  font-size: 0.95rem;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* sidebar: static, no scroll box */
@media (min-width: 1100px) {
  .with-sidebar .compare-sidebar {
    position: static;
    max-height: none;
    overflow: visible;
  }
}

/* tables: full width of the article, no scroll box, no sticky header */
body.composition-v2 .prose__table-wrap,
body.composition-v2 .prose__inner > .prose__table-wrap {
  overflow: visible;
  max-height: none;
  width: 100%;
  margin-inline: 0;
}
body.composition-v2 .prose__table-wrap > .prose__table { min-width: 0; width: 100%; }
body.composition-v2 .prose__table thead .prose__cell { position: static; }
body.composition-v2 .prose__table .prose__cell { overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 600px) {
  body.composition-v2 .prose__table .prose__cell { padding: 0.55rem 0.6rem; font-size: 0.88rem; }
}
body.composition-v2 .prose__table thead td.prose__cell { background: var(--color-lavender-soft); }

/* share links: plain icon + label, centered, no pill outline */
.share { justify-content: center; }
.share--top { padding-block: 0.4rem; }
body.composition-v2 .share__link {
  background: none;
  border: 0;
  padding: 0.35em 0.6em;
  border-radius: 6px;
}
body.composition-v2 .share__link:hover { background: var(--color-lavender-soft); }
.share--end { text-align: center; }

/* share links: one soft lavender, lighter text */
body.composition-v2 .share__link,
body.composition-v2 .share__link--pin,
body.composition-v2 .share__link--fb,
body.composition-v2 .share__link--x,
body.composition-v2 .share__link--mail { color: #a48cc7 !important; border: 0 !important; }
body.composition-v2 .share__link span,
body.composition-v2 .share__link--pin span {
  color: #7a6596;
  font-weight: 400;
  font-size: 0.92rem;
  letter-spacing: 0.01em;
}
body.composition-v2 .share__link:hover span { color: var(--color-heading); }
.share__label { color: #9a8ab0; font-size: 0.92rem; }

/* tables, round 2: break between words only; row labels keep a sensible width */
body.composition-v2 .prose__table .prose__cell { overflow-wrap: break-word; word-break: normal; hyphens: manual; }
body.composition-v2 .prose__table .prose__cell--row { min-width: 8.5em; }
body.composition-v2 .prose__table a { overflow-wrap: anywhere; }

/* phones: each row becomes a small card, every value labelled with its column */
@media (max-width: 640px) {
  body.composition-v2 .prose__table-wrap { border: 0; box-shadow: none; background: none; }
  body.composition-v2 .prose__table,
  body.composition-v2 .prose__table tbody,
  body.composition-v2 .prose__table tr,
  body.composition-v2 .prose__table th,
  body.composition-v2 .prose__table td { display: block; width: 100%; }
  body.composition-v2 .prose__table thead { display: none; }
  body.composition-v2 .prose__table tbody tr {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    margin-bottom: 0.8rem;
    overflow: hidden;
  }
  body.composition-v2 .prose__table tbody tr:nth-child(even) { background: #fff; }
  body.composition-v2 .prose__table .prose__cell { border-bottom: 1px solid var(--color-border); padding: 0.55rem 0.8rem; font-size: 0.95rem; }
  body.composition-v2 .prose__table .prose__cell:last-child { border-bottom: 0; }
  body.composition-v2 .prose__table .prose__cell--row {
    background: var(--color-lavender-soft);
    color: #5b4778;
    font-family: var(--font-heading);
    font-weight: 600;
    min-width: 0;
  }
  body.composition-v2 .prose__table td.prose__cell[data-label]::before {
    content: attr(data-label);
    display: block;
    font-size: 0.78rem;
    font-style: italic;
    color: #9a7b8f;
    margin-bottom: 0.1rem;
  }
}
@media (max-width: 640px) {
  body.composition-v2 .prose__table th.prose__cell--row { width: auto !important; max-width: none !important; box-sizing: border-box; }
}