/*
Theme Name:   Handletank Child
Description:  Child theme til Byggeriets Handletank – komplet redesign
Template:     blocksy
Version:      2.0.0
Text Domain:  handletank-child
*/

/* ================================================================
   DESIGN TOKENS
   ================================================================ */
:root {
  --ht-green-dark:    #095A42;
  --ht-green-forest:  #0d4a37;
  --ht-green-mid:     #178F66;
  --ht-green-bright:  #3EBE81;
  --ht-green-mint:    #C1E3CD;
  --ht-green-pale:    #e8f5ee;
  --ht-bg-light:      #F7FAFD;
  --ht-white:         #ffffff;
  --ht-black:         #0a1a13;
  --ht-text:          #1a2e24;
  --ht-text-muted:    #4a6158;
  --ht-radius-sm:     8px;
  --ht-radius-card:   24px;
  --ht-radius-pill:   999px;
  --ht-shadow-sm:     0 2px 12px rgba(9,90,66,.08);
  --ht-shadow-md:     0 8px 32px rgba(9,90,66,.14);
  --ht-shadow-lg:     0 20px 60px rgba(9,90,66,.18);
  --ht-ease:          cubic-bezier(.4,0,.2,1);
}

/* ================================================================
   GLOBAL
   ================================================================ */
html { scroll-behavior: smooth; }

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: var(--ht-white);
  color: var(--ht-text);
}

*, *::before, *::after { box-sizing: border-box; }

img { display: block; }

/* ================================================================
   HEADER  – hvid, transparent-til-opaque på scroll
   ================================================================ */
#header {
  background: var(--ht-white) !important;
  box-shadow: 0 1px 0 rgba(9,90,66,.10) !important;
  position: sticky !important;
  top: 0;
  z-index: 500;
}

/* Logo */
#header .ct-logo-container img,
#header .site-logo img {
  max-height: 44px !important;
}

/* Nav links */
#header .ct-nav-menu-element a,
#header .ct-menu a {
  color: var(--ht-text) !important;
  font-weight: 600;
  font-size: .9rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  transition: color .2s var(--ht-ease);
}

#header .ct-nav-menu-element a:hover,
#header .ct-menu a:hover {
  color: var(--ht-green-dark) !important;
}

/* ================================================================
   HERO  – wp:cover (full-width)
   ================================================================ */
/* Understøt den inline min-height vi sætter direkte i block-markup */
.wp-block-cover.alignfull {
  overflow: hidden;
  position: relative;
}

/* Hero-højde: lav nok til at logo-båndet netop skimtes i bunden */
.wp-block-cover.alignfull[style*="min-height:60px"],
.wp-block-cover.alignfull[style*="min-height: 60px"] {
  min-height: calc(100vh - 80px) !important; /* 80px = header-højde */
  max-height: 820px !important;
}

/* Ensure the background image fills beautifully */
.wp-block-cover__image-background {
  object-position: center 25% !important;
  transform: scale(1.02);
  transition: transform 8s var(--ht-ease);
}

/* Hero inner container */
.wp-block-cover .wp-block-cover__inner-container {
  max-width: 1320px !important;
  width: 100% !important;
  padding: 0 60px !important;
  position: relative;
  z-index: 2;
}

/* Hero – svagt venstre gradient-slør for læsbarhed */
.wp-block-cover.alignfull::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(3,14,8,0.35) 0%, rgba(3,14,8,0.12) 50%, transparent 75%);
  pointer-events: none;
  z-index: 1;
}
.wp-block-cover.alignfull .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
}

/* Hero H1 – massivt og dominerende */
.wp-block-cover h1.wp-block-heading,
.wp-block-cover .wp-block-heading {
  font-size: clamp(2.6rem, 5.5vw, 4.8rem) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.025em !important;
  color: var(--ht-white) !important;
  text-shadow: 0 2px 24px rgba(0,0,0,.28);
  max-width: 620px;
}

/* Hero centered H1 */
.wp-block-cover h1.has-text-align-center {
  font-size: clamp(2.8rem, 6vw, 5.5rem) !important;
  max-width: 100%;
  text-align: center !important;
}

/* Hero paragraph – stærkere skygge for bedre læsbarhed */
.wp-block-cover .wp-block-paragraph,
.wp-block-cover p.has-white-color,
.wp-block-cover__inner-container > .wp-block-group p,
.wp-block-cover__inner-container p {
  font-size: clamp(1rem, 1.8vw, 1.18rem) !important;
  line-height: 1.72 !important;
  color: rgba(255,255,255,0.96) !important;
  font-weight: 450;
  max-width: 580px;
  text-shadow: 0 1px 3px rgba(0,0,0,.55), 0 3px 16px rgba(0,0,0,.40);
  -webkit-font-smoothing: antialiased;
}

/* Alle sider undtagen forsiden: manchet + H1 flugter venstre, ensartet hvid */
body:not(.page-id-623) .wp-block-cover.alignfull .wp-block-cover__inner-container > * {
  margin-left: 0 !important;
  margin-right: auto !important;
  color: #ffffff !important;
}

/* Tablet hero */
@media (max-width: 1024px) {
  .wp-block-cover.alignfull {
    min-height: 500px !important;
    max-height: 700px !important;
  }
  .wp-block-cover .wp-block-cover__inner-container {
    padding: 0 32px !important;
  }
}

/* Mobile hero */
@media (max-width: 768px) {
  .wp-block-cover.alignfull {
    min-height: 400px !important;
    max-height: none !important;
  }
  .wp-block-cover .wp-block-cover__inner-container {
    padding: 0 20px !important;
  }
  .wp-block-cover h1.wp-block-heading,
  .wp-block-cover .wp-block-heading {
    font-size: clamp(2rem, 9vw, 3rem) !important;
    max-width: 100%;
  }
}

/* ================================================================
   BUTTONS  – pill-form, fed og professionel
   ================================================================ */
.gspb-buttonbox,
.wp-block-button__link,
.wp-element-button {
  border-radius: var(--ht-radius-pill) !important;
  font-weight: 700 !important;
  font-size: .88rem !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  padding: 15px 32px !important;
  border: 2px solid transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  transition:
    background .22s var(--ht-ease),
    border-color .22s var(--ht-ease),
    transform .2s var(--ht-ease),
    box-shadow .22s var(--ht-ease) !important;
}

/* Primær fyldt grøn knap */
.gspb-buttonbox[style*="background"],
.wp-block-button__link,
.wp-element-button {
  box-shadow: 0 4px 16px rgba(9,90,66,.25) !important;
}

.gspb-buttonbox:hover,
.wp-block-button__link:hover,
.wp-element-button:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 30px rgba(9,90,66,.35) !important;
}

/* Outline knap (transparent bg) */
.gspb-buttonbox[style*="#ffffff00"],
.gspb-buttonbox[style*="rgba(255, 255, 255, 0)"],
.gspb-buttonbox[style*="rgba(255,255,255,0)"] {
  border: 2px solid var(--ht-green-dark) !important;
  color: var(--ht-green-dark) !important;
}

.gspb-buttonbox[style*="#ffffff00"]:hover {
  background: var(--ht-green-dark) !important;
  color: var(--ht-white) !important;
  border-color: var(--ht-green-dark) !important;
}

/* Ikon i knap */
.gspb-buttonbox-icon svg,
.gspb-buttonbox-icon img {
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  flex-shrink: 0;
  transition: transform .2s var(--ht-ease);
}

.gspb-buttonbox:hover .gspb-buttonbox-icon svg,
.gspb-buttonbox:hover .gspb-buttonbox-icon img {
  transform: translateX(3px) translateY(-3px);
}

/* ================================================================
   LOGO KARRUSEL  – mint grøn baggrund + inverterede logoer
   ================================================================ */

/* Sektions-wrapper der indeholder TOP-swipers */
.gspb_row-id-gsbp-601ff32,
#gspb_row-id-gsbp-601ff32 {
  background: var(--ht-green-mint) !important;
  /* Fjern den negative -25px margin der overlap'er med hero */
  margin-top: 0 !important;
}

/* Swiper-container i logo-sektion – fjern dark-green bg */
.gspb_slider-id-gsbp-cea4acc .swiper,
.gspb_slider-id-gsbp-dc5f452 .swiper {
  background: transparent !important;
}

/* Overskrift-label "PARTNERSKABSORGANISATIONER:" */
.gspb_container-gsbp-d6153a4 p,
#gspb_container-id-gsbp-d6153a4 p {
  color: var(--ht-green-dark) !important;
  font-weight: 700;
  letter-spacing: .1em;
  font-size: .75rem !important;
}

/* Bottom logo swiper */
.gspb_slider-id-gsbp-dc5f452 {
  background-color: var(--ht-green-mint) !important;
}

.gspb_slider-id-gsbp-dc5f452 .swiper-slide-inner {
  background-color: var(--ht-green-mint) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px 16px !important;
  min-height: 90px;
}

/* ================================================================
   LOGO MARQUEE – CSS-animeret logostrip (erstatter Greenshift swiper)
   Visuelt udtryk: mørk grøn (forlænger hero), hvide logoer
   ================================================================ */

/* ---------------------------------------------------------------
   Nul-mellemrum: Hero → Logo-strip → Vi samler
   Blocksy bruger :is(.is-layout-flow,.is-layout-constrained)>*
   til at tilføje margin-block-start (block-gap) mellem blokke.
   Vi nulstiller disse for de tre øverste sektioner.
   --------------------------------------------------------------- */

/* Hero: ingen bund-margin */
.wp-block-cover.alignfull {
  margin-block-end: 0 !important;
  margin-bottom: 0 !important;
}

