@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,700;6..96,900&family=IBM+Plex+Sans:wght@400;600;700&display=swap');
/* ============================================================
   Glasdrache-Verdikt — Dragonia Erfahrungen (de)
   namespace: der- · THEME dark · LAYOUT cards · SHAPE moderate
   DENSITY dense · PERSONA glass
   ============================================================ */



:root{
  --bg-main:#150E22;
  --bg-solid:#1C1230;          /* Tintenschicht unter Glas / no-blur Fallback */
  --bg-card:rgba(58,38,92,0.42);
  --bg-card-solid:#221636;
  --accent:#FFDB6A;
  --accent-2:#A855F7;
  --text-main:#F6F1FA;
  --text-muted:#C9BBDD;
  --border:rgba(196,164,255,0.26);
  --edge-in:inset 0 1px 0 rgba(255,255,255,0.10);
  --pro:#4BE3A5;
  --con:#FF8A3D;

  --font-head:'Bodoni Moda',Georgia,'Times New Roman',serif;
  --font-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;

  --wrap:1180px;
  --gutter:20px;
  --sec:56px;                  /* dense */
  --gap:20px;
  --r:12px;                    /* moderate */
  --r-sm:8px;
  --hdr-h:72px;
}

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

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

body{
  margin:0;
  overflow-x:hidden;
  background:var(--bg-main);
  color:var(--text-main);
  font-family:var(--font-body);
  font-size:1.02rem;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Amethyst-Glutkegel + Drachenschuppen-Textur als ruhiger Seitengrund */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(60vw 46vw at 12% -6%, rgba(168,85,247,0.22), transparent 62%),
    radial-gradient(52vw 40vw at 92% 4%, rgba(255,219,106,0.10), transparent 60%),
    var(--bg-main);
}

img{max-width:100%}
svg{display:block}

