         /nad/ → /explore/nad-protocols/, self-link removed from related,
         related CTA buttons, product card hrefs made relative,
         aria-hidden on SVGs, CTA centering, GEO hidden div
  Version: 2.0 | April 2026
  SmartStore embed · URL: /explore/beauty-skin/
  No <html> <head> <body> — paste into SmartStore HTML content block
=======================================================================

SEO HEAD — paste into SmartStore <head>:


























SCHEMAS — paste into SmartStore <head>:
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "CollectionPage",
  "dateModified": "2026-04-09",
  "lastReviewed": "2026-04-09",
  "name": "Beauty & Skin",
  "url": "https://www.harmover.com/explore/beauty-skin/",
  "description": "Beauty and skin supplements at Harmover — Tallow Cream (Orange & Bergamot, Peaceful Night), Retinol and Peptide Face Serum, Peptide Eye Gel-Cream, Peptide Hair Growth Serum, Grass-Fed Collagen Peptides, Resveratrol 600mg and Turmeric Gummies. Practitioner-selected.",
  "breadcrumb": {
    "@type": "BreadcrumbList",
    "itemListElement": [
      {"@type":"ListItem","position":1,"name":"Home","item":"https://www.harmover.com/"},
      {"@type":"ListItem","position":2,"name":"Beauty & Skin","item":"https://www.harmover.com/explore/beauty-skin/"}
    ]
  }
}
</script>