/* Logo-strip: ingen margin hverken op eller ned */
.wp-block-group.alignfull:has(.ht-logo-marquee) {
  display: block;
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Blocksy layout-flow block-gap nulstil for disse tre sektioner */
:is(.is-layout-flow, .is-layout-constrained) > .wp-block-cover.alignfull {
  margin-block-end: 0 !important;
}

:is(.is-layout-flow, .is-layout-constrained) > .wp-block-group.alignfull:has(.ht-logo-marquee) {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

/* "Vi samler" group direkte efter logo-strip: ingen top-margin */
:is(.is-layout-flow, .is-layout-constrained) > .wp-block-group.alignfull:has(.ht-logo-marquee) + * {
  margin-block-start: 0 !important;
}

.wp-block-group.alignfull:has(.ht-logo-marquee) + * {
  margin-top: 0 !important;
  margin-block-start: 0 !important;
}

/* Marquee wrapper: mørk grøn, ingen padding – forlænger hero */
.ht-logo-marquee {
  background-color: var(--ht-green-dark);
  overflow: hidden;
  padding: 0;
  width: 100%;
  display: block;
  font-size: initial;
  line-height: initial;
}

.ht-logo-track {
  display: flex;
  width: max-content; /* VIGTIGT: lader tracken strække ud over container-bredden */
  flex-wrap: nowrap;
  align-items: center;
  /* 4 identical sets of 12 logos; animation moves by exactly 1 set = 12 × 218px = 2616px */
  animation: ht-marquee 35s linear infinite;
  will-change: transform;
}

@media (hover: hover) {
  .ht-logo-track:hover {
    animation-play-state: paused;
  }
}

.ht-logo-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 218px; /* fixed width: image max 130px + 2×44px padding = 218px */
  padding: 28px 0;  /* vertikalt åndedræt – horisontal luft er bagt ind i de 218px */
}

/* Logoerne er hvide PNG'er – vises direkte på mørk grøn, ingen filter */
.ht-logo-item img {
  height: 44px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  filter: none;
  opacity: 0.70;
  transition: opacity .3s ease;
}

.ht-logo-item img:hover {
  opacity: 1;
}

@keyframes ht-marquee {
  /* translateX(-%) er relativt til elementets EGEN bredde.
     4 sæt à 12 logoer → -25% = præcis 1 sæt. Virker på alle skærmstørrelser. */
  from { transform: translateX(0); }
  to   { transform: translateX(-25%); }
}

/* ── Tre fliser (native WP blocks) ─────────────────────────────────── */

/* Force columns to lay out side-by-side (WP generates is-layout-constrained
   which stacks them) */
.wp-block-columns:has(.ht-tile) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1.5rem !important;
}
.wp-block-columns:has(.ht-tile) > .wp-block-column {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  /* Reset stacking margins from is-layout-constrained */
  margin-block-start: 0 !important;
}

/* Column wrapper: full height flex so tiles can grow */
.wp-block-column:has(.ht-tile) {
  display: flex;
  flex-direction: column;
}

/* Tile card */
.ht-tile {
  flex: 1;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08), 0 1px 3px rgba(0,0,0,0.06) !important;
  display: flex !important;
  flex-direction: column !important;
  /* Override WP's align-items:flex-start so children stretch full width */
  align-items: stretch !important;
  transition: transform 0.25s var(--ht-ease), box-shadow 0.25s var(--ht-ease) !important;
  cursor: pointer;
}
.ht-tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(9,90,66,0.14), 0 2px 8px rgba(9,90,66,0.08) !important;
}
.ht-tile:hover > .wp-block-image:first-child img {
  transform: scale(1.04);
}
.ht-tile > .wp-block-image:first-child img {
  transition: transform 0.35s var(--ht-ease);
}

/* Image: flush to card edges, fixed height */
.ht-tile > .wp-block-image:first-child {
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0;
  width: 100% !important;
}
.ht-tile > .wp-block-image:first-child img {
  width: 100% !important;
  height: 220px;
  object-fit: cover;
  display: block;
  border-radius: 0 !important;
  max-width: none !important;
}

/* Text area: grows to fill remaining space */
.ht-tile > .wp-block-group {
  flex: 1;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

.ht-tile .wp-block-buttons {
  margin-top: auto;
}
.ht-tile .is-style-outline .wp-block-button__link {
  border: 2px solid var(--ht-green-dark) !important;
  color: var(--ht-green-dark) !important;
  background: transparent !important;
}
.ht-tile .is-style-outline .wp-block-button__link:hover {
  background: var(--ht-green-dark) !important;
  color: #ffffff !important;
}
@media (max-width: 599px) {
  .wp-block-columns:has(.ht-tile) { flex-direction: column !important; }
  .ht-tile > .wp-block-image:first-child img { height: 180px; }
}

/* Logoer: hvide PNG → mørke via CSS invert (kun logo-swipers, ikke CEO-citater) */
.gspb_slider-id-gsbp-cea4acc .swiper-slide-inner img,
.gspb_slider-id-gsbp-dc5f452 .swiper-slide-inner img,
.gspb_slider-id-gsbp-cea4acc img,
.gspb_slider-id-gsbp-dc5f452 img {
  max-height: 48px !important;
  max-width: 130px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter:
    invert(1)
    sepia(1)
    saturate(2.5)
    hue-rotate(105deg)
    brightness(0.35) !important;
  opacity: .9;
  transition: filter .3s var(--ht-ease), opacity .3s var(--ht-ease);
}

.gspb_slider-id-gsbp-cea4acc img:hover,
.gspb_slider-id-gsbp-dc5f452 img:hover {
  filter:
    invert(1)
    sepia(1)
    saturate(3)
    hue-rotate(105deg)
    brightness(0.25) !important;
  opacity: 1;
}

/* Bundcontainer med logoer – INGEN dark green baggrund */
#gspb_container-id-gsbp-1a8464b {
  background-color: var(--ht-green-mint) !important;
  border-radius: 0 0 40px 40px;
  padding-bottom: 20px !important;
}

/* Skjul navigation pile på logo-swipers – vis dem på CEO-citat swiper */
.gspb_slider-id-gsbp-cea4acc .swiper-button-prev,
.gspb_slider-id-gsbp-cea4acc .swiper-button-next,
.gspb_slider-id-gsbp-dc5f452 .swiper-button-prev,
.gspb_slider-id-gsbp-dc5f452 .swiper-button-next {
  display: none !important;
}

/* ================================================================
   TOP LOGO KARRUSEL – force synlig (AOS-animation override)
   ================================================================ */
#gspb_row-id-gsbp-601ff32 {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* ================================================================
   CEO-CITAT KARRUSEL – show/hide approach
   ================================================================ */

/* Wrapper – smallere og forskudt til højre inden for sin kolonne */
.ht-ceo-box {
  position: relative;
  width: 90%;
  margin-left: auto;
}

/* Panels: kun ét synligt ad gangen */
.ht-ceo-panel {
  display: none;
}
.ht-ceo-panel.ht-active {
  display: block;
  animation: htFadeIn 0.35s ease;
}
@keyframes htFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Citat-kort */
.ht-ceo-quote {
  background: rgba(255,255,255,0.09);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 20px;
  padding: 36px 40px 32px;
  margin: 0;
  min-height: 260px;
  display: flex;
  flex-direction: column;
}

.ht-ceo-quote p {
  flex: 1;
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  line-height: 1.75;
  color: rgba(255,255,255,0.92);
  font-style: italic;
  margin: 0 0 2rem;
}

.ht-ceo-quote footer {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ht-ceo-quote footer img {
  width: 80px !important;
  height: 80px !important;
  min-width: 80px;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2px solid rgba(255,255,255,0.30);
  filter: none !important;
  flex-shrink: 0;
}

.ht-ceo-quote cite {
  font-style: normal;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.ht-ceo-quote cite strong {
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  display: block;
}

.ht-ceo-quote cite span {
  color: rgba(255,255,255,0.82);
  font-size: 0.82rem;
  display: block;
}

/* Navigation */
.ht-ceo-nav {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin-top: 20px;
  padding-left: 4px;
}

.ht-ceo-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.1);
  color: #fff;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, border-color 0.2s;
  flex-shrink: 0;
}

.ht-ceo-btn:hover {
  background: rgba(255,255,255,0.25);
  border-color: rgba(255,255,255,0.8);
}

.ht-ceo-dots {
  display: flex;
  gap: 8px;
  align-items: center;
}

.ht-ceo-dots button {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.55);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, transform 0.2s;
}

.ht-ceo-dots button.ht-active {
  background: #3EBE81;
  transform: scale(1.35);
}

/* ================================================================
   "33 ANBEFALINGER" COVER SECTION  – second .wp-block-cover
   ================================================================ */
/* Alle cover-blokke har dette overlays – gør det lidt mørkere/grønere */
.wp-block-cover__background.has-background-dim {
  opacity: .55 !important;
}