h1,h2,h3,h4{font-family:var(--font-head);font-weight:700;line-height:1.16;margin:0 0 .6em;letter-spacing:-.005em}
h1{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:900;text-wrap:balance}
h2{font-size:1.75rem;text-wrap:balance}
h3{font-size:1.15rem}
h4{font-size:1.02rem;font-family:var(--font-body);font-weight:600}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
strong{font-weight:600;color:#fff}
small{font-size:.84rem}

a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

::selection{background:rgba(255,219,106,.28);color:#fff}

.der-container{
  width:100%;max-width:var(--wrap);margin-inline:auto;
  padding-inline:var(--gutter);
}
.der-container>*{min-width:0}

/* ---------- LAYOUT-ARCHETYP: cards (jede Sektion = Glasscheibe) ---------- */
main{display:block;padding-block:var(--sec) calc(var(--sec) + 8px)}

.der-section{padding-block:0;margin-block:0 var(--sec)}
.der-section:last-child{margin-bottom:0}

.der-section>.der-container>.der-panelbox,
.der-block{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:var(--edge-in),0 18px 44px rgba(9,4,20,.42);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  padding:clamp(20px,3vw,34px);
}

/* Standard: jede Sektion (außer Hero/CTA) rendert als Panel-Karte */
.der-section:not(.der-hero):not(.der-cta)>.der-container{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:var(--edge-in),0 18px 44px rgba(9,4,20,.42);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  padding:clamp(22px,3vw,36px);
  max-width:calc(var(--wrap) - 2 * 0px);
}

/* Sekundäre Tönung für Wechselrhythmus */
.der-section--alt:not(.der-hero)>.der-container{
  background:linear-gradient(180deg,rgba(58,38,92,.52),rgba(28,18,48,.46));
}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .der-section:not(.der-hero):not(.der-cta)>.der-container,
  .der-block,.der-card,.der-panel,.der-verdict,.der-quote,.der-submenu,
  .der-nav .der-submenu,.der-rtp-item,.der-stat,.der-chip{
    background:var(--bg-card-solid);
  }
}

.der-eyebrow{
  display:inline-block;font-family:var(--font-body);font-size:.74rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  margin:0 0 .7rem;
}
.der-eyebrow--muted{color:var(--text-muted)}
.der-lead{font-size:1.1rem;color:var(--text-muted)}
.der-muted{color:var(--text-muted)}
.der-fine{font-size:.82rem;color:var(--text-muted);line-height:1.5}

/* ---------- Buttons ---------- */
.der-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:46px;padding:.72rem 1.35rem;
  font-family:var(--font-body);font-size:.96rem;font-weight:600;line-height:1.2;
  border-radius:var(--r);border:1px solid transparent;cursor:pointer;
  text-decoration:none;white-space:nowrap;
  background:linear-gradient(180deg,#FFE58C,var(--accent));
  color:#150E22;
  box-shadow:0 0 0 rgba(255,219,106,0),var(--edge-in);
  transition:box-shadow .18s ease,transform .18s ease,background .18s ease;
}
.der-btn:hover{
  text-decoration:none;color:#150E22;
  box-shadow:0 0 28px rgba(255,219,106,.34),var(--edge-in);
  transform:translateY(-1px);
}
.der-btn:active{transform:translateY(0)}
.der-btn--ghost{
  background:transparent;color:var(--text-main);
  border-color:var(--accent-2);
}
.der-btn--ghost:hover{
  color:var(--text-main);
  border-color:var(--accent);
  box-shadow:0 0 22px rgba(168,85,247,.28);
}
.der-btn--lg{min-height:54px;padding:.95rem 1.9rem;font-size:1.04rem}
.der-btn--sm{min-height:40px;padding:.5rem 1rem;font-size:.88rem}

/* ---------- Icons ---------- */
.der-icon{
  width:1.5em;height:1.5em;display:inline-block;vertical-align:middle;
  flex-shrink:0;color:var(--accent);
}
.der-icon--lg{width:2rem;height:2rem}

/* ============================================================
   HEADER
   ============================================================ */
.der-header{
  position:sticky;top:0;z-index:900;
  background:rgba(21,14,34,.86);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .der-header{background:#150E22}
}
.der-header__bar{
  max-width:var(--wrap);margin-inline:auto;
  padding:.6rem var(--gutter);
  display:flex;align-items:center;gap:clamp(.6rem,2vw,1.6rem);
  min-height:var(--hdr-h);
}
.der-header__bar>*{min-width:0}

.der-logo{
  display:inline-flex;align-items:center;gap:.55rem;flex-shrink:0;
  text-decoration:none;color:var(--text-main);
}
.der-logo:hover{text-decoration:none}
.der-logo__img{height:40px;width:auto;object-fit:contain;display:block}
.der-logo__text{
  font-family:var(--font-head);font-weight:900;font-size:1.32rem;
  letter-spacing:-.01em;line-height:1;color:var(--text-main);
}
.der-logo__text b{color:var(--accent);font-weight:900}
.der-logo__sub{
  display:block;font-family:var(--font-body);font-size:.62rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--text-muted);
  margin-top:.22rem;
}

/* --- Nav --- */
.der-nav{margin-inline-start:auto}
.der-nav__list{
  display:flex;align-items:center;gap:clamp(.4rem,1.4vw,1.15rem);
  list-style:none;margin:0;padding:0;
}
.der-nav a:not(.der-btn){
  display:inline-block;padding:.5rem .25rem;
  font-size:.94rem;font-weight:600;color:var(--text-main);
  text-decoration:none;position:relative;
  transition:color .18s ease;
}
.der-nav a:not(.der-btn):hover{color:var(--accent);text-decoration:none}
.der-nav a:not(.der-btn)::after{
  content:"";position:absolute;left:.25rem;right:.25rem;bottom:.24rem;
  height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .18s ease;
}
.der-nav a:not(.der-btn):hover::after,
.der-nav a:not(.der-btn):focus-visible::after{transform:scaleX(1)}
.der-nav a:not(.der-btn).is-current{color:var(--accent)}

/* Grouped-menu Hooks (falls genutzt) */
.der-nav__group{position:relative;display:flex;align-items:center;gap:.15rem}
.der-nav__toggle{
  display:none;background:none;border:0;color:var(--text-muted);
  font-size:.8rem;line-height:1;padding:.5rem;cursor:pointer;
}
.der-submenu{
  display:none;position:absolute;top:100%;left:0;min-width:230px;
  list-style:none;margin:.4rem 0 0;padding:.5rem;
  background:var(--bg-card-solid);border:1px solid var(--border);
  border-radius:var(--r);box-shadow:0 20px 44px rgba(9,4,20,.55),var(--edge-in);
  z-index:1000;
}
.der-nav__group:hover .der-submenu,
.der-nav__group:focus-within .der-submenu{display:block}
.der-submenu a{display:block;padding:.5rem .6rem;border-radius:var(--r-sm)}
.der-submenu a:hover{background:rgba(168,85,247,.16)}

/* CTA: nur EINE sichtbare Instanz — standalone, außerhalb <nav> */
.der-header__cta{flex-shrink:0}
.der-nav>.der-btn{display:none}

/* --- Burger --- */
.der-burger{
  display:none;flex-shrink:0;
  width:44px;height:44px;padding:0;margin-inline-start:auto;
  align-items:center;justify-content:center;flex-direction:column;gap:5px;
  background:transparent;border:1px solid var(--border);border-radius:var(--r-sm);
  cursor:pointer;
}
.der-burger span{
  display:block;width:22px;height:2px;background:var(--text-main);border-radius:2px;
  transition:transform .2s ease,opacity .2s ease;
}
.der-header.is-open .der-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.der-header.is-open .der-burger span:nth-child(2){opacity:0}
.der-header.is-open .der-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:900px){
  .der-nav{display:none;margin-inline-start:0}
  .der-header.is-open .der-nav{
    display:flex;
    position:absolute;left:0;right:0;top:100%;
    background:var(--bg-solid);
    border-bottom:1px solid var(--border);
    padding:.5rem var(--gutter) 1.1rem;
    box-shadow:0 22px 40px rgba(9,4,20,.5);
  }
  .der-header{position:sticky}
  .der-header__bar{position:relative}
  .der-nav__list{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .der-nav__list>li{border-bottom:1px solid var(--border)}
  .der-nav__list>li:last-child{border-bottom:0}
  .der-nav a:not(.der-btn){display:block;padding:.85rem .1rem;font-size:1rem}
  .der-nav a:not(.der-btn)::after{display:none}
  .der-nav__group{flex-wrap:wrap}
  .der-nav__group>.der-nav__top{flex:1}
  .der-nav__toggle{display:block;font-size:1rem}
  .der-submenu{
    display:none;position:static;box-shadow:none;background:transparent;
    border:0;border-radius:0;padding:0 0 .4rem .9rem;width:100%;margin:0;
  }
  .der-nav__group.is-open .der-submenu{display:block}
  .der-burger{display:flex}
  .der-header__cta{margin-inline-start:0}
  .der-nav .der-btn{width:100%;margin-top:.9rem}
  .der-logo__img{max-width:min(45vw,190px);height:auto;max-height:40px}
  .der-logo__sub{display:none}
}
@media (max-width:479px){
  .der-header__cta{display:none}
  .der-header__bar{gap:.5rem;padding-inline:14px}
  .der-logo__text{font-size:1.12rem}
  .der-logo__img{max-height:34px}
}

/* ============================================================
   HERO — HOME: overlay (full-bleed, Bild als Hintergrundebene)
   ============================================================ */
.der-hero{position:relative;overflow:hidden}

.der-hero__img{
  display:block;width:100%;height:auto;max-height:70vh;
  aspect-ratio:3/2;object-fit:cover;border-radius:var(--r);
}
.der-hero__inner{position:relative;z-index:1}

.der-hero--home{
  min-height:clamp(420px,60vh,620px);
  display:flex;align-items:center;
  margin-bottom:var(--sec);
  border-radius:var(--r);
  background:
    radial-gradient(70% 90% at 18% 10%, rgba(168,85,247,.34), transparent 62%),
    radial-gradient(60% 80% at 88% 90%, rgba(255,219,106,.16), transparent 60%),
    linear-gradient(160deg,#2A1A47,#150E22 70%);
}
.der-hero--home .der-hero__img{
  position:absolute;inset:0;width:100%;height:100%;max-height:none;
  aspect-ratio:auto;object-fit:cover;border-radius:0;z-index:0;
}
.der-hero--home::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,
    rgba(10,7,20,.92) 0%,
    rgba(12,8,24,.78) 45%,
    rgba(14,9,28,.50) 100%);
}
.der-hero--home .der-hero__inner{
  z-index:1;
  width:100%;max-width:var(--wrap);margin-inline:auto;
  padding:clamp(38px,6vw,64px) var(--gutter);
  color:#fff;
}
.der-hero--home .der-hero__inner>*{max-width:820px}
.der-hero--home h1{color:#fff;margin-bottom:.45em}
.der-hero--home .der-hero__sub{
  font-size:clamp(1.02rem,2vw,1.18rem);color:#E7DEF5;margin-bottom:1.4rem;
}
.der-hero__actions{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.der-hero__note{margin-top:1.1rem;font-size:.82rem;color:#CFC3E4}

/* Rating-Strip im Hero */
.der-hero__ratings{
  display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.3rem;padding:0;list-style:none;
}

/* ---------- HERO — INNER: kompakte Page-Header-Bandsektion ---------- */
.der-hero--inner{
  position:relative;overflow:hidden;
  min-height:190px;display:flex;align-items:center;
  margin-bottom:var(--sec);
  border-radius:var(--r);
  border:1px solid var(--border);
  background:
    radial-gradient(60% 130% at 8% 0%, rgba(168,85,247,.32), transparent 64%),
    linear-gradient(180deg,#2A1A47,#1C1230);
  box-shadow:var(--edge-in);
}
.der-hero--inner .der-hero__inner{
  width:100%;
  padding-block:clamp(22px,3.4vw,30px);
  padding-inline:max(var(--gutter),calc((100% - var(--wrap))/2 + var(--gutter)));
}
.der-hero--inner .der-hero__img{
  position:absolute;inset:0;width:100%;height:100%;max-height:none;
  aspect-ratio:auto;object-fit:cover;border-radius:0;z-index:0;
}
.der-hero--inner .der-hero__inner::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,7,20,.90),rgba(12,8,24,.66));
}
:where(.der-hero--inner .der-hero__inner>:not(.der-hero__img)){position:relative;z-index:2}
.der-hero--inner h1{font-size:clamp(1.8rem,3.6vw,2.5rem);margin-bottom:.25em;color:#fff}
.der-hero--inner .der-hero__sub{color:#E2D8F2;max-width:780px;margin-bottom:0}

/* ---------- page-header (schlicht, Legal-Seiten) ---------- */
.der-page-header{
  position:relative;overflow:hidden;
  margin-bottom:var(--sec);
  padding-block:clamp(26px,4vw,40px);
  border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,rgba(58,38,92,.42),transparent);
}
.der-page-header h1{margin-bottom:.2em}
.der-page-header .der-breadcrumb{margin-bottom:.9rem}

/* ---------- Breadcrumb ---------- */
.der-breadcrumb{font-size:.82rem;color:var(--text-muted)}
.der-breadcrumb ol{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:0;padding:0}
.der-breadcrumb li+li::before{content:"/";margin-inline-end:.4rem;color:var(--accent-2)}
.der-breadcrumb a{color:var(--text-muted)}
.der-breadcrumb a:hover{color:var(--accent)}

/* ============================================================
   SECTION HEADS
   ============================================================ */
.der-section__head{margin-bottom:1.4rem}
.der-section__head h2{margin-bottom:.3em}
.der-section__head p{color:var(--text-muted);margin-bottom:0}

/* ---------- overview / prose ---------- */
.der-overview p,.der-prose p{margin-bottom:1em}
.der-prose ul,.der-prose ol{margin:0 0 1.1em;padding-inline-start:1.25rem}
.der-prose li{margin-bottom:.45em}
.der-prose li::marker{color:var(--accent-2)}

/* ============================================================
   VERDICT-BOX — Signatur: beleuchtete Glasscheibe
   ============================================================ */
.der-verdict{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);
  gap:clamp(18px,3vw,32px);align-items:center;
  padding:clamp(20px,3vw,32px);
  border:1px solid var(--border);border-radius:var(--r);
  background:linear-gradient(180deg,rgba(58,38,92,.55),rgba(28,18,48,.5));
  box-shadow:var(--edge-in),0 22px 52px rgba(9,4,20,.5);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}
.der-verdict::before{      /* diagonaler Glanzstreifen */
  content:"";position:absolute;top:-60%;left:-10%;width:52%;height:220%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.07),transparent);
  transform:rotate(12deg);pointer-events:none;
}
.der-verdict>*{position:relative;z-index:1;min-width:0}
.der-verdict__score{
  text-align:center;padding:1rem .6rem;
  border:1px solid rgba(255,219,106,.34);border-radius:var(--r);
  background:radial-gradient(120% 120% at 50% 0%,rgba(255,219,106,.14),transparent 68%);
}
.der-verdict__num{
  display:block;font-family:var(--font-head);font-weight:900;font-size:4rem;line-height:1;
  color:var(--accent);text-shadow:0 0 26px rgba(255,219,106,.42);
}
.der-verdict__num span{font-size:1.35rem;color:var(--text-muted);text-shadow:none}
.der-verdict__label{
  display:block;margin-top:.45rem;font-size:.74rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);
}
.der-verdict__body h2,.der-verdict__body h3{margin-bottom:.4em}
.der-verdict__body p{color:var(--text-muted)}
.der-verdict__actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.1rem}