NAV SCRIPT — paste as a separate <script> block (already correct in source):
<script>
(function(){
  const path=window.location.pathname;
  document.querySelectorAll('.nav-links>li>a').forEach(a=>{ a.classList.remove('active'); });
  document.querySelectorAll('.nav-drop-item').forEach(a=>{ a.classList.remove('active'); });
  if(path==='/'){return;}
  let parentActivated=false;
  document.querySelectorAll('.nav-drop-item').forEach(a=>{
    if(a.getAttribute('href')===path){
      a.classList.add('active');
      const parentLi=a.closest('li');
      if(parentLi){ const parentLink=parentLi.querySelector(':scope>a'); if(parentLink){parentLink.classList.add('active');parentActivated=true;} }
    }
  });
  if(!parentActivated){
    document.querySelectorAll('.nav-links>li>a').forEach(a=>{
      const href=a.getAttribute('href');
      if(href&&href!=='/'&&path.startsWith(href.split('#')[0])&&href.indexOf('#')===-1){ a.classList.add('active'); }
    });
  }
  document.querySelectorAll('.nav-drawer-links a').forEach(a=>{ a.classList.toggle('active-drawer',a.getAttribute('href')===path); });
})();
</script>

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What is tallow cream and why is it good for skin?",
      "acceptedAnswer": { "@type": "Answer", "text": "Tallow cream is a moisturiser made from rendered grass-fed beef fat. Its lipid profile — rich in oleic, palmitic and stearic acids — closely mirrors human sebum, making it highly compatible with the skin barrier. It contains fat-soluble vitamins A, D, E and K in bioavailable form, and conjugated linoleic acid (CLA). Harmover's Tallow Creams are grass-fed Supliful formulations in two variants: Orange & Bergamot for daytime and Peaceful Night for overnight repair." }
    },
    {
      "@type": "Question",
      "name": "What do peptide serums actually do?",
      "acceptedAnswer": { "@type": "Answer", "text": "Peptides are short amino acid chains that act as cellular signals. Applied topically, signal peptides tell fibroblasts to produce more collagen, elastin or hyaluronic acid. The Retinol & Peptide Face Serum pairs these with encapsulated retinol — which directly accelerates cell turnover and collagen synthesis — for a compound anti-ageing effect. The encapsulation prevents the irritation common with unprotected retinol." }
    },
    {
      "@type": "Question",
      "name": "What is the difference between the two Tallow Creams?",
      "acceptedAnswer": { "@type": "Answer", "text": "Both share the same grass-fed tallow base. The Orange & Bergamot is the daytime cream — citrus and bergamot scent, formulated for morning application. The Peaceful Night is for evening use with calming botanicals suited to overnight repair. Many members use both as a morning and evening routine." }
    },
    {
      "@type": "Question",
      "name": "How does resveratrol help skin?",
      "acceptedAnswer": { "@type": "Answer", "text": "Resveratrol protects skin cells from UV-induced oxidative damage and reduces chronic inflammation that accelerates visible skin ageing. It also activates sirtuins — longevity proteins that regulate cellular repair — and supports collagen integrity. Taken internally at 600mg (50% standardised), it addresses the internal oxidative environment that topicals cannot reach." }
    },
    {
      "@type": "Question",
      "name": "Why does collagen need to be hydrolysed?",
      "acceptedAnswer": { "@type": "Answer", "text": "Collagen molecules are too large to be absorbed intact. Hydrolysis breaks collagen into di- and tripeptide fragments that cross the intestinal wall and signal fibroblasts in the dermis to produce new collagen. Harmover's Grass-Fed Hydrolyzed Collagen Peptides are from pasture-raised bovine and provide Type I and III collagen — most relevant to skin elasticity, hair strength and joint integrity." }
    }
  ]
}
</script>
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "ItemList",
  "name": "Harmover Beauty & Skin Supplements",
  "description": "Science-backed skin and beauty supplements at Harmover including Tallow Cream, Retinol Peptide Serum, Collagen Peptides, Peptide Eye Gel and Hair Growth Serum. Available to members across the UK, EU, Canada and US.",
  "numberOfItems": 8,
  "itemListElement": [
    { "@type": "ListItem", "position": 1, "item": { "@type": "Product", "name": "Tallow Cream — Orange & Bergamot", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Skincare", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/68" } } },
    { "@type": "ListItem", "position": 2, "item": { "@type": "Product", "name": "Tallow Cream — Peaceful Night", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Skincare", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/43" } } },
    { "@type": "ListItem", "position": 3, "item": { "@type": "Product", "name": "Retinol & Peptide Face Serum", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Skincare", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/86" } } },
    { "@type": "ListItem", "position": 4, "item": { "@type": "Product", "name": "Peptide Eye Gel-Cream", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Skincare", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/69" } } },
    { "@type": "ListItem", "position": 5, "item": { "@type": "Product", "name": "Peptide Hair Growth Serum", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Skincare", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/87" } } },
    { "@type": "ListItem", "position": 6, "item": { "@type": "Product", "name": "Grass-Fed Hydrolyzed Collagen Peptides", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Nutrition", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/88" } } },
    { "@type": "ListItem", "position": 7, "item": { "@type": "Product", "name": "Resveratrol 50% 600mg", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Longevity", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/82" } } },
    { "@type": "ListItem", "position": 8, "item": { "@type": "Product", "name": "Turmeric Gummies 500mg", "brand": { "@type": "Brand", "name": "Supliful" }, "category": "Anti-inflammatory", "offers": { "@type": "Offer", "url": "https://www.harmover.com/products/42" } } }
  ]
}
</script>
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Organization",
  "name": "Harmover",
  "url": "https://www.harmover.com",
  "logo": "https://www.harmover.com/harmova-logo.svg",
  "foundingDate": "2025",
  "foundingLocation": "Bulgaria, European Union",
  "address": { "@type": "PostalAddress", "addressCountry": "BG", "addressRegion": "Bulgaria" },
  "description": "Practitioner-supervised wellness supplements and protocols. Serving members across the UK, EU, Canada and US.",
  "areaServed": ["GB","US","EU","CA","IE","AU"]
}
</script>

GEO — paste into SmartStore <head>:



FONTS — paste into SmartStore <head> if not already present:




<noscript></noscript>

=======================================================================
-->

<!-- ═══════════════════════════════════════════════════════════════════ -->
<!-- GEO / AI ANSWER BLOCK                                             -->
<!-- ═══════════════════════════════════════════════════════════════════ -->
<div hidden="" itemscope="" itemtype="https://schema.org/WebPage" aria-hidden="true">
  
  
  
  
</div>

<!-- ═══════════════════════════════════════════════════════════════════ -->
<!-- STYLES — scoped to .hmv-cat, mobile-first, design tokens          -->
<!-- FIXED: broken CSS rules removed, tokens, * reset,                 -->
<!--        prefers-reduced-motion, nested <style> extracted           -->
<!-- ═══════════════════════════════════════════════════════════════════ -->
<style>
/* ── RESET ── */
.hmv-cat *, .hmv-cat *::before, .hmv-cat *::after {
  box-sizing: border-box; margin: 0; padding: 0;
}

