/* ==========================================================================
   DK Fantasy — forside. Indlæses kun når is_front_page().
   Ingen farveovergange, ingen farvede skygger, ingen nye kulører.
   Alle farver kommer fra temaets tokens, så mørkt tema arves automatisk.
   ========================================================================== */

/* --- 1. Sektionsskal og rytme ------------------------------------------- */
.hp-sec{padding:1.75rem 0}
.hp-sec--lead{padding-top:1.25rem}
@media(min-width:768px){.hp-sec{padding:2.75rem 0}.hp-sec--lead{padding-top:2rem}}
.hp-band{background:var(--card);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.hp-sec+.hp-band,.hp-band+.hp-sec{margin-top:0}

/* --- 2. Sektionshoved --------------------------------------------------- */
.hp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem 1rem;flex-wrap:wrap;
  margin-bottom:1.125rem;padding-bottom:.625rem;border-bottom:1px solid var(--border)}
.hp-head__kick{display:block;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.hp-head__kick--live{color:var(--primary-text)}          /* kun blokke med live FPL-data */
.hp-head__title{margin:.125rem 0 0;font-size:1.3125rem;line-height:1.2;letter-spacing:-.01em}
@media(min-width:768px){.hp-head{margin-bottom:1.5rem}.hp-head__title{font-size:1.625rem}}
.hp-more{display:inline-flex;align-items:center;gap:.375rem;min-height:44px;font-size:.875rem;font-weight:700;
  color:var(--primary-text);text-decoration:none}
.hp-more:hover{text-decoration:underline;text-underline-offset:3px}
.hp-more svg{width:16px;height:16px;flex-shrink:0}

/* --- 3. Fælles smådele -------------------------------------------------- */
.hp-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.5rem;font-size:.8125rem;color:var(--text-muted)}
.hp-meta__cat{font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--primary-text)}
.hp-meta__dot{width:4px;height:4px;border-radius:999px;background:var(--border);flex-shrink:0}
.hp-credit{margin-top:.375rem;font-size:.75rem;line-height:1.4;color:var(--text-muted)}
.hp-credit a{color:inherit;text-decoration:underline}
.hp-stamp{margin-top:.75rem;font-size:.75rem;line-height:1.45;color:var(--text-muted)}
.hp-fig{margin:0;border-radius:var(--radius);overflow:hidden;background:var(--card-2)}
.hp-fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-num{font-variant-numeric:tabular-nums}
.hp-ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  background:var(--primary-soft);color:var(--primary-text)}
.hp-ph svg{width:32px;height:32px}
/* langt dansk sammensat ord må ikke sprænge layoutet ved 375px */
.hp-lead__title,.hp-block__title,.hp-sec2__title,.hp-list__head,.hp-mini__title{overflow-wrap:break-word}
/* gitter-nedgradering når der er for få elementer */
@media(min-width:768px){.grid.hp-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.hp-grid--1{grid-template-columns:minmax(0,1fr)}}
@media(min-width:1024px){.grid.hp-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.hp-grid--1{grid-template-columns:minmax(0,1fr)}}

/* --- 4. Blok 1: forsidehistorie ---------------------------------------- */
.hp-lead{display:grid;gap:1.5rem}
@media(min-width:1024px){.hp-lead{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:2rem;align-items:start}}
.hp-lead__main{min-width:0}
.hp-lead__fig{position:relative;margin:0;border-radius:var(--radius);overflow:hidden;background:var(--card-2);aspect-ratio:2/1}
.hp-lead__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-lead__tag{position:absolute;left:0;top:0;padding:.375rem .625rem;background:var(--primary);color:var(--on-primary);
  font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-bottom-right-radius:var(--radius)}
.hp-lead__title{margin:.875rem 0 0;font-size:1.5rem;line-height:1.2;letter-spacing:-.01em}
.hp-lead__title a{text-decoration:none}
.hp-lead__title a:hover{color:var(--primary-text)}
.hp-lead__stand{margin-top:.625rem;font-size:1rem;line-height:1.6;color:var(--text-muted)}
@media(min-width:640px){.hp-lead__title{font-size:1.875rem}}
@media(min-width:1024px){.hp-lead__title{font-size:2.125rem}.hp-lead__stand{font-size:1.0625rem}}