/* Pro / Contra */
.der-proscons{
  display:grid;gap:var(--gap);margin-top:var(--gap);
  grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));
}
.der-proscons>*{min-width:0}
.der-pc{
  padding:1.1rem 1.2rem;border-radius:var(--r);
  background:var(--bg-card);border:1px solid var(--border);
  box-shadow:var(--edge-in);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}
.der-pc--pro{border-inline-start:3px solid var(--pro)}
.der-pc--con{border-inline-start:3px solid var(--con)}
.der-pc h3{font-family:var(--font-body);font-size:.78rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:.7em}
.der-pc--pro h3{color:var(--pro)}
.der-pc--con h3{color:var(--con)}
.der-pc ul{list-style:none;margin:0;padding:0}
.der-pc li{display:flex;gap:.6rem;align-items:flex-start;margin-bottom:.55em;
  font-size:.96rem;color:var(--text-muted);overflow-wrap:anywhere}
.der-pc li:last-child{margin-bottom:0}
.der-pc--pro li .der-icon{color:var(--pro)}
.der-pc--con li .der-icon{color:var(--con)}

/* ============================================================
   FEATURE-CARDS — Pattern: icon-rows (Liste, keine Boxen)
   ============================================================ */
.der-features{display:flex;flex-direction:column;gap:0;margin:0;padding:0;list-style:none}
.der-feature{
  display:flex;align-items:flex-start;gap:clamp(.9rem,2vw,1.25rem);
  padding:1.15rem 0;border-bottom:1px solid var(--border);
}
.der-feature:first-child{padding-top:0}
.der-feature:last-child{border-bottom:0;padding-bottom:0}
.der-feature>*{min-width:0}
.der-feature__icon{
  flex-shrink:0;width:52px;height:52px;
  display:flex;align-items:center;justify-content:center;
  border-radius:var(--r);
  border:1px solid rgba(255,219,106,.30);
  background:radial-gradient(120% 120% at 50% 0%,rgba(255,219,106,.16),rgba(168,85,247,.14));
  color:var(--accent);
}
.der-feature__icon .der-icon{width:24px;height:24px}
.der-feature__body h3{margin-bottom:.28em}
.der-feature__body p{color:var(--text-muted);margin-bottom:0;font-size:.97rem}
@media (max-width:480px){
  .der-feature{gap:.8rem}
  .der-feature__icon{width:42px;height:42px}
  .der-feature__icon .der-icon{width:20px;height:20px}
}

