/* ============================================================
   House of Verity — Page components (light, old-money)
   ============================================================ */

/* —— Hero (home) — full-bleed dark video —— */
.hv-hero { min-height: calc(100vh - 76px); display:grid; place-items:center; text-align:center;
  position:relative; overflow:hidden; padding-block: var(--sp-9); color: var(--text-on-dark); background: var(--hv-espresso-900); }
.hv-hero__video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hv-hero__scrim { position:absolute; inset:0; z-index:1;
  background: radial-gradient(ellipse at center, rgba(26,18,12,.4) 0%, rgba(26,18,12,.78) 72%, var(--hv-espresso-900) 100%); }
.hv-hero__inner { position:relative; z-index:2; max-width: 960px; padding-inline: var(--gutter); }
.hv-hero__title { font-size: var(--fs-hero); margin-bottom: var(--sp-5); color: var(--hv-cream); font-weight: var(--fw-semi); }
.hv-hero__title em { font-family: var(--font-serif); font-style: italic; font-weight:500; color: var(--accent-2-soft); }
.hv-hero__sub { font-size: var(--fs-lead); color: var(--text-on-dark-soft); margin: 0 auto var(--sp-7); max-width: 56ch; }
.hv-hero .hv-btn-row { justify-content:center; }
.hv-hero .hv-btn--ghost { color: var(--hv-cream); border-color: var(--hv-line-cream); }
.hv-hero .hv-btn--ghost:hover { background: rgba(245,241,232,0.08); color: var(--hv-cream); border-color: var(--accent-2-soft); }

/* —— Page hero (interior pages) —— */
.hv-pagehero { padding-block: clamp(5rem, 10vw, 9rem) var(--section-y); position:relative; overflow:hidden; }
.hv-pagehero::after { content:""; position:absolute; top:-25%; right:-8%; width:540px; height:540px;
  background: radial-gradient(circle, rgba(176,141,91,.14), transparent 70%); pointer-events:none; }
.hv-pagehero__title { font-size: var(--fs-h1); max-width: 18ch; margin-bottom: var(--sp-5); font-weight: var(--fw-semi); }
.hv-pagehero__title em { font-family: var(--font-serif); font-style:italic; font-weight:500; color: var(--accent); }

/* —— Generic prose block —— */
.hv-prose p { margin-bottom: var(--sp-5); color: var(--text-soft); }
.hv-prose p:last-child { margin-bottom:0; }
.hv-prose strong { color: var(--text-body); font-weight: var(--fw-bold); }

