/* YOMU Reading Center — Look B (editorial cream canvas).
   Tokens mirror /design-system/colors_and_type.css.
   Piepie reserved for the hero "Reading Center" only.                       */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

@font-face {
  font-family: 'Piepie';
  src: url('../fonts/Piepie-Regular.woff2') format('woff2'),
       url('../fonts/Piepie-Regular.woff')  format('woff');
  font-weight: 400; font-style: normal; font-display: swap;
}

:root {
  /* Brand */
  --yomu-orange:        rgb(251, 86, 6);
  --yomu-burnt:         rgb(178, 61, 5);
  --yomu-navy:          rgb(0, 55, 80);
  --yomu-blue:          rgb(6, 136, 196);
  --yomu-pink:          rgb(245, 141, 233);
  --yomu-pink-light:    rgb(254, 208, 249);
  --yomu-purple:        rgb(103, 59, 98);

  /* Neutrals */
  --yomu-cream-warm:    rgb(252, 251, 247);
  --yomu-off-white:     rgb(252, 252, 250);
  --yomu-near-black:    rgb(27, 26, 26);
  --yomu-white:         #fff;

  /* Tints */
  --yomu-blue-bg:       rgb(230, 243, 249);
  --yomu-orange-light:  rgb(255, 238, 230);
  --yomu-pink-bg:       rgb(254, 244, 253);
  --yomu-green-light:   rgb(235, 246, 240);

  /* Semantic */
  --rc-font:            'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --rc-font-display:    'Piepie', 'Inter', sans-serif;
  --rc-text:            var(--yomu-near-black);
  --rc-text-muted:      rgba(0,0,0,.55);
  --rc-text-soft:       rgba(0,0,0,.45);
  --rc-divider:         rgba(0,0,0,.1);

  --rc-radius-card:     24px;
  --rc-radius-sm:       16px;
  --rc-radius-btn:      31px;
  --rc-radius-pill:     100px;

  --rc-shadow-card:     0 0 4px 0 rgba(0,0,0,.12);
  --rc-shadow-card-hov: 0 10px 24px 0 rgba(0,0,0,.14);

  --rc-shell:           1160px;
}

/* ------------------------------------------------------------------ Base */