/* ============================================================
   CARDS-GRID
   ============================================================ */
.der-cards{
  display:grid;gap:var(--gap);
  grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));
}
.der-cards>*{min-width:0}
.der-card{
  padding:1.25rem;border-radius:var(--r);
  background:var(--bg-card);border:1px solid var(--border);
  box-shadow:var(--edge-in);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.der-card:hover{
  border-color:rgba(255,219,106,.55);
  box-shadow:0 0 28px rgba(255,219,106,.28),var(--edge-in);
  transform:translateY(-2px);
}
.der-card h3{margin-bottom:.35em}
.der-card p{color:var(--text-muted);margin-bottom:0;font-size:.96rem}
.der-card__top{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}
.der-card__value{font-family:var(--font-head);font-weight:900;font-size:1.6rem;color:var(--accent)}

/* ============================================================
   DATA-TABLE / PAYMENTS-TABLE
   ============================================================ */
.der-table-wrap{overflow-x:auto;max-width:100%;margin-block:1.5rem;
  border:1px solid var(--border);border-radius:var(--r);
  -webkit-overflow-scrolling:touch}
.der-table-wrap:first-child{margin-top:0}
.der-table-wrap:last-child{margin-bottom:0}
table.der-table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:520px}
.der-table th,.der-table td{
  padding:.78rem 1rem;text-align:start;vertical-align:top;
  border-bottom:1px solid var(--border);
}
.der-table thead th{
  white-space:nowrap;font-family:var(--font-body);font-weight:600;font-size:.78rem;
  letter-spacing:.11em;text-transform:uppercase;color:var(--text-main);
  background:linear-gradient(180deg,#3A265C,#241640);
  border-bottom:1px solid rgba(255,219,106,.45);
  position:sticky;top:0;
}
.der-table tbody tr:last-child td{border-bottom:0}
.der-table tbody tr:hover{background:rgba(168,85,247,.10)}
.der-table td strong{color:var(--text-main)}
.der-table .der-val{color:var(--accent);font-weight:600;white-space:nowrap}
.der-table td .der-icon{color:var(--accent-2)}

.der-pay-row{display:flex;align-items:center;gap:.6rem;white-space:nowrap}
.der-pay-row .der-icon{color:var(--accent-2)}
.der-pay-name{font-weight:600}

/* ============================================================
   TWO-COLS + CONTENT-PANEL
   ============================================================ */
.der-two{display:grid;gap:clamp(20px,3vw,32px);grid-template-columns:minmax(0,1fr)}
.der-two>*{min-width:0}
@media (min-width:900px){
  .der-two{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start}
  .der-two--mirror>.der-two__panel{order:-1}
}
.der-two__main>h2:first-child,.der-two__main>h3:first-child{margin-top:0}

.der-panel{
  padding:1.25rem 1.3rem;border-radius:var(--r);
  background:linear-gradient(180deg,rgba(58,38,92,.55),rgba(28,18,48,.48));
  border:1px solid var(--border);
  box-shadow:var(--edge-in),0 14px 34px rgba(9,4,20,.35);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}
.der-panel__title{
  font-family:var(--font-body);font-size:.76rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--accent);
  margin:0 0 .95rem;
}
/* quick facts */
.der-facts{margin:0}
.der-facts__row{
  display:flex;flex-wrap:wrap;gap:.5rem 1rem;justify-content:space-between;
  padding:.6rem 0;border-bottom:1px solid var(--border);
}
.der-facts__row:last-child{border-bottom:0;padding-bottom:0}
.der-facts dt{font-size:.9rem;color:var(--text-muted);margin:0}
.der-facts dd{margin:0;font-weight:600;font-size:.94rem;text-align:end;overflow-wrap:anywhere}
/* checklist */
.der-checklist{list-style:none;margin:0;padding:0}
.der-checklist li{display:flex;gap:.6rem;align-items:flex-start;
  padding:.42rem 0;font-size:.95rem;color:var(--text-muted);overflow-wrap:anywhere}