/* ── DESIGN TOKENS ── */
.hmv-cat {
  --c-dark:       #091916;
  --c-green:      #1A3735;
  --c-green-card: #111f1d;
  --c-green-mid:  #415957;
  --c-gold:       #926D1F;
  --c-gold-b:     #b49b65;
  --c-gold-pale:  #dacdb3;
  --c-gold-cream: #f6f3ec;
  --c-cream:      #fdf8f2;
  --c-white:      #FBFBFB;
  --c-divider:    rgba(26,55,53,.08);
  --c-divider-gold: rgba(180,155,101,.15);
  --ff-serif:     'Cormorant Garamond', Georgia, serif;
  --ff-sans:      'Jost', system-ui, sans-serif;
  --fw-light:     300;
  --fw-reg:       400;
  --fw-med:       500;
  --fw-semi:      600;
  --nav-h:        72px;
  --sp-md:  clamp(20px, 3vw, 36px);
  --sp-lg:  clamp(40px, 5.5vw, 64px);
  --sp-xl:  clamp(48px, 7vw, 80px);
  font-family: var(--ff-sans);
  background: var(--c-dark);
  color: var(--c-white);
  overflow-x: hidden;
  scroll-behavior: smooth;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* ── LAYOUT ── */
.hmv-cat .wrap { max-width: 1450px; margin: 0 auto; padding: 0 var(--sp-md); }

/* ── FADE-IN ── */
.hmv-cat .fi { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.hmv-cat .fi.on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .hmv-cat .fi { opacity: 1; transform: none; transition: none; }
}

/* ── BUTTONS ── */
.hmv-cat .btn-p, .hmv-cat .btn-g {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--ff-sans); font-size: 11px; font-weight: var(--fw-semi);
  letter-spacing: .22em; text-transform: uppercase;
  padding: 15px 32px; cursor: pointer; text-decoration: none;
  transition: background .25s, border-color .25s, color .25s, transform .2s;
  white-space: nowrap; border: none; min-height: 48px;
}
.hmv-cat .btn-p { color: var(--c-dark); background: var(--c-gold-b); }
.hmv-cat .btn-p:hover { background: var(--c-gold); color: var(--c-gold-cream); transform: translateY(-2px); }
.hmv-cat .btn-p:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; }
.hmv-cat .btn-g { color: var(--c-gold-pale); background: transparent; border: 1px solid rgba(180,155,101,.3); }
.hmv-cat .btn-g:hover { border-color: var(--c-gold-b); color: var(--c-gold-b); }
.hmv-cat .btn-g:focus-visible { outline: 2px solid var(--c-gold-b); outline-offset: 3px; }

/* ── HERO ── */
.hmv-cat .cat-hero { background: var(--c-dark); padding: 36px 0 64px; position: relative; overflow: hidden; width: 100%; }
.hmv-cat .cat-hero::before { content: ''; position: absolute; top: -40%; right: -8%; width: 600px; height: 600px; border-radius: 50%; background: radial-gradient(circle, rgba(180,155,101,.06) 0%, transparent 70%); pointer-events: none; }
.hmv-cat .cat-hero .wrap { position: relative; z-index: 2; padding-right: var(--sp-md); }
@media (min-width: 900px) { .hmv-cat .cat-hero .wrap { padding-right: 42%; } }
.hmv-cat .cat-hero h1 { font-family: var(--ff-serif); font-size: clamp(36px, 6vw, 72px); font-weight: var(--fw-light); line-height: 1.08; color: var(--c-cream); margin-bottom: 20px; overflow-wrap: break-word; }
.hmv-cat .cat-hero h1 em { font-style: italic; color: var(--c-gold-b); display: inline; overflow-wrap: break-word; }
.hmv-cat .cat-hero-desc { font-size: clamp(15px, 1.4vw, 17px); font-weight: var(--fw-light); line-height: 1.9; color: rgba(251,251,251,.75); max-width: 560px; margin-bottom: 32px; }
.hmv-cat .hero-eyebrow { font-family: var(--ff-sans); font-size: 9px; letter-spacing: .35em; text-transform: uppercase; color: var(--c-gold-b); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.hmv-cat .hero-eyebrow::before { content: ''; height: 1px; width: 22px; background: var(--c-gold-b); opacity: .5; }

.hmv-cat .trust-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.hmv-cat .trust-pill { display: inline-flex; align-items: center; gap: 7px; font-family: var(--ff-sans); font-size: 9px; letter-spacing: .2em; text-transform: uppercase; color: var(--c-gold-b); border: 1px solid rgba(180,155,101,.18); padding: 6px 14px; min-height: 36px; }
.hmv-cat .trust-pill svg { width: 10px; height: 10px; fill: none; stroke: var(--c-gold-b); stroke-width: 2.5; flex-shrink: 0; }

.hmv-cat .cat-hero-img { position: absolute; right: 0; top: 0; bottom: 0; width: 38%; overflow: hidden; display: none; }
@media (min-width: 900px) { .hmv-cat .cat-hero-img { display: block; } }
.hmv-cat .cat-hero-img img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.hmv-cat .cat-hero-img::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to right, var(--c-dark) 0%, transparent 45%); z-index: 1; }