/* Tekst i midter-cover */
.wp-block-cover .wp-block-group.alignwide p.has-text-align-left,
.wp-block-cover .ext-animate--on + p {
  text-align: center !important;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* ================================================================
   GREENSHIFT SEKTIONER  – indholds-layout
   ================================================================ */
/* Generel row styling */
.wp-block-greenshift-blocks-row {
  transition: none;
}

/* Grønne info-bokse (#c1e3cd baggrund) */
.gspb_container[style*="#c1e3cd"],
.gspb_container[style*="c1e3cd"] {
  border-radius: 20px !important;
  padding: 32px !important;
  box-shadow: var(--ht-shadow-sm);
}

/* gspb_heading – stor og dominerende */
.gspb_heading {
  color: var(--ht-text);
  font-weight: 800;
}

/* Undertekst under heading */
.gspb_heading_subtitle {
  display: block !important;
  font-size: 1.05rem !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  margin-top: 1.2rem !important;
  color: var(--ht-text-muted) !important;
  opacity: 1 !important;
}

/* ================================================================
   OUTLINE-KNAP – hvid kant + hvid tekst til brug på mørk baggrund
   ================================================================ */
.ht-btn-outline-white .wp-block-button__link,
.ht-btn-outline-white.wp-block-button__link {
  background: transparent !important;
  background-color: transparent !important;
  color: #ffffff !important;
  border: 2px solid #ffffff !important;
  border-radius: 50px !important;
  padding: 13px 28px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  font-size: 0.88rem !important;
  box-shadow: none !important;
}
.ht-btn-outline-white .wp-block-button__link:hover {
  background: rgba(255,255,255,0.12) !important;
  transform: translateY(-2px) !important;
  box-shadow: none !important;
}

/* ================================================================
   KORT-SEKTION  – de 3 bundkort (gspb_row-id-gsbp-e304581)
   ================================================================ */

/* Overskrift over kort-sektionen */
#gspb_heading-id-gsbp-d1b4c76 {
  font-size: clamp(1.8rem, 3vw, 2.6rem) !important;
  font-weight: 800 !important;
  color: var(--ht-text) !important;
  letter-spacing: -.02em;
}

/* Tekst under overskrift */
#gspb_text-id-gsbp-2c13756 {
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
  color: var(--ht-text-muted) !important;
  max-width: 680px;
  margin: 0 auto;
}

/* Kortsektionens row – ingen ekstra margin */
.gspb_row-id-gsbp-e304581 {
  gap: 28px !important;
}

/* HVERT KORT (3 kolonner med 4-layout) */
.gspb_row__col--4 {
  border-radius: 24px !important;
  overflow: hidden;
  background: var(--ht-white) !important;
  border: 1.5px solid rgba(9,90,66,.12) !important;
  box-shadow: var(--ht-shadow-sm);
  transition:
    transform .3s var(--ht-ease),
    box-shadow .3s var(--ht-ease),
    border-color .3s var(--ht-ease) !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}

.gspb_row__col--4:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--ht-shadow-lg) !important;
  border-color: rgba(9,90,66,.25) !important;
}

/* Billede i hvert kort – fuld bredde, fast højde, kant-til-kant */
.gspb_row__col--4 .gspb_image,
.gspb_row__col--4 [class*="gspb_image"] {
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  overflow: hidden;
  height: 240px !important;
  aspect-ratio: unset !important;
  display: block !important;
}

/* Container direkte under kolonne: ingen padding */
.gspb_row__col--4 > .gspb_container,
.gspb_row__col--4 > .wp-block-greenshift-blocks-container {
  padding: 0 !important;
  margin: 0 !important;
}

.gspb_row__col--4 .gspb_image img,
.gspb_row__col--4 [class*="gspb_image"] img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  filter: none !important;
  display: block !important;
  transform: scale(1.01);
  transition: transform .5s var(--ht-ease);
}

.gspb_row__col--4:hover .gspb_image img {
  transform: scale(1.07);
}