.der-checklist li .der-icon{width:1.15rem;height:1.15rem;margin-top:.18rem;color:var(--accent)}
/* mini stat tiles */
.der-minitiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.der-minitiles>*{min-width:0}
.der-minitile{
  padding:.7rem .8rem;border-radius:var(--r-sm);
  background:var(--bg-card-solid);border:1px solid var(--border);
}
.der-minitile b{display:block;font-family:var(--font-head);font-weight:900;
  font-size:1.35rem;color:var(--accent);line-height:1.1}
.der-minitile span{display:block;font-size:.76rem;color:var(--text-muted);margin-top:.15rem}
/* rating badge */
.der-score{display:flex;align-items:center;gap:.85rem}
.der-score__num{font-family:var(--font-head);font-weight:900;font-size:2.6rem;
  line-height:1;color:var(--accent);text-shadow:0 0 22px rgba(255,219,106,.38)}
.der-score__stars{display:flex;gap:.15rem;color:var(--accent)}
.der-score__stars .der-icon{width:1.05rem;height:1.05rem}
.der-score__label{font-size:.84rem;color:var(--text-muted);display:block;margin-top:.2rem}

/* ============================================================
   NUMBERED-LIST
   ============================================================ */
.der-steps{counter-reset:der-step;list-style:none;margin:0;padding:0}
.der-steps>li{
  counter-increment:der-step;position:relative;
  padding:0 0 1.15rem 3.2rem;margin-bottom:1.15rem;
  border-bottom:1px solid var(--border);
}
.der-steps>li:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.der-steps>li::before{
  content:counter(der-step,decimal-leading-zero);
  position:absolute;left:0;top:-.1rem;
  font-family:var(--font-head);font-weight:900;font-size:1.5rem;
  color:var(--accent);line-height:1;
}
.der-steps h3{margin-bottom:.25em}
.der-steps p{color:var(--text-muted);margin-bottom:0}

/* ============================================================
   STATS-BAR — Pattern: tiles
   ============================================================ */