.rc-page, .rc-page * { box-sizing: border-box; }
.rc-page {
  font-family: var(--rc-font);
  color: var(--rc-text);
  background: var(--yomu-cream-warm);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.rc-page a { color: inherit; text-decoration: none; }
.rc-page img { max-width: 100%; height: auto; display: block; }

.rc-page h1, .rc-page h2, .rc-page h3, .rc-page h4,
.rc-page h5, .rc-page h6 {
  font-family: var(--rc-font) !important;
  text-transform: none !important;
  color: inherit;
  margin: 0 0 .5em;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.rc-page > * { width: 100%; max-width: none; }

.rc-shell {
  max-width: var(--rc-shell);
  margin: 0 auto;
  padding-inline: clamp(20px, 5vw, 48px);
}

.rc-section { padding: clamp(48px, 7vw, 88px) 0; }
.rc-section__title { font-size: clamp(24px, 3vw, 32px); font-weight: 800; margin: 0; letter-spacing: -0.4px; }
.rc-section__head { margin-bottom: clamp(20px, 3vw, 32px); }
.rc-section__dek { font-size: 17px; color: var(--rc-text-muted); margin: 8px 0 0; }

/* ------------------------------------------------------------------ Buttons */

.rc-button {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 28px;
  font: inherit; font-weight: 700; font-size: 15px;
  border-radius: var(--rc-radius-btn);
  border: 2px solid transparent;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.rc-page .rc-button--burnt {
  background: var(--yomu-burnt); color: var(--yomu-white) !important;
}
.rc-page .rc-button--burnt:hover { background: rgb(150, 50, 4); color: var(--yomu-white) !important; }
.rc-page .rc-button--outline-light {
  background: transparent; color: var(--yomu-white) !important;
  border-color: rgba(255,255,255,.5);
}
.rc-page .rc-button--outline-light:hover { background: rgba(255,255,255,.08); color: var(--yomu-white) !important; }

.rc-page .rc-link-underline {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--yomu-burnt) !important; font-weight: 700; font-size: 16px;
  border-bottom: 2px solid var(--yomu-burnt);
  padding-bottom: 3px;
}
.rc-page .rc-link-underline:hover { color: rgb(150,50,4) !important; border-color: rgb(150,50,4); }

/* ------------------------------------------------------------------ Breadcrumb */

.rc-breadcrumb { padding: 0 0 22px; font-size: 14px; color: var(--rc-text-soft); }
.rc-breadcrumb ol {
  display: flex; flex-wrap: wrap; gap: 8px;
  list-style: none; margin: 0; padding: 0;
}
.rc-breadcrumb a { color: var(--rc-text-soft); }
.rc-breadcrumb a:hover { text-decoration: underline; }
.rc-breadcrumb li + li::before { content: "›"; margin-right: 8px; color: rgba(0,0,0,.3); }
.rc-breadcrumb [aria-current="page"] { color: var(--yomu-burnt); font-weight: 500; }

/* ------------------------------------------------------------------ Hero */

.rc-hero { background: var(--yomu-cream-warm); padding: clamp(34px, 5vw, 64px) 0 clamp(40px, 6vw, 64px); }
.rc-hero__inner--split {
  display: flex; align-items: center;
  gap: clamp(32px, 5vw, 64px);
  flex-wrap: wrap;
}
.rc-hero__copy { flex: 1 1 460px; min-width: 300px; }

.rc-hero__title {
  font-size: clamp(40px, 6vw, 64px);
  font-weight: 800;
  margin: 8px 0 16px;
}
.rc-hero__title--display,
h1.rc-hero__title--display {
  font-family: var(--rc-font-display) !important;
  font-weight: 400 !important;
  color: var(--yomu-near-black);
  font-size: clamp(54px, 9vw, 104px);
  line-height: .95;
  letter-spacing: .5px;
  margin: 0 0 24px;
  text-transform: none !important;
}

.rc-hero__dek {
  font-size: clamp(18px, 2vw, 21px);
  line-height: 1.55;
  color: var(--rc-text-muted);
  max-width: 520px;
  margin: 0 0 28px;
}

.rc-hero__meta {
  display: flex; align-items: center; gap: 20px;
  font-size: 14px; font-weight: 600; color: var(--rc-text-soft);
}
.rc-hero__meta-item { display: inline-flex; align-items: center; gap: 8px; }
.rc-hero__meta-item img { width: 24px; height: 24px; object-fit: contain; }
.rc-hero__meta-dot { width: 4px; height: 4px; border-radius: 50%; background: rgba(0,0,0,.25); }

.rc-hero__art {
  flex: 0 1 320px; min-width: 220px;
  display: flex; justify-content: center; align-items: center;
}
.rc-hub-illustration {
  width: min(240px, 58vw); height: auto; display: block;
  background: transparent;
}
@media (max-width: 720px) {
  .rc-hero__inner--split { gap: 24px; }
  .rc-hero__art { order: -1; justify-content: center; width: 100%; }
  .rc-hub-illustration { width: min(200px, 56vw); }
}

/* ------------------------------------------------------------------ Topics — editorial divider list */

.rc-topics { background: var(--yomu-white); }
.rc-topic-list {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap: 0 clamp(32px, 5vw, 64px);
}
.rc-topic-row { border-bottom: 1px solid var(--rc-divider); }
.rc-topic-row__link {
  display: flex; align-items: center; gap: 20px;
  padding: 22px 0;
  transition: padding-left .15s ease;
}
.rc-topic-row__link:hover { padding-left: 8px; }
.rc-topic-row__icon {
  flex: none; width: 66px; height: 66px;
  border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
}
.rc-topic-row__icon-img { width: 44px; height: 44px; object-fit: contain; }
.rc-topic-row__body { flex: 1; min-width: 0; }
.rc-topic-row__title  { display: block; font-size: 18px; font-weight: 700; color: var(--rc-text); margin-bottom: 4px; }
.rc-topic-row__desc   { display: block; font-size: 14px; line-height: 1.4; color: var(--rc-text-muted); margin: 0; }
.rc-topic-row__arrow  { font-size: 22px; color: rgba(0,0,0,.3); font-weight: 700; }

/* ------------------------------------------------------------------ Popular guides — horizontal feature cards */

.rc-popular { background: var(--yomu-cream-warm); }
.rc-feature-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 24px; }
.rc-feature {
  position: relative;
  display: flex; flex-wrap: nowrap;
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: var(--rc-radius-card);
  overflow: hidden;
  box-shadow: var(--rc-shadow-card);
  height: 320px;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
@media (max-width: 720px) {
  .rc-feature { height: auto; flex-wrap: wrap; }
}
.rc-feature:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px 0 rgba(0,0,0,.12);
  border-color: rgba(0,0,0,.1);
}
.rc-feature__title-link {
  color: var(--rc-text); text-decoration: none;
}
.rc-feature__title-link::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
}
.rc-feature__cat { position: relative; z-index: 2; }
.rc-feature__read { display: inline-flex; align-items: center; gap: 6px; color: var(--yomu-burnt); font-weight: 700; font-size: 15px; }
.rc-feature__media {
  flex: 1 1 320px; min-height: 240px;
  background: var(--yomu-blue-bg);
  display: flex; align-items: center; justify-content: center;
}
.rc-feature__image { width: 100%; height: 100%; object-fit: cover; }
.rc-feature__placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.rc-feature__placeholder img { width: 96px; height: 96px; opacity: .85; }

.rc-feature__body {
  flex: 1 1 340px;
  padding: clamp(26px, 4vw, 36px);
  display: flex; flex-direction: column; justify-content: flex-start;
  gap: 18px;
  min-width: 0;
}
.rc-feature__topline {
  display: flex; align-items: center; gap: 12px;
  margin: 0;
  flex-wrap: wrap;
}
.rc-feature__cat {
  align-self: flex-start;
  background: var(--yomu-pink-light); color: var(--yomu-purple);
  font-size: 12px; font-weight: 700;
  padding: 5px 12px; border-radius: var(--rc-radius-pill);
  letter-spacing: .02em;
}
.rc-feature__cat:hover { background: var(--yomu-pink); color: var(--yomu-purple); }
.rc-feature__title  { font-size: clamp(22px, 2.6vw, 26px); font-weight: 700; line-height: 1.18; margin: 0; }
.rc-feature:hover .rc-feature__title-link { color: var(--yomu-burnt); }
.rc-feature__excerpt {
  font-size: 16px; line-height: 1.55; color: var(--rc-text-muted); margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rc-feature__meta { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--rc-text-soft); }
.rc-feature__meta-icon { width: 18px; height: 18px; object-fit: contain; }

.rc-popular__cta { margin: 36px 0 0; }

/* ------------------------------------------------------------------ More guides — numbered editorial list */

.rc-more-guides { background: var(--yomu-white); }
.rc-numbered-list {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 0 clamp(40px, 5vw, 72px);
}
.rc-numbered-row { border-top: 1px solid var(--rc-divider); }
.rc-numbered-row__link {
  display: flex; align-items: flex-start; gap: 18px;
  padding: 22px 0;
}
.rc-numbered-row__num {
  flex: none; width: 28px;
  font-family: var(--rc-font); font-size: 18px; font-weight: 800;
  color: var(--yomu-pink); line-height: 1.3;
}
.rc-numbered-row__body { flex: 1; min-width: 0; }
.rc-numbered-row__cat {
  display: block; font-size: 11px; font-weight: 700;
  letter-spacing: .4px; text-transform: uppercase;
  color: var(--yomu-blue); margin-bottom: 4px;
}
.rc-numbered-row__title { display: block; font-size: 17px; font-weight: 700; line-height: 1.3; margin-bottom: 4px; }
.rc-numbered-row__desc  { display: block; font-size: 14px; line-height: 1.45; color: var(--rc-text-soft); }
.rc-numbered-row__arrow { font-size: 20px; color: rgba(0,0,0,.3); font-weight: 700; }
.rc-numbered-row__link:hover .rc-numbered-row__title { color: var(--yomu-burnt); }