/* ── STAT BAR ── */
.hmv-cat .stat-bar { background: var(--c-white); padding: var(--sp-lg) 0; border-bottom: 1px solid var(--c-divider); }
.hmv-cat .stat-bar-inner { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 900px) { .hmv-cat .stat-bar-inner { grid-template-columns: repeat(4, 1fr); } }
.hmv-cat .stat-tile { background: var(--c-white); border: 1px solid var(--c-divider); border-top: 3px solid var(--c-gold-b); border-radius: 0 0 8px 8px; padding: clamp(16px,3vw,22px) 16px; text-align: center; }
.hmv-cat .stat-num { font-family: var(--ff-serif); font-size: clamp(28px,4vw,38px); font-weight: var(--fw-light); color: var(--c-green); line-height: 1; margin-bottom: 8px; }
.hmv-cat .stat-lbl { font-family: var(--ff-sans); font-size: 9px; font-weight: var(--fw-med); letter-spacing: .12em; text-transform: uppercase; color: var(--c-green-mid); line-height: 1.6; }

/* ── MARQUEE ── */
.hmv-cat .marquee-ribbon { background: var(--c-gold-b); overflow: hidden; padding: 11px 0; }
.hmv-cat .marquee-track { display: flex; align-items: center; white-space: nowrap; animation: hmvbty-marquee 36s linear infinite; }
@media (prefers-reduced-motion: reduce) { .hmv-cat .marquee-track { animation: none; } }
@keyframes hmvbty-marquee { to { transform: translateX(-50%); } }
.hmv-cat .m-item { display: inline-flex; align-items: center; gap: 8px; font-family: var(--ff-sans); font-size: 9px; letter-spacing: .25em; text-transform: uppercase; color: rgba(9,25,22,.85); font-weight: var(--fw-semi); padding: 0 28px; }
.hmv-cat .m-dot { display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: rgba(9,25,22,.35); }

/* ── SECTION SHARED ── */
.hmv-cat .section-eyebrow { font-family: var(--ff-sans); font-size: 9px; letter-spacing: .3em; text-transform: uppercase; color: var(--c-gold-b); margin-bottom: 10px; display: flex; align-items: center; gap: 10px; }
.hmv-cat .section-eyebrow::before { content: ''; width: 16px; height: 2px; background: var(--c-gold-b); flex-shrink: 0; }
.hmv-cat .section-title { font-family: var(--ff-serif); font-size: clamp(28px, 3.8vw, 48px); font-weight: var(--fw-light); line-height: 1.08; margin-bottom: 12px; }
.hmv-cat .section-title em { font-style: italic; color: var(--c-gold); }

/* ── INFO STRIP ── */
.hmv-cat .info-strip { background: rgba(26,55,53,.3); border: 1px solid var(--c-divider-gold); padding: clamp(20px,3vw,32px) clamp(16px,3vw,36px); margin-bottom: 56px; display: grid; gap: 24px; }
@media (min-width: 700px) { .hmv-cat .info-strip { grid-template-columns: 1fr 1fr 1fr; } }
.hmv-cat .info-item h4 { font-family: var(--ff-serif); font-size: 18px; font-weight: var(--fw-reg); color: var(--c-gold-b); margin-bottom: 6px; }
.hmv-cat .info-item p { font-family: var(--ff-sans); font-size: 12px; font-weight: var(--fw-light); line-height: 1.7; color: rgba(251,251,251,.45); }

