/* ====================================================================
   Om Handletanken – designforslag (v2)
   Indlæses på Om Handletanken (live) og kladden 'om-handletanken-designforslag' (body.ht-omhtv2).
   Heroen er urørt. Entry-animationerne kommer fra co2-sections-modulet.
   ==================================================================== */
.ht-omhtv2 {
  --v2-ink: #0a1a13;
  --v2-muted: #4a6158;
  --v2-green: #095A42;
  --v2-mid: #0f8a68;
  --v2-pale: #e8f5ee;
  --v2-line: rgba(9,90,66,.10);
  --v2-ease: cubic-bezier(.22, 1, .36, 1);
}

/* Samme grundregler som den publicerede side (.page-id-627) */
.ht-omhtv2 .hero-section { display: none !important; }
.ht-omhtv2 .entry-content { margin-top: 0 !important; }
.ht-omhtv2 .entry-content > .wp-block-group { margin-block: 0 !important; }
.ht-omhtv2 .entry-content > .wp-block-group:last-of-type h2 { margin-bottom: 2rem !important; }

/* Formål-sektionen har samme spaltebredder som CO₂-sidens øverste
   indholdssektion (temaets standard) – ingen overstyringer her. */

/* ── Formålskort: ikonet får en synlig hvid kant – en blød skygge i
      ikonets egen farve, som på Anbefalinger-siden ─────────────────────── */
.ht-omhtv2 .ht-omht-formaal-badge2 {
  box-shadow: 0 8px 18px -8px color-mix(in srgb, var(--c, #3EBE81) 70%, transparent);
  transition: transform .35s var(--v2-ease);
}
.ht-omhtv2 .ht-omht-formaal-tile2:hover .ht-omht-formaal-badge2 { transform: translateY(-50%) scale(1.06); }

/* ── Tal: trompet-overskriften som på den publicerede side og en stram
      talrække uden kort – ikon, tal og etiket på én linje, adskilt af
      tynde lodrette linjer ─────────────────────────────────────────────── */
.ht-omhtv2 .ht-omhtv2-tal .ht-kicker { margin: 0 0 1.4rem; }
.ht-omhtv2 .ht-omhtv2-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0;
}
.ht-omhtv2 .ht-omhtv2-stat {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .15rem clamp(1.2rem, 2.5vw, 2rem);
  border-left: 1px solid rgba(9,90,66,.16);
}
.ht-omhtv2 .ht-omhtv2-stat:first-child { padding-left: 0; border-left: 0; }
.ht-omhtv2 .ht-omhtv2-stat-icon { display: inline-flex; flex-shrink: 0; }
.ht-omhtv2 .ht-omhtv2-stat-icon svg { width: 1.6rem; height: 1.6rem; }
.ht-omhtv2 .ht-omhtv2-stat > div { display: flex; align-items: center; gap: .9rem; }
.ht-omhtv2 .ht-omhtv2-stat b {
  display: block;
  font-size: clamp(2.3rem, 3.6vw, 2.9rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1;
  color: var(--v2-mid);
  font-variant-numeric: tabular-nums;
}
.ht-omhtv2 .ht-omhtv2-stat-l {
  display: block;
  max-width: 15ch;
  font-size: .88rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--v2-muted);
}
@media (max-width: 820px) {
  /* Mobil/tablet: tallene står som rækker adskilt af tynde vandrette linjer */
  .ht-omhtv2 .ht-omhtv2-stats { grid-template-columns: 1fr; }
  .ht-omhtv2 .ht-omhtv2-stat {
    padding: .95rem 0;
    border-left: 0;
    border-top: 1px solid rgba(9,90,66,.14);
  }
  .ht-omhtv2 .ht-omhtv2-stat:first-child { padding-top: 0; border-top: 0; }
  .ht-omhtv2 .ht-omhtv2-stat b { font-size: 2.2rem; min-width: 4.8rem; }
  .ht-omhtv2 .ht-omhtv2-stat-l { max-width: none; }
}

/* Sekretariatets og styregruppens personkort har samme styling og størrelse
   som på den publicerede side – ingen overstyringer her. */

/* ── Partnerorganisationer: hvide kort som sekretariatets ──────────────── */
.ht-omhtv2 .ht-partner-card {
  background: #fff;
  border-color: rgba(9,90,66,.08);
  box-shadow: 0 4px 24px rgba(9,90,66,.08);
  transition: transform .3s var(--v2-ease), box-shadow .3s var(--v2-ease);
}
.ht-omhtv2 .ht-partner-card:hover {
  background: #fff;
  transform: translateY(-3px);
  box-shadow: 0 16px 36px -18px rgba(9,90,66,.35);
}