.hp-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;min-width:0}
.hp-side .hp-latest{grid-column:1/-1}                     /* wire-listen er altid fuld bredde */
@media(min-width:1024px){.hp-side{grid-template-columns:minmax(0,1fr);gap:.875rem}}
/* <1024px: billede over rubrik, to kort side om side. >=1024px: vandret kort i én kolonne. */
.hp-sec2{display:flex;flex-direction:column;gap:.5rem;padding:.625rem;background:var(--card);
  border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;color:var(--text);
  transition:border-color .15s}
.hp-sec2:hover{border-color:var(--primary)}
@media(min-width:1024px){.hp-sec2{display:grid;grid-template-columns:128px minmax(0,1fr);gap:.75rem;
  align-items:start;padding:.75rem}}
.hp-sec2__fig{margin:0;border-radius:8px;overflow:hidden;aspect-ratio:16/9;background:var(--card-2)}
.hp-sec2__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-sec2__body{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.hp-sec2__cat{font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--primary-text)}
.hp-sec2__title{font-size:.9375rem;font-weight:700;line-height:1.3}
@media(min-width:1024px){.hp-sec2__title{font-size:1rem}}
.hp-sec2__meta{font-size:.75rem;color:var(--text-muted)}

.hp-latest{padding:1rem;background:var(--card);border:1px solid var(--border);border-radius:var(--radius)}
.hp-latest__title{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.hp-list{margin-top:.5rem;border-top:1px solid var(--border)}
.hp-list li{border-bottom:1px solid var(--border)}
.hp-list a{display:grid;grid-template-columns:72px minmax(0,1fr);gap:.75rem;align-items:center;min-height:44px;
  padding:.625rem 0;text-decoration:none;color:var(--text)}
.hp-list a:hover .hp-list__head{color:var(--primary-text)}
.hp-list__fig{margin:0;width:72px;height:72px;border-radius:8px;overflow:hidden;background:var(--card-2)}
.hp-list__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-list__body{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.hp-list__head{font-size:.9375rem;font-weight:700;line-height:1.3}
.hp-list__meta{font-size:.75rem;color:var(--text-muted)}

/* --- 5. Blok 2: rundens status (live) --------------------------------- */
.hp-live{display:grid;gap:1.25rem}
@media(min-width:1024px){.hp-live--media{grid-template-columns:minmax(0,1fr) 20rem;gap:2rem;align-items:center}}
.hp-live__fig{margin:0;border-radius:var(--radius);overflow:hidden;background:var(--card-2);aspect-ratio:16/9;order:-1}
@media(min-width:1024px){.hp-live__fig{order:0}}
.hp-live__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.625rem}
@media(min-width:768px){.hp-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:.875rem}}
.hp-stat{display:flex;flex-direction:column;gap:.25rem;padding:.875rem;background:var(--card);
  border:1px solid var(--border);border-radius:var(--radius);min-width:0}
.hp-band .hp-stat{background:var(--page)}
.hp-stat--now{border-color:var(--primary)}
.hp-stat__label{display:flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted)}
.hp-stat__label svg{width:14px;height:14px;color:var(--primary-text);flex-shrink:0}
.hp-stat__value{font-size:1.1875rem;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:break-word}
@media(min-width:768px){.hp-stat__value{font-size:1.25rem}}
.hp-stat__sub{font-size:.8125rem;line-height:1.35;color:var(--text-muted)}

/* --- 6. Blok 3: guide-rail -------------------------------------------- */
.hp-rail-card{display:flex;flex-direction:column;gap:.5rem;padding:0 0 1rem;overflow:hidden;text-decoration:none;
  color:var(--text);height:100%;transition:border-color .15s}
.hp-rail-card:hover{border-color:var(--primary)}
.hp-rail-card__fig{margin:0;aspect-ratio:16/9;background:var(--card-2)}
.hp-rail-card__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-rail-card__kick{margin:.875rem 1rem 0;font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--primary-text)}
.hp-rail-card__title{margin:0 1rem;font-size:1rem;font-weight:700;line-height:1.3}
.hp-rail-card__meta{margin:auto 1rem 0;font-size:.75rem;color:var(--text-muted)}

