/* Start custom CSS for text-editor, class: .elementor-element-30042c5c *//***********************
  Farben & Basissetup (Glastüren-Block)
***********************/
:root{
  --dt-bg: #ffffff;          /* Weiß */
  --dt-text: #1a1a1a;        /* Standard Text (schwarz/dunkel) */
  --dt-text-strong: #000000; /* betonter Text */
  --dt-teal: #0f6a7a;        /* Hauptfarbe Türkis */
  --dt-teal-weak: #f0fbfd;   /* sehr helles Türkis (Flächen) */
  --dt-yellow: #ffd800;      /* Akzent Gelb */
  --dt-yellow-weak: #fff9cc; /* sehr helles Gelb (Hover/Highlight) */
  --dt-border: #e9e9e9;      /* zarte Linie */
}

/* Container & Typografie */
.seo-duschtueren{
  background: var(--dt-bg);
  color: var(--dt-text);
  font-size: 16px;
  line-height: 1.6;
  border-top: 1px solid var(--dt-border);
  padding: clamp(20px, 3vw, 36px) 0;
}
.seo-dt__container{
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 clamp(16px, 2vw, 20px);
}
.seo-dt__title{
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.25;
  margin: 0 0 8px;
  letter-spacing: .2px;
  color: var(--dt-text-strong);
}
.seo-dt__lead{
  font-size: 17px;
  color: #2a2a2a;
  margin: 0 0 14px;
}

/* Links (Default: Türkis) */
.seo-duschtueren a{
  color: var(--dt-teal);
  text-decoration: none;
}
.seo-duschtueren a:hover,
.seo-duschtueren a:focus{
  text-decoration: underline;
}

/* Inhaltsverzeichnis */
.seo-dt__toc ul{
  display:flex; flex-wrap:wrap; gap:8px 16px;
  padding:0; margin:6px 0 18px; list-style:none;
}
.seo-dt__toc a{
  display:inline-block;
  padding:6px 10px;
  border:1px solid var(--dt-border);
  border-radius:8px;
  background: var(--dt-bg);     /* Weiß */
  color: var(--dt-teal);        /* Türkis-Schrift */
  font-size:14px; text-decoration:none;
}
.seo-dt__toc a:hover{ background: var(--dt-teal-weak); }

/* Sektionen & Headings */
.seo-dt__section{ margin:22px 0; }
.seo-dt__section h3{
  font-size: clamp(18px, 2.2vw, 22px);
  margin: 0 0 10px;
  color: var(--dt-text-strong);
}
.seo-dt__section h4{
  font-size:16px; margin:0 0 6px; color: var(--dt-text-strong);
}

/* Grid-Karten */
.seo-dt__grid{
  display:grid; grid-template-columns:1fr; gap:12px;
}
@media (min-width:720px){
  .seo-dt__grid{ grid-template-columns:repeat(3,1fr); }
}
.seo-dt__card{
  border:1px solid var(--dt-border);
  border-radius:12px;
  padding:14px;
  background:#fafafa;          /* Weißer Stil, dunkle Schrift */
  color: var(--dt-text);
}

/* Listen */
.seo-dt__list{ margin:10px 0; padding-left:18px; }
.seo-dt__list li{ margin:6px 0; }