/* Container i kort – ingen padding (billede skal til kanten) */
.gspb_row__col--4 .gspb_container {
  padding: 0 !important;
  background: transparent !important;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Kort-titel – padding siden billede er i samme container */
.gspb_row__col--4 .gspb_heading {
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  padding: 24px 24px 8px !important;
  color: var(--ht-text) !important;
  text-align: left !important;
}

/* Kort-beskrivelse */
.gspb_row__col--4 .gspb_text {
  font-size: .95rem !important;
  line-height: 1.65 !important;
  color: var(--ht-text-muted) !important;
  flex: 1;
  text-align: left !important;
  margin: 0 !important;
  padding: 0 24px 20px !important;
}

/* Knap i hvert kort */
.gspb_row__col--4 .gspb_button_wrapper {
  margin-top: auto;
  padding: 0 24px 24px !important;
}

.gspb_row__col--4 .gspb-buttonbox {
  width: 100%;
  justify-content: center !important;
  background: var(--ht-white) !important;
  border: 2px solid var(--ht-green-dark) !important;
  color: var(--ht-green-dark) !important;
  padding: 12px 20px !important;
}

.gspb_row__col--4 .gspb-buttonbox:hover {
  background: var(--ht-green-dark) !important;
  color: var(--ht-white) !important;
}

/* ================================================================
   BLOG / NYHEDER KORT
   ================================================================ */
.ct-blog-post {
  border-radius: 20px !important;
  overflow: hidden;
  box-shadow: var(--ht-shadow-sm);
  transition: transform .3s var(--ht-ease), box-shadow .3s var(--ht-ease);
  border: 1px solid rgba(9,90,66,.08);
}

.ct-blog-post:hover {
  transform: translateY(-6px);
  box-shadow: var(--ht-shadow-md);
}

.ct-blog-post .ct-image-container img {
  transition: transform .5s var(--ht-ease);
}

.ct-blog-post:hover .ct-image-container img {
  transform: scale(1.05);
}

.entry-card .entry-title a {
  color: var(--ht-text) !important;
  font-weight: 800;
  transition: color .2s var(--ht-ease);
}

.entry-card .entry-title a:hover {
  color: var(--ht-green-dark) !important;
}

/* Kategori-badge */
.ct-category-links a,
.entry-card .ct-meta-element-container a {
  background: var(--ht-green-mint) !important;
  color: var(--ht-green-forest) !important;
  border-radius: var(--ht-radius-pill) !important;
  padding: 4px 14px !important;
  font-size: .75rem !important;
  font-weight: 700 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: background .2s var(--ht-ease), color .2s var(--ht-ease) !important;
}

.ct-category-links a:hover {
  background: var(--ht-green-dark) !important;
  color: var(--ht-white) !important;
}

/* ================================================================
   INDRE SIDER  – overskrift-zone
   ================================================================ */
.ct-page-title-elem {
  padding-top: 80px;
  padding-bottom: 80px;
}

.page-title {
  font-weight: 900;
  letter-spacing: -.025em;
}

/* ================================================================
   ANBEFALINGER  – individuelle anbefaling-sider
   ================================================================ */
#gspb_text-id-gsbp-5910a15,
[class*="gspb_text"][style*="palette-color-2"] {
  font-size: .82rem !important;
  letter-spacing: .12em !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

/* ================================================================
   BASELINE SEKTION
   ================================================================ */
/* Drop shadow på rapport-cover */
.ht-rapport-img img,
.wp-block-image.size-large img[src*="handletankrapport"] {
  box-shadow: 0 20px 60px rgba(9,90,66,.18) !important;
  border-radius: 16px !important;
}

/* ================================================================
   BUNDBLOK – dark green full-width section with CEO carousel
   ================================================================ */

/* Kolonner i bundblok: top-flugt + øget gap mellem venstre og højre */
.wp-block-columns.are-vertically-aligned-center {
  align-items: flex-start !important;
  gap: clamp(3rem, 6vw, 6rem) !important;
}

/* Stats-rækken: 13 og 100+ side om side */
.wp-block-group[style*="095A42"] .wp-block-group.is-layout-flex.is-vertical:has(> .wp-block-separator) {
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: clamp(2rem, 5vw, 4rem) !important;
}
.wp-block-group[style*="095A42"] .wp-block-group.is-layout-flex.is-vertical:has(> .wp-block-separator) > .wp-block-separator {
  display: none !important;
}

/* H2 i bundblok: tagline-span (anden linje) */
.wp-block-columns.are-vertically-aligned-center h2 span {
  display: block;
  font-weight: 400 !important;
  font-style: italic !important;
  opacity: 0.65;
  font-size: 0.72em !important;
  letter-spacing: -0.01em !important;
  margin-top: 0.3em;
}

/* CEO quote card: fast min-height så den aldrig er for flad */
.ht-ceo-quote {
  min-height: 260px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* CEO quote p fylder tilgængeligt rum */
.ht-ceo-quote p {
  flex: 1;
}

/* ================================================================
   WHITE GAP FIX – fjern padding under page-content der skaber
   hvidt mellemrum mellem bundblok og footer
   ================================================================ */
#main.site-main,
.site-main {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* wp:html blokke (counter script, carousel) må ikke have margin */
.wp-block-html {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  line-height: 0;
  font-size: 0;
  display: block;
}

/* Bundblok (wp:group alignfull #095A42) – ingen bund-margin mod footer */
.wp-block-group.alignfull[style*="095A42"] {
  margin-bottom: 0 !important;
}

/* Blocksy is-layout-flow gap nulstilles for bundblok */
:is(.is-layout-flow, .is-layout-constrained) > .wp-block-group.alignfull[style*="095A42"] {
  margin-block-end: 0 !important;
}

/* ================================================================
   FOOTER – ultra-slim ét-linje bar
   ================================================================ */

/* Skjul den gamle Blocksy footer helt */
#footer.ct-footer {
  display: none !important;
}

/* Slim footer bar injiceret via wp_footer hook */
.ht-slim-footer {
  background: #031a10;
  border-top: none;
  margin-top: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 13px 48px;
}

.ht-slim-footer a {
  color: rgba(255,255,255,0.60);
  text-decoration: none;
  font-size: 0.82rem;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  gap: 7px;
  transition: color 0.2s;
}

.ht-slim-footer a:hover {
  color: var(--ht-green-bright);
}

.ht-slim-footer svg {
  flex-shrink: 0;
  opacity: 0.75;
  transition: opacity 0.2s;
}

.ht-slim-footer a:hover svg {
  opacity: 1;
}

@media (max-width: 600px) {
  .ht-slim-footer {
    flex-direction: column;
    gap: 8px;
    padding: 14px 24px;
    text-align: center;
  }
}

/* ================================================================
   ACCESSIBILITY
   ================================================================ */

/* Focus-ring: dobbelt ring sikrer synlighed på alle baggrunde
   (mørk ring + hvid mellemring = kontrast på alle farver)        */
:focus-visible {
  outline: 3px solid var(--ht-green-dark) !important; /* #095A42 = 8.23:1 på hvid */
  outline-offset: 2px !important;
  border-radius: 4px !important;
  box-shadow: 0 0 0 5px rgba(255,255,255,0.90) !important; /* hvid buffer på mørke bg */
}

/* Reduced motion: stop alle animationer */
@media (prefers-reduced-motion: reduce) {
  .ht-logo-track {
    animation: none !important;
  }
  .ht-ceo-slides {
    transition: none !important;
    will-change: auto !important;
  }
  .wp-block-cover__image-background {
    transform: none !important;
    transition: none !important;
  }
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ================================================================
   SECTION SPACING POLISH
   ================================================================ */
/* Generel sektion padding */
.gspb_row.alignfull > .gspb_row__content {
  max-width: 1320px;
  margin-left: auto;
  margin-right: auto;
}

/* Separator linie */
.wp-block-separator,
hr {
  border-color: var(--ht-green-mint) !important;
  opacity: .8 !important;
}

/* Dashed separator */
.wp-block-separator.is-style-wide,
hr.is-style-wide {
  border-style: dashed !important;
}

/* ================================================================
   MOBILE  – komplet responsive layout
   ================================================================ */
@media (max-width: 768px) {
  /* Kortene stacker */
  .gspb_row__col--4 {
    width: 100% !important;
    margin-bottom: 20px;
  }

  /* Logo slider: 2 logoer pr. view */
  .swiper-slide-inner img,
  .gs-swiper img {
    max-height: 36px !important;
    max-width: 100px !important;
  }

  /* Knapper lidt mindre */
  .gspb-buttonbox,
  .wp-block-button__link {
    padding: 13px 24px !important;
    font-size: .82rem !important;
  }

  /* Tekst i sektioner */
  .gspb_heading_subtitle {
    font-size: .95rem !important;
  }

  /* Section inner padding */
  .gspb_row__content {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

@media (max-width: 480px) {
  .wp-block-cover.alignfull {
    min-height: 340px !important;
  }

  .gspb-buttonbox,
  .wp-block-button__link {
    width: 100%;
    justify-content: center !important;
  }
}

/* ================================================================
   OM HANDLETANKEN – side-specifikke styles
   Påvirker IKKE forsiden
   ================================================================ */

/* Formål – 3 checkmarks på linje */
.ht-formaal-checks {
  display: flex;
  gap: clamp(1rem, 3vw, 2.5rem);
  flex-wrap: wrap;
  margin: 1.8rem 0 0;
}
.ht-formaal-check {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  flex: 1 1 200px;
  background: #e8f5ee;
  border-radius: 10px;
  padding: 1rem 1.2rem;
}
.ht-check-icon {
  color: var(--ht-green-bright);
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.5;
  flex-shrink: 0;
}
.ht-formaal-check p {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ht-green-dark);
  line-height: 1.4;
}

/* Sekretariat – 2 personers grid */
.ht-team-grid {
  display: flex;
  gap: clamp(1.5rem, 4vw, 3rem);
  flex-wrap: wrap;
  justify-content: center;
}
.ht-team-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #fff;
  border-radius: 16px;
  padding: 2rem 2rem 1.8rem;
  flex: 1 1 260px;
  max-width: 320px;
  box-shadow: 0 4px 24px rgba(9,90,66,.08);
}
.ht-team-card img {
  width: 114px;
  height: 114px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 1rem;
  border: 3px solid var(--ht-green-bright);
}
.ht-team-card strong {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0d1f1a;
  margin-bottom: 0.2rem;
}
.ht-team-title {
  font-size: 0.82rem;
  color: rgba(0,0,0,0.50);
  margin-bottom: 0.9rem;
  display: block;
}
.ht-team-card a {
  font-size: 0.82rem;
  color: var(--ht-green-dark);
  text-decoration: none;
  line-height: 1.8;
}
.ht-team-card a:hover { text-decoration: underline; }
.ht-team-desc {
  font-size: 0.83rem;
  color: rgba(0,0,0,0.52);
  line-height: 1.6;
  margin: 0 0 0.9rem;
  flex: 1;
  font-style: italic;
  text-align: left;        /* Venstrejuster brødtekst uanset kortets text-align:center */
}

/* Styregruppe – flex wrap, centrerer automatisk ulige antal (fx 13) */
.ht-styregruppe-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(1rem, 2.5vw, 1.8rem);
  margin-top: 0.5rem;
}
.ht-sg-card {
  flex: 0 0 calc(33.333% - 1.2rem);
}
.ht-sg-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: rgba(255,255,255,0.07);
  border-radius: 12px;
  padding: 1.4rem 1rem 1.2rem;
  transition: background 0.2s;
}
.ht-sg-card:hover { background: rgba(255,255,255,0.13); }
.ht-sg-card img {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 0.9rem;
  border: 2.5px solid rgba(62,190,129,0.50);
}
.ht-sg-card strong {
  font-size: 0.88rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.2rem;
  line-height: 1.25;
}
.ht-sg-card span {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.3;
  display: block;
}
.ht-sg-card em {
  font-size: 0.72rem;
  font-style: normal;
  color: var(--ht-green-bright);
  margin-top: 0.25rem;
  display: block;
}

/* Partnerorganisationer — cards */
.ht-partner-cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(1rem, 2.5vw, 2rem);
  margin-top: 2rem;
}
.ht-partner-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #f7faf8;
  border: 1px solid rgba(9,90,66,0.10);
  border-radius: 14px;
  padding: 1.6rem 1.2rem 1.4rem;
  flex: 0 0 calc(20% - 1.6rem);
  min-width: 160px;
  max-width: 200px;
  transition: background 0.2s, box-shadow 0.2s;
  gap: 0;
}
.ht-partner-card:hover {
  background: #eef6f1;
  box-shadow: 0 6px 20px rgba(9,90,66,0.10);
}
.ht-partner-card img {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
  margin: 0 0 0.85rem;
  border: 2.5px solid rgba(62,190,129,0.45);
  flex-shrink: 0;
}
.ht-partner-card strong {
  font-size: 0.88rem;
  font-weight: 700;
  color: #0a1a14;
  line-height: 1.25;
  margin: 0 0 0.25rem;
  display: block;
}
.ht-partner-card span {
  font-size: 0.70rem;
  color: rgba(0,0,0,0.48);
  line-height: 1.3;
  display: block;
  margin: 0 0 0.3rem;
}
.ht-partner-card em {
  font-size: 0.70rem;
  font-style: normal;
  color: var(--ht-green-dark, #095A42);
  font-weight: 600;
  display: block;
  margin: 0;
  line-height: 1.3;
}

/* Responsiv */
@media (max-width: 900px) {
  .ht-partner-card { flex: 0 0 calc(33.33% - 1.4rem); }
}
@media (max-width: 560px) {
  .ht-partner-card { flex: 0 0 calc(50% - 1rem); }
}

/* Kommissorium CTA-knapper */
.ht-cta-row {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1.8rem;
}
.ht-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.85rem 2rem;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-decoration: none;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.ht-cta-btn--primary {
  background: var(--ht-green-dark);
  color: #fff;
}
.ht-cta-btn--primary:hover { background: #0d7a5a; color: #fff; }
.ht-cta-btn--ghost {
  background: transparent;
  color: var(--ht-green-dark);
  border: 2px solid var(--ht-green-dark);
}
.ht-cta-btn--ghost:hover {
  background: var(--ht-green-dark);
  color: #fff;
}

/* Ingen luft mellem sekretariat og styregruppe (kun side 627) */
.page-id-627 .wp-block-group[style*="e8f5ee"] {
  margin-bottom: 0 !important;
  margin-block-end: 0 !important;
  padding-bottom: 2.5rem !important;
}
.page-id-627 .wp-block-group[style*="095A42"],
.page-id-627 :is(.is-layout-flow,.is-layout-constrained) > .wp-block-group[style*="095A42"] {
  margin-top: 0 !important;
  margin-block-start: 0 !important;
  padding-top: 2.5rem !important;
}

/* Responsive: styregruppe 2-kol på tablet */
@media (max-width: 900px) {
  .ht-sg-card { flex: 0 0 calc(50% - 1rem); }
}
@media (max-width: 540px) {
  .ht-sg-card { flex: 0 0 calc(50% - 0.5rem); }
  .ht-team-card { max-width: 100%; }
  .ht-partner-logos { flex-wrap: wrap; }
}

/* ================================================================
   OM HANDLETANKEN – hero alignment + partner logos + modaler
   ================================================================ */

/* Hvid gap fjernet: sekretariat → styregruppe (scoped til side 627) */
.page-id-627 .wp-block-group[style*="e8f5ee"] {
  margin-block-end: 0 !important;
}
.page-id-627 .wp-block-group[style*="095A42"] {
  margin-block-start: 0 !important;
}
:is(.is-layout-flow,.is-layout-constrained) > .page-id-627 .wp-block-group[style*="095A42"],
.page-id-627 :is(.is-layout-flow,.is-layout-constrained) > .wp-block-group[style*="095A42"] {
  margin-block-start: 0 !important;
}

/* Partner logos – 5 individuelle, gråskaleret med hover-farve, 1100px bredde */
.ht-partner-logos {
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: clamp(1rem, 3vw, 2.5rem) !important;
}
.ht-partner-logos img {
  height: 40px !important;
  max-width: 150px !important;
  width: auto !important;
  flex: 1 1 auto !important;
  object-fit: contain !important;
  opacity: 0.65 !important;
  filter: grayscale(100%) !important;
  transition: opacity 0.2s, filter 0.2s !important;
}
.ht-partner-logos img:hover {
  opacity: 1 !important;
  filter: grayscale(0%) !important;
}

/* Modal */
.ht-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
.ht-modal.open { display: flex; }

.ht-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3,14,8,0.72);
  backdrop-filter: blur(3px);
  cursor: pointer;
}
.ht-modal-box {
  position: relative;
  background: #fff;
  border-radius: 16px;
  width: min(720px, calc(100vw - 2rem));
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: 0 32px 80px rgba(0,0,0,0.28);
  z-index: 1;
}
.ht-modal-close {
  position: sticky;
  top: 1.2rem;
  float: right;
  margin: 1.2rem 1.2rem 0 0;
  background: #f0f4f2;
  border: none;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  font-size: 0.9rem;
  cursor: pointer;
  color: #333;
  transition: background 0.2s;
  z-index: 2;
}
.ht-modal-close:hover { background: #dde9e3; }

.ht-modal-body {
  padding: 2rem 2.4rem 2.4rem;
}
.ht-modal-body h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--ht-green-dark);
  margin: 0 0 1.2rem;
}
.ht-modal-body h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 1.6rem 0 0.5rem;
  color: #0d1f1a;
}
.ht-modal-body p {
  font-size: 0.93rem;
  line-height: 1.7;
  color: rgba(0,0,0,0.72);
  margin-bottom: 0.8rem;
}