/* --- 7. Blok 4: bedste form ------------------------------------------- */
.hp-form{display:grid;gap:1.25rem}
@media(min-width:768px){.hp-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.hp-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr);gap:1.5rem;align-items:start}}
.hp-band .hp-form .card{background:var(--page)}
.hp-note{display:flex;flex-direction:column;gap:.625rem}
.hp-note__kick{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--primary-text)}
.hp-note .prose{font-size:1rem}
.hp-form__fig{margin:0;border-radius:var(--radius);overflow:hidden;background:var(--card-2);aspect-ratio:16/9}
.hp-form__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-form__fig figcaption{padding:.375rem .5rem 0}

/* --- 8. Blok 5: kategori-showcase ------------------------------------- */
.hp-cat{display:flex;flex-direction:column;overflow:hidden;height:100%;transition:border-color .15s}
.hp-cat:hover{border-color:var(--primary)}
.hp-cat__fig{display:block;aspect-ratio:16/9;background:var(--card-2)}
.hp-cat__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-cat__body{display:flex;flex-direction:column;gap:.5rem;padding:1rem 1.125rem 1.25rem}
.hp-cat__title{font-size:1.125rem;line-height:1.25}
.hp-cat__title a{text-decoration:none}
.hp-cat__title a:hover{color:var(--primary-text)}
.hp-cat__text{font-size:.875rem;color:var(--text-muted)}
.hp-cat__links{margin-top:.25rem;border-top:1px solid var(--border)}
.hp-cat__links li{border-bottom:1px solid var(--border)}
.hp-cat__links a{display:flex;align-items:center;min-height:44px;padding:.375rem 0;font-size:.9375rem;
  font-weight:600;line-height:1.35;text-decoration:none;color:var(--text)}
.hp-cat__links a:hover{color:var(--primary-text)}
.hp-cat .hp-more{margin-top:auto}

/* --- 9. Blok 6/8: sektionsblok ---------------------------------------- */
.hp-block{display:grid;gap:1.25rem}
@media(min-width:1024px){.hp-block{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:2rem;align-items:start}}
.hp-block--solo{grid-template-columns:minmax(0,1fr)}
.hp-block__lead{min-width:0}
.hp-block__fig{display:block;margin:0;border-radius:var(--radius);overflow:hidden;background:var(--card-2);aspect-ratio:16/9}
.hp-block__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-block__title{margin:.5rem 0 0;font-size:1.25rem;line-height:1.3}
@media(min-width:1024px){.hp-block__title{font-size:1.5rem}}
.hp-block__title a{text-decoration:none}
.hp-block__title a:hover{color:var(--primary-text)}
.hp-block__stand{margin-top:.5rem;font-size:.9375rem;line-height:1.6;color:var(--text-muted)}
.hp-mini{border-top:1px solid var(--border)}
.hp-mini li{border-bottom:1px solid var(--border)}
.hp-mini a{display:grid;grid-template-columns:88px minmax(0,1fr);gap:.875rem;align-items:center;min-height:44px;
  padding:.75rem 0;text-decoration:none;color:var(--text)}
.hp-mini a:hover .hp-mini__title{color:var(--primary-text)}
.hp-mini__fig{margin:0;width:88px;height:88px;border-radius:8px;overflow:hidden;background:var(--card-2)}
.hp-mini__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-mini__body{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.hp-mini__cat{font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--primary-text)}
.hp-mini__title{font-size:.9375rem;font-weight:700;line-height:1.3}
.hp-mini__meta{font-size:.75rem;color:var(--text-muted)}

/* --- 10. Blok 7: prisændringer ---------------------------------------- */
.hp-price{display:grid;gap:1.25rem}
@media(min-width:900px){.hp-price{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}}
.hp-price__title{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;font-size:1rem;font-weight:700}
.hp-price__title svg{width:18px;height:18px;color:var(--primary-text);flex-shrink:0}
.hp-band .hp-price .fpl-table-wrap{background:var(--page)}
.hp-price__fig{margin:0 0 1.25rem;border-radius:var(--radius);overflow:hidden;background:var(--card-2);aspect-ratio:16/9}
@media(min-width:768px){.hp-price__fig{aspect-ratio:2/1}}
.hp-price__fig img{width:100%;height:100%;object-fit:cover;display:block}
/* mobil: skjul den mindst vigtige kolonne, så tabellen ikke skal rulles */
@media(max-width:479px){.hp-price .fpl-table th:last-child,.hp-price .fpl-table td:last-child{display:none}
  .hp-price .fpl-table{min-width:0}}

