/* welante Kurs-Archiv/-Detail Styles – leichtgewichtig, kollisionsarm */
:root {
  --wla-bg: #D8EFF0;
  --wla-card-bg: #ffffff;
  --wla-teal: #2f847c;
  --wla-teal-2: #0aa39a;
  --wla-text: #234;
  --wla-muted: #6b8;
  --wla-border: #55A5A8;
  --wla-radius-lg: 22px;
  --wla-radius-md: 16px;
  --wla-radius-sm: 12px;
  --wla-shadow: 0 1px 0 rgba(0,0,0,.03);
}

/* Utilities */
.wla-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Wrapper */
.wla-archive{display:block;gap:32px;color:var(--wla-text);font-family:inherit}

/* Hero */
.wla-hero{display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:36px;background:var(--wla-bg);border-radius:0 70px 70px 70px;padding:75px 110px;position:relative}
.wla-hero.post-featured-img:after {top: 88px}
.wla-hero__content{max-width:640px;position:relative;padding-left:40px;padding-top:30px}
.wla-hr{display:block;position:absolute;left:0;top:0;width:137px;height:4px;border-radius:4px;background:#55A5A8}
.wla-hero__title{font-size:28px;line-height:1.25;margin:0 0 12px}
.wla-hero__text{margin:0 0 18px;opacity:.9}
.wla-btn{display:inline-block;background:#379B9F;color:#fff;text-decoration:none;padding:8px 25px;border-radius:0 30px 30px 30px;font-weight:600}
.wla-archive .wla-btn, .wla-archive .wla-btn:visited{color:#fff !important}
.wla-btn:hover{background:#235a76}
.wla-hero__media{width:428px;height:428px;border-radius:0 70px 70px 70px;overflow:hidden}
.wla-hero__media img{display:block;width:100%;height:100%;object-fit:cover}

/* Toolbar */
.wla-toolbar{display:flex;align-items:center;gap:16px;margin:100px 0}
.wla-filter-btn{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--wla-border);background:#379B9F;color:#fff;padding:10px 16px;border-radius:50px 50px 50px 0;font-weight:600}
/* Spezifität erhöhen, damit globale Button/Input-Styles nicht überschreiben */
.wla-toolbar .wla-filter-btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  border:1px solid var(--wla-border) !important;
  background:#379B9F !important;
  color:#fff !important;
  padding:10px 16px !important;
  border-radius:50px 50px 50px 0 !important;
  font-weight:600 !important;
}
.wla-filter-btn:hover{background:#235a76}
.wla-filter-btn__icon{width:22px;height:22px;background: no-repeat center / contain url('../assets/filter-icon.svg')}
.wla-search{flex:0 1 320px}
.wla-search__input{width:100%;padding:10px 14px;border-radius:50px 50px 50px 0;border:1px solid var(--wla-border);outline:none}
/* Erhöhte Spezifität, damit globale Input-Styles dieses Feld nicht übersteuern */
.wla-toolbar .wla-search input.wla-search__input[type="search"]{
  width:100% !important;
  padding:12px 14px 8px 14px !important;
  border-radius:50px 50px 50px 0 !important;
  border:1px solid var(--wla-border) !important;
  outline:none;
}
.wla-search__input::placeholder{font-size:23px;font-weight:700;color:#379B9F}
.wla-search__input:focus{border-color:var(--wla-teal)}

/* Grid */
.wla-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;position:relative}
.wla-grid::before{content:"";position:absolute;left:-45px;top:-45px;width:140px;height:4px;background:#4EACAF}

/* Card */
.wla-card{position:relative;background:var(--wla-card-bg);border:1px solid #55A5A8;border-radius:0 70px 70px 70px;padding:44px;box-shadow:var(--wla-shadow)}
.wla-pill{position:relative;display:inline-block;background:#369B9E;color:#fff;font-weight:400;font-size:23px;padding:0px 20px;border-radius:50px 50px 50px 0;margin:-10px 0 8px}
/* Detail-Variante der Pillen (abweichendes Padding und Gewicht) */
.wla-pill.wla-pill--detail{padding:4px 20px;font-weight:600}
.wla-card__title{font-size:20px;line-height:1.28;margin:6px 0 12px}
.wla-meta{list-style:none;padding:0;margin:0 0 42px;display:grid;gap:6px}
.wla-meta__item{display:flex;align-items:flex-start;gap:18px;color:#55A5A8;font-size:23px;font-weight:400}
.wla-meta__item::before{content:"";display:inline-block;flex:0 0 17px;width:17px;height:19px;background-repeat:no-repeat;background-position:center;background-size:contain;margin-top:10px}
.wla-i--date::before{background-image:url('../assets/Icon-kalender.svg')}
.wla-i--person::before{background-image:url('../assets/Icon-person.svg')}
.wla-i--location::before{background-image:url('../assets/icon-ort.svg')}
.wla-more{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#55A5A8;text-decoration:none;font-weight:700;width:100%}
/* Sicherstellen, dass Linkfarbe nicht von globalen Regeln überschrieben wird */
.wla-card .wla-more, .wla-card .wla-more:visited{color:#55A5A8 !important}
.wla-more::after{content:"";display:inline-block;width:68px;height:18px;background: no-repeat center / contain url('../assets/pfeil-welante.svg');transition:transform .2s ease}
.wla-more:hover::after{transform:translateX(3px)}

/* Responsive */
@media (max-width: 1024px){
  .wla-grid{grid-template-columns:repeat(2,1fr)}
  .wla-hero{grid-template-columns:1fr}
}
@media (max-width: 640px){
  .wla-grid{grid-template-columns:1fr}
  /* Smartphone: Hero-Padding und Bilddarstellung */
  .wla-hero{padding:20px}
    .wla-hero__title {font-size: 24px !important; line-height: 1.2 !important;}
  .wla-hero__media{width:100%; aspect-ratio:1/1; height:auto}
    .wla-hero.post-featured-img:after {top: 34px;}
    .wla-card__title{font-size:20px !important;line-height:1.28 !important}
    .wla-meta__item{gap:18px;font-size:20px !important;}
}

/* ============================= */
/* Detailseite                   */
/* ============================= */
.wla-detail{display:block}
.wla-badges{display:flex;align-items:center;gap:20px;margin:0 0 24px}
.wla-chip{display:inline-flex;align-items:center;gap:8px;background:#379B9F;color:#fff;text-decoration:none;border:1px solid var(--wla-border);padding:10px 18px;border-radius:50px 50px 50px 0;font-weight:700}
.wla-chip:hover{background:#235a76;color:#fff}

.wla-detail__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:48px}
.wla-detail__content{position:relative}
/* Dekorative Linie analog zum Grid, als ::before am Content-Container */
.wla-detail__title{color:#235a76;font-size:40px !important;line-height:1.15 !important;margin:0 0 18px;margin-top: 80px;position: relative}
.wla-detail__title::before{content:"";position:absolute;left:-45px;top:-45px;width:140px;height:4px;background:#4EACAF}
.wla-detail__text{font-size:22px;line-height:1.8;color:#235a76}
/* Unterüberschrift wird im Markup als <strong> innerhalb des Fließtexts ausgegeben */
/* Hinweis-Absatz nutzt generische Typo des Fließtexts */

/* Sidebar */
.wla-detail__aside{align-self:start}
.wla-aside{border:1px solid var(--wla-border);border-radius:0 70px 70px 70px;padding:30px;padding-bottom: 52px;position:relative}
.wla-aside__brand{border:1px solid var(--wla-border);border-radius:70px 70px 70px 0;padding:18px 24px;margin:0 0 22px;min-height:90px;display:flex;align-items:center;justify-content:center;background:#fff}
.wla-aside__brand img{max-width:100%;height:auto;display:block}
.wla-aside__list{list-style:none;margin:0;padding:0;display:grid;gap:30px}
.wla-aside__item{line-height: 1.2}
.wla-aside__label{font-weight:800;color:#55A5A8;font-size:20px;margin-bottom:4px}
.wla-aside__value{color:#55A5A8;font-size:20px}

@media (max-width:1024px){
  .wla-detail__grid{grid-template-columns:1fr}
  .wla-aside__brand{margin:-30px 0 18px}
}
@media (max-width: 640px){

}