/* ------------------------------------------------------------------ CTA banner — navy with mascot */

.rc-cta-wrap { background: var(--yomu-cream-warm); padding: clamp(48px, 6vw, 80px) 0 clamp(72px, 9vw, 112px); }
.rc-cta-banner {
  background: var(--yomu-navy);
  border-radius: 32px;
  padding: clamp(40px, 6vw, 68px) clamp(28px, 5vw, 60px);
  overflow: hidden;
  display: flex; align-items: center; justify-content: space-between;
  gap: 40px; flex-wrap: wrap;
  color: var(--yomu-white);
}
.rc-cta-banner__copy { flex: 1 1 440px; min-width: 280px; }
.rc-page .rc-cta-banner__title { font-size: clamp(28px, 4vw, 44px); font-weight: 800; color: var(--yomu-white) !important; margin: 0 0 14px; line-height: 1.08; }
.rc-page .rc-cta-banner__dek   { font-size: 18px; color: rgba(255,255,255,.85); margin: 0 0 28px; max-width: 480px; line-height: 1.5; }
.rc-cta-banner__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.rc-cta-banner__mascot { width: min(190px, 42vw); height: auto; display: block; }

@media (max-width: 720px) {
  .rc-cta-banner { flex-direction: column; align-items: flex-start; gap: 28px; }
  .rc-cta-banner__mascot { order: -1; align-self: center; width: min(170px, 48vw); }
}

/* ------------------------------------------------------------------ Category page (pillar) — Look B */

.rc-page--pillar { background: var(--yomu-cream-warm); }
.rc-page--pillar > * { max-width: none; }

.rc-pillar-header {
  background: var(--yomu-cream-warm);
  border-bottom: 1px solid rgba(0,0,0,.07);
}
.rc-pillar-header__inner {
  padding-top: clamp(22px, 3vw, 32px);
  padding-bottom: clamp(26px, 4vw, 38px);
  display: flex; align-items: center;
  gap: clamp(20px, 4vw, 44px);
  flex-wrap: wrap;
}
.rc-pillar-header__copy { flex: 1 1 460px; min-width: 280px; }
.rc-pillar-header .rc-breadcrumb { padding: 0 0 16px; font-size: 13px; }
.rc-pillar-header__title-row {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 14px;
}
.rc-pillar-header__icon {
  flex: none; width: 48px; height: 48px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  /* The h1's tight line-height sits the visible cap-height above the line-box center,
     so flex align-items:center lands the icon slightly low. Lift it to match the
     title's optical center (~0.18em of the title). */
  transform: translateY(-8px);
}
.rc-pillar-header__icon img { width: 30px; height: 30px; object-fit: contain; }
.rc-pillar-header__title {
  font-family: var(--rc-font) !important;
  font-weight: 800; font-size: clamp(30px, 4.5vw, 44px);
  color: var(--rc-text);
  line-height: 1.05;
  letter-spacing: -0.6px;
  margin: 0;
}
.rc-pillar-header__dek {
  font-size: clamp(15px, 1.6vw, 17px);
  line-height: 1.55;
  color: var(--rc-text-muted);
  max-width: 560px;
  margin: 0;
}
.rc-pillar-header__meta {
  display: flex; align-items: center; gap: 18px;
  font-size: 13px; font-weight: 600;
  color: var(--rc-text-soft);
  flex-wrap: wrap;
}
.rc-pillar-header__meta-item { display: inline-flex; align-items: center; gap: 7px; }
.rc-pillar-header__meta-item img { width: 18px; height: 18px; object-fit: contain; }

.rc-pillar-content { background: var(--yomu-white); }
.rc-pillar-grid {
  padding-top: clamp(44px, 6vw, 80px);
  padding-bottom: clamp(44px, 6vw, 80px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(280px, 26vw, 330px);
  gap: clamp(32px, 4vw, 56px);
  align-items: start;
}
@media (max-width: 860px) {
  .rc-pillar-grid { grid-template-columns: 1fr; }
  .rc-articles-sidebar { position: static !important; top: auto !important; order: -1; }
}
.rc-pillar-main { min-width: 0; }
.rc-pillar-main > * + * { margin-top: 48px; }

.rc-featured__title { margin: 0 0 clamp(24px, 3vw, 36px); }

/* Feature card adjustments (category page): footer with Read-guide link */
.rc-feature__footer {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  margin-top: 22px;
}
.rc-feature__footer .rc-feature__meta { margin: 0; }
.rc-feature__read {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--yomu-burnt); font-weight: 700; font-size: 15px;
}
.rc-feature__read:hover { color: rgb(150, 50, 4); }