/* —— Feature grid —— */
.hv-grid { display:grid; gap: var(--sp-5); }
.hv-grid--2 { grid-template-columns: repeat(2, 1fr); }
.hv-grid--3 { grid-template-columns: repeat(3, 1fr); }
.hv-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px){ .hv-grid--3, .hv-grid--4 { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px){ .hv-grid--2, .hv-grid--3, .hv-grid--4 { grid-template-columns: 1fr; } }

.hv-card {
  background: var(--surface-card); border:1px solid var(--border-card); border-radius: var(--r-lg);
  padding: clamp(1.5rem, 2.4vw, 2.2rem); position:relative; box-shadow: var(--shadow-sm);
  transition: transform var(--dur) var(--ease-out), border-color var(--dur), box-shadow var(--dur); height:100%;
}
.hv-card:hover { transform: translateY(-4px); border-color: var(--hv-green-line); box-shadow: var(--shadow-md); }
.hv-card__num { font-family: var(--font-serif); font-weight: var(--fw-semi); font-size: 3rem;
  color: var(--accent-soft); line-height:1; margin-bottom: var(--sp-3); }
.hv-card__icon { width:54px; height:54px; border-radius: var(--r-md); display:grid; place-items:center;
  background: rgba(61,85,68,.09); color: var(--accent); margin-bottom: var(--sp-4); }
.hv-card__icon svg { width:26px; height:26px; }
.hv-card__title { font-size: var(--fs-h4); margin-bottom: var(--sp-3); }
.hv-card__body { color: var(--text-soft); font-size: var(--fs-small); }

/* —— Section heading block —— */
.hv-shead { margin-bottom: var(--sp-7); max-width: 62ch; }
.hv-shead .hv-eyebrow { margin-bottom: var(--sp-3); }
.hv-shead h2 { font-size: var(--fs-h2); margin-bottom: var(--sp-4); font-weight: var(--fw-semi); }
.hv-shead--center { margin-inline:auto; text-align:center; }
.hv-shead--center .hv-eyebrow::before { display:none; }

/* —— Pricing cards —— */
.hv-pricing { display:grid; grid-template-columns: repeat(3,1fr); gap: var(--sp-5); align-items:stretch; }
@media (max-width: 980px){ .hv-pricing { grid-template-columns:1fr; max-width:520px; margin-inline:auto; } }
.hv-price {
  display:flex; flex-direction:column; background: var(--surface-card);
  border:1px solid var(--border-card); border-radius: var(--r-lg); overflow:hidden; box-shadow: var(--shadow-sm);
  transition: transform var(--dur) var(--ease-out), border-color var(--dur), box-shadow var(--dur);
}
.hv-price:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.hv-price--featured { border-color: var(--hv-green-line); box-shadow: var(--shadow-md); }
.hv-price__head { padding: var(--sp-6) var(--sp-5) var(--sp-5);
  background: linear-gradient(165deg, var(--hv-espresso-700), var(--hv-espresso-900)); color: var(--text-on-dark); position:relative; }
.hv-price--featured .hv-price__head { background: linear-gradient(165deg, var(--hv-green-700), var(--hv-green-900)); }
.hv-price__tier { font-family: var(--font-ui); font-size:.72rem; letter-spacing: var(--ls-eyebrow);
  text-transform:uppercase; color: var(--accent-2-soft); margin-bottom:.5rem; }
.hv-price__name { font-size: var(--fs-h3); margin-bottom:.5rem; color: var(--text-on-dark); font-weight: var(--fw-semi); }
.hv-price__for { font-size: var(--fs-small); color: var(--text-on-dark-soft); }
.hv-price__badge { position:absolute; top:1rem; right:1rem; font-family:var(--font-ui);
  font-size:.64rem; font-weight:var(--fw-med); letter-spacing:.16em; text-transform:uppercase;
  color: var(--hv-espresso-900); background: var(--accent-2); padding:.4em .9em; border-radius: var(--r-pill); }
.hv-price__cost { padding: var(--sp-5); border-bottom:1px solid var(--border-hair); }
.hv-price__amount { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 2.4rem; color: var(--text-body); }
.hv-price__amount span { font-size:1rem; font-weight: var(--fw-med); color: var(--text-soft); font-family: var(--font-ui); text-transform:uppercase; letter-spacing:.08em; }
.hv-price__fine { font-size:.82rem; color: var(--text-faint); margin-top:.3rem; }
.hv-price__body { padding: var(--sp-5); flex:1; }
.hv-price__sublabel { font-family:var(--font-ui); font-size:.7rem; letter-spacing: var(--ls-eyebrow);
  text-transform:uppercase; color: var(--text-caption); margin-bottom: var(--sp-4); }
.hv-incl { list-style:none; margin:0 0 var(--sp-5); padding:0; display:grid; gap: var(--sp-4); }
.hv-incl li { display:grid; grid-template-columns: 22px 1fr; gap:.7rem; align-items:start; font-size: var(--fs-small); }
.hv-incl li svg { width:18px; height:18px; color: var(--accent); margin-top:.18em; }
.hv-incl li strong { display:block; color: var(--text-body); font-weight: var(--fw-bold); }
.hv-incl li span { color: var(--text-caption); font-size:.85rem; }
.hv-price__other { background: var(--hv-stone-200); border-radius: var(--r-md); padding: var(--sp-4); margin-bottom: var(--sp-5); }
.hv-price__other dt { font-family:var(--font-ui); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color: var(--text-caption); }
.hv-price__other dd { margin:0 0 .6rem; font-size: var(--fs-small); color: var(--text-soft); }
.hv-price__other dd:last-child{ margin-bottom:0; }
.hv-price__foot { padding: 0 var(--sp-5) var(--sp-6); }
.hv-price__foot .hv-btn { width:100%; }

/* —— Comparison table —— */
.hv-compare { display:grid; grid-template-columns: 1.1fr 1fr 1fr 1fr; gap: var(--sp-4); }
@media (max-width: 900px){ .hv-compare { grid-template-columns:1fr; gap: var(--sp-5); } }
.hv-comparecol { border:1px solid var(--border-card); border-radius: var(--r-lg); overflow:hidden; background: var(--surface-card); box-shadow: var(--shadow-sm); }
.hv-comparecol--plan { border-color: var(--hv-green-line); }
.hv-comparecol__head { padding: var(--sp-5); font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: var(--fs-h4); color: var(--text-on-dark); }
.hv-comparecol--feature .hv-comparecol__head { background: linear-gradient(160deg, var(--hv-espresso-700), var(--hv-espresso-900)); }
.hv-comparecol--plan .hv-comparecol__head { background: linear-gradient(160deg, var(--hv-green-700), var(--hv-green-900)); }
.hv-comparecol__row { padding: var(--sp-4) var(--sp-5); border-top:1px solid var(--border-hair);
  font-size: var(--fs-small); color: var(--text-soft); min-height: 78px; display:flex; align-items:center; }
.hv-comparecol--feature .hv-comparecol__row { color: var(--text-body); font-weight: var(--fw-semi); font-family: var(--font-ui); letter-spacing:.02em; }
.hv-comparecol__row--price { font-family: var(--font-display); font-weight: var(--fw-bold); font-size:1.5rem; color: var(--text-body); }
@media (max-width:900px){
  .hv-comparecol__row::before { content: attr(data-label); display:block; font-family:var(--font-ui);
    font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color: var(--text-caption); margin-bottom:.25rem; }
  .hv-comparecol__row { flex-direction:column; align-items:flex-start; min-height:0; }
  .hv-comparecol--feature { display:none; }
}

/* —— Process timeline (How We Work) —— */
.hv-timeline { display:grid; grid-template-columns: repeat(5,1fr); gap: var(--sp-4); position:relative; }
.hv-timeline::before { content:""; position:absolute; left:8%; right:8%; top: 92px; height:1.5px;
  background: linear-gradient(90deg, transparent, var(--hv-bronze-line), transparent); }
@media (max-width: 860px){ .hv-timeline { grid-template-columns: 1fr; gap: var(--sp-5); } .hv-timeline::before{ display:none; } }
.hv-step { text-align:center; position:relative; }
.hv-step__icon { width: 96px; height:96px; margin:0 auto var(--sp-4); border-radius: var(--r-lg);
  display:grid; place-items:center; background: rgba(245,241,232,.06); border:1px solid var(--hv-bronze-line); color: var(--accent-2-soft); }
.hv-step__icon svg { width:40px; height:40px; }
.hv-step__dot { width:12px; height:12px; border-radius:50%; background: var(--accent-2); margin:0 auto var(--sp-4);
  box-shadow:0 0 0 5px rgba(176,141,91,.18); }
.hv-step__title { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-h4); margin-bottom:.5rem; }
.hv-step__meta { font-size:.85rem; color: var(--text-on-dark-soft); }
.hv-step__meta b { color: var(--accent-2-soft); font-weight: var(--fw-bold); }
@media (max-width:860px){ .hv-step { display:grid; grid-template-columns: 96px 1fr; gap: var(--sp-4); text-align:left; align-items:center; }
  .hv-step__icon{ margin:0; } .hv-step__dot{ display:none; } }