/* ── PRODUCTS SECTION ── */
.hmv-cat .products-section { padding: clamp(48px,6vw,80px) 0; background: var(--c-dark); }

/* Product grids — extracted from inline <style> blocks */
.hmv-cat .bty-g2 { display: grid; grid-template-columns: 1fr; gap: 20px; max-width: 1100px; margin-left: auto; margin-right: auto; }
@media (min-width: 560px) { .hmv-cat .bty-g2 { grid-template-columns: repeat(2, 1fr); } }
.hmv-cat .bty-g2 .pc-img { aspect-ratio: 16/10; max-height: 340px; }
@media (min-width: 900px) { .hmv-cat .bty-g2 .pc-img { aspect-ratio: 3/2; max-height: 300px; } }
.hmv-cat .bty-g3 { display: grid; grid-template-columns: 1fr; gap: 20px; max-width: 1400px; margin-left: auto; margin-right: auto; }
@media (min-width: 560px) { .hmv-cat .bty-g3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .hmv-cat .bty-g3 { grid-template-columns: repeat(3, 1fr); } }
.hmv-cat .bty-g3 .pc-img { max-height: 320px; }

/* Tallow science grid — extracted from inline <style> */
.hmv-cat .tallow-grid { display: grid; grid-template-columns: 1fr; gap: 0; border: 1px solid var(--c-divider); }
@media (min-width: 480px) { .hmv-cat .tallow-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 860px) { .hmv-cat .tallow-grid { grid-template-columns: repeat(4, 1fr); } }
.hmv-cat .tallow-cell { padding: clamp(18px,3vw,28px) clamp(16px,2.5vw,24px); border-right: 1px solid var(--c-divider); border-bottom: 1px solid var(--c-divider); }
@media (min-width: 480px) { .hmv-cat .tallow-cell:nth-child(2n) { border-right: none; } }
@media (min-width: 860px) { .hmv-cat .tallow-cell { border-bottom: none; } .hmv-cat .tallow-cell:nth-child(2n) { border-right: 1px solid var(--c-divider); } .hmv-cat .tallow-cell:last-child { border-right: none; } }
.hmv-cat .tallow-cell-title { font-family: var(--ff-serif); font-size: 28px; font-weight: var(--fw-light); color: var(--c-gold); margin-bottom: 6px; }
.hmv-cat .tallow-cell-label { font-family: var(--ff-sans); font-size: 10px; font-weight: var(--fw-semi); letter-spacing: .16em; text-transform: uppercase; color: var(--c-green-mid); margin-bottom: 10px; }
.hmv-cat .tallow-cell-body { font-family: var(--ff-sans); font-size: 12.5px; font-weight: var(--fw-light); line-height: 1.7; color: var(--c-green-mid); }