/* Articles sidebar (pink dots) */
.rc-articles-sidebar {
  position: sticky; top: 90px;
  background: var(--yomu-cream-warm);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: var(--rc-radius-card);
  padding: clamp(22px, 2.5vw, 30px);
}
.rc-articles-sidebar__title {
  font-size: 18px; font-weight: 800;
  color: var(--rc-text);
  letter-spacing: -0.2px;
  margin: 0 0 6px;
}
.rc-articles-sidebar__tagline {
  font-size: 14px; line-height: 1.45;
  color: var(--rc-text-muted);
  margin: 0 0 8px;
}
.rc-articles-sidebar__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.rc-articles-sidebar__item { border-top: 1px solid var(--rc-divider); }
.rc-articles-sidebar__item:first-child { border-top: 1px solid var(--rc-divider); }
.rc-articles-sidebar__link {
  display: flex; align-items: center; gap: 12px;
  padding: 15px 0;
  color: var(--rc-text);
  transition: padding-left .15s ease;
}
.rc-articles-sidebar__link:hover { padding-left: 6px; }
.rc-articles-sidebar__dot {
  flex: none; width: 8px; height: 8px;
  border-radius: 50%; background: var(--yomu-pink);
}
.rc-articles-sidebar__heading {
  flex: 1; min-width: 0;
  font-size: 15px; font-weight: 700;
  color: var(--rc-text); line-height: 1.3;
}
.rc-articles-sidebar__arrow {
  font-size: 18px; color: var(--yomu-burnt); font-weight: 700;
}

/* Optional pillar prose section */
.rc-pillar-prose { padding: 0; max-width: 720px; }

/* ------------------------------------------------------------------ Article (cluster) page — Look B */

.rc-page--cluster { background: var(--yomu-cream-warm); }
.rc-page--cluster > * { max-width: none; }
.rc-page--cluster [id] { scroll-margin-top: 92px; }

/* Breadcrumb band on top */
.rc-breadcrumb-band {
  border-bottom: 1px solid rgba(0,0,0,.07);
  background: var(--yomu-cream-warm);
}
.rc-breadcrumb-band .rc-breadcrumb { padding: 16px 0; font-size: 13px; }

/* Article grid: main column + sticky aside */
.rc-article-section { background: var(--yomu-cream-warm); }
.rc-article-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(264px, 24vw, 304px);
  gap: clamp(36px, 5vw, 64px);
  align-items: start;
  padding-top: clamp(32px, 4vw, 52px);
  padding-bottom: clamp(48px, 6vw, 80px);
}
@media (max-width: 920px) {
  .rc-article-grid { grid-template-columns: 1fr; }
  .rc-article-aside { position: static !important; top: auto !important; order: 2; margin-top: 0; }
}

.rc-article-main { min-width: 0; max-width: 760px; }

.rc-article-header { margin-bottom: 24px; }
.rc-article-header__eyebrow {
  display: inline-block;
  font-size: 12px; font-weight: 700;
  letter-spacing: 1.2px; text-transform: uppercase;
  color: var(--yomu-burnt);
  margin-bottom: 16px;
  background: transparent; padding: 0; border-radius: 0;
}
.rc-article-header__title {
  font-family: var(--rc-font) !important;
  font-weight: 800 !important;
  color: var(--rc-text);
  font-size: clamp(34px, 5vw, 52px);
  line-height: 1.04;
  letter-spacing: -0.8px;
  margin: 0 0 18px;
}
.rc-article-header__dek {
  font-size: clamp(17px, 1.9vw, 20px);
  line-height: 1.55;
  color: rgba(0,0,0,.58);
  margin: 0 0 26px;
}
.rc-article-header__meta {
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--rc-divider);
}
.rc-article-header__byline { display: flex; align-items: center; gap: 13px; }
.rc-byline-avatar {
  flex: none; width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--yomu-pink-light);
  color: var(--yomu-purple);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 16px;
}
.rc-byline__stack { display: flex; flex-direction: column; gap: 3px; }
.rc-byline__name { font-size: 15px; font-weight: 700; color: var(--rc-text); }
.rc-byline__date {
  display: flex; align-items: center; gap: 9px;
  font-size: 13px; font-weight: 500; color: rgba(0,0,0,.5);
}
.rc-byline__dot { width: 3px; height: 3px; border-radius: 50%; background: rgba(0,0,0,.3); display: inline-block; }

.rc-share-bar { display: flex; align-items: center; gap: 10px; margin-left: 0; }
.rc-share-bar__label { font-size: 13px; font-weight: 600; color: rgba(0,0,0,.45); }
.rc-share-bar__group { display: flex; gap: 8px; }
.rc-share-bar__link {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid rgba(0,0,0,.12);
  display: flex; align-items: center; justify-content: center;
  color: var(--yomu-navy);
  background: transparent;
  transition: background .15s, color .15s, border-color .15s;
}
.rc-share-bar__link:hover {
  background: var(--yomu-navy); color: var(--yomu-white);
  border-color: var(--yomu-navy);
}

/* Intro paragraph */
.rc-article-intro {
  font-size: 17px; line-height: 1.7;
  color: rgba(0,0,0,.72);
  margin: 30px 0 6px;
}
.rc-article-intro strong { color: var(--rc-text); font-weight: 700; }