/* —— Logo marquee (sits on a dark band; logos are light) —— */
.hv-marquee { overflow:hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.hv-marquee__track { display:flex; gap: clamp(3rem, 7vw, 7rem); align-items:center; width:max-content;
  animation: hv-scroll 32s linear infinite; }
.hv-marquee:hover .hv-marquee__track { animation-play-state: paused; }
.hv-marquee img { height: clamp(34px, 4vw, 52px); width:auto; opacity:.78; transition: opacity var(--dur); }
.hv-marquee img[alt="Batch LDN"] { height: clamp(16px, 1.9vw, 24px); }
.hv-marquee img:hover { opacity:1; }
@keyframes hv-scroll { from { transform: translateX(0);} to { transform: translateX(-50%);} }
@media (prefers-reduced-motion: reduce){ .hv-marquee__track { animation:none; flex-wrap:wrap; justify-content:center; } }

/* —— Big CTA band —— */
.hv-cta { text-align:center; }
.hv-cta__title { font-size: var(--fs-h2); max-width: 20ch; margin: 0 auto var(--sp-5); font-weight: var(--fw-semi); }
.hv-cta__title em { font-family: var(--font-serif); font-style:italic; font-weight:500; color: var(--accent); }
.hv-section--warm .hv-cta__title em, .hv-section--feature .hv-cta__title em { color: var(--accent-2-soft); }
.hv-cta__body { color: var(--text-soft); max-width: 60ch; margin: 0 auto var(--sp-6); font-size: var(--fs-lead); }
.hv-section--warm .hv-cta__body, .hv-section--feature .hv-cta__body { color: var(--text-on-dark-soft); }
.hv-cta .hv-btn-row { justify-content:center; }

/* —— Philosophy / quote block —— */
.hv-quote { text-align:center; max-width: 26ch; margin-inline:auto; }
.hv-quote p { font-family: var(--font-serif); font-size: clamp(1.9rem, 4vw, 3rem); line-height:1.25;
  font-style:italic; color: var(--text-on-dark); font-weight: var(--fw-med); }
.hv-quote em { color: var(--accent-2-soft); font-style:italic; }

/* —— Case studies —— */
.hv-cases { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-5); }
.hv-case { display:block; background: rgba(245,241,232,.05); border:1px solid var(--hv-line-cream);
  border-radius: var(--r-lg); padding: var(--sp-5); transition: all var(--dur) var(--ease-out); }