/* Bidragsydere-liste: 3 kolonner */
.ht-bidy-list {
  columns: 3;
  column-gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.ht-bidy-list li {
  font-size: 0.88rem;
  color: rgba(0,0,0,0.72);
  padding: 0.2rem 0;
  border-bottom: 1px solid #f0f0f0;
  break-inside: avoid;
}
@media (max-width: 560px) {
  .ht-bidy-list { columns: 2; }
  .ht-modal-body { padding: 1.2rem 1.2rem 1.6rem; }
}

/* 13. styregruppemedlem – initialer-avatar */
.ht-sg-avatar {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: rgba(62,190,129,0.18);
  border: 2px solid rgba(62,190,129,0.50);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--ht-green-bright);
  letter-spacing: 0.05em;
  margin-bottom: 0.75rem;
  flex-shrink: 0;
}




/* ================================================================
   UDGIVELSER PAGE (post ID 1078) — ht-udg-* classes
   All rules scoped to .page-id-1078
   ================================================================ */

/* --- Publication card grid --- */
.page-id-1078 .ht-udg-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.5rem;
  margin-top: 2.5rem;
}

.page-id-1078 .ht-udg-card {
  background: #ffffff;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 24px rgba(0,0,0,0.10);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
  text-decoration: none;
  color: inherit;
}

.page-id-1078 .ht-udg-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 36px rgba(0,0,0,0.16);
  text-decoration: none;
  color: inherit;
}

.page-id-1078 .ht-udg-card__img-wrap {
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: #f4f4f2;
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-id-1078 .ht-udg-card__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.35s ease;
  padding: 0;
}

.page-id-1078 .ht-udg-card:hover .ht-udg-card__img-wrap img {
  transform: scale(1.04);
}

.page-id-1078 .ht-udg-card__body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.5rem;
}

.page-id-1078 .ht-udg-card__date {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ht-green-bright, #3EBE81);
}

.page-id-1078 .ht-udg-card__title {
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  font-weight: 700;
  color: #0a1a14;
  line-height: 1.3;
  margin: 0;
}

.page-id-1078 .ht-udg-card__desc {
  font-size: 0.92rem;
  color: rgba(0,0,0,0.6);
  line-height: 1.55;
  margin: 0;
  flex: 1;
}

.page-id-1078 .ht-udg-card__btn {
  display: inline-block;
  margin-top: 1rem;
  padding: 0.6rem 1.3rem;
  background: var(--ht-green-dark, #095A42);
  color: #ffffff !important;
  border-radius: 6px;
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  align-self: flex-start;
  transition: background 0.2s ease;
}

.page-id-1078 .ht-udg-card__btn:hover {
  background: var(--ht-green-forest, #0d4a37);
}

/* --- Featured publication row --- */
.page-id-1078 .ht-udg-featured-row {
  display: flex;
  gap: 3rem;
  align-items: flex-start;
  margin-top: 2rem;
}

.page-id-1078 .ht-udg-featured-img {
  flex: 0 0 220px;
  max-width: 220px;
}

.page-id-1078 .ht-udg-featured-img img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.14);
  display: block;
}

.page-id-1078 .ht-udg-featured-text {
  flex: 1;
}

.page-id-1078 .ht-udg-feat-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.page-id-1078 .ht-udg-feat-list li {
  font-size: 1rem;
  color: rgba(0,0,0,0.72);
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
}

.page-id-1078 .ht-udg-check {
  color: var(--ht-green-dark, #095A42);
  font-weight: 700;
  font-size: 1.1rem;
  flex-shrink: 0;
}

.page-id-1078 .ht-udg-btn-primary {
  display: inline-block;
  padding: 0.85rem 2rem;
  background: var(--ht-green-dark, #095A42);
  color: #ffffff !important;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s ease;
}

.page-id-1078 .ht-udg-btn-primary:hover {
  background: var(--ht-green-forest, #0d4a37);
}

/* --- Responsive --- */
@media (max-width: 680px) {
  .page-id-1078 .ht-udg-grid {
    grid-template-columns: 1fr;
  }
  .page-id-1078 .ht-udg-card__img-wrap {
    aspect-ratio: 3 / 2;
  }
  .page-id-1078 .ht-udg-featured-row {
    flex-direction: column;
    gap: 1.5rem;
  }
  .page-id-1078 .ht-udg-featured-img {
    flex: none;
    max-width: 160px;
    margin: 0 auto;
  }
}

/* ============================================================
   POST 1284 — Publication detail page
   CSS prefix: ht-pub-
   ============================================================ */

/* ---------- HERO ---------- */
.page-id-1284 .ht-pub-hero {
  background: #095A42;
  background-image: url('http://handletank.local/wp-content/uploads/2026/02/byggeplads1.png');
  background-size: cover;
  background-position: center;
  position: relative;
  padding: 0;
}

.page-id-1284 .ht-pub-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(9, 90, 66, 0.82);
}

.page-id-1284 .ht-pub-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 900px;
  margin: 0 auto;
  padding: 90px 40px 80px;
}

.page-id-1284 .ht-pub-hero__label {
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #3EBE81;
  margin: 0 0 1rem;
}

.page-id-1284 .ht-pub-hero__title {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  color: #ffffff !important;
  line-height: 1.15;
  margin: 0 0 1rem;
}

.page-id-1284 .ht-pub-hero__subtitle,
.page-id-1284 .ht-pub-hero__inner p:not(.ht-pub-hero__label) {
  font-size: 1.15rem;
  color: rgba(255,255,255,0.82) !important;
  margin: 0;
  max-width: 680px;
}

/* ---------- MAIN TWO-COLUMN ---------- */
.page-id-1284 .ht-pub-main {
  background: #ffffff;
  padding: 70px 0;
}

.page-id-1284 .ht-pub-main__inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 60px;
  align-items: start;
}

.page-id-1284 .ht-pub-cover-img,
.page-id-1284 .ht-pub-cover-img img {
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.18);
  display: block;
}

.page-id-1284 .ht-pub-section-h2 {
  font-size: 1.6rem;
  font-weight: 700;
  color: #095A42;
  margin: 0 0 1.2rem;
}

.page-id-1284 .ht-pub-main__text p {
  font-size: 1rem;
  line-height: 1.75;
  color: rgba(0,0,0,0.75);
  margin: 0 0 1rem;
}

/* Meta block */
.page-id-1284 .ht-pub-meta {
  margin-top: 2rem;
  border-top: 2px solid #e8f5ee;
  padding-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.page-id-1284 .ht-pub-meta__item {
  display: flex;
  gap: 1rem;
  align-items: baseline;
}

.page-id-1284 .ht-pub-meta__label {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #095A42;
  min-width: 90px;
  flex-shrink: 0;
}

.page-id-1284 .ht-pub-meta__value {
  font-size: 0.95rem;
  color: rgba(0,0,0,0.72);
}

/* ---------- KEY FINDINGS ---------- */
.page-id-1284 .ht-pub-findings {
  background: #095A42;
  padding: 70px 0;
}

.page-id-1284 .ht-pub-findings__inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 40px;
}

.page-id-1284 .ht-pub-findings__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #ffffff !important;
  margin: 0 0 2.5rem;
  text-align: center;
}

.page-id-1284 .ht-pub-findings__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 1fr;
  gap: 1.5rem;
}

/* Fjern Gutenberg block-gap margins på grid-celler */
.page-id-1284 .ht-pub-findings__grid > .wp-block-group {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

.page-id-1284 .ht-pub-finding-card {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 12px;
  padding: 2rem;
}

/* Kontrollér afstand INDEN I hvert kort */
.page-id-1284 .ht-pub-finding-card > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}
.page-id-1284 .ht-pub-finding-card .ht-pub-finding-card__heading { margin-top: 0.55rem; }
.page-id-1284 .ht-pub-finding-card p:not(.ht-pub-finding-card__num) { margin-top: 0.4rem; }

.page-id-1284 .ht-pub-finding-card__num {
  font-size: 2.2rem;
  font-weight: 800;
  color: #3EBE81;
  line-height: 1;
  margin-bottom: 0.75rem;
  font-variant-numeric: tabular-nums;
}

.page-id-1284 .ht-pub-finding-card__heading {
  font-size: 1rem;
  font-weight: 700;
  color: #ffffff !important;
  margin: 0 0 0.75rem;
}