/* Book list (Look B numbered cards) */
.rc-book-list { display: flex; flex-direction: column; gap: 22px; margin: 24px 0 0; }
.rc-book {
  display: flex; flex-wrap: wrap; gap: 0;
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: var(--rc-radius-card);
  overflow: hidden;
  box-shadow: var(--rc-shadow-card);
  padding: 0;
}
.rc-book__media {
  position: relative;
  flex: 1 1 170px; min-width: 150px; max-width: 210px;
  background: var(--yomu-blue-bg);
  align-self: stretch;
  min-height: 230px;
}
.rc-book__cover {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.rc-book__num {
  position: absolute; top: 12px; left: 12px;
  width: 34px; height: 34px; border-radius: 11px;
  background: var(--yomu-burnt); color: var(--yomu-white);
  font-weight: 800; font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.rc-book__body {
  flex: 1 1 320px;
  padding: clamp(22px, 3vw, 30px);
  display: flex; flex-direction: column;
}
.rc-book__title,
.rc-article-prose .rc-book__title {
  font-size: clamp(21px, 2.4vw, 26px);
  font-weight: 800;
  color: var(--rc-text);
  line-height: 1.15;
  letter-spacing: -0.3px;
  margin: 0 0 16px;
}
.rc-book__rows { display: flex; flex-direction: column; gap: 9px; margin: 0 0 16px; }
.rc-book__row { display: flex; gap: 8px; font-size: 15px; line-height: 1.4; margin: 0; }
.rc-book__row dt {
  flex: none; width: 76px;
  font-weight: 700;
  color: rgba(0,0,0,.4);
  margin: 0;
}
.rc-book__row dd { color: var(--rc-text); font-weight: 600; margin: 0; }
.rc-book__row-emphasis { color: var(--yomu-blue) !important; font-weight: 700 !important; }
.rc-book__themes { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 22px; }
.rc-book__chip {
  background: var(--yomu-blue-bg); color: var(--yomu-navy);
  font-size: 12px; font-weight: 700;
  padding: 5px 12px; border-radius: var(--rc-radius-pill);
}
.rc-page .rc-book__cta {
  margin-top: auto; align-self: flex-start;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--yomu-near-black); color: var(--yomu-off-white) !important;
  font-weight: 700; font-size: 14px;
  padding: 11px 22px; border-radius: var(--rc-radius-btn);
  transition: opacity .15s;
}
.rc-page .rc-book__cta:hover { opacity: .88; color: var(--yomu-off-white) !important; }

@media (max-width: 560px) {
  .rc-book__media { flex: 1 1 100%; max-width: none; min-height: 200px; }
}

/* Prose section */
.rc-article-prose {
  font-size: 17px; line-height: 1.7;
  color: rgba(0,0,0,.72);
  margin-top: 24px;
}
.rc-article-prose .rc-article-body > * + * { margin-top: 1em; }
.rc-article-prose h2 { font-size: 24px; margin-top: 36px; color: var(--rc-text); }
.rc-article-prose h3 { font-size: 19px; margin-top: 28px; color: var(--rc-text); }
.rc-article-prose a  { color: var(--yomu-blue); }
.rc-article-prose blockquote {
  border-left: 4px solid var(--yomu-pink);
  padding-left: 20px; font-style: italic; margin: 1em 0;
}

/* Tips callout — pink-bg with sparkle */
.rc-tips-callout {
  margin-top: 28px;
  display: flex; gap: 18px;
  background: var(--yomu-pink-bg);
  border: 1px solid rgba(103,59,98,.12);
  border-radius: 20px;
  padding: clamp(22px, 3vw, 28px);
}
.rc-tips-callout__icon { flex: none; width: 34px; height: 34px; object-fit: contain; margin-top: 2px; }
.rc-tips-callout__title { font-size: 18px; font-weight: 800; color: var(--yomu-purple); margin: 0 0 8px; }
.rc-tips-callout__text { font-size: 15.5px; line-height: 1.6; color: rgba(0,0,0,.65); }
.rc-tips-callout__text p { margin: 0; }

/* FAQ — plain bordered cards */
.rc-faq { margin: 44px 0 0; padding: 0; }
.rc-faq__title { font-size: clamp(24px, 3vw, 30px); font-weight: 800; margin: 0 0 20px; letter-spacing: -0.4px; color: var(--rc-text); }
.rc-faq__list { display: flex; flex-direction: column; gap: 14px; }
.rc-faq__item {
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 18px;
  padding: 22px 24px;
  box-shadow: 0 0 2px 0 rgba(0,0,0,.1);
  margin: 0;
}
.rc-faq__q { font-size: 17px; font-weight: 700; color: var(--rc-text); margin: 0 0 9px; }
.rc-faq__a { font-size: 15.5px; line-height: 1.6; color: rgba(0,0,0,.6); margin: 0; }

/* Loved this list — blue-bg block */
.rc-loved {
  margin-top: 40px;
  background: var(--yomu-blue-bg);
  border-radius: var(--rc-radius-card);
  padding: clamp(26px, 4vw, 36px);
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
}
.rc-loved__copy { flex: 1 1 320px; min-width: 240px; }
.rc-loved__title { font-size: clamp(20px, 2.6vw, 26px); font-weight: 800; color: var(--yomu-navy); margin: 0 0 8px; letter-spacing: -0.3px; }
.rc-loved__dek { font-size: 16px; line-height: 1.55; color: rgba(0,0,0,.6); margin: 0; }
.rc-loved__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.rc-page .rc-button--white {
  background: var(--yomu-white); color: var(--yomu-blue) !important;
  border-color: transparent;
  box-shadow: 0 0 4px 0 rgba(0,0,0,.15);
}
.rc-page .rc-button--white:hover { background: var(--yomu-white); color: var(--yomu-navy) !important; }
.rc-button--white img { width: 16px; height: 16px; }

/* Sidebar: TOC + Install card */
.rc-article-aside {
  position: sticky; top: 92px;
  display: flex; flex-direction: column; gap: 18px;
  align-self: start;
  /* Drop the aside past the header eyebrow so its top lines up with the title. */
  margin-top: 34px;
}
.rc-toc {
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 20px;
  padding: 22px 22px 14px;
  box-shadow: 0 0 4px 0 rgba(0,0,0,.08);
  position: static; /* sticky on parent */
  border-right: 0;
  margin: 0;
}
.rc-toc__title {
  font-size: 12px; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase;
  color: rgba(0,0,0,.4);
  margin: 0 0 14px;
}
.rc-toc__list { display: flex; flex-direction: column; }
.rc-toc__link {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 0;
  font-size: 14.5px; font-weight: 600;
  color: rgba(0,0,0,.62);
  line-height: 1.3;
  border-left: 0; margin-left: 0;
}
.rc-toc__link:hover { color: var(--yomu-burnt); }
.rc-toc__dot {
  flex: none; width: 5px; height: 5px;
  border-radius: 50%; background: var(--yomu-pink);
}
.rc-toc__link.is-active { color: var(--yomu-burnt); font-weight: 700; }

.rc-install-card {
  background: var(--yomu-navy);
  border-radius: 20px;
  padding: 24px 22px;
  overflow: hidden;
  color: var(--yomu-white);
}
.rc-install-card__mascot { width: 64px; height: auto; display: block; margin-bottom: 12px; }
.rc-install-card__title { font-size: 19px; font-weight: 800; color: var(--yomu-white); margin: 0 0 8px; line-height: 1.15; letter-spacing: -0.2px; }
.rc-install-card__dek { font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.78); margin: 0 0 18px; }
.rc-install-card__buttons { display: flex; flex-direction: column; gap: 9px; }
.rc-install-card__btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font-weight: 700; font-size: 14px;
  padding: 11px 16px;
  border-radius: var(--rc-radius-btn);
  text-decoration: none;
  transition: opacity .15s;
}
.rc-install-card__btn:hover { opacity: .9; }
.rc-page .rc-install-card__btn--light { background: var(--yomu-white); color: var(--yomu-navy) !important; }
.rc-page .rc-install-card__btn--light:hover { color: var(--yomu-navy) !important; }
.rc-page .rc-install-card__btn--ghost {
  background: rgba(255,255,255,.12); color: var(--yomu-white) !important;
  border: 1px solid rgba(255,255,255,.25);
}
.rc-page .rc-install-card__btn--ghost:hover { color: var(--yomu-white) !important; }