.hmv-cat .prod-card { background: var(--c-green-card); border: 1px solid rgba(180,155,101,.14); display: flex; flex-direction: column; text-decoration: none; color: inherit; transition: border-color .25s, transform .25s; }
.hmv-cat .prod-card:hover { border-color: rgba(180,155,101,.4); transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,.35); }
.hmv-cat .prod-card:focus-visible { outline: 2px solid var(--c-gold-b); outline-offset: 3px; }
.hmv-cat .pc-img { aspect-ratio: 4/3; overflow: hidden; position: relative; background: var(--c-green); }
.hmv-cat .pc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; display: block; }
.hmv-cat .prod-card:hover .pc-img img { transform: scale(1.04); }
.hmv-cat .pc-badge { position: absolute; top: 12px; left: 12px; font-family: var(--ff-sans); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; padding: 5px 10px; font-weight: var(--fw-semi); }
.hmv-cat .pc-badge.featured { background: var(--c-gold-b); color: var(--c-dark); }
.hmv-cat .pc-badge.new { background: rgba(180,155,101,.15); color: var(--c-gold-b); border: 1px solid rgba(180,155,101,.25); }
.hmv-cat .pc-body { flex: 1; padding: 20px 20px 14px; }
.hmv-cat .pc-cat { font-family: var(--ff-sans); font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--c-gold-b); opacity: .7; margin-bottom: 8px; }
.hmv-cat .pc-name { font-family: var(--ff-serif); font-size: clamp(16px,1.8vw,18px); font-weight: var(--fw-reg); color: var(--c-gold-cream); line-height: 1.25; margin-bottom: 8px; }
.hmv-cat .pc-desc { font-family: var(--ff-sans); font-size: 12px; font-weight: var(--fw-light); line-height: 1.75; color: rgba(218,205,179,.65); }
.hmv-cat .pc-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-top: 1px solid rgba(180,155,101,.15); margin-top: auto; }
.hmv-cat .pc-member-tag { font-family: var(--ff-sans); font-size: 10px; font-weight: var(--fw-med); letter-spacing: .18em; text-transform: uppercase; color: var(--c-gold-b); opacity: .75; }
.hmv-cat .pc-action { display: inline-flex; align-items: center; gap: 6px; font-family: var(--ff-sans); font-size: 9px; font-weight: var(--fw-semi); letter-spacing: .2em; text-transform: uppercase; padding: 9px 18px; min-height: 36px; background: var(--c-gold-b); color: var(--c-dark); white-space: nowrap; flex-shrink: 0; transition: background .2s; pointer-events: none; }
.hmv-cat .prod-card:hover .pc-action { background: var(--c-gold); }

/* ── RELATED ── */
.hmv-cat .related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 16px; }
.hmv-cat .related-card { display: flex; flex-direction: column; gap: 6px; padding: clamp(14px,2vw,16px) 18px; background: #f7fcf9; border: 1px solid var(--c-divider); border-left: 3px solid var(--c-gold-b); border-radius: 0 6px 6px 0; text-decoration: none; transition: background .15s, transform .15s; }
.hmv-cat .related-card:hover { background: #eef7f2; transform: translateY(-2px); }
.hmv-cat .related-card:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; }
.hmv-cat .related-label { font-family: var(--ff-sans); font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--c-gold-b); }
.hmv-cat .related-name { font-family: var(--ff-serif); font-size: 16px; font-weight: var(--fw-reg); color: var(--c-green); line-height: 1.3; }
.hmv-cat .related-desc { font-family: var(--ff-sans); font-size: 12px; font-weight: var(--fw-light); color: var(--c-green-mid); line-height: 1.5; }
.hmv-cat .related-cta-row { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; margin-top: 10px; font-family: var(--ff-sans); font-size: 9px; font-weight: var(--fw-semi); letter-spacing: .16em; text-transform: uppercase; color: var(--c-white); background: var(--c-green); border: 1px solid var(--c-green); padding: 10px 14px; min-height: 40px; transition: background .2s, border-color .2s; }
.hmv-cat .related-card:hover .related-cta-row { background: var(--c-gold); border-color: var(--c-gold); }
.hmv-cat .related-cta-row svg { flex-shrink: 0; transition: transform .2s; }
.hmv-cat .related-card:hover .related-cta-row svg { transform: translateX(3px); }