.hv-case:hover { transform: translateY(-4px); border-color: var(--accent-2-soft); background: rgba(245,241,232,.08); }
.hv-case__platform { display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem;
  letter-spacing:.14em; text-transform:uppercase; color: var(--text-on-dark-soft); font-family: var(--font-ui); margin-bottom: var(--sp-4); }
.hv-case__platform svg { width:16px; height:16px; }
.hv-case__handle { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-h4); color: var(--text-on-dark); }
.hv-case__link { display:inline-flex; align-items:center; gap:.4rem; color: var(--accent-2-soft); font-size: var(--fs-small);
  font-family: var(--font-ui); letter-spacing:.06em; margin-top: var(--sp-3); }
.hv-case__link svg { width:15px; height:15px; transition: transform var(--dur-fast); }
.hv-case:hover .hv-case__link svg { transform: translate(2px,-2px); }

/* —— Blog cards —— */
.hv-blogfeed { display:grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--sp-6); }
.hv-blogcard { display:flex; flex-direction:column; background: var(--surface-card);
  border:1px solid var(--border-card); border-radius: var(--r-lg); overflow:hidden; box-shadow: var(--shadow-sm);
  transition: transform var(--dur) var(--ease-out), border-color var(--dur), box-shadow var(--dur); }
.hv-blogcard:hover { transform: translateY(-5px); border-color: var(--hv-green-line); box-shadow: var(--shadow-md); }
.hv-blogcard__img { aspect-ratio: 16/10; position:relative; overflow:hidden;
  background: linear-gradient(150deg, var(--hv-green-700), var(--hv-green-900)); }