/* More guides you might like — 4-card thumb grid */
.rc-more-like { background: var(--yomu-white); border-top: 1px solid rgba(0,0,0,.07); }
.rc-thumb-grid {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap: 20px;
}
.rc-thumb-card { display: flex; }
.rc-thumb-card__link {
  display: flex; flex-direction: column; width: 100%;
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--rc-shadow-card);
  color: var(--rc-text);
  transition: transform .15s, box-shadow .15s;
}
.rc-thumb-card__link:hover { transform: translateY(-4px); box-shadow: var(--rc-shadow-card-hov); }
.rc-thumb-card__media { width: 100%; height: 150px; background: var(--yomu-blue-bg); display: flex; align-items: center; justify-content: center; }
.rc-thumb-card__image { width: 100%; height: 100%; object-fit: cover; }
.rc-thumb-card__placeholder img { width: 64px; height: 64px; opacity: .85; }
.rc-thumb-card__body { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.rc-thumb-card__cat {
  align-self: flex-start;
  background: var(--yomu-pink-light); color: var(--yomu-purple);
  font-size: 11px; font-weight: 700;
  padding: 4px 11px; border-radius: var(--rc-radius-pill);
  margin-bottom: 12px;
}
.rc-thumb-card__title { font-size: 17px; font-weight: 700; line-height: 1.25; margin: 0 0 8px; flex: 1; }
.rc-thumb-card__desc { font-size: 14px; line-height: 1.45; color: rgba(0,0,0,.5); margin: 0 0 14px; }
.rc-thumb-card__meta { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: rgba(0,0,0,.45); }
.rc-thumb-card__meta img { width: 18px; height: 18px; object-fit: contain; }

/* Related Articles — 2-col compact list */
.rc-related-section { background: var(--yomu-cream-warm); }
.rc-related-list {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
  gap: 0 clamp(40px, 5vw, 64px);
}
.rc-related-row { border-top: 1px solid var(--rc-divider); }
.rc-related-row__link {
  display: flex; align-items: center; gap: 18px;
  padding: 20px 0;
  transition: padding-left .15s ease;
}
.rc-related-row__link:hover { padding-left: 6px; }
.rc-related-row__body { flex: 1; min-width: 0; }
.rc-related-row__cat {
  display: block; font-size: 11px; font-weight: 700;
  letter-spacing: .5px; text-transform: uppercase;
  color: var(--yomu-blue); margin-bottom: 6px;
}
.rc-related-row__title { font-size: 17px; font-weight: 700; line-height: 1.3; margin: 0 0 5px; }
.rc-related-row__meta { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: rgba(0,0,0,.45); }
.rc-related-row__meta img { width: 16px; height: 16px; object-fit: contain; }
.rc-related-row__arrow { font-size: 22px; color: var(--yomu-burnt); font-weight: 700; }

/* ------------------------------------------------------------------ Prose article variant */

.rc-prose {
  font-size: 18px;
  line-height: 1.75;
  color: rgba(0,0,0,.74);
}
.rc-prose p { margin: 0 0 20px; }
.rc-prose p:last-child { margin-bottom: 0; }
.rc-prose strong { color: var(--rc-text); font-weight: 700; }
.rc-prose em { font-style: italic; }
.rc-prose a {
  color: var(--yomu-blue); font-weight: 600;
  border-bottom: 1.5px solid rgba(6,136,196,.3);
}
.rc-prose a:hover { color: var(--yomu-navy); border-color: var(--yomu-navy); }
.rc-prose ul, .rc-prose ol { padding-left: 1.4em; margin: 0 0 20px; }
.rc-prose li { margin-bottom: 8px; }

.rc-prose-intro { margin-top: 30px; }

/* Numbered sections */
.rc-prose-sections { display: flex; flex-direction: column; gap: 0; margin-top: 14px; }
.rc-prose-section { padding-top: 38px; }
/* When sections are NOT numbered, drop the chip and let the heading lead. */
.rc-prose-section--plain .rc-prose-section__head { gap: 0; }
.rc-prose-section__head {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 14px;
}
.rc-prose-section__num {
  flex: none;
  width: 40px; height: 40px;
  border-radius: 13px;
  background: var(--yomu-burnt);
  color: var(--yomu-white);
  font-weight: 800; font-size: 19px;
  line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 4px 0 rgba(0,0,0,.12);
  /* Match the title's optical center (line-box vs cap-height). */
  transform: translateY(-8px);
}
.rc-prose-section__title {
  font-size: clamp(23px, 2.7vw, 29px);
  font-weight: 800;
  color: var(--rc-text);
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.4px;
}

/* Pull quote */
.rc-pullquote {
  margin: 44px 0 8px;
  border-left: 5px solid var(--yomu-pink);
  padding: 6px 0 6px 26px;
}
.rc-pullquote__text {
  margin: 0;
  font-size: clamp(22px, 2.8vw, 28px);
  line-height: 1.32;
  font-weight: 800;
  color: var(--yomu-navy);
  letter-spacing: -0.4px;
}

/* Large-icon variant of the tips callout (used for prose "struggle" callout) */
.rc-tips-callout--large { gap: 20px; padding: clamp(24px, 3vw, 32px); }
.rc-tips-callout--large .rc-tips-callout__icon { width: 64px; height: 64px; margin-top: 0; }
.rc-tips-callout--large .rc-tips-callout__title { font-size: 19px; margin-bottom: 10px; }
.rc-tips-callout--large .rc-tips-callout__text { font-size: 16px; line-height: 1.65; color: rgba(0,0,0,.68); }

/* Quick recap checklist */
.rc-recap {
  margin-top: 40px;
  background: var(--yomu-blue-bg);
  border-radius: var(--rc-radius-card);
  padding: clamp(26px, 4vw, 36px);
}
.rc-recap__title {
  font-size: clamp(20px, 2.6vw, 26px);
  font-weight: 800;
  color: var(--yomu-navy);
  margin: 0 0 18px;
  letter-spacing: -0.3px;
}
.rc-recap__list {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap: 12px 24px;
}
.rc-recap__item { display: flex; align-items: flex-start; gap: 11px; }
.rc-recap__check {
  flex: none;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--yomu-burnt);
  color: var(--yomu-white);
  display: flex; align-items: center; justify-content: center;
  margin-top: 1px;
}
.rc-recap__text { font-size: 15.5px; line-height: 1.45; font-weight: 600; color: var(--rc-text); }