.der-stats{
  display:grid;gap:var(--gap);
  grid-template-columns:repeat(auto-fit,minmax(min(165px,100%),1fr));
}
.der-stats>*{min-width:0}
.der-stat{
  padding:1.1rem 1.15rem;border-radius:var(--r);
  background:var(--bg-card);border:1px solid var(--border);
  box-shadow:var(--edge-in);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.der-stat:hover{border-color:rgba(255,219,106,.5);box-shadow:0 0 24px rgba(255,219,106,.24),var(--edge-in)}
.der-stat__value{
  display:block;font-family:var(--font-head);font-weight:900;
  font-size:clamp(1.7rem,3.2vw,2.25rem);line-height:1.05;color:var(--accent);
  overflow-wrap:anywhere;
}
.der-stat__label{
  display:block;margin-top:.35rem;font-size:.78rem;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);
}

/* ============================================================
   CATEGORIES-BAR / CHIPS
   ============================================================ */
.der-chips{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}
.der-chip{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.42rem .85rem;border-radius:var(--r);
  font-size:.86rem;font-weight:600;color:var(--text-main);
  background:var(--bg-card);
  border:1px solid var(--border);
  box-shadow:var(--edge-in);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  text-decoration:none;
}
a.der-chip:hover{border-color:rgba(255,219,106,.55);color:var(--text-main);text-decoration:none}
.der-chip b{color:var(--accent);font-weight:600}
.der-chip .der-icon{width:1.05rem;height:1.05rem;color:var(--accent-2)}

/* ============================================================
   REVIEWS / ZITAT-KARTEN
   ============================================================ */
.der-quotes{
  display:grid;gap:var(--gap);
  grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));
}
.der-quotes>*{min-width:0}
.der-quote{
  padding:1.2rem 1.3rem;border-radius:var(--r);
  background:var(--bg-card);
  border:1px solid var(--border);border-inline-start:3px solid var(--accent);
  box-shadow:var(--edge-in);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  display:flex;flex-direction:column;gap:.7rem;
}
.der-quote blockquote{margin:0;font-style:italic;font-size:.98rem;overflow-wrap:anywhere}
.der-quote__trans{color:var(--text-muted);font-style:italic;font-size:.92rem;margin:0}
.der-quote__meta{
  margin-top:auto;font-size:.8rem;color:var(--text-muted);
  display:flex;flex-wrap:wrap;gap:.4rem .6rem;align-items:baseline;
}
.der-quote__author{font-weight:600;color:var(--text-main);font-style:normal}
.der-quote__src a{color:var(--text-muted);text-decoration:underline}
.der-quote__src a:hover{color:var(--accent)}
.der-quotes__note{margin-top:1rem;font-size:.82rem;color:var(--text-muted)}

/* Externe Rating-Pills */
.der-ratings{display:flex;flex-wrap:wrap;gap:.55rem;list-style:none;margin:0 0 1.2rem;padding:0}
.der-rating-pill{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.42rem .9rem;border-radius:var(--r);
  font-size:.85rem;color:var(--text-muted);
  background:rgba(58,38,92,.42);border:1px solid var(--border);
  box-shadow:var(--edge-in);text-decoration:none;
}
.der-rating-pill b{color:var(--accent);font-weight:600}
a.der-rating-pill:hover{border-color:rgba(255,219,106,.5);color:var(--text-main);text-decoration:none}

/* ============================================================
   FAQ — Pattern: two-col
   ============================================================ */