.hv-blogcard__img img { width:100%; height:100%; object-fit:cover; transition: transform var(--dur-slow) var(--ease-out); }
.hv-imgph { position:absolute; inset:0; display:grid; place-items:center; }
.hv-imgph svg { width:34%; height:34%; color: rgba(230,216,191,.5); stroke-width:1.25; }
.hv-article__hero .hv-imgph svg { width:120px; height:120px; }
.hv-blogcard:hover .hv-blogcard__img img { transform: scale(1.05); }
.hv-blogcard__tag { position:absolute; top:1rem; left:1rem; font-family:var(--font-ui); font-size:.66rem;
  letter-spacing:.14em; text-transform:uppercase; font-weight:var(--fw-med); color: var(--hv-espresso-900);
  background: var(--accent-2-soft); padding:.4em .9em; border-radius: var(--r-pill); }
.hv-blogcard__body { padding: var(--sp-5); display:flex; flex-direction:column; flex:1; }
.hv-blogcard__title { font-size: var(--fs-h4); margin-bottom: var(--sp-3); line-height:1.18; }
.hv-blogcard__excerpt { color: var(--text-soft); font-size: var(--fs-small); margin-bottom: var(--sp-5); flex:1; }
.hv-blogcard__more { display:inline-flex; align-items:center; gap:.5rem; color: var(--accent);
  font-family:var(--font-ui); font-weight:var(--fw-med); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; }
.hv-blogcard__more svg { width:16px; height:16px; transition: transform var(--dur-fast); }
.hv-blogcard:hover .hv-blogcard__more svg { transform: translateX(3px); }

/* —— Article —— */
.hv-article { max-width: 740px; margin-inline:auto; }
.hv-article__hero { aspect-ratio: 21/9; border-radius: var(--r-lg); overflow:hidden; margin-bottom: var(--sp-7);
  background: linear-gradient(150deg, var(--hv-green-700), var(--hv-green-900)); }
.hv-article__hero img { width:100%; height:100%; object-fit:cover; }
.hv-article h2 { font-size: var(--fs-h3); margin: var(--sp-7) 0 var(--sp-4); font-weight: var(--fw-semi); }
.hv-article h3 { font-size: var(--fs-h4); margin: var(--sp-6) 0 var(--sp-3); color: var(--text-body); }
.hv-article p { color: var(--text-soft); margin-bottom: var(--sp-5); }
.hv-article strong { color: var(--text-body); font-weight: var(--fw-bold); }
.hv-article ul { padding-left: 0; list-style:none; display:grid; gap: var(--sp-3); margin: 0 0 var(--sp-5); }
.hv-article ul li { display:grid; grid-template-columns: 24px 1fr; gap:.6rem; color: var(--text-soft); }
.hv-article ul li svg { width:18px; height:18px; margin-top:.2em; color: var(--accent); }
.hv-article ul.hv-list--x li svg { color: var(--text-faint); }
.hv-article__lead { font-size: var(--fs-lead); color: var(--text-body); margin-bottom: var(--sp-6); }
.hv-article blockquote { margin: var(--sp-6) 0; padding-left: var(--sp-5); border-left: 3px solid var(--accent);
  font-family: var(--font-serif); font-style:italic; font-size: 1.7rem; line-height:1.3; color: var(--text-body); }
.hv-article__exercise { background: var(--hv-stone-200); border:1px solid var(--border-card);
  border-radius: var(--r-md); padding: var(--sp-5); margin: var(--sp-6) 0; }
.hv-article__exercise .hv-eyebrow { margin-bottom: var(--sp-3); }
.hv-backlink { display:inline-flex; align-items:center; gap:.5rem; color: var(--text-soft);
  font-family: var(--font-ui); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom: var(--sp-6); }
.hv-backlink:hover { color: var(--accent); }
.hv-backlink svg { width:16px; height:16px; }

/* ============================================================
   Case-study module (shared by case-studies & services)
   ============================================================ */
.cs-jump { display:flex; flex-wrap:wrap; gap:.6rem; margin-top: var(--sp-6); }
.cs-jump a { font-family: var(--font-ui); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--text-soft); border:1px solid var(--border-card); border-radius: var(--r-pill);
  padding:.6em 1.1em; transition: all var(--dur-fast) var(--ease-soft); }