/* Author note */
.rc-author-note {
  margin-top: 40px;
  display: flex; gap: 18px; align-items: center;
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: var(--rc-radius-card);
  padding: clamp(22px, 3vw, 28px);
  box-shadow: 0 0 4px 0 rgba(0,0,0,.08);
}
.rc-author-note__avatar {
  flex: none;
  width: 60px; height: 60px;
  border-radius: 50%;
  background: var(--yomu-pink-light);
  color: var(--yomu-purple);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 22px;
}
.rc-author-note__body { flex: 1 1 260px; min-width: 220px; }
.rc-author-note__name { font-size: 15px; font-weight: 800; color: var(--rc-text); display: block; }
.rc-author-note__bio { font-size: 14.5px; line-height: 1.55; color: rgba(0,0,0,.6); margin: 6px 0 0; }

.rc-hero__inner { max-width: var(--rc-shell); margin: 0 auto; padding-inline: clamp(20px, 5vw, 48px); }
.rc-eyebrow {
  display: inline-block; font-size: 12px; font-weight: 700;
  letter-spacing: .08em; color: var(--yomu-blue);
  background: rgba(6,136,196,.08);
  padding: 4px 10px; border-radius: 999px; margin: 0 0 16px;
}

/* Generic post-card grid */
.rc-post-grid { display: grid; gap: 24px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); list-style: none; padding: 0; margin: 0; }
.rc-post-grid--3 { grid-template-columns: repeat(3, 1fr); }
.rc-post-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 980px) { .rc-post-grid--3, .rc-post-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .rc-post-grid--3, .rc-post-grid--4 { grid-template-columns: 1fr; } }

.rc-card {
  position: relative;
  background: var(--yomu-white);
  border: 1px solid rgba(0,0,0,.07);
  border-radius: var(--rc-radius-card);
  overflow: hidden;
  box-shadow: var(--rc-shadow-card);
  transition: transform .15s, box-shadow .15s;
}
.rc-card:hover { transform: translateY(-2px); box-shadow: var(--rc-shadow-card-hov); }
.rc-card__image { width: 100%; aspect-ratio: 16/10; object-fit: cover; background: var(--yomu-blue-bg); }
.rc-card__body { padding: 18px 20px 22px; }
.rc-card__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; position: relative; z-index: 2; }
.rc-card__tag {
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 4px 10px; border-radius: var(--rc-radius-pill);
  background: var(--yomu-pink-light); color: var(--yomu-purple);
  position: relative; z-index: 2;
}
.rc-card__title { font-size: 19px; line-height: 1.3; margin: 4px 0 8px; }
.rc-card__title-link { color: var(--rc-text); }
.rc-card__title-link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.rc-card__title-link:hover { color: var(--yomu-burnt); }
.rc-card__excerpt { color: var(--rc-text-muted); font-size: 14.5px; margin: 0 0 12px; }
.rc-card__meta { color: var(--rc-text-soft); font-size: 13px; margin: 0; }

/* Topic sidebar nav (pillar page legacy) */
.rc-pillar-layout { display: grid; grid-template-columns: 260px 1fr; gap: 48px; max-width: var(--rc-shell); margin: 0 auto; padding: 0 clamp(20px, 5vw, 48px) 48px; }
@media (max-width: 880px) { .rc-pillar-layout { grid-template-columns: 1fr; gap: 24px; } }
.rc-topic-nav { background: var(--yomu-cream-warm); border-radius: var(--rc-radius-card); padding: 20px 22px; align-self: start; position: sticky; top: 24px; }
.rc-topic-nav__title { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rc-text-muted); margin: 0 0 12px; }
.rc-topic-nav__list { list-style: none; padding: 0; margin: 0; }
.rc-topic-nav__item { border-top: 1px solid var(--rc-divider); }
.rc-topic-nav__item:first-child { border-top: 0; }
.rc-topic-nav__link { display: block; padding: 10px 0; color: var(--rc-text); font-size: 14.5px; }
.rc-topic-nav__link:hover { color: var(--yomu-burnt); }
.rc-topic-nav__item.is-current .rc-topic-nav__link { color: var(--yomu-burnt); font-weight: 600; }