.page-id-1284 .ht-pub-finding-card__text,
.page-id-1284 .ht-pub-finding-card p:not(.ht-pub-finding-card__num) {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.75) !important;
  line-height: 1.65;
  margin: 0;
}

/* ---------- DOWNLOAD CTA ---------- */
.page-id-1284 .ht-pub-downloads {
  background: #F7FAFD;
  padding: 70px 0;
  text-align: center;
}

.page-id-1284 .ht-pub-downloads__inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 40px;
}

.page-id-1284 .ht-pub-downloads__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #095A42;
  margin: 0 0 0.6rem;
}

.page-id-1284 .ht-pub-downloads__lead,
.page-id-1284 .ht-pub-downloads__inner > p {
  font-size: 1rem;
  color: rgba(0,0,0,0.6);
  margin: 0 0 2.5rem;
}

/* Download button grid — wp:group med flex layout */
.page-id-1284 .ht-pub-dl-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.7rem !important;
  align-items: center !important;
  margin-bottom: 0 !important;
}

/* Knap-wrapper: auto-bred, intet stræk */
.page-id-1284 .ht-pub-dl-grid > .wp-block-button {
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
}

/* Link inde i knappen */
.page-id-1284 .ht-pub-dl-grid .wp-block-button__link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.6rem 1.3rem !important;
  border-radius: 8px !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  transition: background 0.18s ease, transform 0.15s ease !important;
  box-shadow: none !important;
  width: auto !important;
  white-space: nowrap !important;
}

/* Primær knap */
.page-id-1284 .ht-pub-dl-btn--primary .wp-block-button__link {
  background: #095A42 !important;
  color: #ffffff !important;
  border: none !important;
  padding: 0.7rem 1.6rem !important;
}
.page-id-1284 .ht-pub-dl-btn--primary .wp-block-button__link:hover {
  background: #074732 !important;
  transform: translateY(-1px);
}

/* Sekundær knap */
.page-id-1284 .ht-pub-dl-btn--secondary .wp-block-button__link {
  background: #ffffff !important;
  color: #095A42 !important;
  border: 1.5px solid #095A42 !important;
}
.page-id-1284 .ht-pub-dl-btn--secondary .wp-block-button__link:hover {
  background: #e8f5ee !important;
}

.page-id-1284 .ht-pub-back-wrap {
  margin-top: 2.5rem;
}

.page-id-1284 .ht-pub-back-link {
  font-size: 0.95rem;
  color: #095A42;
  text-decoration: none;
  font-weight: 600;
}

.page-id-1284 .ht-pub-back-link:hover {
  text-decoration: underline;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 768px) {
  .page-id-1284 .ht-pub-hero__inner {
    padding: 60px 24px 50px;
  }

  .page-id-1284 .ht-pub-main__inner {
    grid-template-columns: 1fr;
    padding: 0 24px;
    gap: 2rem;
  }

  .page-id-1284 .ht-pub-cover-img {
    max-width: 220px;
    margin: 0 auto;
  }

  .page-id-1284 .ht-pub-findings__grid {
    grid-template-columns: 1fr;
  }

  .page-id-1284 .ht-pub-findings__inner,
  .page-id-1284 .ht-pub-downloads__inner {
    padding: 0 24px;
  }

  .page-id-1284 .ht-pub-main {
    padding: 50px 0;
  }

  .page-id-1284 .ht-pub-findings,
  .page-id-1284 .ht-pub-downloads {
    padding: 50px 0;
  }
}


/* ================================================================
   PROJEKTER PAGE (page-id-626)
   ================================================================ */

/* --- Hero overlay: lysere så billedet er synligt --- */
.page-id-626 .wp-block-cover__background {
  opacity: 0.45 !important;
}

/* --- Hero tekst: ren hvid uden skygge --- */
.page-id-626 .wp-block-cover h1.wp-block-heading,
.page-id-626 .wp-block-cover .wp-block-heading {
  color: #ffffff !important;
  text-shadow: none !important;
}
.page-id-626 .wp-block-cover .wp-block-paragraph {
  color: #ffffff !important;
  text-shadow: none !important;
}
/* Fjern gradient-slør specifikt for denne side */
.page-id-626 .wp-block-cover.alignfull::after {
  display: none !important;
}

/* --- Stat row (intro section) --- */
.page-id-626 .ht-proj-stat-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 2.5rem;
}

.page-id-626 .ht-proj-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 20px 24px;
  background: #f7faf7;
  border: 1px solid #d0e8d8;
  border-radius: 16px;
}

.page-id-626 .ht-proj-stat-num {
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
  color: #095A42;
}

.page-id-626 .ht-proj-stat-label {
  font-size: 0.875rem;
  color: #4a6158;
  line-height: 1.4;
}

/* --- Three-track project cards grid --- */
.page-id-626 .ht-proj-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 0;
}

.page-id-626 .ht-proj-card {
  border-radius: 20px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  overflow: hidden;
  border: 1px solid transparent;
  transition: transform 200ms ease, box-shadow 200ms ease;
}

.page-id-626 .ht-proj-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 44px rgba(9,90,66,0.14);
}

.page-id-626 .ht-proj-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  border-radius: 20px 20px 0 0;
}

.page-id-626 .ht-proj-card--co2 {
  background: #dceee6;
  border-color: rgba(31,90,67,0.12);
}
.page-id-626 .ht-proj-card--co2::before {
  background: #1f5a43;
}

.page-id-626 .ht-proj-card--cir {
  background: #d6f3e8;
  border-color: rgba(15,138,104,0.12);
}
.page-id-626 .ht-proj-card--cir::before {
  background: #0f8a68;
}

.page-id-626 .ht-proj-card--bio {
  background: #eef4dc;
  border-color: rgba(123,148,66,0.12);
}
.page-id-626 .ht-proj-card--bio::before {
  background: #7b9442;
}

.page-id-626 .ht-proj-card-label {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #095A42;
  background: rgba(255,255,255,0.65);
  padding: 4px 10px;
  border-radius: 999px;
  width: fit-content;
}

.page-id-626 .ht-proj-card-count {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(9,90,66,0.65);
  margin-top: 4px;
}

.page-id-626 .ht-proj-card-title {
  margin: 0;
  font-size: clamp(1.1rem, 1.8vw, 1.35rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #0a1a13;
}

.page-id-626 .ht-proj-card-excerpt {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.7;
  color: #1a2e24;
  flex: 1;
}

.page-id-626 .ht-proj-card-progress {
  height: 8px;
  background: rgba(255,255,255,0.6);
  border-radius: 999px;
  overflow: hidden;
  margin-top: 8px;
}

.page-id-626 .ht-proj-card-progress-bar {
  height: 100%;
  border-radius: 999px;
  opacity: 0.85;
}

.page-id-626 .ht-proj-card--co2    .ht-proj-card-progress-bar { background: #1f5a43; }
.page-id-626 .ht-proj-card--cir    .ht-proj-card-progress-bar { background: #0f8a68; }
.page-id-626 .ht-proj-card--bio    .ht-proj-card-progress-bar { background: #7b9442; }

.page-id-626 .ht-proj-card-progress-label {
  font-size: 0.75rem;
  color: rgba(9,90,66,0.7);
  margin-top: 4px;
  display: block;
}

/* --- 33 anbefalings-grid: fjern hvid boks og match bredde med spor-cards --- */
.page-id-626 #ht-app {
  padding: 0 !important;
  background: transparent !important;
  width: 100% !important;
}
.page-id-626 #ht-app .ht-wrap {
  max-width: 100% !important;
}

/* --- Fjern rammer (border + shadow) fra de 33 anbefaling-cards --- */
.page-id-626 #ht-app .ht-card {
  border: none !important;
  box-shadow: none !important;
}
.page-id-626 #ht-app .ht-card:hover {
  box-shadow: none !important;
  border-color: transparent !important;
}

/* --- CO2-kortets topstreg: kontrastfarve så den ikke glider i ét med baggrunden --- */
.page-id-626 #ht-app .ht-card.co2::before {
  background: #3EBE81 !important;
}

/* CTA row (bottom section) --- */
.page-id-626 .ht-proj-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 2rem;
}

.page-id-626 .ht-proj-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease;
  cursor: pointer;
}

.page-id-626 .ht-proj-cta-btn--primary {
  background: #095A42;
  color: #ffffff;
  border: 2px solid #095A42;
}
.page-id-626 .ht-proj-cta-btn--primary:hover {
  background: #0d4a37;
  border-color: #0d4a37;
  box-shadow: 0 6px 20px rgba(9,90,66,0.30);
}

.page-id-626 .ht-proj-cta-btn--ghost {
  background: transparent;
  color: #095A42;
  border: 2px solid #095A42;
}
.page-id-626 .ht-proj-cta-btn--ghost:hover {
  background: #095A42;
  color: #ffffff;
}

