/* DyrDyr designsystem. Kilde: snippets/60-afd-design-tokens.php (STIL.md er opskriftsbogen). */
:root {
  --afd-container-max: 1200px;
  --afd-product-card-image-height: 148px; --afd-product-card-image-height-lg: 168px;
  --afd-price-card-min: 212px; --afd-price-card-min-lg: 240px; --afd-card-price-size: 1rem;
  --afd-home-hero-art-width-mobile: 68%; --afd-home-hero-art-height-mobile: 32%; --afd-home-hero-art-opacity: .24;
  --afd-home-hero-art-edge-fade: 12%;
  --afd-hero-art-width-mobile: 42%; --afd-hero-art-height-mobile: 36%; --afd-hero-art-opacity: .24; --afd-hero-art-opacity-mobile: .08;
  --afd-hero-art-min-height: clamp(180px,18vw,240px); --afd-hero-art-title-size: clamp(1.75rem,2.4vw,2.375rem);
  --afd-hero-compact-intro-size: 1.125rem; --afd-hero-compact-search-height: 56px;
  --afd-hero-mobile-title-size: 1.5rem; --afd-hero-mobile-art-height: 88px;
  --afd-content-max: 760px;
  --afd-page-gutter: 16px;
  --afd-page-gutter-lg: 24px;
  --afd-section-gap: 48px;
  --afd-section-gap-lg: 61px; /* NEMMAND-bevist rytme (LANDINGS-GUIDE) */
  --afd-space-1: 4px;  --afd-space-2: 8px;  --afd-space-3: 12px;
  --afd-space-4: 16px; --afd-space-5: 20px; --afd-space-6: 24px;
  --afd-space-8: 32px; --afd-space-10: 40px; --afd-space-12: 48px;
  --afd-radius-sm: 4px; --afd-radius-md: 10px; --afd-radius-card: 16px; --afd-radius-module: 20px;
  --afd-shadow-sm: 0 4px 16px rgba(14,39,71,.06);
  --afd-shadow-md: 0 12px 30px rgba(14,39,71,.11);
  --afd-font-heading: 'Poppins', system-ui, sans-serif;
  --afd-font-body: 'Manrope', system-ui, sans-serif;
  --afd-fs-h1: clamp(1.75rem, 3vw + 1rem, 2.5rem);
  --afd-fs-h2: clamp(1.35rem, 2vw + 0.9rem, 1.75rem);
  --afd-fs-h3: 1.2rem;
  --afd-fs-body: 1rem;
  --afd-fs-small: 0.875rem;
  --afd-navy: #14335C;
  --afd-navy-deep: #0E2747;
  --afd-navy-grad: linear-gradient(160deg, #0E2747, #14335C); /* FindEROTIK-porten: moerk boks-gradient */
  --afd-accent-grad: linear-gradient(135deg, #F0900E, #D67D08); /* accent-familie, kun badges/cirkler */
  --afd-text: #1F2A37;
  --afd-text-muted: #55606B;
  --afd-bg: #FFFFFF;
  --afd-bg-alt: #F6F7F9;
  --afd-border: #DEE5ED;
  --afd-accent: #F0900E;
  --afd-accent-hover: #D67D08;
  --afd-accent-soft: #FDF0DC;
  /* Links i broedtekst: braendt orange fra accent-familien. Valgt paa
     kontrast, ikke smag: 5.0:1 mod hvid og 4.7:1 mod bg-alt (WCAG AA),
     mens ren accent kun naar 2.4:1 og derfor ALDRIG maa baere tekst. */
  --afd-link: #B45309;
  --afd-link-hover: #8C4108;
  --afd-success: #1D7A46;
  --afd-success-soft: #DCF3E4;
  --afd-danger: #DC2626;
  --afd-warning: #B45309;
  --afd-tile-hund: #FBEFD9; --afd-tile-kat: #FBE3E3; --afd-tile-kanin: #E9F4E4;
  --afd-tile-fugl: #FDF6DC; --afd-tile-akvarie: #E1F0F7; --afd-tile-hest: #F4E9DC;
  --afd-z-dropdown: 30; --afd-z-sticky: 40; --afd-z-overlay: 50; --afd-z-modal: 60;
  --afd-variant-menu-height: 280px; --afd-variant-thumb: 40px;
  --afd-refined-hero-bg: #FFFAF2; --afd-refined-hero-border: #E9E4DB;
  --afd-refined-search-border: #98ACC3;
  --afd-refined-hero-ring-inner: 88px; --afd-refined-hero-ring-outer: 128px;
  --afd-refined-hero-ring-inner-lg: 120px; --afd-refined-hero-ring-outer-lg: 176px;
  --afd-refined-hero-title-size: clamp(2rem,9.75vw,2.375rem);
  --afd-refined-hero-title-size-lg: clamp(3rem,4.7vw,3.5rem);
  --afd-refined-hero-intro-size: clamp(1.125rem,2vw,1.375rem);
  --afd-refined-search-height: 64px; --afd-refined-search-height-lg: 76px;
  --afd-refined-search-icon: 24px; --afd-refined-search-icon-lg: 28px;
  --afd-refined-link-min: 80px;
  --afd-refined-search-button-min: 88px; --afd-refined-search-button-min-lg: 144px;
  --afd-refined-hero-title-size-mobile: 1.75rem;
  --afd-refined-hero-title-size-md: clamp(2rem,9.75vw,2.375rem);
  --afd-refined-hero-intro-size-mobile: .875rem;
  --afd-refined-hero-meta-size-mobile: .75rem;
  --afd-refined-hero-ring-inner-mobile: 64px; --afd-refined-hero-ring-outer-mobile: 94px;
  --afd-refined-hero-ring-inner-md: 88px; --afd-refined-hero-ring-outer-md: 128px;
  --afd-refined-search-height-mobile: 52px; --afd-refined-search-inset-mobile: 3px;
  --afd-refined-search-button-min-mobile: 72px;
  --afd-refined-intro-preview-lines: 2;
  --afd-deal-rail-card-width: 212px;
  --afd-deal-rail-title-size: clamp(1.65rem,7.6vw,2rem);
  --afd-deal-rail-title-size-mobile: clamp(1.25rem,6vw,1.5rem);
  --afd-deal-rail-title-size-lg: clamp(2rem,3.2vw,2.5rem);
  --afd-deal-rail-image-height: 180px; --afd-deal-rail-image-height-lg: 200px;
}

/* ---------- Base (scoped til vores sider) ---------- */
body.afd-page { background: var(--afd-bg-alt); color: var(--afd-text); font-family: var(--afd-font-body); font-size: var(--afd-fs-body); line-height: 1.65; overflow-x: hidden; width: 100%; }
/* Fuld bredde-takeover (FindEROTIK/NEMMAND-moensteret): main ejer hele fladen. */
.afd-page #afd-main { display: block; width: 100%; max-width: 100%; margin: 0 0 60px; padding: 0; float: none; clear: both; }
/* A11y skip-link (NEMMAND, WCAG 2.4.1). */
.afd-skip-link { position: absolute; left: -9999px; top: 0; z-index: 99999; padding: 12px 20px; background: var(--afd-accent); color: #fff; font: 600 14px/1 var(--afd-font-heading); text-decoration: none; border-radius: 0 0 6px 0; }
.afd-skip-link:focus { left: 0; outline: 3px solid var(--afd-navy); outline-offset: 2px; color: #fff; }
/* Performance: below-fold sektioner renderes dovent (FindEROTIK-moensteret). */
.afd-below-fold { content-visibility: auto; contain-intrinsic-size: auto 500px; }
.afd-page h1, .afd-page h2, .afd-page h3 { font-family: var(--afd-font-heading); color: var(--afd-navy); line-height: 1.25; margin: 0 0 var(--afd-space-3); }
.afd-page h1 { font-size: var(--afd-fs-h1); font-weight: 700; }
.afd-page h2 { font-size: var(--afd-fs-h2); font-weight: 700; }
.afd-page h3 { font-size: var(--afd-fs-h3); font-weight: 600; }
.afd-page a { color: var(--afd-navy); text-decoration: none; }
.afd-page a:hover, .afd-page a:focus-visible { text-decoration: none; }
.afd-page img { max-width: 100%; height: auto; }
/* Skjul-attributten SKAL vinde over komponenternes egne display-regler
   (fx .afd-offers__row{display:grid}), ellers viser variantvaelgeren alle
   varianters tilbud paa en gang i stedet for kun den valgte. Specificiteten
   (.afd-page [hidden] = 0,2,0) slaar komponent-klasserne (0,1,0) uden vigtigheds-flag. */
.afd-page [hidden] { display: none; }
.afd-page :where(a,button,input,select,summary):focus-visible { outline: 3px solid rgba(240,144,14,.45); outline-offset: 3px; }
.afd-muted { color: var(--afd-text-muted); font-size: var(--afd-fs-small); }

/* ---------- Layout ---------- */
.afd-container { max-width: var(--afd-container-max); margin-inline: auto; padding-inline: var(--afd-page-gutter); width: 100%; box-sizing: border-box; }
.afd-band { padding-block: var(--afd-section-gap); }
.afd-band--tight { padding-block: var(--afd-space-6); }
.afd-band--white { background: var(--afd-bg); }
.afd-band--cream { background: var(--afd-accent-soft); }
.afd-band--navy { background: var(--afd-navy-deep); color: #fff; }
.afd-band--navy h2 { color: #fff; }
.afd-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--afd-space-4); margin-bottom: var(--afd-space-5); }
.afd-section-head a { font-weight: 600; white-space: nowrap; transition: color .15s ease, transform .15s ease; }
.afd-section-head a:hover { color: var(--afd-accent-hover); transform: translateX(3px); text-decoration: none; }
.afd-overline { display: inline-block; font-family: var(--afd-font-heading); font-weight: 600; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--afd-accent); margin-bottom: var(--afd-space-2); }
.afd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--afd-grid-min, 220px), 1fr)); gap: var(--afd-space-4); }
.afd-grid--tiles { --afd-grid-min: 250px; }
.afd-split { display: grid; gap: var(--afd-space-6); }

/* ---------- Breadcrumbs ---------- */
.afd-breadcrumbs { font-size: var(--afd-fs-small); color: var(--afd-text-muted); padding-block: var(--afd-space-3); }
.afd-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--afd-space-1); }
.afd-breadcrumbs li + li::before { content: "/"; margin-inline: var(--afd-space-1); color: var(--afd-border); }
/* Mobil: breadcrumb paa EN linje, og den aktuelle side (sidste led) skjules,
   da brugeren allerede er der (som Pricerunner). Desktop viser fuld sti. */
.afd-breadcrumbs { padding-block: var(--afd-space-2); }
.afd-breadcrumbs ol { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.afd-breadcrumbs ol::-webkit-scrollbar { display: none; }
.afd-breadcrumbs li { white-space: nowrap; }
.afd-breadcrumbs li[aria-current="page"] { display: none; }
/* Tomme reklame-wrappers (disclosure flyttet til footeren, D26) fylder ikke. */
.afd-home-disclosure:empty, .afd-cross-topnote:empty { display: none; }
@media (min-width: 900px) {
  .afd-breadcrumbs { padding-block: var(--afd-space-3); }
  .afd-breadcrumbs ol { flex-wrap: wrap; overflow-x: visible; }
  .afd-breadcrumbs li[aria-current="page"] { display: block; }
}

/* ---------- Sidehoved og disclosure ---------- */
.afd-page-head { margin-bottom: var(--afd-space-5); }
.afd-page-head__meta { color: var(--afd-text-muted); font-size: var(--afd-fs-small); display: flex; flex-wrap: wrap; gap: var(--afd-space-2) var(--afd-space-4); }
.afd-disclosure { color: var(--afd-text-muted); font-size: var(--afd-fs-small); font-style: italic; margin: var(--afd-space-2) 0 var(--afd-space-4); }
.afd-listing-hero { position: relative; overflow: hidden; margin: var(--afd-space-2) 0 var(--afd-space-8); padding: 28px 24px; border: 1px solid var(--afd-border); border-radius: 18px; background: radial-gradient(circle at 92% 0, var(--afd-accent-soft), transparent 32%), var(--afd-bg); box-shadow: var(--afd-shadow-sm); }
.afd-listing-hero--animal { background: radial-gradient(circle at 88% 20%, var(--afd-accent-soft), transparent 38%), var(--afd-bg); }
.afd-listing-hero::after { content: ""; position: absolute; top: 0; left: 0; width: 5px; height: 100%; background: var(--afd-accent); }
.afd-listing-hero .afd-page-head { max-width: 780px; margin-bottom: var(--afd-space-3); }
.afd-listing-hero .afd-page-head h1 { font-size: clamp(1.9rem, 4vw, 3rem); }
.afd-listing-hero .afd-disclosure { margin-bottom: 0; }
.afd-listing-hero__intro { max-width: 760px; color: var(--afd-text-muted); }
.afd-listing-hero__intro p:last-child { margin-bottom: 0; }
.afd-listing-products { margin-bottom: var(--afd-section-gap); }
.afd-listing-products .afd-toolbar { padding-bottom: var(--afd-space-4); border-bottom: 1px solid var(--afd-border); }

/* ---------- Knapper ---------- */
.afd-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; gap: var(--afd-space-3); box-sizing: border-box; font-family: var(--afd-font-heading); font-weight: 600; font-size: 0.8125rem; line-height: 1; text-transform: uppercase; letter-spacing: 0.08em; padding: 13px 28px; border-radius: var(--afd-radius-md); border: 1px solid transparent; cursor: pointer; text-align: center; transition: background .15s ease, box-shadow .15s ease, transform .15s ease; }
.afd-page a.afd-btn:hover { text-decoration: none; }
.afd-btn--primary { background: var(--afd-accent); color: #fff; box-shadow: 0 4px 16px rgba(240, 144, 14, 0.35); }
.afd-btn--primary:hover { background: var(--afd-accent-hover); color: #fff; transform: translateY(-1px); box-shadow: 0 6px 20px rgba(240, 144, 14, 0.4); }
.afd-btn--navy { background: var(--afd-navy); color: #fff; }
.afd-btn--navy:hover { background: var(--afd-navy-deep); color: #fff; }
.afd-btn--ghost { background: transparent; color: var(--afd-navy); border-color: var(--afd-border); }
.afd-btn--ghost:hover { border-color: var(--afd-navy); }
.afd-btn[disabled], .afd-btn--disabled { background: var(--afd-border); color: var(--afd-text-muted); cursor: not-allowed; pointer-events: none; }

/* ---------- Badges ---------- */
.afd-badge { display: inline-block; font-size: 0.75rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: var(--afd-bg-alt); color: var(--afd-text-muted); }
.afd-badge--success { background: var(--afd-success-soft); color: var(--afd-success); }
.afd-badge--danger { background: #FDE8E8; color: var(--afd-danger); }
.afd-badge--drop { background: var(--afd-accent); color: #fff; }
.afd-badge--info { background: var(--afd-accent-soft); color: var(--afd-warning); }

/* ---------- Kort (ÉN komponent, STIL.md afsnit 5) ---------- */
.afd-card { background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); box-shadow: var(--afd-shadow-sm); padding: var(--afd-space-5); box-sizing: border-box; }
.afd-card { transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }
a.afd-card { display: block; color: inherit; }
.afd-card--product:hover { border-color: var(--afd-navy); transform: translateY(-2px); box-shadow: var(--afd-shadow-md); }
/* Produktkort er ALTID en lodret flex-soejle, saa kroppen kan vokse og CTA'en
   pinnes til bunden (margin-top:auto). Uden dette staar CTA'erne i forskellig
   hoejde naar kort i samme raekke har forskelligt indhold (ejer-krav 2026-07-20). */
.afd-card--product { position: relative; display: flex; flex-direction: column; padding: 0; overflow: hidden; min-width: 0; }
.afd-card__image-link { display: block; color: inherit; }
.afd-card__image-link:hover { text-decoration: none; }
.afd-card--product .afd-card__img { aspect-ratio: 1 / 1; position: relative; display: flex; align-items: center; justify-content: center; background: #fff; overflow: hidden; margin: 0; padding: 18px; box-sizing: border-box; border-bottom: 1px solid var(--afd-border); }
.afd-card--product .afd-card__img img { width: 100%; height: 100%; object-fit: contain; transition: transform .25s ease; }
.afd-card--product:hover .afd-card__img img { transform: scale(1.025); }
.afd-card__body { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 180px; padding: var(--afd-space-4); }
.afd-card__placeholder { color: var(--afd-border); }
.afd-card__badges { position: absolute; z-index: 1; top: 12px; left: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.afd-card__title { font-family: var(--afd-font-heading); font-weight: 600; color: var(--afd-navy); font-size: 0.95rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }
.afd-card__title:hover { color: var(--afd-accent-hover); text-decoration: none; }
.afd-card__brand { color: var(--afd-text-muted); font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 5px; }
.afd-card__price { font-weight: 800; color: var(--afd-navy); margin-top: var(--afd-space-2); }
.afd-card__price-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.afd-card__old { color: var(--afd-text-muted); font-size: .72rem; text-decoration: line-through; }
/* "Spar X kr" er en lille groen pille INLINE i pris-linjen (ved siden af den
   gennemstregede foerpris), aldrig en badge paa billedet: den daekker aldrig
   produktet og kolliderer aldrig med den primaere badge paa mobil. */
.afd-card__save { display: inline-block; padding: 1px 7px; border-radius: 999px; background: var(--afd-success-soft); color: var(--afd-success); font-weight: 700; font-size: .68rem; line-height: 1.5; white-space: nowrap; }
.afd-card__price .afd-from { font-weight: 400; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-card__meta { color: var(--afd-text-muted); font-size: var(--afd-fs-small); margin-top: 2px; }
.afd-card__footer { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--afd-space-3); margin-top: auto; padding-top: var(--afd-space-4); }
.afd-card__cta { width: 100%; min-height: 44px; justify-content: center; gap: 8px; margin-top: var(--afd-space-3); padding: 10px 12px; font: 700 0.78rem/1 var(--afd-font-heading); }
.afd-card__merchant { width: 24px; height: 24px; display: grid; place-items: center; overflow: hidden; border-radius: 6px; background: #fff; }
.afd-card__merchant img { width: 100%; height: 100%; object-fit: contain; }

/* ---------- Pristabel: butiksraekker (FindEROTIK store-rows 1:1) ----------
   Mobil: logo | pris | knap (butiksinfo skjult, logoet baerer identiteten).
   >=600: logo | info | pris | knap. Bedste raekke = moerk navy-gradient. */
.afd-offers { display: block; }
.afd-offers__row { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: var(--afd-space-3); align-items: center; padding: var(--afd-space-4); background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: 10px; margin-bottom: var(--afd-space-2); transition: border-color .2s ease, background .2s ease; }
.afd-offers__row:hover { border-color: var(--afd-accent); }
.afd-offers__row--best { background: var(--afd-navy-grad); border-color: transparent; }
.afd-offers__row--best:hover { border-color: transparent; }
.afd-offers__row--out { opacity: .5; }
.afd-offers__logo { width: 32px; height: 32px; border-radius: 6px; background: var(--afd-bg-alt); display: flex; align-items: center; justify-content: center; overflow: hidden; font: 700 11px/1 var(--afd-font-heading); color: var(--afd-text-muted); flex: 0 0 auto; }
.afd-offers__logo img { width: 100%; height: 100%; object-fit: contain; }
.afd-offers__row--best .afd-offers__logo { background: #fff; }
.afd-offers__info { display: none; flex-direction: column; min-width: 0; }
.afd-offers__name { font-family: var(--afd-font-heading); font-weight: 700; font-size: 14px; color: var(--afd-navy); display: flex; align-items: center; gap: var(--afd-space-2); flex-wrap: wrap; }
.afd-offers__sub { font-size: 11px; color: var(--afd-text-muted); margin-top: 2px; display: flex; flex-wrap: wrap; gap: var(--afd-space-1) var(--afd-space-3); }
.afd-offers__stock--in { color: var(--afd-success); font-weight: 600; }
.afd-offers__stock--out { color: var(--afd-danger); font-weight: 600; }
.afd-offers__row--best .afd-offers__name { color: #fff; }
.afd-offers__row--best .afd-offers__sub { color: rgba(255,255,255,.65); }
.afd-offers__row--best .afd-offers__stock--in { color: #7DE3A0; }
.afd-offers__prices { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; min-width: 0; }
.afd-offers__price { font-family: var(--afd-font-heading); font-weight: 800; font-size: 16px; color: var(--afd-navy); white-space: nowrap; }
.afd-offers__old { color: var(--afd-text-muted); text-decoration: line-through; font-size: 10px; }
.afd-offers__unit { color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
/* Variantlabel paa raekken (2026-08-31): to ens butiksraekker maa aldrig
   staa uforklaret; diskret pille i metalinjen paa variantfamilier. */
.afd-offers__variant { flex: 0 0 auto; padding: 1px 7px; border: 1px solid var(--afd-border); border-radius: 999px; color: var(--afd-navy); font-weight: 600; white-space: nowrap; }
.afd-offers__row--best .afd-offers__variant { border-color: rgba(255,255,255,.35); color: rgba(255,255,255,.85); }
.afd-offers__variant--raw { max-width: 100%; border-style: dashed; color: var(--afd-text-muted); font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.afd-offers__row--best .afd-offers__variant--raw { color: rgba(255,255,255,.75); }
.afd-offers__row--best .afd-offers__price { color: #fff; }
.afd-offers__row--best .afd-offers__old { color: rgba(255,255,255,.5); }
.afd-offers__row--best .afd-offers__unit { color: rgba(255,255,255,.65); }
.afd-offers__cta { display: flex; justify-content: flex-end; }
.afd-offers__cta .afd-btn { min-height: 44px; padding: 11px 16px; }
.afd-offers__foot { padding: var(--afd-space-3) 0 0; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }

/* ---------- Hero (forside): FindEROTIKs fokuserede mørke søgeflade ---------- */
.afd-hero { display: block; margin-top: var(--afd-space-4); padding: 52px 20px; border-radius: 20px; background: radial-gradient(circle at 86% 20%, rgba(240,144,14,.18), transparent 28%), var(--afd-navy-grad); box-shadow: 0 18px 50px rgba(14,39,71,.16); }
.afd-hero--home { min-height: 500px; box-sizing: border-box; }
.afd-hero__inner { width: min(720px, 100%); margin-inline: auto; text-align: center; }
.afd-hero__eyebrow { margin-bottom: var(--afd-space-4); color: var(--afd-accent); font: 700 .72rem/1 var(--afd-font-heading); letter-spacing: .16em; text-transform: uppercase; }
.afd-page h1.afd-hero__title { color: #fff; font-size: clamp(2.1rem, 5vw, 3.35rem); font-weight: 800; line-height: 1.08; margin-bottom: var(--afd-space-5); }
.afd-hero__title .afd-hero__accent { color: var(--afd-accent); display: block; }
.afd-hero__sub { color: rgba(255,255,255,.72); max-width: 620px; margin: 0 auto var(--afd-space-6); font-size: 1.02rem; line-height: 1.7; }
.afd-hero__cta { margin-top: var(--afd-space-5); }
.afd-hero .afd-search { margin-inline: auto; width: min(600px, 100%); border: 0; padding: 6px; box-shadow: 0 12px 32px rgba(0,0,0,.2); }
.afd-hero .afd-search input[type="search"] { padding: 12px 16px; }
.afd-hero .afd-search button { width: 48px; height: 48px; }
.afd-hero .afd-search button svg { width: 21px; height: 21px; margin: auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.afd-hero .afd-hero__stats { justify-content: center; margin-top: var(--afd-space-8); }
.afd-hero .afd-hero__stat-label { color: rgba(255,255,255,.52); }
.afd-hero-animals { margin-top: var(--afd-space-6); }
.afd-hero-animals__label { margin-bottom: var(--afd-space-3); color: rgba(255,255,255,.54); font: 600 .68rem/1 var(--afd-font-heading); letter-spacing: .12em; text-transform: uppercase; }
.afd-hero-animals__links { display: flex; gap: var(--afd-space-2); overflow-x: auto; justify-content: flex-start; padding: 2px 2px 8px; scrollbar-width: none; }
.afd-hero-animals__links::-webkit-scrollbar { display: none; }
.afd-hero-animals__links a { flex: 0 0 auto; min-width: 74px; display: grid; justify-items: center; gap: 7px; color: rgba(255,255,255,.8); font: 600 .7rem/1 var(--afd-font-heading); }
.afd-hero-animals__links a:hover { color: #fff; text-decoration: none; }
.afd-hero-animals__links a > span { width: 48px; height: 48px; display: grid; place-items: center; overflow: hidden; padding: 4px; box-sizing: border-box; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background: rgba(255,255,255,.1); transition: transform .18s ease, background .18s ease; }
.afd-hero-animals__links a:hover > span { transform: translateY(-2px); background: rgba(255,255,255,.18); }
.afd-hero-animals__links img { width: 100%; height: 100%; object-fit: contain; }
.afd-hero-animals__links svg { width: 25px; height: 25px; color: var(--afd-accent); }

/* ---------- Forside 2026: lyst prisportal-layout fra godkendt reference ---------- */
body.afd-frontpage.afd-page { background: #fff; }
.afd-home-hero { position: relative; display: grid; grid-template-areas: "eyebrow" "title" "lead" "visual" "search" "benefits"; min-height: 0; margin-top: var(--afd-space-3); overflow: hidden; padding: 28px 20px 22px; border: 1px solid #F2E3D5; border-radius: 24px; background: radial-gradient(circle at 76% 30%, rgba(205,225,240,.8), transparent 28%), linear-gradient(120deg, #FFF8F1 0%, #FFFDF9 58%, #F8FBFD 100%); box-shadow: 0 12px 34px rgba(14,39,71,.07); }
.afd-home-hero::before, .afd-home-hero::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.afd-home-hero::before { width: 180px; height: 180px; left: -90px; bottom: -105px; border: 28px solid rgba(240,144,14,.05); }
.afd-home-hero::after { width: 120px; height: 120px; right: 6%; top: -70px; background: rgba(255,255,255,.48); }
.afd-home-hero__content { display: contents; }
.afd-home-hero__eyebrow { position: relative; z-index: 3; grid-area: eyebrow; margin-bottom: var(--afd-space-3); color: var(--afd-accent-hover); font: 750 .68rem/1 var(--afd-font-heading); letter-spacing: .11em; text-transform: uppercase; }
body.afd-page .afd-home-hero h1 { position: relative; z-index: 3; grid-area: title; max-width: 700px; margin: 0 0 var(--afd-space-3); color: var(--afd-navy-deep); font-size: clamp(2.15rem, 8.8vw, 3.4rem); line-height: 1.04; letter-spacing: -.045em; }
.afd-home-hero h1 span { color: var(--afd-accent); }
.afd-home-hero__content > p { position: relative; z-index: 3; grid-area: lead; max-width: 640px; margin: 0; color: var(--afd-navy); font-size: .94rem; line-height: 1.55; }
.afd-home-search { position: relative; z-index: 5; grid-area: search; align-items: center; width: 100%; max-width: 650px; margin-top: 0; border: 0; padding: 5px; border-radius: 15px; box-shadow: 0 8px 28px rgba(14,39,71,.14); }
.afd-home-search__icon { width: 34px; display: grid; place-items: center; color: var(--afd-navy); }
.afd-home-search__icon svg { width: 20px; height: 20px; }
.afd-home-search__icon img { width: 100%; height: 100%; object-fit: contain; display: block; }
.afd-home-search input[type="search"] { padding-block: 12px; padding-inline: 4px; font-size: .95rem; line-height: 1.2; }
.afd-home-search button { width: auto; min-width: 76px; height: 44px; border-radius: 11px; padding: 0 16px; color: #fff; font: 700 .78rem/1 var(--afd-font-heading); }
.afd-home-benefits { position: relative; z-index: 3; grid-area: benefits; display: grid; grid-template-columns: 1fr; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.afd-home-benefits li { display: grid; grid-template-columns: 28px minmax(0,1fr); align-items: center; column-gap: 7px; min-width: 0; color: var(--afd-navy); }
.afd-home-benefits li > span { grid-row: 1 / 3; width: 28px; height: 28px; display: grid; place-items: center; }
.afd-home-benefits svg { width: 24px; height: 24px; }
.afd-home-benefits b, .afd-home-benefits small { display: block; min-width: 0; }
.afd-home-benefits b { font: 700 .66rem/1.2 var(--afd-font-heading); }
.afd-home-benefits small { margin-top: 2px; color: var(--afd-text-muted); font-size: .58rem; line-height: 1.2; }
.afd-home-hero__visual { position: relative; z-index: 2; grid-area: visual; width: 100%; height: 220px; margin: 14px 0 16px; }
.afd-home-hero__orb { position: absolute; width: 88%; height: 92%; right: 0; bottom: 0; border-radius: 48% 52% 38% 62%; background: linear-gradient(145deg, rgba(205,225,240,.9), rgba(230,239,246,.7)); }
.afd-home-hero__pet { position: absolute; overflow: hidden; margin: 0; padding: 5px; border: 1px solid rgba(20,51,92,.08); border-radius: 22px; background: #fff; box-shadow: 0 16px 35px rgba(14,39,71,.14); transform: rotate(-2deg); }
.afd-home-hero__pet img, .afd-home-hero__pet svg { width: 100%; height: 100%; display: block; object-fit: contain; border-radius: 16px; }
.afd-home-hero__pet--1 { width: 150px; height: 150px; left: 0; bottom: 3px; z-index: 3; }
.afd-home-hero__pet--2 { width: 126px; height: 126px; left: 34%; bottom: 18px; z-index: 4; transform: rotate(2deg); }
.afd-home-hero__pet--3 { width: 96px; height: 96px; right: 2%; bottom: 4px; z-index: 5; transform: rotate(-1deg); }
.afd-home-hero__claim { position: absolute; z-index: 6; right: 3%; top: 0; padding: 10px 14px; border: 1px solid rgba(20,51,92,.08); border-radius: 18px 18px 18px 5px; background: rgba(255,255,255,.94); color: var(--afd-navy); font-size: .66rem; line-height: 1.25; transform: rotate(2deg); box-shadow: var(--afd-shadow-sm); }
.afd-home-hero__claim strong { display: block; color: var(--afd-navy-deep); }
.afd-home-disclosure .afd-disclosure { margin: 6px 4px 0; font-size: .62rem; opacity: .72; }

.afd-home-animal-nav { display: grid; grid-auto-flow: column; grid-auto-columns: 78px; gap: 8px; margin-top: var(--afd-space-4); padding: 2px 0 6px; overflow-x: auto; scrollbar-width: none; }
.afd-home-animal-nav::-webkit-scrollbar { display: none; }
.afd-home-animal-nav a { display: grid; grid-template-rows: 62px auto auto; justify-items: center; min-width: 0; padding: 6px 5px 9px; overflow: hidden; border: 1px solid var(--afd-border); border-radius: 16px; background: #fff; color: var(--afd-navy); box-shadow: 0 3px 12px rgba(14,39,71,.04); }
.afd-home-animal-nav a:hover { color: var(--afd-navy); text-decoration: none; border-color: rgba(240,144,14,.5); transform: translateY(-2px); }
.afd-home-animal-nav__media { width: 58px; height: 58px; display: grid; place-items: center; overflow: hidden; padding: 3px; border-radius: 12px; background: #fff; }
.afd-home-animal-nav__media img, .afd-home-animal-nav__media svg { width: 100%; height: 100%; object-fit: contain; }
.afd-home-animal-nav a strong { margin-top: 5px; font: 700 .7rem/1.15 var(--afd-font-heading); text-align: center; }
.afd-home-animal-nav a small { display: none; color: var(--afd-text-muted); font-size: .56rem; }
.afd-home-animal-nav__offer { background: linear-gradient(145deg,#FFF8F1,#fff); }
.afd-home-animal-nav__offer .afd-home-animal-nav__media { color: var(--afd-accent); padding: 11px; }

.afd-home-product-rail { display: flex; gap: 10px; margin-top: 10px; padding-bottom: 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.afd-home-product-rail::-webkit-scrollbar, .afd-home-product-rail__track::-webkit-scrollbar { display: none; }
.afd-home-deal-promo { position: relative; flex: 0 0 82%; min-height: 260px; display: flex; align-items: center; overflow: hidden; padding: 26px 22px; border-radius: 18px; background: radial-gradient(circle at 85% 80%, rgba(240,144,14,.3), transparent 30%), var(--afd-navy-grad); color: #fff; scroll-snap-align: start; }
.afd-home-deal-promo:hover { color: #fff; text-decoration: none; }
.afd-home-deal-promo::after { content: ""; position: absolute; width: 170px; height: 170px; right: -45px; bottom: -60px; border-radius: 50%; border: 28px solid rgba(255,255,255,.06); }
.afd-home-deal-promo > div { position: relative; z-index: 2; max-width: 240px; }
.afd-home-deal-promo .afd-overline { color: var(--afd-accent); }
.afd-home-deal-promo h2 { color: #fff; font-size: 1.45rem; }
.afd-home-deal-promo p { color: rgba(255,255,255,.68); font-size: .78rem; }
.afd-home-deal-promo__icon { position: absolute; right: 22px; top: 20px; width: 62px; height: 62px; display: grid; place-items: center; padding: 14px; border-radius: 20px; background: var(--afd-accent); color: #fff; transform: rotate(7deg); }
.afd-home-deal-promo__icon svg { width: 100%; height: 100%; }
.afd-home-product-rail__track { display: flex; gap: 10px; overflow: visible; }
.afd-home-product-rail__track .afd-card--product { flex: 0 0 158px; scroll-snap-align: start; }
.afd-home-product-rail .afd-card--product .afd-card__img { aspect-ratio: auto; height: 178px; padding: 18px; }
.afd-home-product-rail .afd-card--product .afd-card__img img { width: 84%; height: 84%; max-width: 84%; max-height: 84%; }
.afd-home-product-rail .afd-card__body { min-height: 190px; padding: 14px; }
.afd-home-product-rail .afd-card__title { font-size: .75rem; min-height: 3.4em; -webkit-line-clamp: 3; }
.afd-home-product-rail .afd-card__brand, .afd-home-product-rail .afd-card__meta { font-size: .6rem; }
.afd-home-product-rail .afd-card__price { font-size: .78rem; }
/* Pris sidder TAET under titlen; kun CTA'en skubbes til bunden (mindre gap). */
.afd-home-product-rail .afd-card__footer { display: block; margin-top: 10px; padding-top: 0; }
/* Samme rene CTA som populaer/bedoemte-baandene: centreret label paa EN linje,
   uden butikslogo og pil, saa "Se priser"/"Til butik" aldrig klippes i de
   smalle kort (ejer-krav 2026-07-20). */
.afd-home-product-rail .afd-card__cta { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 52px; margin-top: auto; padding: 10px 12px; font-size: .82rem; }
.afd-home-product-rail .afd-card__cta .afd-card__merchant,
.afd-home-product-rail .afd-card__cta > span:last-child { display: none; }

.afd-home-how, .afd-home-popular, .afd-home-trust, .afd-home-cta { margin-top: 14px; border: 1px solid var(--afd-border); border-radius: 18px; background: #fff; }
.afd-home-how { position: relative; overflow: hidden; padding: 16px 14px 18px; }
.afd-home-how::after { content: ""; position: absolute; width: 110px; height: 110px; right: -55px; top: -55px; border-radius: 50%; background: rgba(240,144,14,.06); }
.afd-home-how .afd-section-head { margin-bottom: 12px; }
.afd-home-how .afd-section-head h2, .afd-home-popular .afd-section-head h2 { font-size: 1.05rem; }
.afd-home-how__steps { display: grid; grid-template-columns: 1fr; gap: 9px; }
.afd-home-how__steps > div { position: relative; display: grid; grid-template-columns: 46px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; column-gap: 12px; min-width: 0; padding: 11px; border-radius: 13px; background: var(--afd-bg-alt); text-align: left; }
.afd-home-how__steps > div + div::before { display: none; }
.afd-home-how__steps span { grid-row: 1 / 3; width: 46px; height: 46px; display: grid; place-items: center; margin: 0; padding: 10px; border-radius: 50%; background: var(--afd-accent-soft); color: var(--afd-navy); }
.afd-home-how__steps svg { width: 100%; height: 100%; }
.afd-home-how__steps b { display: block; color: var(--afd-navy); font: 700 .72rem/1.3 var(--afd-font-heading); }
.afd-home-how__steps p { margin: 3px 0 0; color: var(--afd-text-muted); font-size: .66rem; line-height: 1.4; }

.afd-home-popular { padding: 14px; overflow: hidden; }
.afd-home-popular__track { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.afd-home-popular__track::-webkit-scrollbar { display: none; }
.afd-home-popular__track .afd-card--product { flex: 0 0 180px; scroll-snap-align: start; box-shadow: none; }
.afd-home-popular .afd-card__img { aspect-ratio: 1.4 / 1; padding: 10px; }
.afd-home-popular .afd-card__body { min-height: 135px; padding: 12px; }
.afd-home-popular .afd-card__title { font-size: .74rem; }
.afd-home-popular .afd-card__footer { padding-top: 7px; }
.afd-home-popular .afd-card__cta { display: none; }

.afd-home-trust { display: grid; gap: 14px; padding: 20px; background: linear-gradient(120deg,#FFF8F1,#fff); }
.afd-home-trust h2 { font-size: 1.35rem; }
.afd-home-trust > div > p { margin: 0; color: var(--afd-text-muted); font-size: .78rem; }
.afd-home-trust .afd-trust { grid-template-columns: 1fr; gap: 8px; }
.afd-home-trust .afd-trust__item { align-items: center; min-height: 64px; padding: 11px 12px; background: rgba(255,255,255,.86); }
.afd-home-trust .afd-trust__icon { width: 34px; height: 34px; }
.afd-home-trust .afd-trust__title { font-size: .72rem; }
.afd-home-trust .afd-trust__text { display: none; }
.afd-home-cta { display: grid; grid-template-columns: 1fr; align-items: center; gap: 18px; padding: 24px 22px; background: var(--afd-navy-grad); color: #fff; }
.afd-home-cta h2 { color: #fff; font-size: 1.25rem; }
.afd-home-cta p { margin: 0; color: rgba(255,255,255,.64); font-size: .74rem; }
.afd-home-cta .afd-btn { width: 100%; min-height: 50px; }

/* ---------- Søgefelt og chips ---------- */
.afd-search { display: flex; background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); padding: var(--afd-space-1); max-width: 560px; box-shadow: var(--afd-shadow-sm); }
.afd-search input[type="search"] { flex: 1; border: 0; background: transparent; padding: 10px 14px; font-family: var(--afd-font-body); font-size: var(--afd-fs-body); color: var(--afd-text); min-width: 0; -webkit-appearance: none; appearance: none; }
.afd-search input[type="search"]::-webkit-search-decoration, .afd-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.afd-search input[type="search"]:focus { outline: none; }
.afd-search button { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; background: var(--afd-accent); color: #fff; border: 0; border-radius: 999px; width: 44px; height: 44px; padding: 0; cursor: pointer; font-size: 1.05rem; line-height: 1; flex: 0 0 auto; }
.afd-search button:hover { background: var(--afd-accent-hover); }
.afd-chips { display: flex; flex-wrap: wrap; gap: var(--afd-space-2) var(--afd-space-5); margin-top: var(--afd-space-4); padding: 0; list-style: none; }
.afd-chips li { color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-chips li::before { content: "\2713"; color: var(--afd-accent); font-weight: 700; margin-right: 6px; }

/* ---------- Kuraterede dyreuniverser ---------- */
.afd-animal-showcase { position: relative; margin-top: var(--afd-section-gap); padding-inline: var(--afd-space-5); border: 1px solid var(--afd-border); border-radius: 24px; background: linear-gradient(145deg, #fff 0%, #f7f8fa 100%); overflow: hidden; }
.afd-animal-showcase::before { content: ""; position: absolute; width: 260px; height: 260px; right: -110px; top: -120px; border-radius: 50%; background: rgba(240,144,14,.07); pointer-events: none; }
.afd-grid--animals { --afd-grid-min: 300px; position: relative; }
.afd-tile-animal { display: grid; grid-template-columns: 92px minmax(0,1fr); align-items: center; gap: var(--afd-space-4); min-height: 182px; border: 1px solid rgba(20,51,92,.06); border-radius: 18px; padding: var(--afd-space-5); background: var(--afd-bg-alt); color: inherit; box-sizing: border-box; overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
a.afd-tile-animal:hover { text-decoration: none; transform: translateY(-3px); box-shadow: var(--afd-shadow-md); border-color: rgba(20,51,92,.12); }
.afd-tile-animal__icon { width: 92px; height: 112px; border-radius: 38px 38px 28px 28px; display: grid; place-items: center; padding: 8px; box-sizing: border-box; background: rgba(255,255,255,.72); color: var(--afd-navy); box-shadow: 0 8px 28px rgba(20,51,92,.09); }
.afd-tile-animal__icon svg { width: 30px; height: 30px; fill: currentColor; }
.afd-tile-animal__icon img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 8px 8px rgba(20,51,92,.08)); transition: transform .2s ease; }
.afd-tile-animal:hover .afd-tile-animal__icon img { transform: scale(1.06) rotate(-1deg); }
.afd-tile-animal__content { min-width: 0; }
.afd-tile-animal__name { font-family: var(--afd-font-heading); font-size: 1.2rem; font-weight: 750; color: var(--afd-navy); }
.afd-tile-animal__meta { margin-top: 3px; color: var(--afd-text-muted); font-size: .8rem; line-height: 1.45; }
.afd-tile-animal__link { display: inline-block; margin-top: var(--afd-space-3); color: var(--afd-warning); font-size: .8rem; font-weight: 700; }
.afd-tile-animal--hund { background: var(--afd-tile-hund); }
.afd-tile-animal--kat { background: var(--afd-tile-kat); }
.afd-tile-animal--kanin { background: var(--afd-tile-kanin); }
.afd-tile-animal--fugl { background: var(--afd-tile-fugl); }
.afd-tile-animal--akvarie { background: var(--afd-tile-akvarie); }
.afd-tile-animal--hest { background: var(--afd-tile-hest); }
.afd-category-tile { display: flex; align-items: center; justify-content: space-between; gap: var(--afd-space-4); min-height: 84px; padding: var(--afd-space-5); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); box-shadow: var(--afd-shadow-sm); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.afd-category-tile:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--afd-shadow-md); border-color: var(--afd-navy); }
.afd-category-tile__name { color: var(--afd-navy); font: 700 .95rem/1.3 var(--afd-font-heading); }
.afd-category-tile__link { flex: 0 0 auto; color: var(--afd-accent-hover); font-size: .78rem; font-weight: 700; }

/* ---------- Tillidsrække ---------- */
.afd-trust { display: grid; gap: var(--afd-space-4); }
.afd-band--trust { margin-top: var(--afd-space-6); padding: var(--afd-space-8); border-radius: 20px; background: var(--afd-bg); border: 1px solid var(--afd-border); box-shadow: var(--afd-shadow-sm); }
.afd-trust__item { display: flex; gap: var(--afd-space-3); align-items: flex-start; padding: var(--afd-space-4); border-radius: var(--afd-radius-card); background: var(--afd-bg-alt); }
.afd-trust__icon { width: 40px; height: 40px; border-radius: 999px; background: var(--afd-accent-soft); color: var(--afd-accent); display: flex; align-items: center; justify-content: center; font-weight: 800; flex: 0 0 auto; }
.afd-trust__icon svg { width: 19px; height: 19px; display: block; }
.afd-trust__title { font-weight: 700; color: var(--afd-navy); font-family: var(--afd-font-heading); }
.afd-trust__text { color: var(--afd-text-muted); font-size: var(--afd-fs-small); }

/* ---------- Forside: redaktionelle kort og forklaring ---------- */
.afd-home-guides { display: grid; gap: var(--afd-space-4); }
.afd-home-guide { display: grid; grid-template-columns: 112px minmax(0,1fr); min-height: 148px; overflow: hidden; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); box-shadow: var(--afd-shadow-sm); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.afd-home-guide:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--afd-shadow-md); border-color: var(--afd-navy); }
.afd-home-guide__media { min-height: 148px; background: var(--afd-accent-soft); overflow: hidden; display: grid; place-items: center; }
.afd-home-guide__media img { width: 100%; height: 100%; object-fit: cover; }
.afd-home-guide__media--empty { color: rgba(20,51,92,.18); }
.afd-home-guide__body { display: flex; flex-direction: column; align-items: flex-start; padding: var(--afd-space-4); }
.afd-home-guide__body h3 { font-size: 1rem; line-height: 1.35; }
.afd-home-guide__link { margin-top: auto; color: var(--afd-accent-hover); font-size: .8rem; font-weight: 700; }
.afd-how { display: grid; gap: var(--afd-space-4); counter-reset: afd-step; }
.afd-how__item { position: relative; padding: var(--afd-space-6); border-radius: var(--afd-radius-card); background: var(--afd-bg); border: 1px solid var(--afd-border); box-shadow: var(--afd-shadow-sm); }
.afd-how__number { display: inline-block; margin-bottom: var(--afd-space-5); color: var(--afd-accent); font: 800 1.65rem/1 var(--afd-font-heading); }
.afd-how__item p { margin: 0; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }

/* ---------- Sortering, pagination, tomtilstand ---------- */
.afd-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--afd-space-4); margin-bottom: var(--afd-space-4); flex-wrap: wrap; }
.afd-sort select { border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); padding: 8px 10px; background: var(--afd-bg); font-family: var(--afd-font-body); }
.afd-pagination { display: flex; gap: var(--afd-space-2); flex-wrap: wrap; margin-top: var(--afd-space-6); }
.afd-pagination a, .afd-pagination span { border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); padding: 8px 14px; background: var(--afd-bg); }
.afd-pagination .afd-pagination__current { background: var(--afd-navy); color: #fff; border-color: var(--afd-navy); }
/* "Indlaes flere"-navigation (landingssider): taeller + knap i stedet for
   sidetal; knappen er et rigtigt <a rel="next"> (SEO-sikker, virker uden JS). */
.afd-loadmore { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: var(--afd-space-6); }
.afd-loadmore__status { margin: 0; color: var(--afd-text-muted); font-size: .85rem; }
.afd-loadmore__btn { min-width: 240px; }
.afd-loadmore__btn[aria-busy] { opacity: .6; pointer-events: none; }
.afd-empty { text-align: center; padding: var(--afd-space-10) var(--afd-space-5); background: var(--afd-bg); border: 1px dashed var(--afd-border); border-radius: var(--afd-radius-module); }
.afd-empty__title { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-2); }

/* ---------- Produktside (FindEROTIK-porten 1:1, STIL.md 4.11) ---------- */
.afd-psec { margin-bottom: var(--afd-space-8); }
.afd-product-hero { display: grid; gap: var(--afd-space-6); margin-bottom: var(--afd-space-8); }
.afd-phero__media { position: relative; background: var(--afd-navy-grad); border-radius: 14px; padding: 10px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.afd-phero__media::after { content: ""; position: absolute; top: -40%; right: -20%; width: 70%; height: 70%; background: radial-gradient(circle, rgba(240,144,14,.14), transparent 60%); pointer-events: none; }
.afd-phero__imgbox { position: relative; z-index: 1; width: 100%; background: #fff; border-radius: 8px; box-shadow: 0 4px 24px rgba(0,0,0,.2); display: flex; align-items: center; justify-content: center; overflow: hidden; padding: var(--afd-space-4); box-sizing: border-box; }
.afd-phero__imgbox img { max-width: 100%; max-height: 340px; height: auto; object-fit: contain; aspect-ratio: 1 / 1; }
.afd-phero__noimg { padding: 4rem 2rem; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-phero__drop { position: absolute; top: 10px; right: 10px; width: 64px; height: 64px; border-radius: 50%; background: var(--afd-accent-grad); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 2; box-shadow: 0 0 30px rgba(240,144,14,.5); animation: afd-pulse 2s ease-in-out infinite; will-change: transform; }
.afd-phero__drop b { font-size: 18px; line-height: 1; }
.afd-phero__drop small { font-size: 8px; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; opacity: .85; }
@keyframes afd-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
.afd-phero__info { display: flex; flex-direction: column; min-width: 0; }
.afd-phero__info h1 { font-size: 24px; font-weight: 800; line-height: 1.2; margin: 0 0 var(--afd-space-2); }
.afd-phero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--afd-space-2); margin-bottom: var(--afd-space-1); font-family: var(--afd-font-heading); }
.afd-phero__brand { color: var(--afd-accent); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.afd-phero__cat { color: var(--afd-text-muted); font-size: 10px; text-transform: uppercase; letter-spacing: 1px; }
.afd-phero__sep { color: var(--afd-border); }
.afd-phero__updated { color: var(--afd-text-muted); font-size: 10px; letter-spacing: .5px; }
.afd-phero__desc { color: var(--afd-text-muted); font-size: var(--afd-fs-small); line-height: 1.7; margin-bottom: var(--afd-space-4); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.afd-phero__desc--open { display: block; -webkit-line-clamp: unset; }
.afd-readmore { display: none; align-self: flex-start; background: none; border: 0; padding: 0; margin: 0 0 var(--afd-space-4); font: 600 12px var(--afd-font-heading); color: var(--afd-navy); cursor: pointer; -webkit-tap-highlight-color: transparent; }
/* Ren tekst-knap: KUN tekst + pil, ingen boks/fyld/understregning i NOGEN
   tilstand. Den globale orange :focus-visible-ramme (afsnit reset) gav en "grim
   hover-boks"; her nulstilles alt, saa knappen altid er ren tekst. */
.afd-readmore:hover, .afd-readmore:focus, .afd-readmore:active { background: none; box-shadow: none; text-decoration: none; }
.afd-readmore:focus-visible { outline: none; text-decoration: none; }
.afd-icon-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--afd-space-2); margin-bottom: var(--afd-space-3); }
.afd-ig__item { display: flex; align-items: center; gap: var(--afd-space-2); font-size: 11px; color: var(--afd-text-muted); padding: 6px 10px; background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); min-width: 0; }
a.afd-ig__item { transition: border-color .2s ease; }
a.afd-ig__item:hover { border-color: var(--afd-accent); text-decoration: none; }
.afd-ig__ico { width: 24px; height: 24px; border-radius: 6px; background: var(--afd-accent-soft); color: var(--afd-warning); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.afd-ig__ico svg { width: 13px; height: 13px; display: block; }
.afd-ig__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.afd-icon-grid + .afd-pricecard { margin-top: 0; }
.afd-pricecard { background: var(--afd-navy-grad); border-radius: 14px; padding: var(--afd-space-5); color: #fff; position: relative; overflow: hidden; margin-top: auto; }
.afd-pricecard::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent); }
.afd-pricecard__label { font-family: var(--afd-font-heading); font-size: 10px; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.55); margin-bottom: 6px; }
.afd-pricecard__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--afd-space-3); margin-bottom: var(--afd-space-4); }
.afd-pricecard__price { font-family: var(--afd-font-heading); font-size: 32px; font-weight: 800; line-height: 1.1; color: var(--afd-accent); white-space: nowrap; }
.afd-pricecard__right { text-align: right; }
.afd-pricecard__old { display: block; font-size: 16px; color: rgba(255,255,255,.45); text-decoration: line-through; }
.afd-pricecard__save { display: inline-block; background: rgba(240,144,14,.15); color: var(--afd-accent); font-size: 11px; font-weight: 700; padding: 5px 12px; border-radius: 8px; margin-top: 4px; }
.afd-pricecard__low30 { display: block; margin-top: var(--afd-space-2); font-size: 11px; color: rgba(255,255,255,.55); }
.afd-pricecard__none { color: #FCA5A5; font-weight: 600; }
.afd-cta-main { display: flex; align-items: center; gap: var(--afd-space-3); width: 100%; padding: 15px 18px; background: var(--afd-accent); color: #fff; border: 0; border-radius: 10px; font: 700 14px/1 var(--afd-font-heading); cursor: pointer; text-decoration: none; box-sizing: border-box; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.afd-cta-main:hover { background: var(--afd-accent-hover); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(240,144,14,.35); text-decoration: none; }
.afd-cta-main__logo { flex: 0 0 auto; width: 36px; height: 36px; padding: 4px; background: #fff; border-radius: 8px; display: flex; align-items: center; justify-content: center; overflow: hidden; box-sizing: border-box; }
.afd-cta-main__logo img { width: 100%; height: 100%; object-fit: contain; }
.afd-cta-main__text { flex: 1; text-align: left; }
.afd-cta-main__arrow { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; transition: transform .2s ease; animation: afd-arrow-pulse 2s ease-in-out infinite; }
.afd-cta-main__arrow svg { width: 24px; height: 24px; display: block; }
.afd-cta-main:hover .afd-cta-main__arrow { animation: none; transform: translateX(4px); }
@keyframes afd-arrow-pulse { 0%, 100% { transform: translateX(0); opacity: 1; } 50% { transform: translateX(4px); opacity: .7; } }
.afd-unavailable { background: var(--afd-bg); border: 1px solid var(--afd-border); border-left: 4px solid var(--afd-accent); border-radius: var(--afd-radius-md); padding: var(--afd-space-8) var(--afd-space-5); text-align: center; margin-bottom: var(--afd-space-8); }
.afd-unavailable h2 { font-size: 22px; margin-bottom: var(--afd-space-2); }
.afd-unavailable p { color: var(--afd-text-muted); margin: 0; }
.afd-whobox { background: var(--afd-navy-grad); border-radius: 14px; padding: var(--afd-space-5); color: #fff; position: relative; overflow: hidden; }
.afd-whobox::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent); }
.afd-whobox h2 { font-size: 15px; font-weight: 700; margin: 0 0 var(--afd-space-3); color: var(--afd-accent); }
.afd-whobox p { font-size: 14px; color: rgba(255,255,255,.75); line-height: 1.7; margin: 0; }
.afd-tabs { display: block; }
/* Mobil: 2x2 (grid) i stedet for 3+1 (flex-wrap gav skaev raekke). @600 tilbage til flex-raekke. */
.afd-tabs__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: var(--afd-space-5); background: #EEF2F6; border: 1px solid var(--afd-border); border-radius: 14px; padding: 4px; }
.afd-tabs__btn { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 10px 12px; background: transparent; border: 0; font: 650 12px/1.2 var(--afd-font-heading); color: var(--afd-text-muted); cursor: pointer; border-radius: 10px; white-space: nowrap; transition: color .2s ease, background .2s ease, box-shadow .2s ease; }
.afd-tabs__btn:hover { color: var(--afd-text); }
.afd-tabs__btn--active { background: var(--afd-navy); color: #fff; box-shadow: 0 4px 12px rgba(14,39,71,.18); }
.afd-tabs__btn--active:hover { color: #fff; }
.afd-tabs__panel { display: none; }
.afd-tabs__panel--active { display: block; animation: afd-fadetab .3s ease; }
.afd-tabs__panel > .afd-prose { padding: 20px; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: #fff; box-shadow: var(--afd-shadow-sm); }
@keyframes afd-fadetab { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.afd-trustbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--afd-space-3) var(--afd-space-4); padding: var(--afd-space-3) var(--afd-space-4); background: var(--afd-navy-grad); border-radius: 14px; border: 1px solid rgba(255,255,255,.06); }
.afd-trustbar__item { display: inline-flex; align-items: center; gap: 6px; font-family: var(--afd-font-heading); font-size: 10px; font-weight: 500; color: rgba(255,255,255,.8); white-space: nowrap; letter-spacing: .3px; }
.afd-trustbar__item svg { width: 12px; height: 12px; flex: 0 0 auto; color: #7DE3A0; }
.afd-catcta { display: flex; flex-direction: column; gap: var(--afd-space-4); align-items: stretch; text-align: center; padding: var(--afd-space-5); background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: 14px; }
.afd-catcta__text h2 { font-size: 18px; margin: 0 0 4px; }
.afd-catcta__text p { font-size: 13px; color: var(--afd-text-muted); margin: 0; }
.afd-stickybar { position: fixed; bottom: 0; left: 0; right: 0; z-index: var(--afd-z-sticky); background: var(--afd-navy-deep); border-top: 1px solid rgba(255,255,255,.06); padding: 10px var(--afd-space-4); display: flex; align-items: center; justify-content: center; gap: var(--afd-space-3); box-shadow: 0 -4px 24px rgba(0,0,0,.3); transform: translateY(100%); transition: transform .3s ease; }
.afd-stickybar--visible { transform: translateY(0); }
.afd-stickybar__price { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.afd-stickybar__label { font-family: var(--afd-font-heading); font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.55); }
.afd-stickybar__amount { font-family: var(--afd-font-heading); font-size: 17px; font-weight: 800; line-height: 1.1; color: var(--afd-accent); white-space: nowrap; }
.afd-share-btn { position: relative; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: 1px solid rgba(255,255,255,.15); border-radius: 8px; color: rgba(255,255,255,.6); cursor: pointer; flex: 0 0 auto; transition: color .2s ease, border-color .2s ease; }
.afd-share-btn:hover { color: #fff; border-color: rgba(255,255,255,.4); }
.afd-share-btn svg { width: 18px; height: 18px; }
.afd-share-toast { position: absolute; top: -40px; left: 0; background: #fff; color: var(--afd-text); font-size: 12px; font-weight: 600; padding: 6px 14px; border-radius: 6px; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .3s ease; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.afd-share-toast--show { opacity: 1; }
.afd-btn--row { padding: 10px 14px; font-size: 0.75rem; letter-spacing: .04em; box-shadow: none; }
.afd-btn--compact { padding: 11px 20px; font-size: 0.75rem; white-space: nowrap; }

/* ---------- Slider: lignende produkter (FindEROTIK slide-track) ---------- */
.afd-slider { position: relative; }
.afd-slider::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 54px; background: linear-gradient(to right, rgba(246,247,249,0), var(--afd-bg-alt) 82%); pointer-events: none; z-index: 2; transition: opacity .3s ease; }
.afd-slider--end::after { opacity: 0; }
.afd-slider__track { display: flex; gap: var(--afd-space-3); overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 4px 20px var(--afd-space-2) 4px; }
.afd-slider__track::-webkit-scrollbar { display: none; }
.afd-slider__track > * { flex: 0 0 auto; width: calc(38vw - 6px); max-width: 210px; scroll-snap-align: start; }
.afd-slide-arrow { display: none; position: absolute; top: 50%; z-index: 3; width: 42px; height: 42px; border-radius: 50%; background: var(--afd-accent); color: #fff; border: 2px solid #fff; cursor: pointer; align-items: center; justify-content: center; padding: 0; box-shadow: 0 6px 18px rgba(240,144,14,.4); transition: background .25s ease, opacity .25s ease, transform .25s ease; opacity: 1; }
.afd-slide-arrow:hover { background: var(--afd-accent-hover); border-color: #fff; transform: translateY(-50%) scale(1.08); opacity: 1; }
.afd-slide-arrow--left { left: 8px; transform: translateY(-50%); }
.afd-slide-arrow--right { right: 8px; transform: translateY(-50%); }
.afd-slide-arrow--hidden { opacity: 0; pointer-events: none; }
.afd-slide-arrow::before { content: ""; display: block; width: 10px; height: 10px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; }
.afd-slide-arrow--right::before { transform: rotate(-45deg); margin-left: -2px; }
.afd-slide-arrow--left::before { transform: rotate(135deg); margin-right: -2px; }
/* Kompakte slider-kort: skjul butikslogoet i CTA'en (som katalog/forside-kort)
   saa "Til butik" staar helt paa EN linje selv paa smalle kort. */
.afd-slider .afd-card__cta { white-space: nowrap; padding-inline: 8px; }
.afd-slider .afd-card__cta .afd-card__merchant { display: none; }

/* ---------- Footer-links: interne links over footeren (FindEROTIK) ---------- */
.afd-footlinks { background: var(--afd-bg); border-top: 1px solid var(--afd-border); margin-top: var(--afd-space-10); padding-block: var(--afd-space-10); }
.afd-footlinks__grid { display: grid; gap: var(--afd-space-8); }
.afd-footlinks h3 { font-size: 16px; margin-bottom: var(--afd-space-3); }
.afd-footlinks ul { list-style: none; margin: 0 0 var(--afd-space-3); padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--afd-space-2) var(--afd-space-4); }
.afd-footlinks li a { font-size: var(--afd-fs-small); color: var(--afd-text-muted); }
.afd-footlinks__cta { font-weight: 600; font-size: var(--afd-fs-small); }

.afd-variants { display: grid; gap: var(--afd-space-2); margin-block: var(--afd-space-4); }
.afd-variants__label { font: 700 var(--afd-fs-small)/1.3 var(--afd-font-heading); color: var(--afd-navy); }
.afd-variants__options { display: flex; flex-wrap: wrap; gap: var(--afd-space-2); }
.afd-variants__button { display: grid; gap: 1px; min-width: 84px; border: 1px solid var(--afd-border); border-radius: 12px; padding: 8px 13px; background: var(--afd-bg); color: var(--afd-navy); font: 700 var(--afd-fs-small)/1.25 var(--afd-font-heading); text-align: left; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.afd-variants__button small { color: var(--afd-text-muted); font: 600 10px/1.25 var(--afd-font-body); }
.afd-variants__button:hover { border-color: var(--afd-accent); }
.afd-variants__button.is-active { border-color: var(--afd-accent); background: var(--afd-accent-soft); box-shadow: 0 0 0 2px rgba(240,144,14,.14); }
.afd-variants__button:focus-visible { outline: 3px solid rgba(240,144,14,.3); outline-offset: 2px; }
.afd-variants__button.is-unavailable { opacity: .62; }
.afd-variants__button.is-unavailable small { color: var(--afd-danger); }
/* To-dimensionel vaelger (2026-08-31): to raekker (stoerrelse, farve). De
   flade kombinationsknapper bestaar som SKJULT motor (proxy-klik fra JS);
   display-reglen skal vinde over __options' flex, derfor to klasser. */
.afd-variants .afd-variants__options--engine { display: none; }
.afd-variants--dims .afd-variants__label { margin-top: 4px; }
.afd-variants--dims .afd-variants__label:first-child { margin-top: 0; }
.afd-variants__button--color { min-width: 64px; }
/* Kombination der ikke findes med det andet valg: daempet, men stadig
   klikbar (det andet valg hopper med til naermeste eksisterende). */
.afd-variants__button.is-off { opacity: .42; border-style: dashed; }
.afd-variants__button.is-off:hover { opacity: .75; }
.afd-prose { max-width: var(--afd-content-max); }
.afd-prose p { margin: 0 0 var(--afd-space-4); line-height: 1.75; }
.afd-prose h2 { margin-top: var(--afd-space-12); }
.afd-prose h3 { margin-top: var(--afd-space-8); margin-bottom: var(--afd-space-3); }
.afd-prose h2:first-child, .afd-prose h3:first-child { margin-top: 0; }
.afd-prose ul, .afd-prose ol { margin: 0 0 var(--afd-space-4); padding-left: 20px; }
.afd-prose li { margin-bottom: var(--afd-space-1); line-height: 1.7; }
.afd-featlist { margin: 0; padding-left: 20px; list-style: disc; }
.afd-featlist li { margin-bottom: var(--afd-space-2); line-height: 1.7; }

/* ---------- Scroll-tabel (mobil-mønster til datatunge tabeller) ---------- */
/* display:block + max-width:100% garanterer at wrapperen ALDRIG bliver bredere
   end sin forælder: en bred tabel scroller indeni og skubber aldrig hele siden. */
.afd-table-scroll { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
/* Sikkerhedsnet: redaktionelle kolonner maa kunne krympe under deres indhold
   (min-width:0), ellers tvinger en bred tabel forælderen bred = side-overflow. */
.afd-cross-editorial, .afd-cross-editorial__content, .afd-prose, .afd-art-body { min-width: 0; }

/* ---------- Prisudvikling (D14: dokumenteret historik) ---------- */
.afd-offers__low30 { display: block; color: var(--afd-text-muted); font-size: 0.7rem; }
.afd-offers__row--best .afd-offers__low30 { color: rgba(255,255,255,.5); }
.afd-history { position: relative; margin-top: var(--afd-space-6); overflow: hidden; background: linear-gradient(145deg, #fff 0%, #fbf7f0 100%); border: 1px solid var(--afd-border); border-radius: 20px; padding: var(--afd-space-5); box-shadow: var(--afd-shadow-sm); }
.afd-history::before { content: ""; position: absolute; width: 180px; height: 180px; right: -80px; top: -90px; border-radius: 50%; background: rgba(240,144,14,.1); pointer-events: none; }
.afd-history__head { position: relative; display: flex; flex-direction: column; gap: var(--afd-space-3); margin-bottom: var(--afd-space-5); }
.afd-history__head h2 { margin-bottom: var(--afd-space-1); }
.afd-history__head p { max-width: 600px; margin: 0; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-history__period { align-self: flex-start; padding: 6px 10px; border-radius: 999px; background: var(--afd-bg); border: 1px solid var(--afd-border); color: var(--afd-text-muted); font-size: .72rem; font-weight: 600; }
/* Mobil: de 3 priser paa EEN raekke (3 kolonner). Stort tal OEVERST, beskrivelse
   UNDER (ejer-oenske 2026-07-22). @600 giver luftigere kort. */
.afd-history__stats { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: var(--afd-space-4); }
.afd-history__stats > div { display: block; min-width: 0; padding: 9px 8px; border: 1px solid var(--afd-border); border-radius: 12px; background: rgba(255,255,255,.82); }
.afd-history__stats strong { display: block; color: var(--afd-navy); font: 800 clamp(.82rem,3.8vw,1.7rem)/1.05 var(--afd-font-heading); letter-spacing: -.01em; white-space: nowrap; }
.afd-history__stats span { display: block; margin-top: 3px; color: var(--afd-text-muted); font-size: .58rem; line-height: 1.25; }
.afd-history__chart { position: relative; color: var(--afd-accent); padding: 8px; border: 1px solid rgba(20,51,92,.06); border-radius: 14px; background: rgba(255,255,255,.72); }
.afd-history svg { width: 100%; height: auto; min-height: 150px; display: block; }
.afd-history__grid { stroke: var(--afd-border); stroke-width: 1; stroke-dasharray: 4 5; }
.afd-history__area { fill: url(#afd-history-fill); color: var(--afd-accent); }
.afd-history__line { fill: none; stroke: var(--afd-accent); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.afd-history__dot { fill: var(--afd-accent); stroke: #fff; stroke-width: 3; }
/* Dato-akse under grafen: HTML-labels (fast laesbar stoerrelse paa mobil). */
.afd-history__xaxis { display: flex; justify-content: space-between; gap: 8px; margin-top: 6px; padding: 0 10px; }
.afd-history__xaxis span { color: #46566d; font: 700 .82rem/1 var(--afd-font-heading); }
.afd-history__xaxis span:only-child { margin: 0 auto; }
.afd-history__note { margin: var(--afd-space-3) 0 0; color: var(--afd-text-muted); font-size: .72rem; line-height: 1.55; }

/* ---------- Produktnær intern navigation ---------- */
.afd-explore { display: grid; gap: var(--afd-space-5); padding: var(--afd-space-6); border-radius: 20px; background: radial-gradient(circle at 90% 0, rgba(240,144,14,.18), transparent 30%), var(--afd-navy-grad); color: #fff; }
.afd-explore__intro h2 { color: #fff; }
.afd-explore__intro p { margin: 0; color: rgba(255,255,255,.65); font-size: var(--afd-fs-small); }
/* Kompakte bjaelker: KUN navn + pulserende pil (ejer-oenske 2026-07-22). Ikke
   laengere hoeje kort med generisk fyld-tekst (1 pr raekke saa alt for meget luft). */
.afd-explore__grid { display: grid; gap: 8px; }
.afd-explore__card { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 0; padding: 12px 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: rgba(255,255,255,.07); color: #fff; transition: background .18s ease, border-color .18s ease; }
.afd-explore__card:hover { color: #fff; text-decoration: none; background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.24); }
.afd-explore__card strong { min-width: 0; color: #fff; font: 650 .86rem/1.3 var(--afd-font-heading); overflow-wrap: anywhere; }
.afd-explore__arrow { flex: 0 0 auto; color: var(--afd-accent); font-size: 1.15rem; line-height: 1; animation: afd-explore-nudge 1.5s ease-in-out infinite; }
@keyframes afd-explore-nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(4px); } }
.afd-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ---------- Artikler (blok-renderer, snippet 64, jf. D20 og STIL.md 4.9) ---------- */
.afd-article { max-width: 860px; margin-inline: auto; padding-block: var(--afd-space-6) 0; }
.afd-article__header { position: relative; padding: var(--afd-space-6); overflow: hidden; background: linear-gradient(145deg, var(--afd-navy-deep), var(--afd-navy)); color: #fff; border-radius: var(--afd-radius-module); box-shadow: var(--afd-shadow-md); }
.afd-article__header::after { content: ""; position: absolute; width: 220px; height: 220px; right: -90px; top: -100px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; box-shadow: 0 0 0 34px rgba(255,255,255,.035), 0 0 0 68px rgba(255,255,255,.025); pointer-events: none; }
.afd-article__header h1 { position: relative; z-index: 1; max-width: 760px; margin: 0 0 var(--afd-space-3); color: #fff; font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.05; letter-spacing: -.035em; }
.afd-article__eyebrow { position: relative; z-index: 1; display: inline-flex; margin-bottom: var(--afd-space-3); padding: 6px 11px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: var(--afd-accent); font: 750 .72rem/1 var(--afd-font-heading); letter-spacing: .09em; text-transform: uppercase; }
.afd-article__dek { position: relative; z-index: 1; max-width: 700px; margin: 0 0 var(--afd-space-4); color: rgba(255,255,255,.78); font-size: 1.05rem; line-height: 1.65; }
.afd-article__meta { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: var(--afd-space-3); color: rgba(255,255,255,.66); font-size: var(--afd-fs-small); }
.afd-article__meta span + span::before { content: "•"; margin-right: var(--afd-space-3); color: var(--afd-accent); }
.afd-article__author { position: relative; z-index: 1; display: flex; align-items: center; gap: var(--afd-space-3); margin-top: var(--afd-space-5); padding-top: var(--afd-space-4); border-top: 1px solid rgba(255,255,255,.14); }
.afd-article__avatar img { width: 48px; height: 48px; object-fit: cover; border: 2px solid rgba(255,255,255,.45); border-radius: 50%; }
.afd-article__author span, .afd-article__author strong { display: block; }
.afd-article__author span { color: rgba(255,255,255,.58); font-size: .72rem; }
.afd-article__author strong { color: #fff; font-family: var(--afd-font-heading); }
.afd-article__hero { margin: var(--afd-space-5) 0 0; overflow: hidden; border-radius: var(--afd-radius-module); box-shadow: var(--afd-shadow-sm); }
.afd-article__hero img { display: block; width: 100%; max-height: 500px; object-fit: cover; }
.afd-article-body { padding-top: var(--afd-space-7); }
.afd-byline { color: var(--afd-text-muted); font-size: var(--afd-fs-small); margin-bottom: var(--afd-space-5); }
/* Signatur-greb: hver H2 starter en visuelt adskilt sektion (NEMMAND-læring). */
.afd-article-body h2 { border-top: 1px solid var(--afd-border); padding-top: var(--afd-space-6); margin-top: var(--afd-space-8); }
.afd-article-body h2:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.afd-article-body p { margin: 0 0 var(--afd-space-3); }
.afd-art-intro { margin-bottom: var(--afd-space-6); color: var(--afd-navy); font-size: 1.125rem; font-weight: 520; line-height: 1.75; }
.afd-faq, .afd-proscons, .afd-howto, .afd-compare { margin-block: var(--afd-space-6); }
.afd-tldr { position: relative; background: linear-gradient(135deg, var(--afd-accent-soft), #fff); border: 1px solid rgba(232,119,34,.22); border-radius: var(--afd-radius-module); padding: var(--afd-space-5) var(--afd-space-6); margin-block: var(--afd-space-6); box-shadow: var(--afd-shadow-sm); }
.afd-tldr__title { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-2); }
.afd-tldr__list { margin: 0; padding-left: 18px; }
.afd-tldr__list li { margin-bottom: var(--afd-space-1); }
.afd-faq__item { border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); background: var(--afd-bg); margin-bottom: var(--afd-space-2); box-shadow: 0 2px 10px rgba(14,42,51,.04); transition: border-color .2s ease, box-shadow .2s ease; }
.afd-faq__item[open] { border-color: rgba(232,119,34,.42); box-shadow: var(--afd-shadow-sm); }
.afd-faq__q { cursor: pointer; padding: var(--afd-space-3) var(--afd-space-4); font-weight: 600; color: var(--afd-navy); display: flex; align-items: center; gap: var(--afd-space-3); list-style: none; }
.afd-faq__q::-webkit-details-marker { display: none; }
.afd-faq__chev { margin-left: auto; flex: 0 0 auto; width: 18px; height: 18px; color: var(--afd-text-muted); transition: transform .2s ease; }
.afd-faq__item[open] .afd-faq__chev { transform: rotate(180deg); }
.afd-faq__chev svg { width: 100%; height: 100%; display: block; }
.afd-faq__a { padding: 0 var(--afd-space-4) var(--afd-space-3); }
.afd-proscons__grid { display: grid; gap: var(--afd-space-4); }
.afd-proscons__col { background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); padding: var(--afd-space-4); }
.afd-proscons__head { font-family: var(--afd-font-heading); font-weight: 700; margin-bottom: var(--afd-space-2); }
.afd-proscons__col--pros .afd-proscons__head { color: var(--afd-success); }
.afd-proscons__col--cons .afd-proscons__head { color: var(--afd-danger); }
.afd-proscons__col ul { margin: 0; padding-left: 18px; }
/* Redaktionel anmeldelse (76): kompakt desktopmodul med score, verdict og kriterier. */
.afd-review { margin-block: var(--afd-space-5); padding: 16px; overflow: hidden; background: linear-gradient(145deg,#fff 0%,#fdfefe 100%); border: 1px solid var(--afd-border); border-radius: 18px; box-shadow: 0 10px 26px rgba(14,39,71,.075); }
.afd-review__head { display: flex; align-items: center; justify-content: space-between; gap: 8px 18px; flex-wrap: wrap; margin-bottom: 14px; }
.afd-review__head h2 { margin: 0; color: var(--afd-navy); font-size: clamp(1.45rem,2.3vw,1.85rem); line-height: 1.08; }
.afd-review__note { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; color: var(--afd-text-muted); font-size: .72rem; line-height: 1.35; }
.afd-review__note-icon { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 4px; background: var(--afd-soft); border-radius: 50%; }
.afd-review__note-icon .afd-ui-icon { width: 100%; height: 100%; object-fit: contain; }
.afd-review__body { display: grid; gap: 14px; }
.afd-review__score-card { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 12px; min-height: 0; padding: 12px; background: #fff; border: 1px solid var(--afd-border); border-radius: 13px; box-shadow: 0 6px 18px rgba(14,39,71,.055); }
.afd-review__score-ring { --afd-review-pct: 0%; display: grid; place-items: center; width: 100px; height: 100px; padding: 8px; border-radius: 50%; background: conic-gradient(var(--afd-accent) 0 var(--afd-review-pct),#e6ebf1 var(--afd-review-pct) 100%); box-shadow: 0 5px 16px rgba(240,144,14,.12); }
.afd-review__score-core { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; background: #fff; border-radius: 50%; }
.afd-review__scoreval { color: var(--afd-navy); font: 800 2rem/1 var(--afd-font-heading); letter-spacing: -.04em; }
.afd-review__scoremax { margin-top: 5px; color: var(--afd-text); font-size: .8rem; }
.afd-review__stars { position: relative; display: inline-block; width: 108px; color: #dbe2ea; font: 700 1.1rem/1 var(--afd-font-heading); letter-spacing: 3px; white-space: nowrap; }
.afd-review__stars-base { display: block; }
.afd-review__stars-fill { position: absolute; inset: 0 auto 0 0; overflow: hidden; color: var(--afd-accent); white-space: nowrap; }
.afd-review__main { min-width: 0; }
.afd-review__verdict { margin-bottom: 14px; padding: 14px 16px; color: var(--afd-text); font-size: .86rem; line-height: 1.5; background: #fbfcfe; border-radius: 11px; }
.afd-review__verdict p { margin: 0; }
.afd-review__verdict p + p { margin-top: 8px; }
.afd-review__crits { display: grid; }
.afd-review__crit { display: grid; grid-template-columns: 34px minmax(0,1fr) 38px; align-items: center; gap: 4px 8px; min-height: 0; padding: 4px 0; border-bottom: 1px solid #e8edf2; }
.afd-review__crit:last-child { border-bottom: 0; }
.afd-review__crit-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 6px; background: var(--afd-soft); border-radius: 50%; }
.afd-review__crit-icon .afd-ui-icon { width: 100%; height: 100%; object-fit: contain; }
.afd-review__crit-icon { grid-column: 1; grid-row: 1 / 3; }
.afd-review__crit-label { grid-column: 2; grid-row: 1; min-width: 0; overflow-wrap: anywhere; color: var(--afd-navy); font: 700 .78rem/1.25 var(--afd-font-heading); }
.afd-review__crit-bar { grid-column: 2 / 4; grid-row: 2; height: 7px; overflow: hidden; background: #e3e8ee; border-radius: 999px; }
.afd-review__crit-fill { display: block; height: 100%; background: linear-gradient(90deg,var(--afd-accent),#ff9d10); border-radius: 999px; }
.afd-review__crit-score { grid-column: 3; grid-row: 1; color: var(--afd-navy); font: 800 1rem/1 var(--afd-font-heading); text-align: right; }

@media (min-width: 600px) {
  .afd-review { padding: 18px; }
  .afd-review__score-card { flex-direction: row; gap: 20px; padding: 13px 18px; }
  .afd-review__score-ring { width: 112px; height: 112px; }
  .afd-review__stars { width: 128px; font-size: 1.35rem; letter-spacing: 4px; }
  .afd-review__crit { grid-template-columns: 34px minmax(125px,180px) minmax(100px,1fr) 38px; gap: 7px 12px; min-height: 46px; padding: 6px 0; }
  .afd-review__crit-icon { grid-column: 1; grid-row: 1; }
  .afd-review__crit-label { grid-column: 2; grid-row: 1; }
  .afd-review__crit-bar { grid-column: 3; grid-row: 1; }
  .afd-review__crit-score { grid-column: 4; grid-row: 1; }
}
@media (min-width: 900px) {
  .afd-review { padding: 20px; }
  .afd-review__body { grid-template-columns: 170px minmax(0,1fr); gap: 18px; align-items: stretch; }
  .afd-review__score-card { flex-direction: column; gap: 10px; padding: 14px 10px; }
  .afd-review__score-ring { width: 118px; height: 118px; }
  .afd-review__main { display: block; }
  .afd-review__verdict { margin-bottom: 12px; padding: 13px 15px; font-size: .84rem; line-height: 1.48; }
  .afd-review__crit { grid-template-columns: 32px minmax(145px,190px) minmax(120px,1fr) 38px; gap: 6px 10px; min-height: 44px; padding: 5px 0; }
  .afd-review__crit-icon { width: 32px; height: 32px; padding: 6px; }
  .afd-review__crit-label { font-size: .8rem; }
  .afd-review__crit-score { font-size: 1rem; }
}
@media (min-width: 1200px) {
  .afd-review__head { margin-bottom: 12px; }
  .afd-review__body { grid-template-columns: 165px minmax(0,1fr); gap: 18px; }
  .afd-review__score-ring { width: 110px; height: 110px; }
  .afd-review__main { display: grid; grid-template-columns: minmax(260px,.72fr) minmax(460px,1.28fr); gap: 18px; align-items: stretch; }
  .afd-review__verdict { margin-bottom: 0; padding: 13px 15px; font-size: .82rem; line-height: 1.48; }
  .afd-review__crit { grid-template-columns: 30px minmax(135px,165px) minmax(145px,1fr) 36px; gap: 5px 9px; min-height: 42px; padding: 4px 0; }
  .afd-review__crit-icon { width: 30px; height: 30px; padding: 6px; }
  .afd-review__crit-label { font-size: .76rem; }
  .afd-review__crit-score { font-size: .95rem; }
}

/* ---------- Artikel-blokke v2 (NEMMAND-paritet, D20; renderes af 64) ---------- */
.afd-quote { position: relative; margin-block: var(--afd-space-7); padding: var(--afd-space-7) var(--afd-space-6) var(--afd-space-5); background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); box-shadow: var(--afd-shadow-sm); }
.afd-quote::before { content: "“"; position: absolute; top: -14px; left: var(--afd-space-5); color: var(--afd-accent); font: 800 5rem/1 Georgia, serif; }
.afd-quote blockquote { margin: 0; }
.afd-quote blockquote p { margin: 0; font-family: Georgia, serif; font-size: clamp(1.2rem, 3vw, 1.55rem); font-weight: 500; color: var(--afd-navy); line-height: 1.5; }
.afd-quote__cite { margin-top: var(--afd-space-3); font-size: var(--afd-fs-small); color: var(--afd-text-muted); display: flex; align-items: center; gap: var(--afd-space-2); flex-wrap: wrap; }
.afd-quote__author { font-weight: 700; color: var(--afd-text); }
.afd-quote__role { }
.afd-quote__sep { color: var(--afd-border); }
.afd-toc { margin-block: var(--afd-space-6); padding: var(--afd-space-5) var(--afd-space-6); background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); box-shadow: var(--afd-shadow-sm); }
.afd-toc__title { font-family: var(--afd-font-heading); font-size: 1.1rem; font-weight: 750; color: var(--afd-navy); margin-bottom: var(--afd-space-3); }
.afd-toc__list { list-style: none; counter-reset: afd-toc; margin: 0; padding: 0; display: grid; gap: 0; }
.afd-toc__list li { counter-increment: afd-toc; border-top: 1px solid var(--afd-border); }
.afd-toc__list a { display: flex; gap: var(--afd-space-3); padding: 11px 0; color: var(--afd-navy); font-weight: 650; }
.afd-toc__list a::before { content: counter(afd-toc, decimal-leading-zero); color: var(--afd-accent); font-size: .72rem; letter-spacing: .06em; padding-top: 3px; }
.afd-stats { margin-block: var(--afd-space-6); display: grid; gap: var(--afd-space-3); }
.afd-stats__card { background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); padding: var(--afd-space-4) var(--afd-space-5); text-align: center; }
.afd-stats__tal { display: block; font-family: var(--afd-font-heading); font-size: 1.8rem; font-weight: 800; color: var(--afd-navy); line-height: 1.2; }
.afd-stats__label { display: block; font-size: var(--afd-fs-small); color: var(--afd-text-muted); margin-top: var(--afd-space-1); }
.afd-video { margin-block: var(--afd-space-6); }
.afd-video__frame { position: relative; aspect-ratio: 16 / 9; border-radius: var(--afd-radius-md); overflow: hidden; background: var(--afd-navy-deep); }
.afd-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.afd-video__facade { position: absolute; inset: 0; width: 100%; border: 0; background: radial-gradient(circle at 50% 45%, rgba(232,119,34,.2), transparent 30%), linear-gradient(145deg, var(--afd-navy), var(--afd-navy-deep)); color: #fff; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--afd-space-3); font: 700 .85rem var(--afd-font-heading); }
.afd-video__play { width: 64px; height: 64px; border-radius: 50%; background: var(--afd-accent); box-shadow: 0 10px 30px rgba(0,0,0,.25); position: relative; transition: transform .2s ease; }
.afd-video__play::after { content: ""; position: absolute; top: 21px; left: 26px; border-left: 18px solid #fff; border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
.afd-video__facade:hover .afd-video__play { transform: scale(1.08); }
.afd-video figcaption { font-size: var(--afd-fs-small); color: var(--afd-text-muted); margin-top: var(--afd-space-2); }
.afd-gallery { margin-block: var(--afd-space-6); display: grid; gap: var(--afd-space-3); }
.afd-gallery__item { margin: 0; }
.afd-gallery__item { overflow: hidden; border-radius: var(--afd-radius-md); }
.afd-gallery__item img { width: 100%; height: auto; border-radius: var(--afd-radius-md); border: 1px solid var(--afd-border); display: block; transition: transform .3s ease; }
.afd-gallery__item:hover img { transform: scale(1.025); }
.afd-gallery__item figcaption { font-size: var(--afd-fs-small); color: var(--afd-text-muted); margin-top: var(--afd-space-1); }
.afd-method { margin-block: var(--afd-space-6); padding: var(--afd-space-5); background: var(--afd-bg-alt); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); }
.afd-method__title { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-2); }
.afd-method__list { margin: var(--afd-space-2) 0 0; padding-left: 20px; }
.afd-author-bio { margin-block: var(--afd-space-6); padding: var(--afd-space-4) var(--afd-space-5); background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); font-size: var(--afd-fs-small); }
.afd-author-bio__name { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-1); }
.afd-toplist { margin-block: var(--afd-space-6); }
.afd-toplist__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--afd-space-4); counter-reset: none; }
.afd-toplist__item { display: flex; gap: var(--afd-space-4); align-items: flex-start; }
.afd-toplist__nr { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 999px; background: var(--afd-navy); color: #fff; font-family: var(--afd-font-heading); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.afd-toplist__body { flex: 1; min-width: 0; }
.afd-toplist__why { margin: var(--afd-space-2) 0 0; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-art-deals { margin-block: var(--afd-space-6); }
/* Auto-produktsektion fra artiklens kategori (NEMMAND-porten; renderes af 64).
   Genbruger section-head + grid + produktkort; kun wrapper og metodelinje er nye. */
.afd-catprod { margin-block: var(--afd-space-6); }
.afd-catprod__note { margin-top: var(--afd-space-3); color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-merchant-badge { margin-block: var(--afd-space-6); padding: var(--afd-space-4) var(--afd-space-5); background: var(--afd-bg); border: 1px solid var(--afd-border); border-left: 3px solid var(--afd-navy); border-radius: var(--afd-radius-md); }
.afd-merchant-badge__name { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); }
.afd-merchant-badge__meta { font-size: var(--afd-fs-small); color: var(--afd-text-muted); margin: var(--afd-space-1) 0 var(--afd-space-2); }
.afd-merchant-badge__link { font-weight: 600; }
.afd-specs { margin-block: var(--afd-space-6); }
/* overflow: hidden (ikke -x: auto) saa border-radius klipper ALLE fire hjoerner
   rent; ellers stak den graa th-baggrund et firkantet hjoerne ud i bunden.
   Vaerdierne bryder i stedet for at tvinge vandret overloeb. */
.afd-specs__wrap { overflow: hidden; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); box-shadow: var(--afd-shadow-sm); }
/* border-collapse: separate (ikke collapse): ellers blødte den graa th-baggrund
   ud i et FIRKANTET nederste hjoerne selv med overflow:hidden (Chromium-quirk med
   collapsede tabeller i afrundede kasser). Med separate klippes cellerne rent, saa
   den graa venstre kolonne foelger den bløde afrunding hele vejen ned. */
/* Temaet giver alle tabeller en bund-margin, som ellers efterlod en hvid stribe
   mellem sidste raekke og kassens afrundede bund (kun i bunden, da temaet kun
   saetter bund-margin). Hoej specificitet nedenfor nulstiller den uden at bruge
   tema-vaerktoejer, saa den graa venstre kolonne foelger afrundingen hele vejen ned. */
.afd-specs__table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; font-size: var(--afd-fs-small); }
body.afd-page .afd-specs__wrap .afd-specs__table { margin: 0; }
.afd-specs__table th, .afd-specs__table td { text-align: left; padding: 15px var(--afd-space-4); border-bottom: 1px solid var(--afd-border); vertical-align: top; overflow-wrap: anywhere; }
.afd-specs__table tr:last-child th, .afd-specs__table tr:last-child td { border-bottom: 0; }
.afd-specs__table th { color: var(--afd-navy); font-weight: 600; width: 38%; background: var(--afd-bg-alt); }
.afd-howto__steps { margin: 0; padding-left: 0; list-style: none; counter-reset: afd-step; }
.afd-howto__step { counter-increment: afd-step; position: relative; padding-left: 44px; margin-bottom: var(--afd-space-4); }
.afd-howto__step::before { content: counter(afd-step); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 999px; background: var(--afd-navy); color: #fff; display: flex; align-items: center; justify-content: center; font: 700 14px var(--afd-font-heading); }
.afd-howto__name { display: block; color: var(--afd-navy); margin-bottom: var(--afd-space-1); }
.afd-callout { border: 1px solid var(--afd-border); border-left: 4px solid var(--afd-navy); background: var(--afd-bg); border-radius: var(--afd-radius-module); padding: var(--afd-space-5) var(--afd-space-6); margin-block: var(--afd-space-6); box-shadow: var(--afd-shadow-sm); }
.afd-callout--tip { border-left-color: var(--afd-accent); background: var(--afd-accent-soft); }
.afd-callout--advarsel { border-left-color: var(--afd-warning); }
.afd-callout__label { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-1); }
.afd-keyfacts { background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); padding: var(--afd-space-5); margin-block: var(--afd-space-5); }
.afd-keyfacts__title { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-3); }
.afd-keyfacts dl { margin: 0; }
.afd-keyfacts__row { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--afd-space-3); padding-block: var(--afd-space-2); border-bottom: 1px solid var(--afd-border); }
.afd-keyfacts__row:last-child { border-bottom: 0; }
.afd-keyfacts dt { color: var(--afd-text-muted); }
.afd-keyfacts dd { margin: 0; font-weight: 600; }
.afd-sources { font-size: var(--afd-fs-small); color: var(--afd-text-muted); margin-block: var(--afd-space-7); padding: var(--afd-space-5) var(--afd-space-6); background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); box-shadow: var(--afd-shadow-sm); }
.afd-sources__title { color: var(--afd-navy); font-family: var(--afd-font-heading); font-size: 1.05rem; font-weight: 750; margin-bottom: var(--afd-space-3); }
.afd-sources ul { margin: 0; padding-left: 20px; display: grid; gap: var(--afd-space-2); }
.afd-figure { margin: var(--afd-space-5) 0; }
.afd-figure img { max-width: 100%; height: auto; border-radius: var(--afd-radius-md); }
.afd-figure figcaption { color: var(--afd-text-muted); font-size: var(--afd-fs-small); margin-top: var(--afd-space-2); }
.afd-cta-box { background: var(--afd-navy); color: #fff; border-radius: var(--afd-radius-module); padding: var(--afd-space-6); margin-block: var(--afd-space-6); display: flex; flex-wrap: wrap; gap: var(--afd-space-4); align-items: center; justify-content: space-between; }
.afd-cta-box__text { font-family: var(--afd-font-heading); font-weight: 700; font-size: 1.1rem; }
.afd-compare__table { width: 100%; border-collapse: collapse; background: var(--afd-bg); }
.afd-compare__table th, .afd-compare__table td { text-align: left; padding: var(--afd-space-3) var(--afd-space-4); border-bottom: 1px solid var(--afd-border); white-space: nowrap; }
.afd-compare__table th { font-family: var(--afd-font-heading); color: var(--afd-navy); font-size: var(--afd-fs-small); }
.afd-art-offers { margin-block: var(--afd-space-6); }
.afd-pills { display: flex; flex-wrap: wrap; gap: var(--afd-space-2); }
.afd-pills a { border: 1px solid var(--afd-border); border-radius: 999px; padding: 8px 16px; background: var(--afd-bg); font-size: var(--afd-fs-small); font-weight: 600; color: var(--afd-navy); }
.afd-pills a:hover { border-color: var(--afd-navy); }
/* Ikke-klikbare emne-piller (cross-heroens dimensioner): samme pille-udtryk uden hover. */
.afd-link-pills { display: flex; flex-wrap: wrap; gap: var(--afd-space-2); }
.afd-link-pills span { border: 1px solid var(--afd-border); border-radius: 999px; padding: 6px 14px; background: var(--afd-bg-alt); font-size: var(--afd-fs-small); font-weight: 600; color: var(--afd-navy); }
.afd-guide-card { display: flex; flex-direction: column; min-height: 100%; overflow: hidden; background: var(--afd-bg); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); box-shadow: var(--afd-shadow-sm); }
.afd-guide-card:hover { box-shadow: var(--afd-shadow-md); transform: translateY(-2px); }
.afd-guide-card__media { aspect-ratio: 16 / 9; overflow: hidden; background: var(--afd-bg-alt); }
.afd-guide-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.afd-guide-card:hover .afd-guide-card__media img { transform: scale(1.035); }
.afd-guide-card__body { display: flex; flex: 1; flex-direction: column; padding: var(--afd-space-5); }
.afd-guide-card__eyebrow { margin-bottom: var(--afd-space-2); color: var(--afd-accent); font: 750 .68rem/1 var(--afd-font-heading); letter-spacing: .08em; text-transform: uppercase; }
.afd-guide-card__title { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); margin-bottom: var(--afd-space-2); }
.afd-guide-card__excerpt { flex: 1; color: var(--afd-text-muted); font-size: var(--afd-fs-small); margin-bottom: var(--afd-space-4); }
.afd-guide-card__meta { display: flex; justify-content: space-between; gap: var(--afd-space-2); padding-top: var(--afd-space-3); border-top: 1px solid var(--afd-border); color: var(--afd-text-muted); font-size: 0.75rem; }
.afd-guide-card__meta span { color: var(--afd-navy); font-weight: 700; }

/* ---------- Quiz (FindEROTIK-porten, snippet 65, jf. STIL.md 4.10) ----------
   Hub /quiz/: moerk hero, kort-grid med baggrundsbillede + overlay, sektioner.
   Single /quiz/{slug}: hero, fremdriftsbar, steps med valg-kort, resultat med
   produktkort fra 61 + metodelinje. Ingen emoji, ingen konfetti. */
.afd-quizhub-hero { position: relative; overflow: hidden; margin: var(--afd-space-3) 0 var(--afd-space-8); padding: 40px 24px; border-radius: 22px; background: radial-gradient(circle at 88% 10%, rgba(240,144,14,.18), transparent 38%), var(--afd-navy-grad); color: #fff; text-align: center; }
.afd-quizhub-hero h1 { color: #fff; max-width: 720px; margin-inline: auto; }
.afd-quizhub-hero__intro { max-width: 560px; margin: 0 auto var(--afd-space-3); color: rgba(255,255,255,.76); }
.afd-quizhub-hero .afd-disclosure { color: rgba(255,255,255,.62); }
.afd-quizhub-section { margin-bottom: var(--afd-section-gap); }
.afd-quizhub-grid { display: grid; gap: var(--afd-space-4); }
.afd-quizhub-card { position: relative; display: flex; flex-direction: column; min-height: 220px; overflow: hidden; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); color: #fff; box-shadow: var(--afd-shadow-sm); transition: transform .2s ease, box-shadow .2s ease; }
.afd-quizhub-card:hover { transform: translateY(-3px); box-shadow: var(--afd-shadow-md); }
.afd-quizhub-card__bg { position: absolute; inset: 0; background: var(--afd-navy-grad); background-size: cover; background-position: center; }
.afd-quizhub-card__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,39,71,.3) 0%, rgba(14,39,71,.9) 100%); }
.afd-quizhub-card__body { position: relative; z-index: 1; display: flex; flex: 1; flex-direction: column; justify-content: flex-end; padding: var(--afd-space-5); }
.afd-quizhub-card__top { display: flex; gap: var(--afd-space-2); justify-content: space-between; margin-bottom: auto; padding-bottom: var(--afd-space-4); }
.afd-quizhub-card__tag { display: inline-block; padding: 4px 10px; border-radius: var(--afd-radius-sm); background: rgba(255,255,255,.14); color: #fff; font: 700 .62rem/1.2 var(--afd-font-heading); text-transform: uppercase; letter-spacing: .06em; }
.afd-quizhub-card__tag--popular { background: var(--afd-accent); }
.afd-quizhub-card__tag--new { background: var(--afd-success); }
.afd-quizhub-card__tag--beginner { background: rgba(255,255,255,.24); }
.afd-quizhub-card h3 { color: #fff; font-size: 1.1rem; margin-bottom: var(--afd-space-1); }
.afd-quizhub-card p { margin: 0 0 var(--afd-space-3); color: rgba(255,255,255,.72); font-size: var(--afd-fs-small); }
.afd-quizhub-card__meta { display: flex; flex-wrap: wrap; gap: var(--afd-space-3); margin-bottom: var(--afd-space-3); color: rgba(255,255,255,.6); font-size: .72rem; }
.afd-quizhub-card__cta { color: var(--afd-accent); font: 700 var(--afd-fs-small) var(--afd-font-heading); }
/* Dyre-tint paa kortkanten (audience-analogen fra forlaegget). */
.afd-quizhub-card--hund { border-color: var(--afd-tile-hund); }
.afd-quizhub-card--kat { border-color: var(--afd-tile-kat); }
.afd-quizhub-card--kanin { border-color: var(--afd-tile-kanin); }
.afd-quizhub-card--fugl { border-color: var(--afd-tile-fugl); }
.afd-quizhub-card--akvarie { border-color: var(--afd-tile-akvarie); }
.afd-quizhub-card--hest { border-color: var(--afd-tile-hest); }
.afd-quizhub-card--featured { min-height: 180px; }
.afd-quizhub-steps { display: grid; gap: var(--afd-space-3); }
.afd-quizhub-step { padding: var(--afd-space-6) var(--afd-space-5); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); text-align: center; }
.afd-quizhub-step__num { display: block; margin-bottom: var(--afd-space-2); color: var(--afd-accent); font: 800 1.6rem/1 var(--afd-font-heading); opacity: .35; }
.afd-quizhub-step h3 { font-size: 1rem; margin-bottom: var(--afd-space-1); }
.afd-quizhub-step p { margin: 0; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-quizhub-stats { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); padding: var(--afd-space-6); border-radius: var(--afd-radius-card); background: var(--afd-navy-grad); }
.afd-quizhub-stats span { display: grid; align-content: center; padding: 12px 8px; border-radius: 12px; background: rgba(255,255,255,.07); color: rgba(255,255,255,.72); font-size: .7rem; text-align: center; }
.afd-quizhub-stats strong { display: block; margin-bottom: 3px; color: var(--afd-accent); font: 800 1.2rem/1.2 var(--afd-font-heading); }
.afd-quizhub-seo .afd-prose { padding: var(--afd-space-5); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); }
.afd-quizhub-trust__item { padding: var(--afd-space-5); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); }
.afd-quizhub-trust__item h3 { font-size: .95rem; margin-bottom: var(--afd-space-1); }
.afd-quizhub-trust__item p { margin: 0; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
/* Single-siden */
.afd-quiz-hero { position: relative; overflow: hidden; margin: var(--afd-space-3) 0 var(--afd-space-6); padding: 40px 24px; border-radius: 22px; background: radial-gradient(circle at 88% 10%, rgba(240,144,14,.18), transparent 38%), var(--afd-navy-grad); color: #fff; text-align: center; }
.afd-quiz-hero h1 { color: #fff; max-width: 720px; margin-inline: auto; }
.afd-quiz-hero__intro { max-width: 520px; margin: 0 auto var(--afd-space-4); color: rgba(255,255,255,.76); }
.afd-quiz-hero__meta { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--afd-space-2); }
.afd-quiz-hero__meta span { padding: 8px 14px; border: 1px solid rgba(255,255,255,.12); border-radius: var(--afd-radius-md); background: rgba(255,255,255,.07); color: rgba(255,255,255,.72); font-size: .74rem; font-weight: 600; }
.afd-quiz-flow { max-width: var(--afd-content-max); margin: 0 auto var(--afd-section-gap); }
.afd-quiz-progress { display: flex; gap: 6px; margin-bottom: var(--afd-space-6); }
.afd-quiz-progress__step { flex: 1; height: 4px; border-radius: 2px; background: var(--afd-border); transition: background .3s ease; }
.afd-quiz-progress__step--done { background: var(--afd-navy); }
.afd-quiz-progress__step--active { background: var(--afd-accent); }
.afd-quiz-step { display: none; text-align: center; }
.afd-quiz-step--visible { display: block; }
.afd-quiz-step__num { margin-bottom: var(--afd-space-2); color: var(--afd-accent); font: 700 .68rem/1.2 var(--afd-font-heading); text-transform: uppercase; letter-spacing: .1em; }
.afd-quiz-step h3 { font-size: var(--afd-fs-h2); margin-bottom: var(--afd-space-5); }
.afd-quiz-options { display: grid; gap: var(--afd-space-3); }
.afd-quiz-option { display: flex; flex-direction: column; gap: 4px; padding: var(--afd-space-4) var(--afd-space-5); border: 2px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); cursor: pointer; text-align: center; font-family: var(--afd-font-body); font-size: var(--afd-fs-body); transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.afd-quiz-option:hover { border-color: var(--afd-navy); transform: translateY(-2px); box-shadow: var(--afd-shadow-sm); }
.afd-quiz-option--selected { border-color: var(--afd-accent); background: var(--afd-accent-soft); }
.afd-quiz-option__label { display: block; font-weight: 700; color: var(--afd-navy); }
.afd-quiz-option__desc { display: block; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
/* Mobil: navigationen ligger fast i bunden (forlaeggets moenster, mobile-first). */
.afd-quiz-nav { position: sticky; bottom: 0; z-index: var(--afd-z-sticky); display: flex; align-items: center; justify-content: space-between; gap: var(--afd-space-3); margin-top: var(--afd-space-5); padding: var(--afd-space-3) var(--afd-space-4); background: var(--afd-bg); border-top: 1px solid var(--afd-border); box-shadow: var(--afd-shadow-sm); border-radius: var(--afd-radius-md) var(--afd-radius-md) 0 0; }
.afd-quiz-nav__back { padding: 10px 16px; border: 0; border-radius: var(--afd-radius-md); background: var(--afd-bg-alt); color: var(--afd-text-muted); font: 600 var(--afd-fs-small) var(--afd-font-heading); cursor: pointer; }
.afd-quiz-nav__back:hover { color: var(--afd-navy); }
.afd-quiz-nav__next { flex: 1; padding: 12px 24px; border: 0; border-radius: var(--afd-radius-md); background: var(--afd-accent); color: #fff; font: 700 var(--afd-fs-small) var(--afd-font-heading); cursor: pointer; transition: background .15s ease; }
.afd-quiz-nav__next:hover { background: var(--afd-accent-hover); }
.afd-quiz-nav__next:disabled { opacity: .35; cursor: not-allowed; }
.afd-quiz-result { display: none; max-width: 980px; margin: 0 auto var(--afd-section-gap); text-align: center; }
.afd-quiz-result--visible { display: block; }
.afd-quiz-result__badge { display: inline-block; margin-bottom: var(--afd-space-3); padding: 8px 16px; border: 1px solid var(--afd-accent); border-radius: 999px; background: var(--afd-accent-soft); color: var(--afd-accent-hover); font: 600 .74rem var(--afd-font-heading); }
.afd-quiz-result__text { max-width: 640px; margin: 0 auto var(--afd-space-6); color: var(--afd-text-muted); }
.afd-quiz-result__grid, .afd-quiz-result__more { display: grid; gap: var(--afd-space-4); margin-bottom: var(--afd-space-4); text-align: left; }
.afd-quiz-result__more { display: none; }
.afd-quiz-result__more--visible { display: grid; }
.afd-quiz-result__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--afd-space-3); margin-bottom: var(--afd-space-3); }
.afd-quiz-result__restart { border: 0; background: none; color: var(--afd-text-muted); font: 600 var(--afd-fs-small) var(--afd-font-body); cursor: pointer; text-decoration: underline; }
.afd-quiz-result__restart:hover { color: var(--afd-navy); }
.afd-quiz-hit { display: flex; flex-direction: column; }
.afd-quiz-hit__facets { margin-top: var(--afd-space-1); color: var(--afd-text-muted); font-size: .72rem; }
.afd-quiz-hit__facets span { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: var(--afd-success-soft); color: var(--afd-success); font-weight: 600; }
/* CTA-moduler paa produkt-/artikelsider */
.afd-quiz-cta { margin-block: var(--afd-section-gap); }
.afd-quiz-cta--inline { margin-block: var(--afd-space-6); }

/* ---------- Hero-stats (live, aerlige tal; NEMMAND-moensteret) ---------- */
.afd-hero__stats { display: flex; flex-wrap: nowrap; gap: var(--afd-space-5); margin-top: var(--afd-space-5); }
.afd-hero__stat { min-width: 0; }
.afd-hero__stat-tal { display: block; font-family: var(--afd-font-heading); font-weight: 700; font-size: 1.35rem; color: var(--afd-accent); line-height: 1.2; }
.afd-hero__stat-label { display: block; font-size: var(--afd-fs-small); color: var(--afd-text-muted); }

/* ---------- Scroll-raekke: mobil = snap-karrusel, >=600px = grid ---------- */
.afd-grid--scroll { display: flex; flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: var(--afd-space-2); }
.afd-grid--scroll::-webkit-scrollbar { display: none; }
.afd-grid--scroll > * { flex: 0 0 72%; max-width: 280px; scroll-snap-align: start; }

/* ---------- Produktkatalog og tilbud (NEMMAND/FindEROTIK-port) ---------- */
.afd-catalog-hero { display: grid; gap: var(--afd-space-6); margin: var(--afd-space-3) 0 var(--afd-space-5); padding: 30px 22px; overflow: hidden; border: 1px solid var(--afd-border); border-radius: 22px; background: linear-gradient(135deg,#fff 0%,#FFF8EF 100%); box-shadow: var(--afd-shadow-sm); }
.afd-catalog-hero--deals { background: radial-gradient(circle at 92% 12%,rgba(240,144,14,.18),transparent 36%),linear-gradient(140deg,#FFF9F2,#fff); }
.afd-catalog-hero--solo { grid-template-columns: minmax(0,1fr); }
.afd-catalog-hero h1 { max-width: 720px; font-size: clamp(2rem,7vw,3.4rem); letter-spacing: -.035em; }
.afd-catalog-hero p { max-width: 720px; margin: 0; color: var(--afd-text-muted); }
.afd-catalog-hero .afd-disclosure { margin-top: var(--afd-space-4); font-size: .72rem; }
.afd-catalog-hero__copy { min-width: 0; }
.afd-catalog-hero-search-wrap { width: 100%; max-width: 650px; margin-top: var(--afd-space-5); }
.afd-catalog-hero-search { width: 100%; max-width: none; box-sizing: border-box; border: 1px solid rgba(20,51,92,.08); }
.afd-catalog-hero-search:focus-within { box-shadow: 0 10px 32px rgba(14,39,71,.16), 0 0 0 3px rgba(240,144,14,.13); }
.afd-catalog-hero-search .afd-home-search__icon { flex: 0 0 34px; pointer-events: none; }
.afd-catalog-hero-search .afd-home-search__icon svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.afd-catalog-hero-search input[type="search"] { min-width: 0; }
.afd-catalog-hero-search button { flex: 0 0 auto; }
.afd-catalog-hero-search .afd-home-search__arrow { font-size: 1rem; line-height: 1; }
.afd-catalog-hero-search__clear { display: inline-flex; margin: 8px 6px 0; color: var(--afd-accent-hover); font-size: .7rem; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.afd-catalog-hero-search__clear:hover { color: var(--afd-navy); }
.afd-catalog-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.afd-catalog-stats span { display: grid; align-content: center; min-width: 0; min-height: 82px; padding: 12px 8px; border: 1px solid rgba(20,51,92,.1); border-radius: 12px; background: rgba(255,255,255,.82); color: var(--afd-text-muted); font-size: .65rem; line-height: 1.25; text-align: center; }
.afd-catalog-stats strong { display: block; margin-bottom: 3px; color: var(--afd-navy); font: 800 .9rem/1.15 var(--afd-font-heading); }
.afd-catalog-layout { display: grid; gap: var(--afd-space-5); margin-bottom: var(--afd-section-gap); }
.afd-catalog-sidebar { display: none; }
.afd-catalog-results { min-width: 0; }
.afd-catalog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.afd-catalog-toolbar > div { display: grid; color: var(--afd-text-muted); font-size: .75rem; line-height: 1.25; }
.afd-catalog-toolbar strong { color: var(--afd-navy); font-size: .95rem; }
.afd-catalog-sort { display: flex; align-items: center; gap: 7px; }
.afd-catalog-sort label { display: none; font-size: .75rem; color: var(--afd-text-muted); }
/* Egen chevron (appearance:none) saa kontrollen tydeligt LIGNER en dropdown paa
   alle platforme, ikke mindst mobil hvor "Sortér"-labelen er skjult. */
.afd-catalog-sort select { min-height: 44px; max-width: 165px; padding: 8px 34px 8px 12px; border: 1px solid var(--afd-border); border-radius: 10px; color: var(--afd-navy); font: 600 .75rem var(--afd-font-body); -webkit-appearance: none; appearance: none; background-color: #fff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2314335c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 12px; cursor: pointer; }
/* Mobil: ALTID 2 produkter pr. raekke (ejer-krav 2026-07-20), samme lodrette
   kortstil som forsidens baand. Billede i toppen, pris under titlen, CTA pinnet
   til bunden saa alle kort staar lige (flex-stretch). "Til butik" paa EN linje. */
.afd-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.afd-catalog-grid .afd-card--product { display: flex; min-width: 0; flex-direction: column; }
.afd-catalog-grid .afd-card__img { height: auto; min-height: 0; aspect-ratio: 1 / 1; padding: 12px; border-right: 0; border-bottom: 1px solid var(--afd-border); }
.afd-catalog-grid .afd-card__img img { width: 100%; height: 100%; object-fit: contain; }
.afd-catalog-grid .afd-card__body { min-height: 0; padding: 12px; }
.afd-catalog-grid .afd-card__title { display: -webkit-box; min-height: 3.4em; overflow: hidden; font-size: .76rem; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.afd-catalog-grid .afd-card__brand,.afd-catalog-grid .afd-card__meta { font-size: .62rem; }
.afd-catalog-grid .afd-card__price { font-size: .98rem; }
.afd-catalog-grid .afd-card__footer { margin-top: 8px; padding-top: 0; }
.afd-catalog-grid .afd-card__cta { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 46px; margin-top: auto; padding: 9px 6px; font-size: .74rem; }
.afd-catalog-grid .afd-card__cta .afd-card__merchant,
.afd-catalog-grid .afd-card__cta > span:last-child { display: none; }
.afd-catalog-grid .afd-card__cta > span:not(.afd-card__merchant) { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.afd-mobile-filters { margin-bottom: 14px; border: 1px solid var(--afd-border); border-radius: 14px; background: #fff; box-shadow: var(--afd-shadow-sm); }
.afd-mobile-filters > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; cursor: pointer; color: var(--afd-navy); font: 700 .82rem var(--afd-font-heading); list-style: none; }
.afd-mobile-filters > summary::-webkit-details-marker { display: none; }
.afd-mobile-filters > summary span { color: var(--afd-text-muted); font: 500 .68rem var(--afd-font-body); }
.afd-filters { padding: 16px; border: 1px solid var(--afd-border); border-radius: 16px; background: #fff; }
.afd-filters--mobile { border: 0; border-top: 1px solid var(--afd-border); border-radius: 0 0 14px 14px; }
.afd-filters__head { display: flex; align-items: center; gap: 8px; padding-bottom: 14px; color: var(--afd-navy); }
.afd-filters__head strong { font: 700 1rem var(--afd-font-heading); }
.afd-filters__head a { margin-left: auto; color: var(--afd-accent-hover); font-size: .72rem; font-weight: 700; }
.afd-filter-search label,.afd-price-fields label { display: grid; gap: 6px; color: var(--afd-text-muted); font-size: .7rem; }
.afd-filter-search input,.afd-price-fields input { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--afd-border); border-radius: 8px; background: #fff; font: 500 .78rem var(--afd-font-body); box-sizing: border-box; }
.afd-filter-group { margin: 0; padding: 14px 0; border: 0; border-bottom: 1px solid var(--afd-border); }
.afd-filter-group legend { width: 100%; padding: 0; color: var(--afd-navy); font: 700 .78rem var(--afd-font-heading); }
.afd-filter-options { display: grid; gap: 9px; margin-top: 8px; }
/* Mobil-accordion: filtergrupper som <details>, kun aaben gruppe vises udfoldet.
   Chevron i summary signalerer at gruppen kan foldes ud/ind. */
.afd-filter-group--acc { padding: 0; }
.afd-filter-group--acc > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 2px; cursor: pointer; color: var(--afd-navy); font: 700 .78rem var(--afd-font-heading); list-style: none; }
.afd-filter-group--acc > summary::-webkit-details-marker { display: none; }
.afd-filter-group--acc > summary::after { content: ""; width: 8px; height: 8px; margin-right: 3px; border-right: 2px solid var(--afd-text-muted); border-bottom: 2px solid var(--afd-text-muted); transform: rotate(45deg); transition: transform .18s ease; }
.afd-filter-group--acc[open] > summary::after { transform: rotate(-135deg); }
.afd-filter-group--acc .afd-filter-options { margin-top: 0; padding-bottom: 14px; }
.afd-filter-group--acc .afd-price-fields { padding-bottom: 14px; }
.afd-filter-options label { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: 8px; margin: 0; color: var(--afd-navy); font-size: .73rem; cursor: pointer; }
.afd-filter-options input { width: 18px; height: 18px; margin: 0; accent-color: var(--afd-accent); }
.afd-filter-options small { color: var(--afd-text-muted); font-size: .65rem; }
.afd-price-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.afd-filters__submit { width: 100%; margin-top: 16px; }

/* ---------- Sammenligning ---------- */
.afd-compare-hero { margin: var(--afd-space-3) 0 var(--afd-space-5); padding: 30px 22px; border-radius: 22px; background: radial-gradient(circle at 90% 15%,rgba(240,144,14,.18),transparent 34%),var(--afd-navy-grad); color: #fff; }
.afd-compare-hero h1 { color: #fff; font-size: clamp(2rem,7vw,3.35rem); }
.afd-compare-hero p { max-width: 760px; color: rgba(255,255,255,.76); }
.afd-compare-hero .afd-disclosure { color: rgba(255,255,255,.62); }
.afd-compare-tabs { display: flex; width: fit-content; margin-bottom: 14px; padding: 4px; border: 1px solid var(--afd-border); border-radius: 12px; background: #fff; }
.afd-compare-tabs a { padding: 9px 16px; border-radius: 9px; color: var(--afd-text-muted); font: 700 .76rem var(--afd-font-heading); }
.afd-compare-tabs a:hover { text-decoration: none; }
.afd-compare-tabs a.is-active { background: var(--afd-navy); color: #fff; }
.afd-compare-form { display: grid; gap: 12px; padding: 18px; border: 1px solid var(--afd-border); border-radius: 16px; background: #fff; box-shadow: var(--afd-shadow-sm); }
.afd-compare-form label { display: grid; gap: 6px; color: var(--afd-navy); font: 700 .72rem var(--afd-font-heading); }
.afd-compare-form select { width: 100%; min-height: 48px; padding: 9px 12px; border: 1px solid var(--afd-border); border-radius: 9px; background: #fff; color: var(--afd-text); font-family: var(--afd-font-body); }
.afd-compare-form__vs { display: grid; place-items: center; width: 38px; height: 38px; margin-inline: auto; border-radius: 50%; background: var(--afd-accent-soft); color: var(--afd-accent-hover); font: 800 .7rem var(--afd-font-heading); }
.afd-compare-result { margin-top: var(--afd-space-8); }
.afd-compare-table { overflow: hidden; border: 1px solid var(--afd-border); border-radius: 14px; background: #fff; }
.afd-compare-table__row { display: grid; grid-template-columns: minmax(90px,.7fr) repeat(2,minmax(0,1fr)); }
.afd-compare-table__row > * { min-width: 0; padding: 12px 8px; border-bottom: 1px solid var(--afd-border); overflow-wrap: anywhere; font-size: .68rem; }
.afd-compare-table__row > * + * { border-left: 1px solid var(--afd-border); }
.afd-compare-table__row:last-child > * { border-bottom: 0; }
.afd-compare-table__head { background: var(--afd-bg-alt); color: var(--afd-navy); }
.afd-compare-products { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.afd-brand-compare { display: grid; gap: 16px; }
.afd-brand-compare__col { min-width: 0; padding: 18px; border: 1px solid var(--afd-border); border-radius: 16px; background: #fff; }
.afd-brand-compare__facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-bottom: 14px; }
.afd-brand-compare__facts span { padding: 9px 5px; border-radius: 9px; background: var(--afd-bg-alt); color: var(--afd-text-muted); font-size: .58rem; text-align: center; }
.afd-brand-compare__facts strong { display: block; color: var(--afd-navy); font: 700 .72rem var(--afd-font-heading); }
.afd-brand-compare .afd-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.afd-compare-help { display: grid; gap: 10px; margin: var(--afd-section-gap) 0; }
.afd-compare-help article { padding: 18px; border: 1px solid var(--afd-border); border-radius: 14px; background: #fff; }
.afd-compare-help article > strong { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 10px; border-radius: 50%; background: var(--afd-accent-soft); color: var(--afd-accent-hover); font: 800 .75rem var(--afd-font-heading); }
.afd-compare-help h2 { font-size: 1rem; }
.afd-compare-help p { margin: 0; color: var(--afd-text-muted); font-size: .78rem; }

/* ---------- Informationssider ---------- */
.afd-info-page { max-width: 980px; margin: 10px auto var(--afd-section-gap); }
.afd-info-page > header { padding: 30px 22px; border: 1px solid var(--afd-border); border-radius: 22px; background: linear-gradient(135deg,#fff,#FFF8EF); }
.afd-info-page > header h1 { max-width: 760px; font-size: clamp(2rem,7vw,3.45rem); }
.afd-info-page__lead { max-width: 760px; color: var(--afd-text-muted); font-size: 1.05rem; }
.afd-info-page > section { margin-top: 16px; padding: 22px; border: 1px solid var(--afd-border); border-radius: 16px; background: #fff; }
.afd-info-mission { display: grid; gap: 18px; }
.afd-info-mission__badge { display: grid; place-items: center; align-content: center; min-height: 130px; border-radius: 14px; background: var(--afd-navy-grad); color: #fff; }
.afd-info-mission__badge strong { color: var(--afd-accent); font: 800 1.7rem var(--afd-font-heading); }
.afd-info-steps { display: grid; gap: 10px; }
.afd-info-steps article { padding: 16px; border-radius: 12px; background: var(--afd-bg-alt); }
.afd-info-steps article > strong { color: var(--afd-accent); font: 800 .75rem var(--afd-font-heading); }
.afd-info-steps h3 { margin-top: 8px; font-size: .95rem; }
.afd-info-steps p { margin: 0; color: var(--afd-text-muted); font-size: .78rem; }
.afd-info-principles ul { display: grid; gap: 10px; padding-left: 20px; }
.afd-info-contact { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
/* Navy-baggrund maa vinde over .afd-info-page > section (0,1,1) der ellers giver
   hvid boks + hvid tekst = usynlig indhold. Derfor (0,2,1)-selektor her. */
.afd-info-page > section.afd-info-contact { background: var(--afd-navy-grad); color: #fff; }
.afd-info-contact h2 { margin-top: 0; color: #fff; }
.afd-info-contact p { margin: 8px 0 0; color: rgba(255,255,255,.82); }
.afd-info-contact a { color: var(--afd-accent); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.afd-info-contact a:hover { color: #fff; }
/* Kontakt UDEN knap (fx annonceoplysning): enkelt kolonne. Uden denne flippede
   @900-reglen til to-kolonne space-between og efterlod et stort tomt felt til
   hoejre (kun eet barn). Hoejere specificitet (0,2,0) vinder ogsaa paa desktop. */
.afd-info-page .afd-info-contact--solo { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; }
.afd-info-contact--solo > div { max-width: 660px; }
.afd-info-contact--solo .afd-overline { color: var(--afd-accent); }

/* Bevaegelses-respekt: ingen lift/slide/puls for reduced motion. */
@media (prefers-reduced-motion: reduce) {
  a.afd-card, .afd-btn, .afd-section-head a, .afd-faq__chev, .afd-cta-main, .afd-slide-arrow, .afd-stickybar, .afd-guide-card, .afd-video__play { transition: none; }
  a.afd-card:hover, .afd-btn--primary:hover, .afd-section-head a:hover, .afd-cta-main:hover, .afd-guide-card:hover, .afd-video__facade:hover .afd-video__play, .afd-carousel-controls button:hover:not(:disabled) { transform: none; }
  .afd-phero__drop, .afd-cta-main__arrow, .afd-home-search__arrow, .afd-home-deal-promo__arrow, .afd-home-cta__arrow, .afd-explore__arrow { animation: none; }
}

/* ---------- Breakpoints: KUN 600/900/1200 (mobile-first) ---------- */
@media (min-width: 600px) {
	.afd-catalog-hero { grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr); align-items: center; padding: 38px 34px; }
	.afd-catalog-hero--solo { grid-template-columns: minmax(0,1fr); }
	.afd-catalog-stats { align-self: center; }
	.afd-catalog-stats span { min-height: 104px; padding: 14px 10px; }
	.afd-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
	.afd-catalog-grid .afd-card__body { padding: 16px; }
	.afd-catalog-grid .afd-card__title { font-size: .9rem; }
	.afd-catalog-grid .afd-card__price { font-size: 1.05rem; }
	.afd-catalog-grid .afd-card__cta { font-size: .82rem; }
	.afd-catalog-sort label { display: inline; }
	.afd-compare-form { grid-template-columns: minmax(0,1fr) 42px minmax(0,1fr); align-items: end; padding: 22px; }
	.afd-compare-form .afd-btn { grid-column: 1 / -1; justify-self: center; min-width: 220px; }
	.afd-compare-form__vs { margin-bottom: 5px; }
	.afd-compare-table__row > * { padding: 14px; font-size: .8rem; }
	.afd-compare-products { gap: 16px; }
	.afd-brand-compare { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.afd-compare-help,.afd-info-steps { grid-template-columns: repeat(3,minmax(0,1fr)); }
	.afd-info-mission { grid-template-columns: minmax(0,1.4fr) minmax(220px,.6fr); align-items: stretch; }
	.afd-info-contact { flex-direction: row; align-items: center; justify-content: space-between; }
	.afd-home-hero { min-height: 470px; display: grid; grid-template-areas: "content visual"; grid-template-columns: minmax(0,1.08fr) minmax(320px,.92fr); align-items: center; gap: 16px; padding: 38px 34px; }
	.afd-home-hero__content { display: block; grid-area: content; position: relative; z-index: 3; }
	body.afd-page .afd-home-hero h1 { font-size: clamp(2.5rem,5.5vw,4rem); }
	.afd-home-hero__content > p { max-width: 610px; font-size: 1rem; }
	.afd-home-search { margin-top: 24px; }
	.afd-home-benefits { margin-top: 18px; gap: 14px; }
	.afd-home-benefits b { font-size: .72rem; }
	.afd-home-benefits small { font-size: .62rem; }
	.afd-home-hero__visual { position: relative; grid-area: visual; width: 100%; height: 390px; right: auto; top: auto; margin: 0; }
	.afd-home-hero__pet--1 { width: 210px; height: 210px; left: 0; bottom: 16px; }
	.afd-home-hero__pet--2 { width: 170px; height: 170px; left: 35%; bottom: 30px; }
	.afd-home-hero__pet--3 { width: 130px; height: 130px; right: 0; bottom: 16px; }
	.afd-home-hero__claim { top: 42px; right: 4%; padding: 13px 18px; font-size: .76rem; }
	.afd-home-animal-nav { grid-auto-flow: unset; grid-auto-columns: auto; grid-template-columns: repeat(7,minmax(0,1fr)); overflow: visible; }
	.afd-home-deal-promo { flex-basis: 330px; }
	.afd-home-trust { grid-template-columns: .85fr 1.15fr; align-items: center; }
	.afd-home-trust .afd-trust { grid-template-columns: 1fr 1fr; }
	.afd-home-how__steps { grid-template-columns: repeat(3,1fr); gap: 14px; }
	.afd-home-how__steps > div { display: block; padding: 8px 4px; background: transparent; text-align: center; }
	.afd-home-how__steps > div + div::before { display: block; content: ""; position: absolute; width: 32%; height: 1px; left: -20%; top: 29px; border-top: 2px dotted var(--afd-border); }
	.afd-home-how__steps span { width: 52px; height: 52px; margin: 0 auto 10px; }
	.afd-home-how__steps b { font-size: .68rem; }
	.afd-home-how__steps p { margin-top: 5px; font-size: .6rem; }
	.afd-home-cta { display: flex; align-items: center; justify-content: space-between; }
	.afd-home-cta .afd-btn { width: auto; min-width: 220px; }
  .afd-split { grid-template-columns: 1fr 1fr; }
  .afd-grid--scroll { display: grid; overflow-x: visible; padding-bottom: 0; }
  .afd-grid--scroll > * { flex: none; max-width: none; }
  .afd-stats { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
  .afd-gallery { grid-template-columns: 1fr 1fr; }
  .afd-trust { grid-template-columns: 1fr 1fr; }
  .afd-proscons__grid { grid-template-columns: 1fr 1fr; }
  .afd-proscons__col li { font-size: .9rem; }
  .afd-proscons__col ul { gap: 12px; }
  .afd-quiz-options { grid-template-columns: 1fr 1fr; }
  .afd-quizhub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .afd-quizhub-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .afd-quiz-result__grid, .afd-quiz-result__more { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .afd-quizhub-hero, .afd-quiz-hero { padding: 52px 38px; }
  .afd-offers__row { grid-template-columns: 48px minmax(0, 1fr) auto auto; gap: var(--afd-space-4); padding: 18px var(--afd-space-5); border-radius: 12px; }
  .afd-offers__info { display: flex; }
  .afd-offers__logo { width: 48px; height: 48px; border-radius: 10px; font-size: 12px; }
  .afd-offers__price { font-size: 22px; }
  .afd-offers__old { font-size: 12px; }
  .afd-pricecard__price { font-size: 36px; }
  .afd-trustbar { gap: var(--afd-space-3) var(--afd-space-6); padding: var(--afd-space-5) var(--afd-space-8); }
  .afd-trustbar__item { font-size: 12px; gap: 8px; }
  .afd-trustbar__item svg { width: 14px; height: 14px; }
  .afd-catcta { flex-direction: row; align-items: center; justify-content: space-between; text-align: left; padding: var(--afd-space-6) 28px; }
  .afd-stickybar { padding: 12px var(--afd-space-6); gap: var(--afd-space-4); }
  .afd-stickybar__amount { font-size: 20px; }
  .afd-share-btn { width: 40px; height: 40px; }
  .afd-tabs__nav { display: flex; flex-wrap: wrap; }
  .afd-tabs__btn { padding: 12px 16px; font-size: 13px; }
  .afd-footlinks__grid { grid-template-columns: 1fr 1fr; }
  .afd-footlinks ul { grid-template-columns: 1fr 1fr; }
  .afd-how { grid-template-columns: repeat(3, 1fr); }
  .afd-hero-animals__links { justify-content: center; }
  .afd-history__head { flex-direction: row; align-items: flex-start; justify-content: space-between; }
  .afd-history__period { flex: 0 0 auto; }
  .afd-history__stats { gap: var(--afd-space-2); }
  .afd-history__stats > div { padding: 14px 16px; }
  .afd-history__stats strong { font-size: clamp(1.35rem, 2.4vw, 1.7rem); }
  .afd-history__stats span { margin-top: 6px; font-size: .74rem; }
  .afd-explore__grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 900px) {
	.afd-quizhub-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.afd-quiz-options--wide { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.afd-quiz-result__grid, .afd-quiz-result__more { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	/* Desktop: navigationen skal ikke laengere klaebe til bunden. */
	.afd-quiz-nav { position: static; padding: 0; margin-top: var(--afd-space-6); background: transparent; border-top: 0; box-shadow: none; }
	.afd-quiz-nav__next { flex: 0 0 auto; min-width: 180px; }
	.afd-mobile-filters { display: none; }
	.afd-catalog-layout { grid-template-columns: 280px minmax(0,1fr); align-items: start; gap: 28px; }
	.afd-catalog-sidebar { display: block; position: sticky; top: 24px; }
	.afd-catalog-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
	.afd-catalog-grid .afd-card__img { padding: 18px; }
	.afd-catalog-grid .afd-card__body { min-height: 210px; }
	.afd-catalog-grid .afd-card__title { font-size: .95rem; }
	.afd-compare-form { grid-template-columns: minmax(0,1fr) 48px minmax(0,1fr) auto; }
	.afd-compare-form .afd-btn { grid-column: auto; min-width: 160px; }
	.afd-compare-form__vs { margin-bottom: 5px; }
	.afd-compare-table__row { grid-template-columns: minmax(150px,.6fr) repeat(2,minmax(0,1fr)); }
	.afd-home-hero { min-height: 500px; padding: 44px 54px; }
	body.afd-page .afd-home-hero h1 { font-size: clamp(3.15rem,4.2vw,4.5rem); }
	.afd-home-hero__eyebrow { font-size: .72rem; }
	.afd-home-hero__content > p { font-size: 1.08rem; }
	.afd-home-search button { min-width: 94px; }
	.afd-home-hero__pet--1 { width: 240px; height: 240px; }
	.afd-home-hero__pet--2 { width: 195px; height: 195px; }
	.afd-home-hero__pet--3 { width: 150px; height: 150px; }
	.afd-home-animal-nav { gap: 12px; margin-top: 12px; }
	.afd-home-animal-nav a { grid-template-columns: 68px minmax(0,1fr); grid-template-rows: auto auto; justify-items: start; align-items: center; min-height: 82px; padding: 7px 12px 7px 7px; }
	.afd-home-animal-nav__media { grid-row: 1 / 3; width: 66px; height: 66px; }
	.afd-home-animal-nav a strong { margin: 0; font-size: .78rem; text-align: left; }
	.afd-home-animal-nav a small { display: block; }
	/* Desktop: deal-baandet er ogsaa en vandret karrusel (promo + 18 kort scroller). */
	.afd-home-product-rail { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; }
	.afd-home-deal-promo { min-height: 270px; flex: 0 0 320px; }
	.afd-home-product-rail__track { display: flex; gap: 14px; flex: 0 0 auto; }
	.afd-home-product-rail__track .afd-card--product { flex: 0 0 212px; }
	.afd-home-product-rail .afd-card--product .afd-card__img { height: 175px; padding: 18px; }
	.afd-home-product-rail .afd-card__body { min-height: 200px; padding: 16px; }
	.afd-home-product-rail .afd-card__title { font-size: .82rem; }
	.afd-home-product-rail .afd-card__brand, .afd-home-product-rail .afd-card__meta { font-size: .66rem; }
	.afd-home-product-rail .afd-card__price { font-size: .88rem; }
	.afd-home-product-rail .afd-card__cta { font-size: .84rem; }
	.afd-home-how, .afd-home-popular, .afd-home-trust, .afd-home-cta, .afd-home-rated { margin-top: 18px; }
	.afd-home-how { padding: 20px 28px 24px; }
	.afd-home-how__steps { gap: 28px; }
	.afd-home-how__steps span { width: 58px; height: 58px; }
	.afd-home-how__steps b { font-size: .74rem; }
	.afd-home-how__steps p { max-width: 190px; margin-inline: auto; font-size: .64rem; }
	.afd-home-popular { padding: 20px; }
	.afd-home-popular__track { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); overflow: visible; }
	.afd-home-popular__track .afd-card--product { min-width: 0; display: grid; grid-template-columns: 42% minmax(0,1fr); }
	.afd-home-popular .afd-card__img { aspect-ratio: auto; border-bottom: 0; border-right: 1px solid var(--afd-border); }
	.afd-home-popular .afd-card__body { min-height: 150px; }
	.afd-home-popular .afd-card__cta { display: none; } /* desktop-grid forbliver kompakt uden CTA */
	.afd-home-trust { padding: 28px 34px; }
	.afd-home-trust .afd-trust { grid-template-columns: repeat(4,1fr); }
	.afd-home-trust .afd-trust__text { display: block; font-size: .62rem; }
	.afd-home-cta { padding: 28px 34px; }
  .afd-container { padding-inline: var(--afd-page-gutter-lg); }
  .afd-band { padding-block: var(--afd-section-gap-lg); }
  .afd-listing-hero { padding: 42px 48px; margin-bottom: var(--afd-space-12); }
  .afd-grid { gap: var(--afd-space-6); }
  .afd-hero { padding: 68px 40px; }
  .afd-animal-showcase { padding-inline: var(--afd-space-8); }
  .afd-home-guides { grid-template-columns: repeat(3, 1fr); }
  .afd-gallery { grid-template-columns: repeat(3, 1fr); }
  .afd-home-guide { display: block; }
  .afd-home-guide__media { min-height: 190px; height: 190px; }
  .afd-home-guide__body { min-height: 170px; box-sizing: border-box; }
  .afd-trust { grid-template-columns: repeat(4, 1fr); }
  .afd-psec { margin-bottom: var(--afd-space-12); }
  .afd-product-hero { grid-template-columns: 1.1fr .9fr; gap: 40px; margin-bottom: var(--afd-space-12); }
  .afd-phero__media { border-radius: 20px; padding: var(--afd-space-6); min-height: 460px; }
  .afd-phero__imgbox { width: 88%; border-radius: 12px; }
  .afd-phero__drop { width: 76px; height: 76px; top: 12px; right: 12px; }
  .afd-phero__drop b { font-size: 20px; }
  .afd-phero__drop small { font-size: 9px; }
  .afd-phero__info h1 { font-size: 28px; }
  .afd-phero__brand, .afd-phero__cat { font-size: 11px; }
  .afd-phero__updated { font-size: 11px; }
  .afd-icon-grid { margin-top: auto; }
  .afd-pricecard { border-radius: 16px; padding: var(--afd-space-6); }
  .afd-pricecard__price { font-size: 42px; }
  .afd-pricecard__old { font-size: 18px; }
  .afd-whobox { border-radius: 16px; padding: 28px; }
  /* 4 hele kort + et halvt kig til hoejre = tydelig karrusel (audit 2026-07-21).
     Fade skjules paa desktop saa det halve kig staar skarpt; pilene guider. */
  .afd-slider__track > * { width: calc(22.2% - 11px); max-width: none; }
  .afd-slider::after { display: none; }
  .afd-slide-arrow { display: flex; }
  .afd-history { padding: var(--afd-space-8); }
  .afd-explore { grid-template-columns: 240px minmax(0,1fr); align-items: start; padding: var(--afd-space-8); }
}
@media (min-width: 1200px) {
  .afd-hero--home { min-height: 560px; display: grid; place-items: center; }
}


/* ---------- Senior UI/UX-overhaling 2026-07-15 ---------- */
.afd-page h1, .afd-page h2 { text-wrap: balance; letter-spacing: -.025em; }
.afd-page p { text-wrap: pretty; }
.afd-ui-icon { display: block; width: 100%; height: 100%; object-fit: contain; }
.afd-card { border-color: #E3E9F0; box-shadow: 0 8px 28px rgba(14,39,71,.065); }
.afd-card--product { border-radius: 18px; }
.afd-card--product .afd-card__img { padding: clamp(14px,2vw,24px); background: linear-gradient(145deg,#fff,#FAFBFC); }
.afd-card__body { padding: 18px; }
.afd-btn { border-radius: 12px; }
.afd-btn--primary { box-shadow: 0 7px 20px rgba(214,125,8,.24); }
.afd-section-head { align-items: end; }

/* Hero: det godkendte samlede asset bærer højresiden uden kunstige billedkort. */
.afd-home-hero { grid-template-areas: "eyebrow" "title" "lead" "visual" "search" "benefits"; padding: 32px 20px 24px; border-radius: 28px; background: linear-gradient(118deg,#FFF8F1 0%,#FFFCF7 56%,#EFF6FB 100%); }
.afd-home-hero__visual { width: min(620px,100%); height: auto; aspect-ratio: 5 / 4; margin: 18px auto 20px; display: grid; place-items: center; }
.afd-home-hero__image { position: relative; z-index: 2; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 20px 30px rgba(14,39,71,.12)); }
.afd-home-search { min-height: 56px; border: 1px solid rgba(20,51,92,.1); }
.afd-home-search__icon { width: 38px; height: 38px; padding: 8px; box-sizing: border-box; }
.afd-home-search__icon .afd-ui-icon { width: 22px; height: 22px; }
.afd-home-benefits { gap: 12px; }
.afd-home-benefits li { grid-template-columns: 38px minmax(0,1fr); column-gap: 9px; }
.afd-home-benefits li > span { width: 38px; height: 38px; padding: 6px; box-sizing: border-box; border-radius: 12px; background: rgba(255,255,255,.72); }
.afd-home-benefits b { font-size: .72rem; }
.afd-home-benefits small { font-size: .62rem; }

/* Kategorier: en ægte, tastaturbetjent scroll-snap-karrusel på alle bredder. */
.afd-home-animal-carousel { position: relative; margin-top: 28px; }
.afd-home-animal-carousel__head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.afd-home-animal-carousel__head h2 { margin: 0; font-size: clamp(1.35rem,2.4vw,2rem); }
.afd-carousel-controls { display: flex; gap: 8px; opacity: 0; pointer-events: none; transition: opacity .18s ease; }
/* Pilene vises naar en hvilken som helst karrusel overflower (JS saetter
   .has-overflow). Baade kategori-karrusellen OG "Populaere" (ejer-krav 2026-07-20:
   populaere manglede pile paa desktop). */
.afd-home-animal-carousel.has-overflow .afd-carousel-controls,
.afd-home-popular.has-overflow .afd-carousel-controls { opacity: 1; pointer-events: auto; }
/* Karrusel-navigation: runde orange knapper med hvid SVG-chevron.
   box-sizing+flex+aspect-ratio laaser dem til perfekte cirkler (Astra-padding
   straekte dem ellers til ovaler). */
.afd-carousel-controls button { width: 44px; height: 44px; flex: 0 0 auto; box-sizing: border-box; padding: 0; aspect-ratio: 1; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--afd-accent); color: #fff; cursor: pointer; box-shadow: 0 6px 16px rgba(240,144,14,.32); transition: background .18s ease, transform .18s ease, box-shadow .18s ease; }
.afd-carousel-controls button .afd-carousel-chevron { width: 20px; height: 20px; }
.afd-carousel-controls button:hover:not(:disabled) { background: var(--afd-accent-hover); transform: translateY(-1px); box-shadow: 0 10px 22px rgba(240,144,14,.42); }
.afd-carousel-controls button:focus-visible:not(:disabled) { background: var(--afd-accent-hover); }
.afd-carousel-controls button:disabled { opacity: .32; cursor: default; box-shadow: none; }
.afd-home-animal-nav { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(112px,25vw,172px); grid-template-columns: none; gap: 12px; margin: 0; padding: 8px 2px 14px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scroll-padding-inline: 2px; scrollbar-width: thin; }
.afd-home-animal-nav a { scroll-snap-align: start; min-height: 148px; grid-template-columns: 1fr; grid-template-rows: 78px auto auto; justify-items: center; align-content: start; padding: 10px 10px 14px; border-radius: 18px; transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.afd-home-animal-nav__media { grid-row: auto; width: 76px; height: 76px; padding: 5px; }
.afd-home-animal-nav a strong { margin-top: 7px; font-size: .82rem; text-align: center; }
.afd-home-animal-nav a small { display: block; margin-top: 4px; font-size: .66rem; text-align: center; }

/* Godkendte uploadikoner i tillids- og produktflader. */
.afd-trust__icon { padding: 8px; box-sizing: border-box; background: #FFF8EE; }
.afd-trust__icon .afd-ui-icon, .afd-ig__ico .afd-ui-icon { width: 100%; height: 100%; }
.afd-ig__ico { padding: 5px; box-sizing: border-box; }

/* Produktsiden: produktet står på en rolig stage, ikke i en massiv mørk boks. */
.afd-product-hero { align-items: start; gap: clamp(24px,4vw,52px); }
.afd-phero__media { min-height: 0; align-self: start; padding: clamp(18px,3vw,34px); border: 1px solid #E0E7EF; border-radius: 24px; background: radial-gradient(circle at 18% 12%,#FFF3E2,transparent 28%),linear-gradient(145deg,#F7FAFC,#EEF4F8); box-shadow: 0 14px 40px rgba(14,39,71,.08); }
.afd-phero__media::after { display: none; }
.afd-phero__imgbox { width: 100%; min-height: 280px; padding: 0; border-radius: 16px; background: transparent; box-shadow: none; }
.afd-phero__imgbox img { width: 100%; height: auto; max-height: 500px; aspect-ratio: 1 / 1; object-fit: contain; filter: drop-shadow(0 14px 22px rgba(14,39,71,.1)); }
.afd-phero__drop { top: 14px; right: 14px; animation: none; box-shadow: 0 10px 25px rgba(214,125,8,.3); }
.afd-phero__info { padding-top: 4px; }
.afd-phero__info h1 { font-size: clamp(1.65rem,3.2vw,2.65rem); line-height: 1.12; }
.afd-phero__desc { font-size: 1rem; line-height: 1.7; }
.afd-icon-grid { gap: 10px; }
.afd-ig__item { min-height: 48px; border-radius: 12px; background: #fff; }
.afd-pricecard { border-radius: 20px; box-shadow: 0 16px 34px rgba(14,39,71,.18); }
.afd-variants__button { min-height: 58px; border-radius: 14px; }
.afd-offers__row { border-radius: 14px; }
.afd-psec > :where(.afd-history,.afd-tabs,.afd-proscons,.afd-review,.afd-whobox,.afd-faq,.afd-explore) { scroll-margin-top: 24px; }
/* Ens afstand mellem ALLE produktsektioner: den enkelte sektion styrer aldrig
   sin egen lodrette margin (nogle komponenter, fx proscons/faq, satte selv
   margin-block og gav skaeve mellemrum). Kun .afd-psec bestemmer afstanden. */
.afd-psec > :where(.afd-history,.afd-tabs,.afd-proscons,.afd-review,.afd-whobox,.afd-faq,.afd-explore,.afd-slider) { margin-block: 0; }

@media (min-width: 600px) {
  .afd-home-hero { grid-template-areas: "content visual"; grid-template-columns: minmax(0,1.03fr) minmax(320px,.97fr); gap: 28px; padding: 42px 38px; }
  .afd-home-hero__visual { height: auto; aspect-ratio: 5 / 4; margin: 0; }
  .afd-home-benefits li { grid-template-columns: 42px minmax(0,1fr); }
  .afd-home-benefits li > span { width: 42px; height: 42px; }
  .afd-home-animal-nav { grid-auto-columns: 156px; }
  .afd-phero__imgbox { min-height: 360px; }
}
@media (min-width: 900px) {
  .afd-home-hero { min-height: 520px; grid-template-columns: minmax(0,1.08fr) minmax(400px,.92fr); padding: 52px 58px; }
  .afd-home-hero__visual { height: auto; }
  .afd-home-animal-nav { grid-auto-columns: 180px; }
  .afd-product-hero { grid-template-columns: minmax(360px,.82fr) minmax(0,1.18fr); }
  .afd-phero__media { min-height: 0; position: sticky; top: 24px; }
  .afd-phero__imgbox { width: 100%; min-height: 420px; }
  .afd-phero__info h1 { font-size: clamp(2rem,2.7vw,2.85rem); }
}
@media (min-width: 1200px) {
  .afd-home-hero { padding-inline: 72px; }
  .afd-product-hero { grid-template-columns: minmax(420px,.78fr) minmax(0,1.22fr); }
}

/* ---------- Referencefinish: hero, prisblik og produkttop 2026-07-15 ---------- */
.afd-home-hero { isolation: isolate; border-color: #F0DFCF; background: radial-gradient(circle at 82% 32%,rgba(252,235,215,.7),transparent 28%),linear-gradient(122deg,#FFFBF6 0%,#FFFDF9 56%,#F8FBFD 100%); box-shadow: 0 18px 46px rgba(14,39,71,.08); }
.afd-home-hero__eyebrow { display: flex; align-items: center; gap: 10px; }
.afd-home-hero__eyebrow-icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; padding: 0; border-radius: 0; background: none; }
.afd-home-hero__eyebrow-icon .afd-ui-icon { width: 100%; height: 100%; }
.afd-home-hero__visual { overflow: hidden; border: 1px solid rgba(214,125,8,.08); border-radius: 26px; background: radial-gradient(circle at 52% 54%,#FFF9F0 0%,#F8EDE0 70%,#F9F4ED 100%); }
.afd-home-hero__image { transform: scale(1.02); }
.afd-home-search { background: rgba(255,255,255,.97); }
.afd-home-search button { gap: 8px; }
.afd-home-search__label { line-height: 1; white-space: nowrap; }
.afd-home-search__arrow { font-size: 18px; font-weight: 700; line-height: 1; transition: transform .2s ease; animation: afd-arrow-pulse 2s ease-in-out infinite; }
.afd-home-search button:hover .afd-home-search__arrow { animation: none; transform: translateX(3px); }
.afd-home-benefits { padding: 10px; border: 1px solid rgba(20,51,92,.08); border-radius: 16px; background: rgba(255,255,255,.72); box-shadow: 0 8px 24px rgba(14,39,71,.05); }

.afd-home-deal-promo { min-height: 390px; align-items: flex-start; padding: 28px 22px 0; background: radial-gradient(circle at 82% 78%,rgba(45,88,142,.55),transparent 36%),linear-gradient(158deg,#0A2D55,#123F73); box-shadow: 0 16px 36px rgba(14,39,71,.18); }
.afd-home-deal-promo::before { content: ""; position: absolute; width: 230px; height: 230px; right: -80px; bottom: -90px; border-radius: 50%; background: rgba(255,255,255,.035); }
.afd-home-deal-promo::after { width: 220px; height: 220px; right: -80px; bottom: -100px; }
.afd-home-deal-promo__copy { position: relative; z-index: 3; max-width: 220px; }
.afd-home-deal-promo h2 { max-width: 190px; margin-bottom: 8px; font-size: 1.7rem; line-height: 1.05; overflow-wrap: break-word; }
.afd-home-deal-promo p { max-width: 205px; margin-bottom: 18px; line-height: 1.55; }
.afd-home-deal-promo .afd-btn { min-height: 44px; padding: 12px 14px; font-size: .68rem; letter-spacing: .04em; }
.afd-home-deal-promo__icon { width: 52px; height: 52px; right: 20px; top: 20px; padding: 12px; border-radius: 16px; }
.afd-home-deal-promo__image { position: absolute; z-index: 2; width: 112%; max-width: none; height: 48%; left: -6%; bottom: -2px; object-fit: contain; object-position: center bottom; pointer-events: none; }

.afd-product-hero { margin-bottom: 22px; }
.afd-phero__media { display: block; overflow: visible; padding: 18px; border-color: #E3E9F0; border-radius: 22px; background: #fff; box-shadow: 0 10px 34px rgba(14,39,71,.06); }
.afd-phero__imgbox { min-height: 300px; overflow: hidden; border-radius: 16px; background: linear-gradient(145deg,#FFFFFF,#FCFDFE); }
.afd-phero__main-image { display: block; }
.afd-phero__imgbox .afd-phero__main-image { width: 100%; height: 100%; max-height: 470px; padding: 10px; box-sizing: border-box; object-fit: contain; filter: none; transition: opacity .18s ease; }
.afd-phero__gallery { display: grid; grid-auto-flow: column; grid-auto-columns: 76px; gap: 10px; margin-top: 14px; padding: 4px; overflow-x: auto; scrollbar-width: thin; }
/* Miniature: ALTID 2px kant (box-sizing: border-box), saa den aktive blot
   skifter FARVE (ingen ring/loft, ingen layout-shift, intet klip fra galleriets
   overflow). Ren, ens orange kant hele vejen rundt (audit 2026-07-21). */
.afd-phero__thumb { width: 76px; height: 76px; box-sizing: border-box; display: grid; place-items: center; padding: 6px; border: 1.5px solid #E3E9F0; border-radius: 12px; background: #fff; cursor: pointer; overflow: hidden; transition: border-color .18s ease; }
.afd-phero__thumb:hover { border-color: rgba(240,144,14,.55); }
/* Aktiv-ring som INSET box-shadow (tegnes inde i boksen) + border-farve. Den
   ydre border kunne klippes af galleriets overflow-x:auto (kanten forsvandt paa
   de yderste/aktive miniaturer); en inset-ring kan ALDRIG klippes. */
.afd-phero__thumb.is-active { border-color: var(--afd-accent); box-shadow: inset 0 0 0 2px var(--afd-accent); }
.afd-phero__thumb img { display: block; width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; }
.afd-phero__drop { top: 16px; right: 16px; }
.afd-phero__info { gap: 0; }
.afd-phero__meta { margin-bottom: 10px; }
.afd-phero__info h1 { margin-bottom: 14px; color: var(--afd-navy-deep); letter-spacing: -.035em; }
.afd-phero__desc { margin-bottom: 8px; color: #526173; }
.afd-readmore { margin-bottom: 18px; color: var(--afd-navy); text-decoration: none; }
.afd-icon-grid { margin-top: 12px; }
.afd-pricecard { margin-top: 12px; padding: 22px; background: radial-gradient(circle at 100% 0,rgba(62,107,160,.35),transparent 42%),linear-gradient(155deg,#0A2D55,#123F73); }
.afd-pricecard__price { color: #FF980D; }
.afd-cta-main { background: linear-gradient(90deg,#F0900E,#FF9B0A); }
.afd-phero-assurance { display: grid; gap: 10px; margin: 0 0 var(--afd-space-8); padding: 14px; border: 1px solid #E3E9F0; border-radius: 18px; background: #fff; box-shadow: 0 8px 26px rgba(14,39,71,.05); }
.afd-phero-assurance__item { display: grid; grid-template-columns: 40px minmax(0,1fr); align-items: center; gap: 10px; min-width: 0; padding: 8px; }
.afd-phero-assurance__item > span { width: 40px; height: 40px; display: grid; place-items: center; padding: 7px; box-sizing: border-box; border-radius: 12px; background: #FFF6E9; }
.afd-phero-assurance__item b,.afd-phero-assurance__item small { display: block; }
.afd-phero-assurance__item b { color: var(--afd-navy); font: 700 .75rem/1.25 var(--afd-font-heading); }
.afd-phero-assurance__item small { margin-top: 2px; color: var(--afd-text-muted); font-size: .66rem; line-height: 1.35; }

@media (min-width: 600px) {
  .afd-home-benefits { padding: 12px 14px; }
  .afd-home-deal-promo { min-height: 420px; }
  .afd-phero__imgbox { min-height: 420px; }
  .afd-phero__gallery { grid-auto-columns: 86px; }
  .afd-phero__thumb { width: 86px; height: 86px; }
  .afd-phero-assurance { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (min-width: 900px) {
  .afd-home-hero { min-height: 640px; grid-template-columns: minmax(0,1fr) minmax(470px,.95fr); padding: 64px 58px; }
  body.afd-page .afd-home-hero h1 { max-width: 720px; font-size: clamp(3.6rem,4.6vw,5.15rem); }
  .afd-home-hero__content > p { max-width: 650px; font-size: 1.08rem; }
  .afd-home-hero__visual { min-height: 500px; aspect-ratio: 1.05 / 1; }
  .afd-home-search { min-height: 64px; max-width: 690px; }
  .afd-home-search button { min-width: 120px; height: 52px; }
  .afd-home-benefits { grid-template-columns: repeat(3,1fr); max-width: 700px; }
  /* display:grid TAENDER grid-template-columns (var inert paa en flex-container),
     saa promo-boksen faar en FAST bredde uafhaengigt af sidens container og
     ikke krymper/klemmes forskelligt paa forside vs hub (audit 2026-07-20). */
  .afd-home-product-rail { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 18px; align-items: stretch; }
  .afd-home-deal-promo { min-height: 440px; border-radius: 22px; }
  .afd-home-product-rail__track { gap: 14px; }
  .afd-product-hero { grid-template-columns: minmax(480px,1fr) minmax(0,1fr); gap: clamp(34px,4vw,64px); }
  .afd-phero__media { position: static; padding: 22px; }
  .afd-phero__imgbox { min-height: 520px; }
  .afd-phero__imgbox .afd-phero__main-image { max-height: 540px; }
  .afd-phero__info h1 { font-size: clamp(2.35rem,3vw,3.2rem); }
  .afd-phero-assurance { grid-template-columns: repeat(4,minmax(0,1fr)); padding: 12px 18px; }
}
@media (min-width: 1200px) {
  .afd-home-hero { min-height: 680px; grid-template-columns: minmax(0,1.02fr) minmax(540px,.98fr); }
  .afd-home-deal-promo { min-height: 470px; }
  .afd-product-hero { grid-template-columns: minmax(560px,1.02fr) minmax(0,.98fr); }
  .afd-phero__imgbox { min-height: 590px; }
}

/* ---------- Priser og butikker: referencefinish 2026-07-15 ---------- */
.afd-offers-section { margin-top: var(--afd-space-8); } /* = .afd-psec-rytmen, saa foerste mellemrum er lig de oevrige */
.afd-offers-section .afd-section-head { align-items: end; margin-bottom: 22px; }
.afd-offers-section .afd-section-head h2 { margin: 0; font-size: clamp(2rem,7vw,3.35rem); line-height: 1.05; letter-spacing: -.045em; }
.afd-offers-section .afd-overline { margin-bottom: 10px; font-size: .78rem; letter-spacing: .14em; }
/* Mobil (<600): ultrakompakt tilbudsraekke = logo | pris (lige til venstre for
   knappen) | CTA. Butiksnavnet vises IKKE (logoet identificerer butikken);
   detaljer (fragt, opdateret) skjules for et rent koebspanel. @600 genaabner
   navn + fuld info (audit 2026-07-21). */
.afd-offers { display: block; }
.afd-offers__row { grid-template-columns: 48px minmax(0,1fr) auto; grid-template-areas: "logo prices cta"; align-items: center; gap: 12px; min-height: 0; margin-bottom: 10px; padding: 11px 13px; border-color: #DCE4ED; border-radius: 14px; background: #fff; box-shadow: 0 6px 18px rgba(14,39,71,.05); }
.afd-offers__row:hover { border-color: rgba(20,51,92,.3); box-shadow: 0 10px 24px rgba(14,39,71,.08); }
.afd-offers__row--best { border-color: transparent; background: radial-gradient(circle at 92% 12%,rgba(45,88,142,.42),transparent 40%),linear-gradient(150deg,#0A2D55,#123F73); box-shadow: 0 12px 30px rgba(14,39,71,.16); }
.afd-offers__row--best:hover { box-shadow: 0 14px 34px rgba(14,39,71,.2); }
.afd-offers__row--out { opacity: .64; }
.afd-offers__logo { grid-area: logo; align-self: center; width: 48px; height: 48px; padding: 8px; box-sizing: border-box; border: 1px solid #E0E7EF; border-radius: 12px; background: #fff; font-size: 13px; }
/* Butikslogoet er et MAERKE, ikke et billede: tilen ejer formen og radius,
   logoet staar med luft omkring sig og roerer aldrig kanten (ejer-fund
   2026-08-31: logoernes egen hvide bund gik helt ud i tilens runde hjoerner
   og blev til en stor hvid klods, isaer paa den navy bedste-raekke). */
.afd-offers__logo img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 0; }
.afd-offers__info { display: none; grid-area: info; align-items: center; min-width: 0; }
.afd-offers__name { display: block; gap: 8px; font-size: .92rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.afd-offers__name a { color: var(--afd-navy); }
.afd-offers__sub { display: none; gap: 6px 12px; margin-top: 0; font-size: .72rem; line-height: 1.45; }
.afd-offers__sub > span { display: inline-flex; align-items: center; gap: 12px; }
.afd-offers__sub > span + span::before { content: ""; width: 1px; height: 13px; display: inline-block; background: #D9E1EA; }
.afd-offers__row--best .afd-offers__sub > span + span::before { background: rgba(255,255,255,.22); }
.afd-offers__badge-icon { width: 18px; height: 18px; display: grid; place-items: center; flex: 0 0 auto; }
.afd-offers__badge-icon .afd-ui-icon { width: 100%; height: 100%; }
.afd-offers__name .afd-badge--success { display: none; align-items: center; gap: 5px; padding: 5px 10px; }
.afd-offers__prices { grid-area: prices; flex-direction: row; align-items: baseline; justify-content: flex-end; flex-wrap: nowrap; white-space: nowrap; gap: 7px; padding: 0; border-top: 0; }
.afd-offers__price { font-size: 1.2rem; line-height: 1.1; white-space: nowrap; }
.afd-offers__old { font-size: .72rem; white-space: nowrap; }
.afd-offers__low30 { display: none; margin-top: 4px; color: var(--afd-text-muted); font-size: .64rem; line-height: 1.35; }
.afd-offers__row--best .afd-offers__low30 { color: rgba(255,255,255,.58); }
.afd-offers__cta { grid-area: cta; justify-content: flex-end; align-self: center; }
.afd-offers__cta .afd-btn { width: auto; min-height: 42px; padding: 10px 14px; border-radius: 10px; font-size: .72rem; letter-spacing: .04em; white-space: nowrap; }
.afd-offers__row--best .afd-offers__cta .afd-btn { background: linear-gradient(90deg,#F0900E,#FF9B0A); box-shadow: 0 8px 20px rgba(240,144,14,.28); }
.afd-offers__foot { display: flex; align-items: center; gap: 12px; padding: 14px 2px 0; color: #59687A; font-size: .78rem; line-height: 1.5; }
.afd-offers__foot-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; padding: 7px; box-sizing: border-box; border-radius: 50%; background: #EAF3FF; }
.afd-offers__foot-icon .afd-ui-icon { width: 100%; height: 100%; }
.afd-offers__foot-text { min-width: 0; }

@media (min-width: 600px) {
  .afd-offers__row { grid-template-columns: 56px minmax(0,1fr) minmax(130px,auto); grid-template-areas: "logo info prices" "logo cta cta"; align-items: stretch; gap: 14px 16px; min-height: 126px; padding: 22px; border-radius: 18px; }
  .afd-offers__logo { width: 56px; height: 56px; padding: 9px; border-radius: 14px; }
  /* Genaabn den fulde info paa tablet+ (skjult i den kompakte mobil-raekke). */
  .afd-offers__info { display: flex; flex-direction: column; justify-content: center; gap: 7px; }
  .afd-offers__prices { justify-content: center; }
  .afd-offers__name { display: flex; flex-wrap: wrap; gap: 10px; font-size: 1rem; white-space: normal; overflow: visible; }
  .afd-offers__name .afd-badge--success { display: inline-flex; }
  .afd-offers__sub { display: flex; }
  .afd-offers__prices { flex-direction: column; align-items: flex-end; align-self: stretch; justify-content: center; gap: 0; padding: 0 0 0 22px; border-top: 0; border-left: 1px solid #E2E8EF; }
  .afd-offers__row--best .afd-offers__prices { border-left-color: rgba(255,255,255,.18); }
  .afd-offers__price { font-size: 1.65rem; }
  .afd-offers__low30 { display: block; }
  .afd-offers__cta { justify-content: flex-end; align-self: auto; }
  .afd-offers__cta .afd-btn { width: auto; min-width: 190px; min-height: 52px; font-size: .75rem; }
  .afd-offers__foot { padding-top: 18px; }
}
@media (min-width: 900px) {
  .afd-offers-section { margin-top: var(--afd-space-12); }
  .afd-offers-section .afd-section-head { margin-bottom: 28px; }
  .afd-offers__row { grid-template-columns: 64px minmax(0,1fr) minmax(170px,.24fr) minmax(190px,.25fr); grid-template-areas: "logo info prices cta"; gap: 26px; min-height: 148px; padding: 26px 30px; border-radius: 20px; }
  .afd-offers__logo { width: 64px; height: 64px; padding: 10px; border-radius: 16px; }
  .afd-offers__info { justify-content: center; gap: 12px; }
  .afd-offers__name { font-size: 1.18rem; }
  .afd-offers__sub { font-size: .78rem; }
  .afd-offers__prices { align-items: center; padding-left: 30px; }
  .afd-offers__price { font-size: 2rem; }
  .afd-offers__cta { justify-content: flex-end; }
  .afd-offers__cta .afd-btn { min-width: 190px; min-height: 62px; }
  .afd-offers__foot { font-size: .84rem; }
}
@media (min-width: 1200px) {
  .afd-offers__row { grid-template-columns: 68px minmax(0,1fr) minmax(190px,.25fr) minmax(210px,.27fr); gap: 30px; padding: 28px 32px; }
  .afd-offers__logo { width: 68px; height: 68px; }
  .afd-offers__cta .afd-btn { min-width: 210px; }
}


/* ---------- PRODUKTFOKUS v1.21: ro, lige kolonner og fuld dataprofil ---------- */
.afd-home-deal-promo__image {
  width: 84%;
  height: 40%;
  left: 8%;
  bottom: 10px;
  object-fit: contain;
  object-position: center bottom;
}
.afd-product-hero { align-items: stretch; }
.afd-phero__media,
.afd-phero__info { width: 100%; max-width: none; box-sizing: border-box; }
#afd-product-tabs,
#afd-product-tabs .afd-tabs__nav,
#afd-product-tabs .afd-tabs__panel,
#afd-product-tabs .afd-tabs__panel > .afd-prose,
#afd-product-tabs .afd-specs__wrap,
#afd-product-tabs .afd-specs__table {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}
#afd-product-tabs .afd-tabs__panel--active { display: block; }
.afd-proscons {
  width: 100%;
  padding: clamp(20px, 3vw, 34px);
  border: 1px solid var(--afd-border);
  border-radius: 20px;
  background: #fff;
  box-sizing: border-box;
}
.afd-proscons__grid {
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--afd-border);
  border-radius: 16px;
  background: #fff;
  grid-template-columns: 1fr 1fr; /* fordele + ulemper side om side, ogsaa paa mobil (ejer-oenske 2026-07-22) */
}
.afd-proscons__col {
  min-width: 0;
  padding: clamp(13px, 2.4vw, 28px);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
/* Lodret skillelinje mellem de to kolonner (gap:0), paa alle bredder. */
.afd-proscons__col--pros { border-right: 1px solid var(--afd-border); }
.afd-proscons__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  font-size: 1rem;
  font-weight: 800;
}
.afd-proscons__head-icon,
.afd-proscons__item-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
}
.afd-proscons__head-icon { width: 30px; height: 30px; }
.afd-proscons__head-icon .afd-ui-icon { width: 100%; height: 100%; object-fit: contain; }
/* Enkelt-punkter: farvet bullet (groen for fordele, roed for ulemper) i stedet
   for ikon. Kun overskriften beholder vores ikon (ejer-krav 2026-07-21). */
.afd-proscons__item-icon { width: 16px; height: 16px; margin-top: 4px; }
.afd-proscons__item-icon .afd-ui-icon { display: none; }
.afd-proscons__item-icon::before { content: ""; width: 9px; height: 9px; border-radius: 50%; }
.afd-proscons__col--pros .afd-proscons__item-icon::before { background: var(--afd-success); }
.afd-proscons__col--cons .afd-proscons__item-icon::before { background: var(--afd-danger); }
.afd-proscons__col ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; min-width: 0; }
/* Mobil: lidt mindre tekst + laange ord SKAL bryde saa intet floeder ud af den
   smalle 2-kolonne (klippes ellers af overflow:hidden). Ingen scroll-boks. @600
   giver normal stoerrelse igen. */
.afd-proscons__col li { display: flex; align-items: flex-start; gap: 8px; margin: 0; min-width: 0; color: var(--afd-text); font-size: .8rem; line-height: 1.45; }
.afd-proscons__col li > span:last-child { min-width: 0; overflow-wrap: anywhere; word-break: break-word; hyphens: auto; }
.afd-proscons__col--pros .afd-proscons__head { color: var(--afd-success); }
.afd-proscons__col--cons .afd-proscons__head { color: var(--afd-danger); }
@media (min-width: 900px) {
  .afd-product-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .afd-phero__media {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    height: 100%;
  }
  .afd-phero__imgbox { flex: 1 1 auto; min-height: 520px; }
  .afd-phero__main-image { width: 100%; height: 100%; max-height: none; object-fit: contain; }
  .afd-phero__gallery { flex: 0 0 auto; }
  .afd-phero__info { align-self: stretch; height: 100%; }
}


/* ---------- REFERENCEHEROES v1.22: tilbud og dynamiske butikssider ---------- */
.afd-deals-hero,
.afd-merchant-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  gap: 28px;
  width: 100%;
  margin: 0 0 var(--afd-section-gap);
  padding: clamp(28px, 5vw, 64px);
  overflow: hidden;
  border: 1px solid #f1e3d2;
  border-radius: clamp(24px, 3vw, 34px);
  background:
    radial-gradient(circle at 76% 22%, rgba(255,255,255,.92) 0 9%, transparent 9.3%),
    linear-gradient(135deg, #fffdf9 0%, #fff8ef 100%);
  box-shadow: 0 18px 48px rgba(13,49,86,.10);
  box-sizing: border-box;
}
.afd-deals-hero::before,
.afd-merchant-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 260px;
  height: 260px;
  right: 28%;
  bottom: -128px;
  border-radius: 50%;
  background: rgba(255,143,0,.055);
}
.afd-deals-hero::after,
.afd-merchant-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 132px;
  height: 82px;
  top: 30px;
  left: 39%;
  opacity: .28;
  background-image: radial-gradient(circle, rgba(255,143,0,.42) 2px, transparent 2.5px);
  background-size: 18px 18px;
}
.afd-deals-hero__copy,
.afd-merchant-hero__copy { position: relative; z-index: 2; min-width: 0; }
.afd-deals-hero .afd-overline { margin-bottom: 22px; color: var(--afd-orange-dark); font-size: .95rem; }
.afd-deals-hero h1,
.afd-merchant-hero h1 {
  max-width: 760px;
  margin: 0;
  color: var(--afd-navy-deep);
  font-size: clamp(2.55rem, 6.2vw, 5rem);
  line-height: .98;
  letter-spacing: -.055em;
}
.afd-deals-hero__lead,
.afd-merchant-hero__lead {
  max-width: 720px;
  margin: 24px 0 0;
  color: #526173;
  font-size: clamp(1rem, 1.7vw, 1.28rem);
  line-height: 1.55;
}
.afd-deals-hero__disclosure,
.afd-merchant-hero__disclosure { margin-top: 28px; color: #647184; font-style: italic; }
.afd-deals-hero__disclosure > *,
.afd-merchant-hero__disclosure > * { margin: 0; }
.afd-deals-hero__media {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: end center;
  min-width: 0;
}
.afd-deals-hero__media img {
  display: block;
  width: min(100%, 560px);
  max-height: 470px;
  object-fit: contain;
  object-position: center bottom;
}
.afd-deals-hero__stats { position: relative; z-index: 2; display: grid; gap: 12px; align-content: center; }
.afd-deals-hero__stat {
  display: grid;
  grid-template-columns: 62px minmax(0,1fr);
  align-items: center;
  gap: 16px;
  min-height: 112px;
  padding: 18px;
  border: 1px solid rgba(13,49,86,.08);
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 10px 24px rgba(13,49,86,.075);
  box-sizing: border-box;
}
.afd-deals-hero__stat-icon,
.afd-merchant-hero__feature-icon {
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--afd-orange-soft);
}
.afd-deals-hero__stat-icon { width: 62px; height: 62px; }
.afd-deals-hero__stat-icon .afd-ui-icon { width: 38px; height: 38px; object-fit: contain; }
.afd-deals-hero__stat-copy { display: grid; gap: 5px; min-width: 0; color: #526173; line-height: 1.35; }
.afd-deals-hero__stat-copy strong { color: var(--afd-navy-deep); font: 800 clamp(1.35rem, 2.5vw, 2rem)/1 var(--afd-font-heading); }
.afd-merchant-hero { align-items: center; }
.afd-merchant-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 28px;
  padding: 10px 18px;
  border-radius: 999px;
  background: var(--afd-orange-soft);
  color: var(--afd-orange-dark);
  font: 800 .9rem/1 var(--afd-font-heading);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.afd-merchant-hero__eyebrow > span:first-child { display: grid; width: 24px; height: 24px; place-items: center; }
.afd-merchant-hero__eyebrow .afd-ui-icon { width: 24px; height: 24px; object-fit: contain; }
.afd-merchant-hero__cta { width: fit-content; min-width: min(100%, 280px); margin-top: 28px; justify-content: center; gap: 18px; }
.afd-merchant-hero__features { display: grid; gap: 12px; margin-top: 30px; }
.afd-merchant-hero__feature {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 92px;
  padding: 16px;
  border: 1px solid rgba(13,49,86,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.76);
  color: #526173;
  line-height: 1.35;
  box-shadow: 0 8px 20px rgba(13,49,86,.05);
}
.afd-merchant-hero__feature strong { color: var(--afd-navy-deep); }
.afd-merchant-hero__feature-icon { flex: 0 0 50px; width: 50px; height: 50px; }
.afd-merchant-hero__feature-icon .afd-ui-icon { width: 30px; height: 30px; object-fit: contain; }
.afd-merchant-hero__visual {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 300px;
  padding: clamp(20px, 4vw, 42px);
  border: 4px solid rgba(255,255,255,.92);
  border-radius: 26px;
  background:
    radial-gradient(circle at 82% 18%, rgba(255,143,0,.10) 0 2px, transparent 2.5px) 0 0 / 18px 18px,
    rgba(255,255,255,.68);
  box-shadow: 0 16px 34px rgba(13,49,86,.10);
  box-sizing: border-box;
}
.afd-merchant-hero__logo { display: grid; width: 100%; min-height: 220px; place-items: center; }
.afd-merchant-hero__logo img { width: min(100%, 620px); max-height: 230px; object-fit: contain; }
.afd-merchant-hero__fallback { color: var(--afd-navy-deep); font: 800 clamp(2.4rem, 6vw, 5rem)/1 var(--afd-font-heading); text-align: center; letter-spacing: -.04em; }
@media (min-width: 600px) {
  .afd-deals-hero__stats,
  .afd-merchant-hero__features { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .afd-deals-hero__stat { grid-template-columns: 54px minmax(0,1fr); padding: 14px; }
  .afd-deals-hero__stat-icon { width: 54px; height: 54px; }
}
@media (min-width: 900px) {
  .afd-deals-hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, .88fr) minmax(220px, .68fr);
    align-items: stretch;
    min-height: 500px;
  }
  .afd-deals-hero__copy { align-self: center; }
  .afd-deals-hero__media { align-self: end; height: 100%; margin-bottom: -64px; }
  .afd-deals-hero__media img { width: 118%; max-width: 600px; max-height: 520px; }
  .afd-deals-hero__stats { grid-template-columns: 1fr; }
  .afd-deals-hero__stat { grid-template-columns: 62px minmax(0,1fr); padding: 18px; }
  .afd-deals-hero__stat-icon { width: 62px; height: 62px; }
  .afd-merchant-hero { grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); min-height: 540px; }
  .afd-merchant-hero__features { max-width: 700px; }
  .afd-merchant-hero__visual { min-height: 420px; }
  .afd-merchant-hero__logo { min-height: 320px; }
}

/* ---------- ASTRA-OVERRIDES (ENESTE sektion hvor !important er tilladt,
   jf. STIL.md afsnit 2 punkt 5; scoped til body.afd-page) ---------- */
body.afd-page .site-content .ast-container,
body.afd-page .site-content > .ast-container,
body.afd-page .site-content .content-area,
body.afd-page .site-content .entry-content,
body.afd-page .site-content #content,
body.afd-page #primary,
body.afd-page #content .entry-content { max-width: 100% !important; width: 100% !important; margin: 0 !important; padding: 0 !important; float: none !important; }
body.afd-page .widget-area, body.afd-page #secondary, body.afd-page aside.sidebar { display: none !important; }
/* Soegefelt: Astra/tema tegner en graa kant/streg paa input; neutraliseres med
   hoej specificitet (body.afd-page-scope slaar Astras input-regler uden !important). */
body.afd-page .afd-search input[type="search"],
body.afd-page .afd-home-search input[type="search"] { border: 0; box-shadow: none; background: transparent; outline: none; -webkit-appearance: none; appearance: none; }
body.afd-page .afd-search input[type="search"]::-webkit-search-decoration,
body.afd-page .afd-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
/* Bulletproof-farver (NEMMAND-guiden: theme-hover maa ALDRIG vinde). */
body.afd-page a:hover { color: var(--afd-navy-deep) !important; }
body.afd-page .afd-btn--primary, body.afd-page .afd-btn--primary:link, body.afd-page .afd-btn--primary:visited, body.afd-page .afd-btn--primary:hover, body.afd-page .afd-btn--primary:focus, body.afd-page .afd-btn--primary:active,
body.afd-page .afd-btn--navy, body.afd-page .afd-btn--navy:link, body.afd-page .afd-btn--navy:visited, body.afd-page .afd-btn--navy:hover, body.afd-page .afd-btn--navy:focus, body.afd-page .afd-btn--navy:active,
body.afd-page .afd-cta-main, body.afd-page .afd-cta-main:link, body.afd-page .afd-cta-main:visited, body.afd-page .afd-cta-main:hover, body.afd-page .afd-cta-main:focus, body.afd-page .afd-cta-main:active,
body.afd-page .afd-hero-animals__links a, body.afd-page .afd-hero-animals__links a:hover,
body.afd-page .afd-offers__row--best .afd-offers__name a, body.afd-page .afd-offers__row--best .afd-offers__name a:hover,
body.afd-page .afd-explore__card, body.afd-page .afd-explore__card:hover,
body.afd-page .afd-skip-link:focus { color: #fff !important; }
/* Tilbudsbaandets navy CTA-tekst og hvide headerlink skal ogsaa slaa
   temaets generelle link-hover og primaerknap-farver. Kun dette baand. */
body.afd-page .afd-home-product-rail .afd-card__cta,
body.afd-page .afd-home-product-rail .afd-card__cta:link,
body.afd-page .afd-home-product-rail .afd-card__cta:visited,
body.afd-page .afd-home-product-rail .afd-card__cta:hover,
body.afd-page .afd-home-product-rail .afd-card__cta:focus,
body.afd-page .afd-home-product-rail .afd-card__cta:active { color: var(--afd-navy) !important; }
body.afd-page .afd-home-product-rail .afd-home-product-rail__all,
body.afd-page .afd-home-product-rail .afd-home-product-rail__all:link,
body.afd-page .afd-home-product-rail .afd-home-product-rail__all:visited,
body.afd-page .afd-home-product-rail .afd-home-product-rail__all:hover,
body.afd-page .afd-home-product-rail .afd-home-product-rail__all:focus,
body.afd-page .afd-home-product-rail .afd-home-product-rail__all:active { color: var(--afd-bg) !important; }
/* "Vis alle / Vis faerre" i filtergrupperne: ren tekst, aldrig en kasse
   (ejer-rapport 2026-07-27: "det orange passer ikke i stoerrelsen"). To ting
   tegnede kassen: den globale orange :focus-visible-ramme (3px med 3px offset
   ser ud som en fyldt boks omkring saa kort en tekst) og temaets knap-styling.
   Samme opskrift som .afd-readmore, bare scoped til body.afd-page saa den
   slaar temaets button-regler UDEN !important. */
body.afd-page .afd-cross-filters__more,
body.afd-page .afd-cross-filters__more:hover,
body.afd-page .afd-cross-filters__more:focus,
body.afd-page .afd-cross-filters__more:active { background: none; background-color: transparent; border: 0; box-shadow: none; padding: 4px 0; color: var(--afd-accent-hover); text-decoration: none; }
/* Tastaturfokus skal stadig kunne SES, men som en tynd streg under teksten,
   ikke som en ramme der ligner en knap. */
body.afd-page .afd-cross-filters__more:focus-visible { outline: none; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- KOMPAKT PRODUKTTOP v1.22.5: smal PriceRunner-lignende hero + genveje ---------- */
.afd-product-hero { align-items: start; gap: 18px; width: 100%; max-width: 1120px; margin: 4px auto 8px; }
.afd-phero__media { display: block; align-self: start; height: auto; min-height: 0; padding: 10px; overflow: hidden; border-radius: 16px; }
.afd-phero__imgbox { width: 100%; height: 230px; min-height: 230px; }
.afd-phero__imgbox .afd-phero__main-image { width: 100%; height: 100%; max-height: 230px; padding: 4px; object-fit: contain; }
.afd-phero__gallery { grid-auto-columns: 48px; gap: 7px; margin-top: 7px; padding-bottom: 1px; }
.afd-phero__thumb { width: 48px; height: 48px; padding: 4px; border-radius: 9px; }
.afd-phero__drop { width: 54px; height: 54px; top: 10px; right: 10px; }
.afd-phero__drop b { font-size: 15px; }
.afd-phero__info { align-self: start; height: auto; padding-top: 0; }
.afd-phero__meta { margin-bottom: 6px; }
.afd-phero__info h1 { margin-bottom: 6px; font-size: clamp(1.45rem,2.15vw,1.95rem); line-height: 1.06; }
.afd-phero__desc { margin-bottom: 2px; font-size: .82rem; line-height: 1.42; -webkit-line-clamp: 2; }
.afd-readmore { min-height: 28px; margin: 0 0 3px; font-size: .68rem; text-decoration: none; }
.afd-readmore:hover { text-decoration: none; }
.afd-variants { gap: 4px; margin-block: 5px; }
.afd-variants__button { min-width: 72px; min-height: 40px; padding: 5px 9px; border-radius: 9px; }
.afd-icon-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; margin: 5px 0; }
.afd-ig__item { min-height: 38px; padding: 5px 8px; border-radius: 9px; }
.afd-ig__ico { width: 24px; height: 24px; }
.afd-pricecard { margin-top: 6px; padding: 11px 14px; border-radius: 12px; box-shadow: 0 8px 20px rgba(14,39,71,.14); }
.afd-pricecard__label { margin-bottom: 3px; font-size: 8px; }
.afd-pricecard__row { align-items: center; margin-bottom: 6px; }
.afd-pricecard__price { font-size: 27px; }
.afd-pricecard__old { font-size: 13px; }
.afd-pricecard__save { padding: 4px 9px; font-size: 9px; }
.afd-pricecard__low30 { margin-top: 3px; font-size: 9px; }
.afd-cta-main { min-height: 42px; border-radius: 9px; }
.afd-phero-assurance { display: none; }

.afd-product-jumps { position: relative; width: 100%; max-width: 1120px; margin: 0 auto 20px; overflow: hidden; border-bottom: 1px solid var(--afd-border); }
.afd-product-jumps__track { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; }
.afd-product-jumps__track::-webkit-scrollbar { display: none; }
.afd-product-jumps a { position: relative; flex: 0 0 auto; padding: 10px 13px 11px; color: var(--afd-navy); font: 700 .7rem/1.2 var(--afd-font-heading); white-space: nowrap; text-decoration: none; }
.afd-product-jumps a::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: -1px; height: 2px; background: transparent; }
.afd-product-jumps a:hover, .afd-product-jumps a:focus-visible { color: var(--afd-accent-hover); text-decoration: none; }
.afd-product-jumps a:first-child::after, .afd-product-jumps a:hover::after, .afd-product-jumps a:focus-visible::after { background: var(--afd-accent); }
#priser-og-butikker, #lignende-produkter, #afd-product-tabs, #prishistorik, #fordele-og-ulemper, #produkt-faq { scroll-margin-top: 24px; }

@media (min-width: 600px) {
  .afd-phero__imgbox { height: 260px; min-height: 260px; }
  .afd-phero__imgbox .afd-phero__main-image { max-height: 260px; }
  .afd-icon-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (min-width: 900px) {
  .afd-product-hero { grid-template-columns: minmax(0,.92fr) minmax(0,1.08fr); gap: 24px; }
  .afd-phero__media { position: static; height: auto; min-height: 0; padding: 10px; }
  .afd-phero__imgbox { flex: none; height: 270px; min-height: 270px; }
  .afd-phero__imgbox .afd-phero__main-image { height: 100%; max-height: 270px; }
  .afd-phero__gallery { grid-auto-columns: 48px; }
  .afd-phero__thumb { width: 48px; height: 48px; }
  .afd-phero__info { align-self: start; height: auto; }
  .afd-phero__info h1 { font-size: clamp(1.6rem,2vw,1.95rem); }
  .afd-product-jumps { margin-top: 0; }
}
@media (min-width: 1200px) {
  .afd-product-hero { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 28px; }
  .afd-phero__imgbox { height: 285px; min-height: 285px; }
  .afd-phero__imgbox .afd-phero__main-image { max-height: 285px; }
}

/* ---------- BUTIKSLINJER v1.22.3: centreret metadata uden tilfældige linjeskift ---------- */
.afd-offers__logo,
.afd-offers__info,
.afd-offers__prices,
.afd-offers__cta { align-self: center; }
.afd-offers__info { justify-content: center; }
.afd-offers__name,
.afd-offers__sub { align-items: center; }
.afd-offers__sub > span { white-space: nowrap; }
.afd-offers__updated { flex: 0 0 auto; }

@media (min-width: 900px) {
  .afd-offers__row { align-items: center; }
  .afd-offers__sub { width: 100%; flex-wrap: nowrap; gap: 0; font-size: .72rem; }
  .afd-offers__sub > span + span { margin-left: 12px; }
}
@media (min-width: 1200px) {
  .afd-offers__sub { font-size: .78rem; }
  .afd-offers__sub > span + span { margin-left: 14px; }
}


/* ---------- GUIDES-LANDING v1.22.6: billedhero, emnefiltre og tomtilstand ---------- */
.afd-guides-page { padding-bottom: var(--afd-section-gap); }
.afd-guides-page .afd-breadcrumbs { padding-block: 16px 10px; }
.afd-guides-hero {
  position: relative;
  display: grid;
  gap: 18px;
  min-height: 330px;
  margin-bottom: 0;
  overflow: hidden;
  border: 1px solid #F0E5D7;
  border-radius: 24px;
  background:
    radial-gradient(circle at 14% 105%, rgba(240,144,14,.09) 0 72px, transparent 73px),
    radial-gradient(circle at 90% 8%, rgba(240,144,14,.07) 0 120px, transparent 121px),
    linear-gradient(125deg, #FFFDF9 0%, #FFF8EF 100%);
  box-shadow: 0 14px 42px rgba(14,39,71,.08);
}
.afd-guides-hero__copy {
  position: relative;
  z-index: 2;
  align-self: center;
  padding: 32px 24px 4px;
}
.afd-guides-hero__copy::before,
.afd-guides-hero__copy::after {
  position: absolute;
  color: rgba(240,144,14,.16);
  font-family: var(--afd-font-heading);
  line-height: 1;
  pointer-events: none;
}
.afd-guides-hero__copy::before { content: "•"; top: 18px; right: 26px; font-size: 46px; }
.afd-guides-hero__copy::after { content: "••"; top: 52px; right: 50px; font-size: 22px; letter-spacing: 7px; transform: rotate(-18deg); }
.afd-guides-hero h1 {
  position: relative;
  width: max-content;
  max-width: 100%;
  margin: 0 0 34px;
  color: var(--afd-navy);
  font-size: clamp(2.45rem, 7vw, 4.4rem);
  line-height: .98;
  letter-spacing: -.045em;
}
.afd-guides-hero h1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -18px;
  width: 76px;
  height: 7px;
  border-radius: 99px;
  background: var(--afd-accent);
}
.afd-guides-hero__copy p {
  max-width: 520px;
  margin: 0;
  color: var(--afd-text-muted);
  font-size: clamp(1rem, 2vw, 1.18rem);
  line-height: 1.65;
}
.afd-guides-hero__media {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: 205px;
}
.afd-guides-hero__media::before {
  content: "";
  position: absolute;
  inset: 10% 6% 0;
  border-radius: 50% 50% 0 0;
  background: rgba(240,144,14,.07);
}
.afd-guides-hero__media img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(100%, 620px);
  height: 100%;
  max-height: 300px;
  object-fit: contain;
  object-position: center bottom;
}
.afd-guides-topics {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 28px;
  padding: 18px 2px;
  border-bottom: 1px solid var(--afd-border);
}
.afd-guides-topics__label {
  flex: 0 0 auto;
  color: var(--afd-navy);
  font: 750 .94rem/1.2 var(--afd-font-heading);
}
.afd-guides-topics__rail {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 2px;
  overflow-x: auto;
  scrollbar-width: none;
}
.afd-guides-topics__rail::-webkit-scrollbar { display: none; }
.afd-guides-topics__pill,
.afd-guides-topics__more > summary {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid var(--afd-border);
  border-radius: 999px;
  background: var(--afd-bg);
  color: var(--afd-navy);
  box-shadow: 0 3px 12px rgba(14,39,71,.035);
  font: 650 .83rem/1 var(--afd-font-heading);
  white-space: nowrap;
  cursor: pointer;
  transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease;
}
.afd-guides-topics__pill .afd-ui-icon { width: 24px; height: 24px; object-fit: contain; }
.afd-guides-topics__pill:hover,
.afd-guides-topics__pill:focus-visible,
.afd-guides-topics__pill.is-active,
.afd-guides-topics__more > summary:hover,
.afd-guides-topics__more > summary:focus-visible {
  color: var(--afd-navy);
  border-color: var(--afd-accent);
  background: var(--afd-accent-soft);
  text-decoration: none;
  transform: translateY(-1px);
}
.afd-guides-topics__more { position: relative; flex: 0 0 auto; }
.afd-guides-topics__more > summary { list-style: none; }
.afd-guides-topics__more > summary::-webkit-details-marker { display: none; }
.afd-guides-topics__more[open] > summary { border-color: var(--afd-accent); background: var(--afd-accent-soft); }
.afd-guides-topics__menu {
  position: absolute;
  top: calc(100% + 9px);
  right: 0;
  display: grid;
  min-width: 190px;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--afd-border);
  border-radius: 16px;
  background: var(--afd-bg);
  box-shadow: var(--afd-shadow-md);
}
.afd-guides-topics__menu .afd-guides-topics__pill { justify-content: flex-start; width: 100%; }
.afd-guides-results { min-height: 260px; }
.afd-guides-results > .afd-section-head { margin-bottom: 18px; }
.afd-guides-results > .afd-section-head h2 { margin: 0; font-size: clamp(1.35rem, 3vw, 1.8rem); }
.afd-guides-grid { gap: 20px; }
.afd-guides-page a:hover,
.afd-guides-page a:focus-visible { text-decoration: none; }
.afd-guides-empty {
  position: relative;
  display: grid;
  min-height: 330px;
  overflow: hidden;
  border: 1px solid var(--afd-border);
  border-radius: 24px;
  background: var(--afd-bg);
  box-shadow: var(--afd-shadow-sm);
}
.afd-guides-empty::before,
.afd-guides-empty::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: var(--afd-accent-soft);
  pointer-events: none;
}
.afd-guides-empty::before { width: 240px; height: 240px; left: -80px; bottom: -120px; }
.afd-guides-empty::after { width: 170px; height: 170px; right: -70px; top: -85px; opacity: .6; }
.afd-guides-empty__visual,
.afd-guides-empty__copy {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.afd-guides-empty__visual { min-height: 170px; padding: 26px 24px 0; }
.afd-guides-empty__halo {
  display: grid;
  width: 150px;
  height: 150px;
  place-items: center;
  border-radius: 48% 52% 55% 45%;
  background: linear-gradient(145deg, #FFF6E9, #FDF0DC);
  transform: rotate(-5deg);
}
.afd-guides-empty__halo .afd-ui-icon { width: 92px; height: 92px; object-fit: contain; transform: rotate(5deg); }
.afd-guides-empty__copy {
  flex-direction: column;
  align-self: center;
  padding: 8px 24px 38px;
  text-align: center;
}
.afd-guides-empty__icon {
  display: grid;
  width: 58px;
  height: 58px;
  margin-bottom: 14px;
  place-items: center;
  border: 1px solid #F0E5D7;
  border-radius: 50%;
  background: #FFFDF9;
}
.afd-guides-empty__icon .afd-ui-icon { width: 34px; height: 34px; object-fit: contain; }
.afd-guides-empty__copy h2 { margin: 0 0 8px; color: var(--afd-navy); font-size: clamp(1.45rem, 4vw, 2rem); }
.afd-guides-empty__copy p { margin: 0; color: var(--afd-text-muted); font-size: 1rem; }

@media (min-width: 600px) {
  .afd-guides-hero__copy { padding: 42px 38px 8px; }
  .afd-guides-hero__media img { max-height: 340px; }
  .afd-guides-empty { grid-template-columns: .9fr 1.1fr; }
  .afd-guides-empty__visual { min-height: 300px; padding: 30px; }
  .afd-guides-empty__halo { width: 210px; height: 210px; }
  .afd-guides-empty__halo .afd-ui-icon { width: 126px; height: 126px; }
  .afd-guides-empty__copy { align-items: flex-start; padding: 40px; text-align: left; }
}
@media (min-width: 900px) {
  .afd-guides-hero { grid-template-columns: minmax(0,.92fr) minmax(420px,1.08fr); min-height: 390px; }
  .afd-guides-hero__copy { padding: 54px 20px 54px 52px; }
  .afd-guides-hero__media { min-height: 390px; padding-right: 20px; }
  .afd-guides-hero__media img { width: 100%; max-height: 390px; }
  .afd-guides-topics { gap: 24px; padding-block: 20px; }
  .afd-guides-empty { min-height: 360px; grid-template-columns: 1fr 1fr; }
  .afd-guides-empty__halo { width: 245px; height: 245px; }
  .afd-guides-empty__halo .afd-ui-icon { width: 150px; height: 150px; }
  .afd-guides-empty__copy { padding: 48px; }
}
@media (min-width: 1200px) {
  .afd-guides-hero { grid-template-columns: minmax(0,.9fr) minmax(500px,1.1fr); min-height: 410px; }
  .afd-guides-hero__copy { padding-left: 64px; }
  .afd-guides-hero__media img { max-height: 410px; }
}


/* ---------- FORSIDE-AFSLUTNING v1.22.7: store tillidskort og illustreret CTA ---------- */
.afd-home-trust,
.afd-home-cta {
  position: relative;
  margin-top: 18px;
  overflow: hidden;
  border-radius: 28px;
}
.afd-home-trust {
  display: grid;
  gap: 24px;
  padding: 30px 24px;
  border-color: #F0E5D7;
  background:
    radial-gradient(circle at 8% 100%, rgba(240,144,14,.10) 0 95px, transparent 96px),
    radial-gradient(circle at 98% 8%, rgba(240,144,14,.06) 0 120px, transparent 121px),
    linear-gradient(125deg,#FFFDF9 0%,#FFF8EF 100%);
  box-shadow: 0 12px 36px rgba(14,39,71,.06);
}
.afd-home-trust__intro {
  position: relative;
  z-index: 1;
  min-width: 0;
}
.afd-home-trust .afd-overline {
  margin-bottom: 14px;
  font-size: .76rem;
  letter-spacing: .16em;
}
.afd-home-trust h2 {
  max-width: 360px;
  margin: 0 0 14px;
  color: var(--afd-navy);
  /* Maks 2.1rem (var 3rem): den lange "gennemskue" skal kunne staa paa EN linje
     i den smallere hub-kolonne, aldrig braekket midt i ordet (ejer-rapport
     2026-07-20). break-word tillader kun braek naar et ord er bredere end linjen. */
  font-size: clamp(1.6rem,3.6vw,2.1rem);
  line-height: 1.1;
  letter-spacing: -.02em;
}
.afd-home-trust > .afd-home-trust__intro > p {
  max-width: 470px;
  margin: 0;
  color: var(--afd-navy);
  font-size: .94rem;
  line-height: 1.65;
}
.afd-home-trust__pets {
  display: none;
  position: absolute;
  left: 12px;
  bottom: -18px;
  width: 185px;
  height: 115px;
  opacity: .18;
  pointer-events: none;
}
.afd-home-trust__pets .afd-ui-icon {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.afd-home-trust .afd-trust {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.afd-home-trust .afd-trust__item {
  position: relative;
  display: flex;
  min-height: 190px;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  padding: 24px 20px 28px;
  border: 1px solid rgba(20,51,92,.07);
  border-radius: 22px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 30px rgba(14,39,71,.07);
  text-align: center;
}
.afd-home-trust .afd-trust__item::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 18px;
  width: 38px;
  height: 4px;
  border-radius: 99px;
  background: var(--afd-accent);
  transform: translateX(-50%);
}
.afd-home-trust .afd-trust__icon {
  display: grid;
  width: 86px;
  height: 86px;
  flex: 0 0 86px;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(145deg,#FFF7EC,#FDF0DC);
  color: var(--afd-navy);
}
.afd-home-trust .afd-trust__icon .afd-ui-icon {
  width: 58px;
  height: 58px;
  object-fit: contain;
}
.afd-home-trust .afd-trust__title {
  color: var(--afd-navy);
  font: 750 1rem/1.3 var(--afd-font-heading);
}
.afd-home-trust .afd-trust__text {
  display: block;
  max-width: 190px;
  margin-top: 5px;
  color: var(--afd-text-muted);
  font-size: .82rem;
  line-height: 1.55;
}
.afd-home-cta {
  isolation: isolate;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 18px;
  min-height: 300px;
  padding: 30px 24px 24px;
  border-color: rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 58% 20%,rgba(36,85,139,.42),transparent 32%),
    linear-gradient(125deg,#0E2747 0%,#143B6A 62%,#0E2747 100%);
  color: #fff;
  box-shadow: 0 16px 38px rgba(14,39,71,.18);
}
.afd-home-cta::before,
.afd-home-cta::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: 50% 50% 0 0;
  background: rgba(45,92,145,.34);
  pointer-events: none;
}
.afd-home-cta::before { width: 540px; height: 190px; left: 18%; bottom: -115px; transform: rotate(-5deg); }
.afd-home-cta::after { width: 420px; height: 150px; right: -80px; bottom: -95px; transform: rotate(7deg); }
.afd-home-cta__copy {
  position: relative;
  z-index: 2;
}
.afd-home-cta .afd-overline {
  margin-bottom: 12px;
  color: var(--afd-accent);
  font-size: .78rem;
  letter-spacing: .14em;
}
.afd-home-cta h2 {
  max-width: 440px;
  margin: 0 0 10px;
  color: #fff;
  font-size: clamp(1.65rem,5vw,2.5rem);
  line-height: 1.08;
  letter-spacing: -.025em;
}
.afd-home-cta p {
  max-width: 440px;
  margin: 0;
  color: rgba(255,255,255,.78);
  font-size: .9rem;
  line-height: 1.65;
}
.afd-home-cta__visual {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 155px;
  align-self: stretch;
  align-items: flex-end;
  justify-content: center;
}
.afd-home-cta__visual > img {
  position: relative;
  z-index: 2;
  display: block;
  width: min(100%,430px);
  height: 190px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 12px 20px rgba(0,0,0,.18));
}
.afd-home-cta__pet-icon {
  position: absolute;
  top: 2px;
  left: 8%;
  width: 54px;
  height: 54px;
  opacity: .26;
  transform: rotate(-12deg);
}
.afd-home-cta__pet-icon .afd-ui-icon { width: 100%; height: 100%; object-fit: contain; }
.afd-home-cta .afd-btn {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0,1fr) 28px;
  width: 100%;
  min-height: 60px;
  gap: 12px;
  padding: 14px 22px;
  border-radius: 999px;
  font-size: .84rem;
  text-align: center;
  box-shadow: 0 10px 28px rgba(240,144,14,.32);
}
.afd-home-cta .afd-btn:hover,
.afd-home-cta .afd-btn:focus-visible { text-decoration: none; }
.afd-home-cta__arrow {
  justify-self: end;
  font-size: 1.65rem;
  font-weight: 400;
  line-height: .8;
  transition: transform .18s ease;
  animation: afd-arrow-pulse 2s ease-in-out infinite;
}
.afd-home-cta .afd-btn:hover .afd-home-cta__arrow { animation: none; transform: translateX(4px); }

@media (min-width: 600px) {
  .afd-home-trust { padding: 38px 32px; }
  .afd-home-trust .afd-trust { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .afd-home-cta { grid-template-columns: minmax(0,1fr) minmax(260px,.8fr); padding: 34px 32px 0; }
  /* Desktop: gendan synligt sidebillede (backdrop-behandlingen er kun mobil). */
  .afd-home-cta__visual { position: relative; inset: auto; z-index: 1; height: auto; min-height: 220px; display: grid; place-items: end center; overflow: visible; }
  .afd-home-cta__pet-icon { width: min(100%,240px); height: 200px; opacity: .95; }
  .afd-home-cta__pet-icon .afd-ui-icon { object-position: center bottom; }
  .afd-home-cta .afd-btn { grid-column: 1 / -1; margin-bottom: 28px; }
}
@media (min-width: 900px) {
  .afd-home-trust {
    grid-template-columns: minmax(260px,.8fr) minmax(0,2.2fr);
    gap: 28px;
    min-height: 390px;
    padding: 46px 40px;
    align-items: stretch;
  }
  .afd-home-trust__intro { padding: 8px 8px 150px; }
  /* Uden collagen (hub) skal introteksten ikke reservere 150px i bunden. */
  .afd-home-trust--nopets .afd-home-trust__intro { padding: 8px 8px 12px; }
  .afd-home-trust__pets { display: block; }
  .afd-home-trust--nopets .afd-home-trust__pets { display: none; }
  .afd-home-trust .afd-trust { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
  .afd-home-trust .afd-trust__item { min-height: 290px; padding: 32px 18px 34px; }
  .afd-home-trust .afd-trust__icon { width: 96px; height: 96px; flex-basis: 96px; }
  .afd-home-trust .afd-trust__icon .afd-ui-icon { width: 66px; height: 66px; }
  .afd-home-trust .afd-trust__title { margin-top: 2px; font-size: .94rem; }
  .afd-home-trust .afd-trust__text { font-size: .78rem; }
  .afd-home-cta {
    grid-template-columns: minmax(300px,.9fr) minmax(300px,.8fr) minmax(260px,.75fr);
    gap: 20px;
    min-height: 280px;
    padding: 30px 40px 0;
  }
  .afd-home-cta__copy { align-self: center; padding-bottom: 28px; }
  .afd-home-cta__visual { min-height: 250px; }
  .afd-home-cta__visual > img { width: 100%; height: 270px; }
  .afd-home-cta .afd-btn { grid-column: auto; align-self: center; width: 100%; min-width: 0; min-height: 68px; margin-bottom: 28px; font-size: .9rem; }
}
@media (min-width: 1200px) {
  .afd-home-trust { grid-template-columns: minmax(310px,.9fr) minmax(0,2.5fr); gap: 34px; min-height: 410px; padding: 52px 46px; }
  .afd-home-trust .afd-trust { gap: 20px; }
  .afd-home-trust .afd-trust__item { min-height: 300px; }
  .afd-home-cta { grid-template-columns: minmax(360px,1fr) minmax(380px,.9fr) minmax(300px,.8fr); padding-inline: 48px; }
  .afd-home-cta .afd-btn { font-size: 1rem; }
}


/* ---------- POPULAERE-KARRUSEL + MOBILREVISION v1.23.0 ---------- */
.afd-frontpage .afd-page img { max-width: 100%; }
.afd-home-hero,
.afd-home-popular,
.afd-home-trust,
.afd-home-cta,
.afd-guides-hero,
.afd-guides-empty { max-width: 100%; box-sizing: border-box; }
.afd-home-popular,
.afd-home-popular__track,
.afd-home-popular__track > *,
.afd-home-trust,
.afd-home-cta,
.afd-guides-hero { min-width: 0; }
.afd-home-popular {
  position: relative;
  padding: 20px 14px 18px;
  overflow: hidden;
  border-color: #F0E5D7;
  border-radius: 24px;
  background:
    radial-gradient(circle at 3% 0,rgba(240,144,14,.06),transparent 20%),
    linear-gradient(130deg,#FFFDF9,#FFF);
  box-shadow: 0 12px 34px rgba(14,39,71,.06);
}
.afd-home-popular__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}
.afd-home-popular__heading {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  gap: 12px;
}
.afd-home-popular__heading > div { min-width: 0; }
.afd-home-popular__icon {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border-radius: 50%;
  background: var(--afd-accent);
  box-shadow: 0 7px 18px rgba(240,144,14,.28);
}
.afd-home-popular__icon .afd-ui-icon {
  width: 27px;
  height: 27px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.afd-home-popular__heading h2 {
  margin: 1px 0 4px;
  color: var(--afd-navy);
  font-size: clamp(1.35rem,4vw,1.9rem);
  line-height: 1.18;
}
.afd-home-popular__heading p {
  margin: 0;
  color: var(--afd-text-muted);
  font-size: .75rem;
  line-height: 1.45;
}
.afd-home-popular__actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}
.afd-home-popular__actions > a {
  color: var(--afd-navy);
  font: 700 .78rem/1 var(--afd-font-heading);
  white-space: nowrap;
}
.afd-home-popular__actions > a span { margin-left: 5px; color: var(--afd-accent); font-size: 1rem; }
.afd-home-popular__actions > a:hover,
.afd-home-popular__actions > a:focus-visible { color: var(--afd-accent-hover); text-decoration: none; }
.afd-home-popular .afd-carousel-controls { display: flex; gap: 8px; }
.afd-home-popular .afd-carousel-controls button {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  box-sizing: border-box;
  padding: 0;
  aspect-ratio: 1;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: var(--afd-accent);
  color: #fff;
  box-shadow: 0 6px 16px rgba(240,144,14,.32);
  cursor: pointer;
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.afd-home-popular .afd-carousel-controls button .afd-carousel-chevron { width: 20px; height: 20px; }
.afd-home-popular .afd-carousel-controls button:hover,
.afd-home-popular .afd-carousel-controls button:focus-visible { background: var(--afd-accent-hover); transform: translateY(-1px); box-shadow: 0 10px 22px rgba(240,144,14,.42); }
.afd-home-popular .afd-carousel-controls button:disabled { opacity: .32; cursor: default; box-shadow: none; }
.afd-home-popular__track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scroll-padding-inline: 2px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  /* Lodret luft: overflow-x:auto tvinger overflow-y:auto, som ellers klipper
     kortets hover-loeft (-2px) og skygge i toppen. */
  padding: 8px 2px 6px;
}
.afd-home-popular__track::-webkit-scrollbar { display: none; }
.afd-home-popular__track .afd-card--product {
  display: flex;
  min-width: 0;
  /* Mobil: 2 fulde kort + ca. 0.3 af det tredje som scroll-nudge. */
  flex: 0 0 calc((100% - 24px)/2.3);
  flex-direction: column;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  box-shadow: 0 5px 18px rgba(14,39,71,.055);
}
.afd-home-popular .afd-card__img {
  height: 190px;
  aspect-ratio: auto;
  padding: 14px;
  border-right: 0;
  border-bottom: 1px solid var(--afd-border);
}
.afd-home-popular .afd-card__img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.afd-home-popular .afd-card__body {
  min-height: 205px;
  padding: 14px;
}
.afd-home-popular .afd-card__brand {
  display: inline-flex;
  align-self: flex-start;
  width: max-content;
  max-width: 100%;
  padding: 4px 8px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--afd-bg-alt);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.afd-home-popular .afd-card__title {
  display: -webkit-box;
  min-height: 3.9em;
  overflow: hidden;
  font-size: .78rem;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.afd-home-popular .afd-card__price { font-size: 1.12rem; }
.afd-home-popular .afd-card__meta { font-size: .7rem; }
/* Mobil: samme stil som tilbudskortene = synlig CTA-knap nederst. Pris taet
   under titlen; CTA pinnet til bunden (margin-top:auto) saa ALLE CTA'er staar
   samme sted paa de lige hoeje (flex-stretch) kort. */
.afd-home-popular .afd-card__footer { margin-top: 10px; padding-top: 0; }
/* Kompakte kort: CTA'en er for smal til logo + tekst + pil (2,3 kort/mobil).
   Vi dropper det dekorative butikslogo, centrerer og holder "Til butik" paa
   EN linje (ejer-krav 2026-07-20). Pilen bevares som CTA-affordance. */
.afd-home-popular .afd-card__cta { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 50px; margin-top: auto; padding: 9px 6px; font-size: .8rem; }
.afd-home-popular .afd-card__cta .afd-card__merchant,
.afd-home-popular .afd-card__cta > span:last-child { display: none; }
.afd-home-popular__dots {
  display: flex;
  min-height: 30px;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  padding-top: 14px;
}
.afd-home-popular__dots button {
  width: 20px;
  height: 4px;
  padding: 0;
  border: 0;
  border-radius: 99px;
  background: #E5E7EB;
  cursor: pointer;
  transition: width .18s ease, background .18s ease;
}
.afd-home-popular__dots button.is-active { width: 42px; background: var(--afd-accent); }

/* Bedst ratede foder: genbruger populaer-sektionens kort og bane, med fanerad. */
.afd-home-rated {
  position: relative;
  /* Samme luft mellem sektioner som de oevrige baand (manglede foer, saa
     "Bedst bedoemte foder" klaebede til populaere, ejer-rapport 2026-07-20). */
  margin-top: 14px;
  padding: 20px 14px 18px;
  overflow: hidden;
  border-color: #F0E5D7;
  border-radius: 24px;
  background:
    radial-gradient(circle at 97% 0,rgba(14,39,71,.05),transparent 22%),
    linear-gradient(130deg,#FFFDF9,#FFF);
  box-shadow: 0 12px 34px rgba(14,39,71,.06);
}
.afd-home-rated__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px 14px;
  margin-bottom: 14px;
}
.afd-home-rated__head h2 {
  margin: 1px 0 0;
  color: var(--afd-navy);
  font-size: clamp(1.35rem,4vw,1.9rem);
  line-height: 1.18;
}
.afd-home-rated__note {
  max-width: 260px;
  margin: 0;
  color: var(--afd-text-muted);
  font-size: .75rem;
  line-height: 1.45;
}
.afd-home-rated__tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  padding-bottom: 2px;
}
.afd-home-rated__tabs::-webkit-scrollbar { display: none; }
.afd-home-rated__tab {
  flex: 0 0 auto;
  padding: 8px 16px;
  border: 1px solid var(--afd-border);
  border-radius: 999px;
  background: var(--afd-bg);
  color: var(--afd-navy);
  font: 700 .82rem/1 var(--afd-font-heading);
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.afd-home-rated__tab:hover,
.afd-home-rated__tab:focus-visible { border-color: var(--afd-accent); color: var(--afd-accent-hover); }
.afd-home-rated__tab.is-active {
  border-color: var(--afd-accent);
  background: var(--afd-accent);
  color: #fff;
  box-shadow: 0 6px 16px rgba(240,144,14,.28);
}
.afd-home-rated__track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scroll-padding-inline: 2px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  padding: 8px 2px 6px;
}
.afd-home-rated__track[hidden] { display: none; }
.afd-home-rated__track::-webkit-scrollbar { display: none; }
.afd-home-rated__track .afd-card--product {
  display: flex;
  min-width: 0;
  flex: 0 0 calc((100% - 24px)/2.3);
  flex-direction: column;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  box-shadow: 0 5px 18px rgba(14,39,71,.055);
}
.afd-home-rated .afd-card__img {
  height: 190px;
  aspect-ratio: auto;
  padding: 14px;
  border-right: 0;
  border-bottom: 1px solid var(--afd-border);
}
.afd-home-rated .afd-card__img img { width: 100%; height: 100%; object-fit: contain; }
.afd-home-rated .afd-card__body { min-height: 205px; padding: 14px; }
.afd-home-rated .afd-card__title {
  display: -webkit-box;
  min-height: 3.9em;
  overflow: hidden;
  font-size: .78rem;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.afd-home-rated .afd-card__price { font-size: 1.12rem; }
.afd-home-rated .afd-card__meta { font-size: .7rem; }
.afd-home-rated .afd-card__footer { margin-top: 10px; padding-top: 0; }
.afd-home-rated .afd-card__cta { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 50px; margin-top: auto; padding: 9px 6px; font-size: .8rem; }
.afd-home-rated .afd-card__cta .afd-card__merchant,
.afd-home-rated .afd-card__cta > span:last-child { display: none; }
.afd-badge--rating { display: inline-flex; align-items: center; gap: 4px; background: var(--afd-navy); color: #fff; }
.afd-badge__star { font-size: .82rem; line-height: 1; color: #FFC53D; }

/* Mobilrevision: de fire tillidskort swipes i stedet for at skabe en meget lang side. */
.afd-home-trust .afd-trust {
  display: flex;
  grid-template-columns: none;
  gap: 12px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
}
.afd-home-trust .afd-trust::-webkit-scrollbar { display: none; }
.afd-home-trust .afd-trust__item {
  min-height: 230px;
  flex: 0 0 min(80vw,285px);
  scroll-snap-align: start;
}
/* break-word (ikke anywhere): braek KUN naar et ord er bredere end linjen,
   aldrig midt i et normalt ord ("gennemsk/ue"-fejlen, 2026-07-20). */
.afd-home-cta__copy h2,
.afd-home-trust h2,
.afd-guides-hero h1,
.afd-guides-empty__copy h2 { overflow-wrap: break-word; }
.afd-home-cta__visual > img { height: auto; max-height: 190px; }

/* Mobilrevision: Flere emner bliver en swipebar og kan ikke klippes af overflow. */
.afd-guides-topics {
  display: block;
  min-width: 0;
}
.afd-guides-topics__label { margin-bottom: 10px; }
.afd-guides-topics__rail { padding-bottom: 8px; overscroll-behavior-inline: contain; touch-action: pan-x pan-y; }
.afd-guides-topics__more { display: flex; align-items: center; }
.afd-guides-topics__more[open] { align-items: flex-start; }
.afd-guides-topics__menu {
  position: static;
  display: flex;
  min-width: 0;
  gap: 8px;
  padding: 0 0 0 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.afd-guides-topics__menu .afd-guides-topics__pill { width: auto; }
.afd-guides-hero__media img { height: auto; max-height: 260px; }
.afd-guides-empty__copy { min-width: 0; }

@media (min-width: 600px) {
  .afd-home-popular { padding: 24px 20px 20px; }
  .afd-home-popular__track .afd-card--product { flex-basis: calc((100% - 12px)/2); }
  .afd-home-popular .afd-card__img { height: 210px; }
  .afd-home-rated { padding: 24px 20px 20px; }
  .afd-home-rated__track .afd-card--product { flex-basis: calc((100% - 12px)/2); }
  .afd-home-rated .afd-card__img { height: 210px; }
  .afd-home-trust .afd-trust {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    overflow: visible;
  }
  .afd-home-trust .afd-trust__item { min-height: 230px; }
  .afd-home-cta__visual > img { max-height: 235px; }
}
@media (min-width: 900px) {
  .afd-home-popular { padding: 30px 26px 22px; }
  .afd-home-popular__head { margin-bottom: 22px; }
  .afd-home-popular__heading p { font-size: .8rem; }
  .afd-home-popular__actions { gap: 12px; }
  .afd-home-popular__track .afd-card--product { flex-basis: calc((100% - 36px)/4); }
  .afd-home-popular .afd-card__img { height: 210px; }
  .afd-home-popular .afd-card__body { min-height: 220px; }
  .afd-home-rated { padding: 30px 26px 22px; }
  .afd-home-rated__track .afd-card--product { flex-basis: calc((100% - 36px)/4); }
  .afd-home-rated .afd-card__img { height: 210px; }
  .afd-home-rated .afd-card__body { min-height: 220px; }
  .afd-home-trust .afd-trust { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .afd-home-trust .afd-trust__item { min-height: 290px; }
  .afd-home-cta__visual > img { max-height: 270px; }
  .afd-guides-topics { display: flex; }
  .afd-guides-topics__label { margin-bottom: 0; }
  .afd-guides-topics__rail { padding-bottom: 2px; }
  .afd-guides-topics__more { display: block; }
  .afd-guides-topics__menu {
    position: absolute;
    display: grid;
    min-width: 190px;
    padding: 10px;
    border: 1px solid var(--afd-border);
    border-radius: 16px;
    background: var(--afd-bg);
    box-shadow: var(--afd-shadow-md);
  }
  .afd-guides-topics__menu .afd-guides-topics__pill { width: 100%; }
}
@media (min-width: 1200px) {
  .afd-home-popular { padding: 34px 28px 24px; }
  .afd-home-popular__track .afd-card--product { flex-basis: calc((100% - 60px)/6); }
  .afd-home-popular .afd-card__img { height: 220px; }
  .afd-home-popular .afd-card__body { min-height: 230px; }
  .afd-home-rated { padding: 34px 28px 24px; }
  .afd-home-rated__track .afd-card--product { flex-basis: calc((100% - 60px)/6); }
  .afd-home-rated .afd-card__img { height: 220px; }
  .afd-home-rated .afd-card__body { min-height: 230px; }
}


/* ---------- PRODUKTTOP v1.24: trustpilot-kompakt, endelig cascade ---------- */
.afd-product-page-shell { max-width: 1040px; }
.afd-product-page-shell .afd-product-hero { align-items: start; gap: 16px; margin-bottom: 10px; }
.afd-product-page-shell .afd-phero__media { min-height: 0; padding: 8px; border-radius: 14px; box-shadow: 0 8px 22px rgba(14,39,71,.07); }
.afd-product-page-shell .afd-phero__imgbox { height: 220px; min-height: 220px; padding: 6px; }
.afd-product-page-shell .afd-phero__imgbox .afd-phero__main-image { height: 100%; max-height: 220px; }
.afd-product-page-shell .afd-phero__gallery { gap: 5px; padding-top: 6px; grid-auto-columns: 42px; }
.afd-product-page-shell .afd-phero__thumb { width: 42px; height: 42px; border-radius: 8px; }
.afd-product-page-shell .afd-phero__info { align-self: start; min-height: 0; padding: 0; }
.afd-product-page-shell .afd-phero__meta { gap: 5px; margin: 0 0 4px; }
.afd-product-page-shell .afd-phero__brand,
.afd-product-page-shell .afd-phero__cat,
.afd-product-page-shell .afd-phero__updated { font-size: 8px; letter-spacing: .65px; }
.afd-product-page-shell .afd-phero__info h1 {
  display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  margin: 0 0 4px; font-size: clamp(1.32rem,2vw,1.72rem); line-height: 1.04; letter-spacing: -.035em;
}
.afd-product-page-shell .afd-phero__desc {
  -webkit-line-clamp: 2; margin: 0; font-size: .75rem; line-height: 1.34;
}
.afd-product-page-shell .afd-readmore { min-height: 23px; margin: 0; font-size: .64rem; }
.afd-product-page-shell .afd-variants { gap: 3px; margin: 3px 0; }
.afd-product-page-shell .afd-variants__label { font-size: .68rem; margin: 0; }
.afd-product-page-shell .afd-variants__button { min-width: 64px; min-height: 34px; padding: 3px 7px; border-radius: 8px; }
.afd-product-page-shell .afd-variants__button strong { font-size: .75rem; }
.afd-product-page-shell .afd-variants__button small { font-size: .55rem; }
.afd-product-page-shell .afd-icon-grid {
  grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; margin: 3px 0;
}
.afd-product-page-shell .afd-icon-grid .afd-ig__item:nth-child(n+4) { display: none; }
.afd-product-page-shell .afd-ig__item { min-height: 31px; padding: 3px 6px; border-radius: 8px; font-size: .61rem; }
.afd-product-page-shell .afd-ig__ico { width: 20px; height: 20px; }
.afd-product-page-shell .afd-ig__ico svg { width: 11px; height: 11px; }
.afd-product-page-shell .afd-pricecard { margin-top: 3px; padding: 8px 10px; border-radius: 11px; box-shadow: 0 7px 18px rgba(14,39,71,.13); }
.afd-product-page-shell .afd-pricecard__label { margin-bottom: 2px; font-size: 7px; }
.afd-product-page-shell .afd-pricecard__row { margin-bottom: 4px; gap: 8px; }
.afd-product-page-shell .afd-pricecard__price { font-size: 23px; }
.afd-product-page-shell .afd-pricecard__old { font-size: 11px; }
.afd-product-page-shell .afd-pricecard__save { padding: 3px 7px; font-size: 8px; }
.afd-product-page-shell .afd-pricecard__low30 { margin-top: 1px; font-size: 8px; }
.afd-product-page-shell .afd-cta-main { min-height: 36px; padding: 7px 10px; border-radius: 8px; font-size: 11px; }
.afd-product-page-shell .afd-cta-main__logo { width: 26px; height: 26px; }
.afd-product-page-shell .afd-phero__drop { width: 48px; height: 48px; top: 8px; right: 8px; }
.afd-product-page-shell .afd-phero__drop b { font-size: 13px; }
.afd-product-page-shell .afd-phero__drop small { font-size: 7px; }
.afd-product-page-shell + .afd-product-jumps,
.afd-product-page-shell .afd-product-jumps { max-width: 1040px; }
.afd-product-jumps a { min-height: 36px; padding: 8px 14px; font-size: .69rem; }

/* Cross-landinger: struktureret redaktionelt indhold i stedet for tekstblok. */
/* Disclosure over heroen, under breadcrumbs, i lille skrift (ejer-krav). */
.afd-cross-topnote .afd-disclosure { font-size: .72rem; margin: 2px 0 12px; }
/* Prisernes friskhed staar OVER heroen som en diskret linje, saa heroens
   noegletal kan noejes med tre paa EN raekke (ejer-krav 2026-07-27). */
.afd-cross-topnote__fresh { display: inline-block; margin: 2px 0 10px; color: var(--afd-text); font-size: .72rem; }
.afd-cross-hero { margin-bottom: 22px; padding: clamp(18px, 4vw, 28px); border: 1px solid #F0DFCF; border-radius: 22px; background: linear-gradient(130deg,#FFF9F1,#fff); }
.afd-cross-hero__head { display: grid; gap: 14px; }
.afd-cross-hero h1 { max-width: 850px; margin: 0; font-size: clamp(2rem,4vw,3.45rem); }
.afd-cross-hero__intro { max-width: 820px; color: #526173; }
.afd-cross-hero__intro > :last-child { margin-bottom: 0; }

.afd-guide-nudge {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: 520px;
  margin-top: 16px;
  padding: 9px 10px 9px 9px;
  border: 1px solid rgba(240, 144, 14, .24);
  border-left: 3px solid var(--afd-accent);
  border-radius: 13px;
  background: linear-gradient(105deg, rgba(255, 244, 226, .96), rgba(255, 255, 255, .92));
  color: var(--afd-navy);
  box-shadow: 0 7px 20px rgba(14, 39, 71, .06);
  text-decoration: none;
  transform: translateY(0);
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.afd-guide-nudge:hover {
  border-color: rgba(240, 144, 14, .58);
  background: linear-gradient(105deg, #FFF0D7, #FFFFFF);
  color: var(--afd-navy);
  box-shadow: 0 10px 24px rgba(14, 39, 71, .1);
  text-decoration: none;
  transform: translateY(-1px);
}
.afd-guide-nudge:focus-visible {
  border-color: var(--afd-accent);
  outline: 3px solid rgba(240, 144, 14, .2);
  outline-offset: 2px;
  text-decoration: none;
}
.afd-guide-nudge__icon,
.afd-guide-nudge__arrow {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.afd-guide-nudge__icon {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(240, 144, 14, .16);
  border-radius: 11px;
  background: rgba(255, 255, 255, .9);
}
.afd-guide-nudge__icon .afd-ui-icon {
  width: 31px;
  height: 31px;
  object-fit: contain;
}
.afd-guide-nudge__copy {
  display: grid;
  min-width: 0;
  gap: 1px;
  line-height: 1.25;
}
.afd-guide-nudge__copy small {
  color: #B85F00;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .1em;
  line-height: 1.15;
  text-transform: uppercase;
}
.afd-guide-nudge__copy strong {
  color: var(--afd-navy);
  font-size: .84rem;
  font-weight: 750;
  line-height: 1.3;
}
.afd-guide-nudge__arrow {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: var(--afd-accent);
  color: #FFFFFF;
  box-shadow: 0 5px 12px rgba(240, 144, 14, .2);
  transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.afd-guide-nudge__arrow svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.afd-guide-nudge:hover .afd-guide-nudge__arrow {
  background: var(--afd-accent-hover);
  box-shadow: 0 7px 15px rgba(214, 125, 8, .28);
  transform: translateX(2px);
}
@media (min-width: 600px) {
  .afd-guide-nudge { width: fit-content; }
}
/* Hero i to kolonner (ejerens reference): venstre indhold, hoejre noegletal-
   sidebar med ikon-cirkler og delelinjer (STIL 6.8). */
.afd-cross-hero--split { display: grid; grid-template-columns: 1fr; gap: 22px; }
.afd-cross-hero__main > :last-child { margin-bottom: 0; }
.afd-cross-hero__stats { display: flex; flex-direction: column; justify-content: center; }
.afd-cross-hero__stat { display: flex; align-items: center; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--afd-border); }
.afd-cross-hero__stat:last-child { border-bottom: 0; }
.afd-cross-hero__stat-icon { flex: 0 0 46px; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border: 1px solid var(--afd-border); border-radius: 50%; background: rgba(255,255,255,.9); }
.afd-cross-hero__stat-icon img { width: 24px; height: 24px; }
.afd-cross-hero__stat-text strong { display: block; color: var(--afd-navy-deep); font: 800 1.3rem/1.15 var(--afd-font-heading); }
.afd-cross-hero__stat-text span { display: block; margin-top: 3px; color: var(--afd-text-muted); font-size: .78rem; }
/* Fuld bredde (ejer-krav 2026-07-17): OBS-boks og koebsguide flugter med
   hero og katalog paa landingssiden, ingen indrykkede smalle kasser. */
.afd-cross-editorial { max-width: none; margin: 30px 0; padding: clamp(22px,4vw,42px); border: 1px solid var(--afd-border); border-radius: 22px; background: #fff; box-shadow: 0 10px 30px rgba(14,39,71,.05); }
.afd-cross-editorial__head { margin-bottom: 28px; padding-bottom: 18px; border-bottom: 1px solid var(--afd-border); }
/* Luft i koebsguiden (ejer-krav 2026-07-17): generoese afstande mellem
   overskrifter, afsnit, trin, lister og tabeller; aldrig proppet. */
.afd-cross-editorial__content { max-width: none; }
.afd-cross-editorial__content h3 { margin: 44px 0 14px; font-size: clamp(1.12rem,2vw,1.35rem); }
.afd-cross-editorial__content > :first-child { margin-top: 0; }
.afd-cross-editorial__content p { margin: 0 0 18px; line-height: 1.75; }
.afd-cross-editorial__content ul,
.afd-cross-editorial__content ol { margin: 0 0 28px; padding-left: 22px; }
.afd-cross-editorial__content li { margin-bottom: 10px; line-height: 1.65; }
.afd-cross-editorial__content h4 { margin: 28px 0 10px; font-size: 1.02rem; }
.afd-cross-editorial__content .afd-table-scroll { margin: 6px 0 32px; border: 1px solid var(--afd-border); border-radius: 12px; }
/* Koebsguide-tabellen (ejer-krav: flottere og mere UX-venlig): navy
   thead, zebra-striber, hover-fremhaevning og foerste kolonne i navy 600
   saa raekkerne kan skimmes. Alt i eksisterende tokens. */
.afd-cross-editorial__content table { width: 100%; border-collapse: collapse; font-size: var(--afd-fs-small); background: #fff; }
.afd-cross-editorial__content th,
.afd-cross-editorial__content td { text-align: left; padding: 13px 16px; border-bottom: 1px solid var(--afd-border); vertical-align: top; }
.afd-cross-editorial__content thead th { background: var(--afd-navy); color: #fff; font-weight: 600; white-space: nowrap; letter-spacing: .2px; }
.afd-cross-editorial__content tbody tr:nth-child(even) td { background: var(--afd-bg-alt); }
.afd-cross-editorial__content tbody tr:hover td { background: var(--afd-accent-soft); }
.afd-cross-editorial__content tbody td:first-child { font-weight: 600; color: var(--afd-navy); }
.afd-cross-editorial__content tbody tr:last-child td { border-bottom: 0; }
.afd-cross-editorial__content ol { counter-reset: afd-steps; list-style: none; padding-left: 0; }
.afd-cross-editorial__content ol > li { counter-increment: afd-steps; position: relative; padding-left: 40px; margin-bottom: 14px; }
.afd-cross-editorial__content ol > li::before { content: counter(afd-steps); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--afd-navy); color: #fff; font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
/* OBS-boks: fuld bredde, INGEN farvet venstre-stribe, eget upload-ikon i
   cirkel (samme opskrift som hero-noegletallene: 46px, 1px kant, 24px ikon). */
.afd-cross-obs { max-width: none; border-left: 1px solid var(--afd-border); display: flex; align-items: flex-start; gap: 16px; }
.afd-cross-obs__icon { flex: 0 0 46px; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border: 1px solid var(--afd-border); border-radius: 50%; background: var(--afd-bg-alt); }
.afd-cross-obs__icon img { width: 24px; height: 24px; }
.afd-cross-obs__body { min-width: 0; }
.afd-cross-obs p { margin: 0; line-height: 1.6; }
.afd-cross-editorial__content ul { list-style: none; padding-left: 0; }
.afd-cross-editorial__content ul > li { position: relative; padding-left: 22px; margin-bottom: 8px; }
.afd-cross-editorial__content ul > li::before { content: ''; position: absolute; left: 4px; top: 0.55em; width: 8px; height: 8px; border-radius: 50%; background: var(--afd-accent); }
.afd-cross-editorial__content li > strong:first-child { color: var(--afd-navy); }
.afd-cross-catalog { display: grid; gap: 20px; align-items: start; }
.afd-cross-catalog__main { min-width: 0; }
.afd-cross-filters { overflow: hidden; padding: 0; border: 1px solid rgba(20,51,92,.12); border-radius: var(--afd-radius-module); background: #fff; box-shadow: 0 12px 32px rgba(14,39,71,.08); }
/* Mobil: filtrene er en lukket <details> (produkterne foerst). Paa desktop
   er den ydre ramme permanent aaben og ikke et betjenbart accordion; kun de
   enkelte facet-grupper kan foldes sammen. Mobilpanelet starter lukket,
   og aktive valg bevares uafhaengigt af panelets synlighed. */
.afd-cross-filters__summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 54px; padding: 14px 18px; border-bottom: 1px solid transparent; background: linear-gradient(180deg,#fff 0%,var(--afd-bg-alt) 100%); cursor: pointer; list-style: none; }
.afd-cross-filters__details[open] > .afd-cross-filters__summary { border-bottom-color: rgba(20,51,92,.1); }
.afd-cross-filters__summary::-webkit-details-marker { display: none; }
.afd-cross-filters__summary em { font-style: normal; font-size: var(--afd-fs-small); color: var(--afd-accent-hover); }
.afd-cross-filters__chev { display: inline-flex; color: var(--afd-navy); transition: transform .15s ease; }
.afd-cross-filters__details[open] .afd-cross-filters__chev { transform: rotate(180deg); }
.afd-cross-filters__body { padding: 8px 18px 18px; }
.afd-cross-filters__group:first-of-type { border-top: 0; }
.afd-cross-filters__group:first-of-type legend { padding-top: 0; }
.afd-cross-filters__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.afd-cross-filters__title { font-family: var(--afd-font-heading); font-weight: 700; color: var(--afd-navy); }
.afd-cross-filters__reset-label { font-size: var(--afd-fs-small); font-weight: 600; color: var(--afd-navy); text-transform: uppercase; letter-spacing: .4px; }
.afd-cross-filters__reset { font-size: var(--afd-fs-small); color: var(--afd-accent-hover); }
.afd-cross-filters__group { border: 0; padding: 14px 0 0; margin: 0; border-top: 1px solid rgba(20,51,92,.1); }
/* Dyr er det vigtigste valg paa brede sammenligninger og staar foer pris. */
.afd-cross-filters__group--dyr { margin: 0; padding: 2px 0 10px; border-top: 0; background: #fff; }
.afd-cross-filters__group--dyr .afd-cross-filters__legend { color: var(--afd-navy); font-weight: 800; }
.afd-cross-filters__rail { display: none; }
.afd-cross-filters__group--price { border-top: 0; }
.afd-cross-filters__group legend { padding-top: 12px; font-weight: 600; color: var(--afd-navy); font-size: var(--afd-fs-small); text-transform: uppercase; letter-spacing: .4px; }
.afd-cross-filters__range { display: flex; align-items: center; gap: 8px; margin: 8px 0 10px; }
.afd-cross-filters__range input { width: 100%; min-width: 0; min-height: 44px; padding: 9px 11px; border: 1px solid rgba(20,51,92,.16); border-radius: 10px; background: #fff; color: var(--afd-text); font-size: var(--afd-fs-small); box-shadow: inset 0 1px 2px rgba(14,39,71,.035); }
.afd-cross-filters__range input:focus { border-color: var(--afd-accent); box-shadow: 0 0 0 3px rgba(249,144,0,.14); outline: 0; }
.afd-cross-filters__range span { color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-cross-filters__bands { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.afd-cross-filters__band { padding: 6px 11px; border: 1px solid rgba(20,51,92,.14); border-radius: 999px; background: #fff; font-size: 12px; color: var(--afd-text); transition: border-color .15s ease,background-color .15s ease,color .15s ease; }
.afd-cross-filters__band:hover { border-color: var(--afd-navy); }
.afd-cross-filters__band.is-active { background: var(--afd-navy); border-color: var(--afd-navy); color: #fff; }
.afd-cross-filters__checks { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
/* Facet-grupper (brand + hver pSEO-dimension) er sammenklappelige, saa 10
   grupper ikke bliver en uendelig soejle. Egen chevron-klasse: den ydre
   .afd-cross-filters__details[open]-regel maa ikke rotere gruppernes pile. */
.afd-cross-filters__group--acc { padding-bottom: 10px; }
.afd-cross-filters__legend { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 42px; padding: 10px 2px 4px; color: var(--afd-navy); font-size: var(--afd-fs-small); font-weight: 700; letter-spacing: .45px; text-transform: uppercase; cursor: pointer; list-style: none; }
.afd-cross-filters__legend::-webkit-details-marker { display: none; }
.afd-cross-filters__legend em { font-style: normal; color: var(--afd-accent-hover); text-transform: none; letter-spacing: 0; }
.afd-cross-filters__gchev { display: inline-flex; flex: 0 0 auto; color: var(--afd-navy); transition: transform .15s ease; }
.afd-cross-filters__group--acc[open] .afd-cross-filters__gchev { transform: rotate(180deg); }
/* REN TEKST, ingen boks (ejer-krav 2026-07-27). Astras knap-styling tegnede en
   orange fyldt kasse med sin egen padding bag teksten; her nulstilles alt, saa
   der KUN staar orange tekst. Den haarde nulstilling ligger i Astra-sektionen. */
.afd-cross-filters__more { align-self: flex-start; margin-top: 2px; padding: 4px 0; border: 0; background: none; color: var(--afd-accent-hover); font: 600 var(--afd-fs-small) var(--afd-font-body); text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }

.afd-cross-filters__checks label { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 7px 8px; border-radius: 9px; font-size: var(--afd-fs-small); line-height: 1.25; cursor: pointer; transition: background-color .15s ease,color .15s ease; }
.afd-cross-filters__checks label:hover { background: var(--afd-bg-alt); color: var(--afd-navy); }
.afd-cross-filters__checks label:has(input:checked) { background: rgba(249,144,0,.09); color: var(--afd-navy); font-weight: 650; }
.afd-cross-filters__checks input[type="checkbox"] { flex: 0 0 18px; width: 18px; height: 18px; margin: 0; accent-color: var(--afd-accent); }
.afd-cross-filters__checks label span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.afd-cross-filters__checks label small { flex: 0 0 auto; min-width: 28px; padding: 3px 7px; border-radius: 999px; background: var(--afd-bg-alt); color: var(--afd-text-muted); font-size: 11px; line-height: 1.2; text-align: center; }
.afd-cross-filters__checks label:has(input:checked) small { background: #fff; color: var(--afd-navy); }
.afd-cross-filters__apply { width: 100%; margin-top: 14px; }
.afd-cross-catalog__main > .afd-toolbar,
.afd-cross-catalog__main > .afd-grid,
.afd-cross-catalog__main > .afd-loadmore,
.afd-cross-catalog__main > .afd-pagination,
.afd-cross-catalog__main > .afd-empty { transition: opacity .16s ease; }
.afd-cross-catalog { overflow-anchor: none; }
.afd-cross-catalog.is-filtering { cursor: progress; }
.afd-cross-catalog.is-filtering .afd-cross-catalog__main > .afd-toolbar,
.afd-cross-catalog.is-filtering .afd-cross-catalog__main > .afd-grid,
.afd-cross-catalog.is-filtering .afd-cross-catalog__main > .afd-loadmore,
.afd-cross-catalog.is-filtering .afd-cross-catalog__main > .afd-pagination,
.afd-cross-catalog.is-filtering .afd-cross-catalog__main > .afd-empty { opacity: .52; pointer-events: none; }
@media (min-width: 900px) {
	.afd-cross-catalog { grid-template-columns: 260px minmax(0, 1fr); }
	/* Desktop bruger en egen ALTID synlig rail, fordi browser-/Windows-
	   indstillingen ellers kan skjule native scrollbars indtil hover. Body er
	   stadig den eneste rigtige scrollcontainer; rail/thumb spejler den via JS. */
	.afd-cross-filters { position: sticky; top: 16px; height: calc(100vh - 32px); max-height: calc(100vh - 32px); overflow: hidden; }
	.afd-cross-filters__details[open] { display: flex; flex-direction: column; height: 100%; max-height: 100%; }
	.afd-cross-filters__details[open] .afd-cross-filters__body { display: block; flex: 1 1 0; min-height: 0; overflow-x: hidden; overflow-y: scroll; overscroll-behavior-y: auto; scrollbar-width: none; }
	.afd-cross-filters__details[open] .afd-cross-filters__body::-webkit-scrollbar { display: none; width: 0; height: 0; }
	.afd-cross-filters__rail { position: absolute; z-index: 3; top: 62px; right: 5px; bottom: 8px; display: block; width: 10px; border-radius: 999px; background: rgba(20,51,92,.1); cursor: pointer; }
	.afd-cross-filters__rail[hidden] { display: none; }
	.afd-cross-filters__thumb { position: absolute; top: 0; left: 1px; width: 8px; min-height: 48px; border-radius: 999px; background: var(--afd-navy); box-shadow: 0 1px 3px rgba(14,39,71,.22); cursor: grab; touch-action: none; }
	.afd-cross-filters__thumb:hover { background: var(--afd-navy-deep); }
	.afd-cross-filters__thumb:active { cursor: grabbing; }
}

@media (min-width: 600px) {
  .afd-product-page-shell .afd-phero__imgbox { height: 235px; min-height: 235px; }
  .afd-product-page-shell .afd-phero__imgbox .afd-phero__main-image { max-height: 235px; }
}
@media (min-width: 900px) {
	.afd-cross-hero--split { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 34px; }
	.afd-cross-hero__stats { border-left: 1px solid var(--afd-border); padding-left: 30px; }
}
@media (min-width: 900px) {
  .afd-product-page-shell .afd-product-hero { grid-template-columns: minmax(0,.82fr) minmax(0,1.18fr); gap: 18px; }
  .afd-product-page-shell .afd-phero__media { position: static; }
  .afd-product-page-shell .afd-phero__imgbox { height: 245px; min-height: 245px; }
  .afd-product-page-shell .afd-phero__imgbox .afd-phero__main-image { max-height: 245px; }
  .afd-product-page-shell .afd-phero__info h1 { font-size: clamp(1.4rem,1.75vw,1.7rem); }
  .afd-product-page-shell .afd-phero__desc { -webkit-line-clamp: 1; }
  .afd-cross-hero__head { grid-template-columns: minmax(0,1fr) auto; align-items: end; }
}
@media (min-width: 1200px) {
  .afd-product-page-shell .afd-product-hero { grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 20px; }
  .afd-product-page-shell .afd-phero__imgbox { height: 255px; min-height: 255px; }
  .afd-product-page-shell .afd-phero__imgbox .afd-phero__main-image { max-height: 255px; }
}


/* ---------- VISUEL QA v1.25: afsluttende sandhed for de aftalte sider ---------- */
body.afd-page .afd-home-product-rail a:hover,
body.afd-page .afd-home-popular a:hover,
body.afd-page .afd-home-cta a:hover,
body.afd-page .afd-guides-page a:hover,
body.afd-page .afd-merchant-hero a:hover,
body.afd-page .afd-product-hero a:hover,
body.afd-page .afd-product-jumps a:hover,
body.afd-page .afd-offers a:hover,
body.afd-page .afd-tabs a:hover,
body.afd-page .afd-proscons a:hover { text-decoration: none; }

/* Forsidehero: det aftalte Hero-dd.webp får en rolig, fast billedflade. */
.afd-home-hero { grid-template-columns: 1fr; gap: 20px; min-height: 0; padding: 28px 22px 22px; }
.afd-home-hero__content { align-self: center; min-width: 0; }
.afd-home-hero__content h1 { max-width: 680px; font-size: clamp(2.25rem,8vw,4.25rem); line-height: .98; }
.afd-home-hero__content > p { max-width: 620px; }
/* 2026-07-20: dyrebilledet er rammefrit og flyder ind i heroen (ingen egen boks). */
.afd-home-hero__visual {
  position: relative; display: grid; width: 100%; height: 250px; min-height: 0;
  place-items: end center; overflow: visible; border: 0; border-radius: 0;
  background: none;
}
.afd-home-hero__image {
  display: block; width: 100%; height: 100%; max-height: none;
  object-fit: contain; object-position: center bottom;
  filter: drop-shadow(0 18px 26px rgba(14,39,71,.14));
}
.afd-home-benefits { align-items: stretch; }
.afd-home-benefits li { min-width: 0; }

/* Kategorier: kompakt karrusel uden store tomme billedfelter. */
.afd-home-animal-carousel { margin-top: 14px; padding: 16px 14px; }
.afd-home-animal-carousel__head { margin-bottom: 12px; }
.afd-home-animal-nav a { min-height: 112px; grid-template-rows: 58px auto auto; padding: 7px 8px 10px; }
.afd-home-animal-nav__media { width: 56px; height: 56px; }
.afd-home-animal-nav a strong { margin-top: 4px; }

/* Dagens prisblik: billedet har sit eget nederste felt og kan aldrig dække CTA'en. */
/* padding-top giver plads til kortenes hover-loeft (overflow-y klipper ellers toppen). */
.afd-home-product-rail { align-items: stretch; gap: 12px; margin-top: 8px; padding-top: 8px; }
.afd-home-deal-promo,
.afd-home-product-rail__track .afd-card--product { box-sizing: border-box; }
/* Dagens prisblik (2026-07-20): flex-kolonne = copy, billede, saa RIGTIG CTA-knap
   nederst med pulserende pil. Billedet daekker aldrig knappen. */
.afd-home-deal-promo {
  isolation: isolate; min-height: 320px; padding: 24px 22px 22px;
  display: flex; flex-direction: column; align-items: stretch;
}
.afd-home-deal-promo__copy { position: relative; z-index: 3; max-width: 100%; padding-bottom: 0; }
.afd-home-deal-promo__copy h2 { max-width: 230px; margin-bottom: 10px; font-size: 2.05rem; line-height: 1.04; overflow-wrap: break-word; }
.afd-home-deal-promo__copy p { max-width: 250px; margin-bottom: 0; font-size: .95rem; line-height: 1.5; color: rgba(255,255,255,.82); }
.afd-home-deal-promo__image {
  position: absolute; z-index: 0; left: 0; right: 0; bottom: 0;
  width: 100%; height: 42%; max-height: none; margin: 0;
  object-fit: contain; object-position: center bottom; opacity: .22; pointer-events: none;
}
/* Navy-slør OVER billedet (men UNDER copy/CTA): garanterer at den hvide tekst
   ALTID er laesbar, uanset om billedet har lyse/hvide flader (ejer-krav 2026-07-20:
   teksten forrest, aldrig skjult af den "usynlige hvide kasse"). Taet navy hele
   vejen ned gennem tekstzonen (0 til 68 %), fader foerst i bunden hvor kun billedet
   bag den ugennemsigtige CTA-knap staar. */
.afd-home-deal-promo__scrim {
  position: absolute; z-index: 1; inset: 0; pointer-events: none; border-radius: inherit;
  background: linear-gradient(to bottom, rgba(10,45,85,.96) 0%, rgba(10,45,85,.92) 55%, rgba(10,45,85,.6) 78%, rgba(10,45,85,.2) 92%, transparent 100%);
}
/* Copy SKAL ligge over sloeret: ".afd-home-deal-promo > div" (specificitet 0,1,1)
   vandt ellers over "__copy" (0,1,0) og satte z-index 2; her tvinges den hoejere. */
.afd-home-deal-promo .afd-home-deal-promo__copy { position: relative; z-index: 3; }
/* Hoejere specificitet end ".afd-home-deal-promo .afd-btn" saa knap-teksten bliver stor. */
.afd-home-deal-promo .afd-home-deal-promo__cta {
  position: relative; z-index: 4; margin-top: auto; width: 100%;
  justify-content: center; gap: 10px; min-height: 56px; font-size: 1rem; letter-spacing: .04em; white-space: nowrap;
}
.afd-home-deal-promo__arrow { font-size: 18px; font-weight: 700; line-height: 1; transition: transform .2s ease; animation: afd-arrow-pulse 2s ease-in-out infinite; }
.afd-home-deal-promo:hover .afd-home-deal-promo__arrow { animation: none; transform: translateX(3px); }
/* Ikon er transparent -> hvid baggrundscirkel bag det. */
.afd-home-deal-promo__icon { z-index: 4; width: 52px; height: 52px; padding: 10px; border-radius: 50%; background: #fff; box-shadow: 0 6px 16px rgba(14,39,71,.18); }
.afd-home-product-rail__track { align-items: stretch; }
/* INGEN fast korthoejde: kortene straekkes af flex (align-items:stretch) til
   promo-hoejden, saa de flugter UDEN at klippe titlen. En fast body-hoejde fik
   ellers flex til at skrumpe titlen (min-height:0) til en halv linje = afklippet
   tekst (ejer-rapport 2026-07-20). */
.afd-home-product-rail__track .afd-card--product { min-height: 0; overflow: hidden; }
.afd-home-product-rail .afd-card--product .afd-card__img { height: 150px; min-height: 150px; flex: 0 0 150px; padding: 14px; }
.afd-home-product-rail .afd-card--product .afd-card__img img {
  width: 100%; height: 100%; max-width: 100%; max-height: 100%;
}
.afd-home-product-rail .afd-card__body { min-height: 0; padding: 13px; }
/* Fuld KORT titel (3 linjer). flex-shrink:0 saa flex ALDRIG skrumper og klipper
   den; ekstra plads lander i luften over prisen, ikke i teksten. */
.afd-home-product-rail .afd-card__title {
  display: -webkit-box; flex: 0 0 auto; min-height: 3.6em; overflow: hidden;
  -webkit-box-orient: vertical; -webkit-line-clamp: 3; font-size: .82rem;
}
.afd-home-product-rail .afd-card__price { font-size: 1.15rem; }
.afd-home-product-rail .afd-card__footer { padding-top: 8px; }
.afd-home-product-rail .afd-card__cta { min-height: 46px; margin-top: auto; padding: 8px 11px; }
/* CTA-tekst maa aldrig wrappe/overflyde i de kompakte kort (fx "Se priser"). */
.afd-home-product-rail .afd-card__cta > span:not(.afd-card__merchant),
.afd-home-popular .afd-card__cta > span:not(.afd-card__merchant),
.afd-home-rated .afd-card__cta > span:not(.afd-card__merchant) { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* Tillid og afsluttende CTA: kompakt, centreret og uden genbrugt tilbudsfoto. */
.afd-home-trust { gap: 20px; min-height: 0; padding: 28px 24px; }
.afd-home-trust__intro { padding: 0; }
.afd-home-trust h2 { font-size: clamp(1.7rem,2.6vw,2.15rem); }
.afd-home-trust .afd-trust__item { min-height: 180px; padding: 22px 14px 24px; }
.afd-home-trust .afd-trust__icon { width: 72px; height: 72px; flex-basis: 72px; }
.afd-home-trust .afd-trust__icon .afd-ui-icon { width: 48px; height: 48px; }
.afd-home-trust__pets { max-height: 92px; overflow: hidden; }
.afd-home-cta { grid-template-columns: 1fr; gap: 16px; min-height: 0; padding: 28px 24px; }
.afd-home-cta__copy { padding: 0; }
.afd-home-cta__copy h2 { font-size: clamp(1.55rem,5vw,2.35rem); }
/* Mobil (2026-07-20): dyrene ligger som svag bund-backdrop bag CTA'en (samme
   rolige udtryk som prisblik), ikke et lille flydende billede med skygge. */
.afd-home-cta__visual {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 0;
  display: block; width: 100%; height: 46%; min-height: 0; margin: 0;
  overflow: hidden; pointer-events: none;
}
.afd-home-cta__pet-icon {
  position: static; display: block; width: 100%; height: 100%;
  opacity: .4; filter: none; transform: none;
}
.afd-home-cta__pet-icon .afd-ui-icon { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.afd-home-cta .afd-btn { width: 100%; min-height: 56px; margin: 0; padding: 14px 18px; }

/* Populære: præcis seks kort pr. desktopvisning, resten i karrusellen. */
.afd-home-popular { padding: 22px 16px 18px; }
.afd-home-popular__track .afd-card--product { min-height: 385px; align-items: stretch; }
.afd-home-popular .afd-card__img { height: 170px; }
.afd-home-popular .afd-card__body { min-height: 0; height: auto; flex: 1 1 auto; }
.afd-home-popular .afd-card__title { font-size: .76rem; }
.afd-home-popular .afd-card__price { font-size: 1.12rem; }

/* Den aktive /tilbud/-side bruger 75.png: copy, transparent dyr og tre stats. */
.afd-deals-hero { grid-template-columns: 1fr; gap: 18px; min-height: 0; padding: 30px 24px 0; }
.afd-deals-hero__copy { padding-bottom: 2px; }
.afd-deals-hero__copy h1 { margin-bottom: 14px; font-size: clamp(2.5rem,9vw,4.8rem); line-height: .98; }
.afd-deals-hero__lead { font-size: .98rem; line-height: 1.55; }
.afd-deals-hero__media {
  display: grid; min-height: 210px; align-self: end; place-items: end center; overflow: visible;
}
.afd-deals-hero__media img {
  display: block; width: 100%; height: 100%; max-height: 280px;
  object-fit: contain; object-position: center bottom;
}
/* Mobil: de 3 stats paa EEN raekke, hver lodret: ikon oeverst, tal i midten,
   lille beskrivelse under (ejer-oenske 2026-07-22). @900 tilbage til vandret
   ikon+tekst i side-soejlen. */
.afd-deals-hero__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding-bottom: 24px; }
.afd-deals-hero__stat { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 7px; min-height: 0; padding: 12px 8px; }
.afd-deals-hero__stat-icon { width: 42px; height: 42px; }
.afd-deals-hero__stat-icon .afd-ui-icon { width: 24px; height: 24px; }
.afd-deals-hero__stat-copy { justify-items: center; gap: 3px; }
.afd-deals-hero__stat-copy strong { font-size: clamp(1rem, 4.4vw, 1.4rem); }
.afd-deals-hero__stat-copy span { font-size: .62rem; line-height: 1.25; }
/* Tilbud-intro: kompakt, minimal luft mellem overskrift og broedtekst. */
.afd-deals-intro { padding: 12px 0 26px; }
.afd-deals-intro .afd-section-head { margin-bottom: 2px; }
.afd-deals-intro .afd-section-head h2 { margin: 0; }
.afd-deals-intro .afd-prose { max-width: 760px; }
.afd-deals-intro .afd-prose p { margin: 0; font-size: .95rem; line-height: 1.5; }

/* Guides: 71.png er heroens eneste højre billedkilde. */
.afd-guides-page .afd-breadcrumbs { padding-block: 12px 8px; }
.afd-guides-hero { grid-template-columns: 1fr; gap: 0; min-height: 0; }
.afd-guides-hero__copy { padding: 30px 24px 12px; }
.afd-guides-hero h1 { margin-bottom: 24px; font-size: clamp(2.4rem,9vw,4.4rem); }
.afd-guides-hero__copy p { font-size: .98rem; }
.afd-guides-hero__media { display: grid; min-height: 190px; padding: 0 16px; place-items: end center; }
.afd-guides-hero__media img {
  display: block; width: 100%; height: 100%; max-height: 245px;
  object-fit: contain; object-position: center bottom;
}
.afd-guides-topics { margin-bottom: 14px; }
.afd-guides-results { margin-top: 0; }
.afd-guides-empty { min-height: 290px; }

/* Butikssider: mindre hero uden overhøjde, men samme tydelige CTA og logo. */
.afd-merchant-hero { grid-template-columns: 1fr; gap: 20px; min-height: 0; padding: 30px 24px; }
.afd-merchant-hero__eyebrow { margin-bottom: 18px; }
.afd-merchant-hero h1 { font-size: clamp(2.5rem,9vw,4.8rem); }
.afd-merchant-hero__cta { margin-top: 20px; }
.afd-merchant-hero__features { margin-top: 20px; }
.afd-merchant-hero__feature { min-height: 74px; padding: 12px; }
.afd-merchant-hero__visual { min-height: 220px; }
.afd-merchant-hero__logo { min-height: 180px; }
.afd-merchant-hero__logo img { max-height: 170px; }

/* Produkttop: unscoped med vilje; den gamle .afd-product-page-shell findes ikke i markup.
   Fuld container-bredde (ingen 1120-cap): heroen var 1120 mens sektionerne under
   den var 1200, saa venstre/hoejre kant var skaev (audit 2026-07-21). Nu deler
   hero, genveje og alle sektioner praecis samme kant. */
/* Mobil: TO kolonner som desktop, bare tilpasset (billede venstre, info +
   navy priskort/CTA hoejre). Billedet faar sin NATURLIGE hoejde (billedsoejlen
   straekkes IKKE til info-hoejden, saa der er ingen stor hvid luft over/under
   produktet); info-soejlen er hoejere og top-justeres. Lang beskrivelse er kort,
   ikon-piller skjult i den smalle soejle (audit 2026-07-21, ejer-mockup). */
.afd-product-hero { width: 100%; max-width: none; margin: 8px 0 14px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.02fr); align-items: stretch; gap: 10px; }
.afd-product-hero .afd-phero__media {
  position: static; align-self: stretch; display: flex; flex-direction: column; min-height: 0; padding: 3px;
  border-radius: 14px; border: 1px solid #EAEFF4; box-shadow: 0 6px 16px rgba(14,39,71,.06);
  background: #fff;
}
/* Billedet har sin NATURLIGE hoejde (height:auto) og STYRER raekkehoejden; den
   komprimerede info-soejle straekkes til samme hoejde med priskortet i bunden.
   Saa er de ALTID lige hoeje UDEN hvid luft i billedet (audit 2026-07-21). */
.afd-product-hero .afd-phero__imgbox { width: 100%; flex: none; height: auto; min-height: 0; padding: 0; background: transparent; }
.afd-product-hero .afd-phero__main-image {
  width: 100%; height: auto; max-height: 320px; padding: 0; object-fit: contain;
}
.afd-product-hero .afd-phero__gallery { grid-auto-columns: 40px; gap: 6px; margin-top: 6px; padding: 4px; }
.afd-product-hero .afd-phero__thumb { width: 40px; height: 40px; padding: 4px; border-radius: 9px; }
.afd-product-hero .afd-phero__info { align-self: stretch; display: flex; flex-direction: column; height: auto; min-height: 0; padding: 0; }
/* Kompakt, koebs-fokuseret smal soejle: skjul laes-mere og ikon-piller paa mobil
   (findes i Produktinfo laengere nede). Den KORTE beskrivelse beholdes nu (2
   linjer) under titlen, da der er plads (ejer-oenske 2026-07-21).
   Fri-plads-fordeling: variant + priskort skubbes til bunden (margin-top:auto),
   saa titel + beskrivelse staar oeverst og varianten altid lige over boksen. */
.afd-product-hero .afd-readmore,
.afd-product-hero .afd-icon-grid { display: none; }
.afd-product-hero .afd-variants { margin-top: auto; }
.afd-product-hero .afd-pricecard { margin-top: auto; }
.afd-product-hero .afd-variants ~ .afd-pricecard { margin-top: 10px; }
/* Taxonomier (maerke, kategori, opdateret): --top staar OVER heroen paa mobil
   saa titlen faar hele den smalle soejle; --col er kun desktop (i info-soejlen). */
.afd-phero__meta--top { flex-wrap: wrap; gap: 5px; margin: 2px 0 9px; }
.afd-phero__meta--col { display: none; }
.afd-product-hero .afd-phero__meta { gap: 5px; margin-bottom: 4px; }
.afd-product-hero .afd-phero__brand,
.afd-product-hero .afd-phero__cat,
.afd-product-hero .afd-phero__updated { font-size: 9px; letter-spacing: .06em; }
/* Fuld titel paa mobil: mindre skrift, op til 6 linjer (klippes reelt aldrig).
   Titel + beskrivelse staar naturligt oeverst; den frie plads ligger mellem
   beskrivelsen og varianten (variant/boks har margin-top:auto). */
.afd-product-hero .afd-phero__info h1 {
  display: -webkit-box; margin: 0 0 5px; overflow: hidden;
  font-size: clamp(.98rem,3.6vw,1.2rem); line-height: 1.16; letter-spacing: -.01em;
  -webkit-box-orient: vertical; -webkit-line-clamp: 6;
}
.afd-product-hero .afd-phero__desc {
  display: -webkit-box; margin: 0; overflow: hidden; font-size: .8rem; line-height: 1.4; color: #5b6a7d;
  -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
/* Aaben tilstand: scoped saa den slaar den 2-linjers klampe (0,2,0) paa mobil.
   Uden denne gjorde "Laes mere" intet visuelt (base .afd-phero__desc--open er kun 0,1,0). */
.afd-product-hero .afd-phero__desc--open { display: block; overflow: visible; -webkit-line-clamp: unset; }
.afd-product-hero .afd-readmore { min-height: 22px; margin: 2px 0 0; font-size: .65rem; }
.afd-product-hero .afd-variants { gap: 3px; margin: 2px 0; }
.afd-product-hero .afd-variants__label { margin: 0 0 1px; font-size: .62rem; }
.afd-product-hero .afd-variants__button { min-width: 58px; min-height: 28px; padding: 3px 7px; border-radius: 7px; }
.afd-product-hero .afd-variants__button strong { font-size: .68rem; }
.afd-product-hero .afd-variants__button small { font-size: .52rem; }
.afd-product-hero .afd-icon-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin: 12px 0 0; }
.afd-product-hero .afd-icon-grid .afd-ig__item:nth-child(n+4) { display: none; }
.afd-product-hero .afd-ig__item { min-height: 42px; padding: 6px 9px; border-radius: 11px; font-size: .7rem; }
.afd-product-hero .afd-ig__ico { width: 26px; height: 26px; }
.afd-product-hero .afd-ig__ico svg { width: 13px; height: 13px; }
/* Mobil-koebsboks: MINIMAL navy-boks = kun et diskret label + den orange knap
   (pris i knappen). Foerpris/spar/30-dages-linje skjules paa mobil for maksimal
   ro og lav hoejde; besparelsen staar allerede paa rabat-skiltet ved billedet.
   Boksen ligger i bunden med FAST afstand op til variantvaelgeren (10px). */
.afd-product-hero .afd-pricecard {
  padding: 8px 9px; border-radius: 12px; box-shadow: 0 8px 20px rgba(14,39,71,.15);
}
.afd-product-hero .afd-pricecard__label { margin-bottom: 6px; font-size: 8px; letter-spacing: .8px; }
.afd-product-hero .afd-pricecard__row { display: none; } /* pris i knappen, foerpris/spar skjult paa mobil */
/* Knappen holder ALTID logo + pris + pil paa EN raekke (aldrig linjeskift). */
.afd-product-hero .afd-cta-main { min-height: 44px; padding: 8px 11px; border-radius: 10px; gap: 8px; flex-wrap: nowrap; white-space: nowrap; }
.afd-product-hero .afd-cta-main__logo { display: flex; flex: 0 0 auto; width: 30px; height: 30px; }
.afd-product-hero .afd-cta-main__text { display: none; } /* butiksnavn ud paa mobil */
.afd-product-hero .afd-cta-main__price { display: block; flex: 1 1 auto; min-width: 0; text-align: left; white-space: nowrap; font: 800 clamp(15px,4.6vw,18px)/1 var(--afd-font-heading); }
.afd-product-hero .afd-cta-main__arrow { flex: 0 0 auto; }
.afd-product-hero .afd-cta-main__arrow svg { width: 20px; height: 20px; }
/* Mobil: rabat-skiltet er et LILLE fladt pill oppe i venstre hjoerne (ikke en
   stor orange cirkel), diskret som ejer-mockup. */
.afd-product-hero .afd-phero__drop {
  width: auto; height: auto; min-width: 0; top: 7px; left: 7px; right: auto;
  flex-direction: row; align-items: center; gap: 3px; padding: 3px 8px;
  border-radius: 7px; box-shadow: 0 3px 8px rgba(240,144,14,.3); animation: none;
}
.afd-product-hero .afd-phero__drop b { font-size: 11px; }
.afd-product-hero .afd-phero__drop small { font-size: 8px; letter-spacing: .3px; }

/* Reklame-note paa produktsiden: diskret muted linje (ikke kursiv broedtekst),
   saa produktbilledet leder toppen, ikke en jura-linje (mobil app-feel). */
/* Produktgenveje: samlet Produktinfo og kun de reelle H2-sektioner.
   Fuld container-bredde (samme kant som hero og sektioner) og stoerre, mere
   klikbare faner (audit 2026-07-21). */
.afd-product-jumps {
  width: 100%; max-width: none; margin: 6px 0 26px; border-bottom: 1px solid var(--afd-border);
}
.afd-product-jumps__track { gap: 6px; }
.afd-product-jumps a { min-height: 40px; padding: 9px 13px 11px; font-size: .76rem; white-space: nowrap; }
.afd-product-jumps a:hover,
.afd-product-jumps a:focus-visible { text-decoration: none; }
/* Mobil-nudge: hoejre-fade + snap saa det er tydeligt at fanerne kan swipes
   (karrusel). Skjules paa desktop hvor de spreder sig og ikke scroller. */
.afd-product-jumps::after {
  content: ""; position: absolute; top: 0; right: 0; bottom: 1px; width: 30px;
  background: linear-gradient(90deg, transparent, var(--afd-bg-alt) 86%);
  pointer-events: none; z-index: 2;
}
.afd-product-jumps__track { scroll-snap-type: x proximity; scroll-padding-left: 2px; padding-right: 18px; }
.afd-product-jumps a { scroll-snap-align: start; }

/* Under produktet: fuld bredde, præcis centerlinje og kompakte tilbudsrækker. */
.afd-offers-section,
.afd-tabs,
.afd-proscons,
.afd-review,
.afd-history { width: 100%; }
.afd-offers__row { align-items: center; }
.afd-offers__logo,
.afd-offers__info,
.afd-offers__prices,
.afd-offers__cta { align-self: center; }
.afd-offers__sub { align-items: center; }
.afd-offers__cta .afd-btn { text-decoration: none; }
.afd-tabs__nav { width: 100%; }
.afd-tabs__panel { width: 100%; max-width: none; }
.afd-proscons__grid { align-items: stretch; }
.afd-review__layout { align-items: stretch; }
.afd-review__criterion { align-items: center; }
.afd-footlinks { margin-top: 28px; padding-block: 34px; }

@media (min-width: 600px) {
  .afd-home-hero { padding: 34px 30px 28px; }
  .afd-home-hero__visual { height: 320px; }
  .afd-home-trust .afd-trust { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .afd-home-cta { grid-template-columns: minmax(0,1fr) 180px; }
  .afd-home-cta .afd-btn { grid-column: 1 / -1; }
  .afd-deals-hero__stats { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .afd-guides-hero { grid-template-columns: minmax(0,.9fr) minmax(300px,1.1fr); }
  .afd-guides-hero__media { min-height: 260px; }
  .afd-guides-hero__media img { max-height: 300px; }
  .afd-guides-empty { grid-template-columns: .9fr 1.1fr; }
  .afd-merchant-hero__features { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .afd-product-hero .afd-phero__imgbox { height: 290px; min-height: 290px; }
  .afd-product-hero .afd-phero__main-image { max-height: 290px; }
}
@media (min-width: 900px) {
  .afd-home-hero {
    grid-template-columns: minmax(0,1.02fr) minmax(380px,.98fr);
    gap: 32px; min-height: 520px; padding: 44px 42px;
  }
  .afd-home-hero__visual { height: 430px; align-self: center; }
  .afd-home-animal-nav a {
    min-height: 98px; grid-template-columns: 62px minmax(0,1fr); grid-template-rows: auto auto;
  }
  .afd-home-product-rail { grid-template-columns: 285px minmax(0,1fr); }
  /* min-height (ikke fast height) saa promoen STRAEKKES til kort-hoejden i
     gitteret; en fast hoejde efterlod promoen lavere end kortene. */
  .afd-home-deal-promo { min-height: 402px; }
  .afd-home-deal-promo__copy { padding-bottom: 0; }
  .afd-home-deal-promo__image { height: 46%; max-height: none; margin: 0; }
  .afd-home-product-rail__track { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .afd-home-product-rail .afd-card--product .afd-card__img { height: 170px; min-height: 170px; }
  .afd-home-trust {
    grid-template-columns: minmax(250px,.8fr) minmax(0,2.2fr);
    align-items: center; min-height: 0; padding: 32px;
  }
  .afd-home-trust .afd-trust { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .afd-home-trust .afd-trust__item { min-height: 200px; }
  .afd-home-cta {
    grid-template-columns: minmax(300px,1fr) minmax(180px,.55fr) minmax(260px,.75fr);
    min-height: 220px; padding: 28px 38px;
  }
  .afd-home-cta__visual { min-height: 160px; }
  .afd-home-cta__pet-icon { width: 210px; height: 150px; }
  .afd-home-cta .afd-btn { grid-column: auto; min-height: 62px; }
  .afd-home-popular__track .afd-card--product { flex-basis: calc((100% - 36px)/4); }
  .afd-deals-hero {
    grid-template-columns: minmax(0,1.08fr) minmax(320px,.9fr) minmax(220px,.62fr);
    gap: 24px; min-height: 430px; padding: 42px 34px 0;
  }
  .afd-deals-hero__copy { align-self: center; padding-bottom: 42px; }
  .afd-deals-hero__media { height: 100%; min-height: 380px; margin: 0; }
  .afd-deals-hero__media img { width: 118%; max-width: 620px; max-height: 410px; }
  .afd-deals-hero__stats { grid-template-columns: 1fr; align-content: center; padding-bottom: 32px; }
  /* Desktop-soejle: rene, CENTREREDE kort (ikon oeverst, tal, label) saa alle 3
     ser ens ud, ogsaa "Dagligt" som saa skaevt/overstoerret ud vandret. */
  .afd-deals-hero__stat { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 9px; padding: 20px 14px; }
  .afd-deals-hero__stat-icon { width: 50px; height: 50px; }
  .afd-deals-hero__stat-icon .afd-ui-icon { width: 28px; height: 28px; }
  .afd-deals-hero__stat-copy { justify-items: center; gap: 4px; }
  .afd-deals-hero__stat-copy strong { font-size: clamp(1.45rem, 1.6vw, 1.8rem); line-height: 1; }
  .afd-deals-hero__stat-copy span { font-size: .8rem; }
  .afd-guides-hero { min-height: 320px; }
  .afd-guides-hero__copy { padding: 40px 20px 40px 44px; }
  .afd-guides-hero__media { min-height: 320px; padding-right: 20px; }
  .afd-guides-hero__media img { max-height: 320px; }
  .afd-merchant-hero {
    grid-template-columns: minmax(0,1.05fr) minmax(340px,.95fr);
    min-height: 410px; padding: 42px;
  }
  .afd-merchant-hero__visual { min-height: 310px; }
  .afd-merchant-hero__logo { min-height: 260px; }
  .afd-merchant-hero__logo img { max-height: 220px; }
  /* Desktop: billedet er sticky til venstre, info-soejlen faar sin naturlige
     hoejde (ingen fast 390/410-hoejde + overflow:hidden, der foer klemte
     priskort/ikoner sammen og kappede lange titler). Alt aander og er
     laesbart (audit 2026-07-21). */
  /* Info-soejlen (varianter + ikoner + priskort) styrer hoejden; billedsoejlen
     STRAEKKES til praecis samme hoejde, saa billedet og den blaa priskasse altid
     flugter i bunden (samme vandrette linje), og billedet klipper aldrig
     (object-fit: contain). Ingen fast billedhoejde (audit 2026-07-21). */
  .afd-product-hero {
    grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
    align-items: stretch; gap: 30px;
  }
  .afd-product-hero .afd-phero__media { display: flex; flex-direction: column; height: auto; align-self: stretch; }
  /* flex-basis 0 + min-height 0: billedkassen bidrager ALDRIG med egen hoejde til
     raekken, saa info-soejlen altid styrer hoejden og billedet skrumper til at
     flugte (aldrig laengere nede end priskassen, selv paa korte produkter uden
     varianter/foerpris, audit 2026-07-21). */
  .afd-product-hero .afd-phero__imgbox { flex: 1 1 0; height: auto; min-height: 0; }
  .afd-product-hero .afd-phero__main-image { height: 100%; max-height: 100%; }
  .afd-product-hero .afd-phero__gallery { flex: 0 0 auto; grid-auto-columns: 58px; gap: 8px; margin-top: 10px; }
  .afd-product-hero .afd-phero__thumb { width: 58px; height: 58px; }
  .afd-product-hero .afd-phero__info { height: auto; overflow: visible; }
  /* Genveje spreder sig over hele hero-bredden (lige saa lang som billede + boks). */
  .afd-product-jumps__track { justify-content: space-between; gap: 10px; padding-right: 0; }
  .afd-product-jumps::after { display: none; }
  /* Desktop: taxonomier tilbage i info-soejlen (top-udgaven er mobil). */
  .afd-phero__meta--top { display: none; }
  .afd-phero__meta--col { display: flex; }
  .afd-product-hero .afd-phero__meta { gap: 8px; margin-bottom: 8px; }
  .afd-product-hero .afd-phero__brand,
  .afd-product-hero .afd-phero__cat,
  .afd-product-hero .afd-phero__updated { font-size: 11px; }
  .afd-product-hero .afd-phero__info h1 {
    font-size: clamp(1.75rem,2.4vw,2.4rem); margin-bottom: 8px; -webkit-line-clamp: 3;
  }
  /* Genvis beskrivelse + ikon-piller paa desktop (skjult i den smalle mobil-soejle). */
  .afd-product-hero .afd-phero__desc { display: -webkit-box; -webkit-line-clamp: 3; font-size: .95rem; line-height: 1.55; }
  /* IKKE display:inline-block her: JS viser kun knappen naar beskrivelsen reelt
     er klippet (scrollHeight > clientHeight). Ellers stod "Laes mere" ogsaa naar
     der intet var at folde ud paa desktop. Base + mobil-skjul holder den skjult. */
  .afd-product-hero .afd-readmore { margin: 6px 0 0; font-size: .8rem; }
  .afd-product-hero .afd-icon-grid { display: grid; }
  /* Desktop: billedramme tilbage, stor pris i boksen, butiksnavn i knappen
     (prisen bor kun i knappen paa mobil). */
  .afd-product-hero .afd-phero__media { padding: clamp(14px,2vw,22px); border-color: #E7EDF3; border-radius: 18px; background: linear-gradient(160deg,#FFFFFF,#F4F8FC); box-shadow: 0 10px 28px rgba(14,39,71,.08); }
  .afd-product-hero .afd-pricecard__price { display: block; }
  .afd-product-hero .afd-cta-main__text { display: block; }
  .afd-product-hero .afd-cta-main__price { display: none; }
  .afd-product-hero .afd-variants { gap: 8px; margin: 16px 0 0; }
  .afd-product-hero .afd-variants__label { font-size: .82rem; }
  .afd-product-hero .afd-variants__button { min-width: 92px; min-height: 54px; padding: 9px 15px; border-radius: 12px; }
  .afd-product-hero .afd-variants__button strong { font-size: .92rem; }
  .afd-product-hero .afd-variants__button small { font-size: .7rem; }
  .afd-product-hero .afd-icon-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 16px 0 0; }
  .afd-product-hero .afd-ig__item { min-height: 50px; padding: 9px 13px; border-radius: 12px; font-size: .8rem; }
  .afd-product-hero .afd-ig__ico { width: 30px; height: 30px; }
  .afd-product-hero .afd-ig__ico svg { width: 15px; height: 15px; }
  .afd-product-hero .afd-pricecard { margin-top: 18px; padding: 20px 22px; border-radius: 16px; }
  .afd-product-hero .afd-variants ~ .afd-pricecard { margin-top: 18px; } /* overstyr mobil-~-reglen paa desktop */
  .afd-product-hero .afd-pricecard__label { margin-bottom: 6px; font-size: 11px; letter-spacing: 1.4px; }
  .afd-product-hero .afd-pricecard__row { display: flex; margin-bottom: 16px; gap: 14px; }
  .afd-product-hero .afd-pricecard__price { font-size: 38px; }
  .afd-product-hero .afd-pricecard__old { font-size: 17px; }
  .afd-product-hero .afd-pricecard__save { padding: 5px 12px; font-size: 12px; }
  .afd-product-hero .afd-pricecard__low30 { margin-top: 6px; font-size: 12px; }
  .afd-product-hero .afd-cta-main { min-height: 60px; padding: 12px 20px; border-radius: 12px; font-size: 15px; gap: 14px; }
  .afd-product-hero .afd-cta-main__logo { display: flex; width: 44px; height: 44px; }
  .afd-product-hero .afd-cta-main__arrow svg { width: 30px; height: 30px; }
  /* Rabat-skilt i bedste, tydelige stoerrelse paa desktop. */
  /* Desktop: tilbage til den store, tydelige orange cirkel (pill-stilen er mobil). */
  .afd-product-hero .afd-phero__drop { width: 84px; height: 84px; top: 16px; right: 16px; left: auto; padding: 0; flex-direction: column; gap: 0; border-radius: 50%; }
  .afd-product-hero .afd-phero__drop b { font-size: 23px; }
  .afd-product-hero .afd-phero__drop small { font-size: 10px; letter-spacing: 1.2px; }
}
@media (min-width: 1200px) {
  .afd-home-product-rail { grid-template-columns: 300px minmax(0,1fr); }
  .afd-home-deal-promo,
  .afd-home-popular__track .afd-card--product { flex-basis: calc((100% - 60px)/6); }
  .afd-home-popular .afd-card__img { height: 190px; }
  .afd-home-popular .afd-card__body { min-height: 205px; }
  .afd-home-trust { padding: 36px 40px; }
  .afd-home-trust .afd-trust__item { min-height: 210px; }
  .afd-deals-hero { padding-inline: 48px; }
  .afd-product-hero { gap: 40px; }
}

/* ============================================================
   FORSIDEHERO app-feel (2026-07-20, autoritativ hero-finish).
   Mobil/tablet: dyrebilledet ligger som svag baggrund BAG indholdet
   (app-foelelse, kompakt lodret rytme, ingen lang stroget hero).
   Desktop (>=900px): todelt hero med synligt rammefrit billede til
   hoejre (som aftalt). Denne blok kommer sidst og vinder bevidst
   over de tidligere hero-lag. */
.afd-home-hero {
  position: relative; isolation: isolate; overflow: hidden;
  box-sizing: border-box; max-width: 100%;
  grid-template-columns: minmax(0,1fr);
  grid-template-areas: "eyebrow" "title" "lead" "search" "benefits";
  gap: 16px; min-height: 0; padding: 26px 20px 26px;
}
/* Intet hero-barn maa tvinge heroen bredere end skaermen (mobil no-overflow). */
.afd-home-hero > *, .afd-home-hero__content > * { min-width: 0; max-width: 100%; }
body.afd-page .afd-home-hero h1, .afd-home-hero__content > p { overflow-wrap: break-word; }
.afd-home-search { min-width: 0; }
.afd-home-hero__content { display: contents; }
.afd-home-hero__visual {
  position: absolute; inset: 0; z-index: 0; grid-area: auto;
  width: 100%; height: 100%; margin: 0; opacity: .16;
  pointer-events: none; border: 0; border-radius: 0; background: none; overflow: hidden;
}
.afd-home-hero__image {
  display: block; width: 100%; height: 100%; max-height: none;
  object-fit: cover; object-position: center; filter: none; transform: none;
}
body.afd-page .afd-home-hero h1 { max-width: 680px; font-size: clamp(2.05rem,7vw,3.2rem); line-height: 1.06; }
.afd-home-hero__content > p { max-width: 620px; }
/* USP mobil/tablet: kompakte chips = ikon OEVERST, KUN navy titel nedenunder,
   alle 3 paa een raekke. Undertekst skjules under 900px (sekundaer info). */
.afd-home-benefits { grid-template-columns: repeat(3,1fr); gap: 8px; align-items: stretch; }
.afd-home-benefits li { grid-template-columns: 1fr; grid-template-rows: auto auto; align-content: start; align-items: start; justify-items: center; text-align: center; column-gap: 0; row-gap: 6px; }
.afd-home-benefits li > span { grid-row: auto; grid-column: auto; }
.afd-home-benefits b { font-size: .74rem; line-height: 1.2; }
.afd-home-benefits small { display: none; }
@media (min-width: 600px) {
  .afd-home-hero {
    grid-template-columns: minmax(0,1fr);
    grid-template-areas: "eyebrow" "title" "lead" "search" "benefits";
    gap: 18px; min-height: 0; padding: 44px 40px 40px;
  }
  .afd-home-hero__content { display: contents; }
  .afd-home-hero__visual { position: absolute; inset: 0; height: 100%; opacity: .14; }
  body.afd-page .afd-home-hero h1 { font-size: clamp(2.4rem,6vw,3.6rem); }
  .afd-home-benefits { grid-template-columns: repeat(3,1fr); }
  .afd-home-benefits b { font-size: .82rem; }
}
@media (min-width: 900px) {
  .afd-home-hero {
    grid-template-columns: minmax(0,1.02fr) minmax(380px,.98fr);
    grid-template-areas: "content visual";
    gap: 34px; min-height: 560px; padding: 56px 52px;
  }
  .afd-home-hero__content { display: block; grid-area: content; align-self: center; min-width: 0; }
  .afd-home-hero__visual {
    position: relative; inset: auto; grid-area: visual; z-index: 2;
    width: 100%; height: 440px; margin: 0; opacity: 1; align-self: center; overflow: visible;
  }
  .afd-home-hero__image {
    object-fit: contain; object-position: center bottom;
    filter: drop-shadow(0 18px 26px rgba(14,39,71,.14));
  }
  body.afd-page .afd-home-hero h1 { max-width: 720px; font-size: clamp(3.4rem,4.4vw,5.15rem); line-height: .98; }
  /* Desktop: gendan ikon-til-venstre + undertekst (mere plads). */
  .afd-home-benefits { grid-template-columns: repeat(3,1fr); max-width: 700px; }
  .afd-home-benefits li { grid-template-columns: 42px minmax(0,1fr); align-items: center; justify-items: stretch; text-align: left; column-gap: 9px; }
  .afd-home-benefits li > span { grid-row: 1 / 3; }
  .afd-home-benefits b { font-size: .72rem; }
  .afd-home-benefits small { display: block; }
}

/* Home-CTA: dyre-backdrop er KUN mobil. Fra 600px gendannes det synlige
   sidebillede (denne reset ligger sidst, saa den vinder over base-reglen). */
@media (min-width: 600px) {
  .afd-home-cta__visual { position: relative; inset: auto; z-index: 1; height: auto; overflow: visible; }
  .afd-home-cta__pet-icon { position: static; opacity: .95; }
}
/* Home-CTA UDEN billede: ren copy + knap. */
.afd-home-cta--noimg { grid-template-columns: 1fr; }
@media (min-width: 600px) {
  .afd-home-cta--noimg { grid-template-columns: minmax(0,1fr) minmax(220px,.48fr); align-items: center; gap: 24px; padding: 34px 34px; }
  .afd-home-cta--noimg .afd-home-cta__copy { padding-bottom: 0; }
  .afd-home-cta--noimg .afd-btn { grid-column: auto; align-self: center; margin-bottom: 0; }
}


/* ---------- /kategorier/: søgbar dyreoversigt ---------- */
body.afd-system-kategorier.afd-page { background: #fff; }
.afd-category-hero { position: relative; z-index: 2; overflow: visible; margin: var(--afd-space-2) 0 var(--afd-space-8); padding: 24px 16px 14px; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); background: radial-gradient(circle at 90% 0, var(--afd-accent-soft), transparent 38%), linear-gradient(145deg,#fff,var(--afd-bg-alt)); background-clip: padding-box; box-shadow: var(--afd-shadow-sm); }
.afd-category-hero__copy { max-width: 760px; margin-inline: auto; text-align: center; }
.afd-category-hero .afd-overline { color: var(--afd-accent-hover); }
.afd-page .afd-category-hero h1 { margin-bottom: 6px; color: var(--afd-navy); font-size: clamp(1.7rem,4vw,2.55rem); }
.afd-category-hero__copy > p { max-width: 680px; margin: 0 auto; color: var(--afd-text-muted); font-size: .9rem; }
.afd-category-search { position: relative; z-index: 3; width: min(760px,100%); margin: var(--afd-space-5) auto 0; }
.afd-category-search .afd-category-search__form { width: min(650px,100%); max-width: 650px; margin: 0 auto; box-sizing: border-box; border: 1px solid rgba(20,51,92,.08); }
.afd-category-search .afd-category-search__form:focus-within { box-shadow: 0 10px 32px rgba(14,39,71,.16), 0 0 0 3px rgba(240,144,14,.13); }
.afd-category-search .afd-home-search__icon { flex: 0 0 34px; pointer-events: none; }
.afd-category-search .afd-home-search__arrow { font-size: 1rem; line-height: 1; }
.afd-category-search__results { position: absolute; top: calc(100% + 8px); left: 50%; z-index: var(--afd-z-dropdown); width: min(650px,100%); max-height: 390px; overflow-y: auto; box-sizing: border-box; padding: 6px; border: 1px solid var(--afd-border); border-radius: 14px; background: #fff; box-shadow: 0 20px 48px rgba(14,39,71,.2); text-align: left; transform: translateX(-50%); }
.afd-category-search__results a { display: flex; align-items: center; justify-content: space-between; gap: var(--afd-space-4); padding: 11px 12px; border-radius: 10px; color: var(--afd-text); }
.afd-category-search__results a:hover, .afd-category-search__results a.is-active { background: var(--afd-accent-soft); text-decoration: none; }
.afd-category-search__result-copy { display: grid; min-width: 0; gap: 1px; }
.afd-category-search__result-copy strong { overflow-wrap: anywhere; color: var(--afd-navy); font: 700 .9rem/1.35 var(--afd-font-heading); }
.afd-category-search__result-copy small { color: var(--afd-text-muted); font-size: .72rem; }
.afd-category-search__type { flex: 0 0 auto; padding: 4px 8px; border-radius: 999px; background: var(--afd-bg-alt); color: var(--afd-text-muted); font-size: .63rem; font-weight: 700; }
.afd-category-search__empty { padding: 18px 14px; color: var(--afd-text-muted); font-size: .86rem; text-align: center; }
.afd-category-quicklinks { position: relative; z-index: 1; display: flex; gap: 4px; margin: var(--afd-space-5) -16px -14px; padding: 10px 16px; overflow-x: auto; overflow-y: hidden; box-sizing: border-box; border-top: 1px solid var(--afd-border); border-radius: 0 0 calc(var(--afd-radius-module) - 1px) calc(var(--afd-radius-module) - 1px); background: #fff; scrollbar-width: none; }
.afd-category-quicklinks::-webkit-scrollbar { display: none; }
.afd-category-quicklinks a { flex: 0 0 auto; padding: 8px 12px; border: 1px solid transparent; border-radius: 999px; color: var(--afd-navy); font: 700 .7rem/1 var(--afd-font-heading); transition: background .15s ease, color .15s ease; }
.afd-category-quicklinks a:hover { background: var(--afd-accent-soft); color: var(--afd-navy); }
.afd-category-quicklinks a.is-active { background: var(--afd-navy); color: #fff; box-shadow: 0 5px 14px rgba(20,51,92,.2); }
.afd-category-section { margin-bottom: var(--afd-section-gap); }
.afd-category-section__head { display: flex; align-items: end; justify-content: space-between; gap: var(--afd-space-5); margin-bottom: var(--afd-space-4); }
.afd-category-section__head h2 { margin-bottom: 3px; }
.afd-category-section__head p { max-width: 620px; margin: 0; color: var(--afd-text-muted); font-size: .86rem; }
.afd-category-section__head > span { display: none; flex: 0 0 auto; padding: 6px 10px; border-radius: 999px; background: var(--afd-bg-alt); color: var(--afd-text-muted); font-size: .68rem; font-weight: 700; }
.afd-category-animal-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.afd-category-card { --afd-category-tint: var(--afd-accent-soft); position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: 112px minmax(0,1fr); min-width: 0; min-height: 250px; overflow: hidden; border: 1px solid rgba(20,51,92,.1); border-radius: 16px; background: #fff; color: var(--afd-text); box-shadow: 0 5px 16px rgba(14,39,71,.06); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.afd-category-card:hover { border-color: rgba(20,51,92,.24); color: var(--afd-text); text-decoration: none; transform: translateY(-3px); box-shadow: 0 14px 30px rgba(14,39,71,.12); }
.afd-category-card:focus-visible { color: var(--afd-text); }
.afd-category-card__media { position: relative; z-index: 1; display: grid; min-width: 0; place-items: end center; overflow: hidden; background: #fff; }
.afd-category-card__image { position: relative; z-index: 1; display: grid; width: 100%; height: 100%; place-items: end center; overflow: hidden; box-sizing: border-box; padding: 8px 8px 0; background: #fff; }
.afd-category-card__image img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; transition: transform .22s ease; }
.afd-category-card__image svg { width: 48px; height: 48px; margin-bottom: 28px; fill: var(--afd-navy); opacity: .4; }
.afd-category-card:hover .afd-category-card__image img { transform: scale(1.045); }
.afd-category-card__body { position: relative; display: flex; min-width: 0; flex-direction: column; align-items: flex-start; padding: 10px; background: linear-gradient(180deg,rgba(255,255,255,.98) 0,var(--afd-category-tint) 22%,var(--afd-category-tint) 100%); }
.afd-category-card__body::after { content: ""; position: absolute; z-index: 0; width: 120px; height: 120px; right: -66px; top: -70px; border-radius: 50%; background: rgba(255,255,255,.42); pointer-events: none; }
.afd-category-card__body > span { position: relative; z-index: 1; }
.afd-category-card__name { color: var(--afd-navy); font: 750 .94rem/1.2 var(--afd-font-heading); overflow-wrap: anywhere; }
.afd-category-card__description { margin-top: 4px; color: var(--afd-text); font-size: .64rem; line-height: 1.35; overflow-wrap: anywhere; }
.afd-category-card__meta { margin-top: 4px; color: var(--afd-text-muted); font-size: .58rem; font-weight: 650; }
.afd-category-card__cta { display: inline-flex; width: 100%; min-height: 31px; box-sizing: border-box; align-items: center; justify-content: center; gap: 6px; margin-top: auto; padding: 6px 8px; border-radius: 999px; background: var(--afd-accent); color: #fff; font: 700 .62rem/1 var(--afd-font-heading); white-space: nowrap; box-shadow: 0 4px 12px rgba(240,144,14,.25); transition: background .15s ease, transform .15s ease; }
.afd-category-card:hover .afd-category-card__cta { background: var(--afd-accent-hover); transform: translateX(2px); }
.afd-category-card--hund, .afd-category-card--tone-1 { --afd-category-tint: var(--afd-tile-hund); }
.afd-category-card--kat, .afd-category-card--tone-2 { --afd-category-tint: var(--afd-tile-kat); }
.afd-category-card--kanin, .afd-category-card--tone-3 { --afd-category-tint: var(--afd-tile-kanin); }
.afd-category-card--fugl, .afd-category-card--tone-4 { --afd-category-tint: var(--afd-tile-fugl); }
.afd-category-card--fisk, .afd-category-card--akvarie, .afd-category-card--tone-5 { --afd-category-tint: var(--afd-tile-akvarie); }
.afd-category-card--hest, .afd-category-card--tone-6 { --afd-category-tint: var(--afd-tile-hest); }
.afd-category-section--all { padding-top: var(--afd-space-8); border-top: 1px solid var(--afd-border); }
@media (min-width: 600px) {
  .afd-category-hero { padding: 30px 24px 0; }
  .afd-category-quicklinks { margin: var(--afd-space-6) -24px 0; padding-inline: 24px; }
  .afd-category-animal-grid { gap: var(--afd-space-4); }
  .afd-category-card { grid-template-columns: 44% minmax(0,56%); grid-template-rows: minmax(0,1fr); min-height: 174px; border-radius: 18px; }
  .afd-category-card__image { padding: 8px 3px 0; }
  .afd-category-card__image svg { width: 54px; height: 54px; margin-bottom: 50px; }
  .afd-category-card__body { padding: 18px 14px 14px 16px; background: linear-gradient(90deg,rgba(255,255,255,.98) 0,var(--afd-category-tint) 22%,var(--afd-category-tint) 100%); }
  .afd-category-card__name { font-size: 1.08rem; }
  .afd-category-card__description { margin-top: 5px; font-size: .72rem; line-height: 1.4; }
  .afd-category-card__meta { margin-top: 5px; font-size: .64rem; }
  .afd-category-card__cta { width: auto; min-height: 34px; gap: 8px; padding: 7px 12px; font-size: .7rem; }
  .afd-category-section__head > span { display: inline-flex; }
}
@media (min-width: 900px) {
  .afd-category-hero { padding: 34px 30px 0; }
  .afd-category-quicklinks { justify-content: center; margin-inline: -30px; padding-inline: 30px; }
  .afd-category-animal-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .afd-category-card { min-height: 184px; }
}
@media (min-width: 1200px) {
  .afd-category-animal-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .afd-category-card { grid-template-columns: 46% minmax(0,54%); min-height: 176px; }
  .afd-category-card__body { padding: 16px 12px 12px 13px; background: linear-gradient(90deg,rgba(255,255,255,.98) 0,var(--afd-category-tint) 20%,var(--afd-category-tint) 100%); }
  .afd-category-card__name { font-size: 1rem; }
  .afd-category-card__description { font-size: .68rem; }
  .afd-category-card__meta { font-size: .61rem; }
  .afd-category-card__cta { min-height: 32px; padding: 6px 11px; font-size: .66rem; }
}
/* Tilbudsbaand (ejer-reference 2026-10-10): fuldbredde navy titelbaand
   med link og pile over en hvid kortbane. Swipe og tastatur virker ogsaa
   uden JavaScript; pile aktiveres kun af den eksisterende carousel-controller. */
.afd-home-product-rail {
  position: relative;
  display: block;
  min-width: 0;
  margin: var(--afd-space-2) 0 var(--afd-space-10);
  padding: 0;
  overflow: visible;
  scroll-snap-type: none;
  border: 1px solid var(--afd-border);
  border-radius: var(--afd-radius-module);
  background: var(--afd-bg);
  box-shadow: var(--afd-shadow-sm);
}
.afd-home-product-rail__header {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  column-gap: var(--afd-space-2);
  row-gap: 0;
  min-width: 0;
  padding: var(--afd-space-3);
  border-radius: var(--afd-radius-module) var(--afd-radius-module) 0 0;
  background: var(--afd-navy-grad);
  color: var(--afd-bg);
}
.afd-home-product-rail .afd-home-product-rail__title {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  color: var(--afd-bg);
  font-size: var(--afd-deal-rail-title-size-mobile);
  font-weight: 700;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.afd-home-product-rail__title-accent { color: var(--afd-accent); }
.afd-home-product-rail__actions {
  display: contents;
  align-items: center;
  justify-content: space-between;
  gap: var(--afd-space-3);
  min-width: 0;
}
.afd-home-product-rail .afd-home-product-rail__all {
  grid-column: 1;
  grid-row: 2;
  display: inline-flex;
  align-items: center;
  gap: var(--afd-space-2);
  min-width: 0;
  min-height: 44px;
  color: var(--afd-bg);
  font: 600 var(--afd-fs-small)/1.3 var(--afd-font-body);
  overflow-wrap: anywhere;
}
.afd-home-product-rail__all span { color: var(--afd-accent); font-size: 1.25rem; line-height: 1; }
.afd-home-product-rail .afd-home-product-rail__all:hover { color: var(--afd-bg); text-decoration: underline; text-underline-offset: 4px; }
.afd-home-product-rail .afd-home-product-rail__all:focus-visible,
.afd-home-product-rail .afd-home-product-rail__controls button:focus-visible { outline: 3px solid var(--afd-bg); outline-offset: 3px; }
.afd-home-product-rail .afd-home-product-rail__controls {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: start;
  display: flex;
  flex: 0 0 auto;
  gap: 0;
  opacity: 1;
  pointer-events: auto;
}
.afd-home-product-rail .afd-home-product-rail__controls button {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  box-sizing: border-box;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: radial-gradient(circle,var(--afd-accent) var(--afd-space-4),transparent calc(var(--afd-space-4) + .5px));
  color: var(--afd-bg);
  box-shadow: none;
  transform: none;
}
.afd-home-product-rail .afd-home-product-rail__controls button:hover:not(:disabled),
.afd-home-product-rail .afd-home-product-rail__controls button:focus-visible:not(:disabled) { background: radial-gradient(circle,var(--afd-accent-hover) var(--afd-space-4),transparent calc(var(--afd-space-4) + .5px)); color: var(--afd-bg); box-shadow: none; transform: none; }
.afd-home-product-rail .afd-home-product-rail__controls button .afd-carousel-chevron { width: var(--afd-space-4); height: var(--afd-space-4); }
.afd-home-product-rail .afd-home-product-rail__controls button:disabled { opacity: .45; cursor: default; box-shadow: none; }
.afd-home-product-rail__body { min-width: 0; padding: var(--afd-space-3); }
.afd-home-product-rail__intro { margin: 0 var(--afd-space-2) var(--afd-space-2); color: var(--afd-text-muted); font-size: var(--afd-fs-small); line-height: 1.45; overflow-wrap: anywhere; }
.afd-home-product-rail__viewport {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding-top: 8px;
  margin-top: -8px;
}
.afd-home-product-rail__track {
  display: flex;
  align-items: stretch;
  gap: var(--afd-space-3);
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 8px;
  scroll-snap-type: x proximity;
  scroll-padding-inline: var(--afd-space-2);
  overscroll-behavior-inline: contain;
  touch-action: pan-x pan-y;
  scrollbar-width: none;
}
.afd-home-product-rail__track::-webkit-scrollbar { display: none; }
.afd-home-product-rail__track:focus-visible { outline: 3px solid var(--afd-navy); outline-offset: -3px; border-radius: var(--afd-radius-md); }
/* Begge klippende kasser har 8 px luft til kortets 2 px hover-loeft og
   fokusrammen. Ingen fade laegger et hvidt sloer over sidste synlige kort. */
.afd-home-product-rail__track .afd-card--product { flex: 0 0 var(--afd-deal-rail-card-width); min-width: 0; scroll-snap-align: start; }
.afd-home-product-rail .afd-card--product .afd-card__img { height: var(--afd-deal-rail-image-height); min-height: var(--afd-deal-rail-image-height); flex-basis: var(--afd-deal-rail-image-height); }
.afd-home-product-rail .afd-card__body { padding: var(--afd-space-4); }
.afd-home-product-rail .afd-card__title { font-size: .9rem; }
.afd-home-product-rail .afd-card__brand { font-size: .7rem; }
.afd-home-product-rail .afd-card__price { font-size: 1.35rem; }
.afd-home-product-rail .afd-card__meta { font-size: var(--afd-fs-small); }
body.afd-page .afd-home-product-rail .afd-card__cta { min-height: 48px; box-sizing: border-box; font-size: var(--afd-fs-small); }
body.afd-page .afd-home-product-rail .afd-card__cta,
body.afd-page .afd-home-product-rail .afd-card__cta:hover,
body.afd-page .afd-home-product-rail .afd-card__cta:focus-visible { color: var(--afd-navy); }
.afd-home-product-rail + .afd-listing-products { margin-top: var(--afd-space-1); }
@media (min-width: 600px) {
  .afd-home-product-rail__header { grid-template-columns: minmax(0,1fr); gap: var(--afd-space-3); padding: var(--afd-space-6); }
  .afd-home-product-rail .afd-home-product-rail__title { grid-column: auto; grid-row: auto; font-size: var(--afd-deal-rail-title-size); }
  .afd-home-product-rail__actions { display: flex; }
  .afd-home-product-rail .afd-home-product-rail__all { grid-column: auto; grid-row: auto; }
  .afd-home-product-rail .afd-home-product-rail__controls { grid-column: auto; grid-row: auto; align-self: auto; gap: var(--afd-space-2); }
  .afd-home-product-rail .afd-home-product-rail__controls button { background: var(--afd-accent); }
  .afd-home-product-rail .afd-home-product-rail__controls button:hover:not(:disabled),
  .afd-home-product-rail .afd-home-product-rail__controls button:focus-visible:not(:disabled) { background: var(--afd-accent-hover); }
  .afd-home-product-rail .afd-home-product-rail__controls button .afd-carousel-chevron { width: var(--afd-space-5); height: var(--afd-space-5); }
  .afd-home-product-rail__body { padding: var(--afd-space-4); }
  .afd-home-product-rail__track .afd-card--product { flex-basis: calc((100% - 12px)/2); }
}
@media (min-width: 900px) {
  .afd-home-product-rail { margin-bottom: var(--afd-space-12); }
  .afd-home-product-rail__header { grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--afd-space-6); padding: var(--afd-space-8); }
  .afd-home-product-rail .afd-home-product-rail__title { font-size: var(--afd-deal-rail-title-size-lg); }
  .afd-home-product-rail__actions { gap: var(--afd-space-5); }
  .afd-home-product-rail .afd-home-product-rail__all { font-size: 1rem; }
  .afd-home-product-rail__track { gap: var(--afd-space-4); }
  .afd-home-product-rail__track .afd-card--product { flex-basis: calc((100% - 48px)/4); }
  .afd-home-product-rail .afd-card--product .afd-card__img { height: var(--afd-deal-rail-image-height-lg); min-height: var(--afd-deal-rail-image-height-lg); flex-basis: var(--afd-deal-rail-image-height-lg); }
  .afd-home-product-rail .afd-card__title { font-size: 1rem; }
  .afd-home-product-rail .afd-card__price { font-size: 1.5rem; }
  body.afd-page .afd-home-product-rail .afd-card__cta { min-height: 52px; }
}
/* Produktsøgningens direkte forslag: samme rolige dropdown-sprog som
   kategori-søgningen, men med produktfoto, kontekst og pris. */
.afd-catalog-hero { position: relative; z-index: 3; overflow: visible; }
.afd-catalog-layout { position: relative; z-index: 1; }
.afd-catalog-hero-search-wrap { position: relative; z-index: 4; }
.afd-catalog-suggest__results {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: var(--afd-z-dropdown);
  width: 100%;
  max-height: 430px;
  box-sizing: border-box;
  overflow-y: auto;
  padding: 7px;
  border: 1px solid rgba(20,51,92,.12);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 22px 52px rgba(14,39,71,.22);
}
.afd-catalog-suggest__results > a[role="option"] {
  min-width: 0;
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 9px;
  border-radius: 11px;
  color: var(--afd-text);
}
.afd-catalog-suggest__results > a[role="option"]:hover,
.afd-catalog-suggest__results > a[role="option"].is-active {
  background: var(--afd-accent-soft);
  text-decoration: none;
}
.afd-catalog-suggest__media {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(20,51,92,.08);
  border-radius: 10px;
  background: #fff;
}
.afd-catalog-suggest__media img { width: 100%; height: 100%; object-fit: contain; }
.afd-catalog-suggest__copy { min-width: 0; display: grid; gap: 3px; }
.afd-catalog-suggest__copy strong {
  overflow: hidden;
  color: var(--afd-navy);
  font: 700 .76rem/1.3 var(--afd-font-heading);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.afd-catalog-suggest__copy small {
  overflow: hidden;
  color: var(--afd-text-muted);
  font-size: .65rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.afd-catalog-suggest__meta { display: grid; justify-items: end; gap: 5px; }
.afd-catalog-suggest__meta > span {
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--afd-accent-soft);
  color: var(--afd-accent-hover);
  font: 700 .58rem/1 var(--afd-font-heading);
}
.afd-catalog-suggest__meta > strong { color: var(--afd-navy); font: 700 .68rem/1.2 var(--afd-font-heading); white-space: nowrap; }
.afd-catalog-suggest__all {
  display: flex;
  justify-content: center;
  margin-top: 4px;
  padding: 11px 12px;
  border-top: 1px solid rgba(20,51,92,.08);
  color: var(--afd-accent-hover);
  font: 700 .7rem/1.3 var(--afd-font-heading);
  text-align: center;
}
.afd-catalog-suggest__all:hover { color: var(--afd-navy); text-decoration: none; }
.afd-catalog-suggest__loading,
.afd-catalog-suggest__empty { padding: 18px 14px; color: var(--afd-text-muted); font-size: .72rem; text-align: center; }

/* Samlet rytmeaudit 2026-07-22: store moduler faar en tydelig 32/48-rytme,
   mens kompakte interne elementer beholder deres lokale spacing. */
.afd-home-hero + .afd-home-animal-carousel,
.afd-home-animal-carousel + .afd-home-product-rail,
.afd-home-product-rail + .afd-home-how,
.afd-home-how + .afd-home-popular,
.afd-home-popular + .afd-home-rated,
.afd-home-rated + .afd-home-trust,
.afd-home-trust + .afd-home-cta,
.afd-cross-catalog + .afd-home-popular,
.afd-home-trust + .afd-cross-editorial,
.afd-system-tilbud .afd-deals-intro + .afd-catalog-layout,
.afd-system-tilbud .afd-band + .afd-band {
  margin-top: 32px;
}
.afd-catalog-hero + .afd-catalog-layout { margin-top: 32px; }
.afd-category-section__head h2,
.afd-home-popular__heading h2 { margin-bottom: 8px; }
.afd-cross-hero__copy h1 + p { margin-top: 12px; }
.afd-category-hero__copy h1 + p { margin-top: 8px; }
@media (min-width: 900px) {
  .afd-home-hero + .afd-home-animal-carousel,
  .afd-home-animal-carousel + .afd-home-product-rail,
  .afd-home-product-rail + .afd-home-how,
  .afd-home-how + .afd-home-popular,
  .afd-home-popular + .afd-home-rated,
  .afd-home-rated + .afd-home-trust,
  .afd-home-trust + .afd-home-cta,
  .afd-cross-catalog + .afd-home-popular,
  .afd-home-trust + .afd-cross-editorial,
  .afd-system-tilbud .afd-deals-intro + .afd-catalog-layout,
  .afd-system-tilbud .afd-band + .afd-band {
    margin-top: 48px;
  }
  .afd-catalog-hero + .afd-catalog-layout { margin-top: 36px; }
}

/* ---------- Forside: autoritativ referencehero og skjulte scrollbars 2026-07-22 ---------- */
/* Denne afsluttende kontrakt samler de tidligere hero-lag. Astra-headeren
   forbliver global; kun selve DyrDyr-heroen følger referencekompositionen. */
body.afd-frontpage.afd-page .afd-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: none;
  align-items: center;
  gap: 24px;
  min-height: 0;
  padding: 30px 22px;
  overflow: hidden;
  border: 1px solid #F0DFCF;
  border-radius: 28px;
  background: radial-gradient(circle at 90% 8%, rgba(255,255,255,.76), transparent 20%), linear-gradient(122deg, #FFF9F2 0%, #FFFDF9 58%, #F8FBFD 100%);
  box-shadow: 0 18px 46px rgba(14,39,71,.08);
}
body.afd-frontpage.afd-page .afd-home-hero__content {
  position: relative;
  z-index: 3;
  display: grid;
  grid-area: auto;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  gap: 17px;
  min-width: 0;
}
body.afd-frontpage.afd-page .afd-home-hero__content > * {
  grid-area: auto;
  min-width: 0;
  max-width: 100%;
}
body.afd-frontpage.afd-page .afd-home-hero__eyebrow {
  display: block;
  margin: 0;
  color: var(--afd-accent-hover);
  font: 800 .7rem/1.25 var(--afd-font-heading);
  letter-spacing: .13em;
  text-transform: uppercase;
}
body.afd-frontpage.afd-page .afd-home-hero h1 {
  max-width: 650px;
  margin: 0;
  color: var(--afd-navy-deep);
  font-size: clamp(2.05rem, 7.4vw, 3.4rem);
  line-height: 1.01;
  letter-spacing: -.045em;
}
body.afd-frontpage.afd-page .afd-home-hero h1 span { color: var(--afd-accent); }
body.afd-frontpage.afd-page .afd-home-hero__content > p {
  max-width: 610px;
  margin: 0;
  color: var(--afd-navy);
  font-size: .98rem;
  line-height: 1.58;
}
body.afd-frontpage.afd-page .afd-home-search {
  width: 100%;
  max-width: 650px;
  min-height: 60px;
  margin: 4px 0 0;
  padding: 5px;
  border: 1px solid rgba(20,51,92,.1);
  border-radius: 17px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 10px 28px rgba(14,39,71,.11);
}
body.afd-frontpage.afd-page .afd-home-search__icon {
  width: 40px;
  height: 40px;
  padding: 7px;
  box-sizing: border-box;
}
body.afd-frontpage.afd-page .afd-home-search__icon .afd-ui-icon {
  width: 26px;
  height: 26px;
  object-fit: contain;
}
body.afd-frontpage.afd-page .afd-home-search input[type="search"] {
  min-width: 0;
  padding: 12px 6px;
  font-size: .92rem;
}
body.afd-frontpage.afd-page .afd-home-search button {
  min-width: 104px;
  height: 50px;
  padding: 0 18px;
  border-radius: 13px;
  font-size: .82rem;
  white-space: nowrap;
}
body.afd-frontpage.afd-page .afd-home-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 8px;
  max-width: 660px;
  margin: 5px 0 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
body.afd-frontpage.afd-page .afd-home-benefits li {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  align-content: start;
  justify-items: center;
  gap: 5px;
  min-width: 0;
  padding: 0;
  text-align: center;
}
body.afd-frontpage.afd-page .afd-home-benefits li > span {
  grid-row: auto;
  width: 40px;
  height: 40px;
  padding: 6px;
  border-radius: 50%;
  background: #FFF6EA;
}
body.afd-frontpage.afd-page .afd-home-benefits li .afd-ui-icon {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body.afd-frontpage.afd-page .afd-home-benefits b {
  font: 750 .68rem/1.25 var(--afd-font-heading);
}
body.afd-frontpage.afd-page .afd-home-benefits small {
  display: none;
  margin: 0;
}
body.afd-frontpage.afd-page .afd-home-hero__visual {
  position: relative;
  inset: auto;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 100%;
  height: 280px;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(214,125,8,.08);
  border-radius: 24px;
  background: linear-gradient(145deg,#F9EEE2,#FFF8F0);
  opacity: 1;
}
body.afd-frontpage.afd-page .afd-home-hero__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  filter: none;
  transform: none;
}

/* Horisontal navigation bevares via swipe og pile, men browserens skinner
   er aldrig synlige på forsiden. */
body.afd-frontpage.afd-page :where(.afd-home-animal-nav,.afd-home-product-rail,.afd-home-product-rail__track,.afd-home-popular__track,.afd-home-rated__tabs,.afd-home-rated__track) {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
body.afd-frontpage.afd-page .afd-home-animal-nav::-webkit-scrollbar,
body.afd-frontpage.afd-page .afd-home-product-rail::-webkit-scrollbar,
body.afd-frontpage.afd-page .afd-home-product-rail__track::-webkit-scrollbar,
body.afd-frontpage.afd-page .afd-home-popular__track::-webkit-scrollbar,
body.afd-frontpage.afd-page .afd-home-rated__tabs::-webkit-scrollbar,
body.afd-frontpage.afd-page .afd-home-rated__track::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
body.afd-frontpage.afd-page .afd-home-animal-nav { padding-bottom: 5px; }

/* Trinene er et vigtigt forklaringsmodul, ikke mikrocopy. */
body.afd-frontpage.afd-page .afd-home-how {
  padding: 22px 20px 24px;
}
body.afd-frontpage.afd-page .afd-home-how .afd-section-head {
  margin-bottom: 20px;
}
body.afd-frontpage.afd-page .afd-home-how .afd-section-head h2 {
  font-size: clamp(1.45rem, 4vw, 1.85rem);
  line-height: 1.15;
}
body.afd-frontpage.afd-page .afd-home-how__steps { gap: 14px; }
body.afd-frontpage.afd-page .afd-home-how__steps span {
  width: 58px;
  height: 58px;
  padding: 10px;
}
body.afd-frontpage.afd-page .afd-home-how__steps b {
  font: 750 .98rem/1.3 var(--afd-font-heading);
}
body.afd-frontpage.afd-page .afd-home-how__steps p {
  margin-top: 5px;
  font-size: .78rem;
  line-height: 1.45;
}

@media (min-width: 600px) {
  body.afd-frontpage.afd-page .afd-home-hero {
    padding: 40px 36px;
  }
  body.afd-frontpage.afd-page .afd-home-hero__visual {
    height: 390px;
  }
  body.afd-frontpage.afd-page .afd-home-benefits li {
    grid-template-columns: 42px minmax(0,1fr);
    grid-template-rows: auto auto;
    align-items: center;
    justify-items: stretch;
    column-gap: 9px;
    text-align: left;
  }
  body.afd-frontpage.afd-page .afd-home-benefits li > span {
    grid-row: 1 / 3;
  }
  body.afd-frontpage.afd-page .afd-home-benefits small {
    display: block;
    color: var(--afd-text-muted);
    font-size: .62rem;
    line-height: 1.3;
  }
}
@media (min-width: 900px) {
  body.afd-frontpage.afd-page .afd-home-hero {
    grid-template-columns: minmax(0,1.03fr) minmax(420px,.97fr);
    gap: 38px;
    min-height: 590px;
    padding: 48px 46px;
  }
  body.afd-frontpage.afd-page .afd-home-hero h1 {
    font-size: clamp(2.55rem, 3.5vw, 3.15rem);
  }
  body.afd-frontpage.afd-page .afd-home-hero__content > p {
    font-size: 1rem;
  }
  body.afd-frontpage.afd-page .afd-home-hero__visual {
    height: 500px;
    border-radius: 28px;
  }
  body.afd-frontpage.afd-page .afd-home-how {
    padding: 28px 30px 32px;
  }
  body.afd-frontpage.afd-page .afd-home-how__steps {
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 30px;
  }
  body.afd-frontpage.afd-page .afd-home-how__steps > div {
    display: block;
    padding: 10px 8px;
    background: transparent;
    text-align: center;
  }
  body.afd-frontpage.afd-page .afd-home-how__steps > div + div::before {
    display: block;
    width: 34%;
    left: -22%;
    top: 36px;
  }
  body.afd-frontpage.afd-page .afd-home-how__steps span {
    width: 68px;
    height: 68px;
    margin: 0 auto 14px;
    padding: 12px;
  }
  body.afd-frontpage.afd-page .afd-home-how__steps b {
    font-size: 1.05rem;
  }
  body.afd-frontpage.afd-page .afd-home-how__steps p {
    max-width: 230px;
    margin: 7px auto 0;
    font-size: .82rem;
  }
}

/* ============================================================
   SIKKERHEDSNET forsidehero (2026-07-24): ét coherent layout
   UANSET om body faar klassen afd-frontpage. Filen indeholder
   mange aeldre .afd-home-hero-lag der brugte grid-template-areas
   ("content visual") + display:contents paa __content. Rammer den
   autoritative body.afd-frontpage.afd-page-blok ikke (fx forsinket
   deploy eller manglende body-klasse), placerer boernene sig i
   navngivne omraader (title/lead) der ikke findes i det aeldre
   desktop-grid, saa tekstsoejlen kollapser til min-content (hvert
   ord/bogstav paa egen linje). Disse plain-selectorer staar SIDST
   i kilden og giver derfor et sikkert, sammenhaengende fallback:
   __content er altid et rigtigt grid (aldrig display:contents), og
   tekstsoejlen har en laesbar minimumsbredde saa den ikke kan
   kollapse. Den mere specifikke body.afd-frontpage.afd-page-blok
   (0,3,1) vinder fortsat naar den rammer, saa dette aendrer intet i
   den korrekte tilstand. Naar de aeldre hero-lag engang ryddes
   (dedikeret oprydning, test paa 320/375/768/1024/1440), kan dette
   net fjernes igen. */
.afd-home-hero { display: grid; }
.afd-home-hero__content { display: grid; grid-template-columns: minmax(0,1fr); align-content: center; gap: 16px; min-width: 0; }
/* Nulstil de aeldre lags navngivne grid-area (title/lead/eyebrow) paa boernene:
   uden det placeres de i fantom-omraader (fejl-katalog 2026-07-24). Specificiteten
   matcher basis-reglerne (h1 er 0,2,2) saa fallback vinder uden vigtigheds-flag. */
body.afd-page .afd-home-hero__content > * { grid-area: auto; min-width: 0; max-width: 100%; }
body.afd-page .afd-home-hero h1 { grid-area: auto; }
@media (min-width: 900px) {
  .afd-home-hero { grid-template-columns: minmax(360px,1.03fr) minmax(360px,.97fr); grid-template-areas: none; align-items: center; }
  .afd-home-hero__content { grid-area: auto; align-self: center; }
  .afd-home-hero__visual { position: relative; inset: auto; grid-area: auto; z-index: 2; width: 100%; opacity: 1; }
}

/* ---------- Forside: dyr + populaere koebssituationer 2026-07-22 ---------- */
body.afd-frontpage.afd-page .afd-home-animal-carousel {
  position: relative;
  margin-top: 42px;
  padding: 26px 22px 24px;
  overflow: hidden;
  border: 1px solid rgba(20,51,92,.1);
  border-radius: 26px;
  background: linear-gradient(135deg,#FFF 0%,#FFFCF7 100%);
  box-shadow: 0 14px 34px rgba(14,39,71,.06);
}
body.afd-frontpage.afd-page .afd-home-animal-carousel::after {
  content: "";
  position: absolute;
  top: -74px;
  right: -46px;
  width: 180px;
  height: 180px;
  border: 30px solid rgba(240,144,14,.055);
  border-radius: 50%;
  pointer-events: none;
}
body.afd-frontpage.afd-page .afd-home-animal-carousel__head {
  position: relative;
  z-index: 2;
  align-items: end;
  gap: 18px;
  margin-bottom: 20px;
}
body.afd-frontpage.afd-page .afd-home-animal-carousel__head h2 {
  margin: 5px 0 0;
  font-size: clamp(1.75rem,5vw,2.55rem);
  line-height: 1.08;
}
body.afd-frontpage.afd-page .afd-home-animal-nav {
  position: relative;
  z-index: 2;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(156px,1fr);
  gap: 12px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  padding: 2px 2px 7px;
}
body.afd-frontpage.afd-page .afd-home-animal-nav > a {
  display: grid;
  grid-template-columns: 52px minmax(0,1fr);
  grid-template-rows: 1fr;
  align-items: center;
  gap: 11px;
  min-height: 76px;
  padding: 10px 14px;
  scroll-snap-align: start;
  border: 1px solid rgba(20,51,92,.11);
  border-radius: 17px;
  background: rgba(255,255,255,.92);
  color: var(--afd-navy);
  box-shadow: 0 5px 14px rgba(14,39,71,.035);
  text-decoration: none;
  transition: border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
body.afd-frontpage.afd-page .afd-home-animal-nav > a:hover,
body.afd-frontpage.afd-page .afd-home-animal-nav > a:focus-visible {
  border-color: rgba(240,144,14,.62);
  color: var(--afd-navy);
  box-shadow: 0 9px 22px rgba(14,39,71,.09);
  text-decoration: none;
  transform: translateY(-2px);
}
body.afd-frontpage.afd-page .afd-home-animal-nav__media {
  display: grid;
  grid-row: 1;
  place-items: center;
  width: 52px;
  height: 52px;
  padding: 3px;
  overflow: hidden;
  border: 0;
  border-radius: 13px;
  background: #FFF8EE;
}
body.afd-frontpage.afd-page .afd-home-animal-nav__media :where(img,.afd-ui-icon) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body.afd-frontpage.afd-page .afd-home-animal-nav strong {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  margin: 0;
  font: 750 .9rem/1.2 var(--afd-font-heading);
}
body.afd-frontpage.afd-page .afd-home-animal-nav small { display: none; }
body.afd-frontpage.afd-page .afd-home-animal-nav__offer {
  background: linear-gradient(135deg,#FFF8EE,#FFF);
}
body.afd-frontpage.afd-page .afd-home-animal-nav__offer .afd-home-animal-nav__media {
  padding: 10px;
}

/* Populaere behov (v2 2026-08-31): GENERELLE behovskort (label uden dyr) med
   dyre-chips til hvert dyrs publicerede landing; primaer-CTA, titel og
   billedzone gaar til foerste dyr i prioriteret raekkefoelge. Billedet fra
   omraadet staar i sin egen hvide, indrammede billedzone med contain (samme
   kontrakt som produktkortene): intet overlaeb, ingen beskaering, ingen
   ikon-dubletter. MOBIL er en karrusel (delte carousel-JS): scroll-snap-spor
   med swipe i begge retninger og positionsprikker, INGEN pile (app-foelelse,
   ejer-krav); fra 600px et almindeligt 2/3-kolonne grid uden kontroller. */
body.afd-frontpage.afd-page .afd-home-usecases {
  position: relative;
  margin-top: 22px;
  padding: 26px 22px;
  overflow: hidden;
  border: 1px solid rgba(20,51,92,.1);
  border-radius: 26px;
  background: linear-gradient(135deg,#FFFDF9 0%,#FFF 52%,#FFF9F1 100%);
  box-shadow: 0 14px 34px rgba(14,39,71,.06);
}
body.afd-frontpage.afd-page .afd-home-usecases::before {
  content: "";
  position: absolute;
  right: -85px;
  bottom: -104px;
  width: 230px;
  height: 230px;
  border: 34px solid rgba(240,144,14,.045);
  border-radius: 50%;
  pointer-events: none;
}
body.afd-frontpage.afd-page .afd-home-usecases__head {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}
body.afd-frontpage.afd-page .afd-home-usecases__head h2,
body.afd-frontpage.afd-page .afd-home-usecases-title {
  margin: 5px 0 7px;
  font-size: clamp(1.65rem,4.6vw,2.35rem);
  line-height: 1.08;
}
body.afd-frontpage.afd-page .afd-home-usecases__head p {
  max-width: 660px;
  margin: 0;
  color: var(--afd-text-muted);
  font-size: .87rem;
  line-height: 1.5;
}
body.afd-frontpage.afd-page .afd-home-usecases__nav {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}
body.afd-frontpage.afd-page .afd-home-usecases__nav > a {
  display: none;
  align-items: center;
  gap: 8px;
  color: var(--afd-accent-hover);
  font: 750 .78rem/1.2 var(--afd-font-heading);
  text-decoration: none;
}
/* Mobil er en karrusel med ren swipe-foelelse: INGEN pile (ejer-krav
   2026-08-31), kun prikker; fra 600px bliver samme element et grid igen. */
body.afd-frontpage.afd-page .afd-home-usecases__grid {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 12px;
  margin: 0 -22px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 22px;
  padding: 2px 22px 10px;
  scrollbar-width: none;
}
body.afd-frontpage.afd-page .afd-home-usecases__grid::-webkit-scrollbar { display: none; }
body.afd-frontpage.afd-page .afd-home-usecases__dots {
  display: flex;
  min-height: 30px;
  align-items: flex-end;
  justify-content: center;
  gap: 6px;
  padding-top: 12px;
}
body.afd-frontpage.afd-page .afd-home-usecases__dots button {
  width: 20px;
  height: 4px;
  padding: 0;
  border: 0;
  border-radius: 99px;
  background: #E5E7EB;
  cursor: pointer;
  transition: width .18s ease, background .18s ease;
}
body.afd-frontpage.afd-page .afd-home-usecases__dots button.is-active { width: 42px; background: var(--afd-accent); }
body.afd-frontpage.afd-page .afd-home-usecase {
  position: relative;
  flex: 0 0 min(66%, 250px);
  scroll-snap-align: start;
  display: grid;
  grid-template-columns: minmax(0,1fr);
  grid-template-rows: 132px auto 1fr;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid rgba(20,51,92,.1);
  border-radius: 20px;
  background: linear-gradient(135deg,#FFF 0%,#FFFEFC 60%,#FFF6E9 100%);
  color: var(--afd-navy);
  box-shadow: 0 9px 24px rgba(14,39,71,.055);
  transition: border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
body.afd-frontpage.afd-page .afd-home-usecase:hover,
body.afd-frontpage.afd-page .afd-home-usecase:focus-within {
  border-color: rgba(240,144,14,.58);
  box-shadow: 0 15px 32px rgba(14,39,71,.11);
  transform: translateY(-3px);
}
/* Titlen staar paa sin egen fuldbredde-raekke, saa lange behov som
   "Aktivitetslegetoej" aldrig knaekker midt i ordet (ejer-krav 2026-08-31). */
body.afd-frontpage.afd-page .afd-home-usecase__title {
  grid-row: 2;
  min-width: 0;
  margin: 0;
  padding: 12px 16px 0;
  font: 750 1.04rem/1.18 var(--afd-font-heading);
}
body.afd-frontpage.afd-page .afd-home-usecase__title a {
  color: var(--afd-navy);
  text-decoration: none;
}
body.afd-frontpage.afd-page .afd-home-usecase__title a:hover,
body.afd-frontpage.afd-page .afd-home-usecase__title a:focus-visible {
  color: var(--afd-accent-hover);
  text-decoration: none;
}
body.afd-frontpage.afd-page .afd-home-usecase__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  grid-row: 3;
  padding: 5px 16px 15px;
}
/* FAST INTERN RYTME (ejer-krav 2026-08-31): alle kort skal have samme
   linjer, uanset hvor lang beskrivelsen er, og hvor mange dyr behovet
   daekker. Beskrivelsen faar praecis TO linjer (klippes, aldrig mere,
   aldrig mindre), saa dyrevalget altid begynder i SAMME hoejde paa alle
   kort. Foer flyder valget: kort med faa dyr fik det skubbet ned i bunden
   af en margin-top: auto, kort med mange fik det lige under teksten. */
body.afd-frontpage.afd-page .afd-home-usecase__copy > small {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  min-height: 2.2rem;
  margin-bottom: 12px;
  overflow: hidden;
  color: var(--afd-text-muted);
  font-size: .74rem;
  line-height: 1.45;
}
/* Dyrevalget ER handlingen (aerlig CTA, 2026-08-31): en pille pr. dyr der
   faktisk har en publiceret side. Zonen reserverer TO raekker, saa kort med
   to og kort med fire dyr har samme hoejde og flugter paa tvaers. */
body.afd-frontpage.afd-page .afd-home-usecase__animals {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 7px;
  min-height: 71px;
  margin-top: 0;
}
body.afd-frontpage.afd-page .afd-home-usecase__animals a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 14px;
  border: 1px solid rgba(240,144,14,.66);
  border-radius: 999px;
  color: var(--afd-accent-hover);
  font: 700 .72rem/1.2 var(--afd-font-heading);
  text-decoration: none;
  white-space: nowrap;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
body.afd-frontpage.afd-page .afd-home-usecase__animals a:hover,
body.afd-frontpage.afd-page .afd-home-usecase__animals a:focus-visible {
  background: var(--afd-accent);
  border-color: var(--afd-accent);
  color: #fff;
  text-decoration: none;
}
/* Hvid billedzone med contain: hele produktet synligt, aldrig overlaeb.
   Mobil: fuldbreddezone OEVERST paa kortet. Fra 600px: KVADRATISK zone
   (fast bredde/hoejde, lodret centreret), aldrig en aflang soejle. */
body.afd-frontpage.afd-page .afd-home-usecase__media {
  display: grid;
  place-items: center;
  min-width: 0;
  grid-row: 1;
  margin: 12px 12px 0;
  padding: 10px;
  overflow: hidden;
  border: 1px solid rgba(20,51,92,.08);
  border-radius: 14px;
  background: #FFF;
}
body.afd-frontpage.afd-page .afd-home-usecase__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body.afd-frontpage.afd-page .afd-home-usecase__fallback {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  padding: 14px;
  border-radius: 50%;
  background: #FFF5E7;
}
body.afd-frontpage.afd-page .afd-home-usecase__fallback .afd-ui-icon {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (min-width:600px) {
  body.afd-frontpage.afd-page .afd-home-animal-carousel,
  body.afd-frontpage.afd-page .afd-home-usecases { padding: 30px 28px; }
  body.afd-frontpage.afd-page .afd-home-usecases__nav > a { display: inline-flex; }
  body.afd-frontpage.afd-page .afd-home-usecases__dots { display: none; }
  body.afd-frontpage.afd-page .afd-home-usecases__grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
    margin: 0;
    overflow: visible;
    scroll-snap-type: none;
    padding: 0;
  }
  /* Titlen spaender HELE kortets bredde (raekke 1), saa lange behov staar
     paa EEN linje; under den: copy til venstre, kvadratisk billede til hoejre. */
  body.afd-frontpage.afd-page .afd-home-usecase {
    flex: none;
    grid-template-columns: minmax(0,1fr) 124px;
    grid-template-rows: auto 1fr;
  }
  body.afd-frontpage.afd-page .afd-home-usecase__title { grid-row: 1; grid-column: 1 / -1; padding: 16px 16px 0; }
  body.afd-frontpage.afd-page .afd-home-usecase__copy { grid-row: 2; grid-column: 1; padding: 6px 14px 16px 16px; }
  /* Billedzonen FLUGTER med kortets egne kanter (ejer-fund 2026-08-31: den
     hvide flade sad skaevt ude ved kanten). Samme afstand til hoejre og
     bund som copyens padding, og toppen flugter med copyens foerste linje,
     saa fladen laeser som en del af kortet og ikke som et loest felt. */
  body.afd-frontpage.afd-page .afd-home-usecase__media {
    grid-row: 2;
    grid-column: 2;
    align-self: center;
    width: 112px;
    height: 112px;
    margin: 0 16px 16px 0;
  }
}
@media (min-width:900px) {
  body.afd-frontpage.afd-page .afd-home-animal-carousel { margin-top: 52px; padding: 34px 32px 30px; }
  body.afd-frontpage.afd-page .afd-home-animal-nav { grid-auto-columns: minmax(180px,1fr); }
  body.afd-frontpage.afd-page .afd-home-usecases { margin-top: 26px; padding: 34px 32px; }
  body.afd-frontpage.afd-page .afd-home-usecases__head { margin-bottom: 24px; }
  body.afd-frontpage.afd-page .afd-home-usecases__grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
  body.afd-frontpage.afd-page .afd-home-usecase { grid-template-columns: minmax(0,1fr) 132px; }
  body.afd-frontpage.afd-page .afd-home-usecase__title { padding: 18px 20px 0; font-size: 1.16rem; }
  body.afd-frontpage.afd-page .afd-home-usecase__copy { padding: 7px 16px 20px 20px; }
  body.afd-frontpage.afd-page .afd-home-usecase__media { width: 128px; height: 128px; margin: 0 20px 20px 0; }
}


/* ---------- Produktkort: HELE produktet synligt (contain), 2026-07-24 ---------- */
/* Én autoritativ regel for den fælles afd_render_product_card-komponent:
   billedrammen beholder modulernes valgte højde/aspect-ratio, produktbilledet
   fylder fladen så meget som muligt UDEN at beskære (contain), så hele produktet
   altid ses og aldrig flyder ud over kortet. Erstatter den tidligere cover-
   kontrakt (2026-07-22) der zoomede og beskar produkterne. */
body.afd-page .afd-card--product .afd-card__img {
  padding: 10px;
  background: #fff;
  overflow: hidden;
}
body.afd-page .afd-card--product .afd-card__img > img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  transition: transform .25s ease;
}
body.afd-page .afd-card--product:hover .afd-card__img > img {
  transform: scale(1.04);
}

/* ---------- Produktkort: ensartede start-positioner sitewide 2026-07-24 ----------
   Brand-linjen reserveres ALTID (også når produktet ingen brand har), så titlen
   altid starter samme sted, og titlen har FAST højde på 3 linjer, så prisen altid
   flugter på tværs af kort uanset om titlen fylder 1, 2 eller 3 linjer. Gælder ALLE
   kort-varianter (populære, tilbud, bedst bedømte, katalog, relaterede, hub). */
/* Tom brand (produkt uden maerke) beholder en usynlig nbsp-linje, saa den fylder
   PRAECIS samme hoejde som en udfyldt brand/chip (inkl. dens lodrette padding),
   men uden synlig baggrund/tekst. Saa starter titlen samme sted paa alle kort. */
body.afd-page .afd-card--product .afd-card__brand--empty {
  background: none;
  border: 0;
  padding-left: 0;
  padding-right: 0;
  color: transparent;
}
body.afd-page .afd-card--product .afd-card__title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 1.3;
  min-height: 3.9em;
  overflow: hidden;
}

/* ---------- Top 3-udvalg (cross-landinger, ejer-reference 2026-07-27) ----------
   Cremefarvet modul i containerbredden: centreret hoved med ikon-delelinje,
   tre kort og en aerlig tryghedsraekke. MOBIL er en scroll-snap-karrusel i
   RANG-raekkefoelge (nr. 1 foerst, saa 2 og 3, ejer-krav). Fra 900px bliver
   sporet et 3-kolonne-gitter, hvor nr. 1 flyttes til MIDTEN med order og
   loeftes med accent-kant, navy baand og medaljon. Ingen nye farver: alt er
   eksisterende tokens (stjernens #FFC53D deles med .afd-badge--rating). */
.afd-top3 {
  margin-block: 36px var(--afd-section-gap);
  padding: 0;
}
.afd-top3__head { max-width: 640px; margin-inline: auto; text-align: center; }
.afd-top3__divider { display: flex; align-items: center; justify-content: center; gap: 14px; }
.afd-top3__divider-line { flex: 0 1 90px; height: 1px; background: var(--afd-border); }
.afd-top3__divider-icon {
  display: flex;
  flex: 0 0 46px;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--afd-border);
  border-radius: 50%;
  background: var(--afd-bg);
}
.afd-top3__divider-icon .afd-ui-icon { width: 26px; height: 26px; object-fit: contain; }
.afd-top3__head h2 { margin: 16px 0 0; font-size: clamp(1.6rem, 4vw + .6rem, 2.35rem); }
.afd-top3__lead { margin: 10px 0 0; color: var(--afd-text-muted); font-size: .92rem; }
.afd-top3__track {
  display: flex;
  gap: 14px;
  margin-top: 26px;
  padding: 8px 2px 6px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.afd-top3__track::-webkit-scrollbar { display: none; }
.afd-top3__card {
  position: relative;
  display: flex;
  flex: 0 0 84%;
  flex-direction: column;
  max-width: 340px;
  border: 1px solid var(--afd-border);
  border-radius: var(--afd-radius-module);
  background: var(--afd-bg);
  box-shadow: var(--afd-shadow-sm);
  scroll-snap-align: start;
}
.afd-top3__card--lead { border: 2px solid var(--afd-accent); box-shadow: var(--afd-shadow-md); }
.afd-top3__ribbon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 46px;
  padding: 11px 16px;
  border-radius: 17px 17px 0 0;
  background: var(--afd-navy-grad);
  color: #fff;
  font: 700 .7rem/1.25 var(--afd-font-heading);
  letter-spacing: .1em;
  text-align: center;
  text-transform: uppercase;
}
.afd-top3__ribbon-icon {
  display: flex;
  flex: 0 0 26px;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--afd-bg);
}
.afd-top3__ribbon-icon .afd-ui-icon { width: 17px; height: 17px; object-fit: contain; }
/* Badge-raekke: flaget yderst til venstre, scoren ALTID yderst til hoejre
   (margin-left:auto, saa lead-kortet uden flag ikke faar scoren i venstre
   side). Fast minimumshoejde holder de tre kort i samme rytme. */
.afd-top3__badges {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 14px 16px 0;
}
/* Fast, moderat billedhoejde (produktkort-praksis paa sitet): ens billedflade
   paa alle tre kort, saa titel og pris flugter og billedet aldrig dominerer. */
.afd-top3__media { display: flex; flex: 0 0 auto; padding: 8px 16px 2px; }
.afd-top3__flag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 13px 5px 5px;
  border-radius: 999px;
  background: var(--afd-accent-soft);
  color: var(--afd-navy);
  font: 700 .64rem/1 var(--afd-font-heading);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.afd-top3__flag-icon {
  display: flex;
  flex: 0 0 24px;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--afd-bg);
}
.afd-top3__flag-icon .afd-ui-icon { width: 16px; height: 16px; object-fit: contain; }
.afd-top3__score {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  margin-left: auto;
  padding: 6px 11px;
  border-radius: 12px;
  background: var(--afd-navy-deep);
  color: #fff;
}
.afd-top3__score-val { display: flex; align-items: center; gap: 4px; font: 800 1rem/1 var(--afd-font-heading); }
.afd-top3__score-star { color: #FFC53D; font-size: .82rem; line-height: 1; }
.afd-top3__score-max { color: rgba(255,255,255,.72); font-size: .6rem; letter-spacing: .04em; }
.afd-top3__img { display: block; flex: 1; height: 156px; padding: 6px; background: var(--afd-bg); }
.afd-top3__img img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.afd-top3__img .afd-card__placeholder { display: block; width: 62px; height: 62px; margin: auto; color: var(--afd-border); }
.afd-top3__body { display: flex; flex: 1; flex-direction: column; padding: 6px 18px 20px; text-align: center; }
/* Hele titlen skal staa der (ejer 2026-07-27): ingen klipning af teksten.
   Fast minimumshoejde paa to linjer holder rytmen; lange titler bryder frit. */
.afd-top3__title { min-height: 2.6em; margin: 0; overflow-wrap: anywhere; font: 700 1.16rem/1.3 var(--afd-font-heading); }
.afd-top3__title a { color: var(--afd-navy); }
.afd-top3__title a:hover, .afd-top3__title a:focus-visible { color: var(--afd-accent-hover); }
.afd-top3__price { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 9px; margin-top: auto; padding-top: 18px; }
.afd-top3__price-now { color: var(--afd-accent); font: 800 1.34rem/1 var(--afd-font-heading); }
.afd-top3__price-now small { color: var(--afd-text-muted); font-size: .62rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.afd-top3__price-old { color: var(--afd-text-muted); font-size: .92rem; text-decoration: line-through; }
.afd-top3__meta { margin-top: 5px; color: var(--afd-text-muted); font-size: .76rem; }
.afd-top3__cta { display: flex; align-items: center; justify-content: center; gap: 9px; box-sizing: border-box; width: 100%; margin-top: 14px; }
.afd-top3__cta-arrow { display: block; width: 18px; height: 18px; }
.afd-top3__cta-arrow svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
/* Mobil: samme swipe-mekanik som produktkortene (ejer 2026-07-27), saa hele
   modulet opfoerer sig ens. Fra 600px er der plads til alle fire paa en raekke. */
.afd-top3__assurance {
  display: flex;
  gap: 12px;
  margin-top: 26px;
  padding: 22px 2px 4px;
  border-top: 1px solid var(--afd-border);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.afd-top3__assurance::-webkit-scrollbar { display: none; }
.afd-top3__assure { display: flex; flex: 0 0 68%; align-items: center; gap: 10px; scroll-snap-align: start; }
.afd-top3__assure-text { min-width: 0; overflow-wrap: anywhere; }
.afd-top3__assure-icon {
  display: flex;
  flex: 0 0 34px;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--afd-border);
  border-radius: 50%;
  background: var(--afd-bg);
}
.afd-top3__assure-icon .afd-ui-icon { width: 19px; height: 19px; object-fit: contain; }
.afd-top3__assure-text strong { display: block; color: var(--afd-navy); font: 700 .8rem/1.25 var(--afd-font-heading); }
.afd-top3__assure-text span { display: block; color: var(--afd-text-muted); font-size: .74rem; }

@media (min-width: 600px) {
  .afd-top3__card { flex-basis: 45%; } /* to kort + kig til det tredje: karrusellen skal SES */
  .afd-top3__assurance { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px 10px; padding: 22px 0 0; overflow: visible; }
  .afd-top3__assure { flex-basis: auto; }
}
@media (min-width: 900px) {
  .afd-top3 { margin-block: 48px var(--afd-section-gap-lg); }
  .afd-top3__track {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1.12fr) minmax(0,1fr);
    align-items: stretch;
    gap: 22px;
    margin-top: 42px;
    padding: 26px 0 0;
    overflow: visible;
  }
  .afd-top3__card { flex-basis: auto; max-width: none; }
  .afd-top3__track > :nth-child(1) { order: 2; }
  .afd-top3__track > :nth-child(2) { order: 1; }
  .afd-top3__track > :nth-child(3) { order: 3; }
  /* Nr. 1 vokser UD af raekken (forlaeggets loeft), mens nr. 2 og 3 straekkes
     til samme hoejde, saa deres CTA'er flugter praecist. */
  .afd-top3__card--lead { margin-block: -20px; }
  .afd-top3__card--lead .afd-top3__body { padding: 8px 24px 26px; }
  .afd-top3__card--lead .afd-top3__title { font-size: 1.3rem; }
  .afd-top3__img { height: 184px; }
  .afd-top3__assurance { margin-top: 34px; padding-top: 26px; }
}

/* ---------- Links i redaktionel tekst (ejer-krav 2026-07-27) ----------
   Links gik i et med broedteksten og faar derfor link-farven. Ejeren har
   valgt FARVE ALENE: ingen understregning og intet farveskift ved hover.
   Noteret aabent: WCAG 1.4.1 kraever en ikke-farve-indikator, naar
   kontrasten mellem link og broedtekst er under 3:1, og det er den (2,9:1).
   Ingen farve kan lukke det hul: 4,5:1 mod hvid og 3:1 mod broedteksten
   udelukker hinanden matematisk. Vi beholder derfor understregningen ved
   TASTATURFOKUS, saa fokus stadig er synligt (2.4.7). */
body.afd-page :where(.afd-prose,.afd-cross-editorial__content,.afd-article-body,.afd-faq__item,.afd-info-page,.afd-toplist__why,.afd-callout,.afd-keyfacts,.afd-sources) a,
body.afd-page :where(.afd-prose,.afd-cross-editorial__content,.afd-article-body,.afd-faq__item,.afd-info-page,.afd-toplist__why,.afd-callout,.afd-keyfacts,.afd-sources) a:hover {
  color: var(--afd-link);
  text-decoration: none;
}
body.afd-page :where(.afd-prose,.afd-cross-editorial__content,.afd-article-body,.afd-faq__item,.afd-info-page,.afd-toplist__why,.afd-callout,.afd-keyfacts,.afd-sources) a:focus-visible {
  color: var(--afd-link);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

/* ---------- MOBIL-AUDIT (ejer-gennemgang 2026-07-27) ----------
   App-foelelse paa mobil: ingen overlappende tekst, ingen klemte kolonner,
   og de tre store handlinger (filtrer, sorter, soeg) skal vaere store nok
   til en tommelfinger. Alt herunder er mobile-first; desktop nulstilles i
   de eksisterende 600/900-blokke. */

/* 1) KATALOG: filter og sortering paa EN raekke over produkterne, og
      filteret aabner som et ark (sheet) i stedet for at skubbe listen ned.
      To niveauer display:contents loefter toolbarens boern op i sidens grid,
      saa filter-knap og sortering kan staa side om side UDEN at flytte
      markup. Fra 900px er alt tilbage til sidebar + toolbar som foer. */
.afd-cross-catalog {
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  grid-template-areas: "head head" "filter sort" "list list" "more more";
  gap: 12px 10px;
  scroll-margin-top: 84px; /* sorterings-ankeret maa ikke lande under headeren */
}
.afd-cross-catalog__main { display: contents; }
.afd-cross-catalog .afd-toolbar { display: contents; }
.afd-cross-catalog .afd-toolbar__head { grid-area: head; }
.afd-cross-catalog .afd-cross-filters { grid-area: filter; align-self: stretch; }
.afd-cross-catalog .afd-sort { grid-area: sort; align-self: stretch; }
.afd-cross-catalog .afd-grid { grid-area: list; }
.afd-cross-catalog .afd-loadmore { grid-area: more; }
.afd-cross-catalog .afd-empty { grid-area: list; }
.afd-listing-products .afd-toolbar__head { padding-bottom: var(--afd-space-3); border-bottom: 1px solid var(--afd-border); }
.afd-cross-catalog .afd-sort { display: flex; align-items: center; }
.afd-cross-catalog .afd-sort label { display: none; }
.afd-cross-catalog .afd-sort select {
  width: 100%;
  min-height: 46px;
  padding: 0 34px 0 14px;
  border: 1px solid var(--afd-border);
  border-radius: 12px;
  background-color: var(--afd-bg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2314335c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  color: var(--afd-navy);
  font: 700 .82rem/1 var(--afd-font-heading);
  -webkit-appearance: none;
  appearance: none;
}
.afd-cross-catalog .afd-cross-filters { border-radius: 12px; }
.afd-cross-catalog .afd-cross-filters__summary { min-height: 46px; padding: 0 14px; font: 700 .82rem/1 var(--afd-font-heading); color: var(--afd-navy); }
/* Filteret som ARK (app-moenster). Naar arket er aabent:
   - baggrunden er laast (body.afd-sheet-open), saa listen ikke scroller bagved
   - summary bliver arkets header med et tydeligt kryds i stedet for chevron
   - bundbaren (nulstil + vis produkter) ligger fast i arket, ALDRIG oven i
     indholdet, og temaets "til toppen"-knap skjules saa den ikke kolliderer. */
body.afd-sheet-open { overflow: hidden; }
/* Scrimmen er sit EGET lag under arket. (Foerste forsoeg brugte en
   box-shadow paa arkets header, men den blev tegnet OVER arkets indhold,
   saa hele filteret saa graat ud. Fanget i visuel kontrol.) */
.afd-cross-filters__details[open]::before {
  content: "";
  position: fixed;
  z-index: calc(var(--afd-z-modal) - 1);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(14,39,71,.5);
}
body.afd-sheet-open #ast-scroll-top { display: none; }
.afd-cross-filters__close { display: none; }
.afd-cross-filters__details[open] .afd-cross-filters__body {
  position: fixed;
  z-index: var(--afd-z-modal);
  top: 82px;
  right: 0;
  bottom: 0;
  left: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 4px 18px 104px;
  background: var(--afd-bg);
}
.afd-cross-filters__details[open] .afd-cross-filters__summary {
  position: fixed;
  z-index: calc(var(--afd-z-modal) + 1);
  top: 18px;
  right: 0;
  left: 0;
  min-height: 64px;
  padding: 0 18px;
  border-bottom: 1px solid var(--afd-border);
  border-radius: 20px 20px 0 0;
  background: var(--afd-bg);
  font: 800 1.05rem/1.2 var(--afd-font-heading);
  box-shadow: 0 -10px 30px rgba(14,39,71,.1);
}
.afd-cross-filters__details[open] .afd-cross-filters__chev { display: none; }
.afd-cross-filters__details[open] .afd-cross-filters__close {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-right: -8px;
  border-radius: 50%;
  background: var(--afd-bg-alt);
  color: var(--afd-navy);
}
.afd-cross-filters__foot { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.afd-cross-filters__clear { flex: 0 0 auto; color: var(--afd-navy); font: 700 .82rem var(--afd-font-heading); }
.afd-cross-filters__apply { flex: 1 1 auto; min-height: 50px; margin-top: 0; }
.afd-cross-filters__details[open] .afd-cross-filters__foot {
  position: fixed;
  z-index: calc(var(--afd-z-modal) + 1);
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0;
  padding: 12px 18px calc(12px + env(safe-area-inset-bottom));
  border-top: 1px solid var(--afd-border);
  background: var(--afd-bg);
  box-shadow: 0 -8px 24px rgba(14,39,71,.1);
}

/* 2) CROSS-/HUB-HERO: noegletallene paa EN raekke (ejer-krav), saa heroen
      ikke bliver en soejle af tal paa mobil. */
.afd-cross-hero__stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.afd-cross-hero__stat { flex-direction: column; align-items: center; gap: 7px; padding: 12px 4px; border-bottom: 0; text-align: center; }
.afd-cross-hero__stat-icon { flex: 0 0 38px; width: 38px; height: 38px; }
.afd-cross-hero__stat-icon img { width: 20px; height: 20px; }
.afd-cross-hero__stat-text strong { font-size: 1rem; }
.afd-cross-hero__stat-text span { font-size: .68rem; line-height: 1.25; }

/* 3) FORSIDE-HERO: kompakt soegefelt (feltet skal have plads til teksten,
      ikke knappen) og dyrebilledet som ROLIG baggrund bag copy. */
.afd-home-search__glass { width: 20px; height: 20px; display: block; }
.afd-home-search button .afd-home-search__label { display: none; }
.afd-home-search button {
  width: 46px;
  min-width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 12px;
  font-size: 1.05rem;
}
.afd-home-search input[type="search"] { font-size: .9rem; text-overflow: ellipsis; }

/* 4) POPULAERE-BAANDET: overskrift og "se alle" laa oven i hinanden paa
      mobil, fordi begge kaempede om samme raekke. Nu bryder de. */
.afd-home-popular__head { flex-wrap: wrap; }
.afd-home-popular__heading { flex: 1 1 100%; }
.afd-home-popular__actions { flex: 1 1 100%; flex-direction: row; align-items: center; justify-content: space-between; }

@media (min-width: 600px) {
  .afd-cross-hero__stat-text strong { font-size: 1.12rem; }
  .afd-home-search button { width: auto; min-width: 96px; padding: 0 18px; font-size: .78rem; }
  .afd-home-search button .afd-home-search__label { display: inline; }
  .afd-home-popular__head { flex-wrap: nowrap; }
  .afd-home-popular__heading { flex: 1 1 auto; }
  .afd-home-popular__actions { flex: 0 0 auto; flex-direction: column; align-items: flex-end; justify-content: flex-start; }
}
@media (min-width: 900px) {
  /* Tilbage til sidebar + hovedkolonne. Baade omraade-navnene OG mobilens
     to lige kolonner skal nulstilles, ellers arver desktop mobil-griddet
     (fanget i visuel kontrol 2026-07-27). */
  .afd-cross-catalog { grid-template-columns: 260px minmax(0,1fr); grid-template-areas: none; gap: 20px; }
  .afd-cross-catalog .afd-toolbar__head,
  .afd-cross-catalog .afd-cross-filters,
  .afd-cross-catalog .afd-sort,
  .afd-cross-catalog .afd-grid,
  .afd-cross-catalog .afd-loadmore,
  .afd-cross-catalog .afd-empty { grid-area: auto; }
  .afd-cross-catalog__main { display: block; }
  .afd-cross-catalog .afd-toolbar { display: flex; }
  .afd-cross-catalog .afd-toolbar__head { padding-bottom: 0; border-bottom: 0; }
  .afd-cross-catalog .afd-sort label { display: inline; }
  .afd-cross-catalog .afd-sort select { width: auto; min-height: 40px; font-weight: 600; }
  .afd-cross-filters__details[open] .afd-cross-filters__body,
  .afd-cross-filters__details[open] .afd-cross-filters__summary,
  .afd-cross-filters__details[open] .afd-cross-filters__foot {
    position: static;
    padding: 0 18px 18px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
  }
  .afd-cross-filters__details[open] .afd-cross-filters__summary { min-height: 0; padding: 14px 18px; font: 700 1rem/1.2 var(--afd-font-heading); cursor: default; pointer-events: none; user-select: none; }
  .afd-cross-filters__details[open] > .afd-cross-filters__summary { flex: 0 0 auto; border-bottom: 1px solid rgba(20,51,92,.1); background: linear-gradient(180deg,#fff 0%,var(--afd-bg-alt) 100%); }
  .afd-cross-filters__details[open] .afd-cross-filters__foot { display: flex; margin-top: 14px; padding: 0 18px 18px; }
  /* 260px sidebar: knapteksten skal paa EEN linje, ikke braekke midt over. */
  .afd-cross-filters__apply { padding-inline: 10px; font-size: .72rem; letter-spacing: .05em; }
  .afd-cross-filters__details[open] .afd-cross-filters__close { display: none; }
  .afd-cross-filters__details[open] .afd-cross-filters__chev { display: none; }
  .afd-cross-filters__details[open]::before { display: none; }
  /* Chromium behandler <details>-indhold gennem en intern wrapper, saa flex
     alene giver bodyen indholdshoejde i stedet for den ledige hoejde. Den
     definitive desktop-cascade afgraenser derfor bodyen fysisk mellem den
     55px faste header og bunden. Det skaber den faktiske overflow, som den
     synlige rail og musehjulet styrer. */
  .afd-cross-filters__details[open] { position: relative; display: block; height: 100%; max-height: 100%; }
  .afd-cross-filters__details[open] .afd-cross-filters__body { display: block; position: absolute; top: 55px; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: scroll; padding: 8px 22px 18px 18px; }
  /* Naar live-controlleren er aktiv, findes intet gemmetrin paa desktop.
     Uden JS vises fallback-submit stadig. Mobil beholder "Se produkter" som
     en ren luk-knap til filterarket. */
  html.afd-live-filters .afd-cross-filters__details[open] .afd-cross-filters__foot { display: none; }
  .afd-cross-hero__stats { display: flex; grid-template-columns: none; }
  .afd-cross-hero__stat { flex-direction: row; align-items: center; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--afd-border); text-align: left; }
  .afd-cross-hero__stat:last-child { border-bottom: 0; }
  .afd-cross-hero__stat-icon { flex: 0 0 46px; width: 46px; height: 46px; }
  .afd-cross-hero__stat-icon img { width: 24px; height: 24px; }
  .afd-cross-hero__stat-text strong { font-size: 1.3rem; }
  .afd-cross-hero__stat-text span { font-size: .78rem; }
}

/* 5a) SOEGEFELTET paa forsiden: knappen er en kompakt cirkel-knap paa mobil,
      saa hele feltet gaar til teksten og placeholderen ikke klippes midt i et
      ord. Lup-ikonet er inline SVG i navy. */
body.afd-frontpage.afd-page .afd-home-search button {
  width: 48px;
  min-width: 48px;
  height: 48px;
  padding: 0;
  border-radius: 13px;
  font-size: 1.1rem;
}
body.afd-frontpage.afd-page .afd-home-search__icon { width: 34px; height: 34px; padding: 0; }
body.afd-frontpage.afd-page .afd-home-search__icon .afd-home-search__glass { width: 21px; height: 21px; }
body.afd-frontpage.afd-page .afd-home-search input[type="search"] { padding: 12px 8px; font-size: .9rem; }

/* 5) FORSIDE-HERO PAA MOBIL: dyrebilledet er en ROLIG baggrund bag copy,
      ikke et selvstaendigt billedkort der skubber soegefeltet ned (ejer-krav
      2026-07-27). Fra 600px er det igen sit eget billedfelt. */
body.afd-frontpage.afd-page .afd-home-hero { position: relative; }
body.afd-frontpage.afd-page .afd-home-hero__visual {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  height: 58%;
  border: 0;
  border-radius: 0;
  background: none;
  opacity: .17;
  pointer-events: none;
}
body.afd-frontpage.afd-page .afd-home-hero__image { object-position: center bottom; }
body.afd-frontpage.afd-page .afd-home-hero__content { position: relative; z-index: 2; }

@media (min-width: 600px) {
  body.afd-frontpage.afd-page .afd-home-search button {
    width: auto;
    min-width: 104px;
    height: 50px;
    padding: 0 18px;
    font-size: .82rem;
  }
  body.afd-frontpage.afd-page .afd-home-hero__visual {
    position: relative;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: 2;
    height: 390px;
    border: 1px solid rgba(214,125,8,.08);
    border-radius: 24px;
    background: linear-gradient(145deg,#F9EEE2,#FFF8F0);
    opacity: 1;
  }
  body.afd-frontpage.afd-page .afd-home-hero__image { object-position: center; }
}

/* ---------- MOBIL-HYGIEJNE (systematisk audit 2026-07-27) ----------
   Boernefejl der samlet giver en daarlig telefonoplevelse. Fundet ved at
   scanne det byggede stylesheet for tre moenstre: tekst under ~11px,
   white-space:nowrap paa hele saetninger, og dekorative elementer der kan
   skabe vandret scroll. */

/* 1) Laesbarhed: 9 til 10px er for lidt paa en telefon i haanden. */
.afd-trustbar__item { font-size: 11px; }
.afd-home-animal-nav a small { font-size: .64rem; }
.afd-home-benefits small { font-size: .66rem; }
.afd-home-how__steps p { font-size: .68rem; }
.afd-home-trust .afd-trust__text { font-size: .7rem; }
.afd-history__stats span { font-size: .66rem; }
.afd-brand-compare__facts span { font-size: .66rem; }
.afd-catalog-stats span { font-size: .68rem; }
.afd-filter-options small { font-size: .68rem; }

/* 2) nowrap paa hele saetninger sprænger 320px-skaerme: kun TAL og priser
      maa laases, aldrig loebende tekst. */
.afd-trustbar__item { white-space: normal; }
.afd-ig__label { white-space: normal; overflow-wrap: anywhere; }

/* 3) Dekorative cirkler maa aldrig kunne skabe vandret scroll. */
.afd-home-cta { overflow: hidden; }

/* 4) Touch-maal: alt man skal ramme med en tommelfinger er mindst 44px.
      Gaelder ogsaa de smaa, oversete kontroller. */
.afd-sort select,
.afd-catalog-sort select,
.afd-cross-filters__band,
.afd-pagination a,
.afd-pagination span { min-height: 44px; }
.afd-cross-filters__band,
.afd-pagination a,
.afd-pagination span { display: inline-flex; align-items: center; }
.afd-cross-filters__checks label { min-height: 40px; }

/* 5) Lange produktnavne og brandnavne maa bryde, aldrig floede ud. */
.afd-card__title,
.afd-top3__title,
.afd-offers__name { overflow-wrap: anywhere; }

@media (min-width: 900px) {
  .afd-cross-filters__checks label { min-height: 0; }
  .afd-cross-filters__band { min-height: 0; }
}

/* Variant-dropdowns: dokumenterede valg, samme engine for hele siden. */
.afd-variants__fields { display: grid; grid-template-columns: minmax(0,1fr); gap: var(--afd-space-3); width: 100%; }
.afd-variants__field { position: relative; min-width: 0; }
.afd-variants .afd-variants__trigger { display: flex; align-items: center; justify-content: space-between; gap: var(--afd-space-3); width: 100%; min-height: 44px; padding: var(--afd-space-3) var(--afd-space-4); box-sizing: border-box; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); background: var(--afd-bg); color: var(--afd-navy); text-align: left; font: inherit; text-transform: none; cursor: pointer; }
.afd-variants__trigger > span:first-child { min-width: 0; }
.afd-variants .afd-variants__field .afd-variants__label { display: block; margin: 0 0 var(--afd-space-1); font: 600 var(--afd-fs-small)/1.3 var(--afd-font-body); color: var(--afd-text-muted); }
.afd-variants__value { display: block; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.afd-variants__chevron { flex: 0 0 var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); transition: transform .15s ease; }
.afd-variants__chevron svg { display: block; width: 100%; height: 100%; }
.afd-variants__trigger[aria-expanded="true"] { border-color: var(--afd-navy); }
.afd-variants__trigger[aria-expanded="true"] .afd-variants__chevron { transform: rotate(180deg); }
.afd-variants__menu { position: absolute; z-index: var(--afd-z-dropdown); top: calc(100% + var(--afd-space-1)); left: 0; right: 0; max-height: var(--afd-variant-menu-height); overflow-y: auto; overscroll-behavior: contain; padding: var(--afd-space-1); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); background: var(--afd-bg); box-shadow: var(--afd-shadow-md); }
.afd-variants .afd-variants__option { display: flex; align-items: center; gap: var(--afd-space-3); width: 100%; min-height: 44px; padding: var(--afd-space-2); box-sizing: border-box; border: 1px solid transparent; border-radius: var(--afd-radius-md); background: var(--afd-bg); color: var(--afd-navy); text-align: left; font: inherit; text-transform: none; cursor: pointer; }
.afd-variants__option > span:last-child { min-width: 0; }
.afd-variants .afd-variants__option:hover, .afd-variants .afd-variants__option[aria-selected="true"] { border-color: var(--afd-navy); background: var(--afd-accent-soft); }
.afd-variants .afd-variants__option.is-unavailable { color: var(--afd-text-muted); }
.afd-variants .afd-variants__option.is-off { opacity: .62; border-style: dashed; }
.afd-variants__thumb { display: flex; align-items: center; justify-content: center; flex: 0 0 var(--afd-variant-thumb); width: var(--afd-variant-thumb); height: var(--afd-variant-thumb); background: var(--afd-bg); border-radius: var(--afd-radius-sm); overflow: hidden; }
.afd-variants__thumb img, .afd-variants__thumb svg { width: 100%; height: 100%; object-fit: contain; }
.afd-variants__name { display: block; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.afd-variants__hint { display: block; color: var(--afd-text-muted); font-size: var(--afd-fs-small); line-height: 1.4; overflow-wrap: anywhere; }
@media (min-width: 600px) {
  .afd-variants__fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Refined kategori-/cross-hero, ejerens reference 2026-10-10.
   Dekorationen er en baggrund paa et inset pseudo-element. Heroens synlige
   overflow bevarer live-soegningens menu, uden en cirkel uden for kortet.
   Home-, produkt-, butiks- og tilbudsheroer er ikke omfattet. */
.afd-refined-hero,
.afd-category-hero,
.afd-catalog-hero:not(.afd-catalog-hero--deals) {
  position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0,1fr);
  --afd-refined-hero-title-size: var(--afd-refined-hero-title-size-mobile);
  --afd-refined-hero-ring-inner: var(--afd-refined-hero-ring-inner-mobile); --afd-refined-hero-ring-outer: var(--afd-refined-hero-ring-outer-mobile);
  gap: var(--afd-space-3); min-width: 0; margin: var(--afd-space-2) 0 var(--afd-space-6);
  padding: var(--afd-space-4); box-sizing: border-box; overflow: visible;
  border: 1px solid var(--afd-refined-hero-border); border-radius: var(--afd-radius-module);
  background: var(--afd-refined-hero-bg); color: var(--afd-navy); box-shadow: none; text-align: left;
}
.afd-category-hero::before,
.afd-catalog-hero:not(.afd-catalog-hero--deals)::before {
  content: ""; position: absolute; inset: 1px; z-index: -1; pointer-events: none;
  border-radius: calc(var(--afd-radius-module) - 1px);
  background: radial-gradient(circle at 100% 0, transparent var(--afd-refined-hero-ring-inner), var(--afd-accent-soft) var(--afd-refined-hero-ring-inner) var(--afd-refined-hero-ring-outer), transparent var(--afd-refined-hero-ring-outer));
}
.afd-refined-hero > *, .afd-category-hero > *, .afd-catalog-hero:not(.afd-catalog-hero--deals) > * { min-width: 0; }
.afd-refined-hero { z-index: 2; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); column-gap: var(--afd-space-2); }
.afd-refined-hero__eyebrow { order: 0; color: var(--afd-text-muted); font-size: var(--afd-refined-hero-meta-size-mobile); line-height: 1.3; overflow-wrap: anywhere; }
.afd-refined-hero__copy { order: 1; grid-column: 1 / -1; min-width: 0; }
.afd-refined-hero__eyebrow, .afd-category-hero .afd-overline, .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-overline, .afd-refined-hero__search-label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; }

.afd-page .afd-refined-hero__title,
.afd-page .afd-category-hero h1,
.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) h1 {
  max-width: none; margin: 0 0 var(--afd-space-2); color: var(--afd-navy);
  font: 700 var(--afd-refined-hero-title-size)/1.12 var(--afd-font-heading); letter-spacing: -.035em;
  overflow-wrap: anywhere; text-wrap: wrap;
}
.afd-refined-hero__title-accent { color: var(--afd-accent); }
.afd-refined-hero__intro,
.afd-category-hero__copy > p,
.afd-catalog-hero:not(.afd-catalog-hero--deals) p {
  max-width: none; margin: 0; color: var(--afd-navy); font-size: var(--afd-refined-hero-intro-size-mobile);
  line-height: 1.45; overflow-wrap: anywhere;
}
.afd-refined-hero__intro > p { font-size: inherit; line-height: inherit; margin-bottom: var(--afd-space-3); }
.afd-refined-hero__intro > :first-child { margin-top: 0; }
.afd-refined-hero__intro > :last-child { margin-bottom: 0; }
.afd-refined-hero__search { order: 2; grid-column: 1 / -1; position: relative; z-index: var(--afd-z-dropdown); min-width: 0; }
.afd-refined-hero__search-label { display: block; color: var(--afd-text-muted); font-size: var(--afd-refined-hero-meta-size-mobile); line-height: 1.3; }
.afd-refined-hero__search-form,
.afd-category-hero .afd-category-search__form,
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search {
  display: flex; align-items: center; gap: var(--afd-space-2); width: 100%; max-width: none;
  min-height: var(--afd-refined-search-height-mobile); margin: 0; padding: var(--afd-refined-search-inset-mobile); box-sizing: border-box;
  border: 1px solid var(--afd-refined-search-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); box-shadow: none;
}
.afd-refined-hero__search-form:focus-within,
.afd-category-hero .afd-category-search__form:focus-within,
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search:focus-within {
  border-color: var(--afd-navy); outline: 3px solid var(--afd-navy); outline-offset: var(--afd-space-1); box-shadow: none;
}
.afd-refined-hero__search-icon,
.afd-category-hero .afd-home-search__icon,
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-home-search__icon {
  display: grid; flex: 0 0 var(--afd-space-5); place-items: center; width: var(--afd-space-5); height: var(--afd-space-5);
  margin-left: var(--afd-space-2); padding: 0; color: var(--afd-navy); pointer-events: none;
}
.afd-refined-hero__search-icon { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.afd-refined-hero__search-icon svg,
.afd-category-hero .afd-home-search__icon :is(svg,img),
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-home-search__icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; }
body.afd-page .afd-refined-hero__search-input,
body.afd-page .afd-category-hero .afd-category-search__form input[type="search"],
body.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search input[type="search"] {
  flex: 1 1 auto; width: 0; min-width: 0; min-height: 44px; box-sizing: border-box; margin: 0; padding: var(--afd-space-2) var(--afd-space-1);
  border: 0; border-radius: var(--afd-radius-sm); background: transparent; color: var(--afd-navy);
  font: 400 var(--afd-fs-body)/1.4 var(--afd-font-body); text-overflow: ellipsis; outline: none; box-shadow: none;
}
.afd-refined-hero__search-input::placeholder { color: var(--afd-text-muted); opacity: 1; }
body.afd-page .afd-refined-hero__search-submit,
body.afd-page .afd-category-hero .afd-category-search__form button,
body.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search button {
  display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: var(--afd-space-2);
  width: auto; min-width: var(--afd-refined-search-button-min-mobile); min-height: 44px; box-sizing: border-box; height: auto; align-self: stretch;
  margin: 0; padding: var(--afd-space-2); border: 0; border-radius: var(--afd-radius-md);
  background: var(--afd-accent); color: var(--afd-navy); font: 700 var(--afd-fs-body)/1.2 var(--afd-font-body);
  text-transform: none; letter-spacing: normal; cursor: pointer; box-shadow: none; transition: background .15s ease;
}
body.afd-page .afd-refined-hero__search-submit:hover,
body.afd-page .afd-category-hero .afd-category-search__form button:hover,
body.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search button:hover { background: var(--afd-accent-hover); color: var(--afd-navy); transform: none; }
.afd-refined-hero__search-submit svg { width: var(--afd-space-5); height: var(--afd-space-5); fill: none; stroke: currentColor; stroke-width: 2; }
.afd-category-hero .afd-home-search__label,
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-home-search__label { display: inline; }
.afd-category-hero .afd-home-search__arrow,
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-home-search__arrow,
.afd-category-hero button:hover .afd-home-search__arrow,
.afd-catalog-hero:not(.afd-catalog-hero--deals) button:hover .afd-home-search__arrow { animation: none; transition: none; transform: none; }
/* Kun genvejenes egen bane scroller. Hero og soegeoverlay har synligt overflow. */
.afd-refined-hero__links { order: 3; grid-column: 1 / -1; display: flex; flex-wrap: nowrap; align-items: center; gap: var(--afd-space-2); min-width: 0; max-width: 100%; padding: var(--afd-space-1) 0 var(--afd-space-3); border-bottom: 1px solid var(--afd-border); overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: var(--afd-space-1); overscroll-behavior-inline: contain; touch-action: pan-x pan-y; scrollbar-width: none; }
.afd-refined-hero__links::-webkit-scrollbar { display: none; }
.afd-refined-hero__links-label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; color: var(--afd-text-muted); font-size: var(--afd-fs-small); }
.afd-page .afd-refined-hero__link { display: inline-flex; flex: 0 0 auto; align-items: center; gap: var(--afd-space-2); min-width: 0; max-width: none; min-height: 44px; box-sizing: border-box; padding: var(--afd-space-2) var(--afd-space-3); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); background: var(--afd-bg); color: var(--afd-navy); font-size: var(--afd-fs-small); font-weight: 700; line-height: 1.35; white-space: nowrap; overflow-wrap: normal; scroll-snap-align: start; }
.afd-refined-hero__link > span { min-width: 0; white-space: nowrap; overflow-wrap: normal; }
.afd-refined-hero__links .afd-refined-hero__link:focus-visible { outline-offset: -3px; }
.afd-refined-hero__link svg { flex: 0 0 var(--afd-space-4); width: var(--afd-space-4); height: var(--afd-space-4); color: var(--afd-accent); fill: none; stroke: currentColor; stroke-width: 2; }
.afd-refined-hero__stats { order: 4; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--afd-space-1) var(--afd-space-3); padding-top: var(--afd-space-2); border-top: 1px solid var(--afd-border); }
.afd-refined-hero__stat { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: var(--afd-space-1); min-width: 0; color: var(--afd-navy); font-size: var(--afd-fs-small); line-height: 1.4; overflow-wrap: anywhere; }
.afd-refined-hero__stat-value { font-weight: 700; }
.afd-refined-hero__stats > .afd-refined-hero__stat + .afd-refined-hero__stat::before { content: "·"; color: var(--afd-text-muted); margin-right: var(--afd-space-1); }
.afd-refined-hero__stat-label { color: var(--afd-text-muted); }
.afd-refined-hero__footer { order: 5; display: grid; gap: var(--afd-space-2); min-width: 0; padding-top: var(--afd-space-2); border-top: 1px solid var(--afd-border); color: var(--afd-text-muted); font-size: var(--afd-refined-hero-meta-size-mobile); line-height: 1.45; }
.afd-refined-hero--has-stats .afd-refined-hero__footer { padding-top: 0; border-top: 0; }
.afd-refined-hero__fresh { min-width: 0; overflow-wrap: anywhere; }
.afd-refined-hero__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--afd-space-1) var(--afd-space-3); font-size: var(--afd-refined-hero-meta-size-mobile); line-height: 1.4; }
.afd-refined-hero__meta .afd-refined-hero__stat { color: var(--afd-text-muted); font-size: var(--afd-refined-hero-meta-size-mobile); }
.afd-refined-hero__guide { min-width: 0; }
/* Mobil: samme data flyttes mellem top og bund uden dublerede tal.
   Kendte tællere/prisværdier holder een række; store værdier kan scrolle
   lokalt i deres celle, mens ukendt metadata beholder sin fulde tekst. */
.afd-refined-hero__stats, .afd-refined-hero__footer, .afd-refined-hero__meta { display: contents; }
.afd-refined-hero__stat { order: 4; grid-column: 1 / -1; }
.afd-refined-hero__stat--products, .afd-refined-hero__stat--stores, .afd-refined-hero__meta .afd-refined-hero__stat--range { flex-wrap: nowrap; white-space: nowrap; overflow-wrap: normal; overflow-x: auto; scrollbar-width: none; }
.afd-refined-hero__stat--products::-webkit-scrollbar, .afd-refined-hero__stat--stores::-webkit-scrollbar, .afd-refined-hero__stat--range::-webkit-scrollbar, .afd-refined-hero__fresh--compact::-webkit-scrollbar { display: none; }
.afd-refined-hero__stat--products { grid-column: 1; }
.afd-refined-hero__meta .afd-refined-hero__stat--range { grid-column: 2; justify-self: stretch; justify-content: flex-start; color: var(--afd-navy); font-size: var(--afd-fs-small); }
.afd-refined-hero__stat--stores { order: 0; grid-row: 1; grid-column: 2; justify-self: stretch; justify-content: flex-start; font-size: var(--afd-refined-hero-meta-size-mobile); }
.afd-refined-hero__stat--stores .afd-refined-hero__stat-value, .afd-refined-hero__stat--range .afd-refined-hero__stat-value { margin-left: auto; }
.afd-refined-hero__fresh { order: 5; grid-column: 1 / -1; color: var(--afd-text-muted); font-size: var(--afd-refined-hero-meta-size-mobile); line-height: 1.4; }
.afd-refined-hero__fresh--compact { order: 0; grid-row: 1; grid-column: 1; white-space: nowrap; overflow-wrap: normal; overflow-x: auto; scrollbar-width: none; }
.afd-refined-hero__stat--range .afd-refined-hero__stat-label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; }
.afd-refined-hero__stats > .afd-refined-hero__stat + .afd-refined-hero__stat::before { content: none; }
.afd-refined-hero__guide { order: 6; grid-column: 1 / -1; }
.afd-refined-hero__guide svg { flex: 0 0 var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); fill: none; stroke: currentColor; stroke-width: 2; }
.afd-refined-hero .afd-guide-nudge { display: flex; align-items: center; gap: var(--afd-space-2); width: auto; max-width: none; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: var(--afd-radius-sm); background: transparent; color: var(--afd-navy); box-shadow: none; transform: none; }
.afd-refined-hero .afd-guide-nudge:hover { border: 0; background: transparent; color: var(--afd-navy); box-shadow: none; transform: none; }
.afd-refined-hero .afd-guide-nudge > span { min-width: 0; overflow-wrap: anywhere; }
.afd-refined-hero .afd-guide-nudge__icon { display: none; }
.afd-refined-hero .afd-guide-nudge__copy { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--afd-space-2) var(--afd-space-3); }
.afd-refined-hero .afd-guide-nudge__copy small { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; color: var(--afd-text-muted); font: 400 var(--afd-fs-small)/1.5 var(--afd-font-body); text-transform: none; letter-spacing: normal; }
.afd-refined-hero .afd-guide-nudge__copy strong { color: var(--afd-navy); font: 750 var(--afd-fs-small)/1.5 var(--afd-font-body); overflow-wrap: anywhere; }
.afd-refined-hero .afd-guide-nudge__arrow { flex: 0 0 var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); border: 0; border-radius: 0; background: transparent; color: var(--afd-navy); box-shadow: none; transform: none; transition: transform .15s ease; }
.afd-refined-hero .afd-guide-nudge__arrow svg { width: 100%; height: 100%; }
.afd-refined-hero .afd-guide-nudge:hover .afd-guide-nudge__arrow { background: transparent; color: var(--afd-navy); box-shadow: none; transform: translateY(var(--afd-space-1)); }
.afd-refined-hero :is(a,button,summary):focus-visible { outline: 3px solid var(--afd-navy); outline-offset: var(--afd-space-1); }
/* Bevar den eksisterende kategorisoegning, dens tastaturmenu og rigtige links.
   Kun heroens form-/copy-layout aendres, aldrig indholdet eller destinationsdata. */
.afd-category-hero__copy { max-width: none; margin: 0; text-align: left; }
.afd-category-search { width: 100%; max-width: none; margin: 0; }
.afd-category-search__results { left: 0; width: 100%; max-width: none; transform: none; }
.afd-category-hero .afd-category-quicklinks { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: var(--afd-space-2); max-width: 100%; margin: 0; padding: var(--afd-space-1) 0; border: 0; border-radius: 0; background: transparent; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: var(--afd-space-1); overscroll-behavior-inline: contain; touch-action: pan-x pan-y; scrollbar-width: none; }
.afd-category-hero .afd-category-quicklinks::-webkit-scrollbar { display: none; }
.afd-category-hero .afd-category-quicklinks a { display: inline-flex; flex: 0 0 auto; align-items: center; min-width: 0; max-width: none; min-height: 44px; box-sizing: border-box; padding: var(--afd-space-2) var(--afd-space-3); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-module); background: var(--afd-bg); color: var(--afd-navy); font-size: var(--afd-fs-small); white-space: nowrap; overflow-wrap: normal; scroll-snap-align: start; box-shadow: none; }
.afd-category-hero .afd-category-quicklinks a:focus-visible { outline: 3px solid var(--afd-navy); outline-offset: -3px; }
.afd-category-hero .afd-category-quicklinks a:is(:hover,.is-active) { border-color: var(--afd-accent); background: var(--afd-accent-soft); color: var(--afd-navy); }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero__copy { display: contents; }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-overline { order: 0; margin: 0; }
.afd-catalog-hero:not(.afd-catalog-hero--deals) h1 { order: 1; }
.afd-catalog-hero:not(.afd-catalog-hero--deals) p { order: 2; }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search-wrap { order: 3; width: 100%; max-width: none; margin: 0; }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-stats { order: 4; display: flex; flex-wrap: wrap; gap: var(--afd-space-1) var(--afd-space-3); padding-top: var(--afd-space-2); border-top: 1px solid var(--afd-border); }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-stats span { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: var(--afd-space-1); min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--afd-text-muted); font-size: var(--afd-fs-small); text-align: left; }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-stats strong { display: inline; margin: 0; color: var(--afd-navy); font: 750 var(--afd-fs-small)/1.5 var(--afd-font-body); }
.afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-disclosure:empty { display: none; }
/* Progressiv intro: uden JS staar details aaben med hele registrerede HTML.
   Preview bor i summary, saa browserens native lukkede details stadig viser det. */
.afd-refined-hero__intro-disclosure { margin: 0; padding: 0; border: 0; background: transparent; }
.afd-refined-hero__intro-toggle { display: none; }
.afd-refined-hero__intro-preview { display: none; }
.afd-refined-hero__intro-disclosure--enhanced > .afd-refined-hero__intro-toggle { display: flex; flex-direction: column; align-items: flex-start; gap: var(--afd-space-1); min-height: 44px; padding: 0; border-radius: var(--afd-radius-sm); color: var(--afd-navy); font: 400 var(--afd-refined-hero-intro-size-mobile)/1.45 var(--afd-font-body); cursor: pointer; list-style: none; }
.afd-refined-hero__intro-toggle::-webkit-details-marker { display: none; }
.afd-refined-hero__intro-toggle::marker { content: ""; }
.afd-refined-hero__intro-disclosure--enhanced:not([open]) .afd-refined-hero__intro-preview { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--afd-refined-intro-preview-lines); overflow: hidden; color: var(--afd-navy); }
.afd-refined-hero__intro-toggle-label { display: inline-flex; align-items: center; gap: var(--afd-space-1); color: var(--afd-navy); font-weight: 700; }
.afd-refined-hero__intro-more, .afd-refined-hero__intro-less { white-space: nowrap; }
.afd-refined-hero__intro-toggle-label svg { flex: 0 0 var(--afd-space-4); width: var(--afd-space-4); height: var(--afd-space-4); fill: none; stroke: currentColor; stroke-width: 2; }
body.afd-page .afd-refined-hero__intro-collapse { display: none; align-items: center; gap: var(--afd-space-1); min-height: 44px; margin: var(--afd-space-1) 0 0; padding: 0; border: 0; border-radius: var(--afd-radius-sm); background: transparent; color: var(--afd-navy); box-shadow: none; font: 700 var(--afd-refined-hero-intro-size-mobile)/1.45 var(--afd-font-body); text-transform: none; cursor: pointer; }
.afd-refined-hero__intro-disclosure--enhanced[open] > .afd-refined-hero__intro-toggle { display: none; }
body.afd-page .afd-refined-hero__intro-disclosure--enhanced[open] > .afd-refined-hero__intro-collapse { display: inline-flex; }
.afd-refined-hero__intro-collapse svg { flex: 0 0 var(--afd-space-4); width: var(--afd-space-4); height: var(--afd-space-4); fill: none; stroke: currentColor; stroke-width: 2; }
.afd-refined-hero__fresh-full { display: none; }
.afd-refined-hero__fresh-short { display: inline; }
@media (min-width: 600px) {
  .afd-refined-hero, .afd-category-hero, .afd-catalog-hero:not(.afd-catalog-hero--deals) { --afd-refined-hero-title-size: var(--afd-refined-hero-title-size-md); --afd-refined-hero-ring-inner: var(--afd-refined-hero-ring-inner-md); --afd-refined-hero-ring-outer: var(--afd-refined-hero-ring-outer-md); gap: var(--afd-space-6); margin-bottom: var(--afd-space-8); padding: var(--afd-space-8); }
  .afd-refined-hero { grid-template-columns: minmax(0,1fr); }
  .afd-refined-hero :is(.afd-refined-hero__copy,.afd-refined-hero__search,.afd-refined-hero__links,.afd-refined-hero__stat,.afd-refined-hero__fresh,.afd-refined-hero__guide) { grid-row: auto; grid-column: auto; }
  .afd-refined-hero__stat { order: 0; flex-wrap: wrap; white-space: normal; overflow-wrap: anywhere; overflow: visible; justify-self: auto; justify-content: normal; }
  .afd-refined-hero__stat--stores { font-size: var(--afd-fs-body); }
  .afd-refined-hero__meta .afd-refined-hero__stat--range { flex-wrap: wrap; justify-self: auto; justify-content: normal; color: var(--afd-text-muted); font-size: var(--afd-fs-small); white-space: normal; overflow-wrap: anywhere; overflow: visible; }
  .afd-refined-hero__stat--range .afd-refined-hero__stat-label { position: static; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip: auto; clip-path: none; white-space: normal; }
  .afd-refined-hero__stat--stores .afd-refined-hero__stat-value, .afd-refined-hero__stat--range .afd-refined-hero__stat-value { margin-left: 0; }
  .afd-refined-hero__stats { display: flex; }
  .afd-refined-hero__stats > .afd-refined-hero__stat + .afd-refined-hero__stat::before { content: "·"; }
  .afd-refined-hero__meta { display: flex; }
  .afd-refined-hero__fresh { order: 0; font-size: inherit; line-height: inherit; }
  .afd-refined-hero__fresh--compact { white-space: normal; overflow-wrap: anywhere; overflow: visible; }
  .afd-refined-hero__guide { order: 0; }
  .afd-refined-hero__eyebrow { font-size: var(--afd-fs-small); line-height: inherit; }
  .afd-refined-hero__eyebrow, .afd-category-hero .afd-overline, .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-overline, .afd-refined-hero__search-label { position: static; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip: auto; clip-path: none; white-space: normal; }
  .afd-refined-hero__search-label { margin-bottom: var(--afd-space-2); }
  .afd-category-hero .afd-overline { margin-bottom: var(--afd-space-2); }

  .afd-page .afd-refined-hero__title, .afd-page .afd-category-hero h1, .afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) h1 { margin-bottom: var(--afd-space-3); }
  .afd-refined-hero__intro, .afd-category-hero__copy > p, .afd-catalog-hero:not(.afd-catalog-hero--deals) p { font-size: var(--afd-refined-hero-intro-size); line-height: 1.55; }
  .afd-refined-hero__search-label { font-size: var(--afd-fs-small); line-height: inherit; }
  .afd-refined-hero__search-form, .afd-category-hero .afd-category-search__form, .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search { min-height: var(--afd-refined-search-height); padding: var(--afd-space-1); }
  .afd-refined-hero__search-icon, .afd-category-hero .afd-home-search__icon, .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-home-search__icon { flex-basis: var(--afd-refined-search-icon); width: var(--afd-refined-search-icon); height: var(--afd-refined-search-icon); }
  body.afd-page .afd-refined-hero__search-submit, body.afd-page .afd-category-hero .afd-category-search__form button, body.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search button { min-width: var(--afd-refined-search-button-min); padding: var(--afd-space-3); border-radius: var(--afd-radius-card); }
  .afd-page .afd-refined-hero__link { flex: 0 1 auto; max-width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; font-size: inherit; white-space: normal; overflow-wrap: anywhere; scroll-snap-align: none; }
  .afd-refined-hero__link > span { white-space: normal; overflow-wrap: anywhere; }
  .afd-refined-hero__links .afd-refined-hero__link:focus-visible { outline-offset: var(--afd-space-1); }
  .afd-refined-hero__stats { gap: var(--afd-space-2) var(--afd-space-4); padding-top: var(--afd-space-5); }
  .afd-refined-hero__stat { font-size: var(--afd-fs-body); line-height: inherit; }
  .afd-refined-hero__footer { display: flex; flex-direction: column; gap: var(--afd-space-4); padding-top: var(--afd-space-5); font-size: var(--afd-fs-small); line-height: inherit; }
  .afd-refined-hero__meta { gap: var(--afd-space-2) var(--afd-space-4); font-size: var(--afd-fs-small); }
  .afd-refined-hero__meta .afd-refined-hero__stat { font-size: var(--afd-fs-small); }
  .afd-refined-hero .afd-guide-nudge__copy small, .afd-refined-hero__links-label { position: static; width: auto; height: auto; margin: 0; padding: 0; overflow: visible; clip: auto; clip-path: none; white-space: normal; }
  .afd-category-hero .afd-category-quicklinks { flex-wrap: wrap; gap: var(--afd-space-2) var(--afd-space-4); padding: 0; overflow: visible; scroll-snap-type: none; overscroll-behavior-inline: auto; touch-action: auto; }
  .afd-category-hero .afd-category-quicklinks a { flex: 0 1 auto; max-width: 100%; padding: var(--afd-space-2) 0; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; white-space: normal; overflow-wrap: anywhere; scroll-snap-align: none; }
  .afd-category-hero .afd-category-quicklinks a:is(:hover,.is-active) { border-bottom-color: var(--afd-accent); background: transparent; }
  .afd-category-hero .afd-category-quicklinks a:focus-visible { outline-offset: var(--afd-space-1); }
  .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-stats { gap: var(--afd-space-3) var(--afd-space-4); padding-top: var(--afd-space-5); }
  .afd-refined-hero__intro-disclosure--enhanced > .afd-refined-hero__intro-toggle, .afd-refined-hero__intro-preview { display: none; }
  body.afd-page .afd-refined-hero__intro-disclosure--enhanced[open] > .afd-refined-hero__intro-collapse { display: none; }
  .afd-refined-hero__intro-disclosure > .afd-refined-hero__intro { display: block; }
  .afd-refined-hero__fresh-full { display: inline; }
  .afd-refined-hero__fresh-short { display: none; }
  .afd-refined-hero__links { flex-wrap: wrap; gap: var(--afd-space-2) var(--afd-space-8); padding: 0; border-bottom: 0; overflow: visible; scroll-snap-type: none; overscroll-behavior-inline: auto; touch-action: auto; }
  .afd-refined-hero__links-label { flex-basis: auto; }
  .afd-page .afd-refined-hero__link { gap: var(--afd-space-3); }
  .afd-refined-hero__link svg { flex-basis: var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); }
}
@media (min-width: 900px) {
  .afd-refined-hero, .afd-category-hero, .afd-catalog-hero:not(.afd-catalog-hero--deals) {
    --afd-refined-hero-ring-inner: var(--afd-refined-hero-ring-inner-lg); --afd-refined-hero-ring-outer: var(--afd-refined-hero-ring-outer-lg);
    --afd-refined-hero-title-size: var(--afd-refined-hero-title-size-lg);
    --afd-refined-search-icon: var(--afd-refined-search-icon-lg);
    gap: var(--afd-space-8); padding: var(--afd-space-12);
  }
  .afd-refined-hero, .afd-catalog-hero:not(.afd-catalog-hero--deals) { grid-template-columns: minmax(0,1fr) auto; }
  .afd-refined-hero__eyebrow { grid-row: 1; grid-column: 1; align-self: center; }
  .afd-refined-hero__stats { order: 0; grid-row: 1; grid-column: 2; align-self: center; justify-content: flex-end; max-width: 26rem; padding: 0; border: 0; }
  .afd-refined-hero :is(.afd-refined-hero__copy,.afd-refined-hero__search,.afd-refined-hero__links,.afd-refined-hero__footer) { grid-column: 1 / -1; }
  .afd-refined-hero__search-form, .afd-category-hero .afd-category-search__form, .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search { min-height: var(--afd-refined-search-height-lg); }
  body.afd-page .afd-refined-hero__search-submit, body.afd-page .afd-category-hero .afd-category-search__form button, body.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search button { min-width: var(--afd-refined-search-button-min-lg); padding-inline: var(--afd-space-6); }
  body.afd-page .afd-refined-hero__search-input, body.afd-page .afd-category-hero .afd-category-search__form input[type="search"], body.afd-page .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-hero-search input[type="search"] { font-size: var(--afd-refined-hero-intro-size); }
  .afd-refined-hero__footer, .afd-refined-hero--has-stats .afd-refined-hero__footer { flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: var(--afd-space-3) var(--afd-space-6); padding-top: var(--afd-space-6); border-top: 1px solid var(--afd-border); }
  .afd-refined-hero__meta { flex: 0 1 auto; min-width: 0; flex-wrap: nowrap; }
  .afd-refined-hero__meta .afd-refined-hero__stat--range { flex-wrap: nowrap; white-space: nowrap; overflow-wrap: normal; overflow-x: auto; scrollbar-width: none; }
  .afd-refined-hero__fresh--compact { flex: 0 0 auto; white-space: nowrap; }
  .afd-refined-hero__fresh-full { display: none; }
  .afd-refined-hero__fresh-short { display: inline; }
  .afd-refined-hero__guide { flex: 0 0 auto; margin-left: auto; }
  .afd-refined-hero .afd-guide-nudge__copy { flex-wrap: nowrap; white-space: nowrap; }
  .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-overline { grid-row: 1; grid-column: 1; align-self: center; }
  .afd-catalog-hero:not(.afd-catalog-hero--deals) :is(h1,p,.afd-catalog-hero-search-wrap) { grid-column: 1 / -1; }
  .afd-catalog-hero:not(.afd-catalog-hero--deals) .afd-catalog-stats { order: 0; grid-row: 1; grid-column: 2; justify-content: flex-end; max-width: 26rem; padding: 0; border: 0; }
}
/* ---------- Foldbar kategorivaelger over produktlisten (STIL.md 34) ---------- */
.afd-cross-catalog--with-categories { grid-template-areas: "categories categories" "head head" "filter sort" "list list" "more more"; }
.afd-cross-catalog > .afd-category-finder { grid-area: categories; margin: 0; }
.afd-cross-catalog .afd-toolbar__head > h2 { scroll-margin-top: calc(var(--afd-space-12) + var(--afd-space-8) + var(--afd-space-1)); }
.afd-category-finder { min-width: 0; margin-block: var(--afd-space-6); padding: var(--afd-space-3); border: 1px solid var(--afd-border); border-radius: var(--afd-radius-card); background: var(--afd-bg); }
.afd-category-finder__summary { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--afd-space-2); min-height: calc(var(--afd-space-12) + var(--afd-space-2)); box-sizing: border-box; padding: var(--afd-space-3); border-radius: var(--afd-radius-md); background: transparent; color: var(--afd-navy); cursor: pointer; list-style: none; }
.afd-category-finder__summary::-webkit-details-marker, .afd-category-finder__group-summary::-webkit-details-marker { display: none; }
.afd-category-finder__title { min-width: 0; font: 700 var(--afd-fs-body)/1.3 var(--afd-font-heading); overflow-wrap: anywhere; }
.afd-category-finder__hint { display: none; min-width: 0; color: var(--afd-text-muted); font-size: var(--afd-fs-body); overflow-wrap: anywhere; }
.afd-category-finder__toggle { display: inline-flex; align-items: center; gap: var(--afd-space-2); color: var(--afd-navy); font: 700 var(--afd-fs-small)/1.3 var(--afd-font-heading); }
.afd-category-finder__toggle-label { white-space: nowrap; }
.afd-category-finder__toggle-long, .afd-category-finder__hide { display: none; }
.afd-category-finder[open] > .afd-category-finder__summary .afd-category-finder__show { display: none; }
.afd-category-finder[open] > .afd-category-finder__summary .afd-category-finder__hide { display: inline; }
.afd-category-finder__chevron { flex: 0 0 var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); color: var(--afd-accent); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s ease; }
.afd-category-finder__chevron > svg { display: block; width: 100%; height: 100%; }
.afd-category-finder[open] > .afd-category-finder__summary .afd-category-finder__chevron { transform: rotate(180deg); }
.afd-category-finder__groups { display: grid; grid-template-columns: minmax(0,1fr); gap: var(--afd-space-2); padding-block: var(--afd-space-2); }
.afd-category-finder__group { position: relative; min-width: 0; border: 1px solid var(--afd-border); border-radius: var(--afd-radius-md); background: var(--afd-bg); }
.afd-category-finder__group-summary { display: flex; align-items: center; justify-content: space-between; gap: var(--afd-space-3); min-height: 44px; box-sizing: border-box; padding: var(--afd-space-3); border-radius: var(--afd-radius-md); background: var(--afd-bg); color: var(--afd-navy); cursor: pointer; list-style: none; }
.afd-category-finder__group-title { min-width: 0; font: 700 var(--afd-fs-body)/1.3 var(--afd-font-heading); overflow-wrap: anywhere; }
.afd-category-finder__group-summary > svg { flex: 0 0 var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s ease; }
.afd-category-finder__group[open] > .afd-category-finder__group-summary { border-radius: var(--afd-radius-md) var(--afd-radius-md) 0 0; background: var(--afd-refined-hero-bg); }
.afd-category-finder__group[open] > .afd-category-finder__group-summary > svg { color: var(--afd-accent); transform: rotate(180deg); }
.afd-category-finder__links { margin: 0; padding: 0 var(--afd-space-3); list-style: none; }
.afd-category-finder__links > li { min-width: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--afd-border); }
.afd-page .afd-category-finder__link { display: flex; align-items: center; min-height: 44px; box-sizing: border-box; padding: var(--afd-space-2) var(--afd-space-1); border-radius: var(--afd-radius-sm); color: var(--afd-navy); font-size: var(--afd-fs-body); font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
.afd-page .afd-category-finder__link:is(:hover,.is-active) { background: transparent; color: var(--afd-navy); text-decoration: underline; text-underline-offset: .2em; }
.afd-page .afd-category-finder__link.is-active { font-weight: 600; }
.afd-page .afd-category-finder__all { display: flex; align-items: center; gap: var(--afd-space-2); min-height: 44px; box-sizing: border-box; margin-inline: var(--afd-space-3); padding: var(--afd-space-2) var(--afd-space-1); border-top: 1px solid var(--afd-border); color: var(--afd-navy); font-size: var(--afd-fs-small); line-height: 1.4; overflow-wrap: anywhere; }
.afd-page .afd-category-finder__all:is(:hover,.is-active) { background: transparent; color: var(--afd-navy); text-decoration: underline; text-underline-offset: .2em; }
.afd-page .afd-category-finder__all.is-active { font-weight: 600; }
.afd-category-finder__all > svg, .afd-category-finder__foot > svg { flex: 0 0 var(--afd-space-5); width: var(--afd-space-5); height: var(--afd-space-5); color: var(--afd-accent); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.afd-category-finder__all > span[aria-hidden="true"], .afd-category-finder__foot > span[aria-hidden="true"] { display: inline-flex; flex: 0 0 var(--afd-space-5); align-items: center; justify-content: center; width: var(--afd-space-5); color: var(--afd-accent); font-size: var(--afd-fs-h3); line-height: 1; }
.afd-page .afd-category-finder__foot { display: flex; align-items: center; gap: var(--afd-space-2); min-height: 44px; box-sizing: border-box; padding: var(--afd-space-3); border-radius: var(--afd-radius-md); background: var(--afd-refined-hero-bg); color: var(--afd-navy); font: 600 var(--afd-fs-body)/1.4 var(--afd-font-body); }
.afd-category-finder:not([open]) > :not(.afd-category-finder__summary), .afd-category-finder__group:not([open]) > :not(.afd-category-finder__group-summary) { display: none; }
.afd-category-finder :is(summary,a):focus-visible { outline: 3px solid var(--afd-navy); outline-offset: -3px; }
@media (min-width: 600px) {
  .afd-category-finder { padding: var(--afd-space-4); }
  .afd-category-finder__summary { padding-inline: var(--afd-space-5); }
  .afd-category-finder__toggle-long { display: inline; }
}
@media (min-width: 900px) {
  .afd-cross-catalog--with-categories { grid-template-areas: none; }
  .afd-cross-catalog > .afd-category-finder { grid-area: auto; grid-column: 1 / -1; }
  .afd-category-finder { margin-block: var(--afd-space-8); }
  .afd-category-finder__summary { grid-template-columns: auto minmax(0,1fr) auto; gap: var(--afd-space-4); min-height: calc(var(--afd-space-8) * 2); }
  .afd-category-finder__title { font-size: var(--afd-fs-h2); }
  .afd-category-finder__hint { display: block; }
  .afd-category-finder__toggle { gap: var(--afd-space-4); font-size: var(--afd-fs-body); }
  .afd-category-finder__groups { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; padding: var(--afd-space-3) 0; }
  .afd-category-finder__group { padding: var(--afd-space-3) var(--afd-space-5); border: 0; border-radius: 0; }
  .afd-category-finder__group:not(:nth-child(3n+1)) { border-left: 1px solid var(--afd-border); }
  .afd-category-finder__group:nth-child(n+4) { border-top: 1px solid var(--afd-accent-soft); }
  .afd-category-finder__group-summary { justify-content: flex-start; padding: 0; padding-right: calc(var(--afd-space-12) + var(--afd-space-8)); border-radius: 0; }
  .afd-category-finder__group[open] > .afd-category-finder__group-summary { border-radius: 0; background: transparent; cursor: default; }
  .afd-category-finder__group-title { font-size: var(--afd-fs-h3); }
  .afd-category-finder__group-summary > svg { display: none; }
  .afd-category-finder__links { padding: 0; }
  .afd-category-finder__links > li { border: 0; }
  .afd-page .afd-category-finder__link { min-height: var(--afd-space-8); padding-block: var(--afd-space-1); }
  .afd-page .afd-category-finder__all { position: absolute; top: var(--afd-space-3); right: var(--afd-space-5); width: calc(var(--afd-space-12) + var(--afd-space-8)); margin: 0; padding: 0; border: 0; justify-content: flex-end; }
  .afd-page .afd-category-finder__foot { padding-inline: var(--afd-space-5); }
}
@media (prefers-reduced-motion: reduce) {
  .afd-category-finder__chevron, .afd-category-finder__group-summary > svg { transition: none; }
  .afd-refined-hero .afd-guide-nudge__arrow, .afd-refined-hero__search-submit { transition: none; }
  .afd-refined-hero .afd-guide-nudge:hover .afd-guide-nudge__arrow { transform: none; }
  .afd-home-product-rail__track, .afd-home-popular__track, .afd-home-rated__track { scroll-behavior: auto; }
}
/* Produktkort: logo og pris har reserveret plads; pris typografi foelger kortbredden. */

.afd-card--product .afd-card__cta { display: grid; grid-template-columns: 28px minmax(0,1fr) 12px; align-items: center; gap: 6px; min-height: 46px; margin-top: 8px; padding: 8px; box-sizing: border-box; text-transform: none; letter-spacing: normal; }
.afd-card--product .afd-card__cta .afd-card__merchant { display: flex; align-items: center; justify-content: center; width: 28px; min-width: 28px; height: 28px; padding: 3px; box-sizing: border-box; border-radius: 5px; background: var(--afd-bg); color: var(--afd-navy); font: 700 .65rem/1.15 var(--afd-font-heading); }
.afd-card--product .afd-card__merchant img { width: 100%; height: 100%; object-fit: contain; }
.afd-card--product .afd-card__merchant > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.afd-page .afd-card--product .afd-card__cta .afd-card__price, .afd-card--product .afd-card__cta .afd-card__price { display: block; justify-self: stretch; min-width: 0; margin: 0; color: var(--afd-navy-deep); font: 800 var(--afd-card-price-size)/1.2 var(--afd-font-heading); overflow: visible; text-overflow: clip; letter-spacing: -.02em; white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; }
.afd-card--product .afd-card__cta .afd-card__action { grid-column: 1 / 3; text-align: center; }
body.afd-page .afd-card--product .afd-card__cta > .afd-card__arrow, .afd-card--product .afd-card__cta > .afd-card__arrow { display: block; width: 12px; height: 18px; min-width: 12px; color: var(--afd-navy-deep); fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.afd-card--product .afd-card__footer { margin-top: auto; padding-top: var(--afd-space-3); }
.afd-card--product .afd-card__more { display: flex; justify-content: center; align-items: center; gap: 6px; min-height: 36px; margin-top: 6px; padding: 4px; box-sizing: border-box; border-radius: var(--afd-radius-sm); background: var(--afd-bg-alt); color: var(--afd-navy); font: 700 .65rem/1.3 var(--afd-font-heading); text-align: center; text-decoration: none; }
.afd-card--product summary.afd-card__more:hover { background: var(--afd-accent-soft); }
.afd-card--product .afd-card__more--status { color: var(--afd-text-muted); font-weight: 500; }
.afd-card--product .afd-card__more svg { width: 14px; height: 14px; flex-shrink: 0; fill: none; stroke: var(--afd-accent); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.afd-card--product .afd-card__cta:focus-visible, .afd-card--product summary.afd-card__more:focus-visible { outline: 2px solid var(--afd-navy); outline-offset: -3px; }
@media (min-width: 600px) {
  .afd-card--product .afd-card__cta { min-height: 52px; padding: 8px 10px; grid-template-columns: 34px minmax(0,1fr) 16px; gap: 8px; }
  .afd-card--product .afd-card__cta .afd-card__merchant { width: 34px; min-width: 34px; height: 34px; font-size: .78rem; }
  .afd-card--product .afd-card__more { font-size: .78rem; min-height: 40px; }
}

.afd-card--product summary.afd-card__more { cursor: pointer; list-style: none; }
.afd-card--product summary.afd-card__more::-webkit-details-marker { display: none; }
.afd-card--product .afd-card__offers-hide, .afd-card--product .afd-card__offers[open] .afd-card__offers-show { display: none; }
.afd-card--product .afd-card__offers[open] .afd-card__offers-hide { display: inline; }
.afd-card--product .afd-card__offers[open] summary svg { transform: rotate(180deg); }
.afd-card--product .afd-card__offers[open] { position: relative; padding-bottom: 46px; }
.afd-card--product .afd-card__offers[open] > summary.afd-card__more { position: absolute; inset: auto 0 0; width: 100%; margin: 0; min-height: 40px; }
.afd-card--product .afd-card__offer-list { max-height: 280px; overflow-y: auto; margin: 0; padding: 0; list-style: none; }
.afd-card--product .afd-card__offer-list > li { margin: 0; padding: 6px 0; list-style: none; }
.afd-card--product .afd-card__offer-row { display: grid; grid-template-columns: 24px minmax(0,1fr) 10px; align-items: center; gap: 4px; min-height: 44px; padding: 4px; box-sizing: border-box; border-radius: var(--afd-radius-sm); background: var(--afd-accent); color: var(--afd-navy-deep); text-decoration: none; }
.afd-card--product a.afd-card__offer-row:hover { background: var(--afd-accent-hover); }
.afd-card--product .afd-card__offer-logo { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 2px; box-sizing: border-box; border-radius: var(--afd-radius-sm); background: var(--afd-bg); font-size: .55rem; color: var(--afd-navy); }
.afd-card--product .afd-card__offer-logo img { width: 100%; height: 100%; object-fit: contain; }
.afd-card--product .afd-card__offer-logo > span, .afd-card--product .afd-card__offer-info { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.afd-card--product .afd-card__offer-info { display: none; }
.afd-card--product .afd-card__offer-row strong { grid-column: 2; justify-self: end; text-align: right; white-space: nowrap; font: 800 var(--afd-card-price-size)/1.2 var(--afd-font-heading); font-variant-numeric: tabular-nums; }
body.afd-page .afd-card--product .afd-card__offer-row > .afd-card__arrow, .afd-card--product .afd-card__offer-row > .afd-card__arrow { display: block; width: 10px; height: 16px; fill: none; stroke: var(--afd-navy-deep); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.afd-card--product .afd-card__offer-row--unavailable { background: var(--afd-bg-alt); color: var(--afd-text-muted); }
.afd-card--product .afd-card__offer-row--unavailable { grid-template-columns: 24px minmax(0,1fr) max-content; }
.afd-card--product .afd-card__offer-row--unavailable .afd-card__offer-info { display: block; min-width: 0; font-size: .65rem; }
.afd-card--product .afd-card__offer-row--unavailable strong { grid-column: 3; }
.afd-card--product .afd-card__offer-row--unavailable > span:last-child { display: none; }
.afd-card--product .afd-card__offer-row:focus-visible { outline: 2px solid var(--afd-navy); outline-offset: 2px; }
@media (min-width: 600px) {
  .afd-card--product .afd-card__offer-row { grid-template-columns: 28px minmax(0,1fr) 12px; padding: 6px; gap: 6px; }
  .afd-card--product .afd-card__offer-logo { width: 28px; height: 28px; }
  .afd-card--product .afd-card__offer-row--unavailable { grid-template-columns: 28px minmax(0,1fr) max-content; }
}
/* Hero-grafik: hele billedet bevares og tekst ligger paa sit eget laesbare lag. */
body.afd-frontpage.afd-page .afd-home-hero__visual { position: absolute; top: auto; right: var(--afd-space-3); bottom: 0; left: auto; width: var(--afd-home-hero-art-width-mobile); height: var(--afd-home-hero-art-height-mobile); margin: 0; aspect-ratio: auto; opacity: var(--afd-home-hero-art-opacity); }
body.afd-frontpage.afd-page .afd-home-hero__image { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; object-position: center bottom; transform: none; }
.afd-refined-hero { position: relative; isolation: isolate; }
.afd-refined-hero::before { content: none; }
.afd-refined-hero__art { position: absolute; z-index: 0; inset: auto var(--afd-space-4) var(--afd-space-4) auto; width: var(--afd-hero-art-width-mobile); height: var(--afd-hero-art-height-mobile); opacity: var(--afd-hero-art-opacity-mobile); pointer-events: none; overflow: hidden; mask-image: linear-gradient(to bottom,transparent,#000 35%); }
.afd-refined-hero__art img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: right bottom; }
.afd-refined-hero > :not(.afd-refined-hero__art) { position: relative; z-index: 1; }
/* Lyse billedbaggrunde blandes med heroen; billedets egne kanter fades. */
body.afd-frontpage.afd-page .afd-home-hero__visual { mix-blend-mode: multiply; justify-items: end; }
body.afd-frontpage.afd-page .afd-home-hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-position: right bottom; mask-image: linear-gradient(to right,transparent,#000 var(--afd-home-hero-art-edge-fade),#000 calc(100% - var(--afd-home-hero-art-edge-fade)),transparent),linear-gradient(to bottom,transparent,#000 var(--afd-home-hero-art-edge-fade),#000 calc(100% - var(--afd-home-hero-art-edge-fade)),transparent); mask-composite: intersect; }
@media (min-width: 600px) {
  body.afd-frontpage.afd-page .afd-home-hero__visual { mix-blend-mode: normal; justify-items: center; }
  body.afd-frontpage.afd-page .afd-home-hero__image { position: relative; inset: auto; width: 100%; justify-self: center; object-position: center; mask-image: none; }
}
/* Mobil: fuldbredde titel, kort intro og billede side om side. */
.afd-refined-hero { row-gap: var(--afd-space-2); }
.afd-page .afd-refined-hero__title { font-size: var(--afd-hero-mobile-title-size); }
.afd-refined-hero:has(> .afd-refined-hero__art) { grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__copy { display: contents; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__title { grid-row: 2; grid-column: 1 / -1; order: 1; margin-bottom: 0; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__copy > :is(.afd-refined-hero__intro-disclosure,.afd-refined-hero__intro) { grid-row: 3; grid-column: 1; order: 1; min-width: 0; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__art { position: relative; grid-row: 3; grid-column: 2; align-self: start; inset: auto; width: 100%; height: var(--afd-hero-mobile-art-height); opacity: var(--afd-hero-art-opacity); mask-image: none; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__art img { object-position: center; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__search { grid-row: 4; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__links { grid-row: 5; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__stat--products, .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__stat--range { grid-row: 6; }
.afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__guide { grid-row: 7; }
@media (min-width: 600px) {
  .afd-refined-hero:has(> .afd-refined-hero__art) { grid-template-columns: minmax(0,1fr); }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__copy { display: block; }
  .afd-page .afd-refined-hero__title { font-size: var(--afd-refined-hero-title-size); }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__title { margin-bottom: var(--afd-space-2); }
  .afd-refined-hero:has(> .afd-refined-hero__art) :is(.afd-refined-hero__search,.afd-refined-hero__links,.afd-refined-hero__stat--products,.afd-refined-hero__stat--range,.afd-refined-hero__guide) { grid-row: auto; }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__art { position: absolute; inset: auto var(--afd-space-4) var(--afd-space-4) auto; width: var(--afd-hero-art-width-mobile); height: var(--afd-hero-art-height-mobile); opacity: var(--afd-hero-art-opacity-mobile); }
}
@media (min-width: 600px) {
  body.afd-frontpage.afd-page .afd-home-hero__visual { position: relative; inset: auto; width: 100%; height: 390px; opacity: 1; }
  body.afd-frontpage.afd-page .afd-home-hero__image { object-fit: contain; object-position: center; }
}
@media (min-width: 900px) {
  /* Kompakt hero med rolig typografi og billedet frit ved siden af teksten. */
  .afd-refined-hero { gap: var(--afd-space-4); padding: var(--afd-space-8); }
  .afd-refined-hero__eyebrow { display: none; }
  .afd-refined-hero__stats { font-size: var(--afd-fs-small); line-height: 1.3; }
  .afd-refined-hero__stats .afd-refined-hero__stat { font-size: inherit; }
  .afd-page .afd-refined-hero__title { font-size: var(--afd-hero-art-title-size); }
  .afd-refined-hero__intro { font-size: var(--afd-hero-compact-intro-size); line-height: 1.5; }
  .afd-refined-hero .afd-refined-hero__search-label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .afd-refined-hero__search-form { min-height: var(--afd-hero-compact-search-height); }
  body.afd-page .afd-refined-hero__search-input { font-size: var(--afd-hero-compact-intro-size); }
  body.afd-page .afd-refined-hero__search-submit { padding-block: var(--afd-space-2); }
  .afd-refined-hero__links { gap: var(--afd-space-2) var(--afd-space-5); font-size: var(--afd-fs-small); }
  .afd-refined-hero__footer, .afd-refined-hero--has-stats .afd-refined-hero__footer { padding-top: var(--afd-space-4); }
  .afd-refined-hero:has(> .afd-refined-hero__art) { grid-template-columns: minmax(0,1.55fr) minmax(0,1fr); }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__copy { grid-row: 2; grid-column: 1; }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__title { font-size: var(--afd-hero-art-title-size); }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__art { position: relative; grid-row: 2; grid-column: 2; align-self: stretch; inset: auto; width: 100%; height: auto; min-height: var(--afd-hero-art-min-height); opacity: var(--afd-hero-art-opacity); mask-image: none; }
  .afd-refined-hero:has(> .afd-refined-hero__art) .afd-refined-hero__art img { position: absolute; inset: 0; object-position: center top; }
}
body.afd-page .afd-catalog-grid, .afd-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.afd-home-product-rail__track .afd-card--product, .afd-home-popular__track .afd-card--product, .afd-home-rated__track .afd-card--product { flex-basis: var(--afd-price-card-min); min-width: var(--afd-price-card-min); }
@media (min-width: 600px) {
  body.afd-page .afd-catalog-grid, .afd-catalog-grid { grid-template-columns: repeat(auto-fill,minmax(min(100%,var(--afd-price-card-min-lg)),1fr)); }
  .afd-home-product-rail__track .afd-card--product, .afd-home-popular__track .afd-card--product, .afd-home-rated__track .afd-card--product { flex-basis: var(--afd-price-card-min-lg); min-width: var(--afd-price-card-min-lg); }
}
/* Kompakte produktkort: aabne pristabeller straekker aldrig nabokort. */
body.afd-page .afd-card--product { align-self: start; height: auto; min-height: 0; }
body.afd-page .afd-card--product .afd-card__image-link { flex: 0 0 auto; }
body.afd-page .afd-card--product .afd-card__img { height: var(--afd-product-card-image-height); min-height: 0; max-height: var(--afd-product-card-image-height); flex-basis: auto; aspect-ratio: auto; padding: var(--afd-space-3); }
body.afd-page .afd-card--product .afd-card__img img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; }
body.afd-page .afd-card--product .afd-card__body { flex: 0 0 auto; height: auto; min-height: 0; padding: var(--afd-space-3); }
body.afd-page .afd-card--product .afd-card__footer { margin-top: var(--afd-space-2); padding-top: 0; }
body.afd-page .afd-card--product .afd-card__cta { min-height: 44px; margin-top: var(--afd-space-2); padding: 6px 8px; grid-template-columns: 28px minmax(0,1fr) 12px; gap: 6px; }
body.afd-page .afd-card--product .afd-card__cta .afd-card__merchant { width: 28px; min-width: 28px; height: 28px; }
body.afd-page .afd-card--product .afd-card__more { min-height: 44px; padding: 4px; font-size: .75rem; line-height: 1.4; }
body.afd-page .afd-catalog-grid { align-items: start; }
body.afd-page .afd-home-product-rail__track, body.afd-page .afd-home-popular__track, body.afd-page .afd-home-rated__track { align-items: flex-start; }
@media (min-width: 600px) {
  body.afd-page .afd-card--product .afd-card__img { height: var(--afd-product-card-image-height-lg); max-height: var(--afd-product-card-image-height-lg); }
  body.afd-page .afd-card--product .afd-card__cta { min-height: 46px; padding-block: 8px; }
}
/* FindEROTIKs kompakte variantfelter med DyrDyrs design-tokens. */
body.afd-page .afd-variants__fields { gap: 8px; }
body.afd-page .afd-variants .afd-variants__trigger { appearance: none; margin: 0; padding: 9px 14px; gap: 12px; border-radius: 12px; }
body.afd-page .afd-variants__trigger > span:first-child { flex: 1 1 auto; min-width: 0; }
body.afd-page .afd-variants .afd-variants__field .afd-variants__label { margin: 0; font: 600 11px/1.3 var(--afd-font-heading); letter-spacing: .3px; }
body.afd-page .afd-variants__value { font: 700 15px/1.35 var(--afd-font-heading); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.afd-page .afd-variants .afd-variants__trigger:hover, body.afd-page .afd-variants__trigger[aria-expanded="true"] { border-color: var(--afd-accent); }
body.afd-page .afd-variants__trigger[aria-expanded="true"] { box-shadow: 0 0 0 3px var(--afd-accent-soft); }
body.afd-page .afd-variants__menu { top: calc(100% + 6px); max-height: 320px; padding: 6px; border-radius: 14px; }
body.afd-page .afd-variants .afd-variants__option { appearance: none; margin: 0; gap: 10px; padding: 8px 10px; border: 0; border-radius: 10px; background: transparent; }
body.afd-page .afd-variants .afd-variants__option:hover, body.afd-page .afd-variants .afd-variants__option[aria-selected="true"] { background: var(--afd-accent-soft); }
body.afd-page .afd-variants__option > span:last-child { flex: 1 1 auto; min-width: 0; }
body.afd-page .afd-variants__name { font: 700 14px/1.3 var(--afd-font-heading); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.afd-page .afd-variants__hint { font: 600 12px/1.3 var(--afd-font-heading); }
body.afd-page .afd-variants__option::after { content: ''; flex: 0 0 20px; width: 20px; height: 20px; border-radius: 50%; }
body.afd-page .afd-variants__option[aria-selected="true"]::after { content: '\2713'; color: var(--afd-bg); background: var(--afd-accent); text-align: center; font-size: 14px; line-height: 20px; }
body.afd-page .afd-variants__current-price { flex: 0 0 auto; font: 700 14px/1.2 var(--afd-font-heading); color: var(--afd-navy); white-space: nowrap; }