/* Generated post cover (filled shapes + Inter-800 phrase) */
.rc-cover {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.rc-cover__shape {
  position: absolute;
  display: block;
  pointer-events: none;
}
.rc-cover__sparkle {
  position: absolute;
  right: 18px;
  bottom: 18px;
  height: auto;
  opacity: .9;
  pointer-events: none;
}
.rc-cover__phrase {
  position: relative;
  z-index: 1;
  font-family: 'Inter', sans-serif !important;
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -0.6px;
  text-align: center;
  /* Line breaks come from explicit <br> in the partial — let the browser collapse
     PHP's template whitespace, otherwise leading/trailing newlines add phantom
     empty lines above and below the text and throw off the visual center. */
  white-space: normal;
  display: block;
  margin: 0;
}

/* When cover lives inside a feature/thumb media slot, fill the slot height */
.rc-feature__media .rc-cover { height: 100% !important; min-height: 240px; }
.rc-thumb-card__media .rc-cover { height: 150px !important; }

.screen-reader-text { position: absolute; left: -9999px; }

/* ===================================================================
 * Book cards inside article prose (Media & Text blocks).
 * Migrated book-list guides keep their book recommendations as Media &
 * Text blocks; style them as clean cards (matching the YOMU blog book
 * card) instead of raw prose.
 * =================================================================== */
.rc-prose .wp-block-media-text {
	background: #FBFBF9;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 18px;
	padding: 24px;
	margin: 2em 0;
	box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.06);
	gap: 24px;
}

@media (min-width: 640px) {
	.rc-prose .wp-block-media-text { padding: 32px; gap: 32px; }
}

.rc-prose .wp-block-media-text__media img {
	border-radius: 8px;
	box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.18);
	width: 100%;
	height: auto;
	display: block;
}

.rc-prose .wp-block-media-text__content { padding: 0 !important; }
.rc-prose .wp-block-media-text__content > * { margin: 0; }
.rc-prose .wp-block-media-text__content > * + * { margin-top: 12px; }

/* Book title — Inter ExtraBold navy (un-italicized) */
.rc-prose .wp-block-media-text h2,
.rc-prose .wp-block-media-text h3 {
	margin-top: 0;
	font-family: "Inter", sans-serif;
	font-weight: 800;
	text-transform: none;
	font-size: clamp(22px, 2.2vw, 28px);
	line-height: 1.15;
	letter-spacing: -0.4px;
	color: rgb(0, 55, 80);
}

.rc-prose .wp-block-media-text h2 em,
.rc-prose .wp-block-media-text h3 em { font-style: normal; }

/* Sub-labels (e.g. "Why it works") — small caps */
.rc-prose .wp-block-media-text h4,
.rc-prose .wp-block-media-text h5 {
	margin-top: 18px;
	font-family: "Inter", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 12px;
	font-weight: 700;
	color: rgba(0, 0, 0, 0.5);
}

.rc-prose .wp-block-media-text ul { margin: 0; padding-left: 1.2em; }
.rc-prose .wp-block-media-text ul li { margin: 6px 0; font-size: 15px; line-height: 1.5; }

.rc-prose .wp-block-media-text p { font-size: 15px; line-height: 1.6; }
.rc-prose .wp-block-media-text p em { color: rgba(0, 0, 0, 0.55); }

/* Author line — first em paragraph after the title reads like a subtitle */
.rc-prose .wp-block-media-text h2 + p em,
.rc-prose .wp-block-media-text h3 + p em {
	font-style: normal;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: rgba(0, 0, 0, 0.55);
}

/* ===================================================================
 * Inline install CTA + install band + store buttons.
 * These partials shipped without CSS; give them the navy-card look.
 * YOMU is iOS-only, so a single App Store button.
 * =================================================================== */
.rc-inline-cta {
	background: var(--yomu-navy);
	color: var(--yomu-white);
	border-radius: 20px;
	padding: clamp(22px, 3vw, 32px);
	margin: 2.4em 0;
	text-align: center;
}

.rc-inline-cta h3 {
	font-family: "Inter", sans-serif;
	font-size: clamp(20px, 2.4vw, 26px);
	font-weight: 800;
	color: var(--yomu-white);
	margin: 0 0 8px;
	line-height: 1.15;
	letter-spacing: -0.3px;
}

.rc-inline-cta p {
	font-size: 16px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.8);
	margin: 0 0 18px;
}

.rc-install-band {
	background: var(--yomu-navy);
	color: var(--yomu-white);
}

.rc-install-band__inner {
	max-width: 720px;
	margin: 0 auto;
	padding: clamp(40px, 6vw, 64px) clamp(20px, 5vw, 48px);
	text-align: center;
}

.rc-install-band h2 {
	font-family: "Inter", sans-serif;
	font-size: clamp(24px, 3vw, 34px);
	font-weight: 800;
	color: var(--yomu-white);
	margin: 0 0 10px;
	letter-spacing: -0.4px;
}

.rc-install-band p {
	font-size: 17px;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.8);
	margin: 0 auto 22px;
	max-width: 460px;
}

/* Shared store buttons (white App Store pill on navy) */
.rc-store-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}

.rc-store-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--yomu-white);
	color: var(--yomu-navy) !important;
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-size: 15px;
	padding: 12px 24px;
	border-radius: var(--rc-radius-btn, 31px);
	text-decoration: none;
	transition: opacity 0.15s ease;
}

.rc-store-btn:hover {
	opacity: 0.9;
	color: var(--yomu-navy) !important;
}