.cs-jump a:hover { color: var(--accent); border-color: var(--hv-green-line); background: rgba(61,85,68,.06); }

.cs { scroll-margin-top: 90px; }
.cs__top { display:grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items:center; }
.cs__top--flip .cs__media { order: -1; }
@media (max-width: 900px){ .cs__top { grid-template-columns:1fr; gap: var(--sp-6); }
  .cs__top--flip .cs__media { order:0; } }

.cs-logobox { height:60px; display:flex; align-items:center; margin-bottom: var(--sp-5); }
.cs-logo { max-height:50px; max-width:78%; width:auto; object-fit:contain; }
.cs-logo--invert { filter: brightness(0) invert(1); opacity:.94; }
.cs-wordmark { font-family: var(--font-serif); font-weight:600; font-size: clamp(2rem,4vw,2.8rem);
  letter-spacing:.14em; text-transform:uppercase; color: var(--text-body); line-height:1; }
.hv-section--warm .cs-wordmark, .hv-section--feature .cs-wordmark { color: var(--hv-cream); }

.cs-meta { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem .9rem; margin-bottom: var(--sp-3); }
.cs-platform { display:inline-flex; align-items:center; gap:.45rem; font-family: var(--font-ui);
  font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color: var(--text-caption); }
.cs-platform svg { width:15px; height:15px; }
.hv-section--warm .cs-platform, .hv-section--feature .cs-platform { color: var(--accent-2-soft); }
.cs-handle { font-family: var(--font-ui); font-size:.72rem; letter-spacing:.06em; color: var(--text-faint); }
.hv-section--warm .cs-handle, .hv-section--feature .cs-handle { color: var(--hv-cream-mute); }

.cs-tags { display:flex; flex-wrap:wrap; gap:.45rem; margin-bottom: var(--sp-4); }
.cs-tag { font-family: var(--font-ui); font-size:.64rem; letter-spacing:.1em; text-transform:uppercase;
  padding:.42em .85em; border-radius: var(--r-pill); border:1px solid var(--border-card); color: var(--text-caption); line-height:1; }
.hv-section--warm .cs-tag, .hv-section--feature .cs-tag { color: var(--accent-2-soft); border-color: var(--hv-bronze-line); }

.cs__title { font-size: var(--fs-h2); margin: var(--sp-2) 0 var(--sp-4); font-weight: var(--fw-semi); line-height: var(--lh-snug); }
.cs__title em { font-family: var(--font-serif); font-style:italic; font-weight:500; color: var(--accent); }
.hv-section--warm .cs__title em, .hv-section--feature .cs__title em { color: var(--accent-2-soft); }

.cs-reel { display:grid; grid-template-columns:1fr 1fr; gap: var(--sp-4); }
.cs-vid { aspect-ratio: 9/16; border-radius: var(--r-lg); overflow:hidden; background:#000; box-shadow: var(--shadow-md); }
.cs-vid video { width:100%; height:100%; object-fit:cover; display:block; }
.cs-vid:nth-child(2) { transform: translateY(var(--sp-6)); }
@media (max-width:900px){ .cs-vid:nth-child(2){ transform:none; } }
.cs-reel--single { grid-template-columns: minmax(0, 320px); justify-content:center; }
.cs-figure { border-radius: var(--r-lg); overflow:hidden; box-shadow: var(--shadow-lg);
  border:1px solid var(--hv-line-cream); max-width: 460px; margin-inline:auto; }
.cs-figure img { width:100%; height:auto; display:block; }

.cs-metrics { display:grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5);
  margin-top: var(--sp-7); padding-top: var(--sp-6); border-top:1px solid var(--border-hair); }