/* --- 11. Blok 9: sådan arbejder vi ------------------------------------ */
.hp-ed{display:grid;gap:1.25rem}
@media(min-width:1024px){.hp-ed{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:2.5rem;align-items:center}}
.hp-ed__fig{margin:0;border-radius:var(--radius);overflow:hidden;background:var(--card-2);aspect-ratio:16/9;order:-1}
@media(min-width:1024px){.hp-ed__fig{order:0}}
.hp-ed__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-ed__fig figcaption{padding:.375rem .5rem .5rem}
.hp-ed__points{counter-reset:hp 0}
.hp-ed__points li{position:relative;counter-increment:hp;padding-left:2.5rem;font-size:.9375rem;line-height:1.6;color:var(--text-muted)}
.hp-ed__points li+li{margin-top:.875rem}
.hp-ed__points li b{color:var(--text)}
.hp-ed__points li::before{content:counter(hp);position:absolute;left:0;top:0;display:flex;align-items:center;
  justify-content:center;width:1.75rem;height:1.75rem;border-radius:999px;background:var(--primary-soft);
  color:var(--primary-text);font-size:.8125rem;font-weight:700}
.hp-authors{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.25rem}
.hp-author{display:flex;align-items:center;gap:.625rem;min-height:44px;padding:.375rem .75rem .375rem .375rem;
  background:var(--card);border:1px solid var(--border);border-radius:999px;text-decoration:none;color:var(--text)}
.hp-band .hp-author{background:var(--page)}
.hp-author:hover{border-color:var(--primary)}
.hp-author__txt{display:flex;flex-direction:column;line-height:1.25}
.hp-author__txt b{font-size:.875rem}
.hp-author__txt small{font-size:.75rem;color:var(--text-muted)}
.hp-ed__links{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;margin-top:1rem}

/* --- 12. Blok 10: nyhedsbrev ----------------------------------------- */
.hp-nl{display:grid;overflow:hidden}
@media(min-width:768px){.hp-nl{grid-template-columns:minmax(0,1fr) 16rem;align-items:stretch}}
.hp-nl__fig{margin:0;aspect-ratio:16/9;background:var(--card-2)}
@media(min-width:768px){.hp-nl__fig{order:2;aspect-ratio:auto;height:100%}}
.hp-nl__fig img{width:100%;height:100%;object-fit:cover;display:block}
.hp-nl__body{display:flex;flex-direction:column;gap:.625rem;padding:1.25rem}
@media(min-width:768px){.hp-nl__body{padding:1.75rem}}
.hp-nl__text{font-size:.9375rem;line-height:1.6;color:var(--text-muted)}
.hp-nl__form{display:grid;gap:.5rem;margin-top:.5rem}
@media(min-width:520px){.hp-nl__form{grid-template-columns:minmax(0,1fr) auto}}
.hp-nl__form input{min-height:48px;padding:.5rem .875rem;font:inherit;font-size:16px;color:var(--text);
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius)}
.hp-nl__form .btn{min-height:48px}
.hp-nl__fine{font-size:.75rem;line-height:1.45;color:var(--text-muted)}

/* --- 13. Mørkt tema: kun det, tokens ikke klarer selv ---------------- */
html[data-theme="dark"] .hp-sec2:hover,
html[data-theme="dark"] .hp-cat:hover,
html[data-theme="dark"] .hp-rail-card:hover,
html[data-theme="dark"] .hp-author:hover{border-color:var(--primary-text)}
html[data-theme="dark"] .hp-stat--now{border-color:var(--primary-text)}
html[data-theme="dark"] .hp-band .hp-stat,
html[data-theme="dark"] .hp-band .hp-form .card,
html[data-theme="dark"] .hp-band .hp-author,
html[data-theme="dark"] .hp-band .hp-price .fpl-table-wrap{background:var(--card-2)}
html[data-theme="dark"] .hp-lead__tag{background:var(--primary);color:#fff}
html[data-theme="dark"] .hp-nl__form input{background:var(--card-2)}

/* --- 14. Bevægelse -------------------------------------------------- */
@media(prefers-reduced-motion:reduce){.hp-sec2,.hp-cat,.hp-rail-card,.hp-author{transition:none}}