/* Tabelle */
.seo-dt__tablewrap{
  overflow-x:auto;
  border:1px solid var(--dt-border);
  border-radius:10px;
  background: var(--dt-bg);    /* Weiß */
}
.seo-dt__table{
  width:100%;
  border-collapse:collapse;
  font-size:15px;
  min-width:560px;
}
/* Header: TÜRKIS + WEISSE SCHRIFT */
.seo-dt__table thead th{
  background: var(--dt-teal);
  color:#ffffff;               /* Weiß */
  font-weight:700;
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:.5px;
  padding:12px;
}
.seo-dt__table th,
.seo-dt__table td{
  padding:10px 12px;
  border-bottom:1px solid #f0f0f0;
  text-align:left;
  color: var(--dt-text);       /* Schwarz/Dunkel */
  background:#fff;             /* Weiße Zellen */
}
/* Zebra + Hover (helles Türkis / helles Gelb) */
.seo-dt__table tbody tr:nth-child(even){ background: var(--dt-teal-weak); }
.seo-dt__table tbody tr:hover{
  background: var(--dt-yellow-weak);   /* Gelblicher Hover */
  transition: background .2s ease-in-out;
}
.seo-dt__table tbody tr:hover a{ color:#000; } /* Gelb = schwarze Schrift */

/* Interne Linkliste (Kacheln) */
.seo-dt__links{
  display:grid; grid-template-columns:1fr; gap:8px; margin-top:8px;
}
@media (min-width:640px){
  .seo-dt__links{ grid-template-columns:repeat(2,1fr); }
}
.seo-dt__plink{
  display:block;
  padding:10px 12px;
  background: var(--dt-teal-weak);     /* sehr helles Türkis */
  border:1px solid var(--dt-border);
  border-radius:10px;
  color: var(--dt-teal);               /* Türkis-Schrift */
  text-decoration:none;
  font-weight:600;
}
.seo-dt__plink:hover{
  background: var(--dt-yellow-weak);   /* Gelb-Hover */
  color: var(--dt-text-strong);        /* Schwarz auf Gelb */
}

/* FAQ (Details) */
.seo-dt__faq details{
  border:1px solid var(--dt-border);
  border-radius:10px;
  padding:10px 12px;
  background:#fff;
  margin:8px 0;
}
.seo-dt__faq summary{
  cursor:pointer; font-weight:700; list-style:none;
  color: var(--dt-teal);               /* Türkise Überschrift */
}
.seo-dt__faq summary::-webkit-details-marker{ display:none; }
.seo-dt__answer{ margin-top:8px; color: var(--dt-text); }

/* CTA */
.seo-dt__cta{
  border-top:1px dashed var(--dt-border);
  margin-top:20px; padding-top:14px;
  color:#2b2b2b;
}

/* Buttons (Utility) */
/* Türkis: Hintergrund türkis, Schrift weiß */
.seo-dt__btn--teal{
  display:inline-block; padding:10px 14px;
  background: var(--dt-teal); color:#fff;
  border:1px solid var(--dt-teal);
  border-radius:10px; font-weight:700; text-decoration:none;
}
.seo-dt__btn--teal:hover{ filter:brightness(1.08); }

/* Gelb: Hintergrund gelb, Schrift schwarz */
.seo-dt__btn--yellow{
  display:inline-block; padding:10px 14px;
  background: var(--dt-yellow); color:#000;
  border:1px solid #e0c100;
  border-radius:10px; font-weight:800; text-decoration:none;
}
.seo-dt__btn--yellow:hover{ background:#ffe34d; }

/* Weiß: Hintergrund weiß, Schrift schwarz, türkiser Rand */
.seo-dt__btn--white{
  display:inline-block; padding:10px 14px;
  background:#ffffff; color:#000;
  border:1px solid var(--dt-teal);
  border-radius:10px; font-weight:700; text-decoration:none;
}
.seo-dt__btn--white:hover{ background: var(--dt-teal-weak); }

/* Badges/Tags */
.seo-dt__badge--teal   { background: var(--dt-teal);   color:#fff;    border-radius:8px; padding:4px 8px; }
.seo-dt__badge--yellow { background: var(--dt-yellow); color:#000000; border-radius:8px; padding:4px 8px; }
.seo-dt__badge--white  { background:#fff;              color:#000;    border:1px solid var(--dt-teal); border-radius:8px; padding:4px 8px; }

/* Fokus / Accessibility */
.seo-dt__card:focus-within,
.seo-dt__plink:focus,
.seo-dt__toc a:focus,
.seo-duschtueren a:focus,
.seo-dt__btn--teal:focus,
.seo-dt__btn--yellow:focus,
.seo-dt__btn--white:focus{
  outline: 3px solid var(--dt-yellow);   /* Gelber Fokus-Ring */
  outline-offset: 2px;
}/* End custom CSS */