@media (max-width:620px){ .cs-metrics { grid-template-columns:1fr; gap: var(--sp-6); } }
.hv-section--warm .cs-metrics, .hv-section--feature .cs-metrics { border-top-color: var(--hv-line-cream); }
.cs-metric__num { font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: clamp(2.9rem, 5.4vw, 4.4rem); line-height:.86; color: var(--accent); }
.hv-section--warm .cs-metric__num, .hv-section--feature .cs-metric__num { color: var(--accent-2-soft); }
.cs-metric__label { font-family: var(--font-ui); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color: var(--text-body); margin-top: var(--sp-3); font-weight: var(--fw-med); }
.hv-section--warm .cs-metric__label, .hv-section--feature .cs-metric__label { color: var(--hv-cream); }
.cs-metric__desc { font-size: var(--fs-small); color: var(--text-soft); margin-top: var(--sp-2); line-height:1.55; text-wrap:pretty; }
.hv-section--warm .cs-metric__desc, .hv-section--feature .cs-metric__desc { color: var(--text-on-dark-soft); }

.cs-story { display:grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 3.2vw, 3rem); margin-top: var(--sp-7); }
@media (max-width:820px){ .cs-story { grid-template-columns:1fr; gap: var(--sp-6); } }
.cs-story__col h3 { font-family: var(--font-ui); font-weight: var(--fw-med); font-size:.74rem;
  letter-spacing:.16em; text-transform:uppercase; color: var(--accent-2); margin-bottom: var(--sp-3);
  padding-bottom: var(--sp-3); border-bottom:1px solid var(--border-hair); }
.hv-section--warm .cs-story__col h3, .hv-section--feature .cs-story__col h3 { color: var(--accent-2-soft); border-bottom-color: var(--hv-line-cream); }
.cs-story__col p { color: var(--text-soft); font-size: var(--fs-small); text-wrap:pretty; }
.hv-section--warm .cs-story__col p, .hv-section--feature .cs-story__col p { color: var(--text-on-dark-soft); }

.cs-sub { margin-top: var(--sp-7); padding: clamp(1.7rem, 3.4vw, 2.8rem); border-radius: var(--r-lg);
  background: linear-gradient(160deg, var(--hv-green-800), var(--hv-green-900)); color: var(--text-on-dark);
  box-shadow: var(--shadow-md); }
.cs-sub .cs-sub__grid { display:grid; grid-template-columns: 1.2fr .8fr; gap: clamp(1.5rem,4vw,3rem); align-items:center; }
@media (max-width:760px){ .cs-sub .cs-sub__grid { grid-template-columns:1fr; gap: var(--sp-5); } }
.cs-sub h3 { font-size: var(--fs-h3); color: var(--text-on-dark); margin: var(--sp-2) 0 var(--sp-3); font-weight: var(--fw-semi); }
.cs-sub h3 em { font-family: var(--font-serif); font-style:italic; font-weight:500; color: var(--accent-2-soft); }
.cs-sub p { color: var(--text-on-dark-soft); font-size: var(--fs-small); text-wrap:pretty; }
.cs-sub__stats { display:grid; gap: var(--sp-4); }
.cs-sub__stat { border-left:2px solid var(--accent-2); padding-left: var(--sp-4); }
.cs-sub__num { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: clamp(2rem,4vw,2.8rem);
  line-height:.9; color: var(--accent-2-soft); }
.cs-sub__lab { font-family: var(--font-ui); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color: var(--hv-cream-soft); margin-top:.4rem; }

.cs-creator-media { display:grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); align-items:start; }
.cs-creator-media .cs-figure { max-width:none; margin:0; }
.cs-creator-media .cs-figure:nth-child(2){ transform: translateY(var(--sp-6)); }
@media (max-width:900px){ .cs-creator-media .cs-figure:nth-child(2){ transform:none; } }
@media (max-width:420px){ .cs-creator-media { grid-template-columns:1fr; } }

.cs-sub__moso { display:flex; align-items:center; gap:.9rem; margin-bottom: var(--sp-4); }
.cs-sub__moso img { height:30px; width:auto; object-fit:contain; }
.cs-sub__moso span { font-family: var(--font-ui); font-size:.72rem; letter-spacing:.06em; color: var(--hv-cream-mute); }