.der-faq{display:grid;gap:0 clamp(20px,3vw,34px);grid-template-columns:minmax(0,1fr);align-items:start}
@media (min-width:820px){
  .der-faq{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.der-faq>*{min-width:0}
.der-faq details{border-bottom:1px solid var(--border)}
.der-faq details summary{cursor:pointer;padding:1rem 0;font-weight:600;list-style:none;
  display:flex;gap:.5rem;align-items:baseline;overflow-wrap:anywhere}
.der-faq details summary::-webkit-details-marker{display:none}
.der-faq details summary::before{content:'+';margin-right:.5rem;color:var(--accent);
  font-weight:600;transition:transform .2s}
.der-faq details[open] summary::before{content:'−'}
.der-faq details[open] summary{color:var(--accent)}
.der-faq details>:not(summary){padding:.5rem 0 1rem;color:var(--text-muted)}
.der-faq details>:not(summary):last-child{margin-bottom:0}

/* generischer Fallback, falls FAQ ohne Wrapper */
summary{cursor:pointer;padding:1rem 0;font-weight:600;list-style:none}
summary::before{content:'+';margin-right:.5rem;transition:transform .2s}
details[open] summary::before{content:'−'}
details>:not(summary){padding:.5rem 0 1rem}

/* ============================================================
   RTP-GRID (Slot-Kacheln)
   ============================================================ */
.der-rtp{display:grid;gap:clamp(.6rem,1.5vw,1rem);
  grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.der-rtp{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:960px){.der-rtp{grid-template-columns:repeat(4,minmax(0,1fr))}}
.der-rtp-item{position:relative;overflow:hidden;min-width:0;
  border-radius:var(--r);border:1px solid var(--border);
  background:var(--bg-card-solid);box-shadow:var(--edge-in);
  transition:border-color .18s ease,box-shadow .18s ease}
.der-rtp-item:hover{border-color:rgba(255,219,106,.55);
  box-shadow:0 0 26px rgba(255,219,106,.26),var(--edge-in)}
.der-rtp-item__thumb{aspect-ratio:3/2;position:relative;
  background:linear-gradient(150deg,rgba(168,85,247,.42),rgba(21,14,34,.9))}
.der-rtp-item__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.der-rtp-item__name{display:block;padding:.6rem .7rem;font-size:.87rem;font-weight:600;
  line-height:1.3;overflow-wrap:anywhere}
.der-rtp-tooltip{position:absolute;bottom:0;left:0;right:0;opacity:0;transition:opacity .2s;
  padding:.6rem .7rem;font-size:.8rem;color:#fff;
  background:linear-gradient(180deg,rgba(10,7,20,0),rgba(10,7,20,.94));}
.der-rtp-tooltip b{color:var(--accent)}
.der-rtp-item:hover .der-rtp-tooltip,
.der-rtp-item:focus-within .der-rtp-tooltip{opacity:1}

/* ============================================================
   TOC
   ============================================================ */
.der-toc{padding:1.1rem 1.25rem;border-radius:var(--r);
  background:var(--bg-card-solid);border:1px solid var(--border);box-shadow:var(--edge-in)}
.der-toc__title{font-size:.76rem;font-weight:600;letter-spacing:.15em;
  text-transform:uppercase;color:var(--accent);margin:0 0 .7rem}
.der-toc ol,.der-toc ul{margin:0;padding:0;list-style:none;counter-reset:der-toc}
.der-toc li{counter-increment:der-toc;padding:.32rem 0;border-bottom:1px solid var(--border)}
.der-toc li:last-child{border-bottom:0}
.der-toc a{color:var(--text-main);font-size:.94rem}
.der-toc a:hover{color:var(--accent)}

/* ============================================================
   LEGAL-BODY
   ============================================================ */
.der-legal{counter-reset:der-legal}
.der-legal h2{counter-increment:der-legal;font-size:1.35rem;margin-top:2rem}
.der-legal h2::before{content:counter(der-legal) ". ";color:var(--accent)}
.der-legal h2:first-child{margin-top:0}
.der-legal h3{margin-top:1.4rem;font-size:1.05rem}
.der-legal p,.der-legal li{color:var(--text-muted)}
.der-legal ul,.der-legal ol{padding-inline-start:1.25rem;margin:0 0 1.1em}
.der-legal li{margin-bottom:.4em}
.der-legal li::marker{color:var(--accent-2)}
.der-legal a{overflow-wrap:anywhere}
.der-legal address{font-style:normal;color:var(--text-muted)}

/* ============================================================
   CTA-BLOCK
   ============================================================ */
.der-cta{margin-block:0 var(--sec)}
.der-cta__inner{
  padding-block:clamp(30px,4.5vw,46px);
  padding-inline:clamp(20px,3vw,36px);
  border-radius:var(--r);
  border:1px solid rgba(255,219,106,.34);
  background:
    radial-gradient(90% 140% at 12% 0%,rgba(255,219,106,.18),transparent 62%),
    linear-gradient(160deg,#33205A,#1C1230);
  box-shadow:var(--edge-in),0 22px 52px rgba(9,4,20,.5);
  display:flex;flex-direction:column;gap:1rem;
  text-align:center;align-items:center;
}
.der-cta__inner>*{max-width:760px}
.der-cta__inner h2{margin-bottom:0}
.der-cta__inner p{color:var(--text-muted);margin-bottom:0}
.der-cta__actions{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}
.der-cta__fine{font-size:.8rem;color:var(--text-muted)}

/* ============================================================
   STICKY-NAV (mobil)
   ============================================================ */
.der-sticky-nav{display:none}
@media (max-width:767px){
  .der-sticky-nav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:880;
    align-items:stretch;justify-content:space-around;gap:.2rem;
    padding:.4rem .5rem calc(.4rem + env(safe-area-inset-bottom,0px));
    background:rgba(21,14,34,.94);border-top:1px solid var(--border);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  }
  .der-sticky-nav a{
    flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:.15rem;
    padding:.35rem .2rem;font-size:.68rem;font-weight:600;color:var(--text-muted);
    text-decoration:none;text-align:center;
  }
  .der-sticky-nav a .der-icon{width:1.25rem;height:1.25rem;color:var(--text-muted)}
  .der-sticky-nav a.is-cta{color:var(--accent)}
  .der-sticky-nav a.is-cta .der-icon{color:var(--accent)}
  body{padding-bottom:64px}
}

/* ============================================================
   CHAT-WIDGET
   ============================================================ */
.der-chat{position:fixed;right:16px;bottom:16px;z-index:890}
@media (max-width:767px){.der-chat{bottom:74px}}
.der-chat__btn{
  width:52px;height:52px;border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#FFE58C,var(--accent));color:#150E22;
  border:0;cursor:pointer;box-shadow:0 10px 26px rgba(9,4,20,.5);
}
.der-chat__panel{
  position:absolute;right:0;bottom:64px;width:min(310px,86vw);
  padding:1rem 1.1rem;border-radius:var(--r);
  background:var(--bg-card-solid);border:1px solid var(--border);
  box-shadow:0 22px 52px rgba(9,4,20,.6),var(--edge-in);
}
.der-chat__panel[hidden]{display:none}
.der-chat__panel p{font-size:.9rem;color:var(--text-muted)}

/* ============================================================
   FOOTER
   ============================================================ */
.der-footer{
  background:linear-gradient(180deg,#1A1129,#100A1B);
  border-top:1px solid var(--border);
  padding-block:clamp(34px,4.5vw,48px) 1.4rem;
  color:var(--text-muted);
}
.der-footer__grid{
  display:grid;gap:clamp(22px,3vw,38px);
  grid-template-columns:minmax(0,1.3fr) repeat(auto-fit,minmax(min(160px,100%),1fr));
}
.der-footer__grid>*{min-width:0}
.der-footer__brand p{font-size:.9rem;color:var(--text-muted);margin-top:.9rem;max-width:38ch}
.der-footer .der-logo{margin-bottom:.2rem}
.der-footer__col h3{
  font-family:var(--font-body);font-size:.75rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--accent);margin-bottom:.9rem;
}
.der-footer__col ul{list-style:none;margin:0;padding:0}
.der-footer__col li{margin-bottom:.5rem}
.der-footer__col a{color:var(--text-muted);font-size:.92rem}
.der-footer__col a:hover{color:var(--accent);text-decoration:none}
.der-footer__age{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  border:2px solid var(--accent);color:var(--accent);
  font-family:var(--font-head);font-weight:900;font-size:.86rem;
  flex-shrink:0;
}
.der-footer__help{
  display:flex;gap:.8rem;align-items:flex-start;
  margin-top:1.6rem;padding:1rem 1.15rem;border-radius:var(--r);
  background:rgba(58,38,92,.38);border:1px solid var(--border);box-shadow:var(--edge-in);
}
.der-footer__help p{margin:0;font-size:.87rem;line-height:1.55}
.der-footer__help a{color:var(--accent)}
.der-footer__disclaimer{
  margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--border);
  font-size:.82rem;line-height:1.6;color:var(--text-muted);
}
.der-footer__bottom{
  margin-top:1.2rem;padding-top:1.1rem;border-top:1px solid var(--border);
  display:flex;flex-wrap:wrap;gap:.6rem 1.2rem;align-items:center;
  justify-content:space-between;font-size:.82rem;
}
.der-footer__bottom nav{display:flex;flex-wrap:wrap;gap:.6rem 1.1rem}
.der-footer__bottom a{color:var(--text-muted)}
.der-footer__bottom a:hover{color:var(--accent)}

/* ============================================================
   RESPONSIVE FEINSCHLIFF
   ============================================================ */
@media (max-width:768px){
  :root{--sec:40px;--gap:16px}
  h2{font-size:1.5rem}
  .der-verdict{grid-template-columns:minmax(0,1fr);text-align:start}
  .der-verdict__score{max-width:230px}
  .der-verdict__num{font-size:3.2rem}
}
@media (max-width:480px){
  :root{--gutter:16px}
  body{font-size:1rem}
  .der-minitiles{grid-template-columns:minmax(0,1fr)}
  .der-btn{width:auto}
  .der-hero--home{min-height:clamp(360px,64vh,520px)}
  .der-hero__actions .der-btn{width:100%}
  .der-footer__bottom{flex-direction:column;align-items:flex-start}
}
/* sa-responsive-net */
table th{white-space:nowrap}
figure,blockquote,dl,dd,fieldset{margin:0}
/* sa-logo-fit */
.der-logo__img{object-fit:contain}
/* sa-ph-media */
.der-page-header:has(.der-hero__img){position:relative;overflow:hidden;isolation:isolate;min-height:clamp(200px,30vh,300px);display:flex;flex-direction:column;justify-content:center}
.der-page-header:has(.der-hero__img) .der-hero__img{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;margin:0;z-index:0}
.der-page-header:has(.der-hero__img)::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,12,18,.72),rgba(10,12,18,.5))}
:where(.der-page-header:has(.der-hero__img)>:not(.der-hero__img)){position:relative}
.der-page-header:has(.der-hero__img)>:not(.der-hero__img){z-index:2}
.der-page-header:has(.der-hero__img),.der-page-header:has(.der-hero__img) h1,.der-page-header:has(.der-hero__img) a,.der-page-header:has(.der-hero__img) p,.der-page-header:has(.der-hero__img) li,.der-page-header:has(.der-hero__img) span{color:#fff}
/* sa-hero-media */
.der-hero:has(>.der-hero__img){position:relative;isolation:isolate}
.der-hero:has(>.der-hero__img)>.der-hero__img{z-index:0}
.der-hero:has(>.der-hero__img)::after{z-index:1}
:where(.der-hero:has(>.der-hero__img)>:not(.der-hero__img)){position:relative}
.der-hero:has(>.der-hero__img)>:not(.der-hero__img){z-index:2}
/* sa-rhythm */
:where(.der-table-wrap){margin-block:1.5rem}
:where(main) :where(ul,ol,table,.der-table-wrap)+p{margin-block-start:1rem}
/* sa-slot-link */
.der-rtp-item,.der-rtp-item:hover,.der-rtp-item:focus{color:inherit;text-decoration:none;cursor:pointer}
/* sa-logo-chip */
.der-footer .der-logo__img{filter:none;background:transparent;padding:0}
.der-footer .der-footer__logo-chip{background:transparent;padding:0}