/* --- Responsive --- */
@media (max-width: 900px) {
  .page-id-626 .ht-proj-stat-row {
    grid-template-columns: repeat(2, 1fr);
  }

  .page-id-626 .ht-proj-grid {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 480px) {
  .page-id-626 .ht-proj-stat-row {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .page-id-626 .ht-proj-stat {
    padding: 14px 16px;
  }

  .page-id-626 .ht-proj-cta-row {
    flex-direction: column;
    align-items: center;
  }

  .page-id-626 .ht-proj-cta-btn {
    width: 100%;
    max-width: 320px;
  }
}

/* ================================================================
   KONTAKT (page-id-629) – ht-kon-* klasser
   ================================================================ */

/* Projekt/udfordring: inline-stylet direkte i wp:html – ingen CSS nødvendig her */

/* Formular-wrapper: lidt luft og max-bredde */
.page-id-629 .ht-kon-form-wrap {
  max-width: 700px;
  margin: 0 auto;
}

/* Fjern luft: hero → grøn sektion */
.page-id-629 .wp-block-cover.alignfull {
  margin-block-end: 0 !important;
}
.page-id-629 :is(.is-layout-flow,.is-layout-constrained) > .wp-block-group[style*="095A42"] {
  margin-block-start: 0 !important;
}

/* Fjern gap mel. grøn sektion og formular sektion */
.page-id-629 .wp-block-group[style*="095A42"] {
  margin-block-end: 0 !important;
}
.page-id-629 .wp-block-group[style*="095A42"] + .wp-block-group {
  margin-block-start: 0 !important;
}

/* Fjern gap mel. formular og sekretariat */
.page-id-629 .wp-block-group[style*="e8f5ee"] {
  margin-block-start: 0 !important;
}

/* Mobil */
@media (max-width: 600px) {
  .page-id-629 .ht-kon-cards-row { flex-direction: column; }
  .page-id-629 .ht-kon-entry-card { flex: 1 1 auto; }
}

/* ================================================================
   NYHEDER – oversigt (blog-arkiv, .blog body-klasse)
   ================================================================ */

/* Page header – ingen hero, bare titel + manchet */
.ht-nyh-archive-header-wrap {
  background: #fff;
  padding: clamp(3rem, 6vw, 4.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
  margin-bottom: 0;
}

.ht-nyh-archive-header {
  max-width: 900px;
}

.ht-nyh-archive-header h1 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  color: #0a1a13;
  letter-spacing: -0.03em;
  margin: 0 0 0.5rem;
}

.ht-nyh-archive-header p {
  color: rgba(0,0,0,0.48);
  font-size: clamp(0.95rem, 1.4vw, 1.05rem);
  margin: 0;
}

/* Kort-grid: omskriv Blocksy's .entries til 3-kolonner */
.blog .entries {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: clamp(1.2rem, 2.5vw, 1.8rem) !important;
  padding: clamp(1rem, 2vw, 1.5rem) 0 clamp(2rem, 4vw, 3.5rem) !important;
}

/* Kortboks */
.blog article.entry-card {
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 16px rgba(9,90,66,0.07) !important;
  background: #fff !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform 0.22s var(--ht-ease), box-shadow 0.22s var(--ht-ease) !important;
}

.blog article.entry-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 10px 36px rgba(9,90,66,0.14) !important;
}

/* Billede: 3:2 ratio, kun afrunding øverst */
.blog article.entry-card .ct-media-container {
  aspect-ratio: 3 / 2 !important;
  display: block !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  border-radius: 16px 16px 0 0 !important;
}

.blog article.entry-card .ct-media-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.4s var(--ht-ease) !important;
}

.blog article.entry-card:hover .ct-media-container img {
  transform: scale(1.05) !important;
}

/* Titel */
.blog article.entry-card .entry-title {
  font-size: clamp(0.98rem, 1.5vw, 1.1rem) !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
  margin: 1rem 1.3rem 0.5rem !important;
  color: #0a1a13 !important;
}

.blog article.entry-card .entry-title a {
  color: inherit !important;
  text-decoration: none !important;
}

.blog article.entry-card .entry-title a:hover {
  color: var(--ht-green-dark) !important;
}

/* Meta: dato + kategori */
.blog article.entry-card .entry-meta {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.4rem 0.7rem !important;
  padding: 0 1.3rem 1.4rem !important;
  margin: 0 !important;
}

.blog article.entry-card .meta-date time,
.blog article.entry-card .meta-date span {
  font-size: 0.78rem !important;
  color: rgba(0,0,0,0.40) !important;
}

/* Kategori skjult på kort */
.blog article.entry-card .meta-categories {
  display: none !important;
}

/* Skjul skråstreg-separator efter dato */
.blog article.entry-card .meta-date::after {
  display: none !important;
}

/* Fjern "den" prefix foran datoen */
.blog article.entry-card .meta-date span:not([class]) {
  display: none !important;
}

/* ================================================================
   NYHEDER – enkelt-artikel: custom header erstatter Blocksy's hero
   Scoped til .single-post – påvirker KUN post-type 'post'
   ================================================================ */

/* Blocksy's hero-sektion erstattes server-side via PHP-filter.
   CSS som ekstra sikkerhedsnét for titel-containeren. */
.single-post .hero-section {
  display: none !important;
}

/* ================================================================
   Fuldbredde hero-billede på enkelt-indlæg
   Overskriver Blocksy's alignwide begrænsning (~1010 px)
   ================================================================ */

.single-post figure.ct-featured-image,
.single-post figure.ct-featured-image * {
  border-radius: 0 !important;
}

.single-post figure.ct-featured-image {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  min-height: 380px;
  max-height: 720px;
  height: clamp(380px, 50vw, 720px);
  overflow: hidden;
  display: block;
}

.single-post figure.ct-featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* ================================================================
   Custom artikel-header: kategori · rubrik · manchet · byline
   Ingen vandret padding – teksten flugter med brødtekst (760 px)
   ================================================================ */

.ht-artikel-header {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding: 2.5rem 0 0.5rem;
}

/* Reducer top-padding på første content-gruppe så der ikke er dobbelt luft */
.single-post .entry-content > .wp-block-group:first-child {
  padding-top: 1.5rem !important;
}

.ht-artikel-rubrik {
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: #0a1a13;
  margin: 0.8rem 0 1.2rem;
}

/* Manchet: vist i editoren (første blok) – skjult på frontend (vises fra PHP-hook) */
.single-post .entry-content p.ht-manchet {
  display: none;
}

/* Manchet fra PHP-hook: stilet som manchet */
.ht-artikel-manchet {
  font-size: clamp(1rem, 1.8vw, 1.18rem);
  font-weight: 600;
  color: #1a2e24;
  line-height: 1.7;
  margin: 0.9rem 0 1.2rem;
}