/* ── FAQ ── */
.hmv-cat .faq-section { background: #f5f9f7; padding: clamp(48px,6vw,72px) 0; }
.hmv-cat .faq-item { border-bottom: 1px solid rgba(26,55,53,.1); }
.hmv-cat .faq-item:first-of-type { border-top: 1px solid rgba(26,55,53,.1); }
.hmv-cat .faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 0; cursor: pointer; list-style: none; font-family: var(--ff-sans); font-size: clamp(14px,1.2vw,15px); font-weight: var(--fw-reg); color: var(--c-green); line-height: 1.4; -webkit-tap-highlight-color: transparent; min-height: 48px; }
.hmv-cat .faq-item summary::-webkit-details-marker { display: none; }
.hmv-cat .faq-item summary:hover { color: var(--c-green-mid); }
.hmv-cat .faq-icon { width: 24px; min-width: 24px; height: 24px; border: 1px solid rgba(26,55,53,.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .25s; background: #fff; }
.hmv-cat .faq-icon svg { width: 9px; height: 9px; stroke: var(--c-green); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; transition: transform .25s; }
.hmv-cat details[open].faq-item .faq-icon { background: var(--c-green); border-color: var(--c-green); }
.hmv-cat details[open].faq-item .faq-icon svg { stroke: #fff; transform: rotate(45deg); }
.hmv-cat .faq-body { font-family: var(--ff-sans); font-size: 14px; font-weight: var(--fw-light); line-height: 1.9; color: var(--c-green-mid); padding: 0 0 20px; max-width: 640px; overflow-wrap: break-word; word-break: break-word; }

/* ── CTA ── */
.hmv-cat .join-section { background: var(--c-green); padding: var(--sp-xl) 0; text-align: center; position: relative; overflow: hidden; }
.hmv-cat .join-glow { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: min(600px,90vw); height: 280px; background: radial-gradient(ellipse, rgba(180,155,101,.12) 0%, transparent 70%); pointer-events: none; }
.hmv-cat .join-section h2 { font-family: var(--ff-serif); font-size: clamp(28px,4.5vw,54px); font-weight: var(--fw-light); color: var(--c-gold-cream); margin-bottom: 14px; line-height: 1.08; }
.hmv-cat .join-section h2 em { font-style: italic; color: var(--c-gold-b); }
.hmv-cat .join-section p { font-family: var(--ff-sans); font-size: clamp(13px,1.2vw,14px); font-weight: var(--fw-light); color: rgba(218,205,179,.65); max-width: 460px; margin: 0 auto 36px; line-height: 1.85; }
.hmv-cat .join-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 479px) { .hmv-cat .join-btns { flex-direction: column; } .hmv-cat .join-btns .btn-p, .hmv-cat .join-btns .btn-g { width: 100%; justify-content: center; } }

/* ── E-E-A-T & DISCLAIMER ── */
.hmv-cat .eeat-bar { background: #f5f9f7; border-top: 1px solid var(--c-divider); border-bottom: 1px solid var(--c-divider); padding: 16px 0; }
.hmv-cat .eeat-inner { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; }
.hmv-cat .eeat-reviewer { display: flex; align-items: center; gap: 11px; }
.hmv-cat .eeat-avatar { width: 32px; min-width: 32px; height: 32px; border: 1px solid var(--c-divider); background: #e6f4ed; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.hmv-cat .eeat-avatar svg { width: 14px; height: 14px; stroke: var(--c-green-mid); fill: none; stroke-width: 1.5; stroke-linecap: round; }
.hmv-cat .eeat-name { font-family: var(--ff-sans); font-size: 9px; font-weight: var(--fw-med); letter-spacing: .18em; text-transform: uppercase; color: var(--c-green-mid); margin-bottom: 2px; }
.hmv-cat .eeat-title { font-size: 12.5px; font-weight: var(--fw-reg); color: var(--c-green); line-height: 1.3; }
.hmv-cat .eeat-links { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.hmv-cat .eeat-links a { font-family: var(--ff-sans); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--c-gold); text-decoration: none; transition: opacity .2s; }
.hmv-cat .eeat-links a:hover { opacity: .7; }
.hmv-cat .disclaimer-bar { background: #f5f9f7; border-top: 1px solid var(--c-divider); padding: 24px 0; }
.hmv-cat .disclaimer-bar p { font-family: var(--ff-sans); font-size: 11px; font-weight: var(--fw-light); color: var(--c-green-mid); line-height: 1.9; max-width: 920px; }
.hmv-cat .disclaimer-bar strong { color: var(--c-green); font-weight: var(--fw-med); }

/* ── SUBCAT LABELS ── */
.hmv-cat .subcat-label { font-family: var(--ff-sans); font-size: 9px; letter-spacing: .3em; text-transform: uppercase; color: var(--c-gold-b); opacity: .75; margin-bottom: 24px; display: flex; align-items: center; gap: 14px; }
.hmv-cat .subcat-label::after { content: ''; flex: 1; height: 1px; background: rgba(180,155,101,.1); }

.hmv-cat .pc-img-note { font-family: var(--ff-sans); font-size: 9px; font-style: italic; font-weight: 300; color: rgba(180,155,101,.65); padding: 0 20px 12px; line-height: 1.4; }
