/* Theme-side overrides for Daniel's design system (loaded after elh/css/elh.min.css, only on the
   "Elithair Sektionen" template). Keep every rule scoped to .elh-ds and document it in elh/README.md. */

/* Port of the reference plugin's "graftwerte-umbruch" rules: long localized graft ranges wrap inside their
   cards; empty comparison/timeline rows stay hidden. The plugin also hid a whole comparison section whose
   heading #s18-titel is missing — on PT/FR elithair-app that hid a table with real data (QA 28 Oct), so that
   rule is not ported; Daniel adds the missing headings instead. */
.elh-ds .fx-gz__wert b{white-space:normal!important;overflow-wrap:anywhere}
.elh-ds .m-tvergleich tbody tr:has(>th[scope=row]:empty){display:none}
.elh-ds .m-tab-zeit tbody tr:has(>td.m-tab-zeit__titel:empty):has(>td.m-tab-zeit__hinweis:empty){display:none}

/* Hero (03-kopf-hero) on desktop: Daniel's photo is 900 px tall at ≥1200 px, which with the live theme header
   above it pushes the hero card below the fold on a 900 px-high screen (decision Khaled, 28 Oct 2026).
   The photo now fits the first screen: viewport height minus header (101 px) and stage padding, never below
   700 px (the DE card is 628 px) and never above Daniel's 900 px. The trust card overlaps the photo less when the
   photo is shorter (174 px at 1050 px viewport height and above, 24 px at 900 px). Daniel's elh.min.js keeps its
   48 px safety gap: when the overlay card would collide with the trust card it raises the photo's min-height
   inline, so narrow desktops (1200–1300 px, where the card wraps) still get a taller photo. Mobile unchanged. */
@media (min-width: 1200px) {
  .elh-ds.elh-ds .final-muster-kopf-hero .s-header-hero__photo{min-height:0;height:clamp(700px, calc(100vh - 170px), 900px);aspect-ratio:auto}
  .elh-ds.elh-ds .final-muster-kopf-hero .s-trust{margin-top:calc(-1 * clamp(24px, 100vh - 876px, 174px))}
}

/* Blog feed (Daniel's "fx-feed" overview section wrapping the theme's archive block): the AR export carries a feed
   component (k-46966f98) without the card-link rules that the EN/UK/TR component (k-3ee0942e) has, so the theme's
   archive-block CSS (.archive-container .archive-grid .post-card a { display:flex; height:294px; … }) collapsed the
   thumbnails to ~120 px (QA 3 Nov 2026). Fallback = the k-3ee0942e card-link rules, generic at (0,4,1): above the
   archive block (0,3,1), below Daniel's own component rules (0,5,1), so EN/UK/TR are unchanged. Logical padding, so the
   same rules serve RTL. Once Daniel regenerates the AR blog page with the current feed component this block can go. */
.elh-ds.elh-ds .fx-feed .post-card a{position:static;display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:16px;height:100%;box-sizing:border-box;padding:10px;padding-inline:10px 16px;background:var(--elh-white);border-radius:var(--elh-r-xl);color:var(--elh-navy);text-decoration:none}
.elh-ds.elh-ds .fx-feed .post-card a:after{content:none;display:none}
.elh-ds.elh-ds .fx-feed .post-card a:hover p{color:var(--elh-blue)}
.elh-ds.elh-ds .fx-feed .post-card a:focus-visible{outline:2px solid var(--elh-blue);outline-offset:2px}
@media (min-width: 640px) {
  .elh-ds.elh-ds .fx-feed .post-card a{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start;gap:0;padding:0;overflow:hidden}
  .elh-ds.elh-ds .fx-feed .post-card a:hover .post-thumb img{transform:scale(1.03)}
}