/* Faktaboks */
.single-post .entry-content .ht-faktaboks {
  background: var(--ht-green-pale, #e8f5ee);
  border-left: 4px solid var(--ht-green-bright, #3EBE81);
  border-radius: 0 12px 12px 0;
  padding: 1.4rem 1.8rem;
  margin: 2rem 0;
}
.single-post .entry-content .ht-faktaboks h3.wp-block-heading {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  color: var(--ht-green-dark, #095A42) !important;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin: 0 0 0.75rem !important;
}
.single-post .entry-content .ht-faktaboks .wp-block-list {
  margin: 0;
}
.single-post .entry-content .ht-faktaboks .wp-block-list li::before {
  background: var(--ht-green-dark, #095A42);
}

.ht-artikel-byline {
  font-size: 0.85rem;
  color: rgba(0, 0, 0, 0.45);
  margin: 0;
}

/* ================================================================
   NYHEDER – enkelt-artikel  (ht-nyh-* klasser)
   ================================================================ */

/* Topbillede: fuld bredde, 3:2 ratio, ingen tekst */
.ht-nyh-top-image {
  margin: 0;
  width: 100%;
  aspect-ratio: 3 / 2;
  max-height: 560px;
  overflow: hidden;
  display: block;
}

.ht-nyh-top-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Artikel-header: rubrik, manchet, byline */
.ht-nyh-article-header {
  padding-bottom: 1.8rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid rgba(0,0,0,0.10);
}

.ht-nyh-category-badge {
  display: inline-block;
  background: var(--ht-green-bright, #3EBE81);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.28rem 0.85rem;
  border-radius: 999px;
  margin-bottom: 1.1rem;
}

/* Badge på nyhedsoversigts-kort — placeres nederst */
.ht-nyh-category-badge--card {
  display: block;
  margin: 0.6rem 0.9rem 0.9rem;
  width: fit-content;
}

.ht-nyh-rubrik {
  font-size: clamp(1.7rem, 3.5vw, 2.6rem);
  font-weight: 900;
  color: #0a1a13;
  line-height: 1.12;
  letter-spacing: -0.03em;
  margin: 0 0 1rem;
}

.ht-nyh-manchet {
  font-size: clamp(1rem, 1.7vw, 1.15rem);
  font-weight: 600;
  color: #1a2e24;
  line-height: 1.7;
  margin: 0 0 1.4rem;
}

.ht-nyh-byline {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.82rem;
  color: rgba(0,0,0,0.48);
}

.ht-nyh-byline-dot {
  color: rgba(0,0,0,0.25);
}

/* Artikel-body — native Gutenberg-blokke (wp:heading, wp:quote, wp:list)
   Stilarter matcher den tidligere brugerdefinerede HTML */
.single-post .entry-content h2.wp-block-heading,
.ht-nyh-section-heading {
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  font-weight: 700;
  color: #095A42;
  margin: 2.5rem 0 0.9rem;
  letter-spacing: -0.02em;
}

/* Pull-quote – wp:quote */
.single-post .entry-content .wp-block-quote,
.ht-nyh-blockquote {
  border-left: 4px solid var(--ht-green-bright, #3EBE81);
  margin: 2rem 0;
  padding: 1.2rem 1.6rem;
  background: var(--ht-green-pale, #eef6f1);
  border-radius: 0 12px 12px 0;
}

.single-post .entry-content .wp-block-quote p,
.ht-nyh-blockquote p {
  font-size: clamp(1rem, 1.7vw, 1.15rem);
  font-style: italic;
  color: #1a2e24;
  line-height: 1.7;
  margin: 0 0 0.8rem;
}

.single-post .entry-content .wp-block-quote cite,
.single-post .entry-content .wp-block-quote .wp-block-quote__citation,
.ht-nyh-blockquote cite {
  font-size: 0.82rem;
  color: rgba(0,0,0,0.50);
  font-style: normal;
  display: block;
}

/* Bullet-liste – wp:list */
.single-post .entry-content .wp-block-list,
.ht-nyh-list {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.single-post .entry-content .wp-block-list li,
.ht-nyh-list li {
  padding-left: 1.5rem;
  position: relative;
  color: #2d3e36;
  line-height: 1.65;
  font-size: 0.97rem;
}

.single-post .entry-content .wp-block-list li::before,
.ht-nyh-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ht-green-bright, #3EBE81);
}

/* CTA-sektion */
.ht-nyh-cta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}

.ht-nyh-cta-label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ht-green-bright);
  margin: 0 0 0.4rem;
}

.ht-nyh-cta-heading {
  font-size: clamp(1.2rem, 2.2vw, 1.6rem);
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.5rem;
  letter-spacing: -0.02em;
}

.ht-nyh-cta-desc {
  color: rgba(255,255,255,0.72);
  font-size: 0.93rem;
  line-height: 1.65;
  margin: 0;
  max-width: 480px;
}

.ht-nyh-cta-btn,
.ht-nyh-cta-btn.wp-block-button {
  flex-shrink: 0;
}
.ht-nyh-cta-btn,
.ht-nyh-cta-btn.wp-block-button .wp-block-button__link {
  display: inline-block;
  background: var(--ht-green-bright) !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 0.95rem;
  padding: 0.85rem 1.8rem;
  border-radius: 999px !important;
  text-decoration: none;
  transition: background 0.2s, transform 0.15s;
  white-space: nowrap;
  border: none !important;
  box-shadow: none !important;
}
.ht-nyh-cta-btn:hover,
.ht-nyh-cta-btn.wp-block-button .wp-block-button__link:hover {
  background: #5dd49a !important;
  transform: translateY(-1px);
  color: #fff !important;
}

/* Mobil */
@media (max-width: 600px) {
  .ht-nyh-cta-row { flex-direction: column; align-items: flex-start; }
  .ht-nyh-cta-btn { width: 100%; text-align: center; }
}

/* ================================================================
   SINGLE POST: Reducer luft under CTA-boks → post-navigation
   ================================================================ */
.single-post .post-navigation {
  --margin: 24px;
  margin-top: 24px !important;
}

/* ================================================================
   GLOBAL MOBILFIXES — max-width: 600px
   ================================================================ */
@media (max-width: 600px) {

  /* --- Hero: safe-area padding + begræns hero-tekst-bredde --- */
  .wp-block-cover.alignfull .wp-block-cover__inner-container {
    padding-left:  max(1.1rem, env(safe-area-inset-left,  1.1rem)) !important;
    padding-right: max(1.1rem, env(safe-area-inset-right, 1.1rem)) !important;
  }

  /* --- Nyheder arkivoverskrift: kortere top-luft --- */
  .ht-nyh-archive-header-wrap {
    padding-top:    1.8rem;
    padding-bottom: 1rem;
  }

  /* --- Nyhedsartikel header: komprimér spacing --- */
  .ht-nyh-article-header {
    padding-bottom: 1.2rem;
    margin-bottom:  1.4rem;
  }
  .ht-nyh-rubrik {
    font-size: clamp(1.5rem, 6vw, 1.85rem);
    letter-spacing: -0.025em;
  }
  .ht-nyh-blockquote {
    padding-left: 1rem;
  }

  /* --- Team-kort (Kontakt + Om Handletanken): stretch til fuld bredde --- */
  .ht-team-grid {
    flex-direction: column;
    align-items:    stretch;
  }
  .ht-team-card {
    max-width: 100%;
    flex: 1 1 auto;
  }

  /* --- Projekter: anbefalingskort til fuld bredde --- */
  .page-id-626 .ht-proj-anbefaling-card {
    max-width: 100%;
  }

  /* --- Udgivelser: featured-row stacker --- */
  .page-id-1078 .ht-udg-featured-row {
    flex-direction: column;
    gap: 1.2rem;
  }

  /* --- Forhindrer horisontalt overflow globalt --- */
  .wp-block-group.alignfull,
  .wp-block-cover.alignfull {
    max-width: 100vw;
    overflow-x: hidden;
  }

  /* --- Hero-billede på nyheder: ingen radius på nogen breakpoint --- */
  .single-post figure.ct-featured-image,
  .single-post figure.ct-featured-image img,
  .single-post figure.ct-featured-image * {
    border-radius: 0 !important;
  }
}

/* =================================================================
   MOBILMENU – Blocksy ct-mobile-menu
   ================================================================= */

/* Selve overlay-panelet – alle kendte Blocksy-selektorer */
.ct-mobile-menu-drawer,
.ct-mobile-menu-drawer .ct-container,
.ct-mobile-menu-drawer > div,
[data-id="mobile-menu"],
[data-id="mobile-menu"] .ct-container,
.ct-drawer-container,
.ct-panel,
.ct-panel-inner {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* Links i mobilmenu */
.ct-mobile-menu li a,
[data-id="mobile-menu"] li a {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: #0a1a14 !important;
  padding: 0.85rem 1.4rem !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
  display: block !important;
  text-decoration: none !important;
  letter-spacing: -0.01em !important;
}

/* Aktiv/hover farve */
.ct-mobile-menu li a:hover,
[data-id="mobile-menu"] li a:hover,
.ct-mobile-menu li.current-menu-item > a,
[data-id="mobile-menu"] li.current-menu-item > a {
  color: #095A42 !important;
  background: rgba(9,90,66,0.04) !important;
}

/* Top-niveau nav-ikon (hamburger-knap) */
.ct-header .ct-toggle-dropdown-mobile,
[data-id="trigger"] .ct-toggle-dropdown-mobile {
  color: #095A42 !important;
}

/* Dropdown-pil */
.ct-mobile-menu .ct-submenu-toggle,
[data-id="mobile-menu"] .ct-submenu-toggle {
  color: #095A42 !important;
  border-left: 1px solid rgba(0,0,0,0.08) !important;
}

/* LinkedIn social ikon i header (kræver ny fane) */
.ct-header .ct-social-box a[href*="linkedin"] {
  position: relative;
}

/* ================================================================
   UDGIVELSE – single-page template
   ================================================================ */

.ht-udg-single-page {
  padding: 0;
}

/* Tilbagelink øverst */
.ht-udg-topbar {
  padding: 1.2rem 1.5rem 0;
  max-width: 1060px;
  margin: 0 auto;
}

.ht-udg-back {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ht-text-muted);
  text-decoration: none;
  transition: color 0.15s;
}

.ht-udg-back:hover {
  color: var(--ht-green-dark);
}

/* Hoved-layout: 2-kolonne */
.ht-udg-layout {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
  max-width: 1060px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 3rem) 1.5rem clamp(3rem, 6vw, 5rem);
}

@media (max-width: 700px) {
  .ht-udg-layout {
    grid-template-columns: 1fr;
  }
}

/* Forsidebillede – sticky på desktop, statisk på mobil */
.ht-udg-layout__cover {
  position: sticky;
  top: 5rem;
}

@media (max-width: 700px) {
  .ht-udg-layout__cover {
    position: static;
  }
}

.ht-udg-cover-wrap {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: var(--ht-shadow-md);
  aspect-ratio: 3 / 4;
}

.ht-udg-cover-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* Højre kolonne */
.ht-udg-layout__body {
  min-width: 0;
}

.ht-udg-year {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ht-green-bright);
  margin: 0 0 0.6rem;
}

.ht-udg-title {
  font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -0.03em;
  color: var(--ht-green-dark);
  margin: 0 0 1.1rem;
}

.ht-udg-excerpt {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.7;
  color: var(--ht-text-muted);
  margin: 0 0 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* Brødtekst (Gutenberg-indhold) */
.ht-udg-content {
  font-size: 0.97rem;
  line-height: 1.8;
  color: var(--ht-text);
}

.ht-udg-content h2 {
  font-size: clamp(1.1rem, 2vw, 1.3rem);
  font-weight: 700;
  color: var(--ht-green-dark);
  margin: 2rem 0 0.7rem;
}

.ht-udg-content p {
  margin: 0 0 1.2rem;
}

.ht-udg-content ul,
.ht-udg-content ol {
  padding-left: 1.4rem;
  margin: 0 0 1.2rem;
}

.ht-udg-content .wp-block-quote {
  border-left: 4px solid var(--ht-green-bright);
  padding: 1rem 1.4rem;
  margin: 1.5rem 0;
  background: var(--ht-green-pale);
  border-radius: 0 8px 8px 0;
}

/* ================================================================
   UDGIVELSE – downloads-sektion
   ================================================================ */

.ht-udg-downloads {
  background: var(--ht-green-dark, #095A42);
  padding: clamp(2.5rem, 5vw, 4rem) 1.5rem;
}

.ht-udg-downloads__inner {
  max-width: 1060px;
  margin: 0 auto;
}

.ht-udg-downloads__heading {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ht-green-bright, #3EBE81);
  margin: 0 0 1.2rem;
}

.ht-udg-downloads__list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.ht-udg-dl-item {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1rem 1.4rem;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  transition: transform 0.15s, background 0.2s;
}

.ht-udg-dl-item:hover {
  transform: translateX(4px);
}

.ht-udg-dl-item--primary {
  background: var(--ht-green-bright, #3EBE81);
  color: #fff;
}

.ht-udg-dl-item--primary:hover {
  background: #4fd494;
  color: #fff;
}

.ht-udg-dl-item--secondary {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.ht-udg-dl-item--secondary:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.ht-udg-dl-item__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.ht-udg-dl-item__label {
  flex: 1;
}

@media (max-width: 600px) {
  .ht-udg-dl-item {
    padding: 0.85rem 1.1rem;
  }
}