/* =========================================================
   ANGEBOTE LISTE / SHORTCODE (Boxen)
   ========================================================= */
.tw-offers{ margin:24px 0; }
.tw-offers__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:22px;
  align-items:stretch;
}

.tw-offer{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 10px 40px rgba(0,0,0,.08);
  transition: transform .25s ease, box-shadow .25s ease;
}
.tw-offer:hover{
  transform: translateY(-8px);
  box-shadow: 0 25px 60px rgba(0,0,0,.12);
}

.tw-offer__badge{
  position:absolute;
  top:12px; left:12px;
  z-index:2;
  padding:7px 12px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:800;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.08);
  backdrop-filter: blur(6px);
}
.tw-offer__tag{
  position:absolute;
  top:12px; right:12px;
  z-index:2;
  padding:7px 12px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:900;
  background:#1e9e57;
  color:#fff;
  border:1px solid #168347;
  box-shadow:0 6px 18px rgba(30,158,87,.35);
}
.tw-offer:hover .tw-offer__tag{ box-shadow:0 10px 30px rgba(30,158,87,.5); }

.tw-offer__media{
  display:block;
  height:170px;
  background:rgba(0,0,0,.04);
  overflow:hidden;
}
.tw-offer__img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform: translateZ(0);
  transition: transform .4s ease;
}
.tw-offer:hover .tw-offer__img{ transform: scale(1.08); }

.tw-offer__name{
  padding:14px 16px 8px;
  margin:0;
  font-size:1.02rem;
  line-height:1.25;
  font-weight:800;
}
.tw-offer__name a{ text-decoration:none; }

.tw-offer__chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:0 16px 12px;
}
.tw-chip{
  font-size:.82rem;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.05);
  border:1px solid rgba(0,0,0,.06);
  opacity:.92;
  display:inline-flex;
  gap:6px;
  align-items:center;
}

.tw-offer__meta{
  padding:0 16px 12px;
  display:flex;
  align-items:baseline;
  gap:10px;
}
.tw-offer__from{ font-size:.9rem; opacity:.6; }
.tw-offer__price{
  font-size:1.8rem;
  font-weight:900;
  letter-spacing:-.02em;
}

.tw-offer__cta{
  padding:12px 16px 18px;
  display:flex;
  gap:10px;
}
.tw-btn{
  flex:1;
  padding:12px 14px;
  border-radius:14px;
  font-weight:900;
  text-decoration:none;
  border:1px solid rgba(0,0,0,.10);
  display:flex;
  justify-content:center;
  align-items:center;
  line-height:1.1;
  min-height:48px;
}
.tw-btn--ghost{ background:#f3f4f6; }
.tw-btn--solid{ background:#111; color:#fff; border-color:#111; }
.tw-btn--disabled{ background:#eee; color:#888; border-color:#ddd; cursor:not-allowed; }

@media (max-width: 480px){
  .tw-offers__grid{ grid-template-columns:1fr; }
  .tw-offer__media{ height:190px; }
  .tw-offer__price{ font-size:1.65rem; }
}

/* =========================================================
   DETAILSEITE (single-angebote.php)
   ========================================================= */
.tw-detail{ max-width:1100px; margin:0 auto; padding:24px 16px; }

.tw-breadcrumbs{
  font-size:.95rem;
  opacity:.8;
  margin:0 0 12px;
}
.tw-breadcrumbs a{ text-decoration:none; }

.tw-hero{ display:grid; grid-template-columns: 1.1fr .9fr; gap:22px; align-items:start; }
@media (max-width: 900px){ .tw-hero{ grid-template-columns: 1fr; } }

.tw-hero__media{ position:relative; border-radius:22px; overflow:hidden; background:rgba(0,0,0,.04); }
.tw-hero__img{ width:100%; height:360px; object-fit:cover; display:block; }
.tw-hero__img--placeholder{ height:360px; }
@media (max-width: 900px){ .tw-hero__img, .tw-hero__img--placeholder{ height:260px; } }

.tw-hero__badges{ position:absolute; top:12px; left:12px; right:12px; display:flex; justify-content:space-between; gap:10px; }
.tw-badge{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.08);
  padding:7px 12px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:800;
  backdrop-filter: blur(6px);
}
.tw-tag{
  background:#1e9e57;
  border:1px solid #168347;
  color:#fff;
  padding:7px 12px;
  border-radius:999px;
  font-size:.82rem;
  font-weight:900;
  box-shadow:0 6px 18px rgba(30,158,87,.35);
}

.tw-hero__title{ margin:4px 0 10px; font-size:2rem; line-height:1.12; }
@media (max-width: 900px){ .tw-hero__title{ font-size:1.6rem; } }

.tw-hero__sub{ display:flex; flex-wrap:wrap; gap:10px; opacity:.85; }
.tw-subitem{ background:rgba(0,0,0,.04); border:1px solid rgba(0,0,0,.06); border-radius:999px; padding:6px 10px; font-size:.9rem; }

.tw-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }

.tw-detail__grid{ display:grid; grid-template-columns: 1fr 340px; gap:22px; margin-top:22px; }
@media (max-width: 1000px){ .tw-detail__grid{ grid-template-columns:1fr; } }

.tw-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:22px;
  box-shadow:0 10px 40px rgba(0,0,0,.08);
  padding:18px 18px;
  margin-bottom:18px;
}

.tw-h2{ margin:0 0 12px; font-size:1.2rem; }
.tw-prose{ line-height:1.6; }
.tw-prose h3{ margin-top:14px; }
.tw-list{ margin:0; padding-left:18px; }
.tw-note{ margin-top:12px; padding:12px 12px; border-radius:14px; background:rgba(0,0,0,.04); border:1px solid rgba(0,0,0,.06); font-size:.92rem; opacity:.9; }

/* Sticky CTA */
.tw-sticky{
  position:sticky;
  top:18px;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:22px;
  box-shadow:0 10px 40px rgba(0,0,0,.08);
  padding:16px 16px;
}
.tw-sticky__price{ display:flex; align-items:baseline; gap:10px; margin-bottom:10px; }
.tw-sticky__label{ opacity:.6; }
.tw-sticky__value{ font-size:1.9rem; font-weight:900; letter-spacing:-.02em; }
.tw-pp{ font-size:.95rem; opacity:.65; font-weight:800; margin-left:6px; }
.tw-sticky__chips{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 14px; }

.tw-cta{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:14px 14px;
  border-radius:14px;
  font-weight:900;
  text-decoration:none;
  background:#111;
  color:#fff;
  border:1px solid #111;
}
.tw-sticky__fineprint{ margin-top:10px; font-size:.88rem; opacity:.65; }

/* Similar */
.tw-similar__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;
}
@media (max-width: 900px){ .tw-similar__grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px){ .tw-similar__grid{ grid-template-columns: 1fr; } }

.tw-similar{
  display:block;
  text-decoration:none;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.06);
  background:rgba(255,255,255,.95);
}
.tw-similar__media{ display:block; height:110px; background:rgba(0,0,0,.04); overflow:hidden; }
.tw-similar__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.tw-similar__title{ display:block; padding:10px 10px 0; font-weight:800; font-size:.95rem; line-height:1.2; }
.tw-similar__price{ display:block; padding:6px 10px 10px; font-weight:900; opacity:.9; }

/* Unterkategorien / Term-Boxen */
.tw-terms{ margin: 18px 0 26px; }
.tw-terms__head{ margin: 0 0 12px; }
.tw-terms__title{ font-size: 1.35rem; margin: 0; }

.tw-terms__grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
}

.tw-term{
  display:block;
  text-decoration:none;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  padding:14px 14px;
  box-shadow:0 10px 35px rgba(0,0,0,.07);
  transition: transform .2s ease, box-shadow .2s ease;
}
.tw-term:hover{
  transform: translateY(-4px);
  box-shadow:0 20px 55px rgba(0,0,0,.12);
}

.tw-term__name{
  display:block;
  font-weight:900;
  font-size:1rem;
  line-height:1.2;
}
.tw-term__count{
  display:block;
  margin-top:8px;
  opacity:.7;
  font-weight:700;
  font-size:.9rem;
}

.tw-pricehint{
  font-size:.9rem;
  opacity:.65;
  font-weight:800;
  margin-left:6px;
  white-space:nowrap;
}

/* STARTSEITEN-BOX: Preis + Währung in 1 Zeile, "für 2 Personen" darunter */
.tw-offer__meta{
  padding:0 16px 12px; /* FIX ergänzt */
  display:flex;
  align-items:flex-end;
  gap:10px;
}

.tw-offer__from{
  opacity:.7;
  font-weight:700;
}

.tw-offer__price{
  display:inline-flex;
  align-items:baseline;
  gap:8px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}

.tw-offer__price .tw-price-number{
  font-size:2rem;
}

.tw-offer__price .tw-price-currency{
  font-size:1.1rem;
  opacity:.9;
  font-weight:900;
}

.tw-pricehint{
  display:block;
  margin-top:10px;
  font-size:.95rem;
  opacity:.65;
  font-weight:800;
}

/* Pagination (WP paginate_links type="list") sauber machen */
.tw-detail .page-numbers,
.tw-card .page-numbers{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  gap:10px !important;
  align-items:center !important;
}

.tw-detail .page-numbers li,
.tw-card .page-numbers li{
  margin:0 !important;
  padding:0 !important;
}

.tw-detail .page-numbers a,
.tw-detail .page-numbers span,
.tw-card .page-numbers a,
.tw-card .page-numbers span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:40px !important;
  height:40px !important;
  padding:0 12px !important;
  border-radius:12px !important;
  border:1px solid rgba(0,0,0,.10) !important;
  background:#fff !important;
  text-decoration:none !important;
  font-weight:900 !important;
  line-height:1 !important;
}

.tw-detail .page-numbers .current,
.tw-card .page-numbers .current{
  background:#111 !important;
  color:#fff !important;
  border-color:#111 !important;
}

.tw-detail .page-numbers .next,
.tw-detail .page-numbers .prev,
.tw-card .page-numbers .next,
.tw-card .page-numbers .prev{
  min-width:auto !important;
  padding:0 14px !important;
}

.tw-detail ul.page-numbers{ list-style:none !important; }

:root{
  --tw-hero-bg: url("HIER-DEIN-BILD-URL"); /* FIX: war --tw-hero-img */
  --tw-hero-dark: #0b1220;
  --tw-hero-accent: #ff4d6d;
}

/* Global Header Hero – mobilfreundlich */
.tw-global-hero{
  position: relative;
  width: 100%;
  height: 420px;
  background-image: var(--tw-hero-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

/* dunkler Verlauf für Lesbarkeit */
.tw-global-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.25));
}

.tw-global-hero__inner{
  position:relative;
  z-index:2;
  max-width:1100px;
  padding:20px;
}

.tw-global-hero__title{
  color:#fff;
  font-size: clamp(32px,4vw,60px);
  font-weight:900;
  letter-spacing:-1px;
  margin-bottom:10px;
}

.tw-global-hero__tagline{
  color:#fff;
  font-weight:600;
  font-size: clamp(16px,2vw,20px);
  opacity:.95;
}

/* Mobile */
@media(max-width:768px){
  .tw-global-hero{
    height:260px;
  }
}

/* ===== Theme Header Image AUS (safe) ===== */
.custom-header,
.header-image,
.header-img,
.wp-custom-header,
.wp-custom-header img,
.custom-header-media,
.custom-header-media img {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* ===== Page/Archive Header AUS (ok) ===== */
.page-header,
.archive-header,
.blogus-page-header,
.blogtimes-page-header {
  display: none !important;
}

/* WICHTIG: NICHT global ausblenden! */
/* .entry-header { display:none !important; }  <-- rauslassen */

/* HERO */
.tw-hero{
  position: relative;
  width: 100%;
  min-height: 420px;
  background-image: var(--tw-hero-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 20px 0;
}

.tw-hero__overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(11,18,32,.62), rgba(11,18,32,.28));
}

.tw-hero__inner{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1100px;
  padding: 0 16px;
}

.tw-hero__content{
  text-align:center;
  color:#fff;
}

.tw-hero__title{
  margin: 0 0 10px;
  font-weight: 900;
  letter-spacing: -1px;
  line-height: 1.05;
  font-size: clamp(30px, 4vw, 62px);
  text-shadow: 0 14px 34px rgba(0,0,0,.25);
}

.tw-hero__tagline{
  margin: 0 0 18px;
  font-weight: 700;
  opacity: .95;
  font-size: clamp(14px, 1.6vw, 20px);
}

/* Suche */
.tw-hero__search{
  margin: 0 auto;
  max-width: 820px;
  display:flex;
  gap: 10px;
  padding: 10px;
  border-radius: 18px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
}

.tw-hero__search input{
  flex: 1;
  min-width: 220px;
  padding: 14px 14px;
  border-radius: 14px;
  border: none;
  outline: none;
}

.tw-hero__search select{
  padding: 14px 12px;
  border-radius: 14px;
  border: none;
  outline: none;
  min-width: 160px;
}

.tw-hero__search button{
  padding: 14px 18px;
  border-radius: 14px;
  border: none;
  font-weight: 900;
  cursor: pointer;
  background: #ff4d6d;
  color: #fff;
}

.tw-hero__hint{
  margin-top: 12px;
  font-size: 13px;
  opacity: .9;
}

/* Screenreader only */
.tw-sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* Mobile */
@media (max-width: 820px){
  .tw-hero{ min-height: 320px; }
  .tw-hero__search{
    flex-direction: column;
    gap: 10px;
  }
  .tw-hero__search input,
  .tw-hero__search select,
  .tw-hero__search button{
    width: 100%;
  }
}

/* ===== Theme-Headerbanner / Header Image AUS ===== */

.custom-header,
.header-image,
.header-img,
.wp-custom-header,
.wp-custom-header img,
.custom-header-media,
.custom-header-media img {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

.page-header,
.archive-header,
.blogus-page-header,
.entry-header,
.site-title-wrap,
.header-title,
.header-title-wrapper,
.hero-header,
.site-header .page-header {
  display: none !important;
  height: auto;
}

.site-header {
  background-image: none !important;
}

.tw-hero{
  position:relative;
  width:100%;
  height:420px;
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.tw-hero__overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,.25));
}

.tw-hero__inner{
  position:relative;
  z-index:2;
  color:#fff;
  max-width:1000px;
  padding:20px;
}

.tw-hero__title{
  font-size:clamp(32px,4vw,60px);
  font-weight:900;
}

.tw-hero__search{
  margin-top:15px;
  display:flex;
  gap:10px;
  justify-content:center;
}

.tw-hero__search input{
  padding:12px;
  border-radius:10px;
  border:none;
  min-width:260px;
}

.tw-hero__search button{
  padding:12px 18px;
  border-radius:10px;
  border:none;
  background:#ff4d6d;
  color:#fff;
  font-weight:900;
}

.tw-hero{position:relative;width:100%;min-height:320px;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;text-align:center;padding:22px 0}
.tw-hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,18,32,.62),rgba(11,18,32,.28))}
.tw-hero__inner{position:relative;z-index:2;width:100%;max-width:1100px;padding:0 16px}
.tw-hero__content{color:#fff}
.tw-hero__title{margin:0 0 10px;font-weight:900;font-size:clamp(28px,4vw,60px);line-height:1.05}
.tw-hero__tagline{margin:0 0 16px;font-weight:700;opacity:.95}
.tw-hero__search{margin:0 auto;max-width:820px;display:flex;gap:10px;padding:10px;border-radius:18px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(10px)}
.tw-hero__search input{flex:1;min-width:220px;padding:14px;border-radius:14px;border:none;outline:none}
.tw-hero__search select{padding:14px 12px;border-radius:14px;border:none;outline:none;min-width:160px}
.tw-hero__search button{padding:14px 18px;border-radius:14px;border:none;font-weight:900;background:#ff4d6d;color:#fff;cursor:pointer}
@media(max-width:820px){.tw-hero{min-height:260px}.tw-hero__search{flex-direction:column}.tw-hero__search input,.tw-hero__search select,.tw-hero__search button{width:100%}}

/* Autocomplete Fix – Text dunkel auf weißem Dropdown */
.tw-ac__list {
  background: #ffffff;
  color: #111;
}

.tw-ac__item {
  color: #111;
}

.tw-ac__main {
  color: #111;
  font-weight: 500;
}

.tw-ac__type {
  color: #666;
}

.tw-ac__item:hover,
.tw-ac__item.is-active {
  background: #f2f2f2;
}

.tw-box{ margin:22px 0; }
.tw-box__title{ margin:0 0 8px; font-size:1.35rem; font-weight:900; }
.tw-box__intro{ opacity:.9; line-height:1.6; margin-bottom:10px; }
.tw-box__cta{ margin: 10px 0 14px; }

.tw-live-search{
  margin-top:18px;
  padding:14px;
  border-radius:16px;
  background:rgba(255,77,109,.08);
  border:1px solid rgba(255,77,109,.25);
  text-align:center;
}

.tw-live-search p{
  margin:0 0 8px;
  font-size:.95rem;
  line-height:1.4;
}

.tw-live-btn{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  padding:12px 16px;
  border-radius:14px;
  font-weight:900;
  text-decoration:none;
  background:#ff4d6d;
  color:#fff;
  transition:.2s ease;
}

.tw-live-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(0,0,0,.15);
}

/* Live-Suche Hinweis (Sidebar auf Detailseite) */









/* =========================================================
   TW CLEAN PREMIUM (Override) – ganz unten einfügen
   Ziel: konsistent, schnell, sauber
   ========================================================= */

/* Basis */
:root{
  --tw-bg: #f6f7fb;
  --tw-card: #ffffff;
  --tw-text: #0f172a;
  --tw-muted:#475569;
  --tw-border: rgba(15,23,42,.10);
  --tw-shadow: 0 18px 55px rgba(2,6,23,.10);
  --tw-shadow-hover: 0 30px 90px rgba(2,6,23,.16);
  --tw-accent: #ff4d6d;
}

body{ background: var(--tw-bg); color: var(--tw-text); }
a{ color: inherit; }
.tw-card, .tw-offer, .tw-sticky{
  background: var(--tw-card);
  border: 1px solid var(--tw-border);
  box-shadow: var(--tw-shadow);
}

/* Headings/Text besser */
.tw-h2{ color: var(--tw-text); }
.tw-prose, .tw-note, .tw-breadcrumbs, .tw-subitem{ color: var(--tw-muted); }
.tw-breadcrumbs a{ color: var(--tw-text); }

/* HERO: eine klare Definition (überschreibt doppelte Regeln) */
.tw-hero{
  position:relative;
  width:100%;
  min-height: 460px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background-size:cover;
  background-position:center;
  border-radius: 0 0 36px 36px;
  overflow:hidden;
}
@media (max-width: 820px){ .tw-hero{ min-height: 320px; } }

.tw-hero__overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(2,6,23,.72), rgba(2,6,23,.35));
}
.tw-hero__content{ color:#fff; }
.tw-hero__title{
  margin:0 0 10px;
  font-weight: 950;
  letter-spacing: -1px;
  line-height: 1.05;
  font-size: clamp(34px, 5vw, 72px);
  text-shadow: 0 24px 60px rgba(0,0,0,.45);
}
.tw-hero__tagline{
  margin:0 0 18px;
  font-weight: 750;
  opacity: .96;
  font-size: clamp(15px, 1.7vw, 22px);
}

/* Suchbox im Hero */
.tw-hero__search{
  margin: 0 auto;
  max-width: 860px;
  display:flex;
  gap:10px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 55px rgba(0,0,0,.18);
}
.tw-hero__search input{
  flex:1;
  min-width: 220px;
  padding: 14px 14px;
  border-radius: 14px;
  border: none;
  outline: none;
  color: #111;
}
.tw-hero__search input::placeholder{ color: rgba(0,0,0,.55); }
.tw-hero__search button{
  padding: 14px 18px;
  border-radius: 14px;
  border: none;
  font-weight: 950;
  cursor: pointer;
  background: var(--tw-accent);
  color: #fff;
  box-shadow: 0 12px 30px rgba(255,77,109,.35);
}
@media (max-width: 820px){
  .tw-hero__search{ flex-direction:column; }
  .tw-hero__search input, .tw-hero__search button{ width:100%; }
}

/* Angebots-GRID: gleichmäßiger, ruhiger */
.tw-offers__grid{
  gap: 18px;
}
.tw-offer{
  border-radius: 22px;
  overflow:hidden;
  transition: transform .28s ease, box-shadow .28s ease;
}
.tw-offer:hover{
  transform: translateY(-8px);
  box-shadow: var(--tw-shadow-hover);
}
.tw-offer__media{ height: 210px; background: rgba(2,6,23,.04); }
.tw-offer__name{
  padding: 16px 16px 10px;
  margin:0;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.25;
  color: var(--tw-text);
}
.tw-offer__name a{ color: var(--tw-text); }

/* Wichtig: Textfarbe auf weiß erzwingen (gegen „weiß auf weiß“) */
.tw-offer, .tw-offer *{ color: var(--tw-text); }
.tw-offer__from{ color: rgba(15,23,42,.65) !important; }

.tw-offer__price .tw-price-number{ font-size: 2.15rem; }
.tw-pricehint{ color: rgba(15,23,42,.65) !important; }

/* Tag oben rechts */
.tw-offer__tag{
  background: #0b1220;
  border-color: rgba(255,255,255,.15);
  box-shadow: 0 10px 25px rgba(2,6,23,.25);
}

/* Buttons sauber & modern */
.tw-btn{
  border: 1px solid rgba(15,23,42,.10);
}
.tw-btn--ghost{
  background: #f1f5f9;
  color: var(--tw-text) !important;
  border-color: rgba(15,23,42,.08);
}
.tw-btn--solid, .tw-cta, .tw-live-btn{
  background: linear-gradient(135deg, #ff4d6d, #ff2e63);
  border: none;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(255,77,109,.35);
}
.tw-btn--solid:hover, .tw-cta:hover, .tw-live-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 20px 45px rgba(255,77,109,.45);
}

/* Sidebar/Sticky schöner */
.tw-sticky{
  border-radius: 22px;
}
.tw-sticky__label{ color: rgba(15,23,42,.65); }
.tw-sticky__fineprint{ color: rgba(15,23,42,.65); }

/* Term-Boxen (Stadt/Region/Land) */
.tw-term{
  border-radius: 18px;
  transition: transform .22s ease, box-shadow .22s ease;
}
.tw-term:hover{
  transform: translateY(-5px);
  box-shadow: var(--tw-shadow-hover);
}
.tw-term__name{ color: var(--tw-text); font-weight: 950; }
.tw-term__count{ color: rgba(15,23,42,.65); }

/* Autocomplete Dropdown (falls vorhanden) */
.tw-ac__list{ background:#fff; color:#111; border:1px solid rgba(0,0,0,.10); }
.tw-ac__item{ color:#111; }
.tw-ac__type{ color:#64748b; }
.tw-ac__item:hover, .tw-ac__item.is-active{ background:#f1f5f9; }

/* =========================================================
   FEINSCHLIFF – Premium Finish (unten einfügen)
   ========================================================= */

/* 1) Mehr „oben Luft“, weniger gequetscht */
.tw-detail{ max-width: 1180px; }
.tw-detail__grid{ margin-top: 26px; }
.tw-card{ padding: 20px 20px; }

/* 2) Hero: dezenter Glanz + bessere Lesbarkeit */
.tw-hero{
  position: relative;
  isolation: isolate;
}
.tw-hero::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:1;
  background: radial-gradient(80% 60% at 50% 10%, rgba(255,255,255,.12), rgba(255,255,255,0) 55%);
  pointer-events:none;
}
.tw-hero__overlay{ z-index: 0; }
.tw-hero__inner{ z-index: 2; }

/* 3) Überschriften: „edel“ und klar */
.tw-h2{
  font-weight: 950;
  letter-spacing: -.3px;
}
.tw-hero__title{
  letter-spacing: -1.2px;
}
.tw-hero__tagline{
  max-width: 780px;
  margin-left:auto;
  margin-right:auto;
}

/* 4) Suchbox: stärker wie „App“ */
.tw-hero__search{
  border-radius: 20px;
  padding: 12px;
}
.tw-hero__search input{
  background: rgba(255,255,255,.96);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06);
}
.tw-hero__search button{
  min-height: 52px;
}

/* 5) Angebotskarten: ruhiger, moderner (Details) */
.tw-offer__name{
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: 2.6em; /* 2 Zeilen Höhe stabil */
}
.tw-offer__meta{
  padding: 0 16px 10px;
}
.tw-offer__cta{
  padding: 12px 16px 18px;
}
.tw-offer__media{
  position:relative;
}
.tw-offer__media::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.10));
  pointer-events:none;
}

/* 6) Preis wirkt „wichtiger“ */
.tw-offer__price .tw-price-number{
  letter-spacing: -0.6px;
}
.tw-offer__price .tw-price-currency{
  opacity:.9;
}

/* 7) Buttons: gleich breit & nicer hover */
.tw-btn{
  min-height: 50px;
}
.tw-btn--ghost:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(2,6,23,.10);
}

/* 8) Sidebar: Sticky-Abstände schöner */
.tw-sticky{
  padding: 18px 18px;
}
.tw-sticky__chips{
  margin-top: 10px;
}

/* 9) Breadcrumbs: weniger „grau“, besser lesbar */
.tw-breadcrumbs{
  opacity: 1;
  color: rgba(15,23,42,.70);
}
.tw-breadcrumbs a{
  color: rgba(15,23,42,.92);
}
.tw-breadcrumbs a:hover{
  text-decoration: underline;
}

/* 10) Kategorien (Term-Boxen): schöner Count */
.tw-term__count{
  font-weight: 800;
}

/* 11) Mobile: weniger Gedränge, bessere Click-Flächen */
@media (max-width: 520px){
  .tw-card{ padding: 16px; }
  .tw-offer__media{ height: 200px; }
  .tw-offer__price .tw-price-number{ font-size: 2rem; }
  .tw-sticky{ padding: 16px; }
  .tw-hero__title{ font-size: clamp(30px, 9vw, 52px); }
}

/* 12) Kleines „Polish“ für FAQ/Details Elemente (falls genutzt) */
details.tw-seo__qa{
  border-radius: 14px;
}
details.tw-seo__qa[open]{
  box-shadow: 0 14px 40px rgba(2,6,23,.10);
}

/* =========================================================
   BLOGTIMES – Feinschliff Override (unten einfügen)
   ========================================================= */

/* 1) Theme-Container: Breite & Luft sauber */
body .container,
body .site-content .container,
body .content-area,
body .site-main{
  max-width: 1180px;
}
@media (max-width: 1200px){
  body .container,
  body .site-content .container{
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* 2) Blogtimes setzt oft Linkfarben – wir halten TW-Komponenten clean */
.tw-detail, .tw-offers, .tw-terms, .tw-box, .tw-sticky{
  color: #0f172a;
}
.tw-detail a,
.tw-offer a,
.tw-term a,
.tw-similar a{
  color: inherit;
}

/* 3) Blogtimes Header/Title-Bereiche: doppelte Header vermeiden (falls noch aktiv) */
.page-header,
.archive-header,
.entry-header,
.blogtimes-page-header,
.site-header .page-header{
  display:none !important;
}

/* 4) HERO: Blogtimes hat manchmal padding/margins oben → neutralisieren */
.tw-hero{
  margin-top: 0 !important;
  border-radius: 0 0 36px 36px;
  overflow: hidden;
}

/* Falls Blogtimes einen Hintergrund/Overlay darüber legt */
.site-header,
.site-branding,
.header-image,
.custom-header,
.wp-custom-header{
  background: transparent !important;
}

/* 5) Hauptinhalt nicht zu weit oben kleben */
.tw-detail{
  margin-top: 18px;
}

/* 6) Buttons: Theme-Button Styles ausschalten für unsere Buttons */
.tw-btn, .tw-cta, .tw-live-btn{
  font-family: inherit;
  text-transform: none;
  letter-spacing: 0;
}
.tw-btn:focus,
.tw-cta:focus,
.tw-live-btn:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(255,77,109,.20);
}

/* 7) Überschriften: Blogtimes macht oft dünner → härter */
.tw-hero__title,
.tw-offer__name,
.tw-h2{
  font-weight: 950 !important;
}

/* 8) Karten: Theme-Ränder/Schatten überschreiben */
.tw-card, .tw-offer, .tw-sticky, .tw-term{
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 18px 55px rgba(2,6,23,.10) !important;
}

/* 9) Search Results / Archive Text-Farbe Fix (gegen „weiß auf weiß“) */
.tw-offer, .tw-offer *{
  color: #0f172a !important;
}
.tw-offer__tag{ color:#fff !important; }

/* 10) Blogtimes Content-Spacing: Listen/Absätze in Cards schöner */
.tw-card p{ margin: 0 0 10px; }
.tw-card p:last-child{ margin-bottom:0; }
.tw-card ul{ margin: 10px 0 0; }

/* 11) Sticky Sidebar Abstand (Theme kann zu eng sein) */
.tw-detail__aside{ margin-top: 0; }
@media (max-width: 1000px){
  .tw-sticky{ position: relative; top:auto; }
}

/* 12) Pagination: Blogtimes überschreibt gerne */
.tw-card .page-numbers a,
.tw-card .page-numbers span{
  background:#fff !important;
  color:#0f172a !important;
}
.tw-card .page-numbers .current{
  background:#111 !important;
  color:#fff !important;
}

/* ===============================
   GLOBAL PREMIUM LOOK
================================ */

body{
  background:#f6f8fb;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  color:#1a1a1a;
}

.tw-detail,
.tw-offers,
.tw-terms{
  max-width:1280px;
  margin:0 auto;
}

/* ===============================
   SECTION CONTAINER STYLE
================================ */

.tw-card{
  background:#ffffff;
  border-radius:24px;
  box-shadow:0 15px 40px rgba(0,0,0,.05);
  padding:28px;
  border:1px solid rgba(0,0,0,.04);
  margin-bottom:28px;
}

/* ===============================
   HERO OPTIMIERUNG
================================ */

.tw-hero{
  border-bottom-left-radius:40px;
  border-bottom-right-radius:40px;
  overflow:hidden;
}

.tw-hero__title{
  font-weight:900;
  letter-spacing:-1px;
}

/* ===============================
   GRID ABSTÄNDE BESSER
================================ */

.tw-offers__grid{
  gap:28px;
}

/* ===============================
   ANGEBOTSKARTEN PREMIUM
================================ */

.tw-offer{
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 30px rgba(0,0,0,.06);
  transition:all .3s ease;
}

.tw-offer:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 50px rgba(0,0,0,.12);
}

.tw-offer__name{
  font-size:1.1rem;
  font-weight:800;
}

.tw-offer__price .tw-price-number{
  font-size:2.2rem;
}

/* ===============================
   BUTTON MODERNISIERUNG
================================ */

.tw-btn--solid,
.tw-cta{
  background:linear-gradient(135deg,#ff4d6d,#ff6f91);
  border:none;
  box-shadow:0 10px 25px rgba(255,77,109,.3);
  transition:all .3s ease;
}

.tw-btn--solid:hover,
.tw-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 15px 35px rgba(255,77,109,.4);
}

/* ===============================
   REGION / LAND HEADER BOX
================================ */

.tw-terms__title{
  font-size:2rem;
  font-weight:900;
  margin-bottom:10px;
}

.tw-term{
  padding:20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.05);
}

/* ===============================
   FOOTER CLEANER
================================ */

.site-footer{
  background:#0e1117;
  color:#fff;
  padding:40px 0;
}

.site-footer a{
  color:#fff;
  opacity:.8;
}

.site-footer a:hover{
  opacity:1;
}

/* =====================================
   PORTAL LEVEL UPGRADE
===================================== */

/* Global Layout */
body{
  background:#f4f7fb;
}

.container,
.tw-detail,
.tw-offers,
.tw-terms{
  max-width:1320px;
  margin:0 auto;
}

/* Hero sauber & scharf */
.tw-hero{
  min-height:520px;
  border-bottom-left-radius:60px;
  border-bottom-right-radius:60px;
  overflow:hidden;
}

.tw-hero__overlay{
  background:linear-gradient(180deg,rgba(0,0,0,.65),rgba(0,0,0,.35));
}

.tw-hero__title{
  font-size:clamp(36px,4vw,64px);
  font-weight:900;
  letter-spacing:-1px;
}

.tw-hero__search{
  background:rgba(255,255,255,.9);
  backdrop-filter:none;
  box-shadow:0 20px 50px rgba(0,0,0,.15);
}

.tw-hero__search input{
  font-size:16px;
}

/* Section Container */
.tw-card{
  border-radius:28px;
  padding:32px;
  box-shadow:0 20px 60px rgba(0,0,0,.05);
  border:1px solid rgba(0,0,0,.04);
}

/* Angebot Karten */
.tw-offer{
  border-radius:22px;
  box-shadow:0 10px 35px rgba(0,0,0,.07);
}

.tw-offer__price .tw-price-number{
  font-size:2.4rem;
  font-weight:900;
}

/* Buttons Portal Style */
.tw-btn--solid,
.tw-cta{
  background:linear-gradient(135deg,#ff4d6d,#ff6f91);
  box-shadow:0 12px 35px rgba(255,77,109,.35);
  transition:all .25s ease;
}

.tw-btn--solid:hover,
.tw-cta:hover{
  transform:translateY(-3px);
}

/* Pagination */
.page-numbers a,
.page-numbers span{
  border-radius:14px !important;
}

/* Mehr Weißraum */
.tw-detail__grid{
  gap:40px;
}

/* =========================================================
   PORTAL LEVEL – CSS STEP 2 (Blogtimes)
   Ganz unten einfügen
   ========================================================= */

/* ----------  A) Layout & Container  ---------- */
:root{
  --tw-bg:#f6f8fb;
  --tw-card:#ffffff;
  --tw-text:#0f172a;
  --tw-muted:#64748b;
  --tw-border:rgba(15,23,42,.10);
  --tw-shadow:0 18px 55px rgba(2,6,23,.10);
  --tw-shadow-hover:0 30px 90px rgba(2,6,23,.16);
  --tw-accent:#ff4d6d;
}

body{ background:var(--tw-bg); color:var(--tw-text); }

/* Blogtimes Container überall sauber */
.container,
.site-content .container,
.content-area,
.site-main{
  max-width: 1280px !important;
}

.site-content{ padding-top: 10px !important; }
@media (max-width: 1200px){
  .container, .site-content .container{ padding-left:16px !important; padding-right:16px !important; }
}

/* ----------  B) Global: Cards / Sections  ---------- */
.tw-card, .tw-offer, .tw-sticky, .tw-term, .tw-similar{
  background:var(--tw-card) !important;
  border:1px solid var(--tw-border) !important;
  box-shadow:var(--tw-shadow) !important;
}

.tw-card{ border-radius:28px !important; padding:26px !important; }
.tw-detail{ max-width: 1180px; margin:0 auto; padding: 28px 16px; }
.tw-detail__grid{ gap: 30px !important; margin-top: 26px !important; }

/* ----------  C) Hero: „Portal Banner“ Look  ---------- */
.tw-hero{
  min-height: 520px !important;
  border-radius: 0 0 44px 44px !important;
  overflow:hidden !important;
}
.tw-hero__overlay{
  background: linear-gradient(180deg, rgba(2,6,23,.72), rgba(2,6,23,.34)) !important;
}
.tw-hero__title{
  font-size: clamp(36px, 4.6vw, 72px) !important;
  font-weight: 950 !important;
  letter-spacing:-1.2px !important;
  text-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
}
.tw-hero__tagline{
  font-weight: 800 !important;
  opacity:.96 !important;
  max-width: 820px;
  margin-left:auto;
  margin-right:auto;
}

/* Suchbox: clean/modern (kein graues Theme-Feeling) */
.tw-hero__search{
  background: rgba(255,255,255,.92) !important;
  border:1px solid rgba(255,255,255,.40) !important;
  backdrop-filter: none !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.18) !important;
}
.tw-hero__search input{
  background:#fff !important;
  color:#111 !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.06) !important;
}
.tw-hero__search input::placeholder{ color: rgba(0,0,0,.55) !important; }
.tw-hero__search button{
  background: var(--tw-accent) !important;
  color:#fff !important;
  font-weight: 950 !important;
  box-shadow: 0 12px 30px rgba(255,77,109,.35) !important;
}

/* Mobile Hero */
@media (max-width: 820px){
  .tw-hero{ min-height: 320px !important; }
}

/* ----------  D) Offers Grid (Land/Region/Startseite) ---------- */
.tw-offers__grid{ gap: 22px !important; }

.tw-offer{
  border-radius: 22px !important;
  overflow:hidden !important;
  transition: transform .28s ease, box-shadow .28s ease !important;
}
.tw-offer:hover{
  transform: translateY(-8px) !important;
  box-shadow: var(--tw-shadow-hover) !important;
}

/* Einheitliche Bilder + edler Fade */
.tw-offer__media{ height: 210px !important; position:relative; }
.tw-offer__media::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.10));
  pointer-events:none;
}

.tw-offer__name{
  font-size: 1.10rem !important;
  font-weight: 950 !important;
  letter-spacing: -.2px !important;
  margin:0 !important;
}

/* Titel auf 2 Zeilen begrenzen => ruhigeres Grid */
.tw-offer__name{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:2.6em;
}

/* Preis & Hint */
.tw-offer__price .tw-price-number{ font-size: 2.25rem !important; letter-spacing: -.7px !important; }
.tw-pricehint{ color: rgba(15,23,42,.65) !important; font-weight: 800 !important; }

/* Wichtig: Theme darf Text nicht weiß machen */
.tw-offer, .tw-offer *{ color: var(--tw-text) !important; }
.tw-offer__tag{ color:#fff !important; background:#0b1220 !important; border-color:rgba(255,255,255,.12) !important; }

/* ----------  E) Buttons überall gleich ---------- */
.tw-btn, .tw-cta, .tw-live-btn{
  min-height: 50px !important;
  border-radius: 14px !important;
  font-weight: 950 !important;
  text-transform:none !important;
}

.tw-btn--ghost{
  background:#f1f5f9 !important;
  border:1px solid rgba(15,23,42,.08) !important;
  color: var(--tw-text) !important;
}

.tw-btn--solid, .tw-cta, .tw-live-btn{
  background: linear-gradient(135deg, #ff4d6d, #ff2e63) !important;
  border:none !important;
  color:#fff !important;
  box-shadow: 0 12px 28px rgba(255,77,109,.35) !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}
.tw-btn--solid:hover, .tw-cta:hover, .tw-live-btn:hover{
  transform: translateY(-2px) !important;
  box-shadow: 0 20px 45px rgba(255,77,109,.45) !important;
}

/* ----------  F) Kategorien (Term-Boxen) ---------- */
.tw-terms__grid{ gap: 14px !important; }
.tw-term{
  border-radius: 18px !important;
  padding: 16px !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}
.tw-term:hover{
  transform: translateY(-5px) !important;
  box-shadow: var(--tw-shadow-hover) !important;
}
.tw-term__name{ font-weight: 950 !important; }
.tw-term__count{ color: rgba(15,23,42,.65) !important; font-weight: 800 !important; }

/* ----------  G) Detailseite: Sidebar & Similar ---------- */
.tw-sticky{ border-radius: 22px !important; }
.tw-similar{ border-radius: 16px !important; }

/* ----------  H) Autocomplete Dropdown (falls aktiv) ---------- */
.tw-ac__list{ background:#fff !important; color:#111 !important; border:1px solid rgba(0,0,0,.10) !important; }
.tw-ac__item{ color:#111 !important; }
.tw-ac__type{ color:#64748b !important; }
.tw-ac__item:hover, .tw-ac__item.is-active{ background:#f1f5f9 !important; }
:root{
  --tw-hero-bg: url("https://www.tschuess-und-weg.de/wp-content/uploads/2026/02/Tropischer-Strand-mit-luxurioesem-Flair.png");
}
.tw-hero{
  background-image: var(--tw-hero-bg) !important;
}

/* =========================================================
   BLOGTIMES NAVIGATION – Portal Clean (unten einfügen)
   ========================================================= */

/* 1) Header/Topbar schlanker + sauberer Hintergrund */
.site-header,
.main-header,
.header,
#masthead{
  background: rgba(255,255,255,.92) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
}

/* 2) Sticky Header (falls Theme sticky macht) soll nicht springen */
.site-header,
#masthead{
  position: sticky;
  top: 0;
  z-index: 9999;
}

/* 3) Logo/Title Bereich: weniger Blog, mehr Portal */
.site-branding,
.site-title,
.site-description{
  margin: 0 !important;
}
.site-title a{
  font-weight: 950 !important;
  letter-spacing: -0.6px !important;
  color: #0f172a !important;
  text-decoration: none !important;
}
.site-description{
  color: rgba(15,23,42,.60) !important;
  font-weight: 700 !important;
}

/* 4) Menü-Links modern & klickbar */
.main-navigation a,
.primary-navigation a,
#site-navigation a,
.menu a{
  color: rgba(15,23,42,.88) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  transition: background .18s ease, transform .18s ease;
}

/* Hover */
.main-navigation a:hover,
.primary-navigation a:hover,
#site-navigation a:hover,
.menu a:hover{
  background: rgba(15,23,42,.06) !important;
  transform: translateY(-1px);
}

/* 5) Aktiver Menüpunkt als „Chip“ */
.current-menu-item > a,
.current_page_item > a,
.current-menu-ancestor > a{
  background: rgba(255,77,109,.12) !important;
  color: #0f172a !important;
}

/* 6) Menü-Abstände insgesamt schöner */
.main-navigation ul,
.primary-navigation ul,
#site-navigation ul,
.menu{
  gap: 6px;
}

/* 7) Mobile Menu Button modern (falls vorhanden) */
.menu-toggle,
.nav-toggle{
  border-radius: 14px !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  background: #fff !important;
  font-weight: 900 !important;
}

/* 8) Content nicht unter Sticky Header verschwinden */
.site-content{
  padding-top: 14px !important;
}

/* 9) Optional: Wenn Blogtimes oben noch „Header Image“ reserviert */
.custom-header,
.header-image,
.wp-custom-header{
  display:none !important;
  height:0 !important;
  overflow:hidden !important;
}

/* =========================================================
   PORTAL LEVEL – LAND / REGION / STADT Seiten (unten einfügen)
   ========================================================= */

/* 1) Überschrift-Bereich (Landname) als Premium-Header-Card */
.tw-terms,
.tw-offers{
  margin-top: 18px;
}

.tw-terms__head,
.tw-terms__title,
.tw-terms h1,
.tw-terms h2{
  color: #0f172a !important;
}

.tw-terms__head{
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 18px 55px rgba(2,6,23,.10);
  border-radius: 28px;
  padding: 22px 22px;
  margin: 18px 0 18px;
}

/* Wenn dein Landtitel als normales h1 irgendwo steht */
.tw-terms__title,
.tw-terms__head h1,
.tw-terms__head h2{
  font-weight: 950 !important;
  letter-spacing: -0.8px !important;
  font-size: clamp(28px, 3.2vw, 46px) !important;
  margin: 0 0 6px !important;
}

/* Subline unter Titel */
.tw-terms__head p{
  margin: 0;
  color: rgba(15,23,42,.70) !important;
  font-weight: 750;
  line-height: 1.55;
  max-width: 980px;
}

/* 2) Abschnittstitel (Beliebte Regionen / Angebote etc.) */
.tw-terms h2,
.tw-offers h2,
.tw-terms h3,
.tw-offers h3{
  font-weight: 950 !important;
  letter-spacing: -0.4px;
  margin: 0 0 12px;
}

/* Optional: falls Theme kleine Überschriften erzwingt */
.tw-terms h2{
  font-size: 1.25rem;
}
.tw-terms h3{
  font-size: 1.1rem;
}

/* 3) Term-Kacheln (Beliebte Regionen) als „Premium Tiles“ */
.tw-terms__grid{
  gap: 14px !important;
  margin-top: 10px;
}

.tw-term{
  padding: 18px 18px !important;
  border-radius: 18px !important;
  background: #fff !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 14px 40px rgba(2,6,23,.08) !important;
  position: relative;
}

.tw-term:hover{
  transform: translateY(-5px);
  box-shadow: 0 30px 80px rgba(2,6,23,.14) !important;
}

.tw-term__name{
  font-weight: 950 !important;
  font-size: 1.03rem;
  letter-spacing: -0.2px;
}

.tw-term__count{
  margin-top: 8px;
  color: rgba(15,23,42,.65) !important;
  font-weight: 850 !important;
}

/* kleines Icon rechts oben (nur Optik) */
.tw-term::after{
  content:"›";
  position:absolute;
  right:14px;
  top:14px;
  font-size: 18px;
  font-weight: 950;
  color: rgba(15,23,42,.30);
}

/* 4) Angebote-Grid: mehr Luft, klarer Start */
.tw-offers{
  margin-top: 18px;
}

.tw-offers__grid{
  margin-top: 14px;
  gap: 22px !important;
}

/* 5) SEO-Textbereich: Lesbarkeit stark erhöhen */
.tw-seo,
.tw-prose{
  line-height: 1.75 !important;
  font-size: 1.03rem;
  color: rgba(15,23,42,.88) !important;
}

.tw-seo h2, .tw-seo h3{
  margin-top: 18px;
}

/* Listen im SEO-Text schöner */
.tw-seo ul, .tw-seo ol{
  padding-left: 20px;
  margin: 12px 0;
}
.tw-seo li{
  margin: 6px 0;
}

/* 6) Inhaltsverzeichnis (falls du eins nutzt) wie ein Portal-Widget */
.tw-seo #inhaltsverzeichnis,
.tw-seo .toc,
.tw-seo .table-of-contents{
  background: rgba(255,77,109,.06);
  border: 1px solid rgba(255,77,109,.18);
  border-radius: 20px;
  padding: 16px 16px;
  margin: 16px 0 22px;
}

.tw-seo #inhaltsverzeichnis a,
.tw-seo .toc a,
.tw-seo .table-of-contents a{
  text-decoration: none !important;
  font-weight: 850;
}
.tw-seo #inhaltsverzeichnis a:hover,
.tw-seo .toc a:hover,
.tw-seo .table-of-contents a:hover{
  text-decoration: underline !important;
}

/* 7) Trennlinien zwischen großen Blöcken (optische Ruhe) */
.tw-terms__grid,
.tw-offers__grid,
.tw-seo{
  scroll-margin-top: 90px;
}

/* 8) Mobile: bessere Spacing & keine gequetschten Tiles */
@media (max-width: 520px){
  .tw-terms__head{
    padding: 18px 16px;
    border-radius: 22px;
  }
  .tw-term{
    padding: 16px !important;
  }
  .tw-seo, .tw-prose{
    font-size: 1rem;
  }
}

/* =========================================================
   PORTAL LEVEL – LAND / REGION / STADT Seiten (unten einfügen)
   ========================================================= */

/* 1) Überschrift-Bereich (Landname) als Premium-Header-Card */
.tw-terms,
.tw-offers{
  margin-top: 18px;
}

.tw-terms__head,
.tw-terms__title,
.tw-terms h1,
.tw-terms h2{
  color: #0f172a !important;
}

.tw-terms__head{
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 18px 55px rgba(2,6,23,.10);
  border-radius: 28px;
  padding: 22px 22px;
  margin: 18px 0 18px;
}

/* Wenn dein Landtitel als normales h1 irgendwo steht */
.tw-terms__title,
.tw-terms__head h1,
.tw-terms__head h2{
  font-weight: 950 !important;
  letter-spacing: -0.8px !important;
  font-size: clamp(28px, 3.2vw, 46px) !important;
  margin: 0 0 6px !important;
}

/* Subline unter Titel */
.tw-terms__head p{
  margin: 0;
  color: rgba(15,23,42,.70) !important;
  font-weight: 750;
  line-height: 1.55;
  max-width: 980px;
}

/* 2) Abschnittstitel (Beliebte Regionen / Angebote etc.) */
.tw-terms h2,
.tw-offers h2,
.tw-terms h3,
.tw-offers h3{
  font-weight: 950 !important;
  letter-spacing: -0.4px;
  margin: 0 0 12px;
}

/* Optional: falls Theme kleine Überschriften erzwingt */
.tw-terms h2{
  font-size: 1.25rem;
}
.tw-terms h3{
  font-size: 1.1rem;
}

/* 3) Term-Kacheln (Beliebte Regionen) als „Premium Tiles“ */
.tw-terms__grid{
  gap: 14px !important;
  margin-top: 10px;
}

.tw-term{
  padding: 18px 18px !important;
  border-radius: 18px !important;
  background: #fff !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 14px 40px rgba(2,6,23,.08) !important;
  position: relative;
}

.tw-term:hover{
  transform: translateY(-5px);
  box-shadow: 0 30px 80px rgba(2,6,23,.14) !important;
}

.tw-term__name{
  font-weight: 950 !important;
  font-size: 1.03rem;
  letter-spacing: -0.2px;
}

.tw-term__count{
  margin-top: 8px;
  color: rgba(15,23,42,.65) !important;
  font-weight: 850 !important;
}

/* kleines Icon rechts oben (nur Optik) */
.tw-term::after{
  content:"›";
  position:absolute;
  right:14px;
  top:14px;
  font-size: 18px;
  font-weight: 950;
  color: rgba(15,23,42,.30);
}

/* 4) Angebote-Grid: mehr Luft, klarer Start */
.tw-offers{
  margin-top: 18px;
}

.tw-offers__grid{
  margin-top: 14px;
  gap: 22px !important;
}

/* 5) SEO-Textbereich: Lesbarkeit stark erhöhen */
.tw-seo,
.tw-prose{
  line-height: 1.75 !important;
  font-size: 1.03rem;
  color: rgba(15,23,42,.88) !important;
}

.tw-seo h2, .tw-seo h3{
  margin-top: 18px;
}

/* Listen im SEO-Text schöner */
.tw-seo ul, .tw-seo ol{
  padding-left: 20px;
  margin: 12px 0;
}
.tw-seo li{
  margin: 6px 0;
}

/* 6) Inhaltsverzeichnis (falls du eins nutzt) wie ein Portal-Widget */
.tw-seo #inhaltsverzeichnis,
.tw-seo .toc,
.tw-seo .table-of-contents{
  background: rgba(255,77,109,.06);
  border: 1px solid rgba(255,77,109,.18);
  border-radius: 20px;
  padding: 16px 16px;
  margin: 16px 0 22px;
}

.tw-seo #inhaltsverzeichnis a,
.tw-seo .toc a,
.tw-seo .table-of-contents a{
  text-decoration: none !important;
  font-weight: 850;
}
.tw-seo #inhaltsverzeichnis a:hover,
.tw-seo .toc a:hover,
.tw-seo .table-of-contents a:hover{
  text-decoration: underline !important;
}

/* 7) Trennlinien zwischen großen Blöcken (optische Ruhe) */
.tw-terms__grid,
.tw-offers__grid,
.tw-seo{
  scroll-margin-top: 90px;
}

/* 8) Mobile: bessere Spacing & keine gequetschten Tiles */
@media (max-width: 520px){
  .tw-terms__head{
    padding: 18px 16px;
    border-radius: 22px;
  }
  .tw-term{
    padding: 16px !important;
  }
  .tw-seo, .tw-prose{
    font-size: 1rem;
  }
}

/* =========================================================
   ULTRA PORTAL QUICKBAR
   ========================================================= */

.tw-qb{ padding: 22px !important; }
.tw-qb__head{ margin-bottom: 14px; }
.tw-qb__title{
  margin: 0 0 6px;
  font-weight: 950;
  letter-spacing: -.6px;
  font-size: clamp(18px, 2vw, 26px);
}
.tw-qb__sub{
  margin: 0;
  color: rgba(15,23,42,.70);
  font-weight: 750;
  line-height: 1.55;
}

.tw-qb__grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.tw-qb__chip{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 10px 28px rgba(2,6,23,.06);
  text-decoration:none !important;
  transition: transform .2s ease, box-shadow .2s ease;
}

.tw-qb__chip:hover{
  transform: translateY(-3px);
  box-shadow: 0 22px 55px rgba(2,6,23,.12);
}

.tw-qb__icon{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,77,109,.10);
  font-size: 20px;
  flex: 0 0 auto;
}

.tw-qb__text strong{
  display:block;
  color: #0f172a;
  font-weight: 950;
  letter-spacing: -.2px;
}
.tw-qb__text small{
  display:block;
  margin-top: 2px;
  color: rgba(15,23,42,.65);
  font-weight: 800;
}

.tw-qb__arrow{
  margin-left:auto;
  font-weight: 950;
  color: rgba(15,23,42,.35);
  font-size: 20px;
}

.tw-qb__chip--accent{
  background: linear-gradient(135deg, rgba(255,77,109,.12), rgba(255,77,109,.05));
  border-color: rgba(255,77,109,.25);
}

.tw-qb__note{
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(15,23,42,.04);
  border: 1px solid rgba(15,23,42,.06);
  color: rgba(15,23,42,.75);
  font-weight: 750;
}

/* Responsive */
@media (max-width: 1000px){
  .tw-qb__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  .tw-qb__grid{ grid-template-columns: 1fr; }
  .tw-qb{ padding: 18px !important; }
}

/* =========================================================
   DETAIL-HERO: Titel lesbar + Premium Glass Panel
   ========================================================= */

/* Nur Detailseite: rechter Textblock */
.tw-detail .tw-hero__head{
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 22px;
  padding: 18px 18px;
  box-shadow: 0 18px 55px rgba(2,6,23,.10);
  backdrop-filter: blur(10px);
}

/* Titel auf Detailseite: nicht mehr schwarz auf Foto, sondern sauber */
.tw-detail .tw-hero__title{
  color: #0f172a !important;
  text-shadow: none !important;
  margin-bottom: 10px;
}

/* Subinfos (Ort/Anbieter) lesbarer */
.tw-detail .tw-hero__sub{
  color: rgba(15,23,42,.75) !important;
}

/* Chips in Detail-Hero klarer */
.tw-detail .tw-chip{
  background: rgba(15,23,42,.05) !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  color: rgba(15,23,42,.88) !important;
  font-weight: 850 !important;
}
/* Hintergrund im Detail-Hero etwas ruhiger machen */
.tw-detail .tw-hero{
  position: relative;
}
.tw-detail .tw-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(255,255,255,.18);
  pointer-events:none;
}
/* =========================================================
   DETAILSEITE – PREMIUM HERO FIX
   Nur für single-angebote
   ========================================================= */

.single-angebote .tw-hero{
  position: relative;
}

/* Hintergrund leicht abdunkeln für bessere Lesbarkeit */
.single-angebote .tw-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.45) 0%,
    rgba(0,0,0,.25) 40%,
    rgba(0,0,0,.10) 100%
  );
  pointer-events:none;
}

/* Glass-Panel für Titel + Infos */
.single-angebote .tw-hero__head{
  background: rgba(255,255,255,.88);
  border-radius: 24px;
  padding: 22px 24px;
  box-shadow: 0 25px 60px rgba(0,0,0,.15);
  backdrop-filter: blur(12px);
  max-width: 680px;
}

/* Titel sauber und kräftig */
.single-angebote .tw-hero__title{
  color: #0f172a !important;
  text-shadow: none !important;
  font-weight: 900 !important;
}

/* Meta-Infos */
.single-angebote .tw-hero__sub{
  color: rgba(15,23,42,.75) !important;
}

/* Chips edler */
.single-angebote .tw-chip{
  background: rgba(15,23,42,.05) !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  color: rgba(15,23,42,.88) !important;
  font-weight: 800 !important;
}

/* Hotelbild links etwas moderner */
.single-angebote .tw-hero__media{
  box-shadow: 0 25px 70px rgba(0,0,0,.25);
}

/* =========================================================
   PORTAL LEVEL – STEP 4 (Global Finish)
   Startseite + Land/Region/Stadt + Angebote-Grid + SEO
   ========================================================= */

/* 1) Hintergrund & Abstände: mehr „Weißraum“ */
body{ background:#f6f8fb !important; }
.site-content{ padding-top: 16px !important; padding-bottom: 40px !important; }

/* 2) Haupt-Sections wirken wie Landingpage-Blöcke */
.tw-offers,
.tw-terms,
.tw-detail{
  margin-left:auto;
  margin-right:auto;
}

/* 3) Section-Header Card auf Start/Land/Region/Stadt */
.tw-section{
  background:#fff;
  border:1px solid rgba(15,23,42,.10);
  border-radius: 28px;
  padding: 18px 20px;
  box-shadow: 0 18px 55px rgba(2,6,23,.10);
  margin: 18px 0 16px;
}

/* Wenn du keine .tw-section hast: h2/h1 optisch stärker */
.tw-offers h2,
.tw-terms h2{
  font-weight: 950 !important;
  letter-spacing: -.6px !important;
  margin: 18px 0 12px !important;
  font-size: clamp(18px, 1.7vw, 26px) !important;
}

/* 4) Offer Grid: ruhiger + gleichmäßiger */
.tw-offers__grid{
  gap: 24px !important;
  align-items: stretch !important;
}

/* 5) Karten: Premium Details */
.tw-offer{
  background:#fff !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 45px rgba(2,6,23,.10) !important;
  overflow:hidden !important;
}

.tw-offer:hover{
  transform: translateY(-8px) !important;
  box-shadow: 0 30px 90px rgba(2,6,23,.18) !important;
}

/* Bild: stärker, aber sauber */
.tw-offer__media{
  height: 220px !important;
  position: relative;
}
.tw-offer__media::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.12));
  pointer-events:none;
}

/* Titel: klar + 2 Zeilen */
.tw-offer__name{
  padding: 16px 16px 8px !important;
  font-weight: 950 !important;
  letter-spacing: -.2px !important;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: 2.6em;
}

/* Meta/Preis: mehr Fokus */
.tw-offer__meta{ padding: 0 16px 10px !important; }
.tw-offer__from{ opacity:.7 !important; font-weight: 800 !important; }
.tw-offer__price .tw-price-number{
  font-size: 2.35rem !important;
  letter-spacing: -.8px !important;
}
.tw-offer__price .tw-price-currency{
  font-weight: 950 !important;
  opacity: .9 !important;
}
.tw-pricehint{
  margin: 2px 16px 0 !important;
  display:block !important;
}

/* 6) Deal Tags: Portal-Stil */
.tw-offer__tag{
  background: #0b1220 !important;
  color:#fff !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 10px 25px rgba(2,6,23,.25) !important;
}

/* 7) Buttons: überall gleich, modern */
.tw-offer__cta{
  padding: 12px 16px 18px !important;
  gap: 10px !important;
}
.tw-btn{
  border-radius: 14px !important;
  font-weight: 950 !important;
  min-height: 50px !important;
}
.tw-btn--ghost{
  background:#f1f5f9 !important;
  border: 1px solid rgba(15,23,42,.08) !important;
  color:#0f172a !important;
}
.tw-btn--solid{
  background: linear-gradient(135deg, #ff4d6d, #ff2e63) !important;
  color:#fff !important;
  border:none !important;
  box-shadow: 0 12px 28px rgba(255,77,109,.35) !important;
}
.tw-btn--solid:hover{
  transform: translateY(-2px) !important;
  box-shadow: 0 20px 45px rgba(255,77,109,.45) !important;
}

/* 8) Land/Region/Stadt – Term-Kacheln wie „Navigation Tiles“ */
.tw-term{
  background:#fff !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 14px 40px rgba(2,6,23,.08) !important;
  border-radius: 18px !important;
  padding: 18px !important;
}
.tw-term:hover{
  transform: translateY(-5px) !important;
  box-shadow: 0 30px 80px rgba(2,6,23,.14) !important;
}
.tw-term__name{ font-weight: 950 !important; }
.tw-term__count{ color: rgba(15,23,42,.65) !important; font-weight: 850 !important; }

/* 9) SEO-Text: wirkt wie ein Magazin/Guide */
.tw-seo,
.tw-prose{
  font-size: 1.05rem !important;
  line-height: 1.8 !important;
  color: rgba(15,23,42,.88) !important;
}
.tw-seo h2, .tw-seo h3{
  font-weight: 950 !important;
  letter-spacing: -.4px !important;
}
.tw-seo p{ margin: 0 0 12px; }
.tw-seo ul, .tw-seo ol{ padding-left: 20px; }
.tw-seo li{ margin: 6px 0; }

/* 10) Inhaltsverzeichnis schöner */
.tw-seo .table-of-contents,
.tw-seo .toc,
.tw-seo #inhaltsverzeichnis{
  background: rgba(255,77,109,.06);
  border: 1px solid rgba(255,77,109,.18);
  border-radius: 20px;
  padding: 16px;
}

/* 11) Pagination: Portal-Buttons */
.page-numbers a,
.page-numbers span{
  border-radius: 14px !important;
  font-weight: 950 !important;
}

/* 12) Mobile: mehr Ruhe */
@media (max-width: 520px){
  .tw-offer__media{ height: 200px !important; }
  .tw-offer__price .tw-price-number{ font-size: 2.05rem !important; }
}

/* =========================================================
   PORTAL LEVEL – FOOTER (Blogtimes)
   ========================================================= */

/* Footer Hintergrund + Typo */
.site-footer,
#colophon,
.footer,
.footer-widgets{
  background: #0b1220 !important;
  color: rgba(255,255,255,.86) !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}

/* Footer Container Luft */
.site-footer .container,
#colophon .container{
  padding-top: 36px !important;
  padding-bottom: 30px !important;
}

/* Footer Überschriften */
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4{
  color: #fff !important;
  font-weight: 950 !important;
  letter-spacing: -.3px;
}

/* Text & Widgets */
.site-footer p,
.site-footer li,
.site-footer span{
  color: rgba(255,255,255,.78) !important;
  line-height: 1.7;
}

/* Links */
.site-footer a{
  color: rgba(255,255,255,.86) !important;
  text-decoration: none !important;
  font-weight: 800 !important;
}
.site-footer a:hover{
  color: #fff !important;
  text-decoration: underline !important;
}

/* Kleine Meta-Zeile (Copyright etc.) */
.site-info,
.footer-copyright,
.site-footer .site-info{
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(255,255,255,.65) !important;
  font-weight: 750 !important;
  font-size: .95rem;
}

/* Footer Menüs hübscher */
.site-footer ul{
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0 !important;
}
.site-footer ul li{
  margin: 8px 0 !important;
}

/* Social Icons/Links (wenn vorhanden) */
.site-footer .social-icons a,
.site-footer .social-menu a,
.site-footer a[href*="facebook"],
.site-footer a[href*="instagram"],
.site-footer a[href*="tiktok"],
.site-footer a[href*="youtube"],
.site-footer a[href*="twitter"],
.site-footer a[href*="x.com"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
  margin-right: 8px;
  text-decoration:none !important;
}
.site-footer .social-icons a:hover,
.site-footer .social-menu a:hover{
  background: rgba(255,255,255,.14);
}

/* =========================================================
   TRUST BAR (über dem Footer) – optional automatisch
   Falls du eine eigene Trust-Bar später einbaust, passt es.
   ========================================================= */
.tw-trustbar{
  background: #0b1220;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.86);
  border-radius: 26px;
  padding: 16px 18px;
  margin: 22px auto 18px;
  max-width: 1280px;
  display:flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items:center;
}
.tw-trustbar strong{
  color:#fff;
  font-weight: 950;
}
.tw-trustbar span{
  font-weight: 800;
  opacity: .92;
}

/* Mobile */
@media (max-width: 520px){
  .tw-trustbar{
    border-radius: 18px;
    padding: 14px 14px;
  }
}

.tw-footer-trust{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 14px 14px;
}
.tw-footer-trust h3{
  margin: 0 0 10px;
  color: #fff;
  font-weight: 950;
}
.tw-footer-trust p{
  margin: 0 0 8px;
  color: rgba(255,255,255,.82);
  font-weight: 800;
}

/* =========================================================
   STARTSEITE – BELIEBTE ZIELE PREMIUM STYLE
   ========================================================= */

.tw-popular{
  margin: 60px auto;
  max-width: 1200px;
}

.tw-popular h2{
  font-size: 1.6rem;
  font-weight: 950;
  margin-bottom: 22px;
  position: relative;
}

.tw-popular h2::after{
  content:"";
  display:block;
  width:60px;
  height:4px;
  background:#ff4d6d;
  margin-top:8px;
  border-radius:2px;
}

/* 3 Spalten Grid */
.tw-popular__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:40px;
}

/* Linkliste */
.tw-popular ul{
  list-style:none;
  padding:0;
  margin:0;
}

.tw-popular li{
  margin-bottom:16px;
}

.tw-popular a{
  text-decoration:none;
  font-weight:800;
  color:#0f172a;
  display:flex;
  justify-content:space-between;
  padding:10px 0;
  border-bottom:1px solid rgba(0,0,0,.08);
  transition: all .2s ease;
}

.tw-popular a:hover{
  color:#ff4d6d;
  transform: translateX(4px);
}

/* Mobile */
@media(max-width:900px){
  .tw-popular__grid{
    grid-template-columns:1fr;
    gap:30px;
  }
}

/* =========================================================
   STARTSEITE – BELIEBTE ZIELE (KOMPAKT & SAUBER)
   Überschreibt die zu großen H2 Styles
   ========================================================= */

.tw-popular{
  margin: 34px auto !important;
  max-width: 1200px;
}

/* Grid enger */
.tw-popular__grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 26px !important;
  align-items:start;
}

/* Überschrift kompakt, EINZEILIG */
.tw-popular h2{
  margin: 0 0 12px !important;
  font-size: 1.25rem !important;   /* kleiner */
  font-weight: 950 !important;
  letter-spacing: -.3px;
  line-height: 1.15 !important;
  white-space: nowrap;             /* kein Umbruch */
}

/* kleine Akzentlinie – nicht so dominant */
.tw-popular h2::after{
  content:"";
  display:block;
  width: 44px !important;
  height: 3px !important;
  background:#ff4d6d;
  margin-top: 8px !important;
  border-radius: 3px;
}

/* Listen */
.tw-popular ul{
  list-style:none !important;
  padding:0 !important;
  margin:0 !important;
}

.tw-popular li{
  margin: 0 0 10px !important;
}

/* Links als „Zeilen“ */
.tw-popular a{
  text-decoration:none !important;
  font-weight: 850 !important;
  color: rgba(15,23,42,.88) !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(0,0,0,.10) !important;
  transition: transform .18s ease, color .18s ease, border-color .18s ease;
}

.tw-popular a:hover{
  color:#ff4d6d !important;
  transform: translateX(3px);
  border-color: rgba(255,77,109,.35) !important;
}

/* Mobile: 1 Spalte */
@media(max-width: 900px){
  .tw-popular__grid{
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .tw-popular h2{
    white-space: normal; /* mobil darf umbrechen */
    font-size: 1.25rem !important;
  }
}

.tw-popular{
  margin:60px auto;
  max-width:1200px;
}

.tw-popular__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
}

.tw-popular__box{
  background:#fff;
  padding:28px;
  border-radius:18px;
  box-shadow:0 15px 40px rgba(0,0,0,.08);
}

.tw-popular__box h3{
  font-size:1.2rem;
  font-weight:950;
  margin-bottom:18px;
  position:relative;
}

.tw-popular__box h3::after{
  content:"";
  display:block;
  width:50px;
  height:3px;
  background:#ff4d6d;
  margin-top:8px;
  border-radius:3px;
}

.tw-popular ul{
  list-style:none;
  padding:0;
  margin:0;
}

.tw-popular li{
  margin-bottom:12px;
}

.tw-popular a{
  text-decoration:none;
  font-weight:800;
  color:#0f172a;
  display:block;
  padding:6px 0;
  transition:all .2s ease;
}

.tw-popular a:hover{
  color:#ff4d6d;
  transform:translateX(4px);
}

@media(max-width:900px){
  .tw-popular__grid{
    grid-template-columns:1fr;
  }
}
/* =========================================================
   MASTER OVERRIDES (Portal-Safe)
   Ziel: doppelte Regeln neutralisieren & fehlerhafte RGBA bereinigen
   ========================================================= */

/* 1) Hero (Startseite / global) – NUR diese Variante soll gelten */
:root{
  --tw-hero-accent:#ff4d6d;
  --tw-hero-dark:#0b1220;
}

/* Global/Start-Hero */
.tw-hero{
  position:relative;
  width:100%;
  min-height:320px;
  background-image: var(--tw-hero-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:22px 0;
}

.tw-hero__overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(11,18,32,.62), rgba(11,18,32,.28));
}

.tw-hero__inner{
  position:relative;
  z-index:2;
  width:100%;
  max-width:1100px;
  padding:0 16px;
}

.tw-hero__content{ color:#fff; }

.tw-hero__title{
  margin:0 0 10px;
  font-weight:900;
  font-size:clamp(28px, 4vw, 60px);
  line-height:1.05;
  letter-spacing:-1px;
  text-shadow:0 14px 34px rgba(0,0,0,.25);
}

.tw-hero__tagline{
  margin:0 0 16px;
  font-weight:700;
  opacity:.95;
}

/* Suche im Hero */
.tw-hero__search{
  margin:0 auto;
  max-width:820px;
  display:flex;
  gap:10px;
  padding:10px;
  border-radius:18px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(10px);
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}

.tw-hero__search input{
  flex:1;
  min-width:220px;
  padding:14px;
  border-radius:14px;
  border:none;
  outline:none;
}

.tw-hero__search button{
  padding:14px 18px;
  border-radius:14px;
  border:none;
  font-weight:900;
  background:var(--tw-hero-accent);
  color:#fff;
  cursor:pointer;
}

@media(max-width:820px){
  .tw-hero{ min-height:260px; }
  .tw-hero__search{ flex-direction:column; }
  .tw-hero__search input,
  .tw-hero__search button{ width:100%; }
}

/* 2) Autocomplete – Text immer dunkel */
.tw-ac__list{ background:#fff; color:#111; }
.tw-ac__item{ color:#111; }
.tw-ac__type{ color:#666; }
.tw-ac__item:hover,
.tw-ac__item.is-active{ background:#f2f2f2; }

/* 3) Live-Suche Box – eine Version (du hattest doppelt) */


.tw-live-btn{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  padding:12px 16px;
  border-radius:14px;
  font-weight:900;
  text-decoration:none;
  background:var(--tw-hero-accent);
  color:#fff;
  transition:.2s ease;
}
/* DETAIL HERO MOBILE FIX */
@media (max-width: 900px){

  .tw-detail .tw-hero{
    display:block !important;
  }

  .tw-detail .tw-hero__media{
    width:100%;
    margin-bottom:16px;
  }

  .tw-detail .tw-hero__img{
    width:100%;
    height:auto;
    max-height:320px;
    object-fit:cover;
  }

  .tw-detail .tw-hero__head{
    width:100%;
  }

}

@media (max-width: 600px){
  .tw-detail .tw-hero__img{
    max-height:260px;
  }
}
/* =========================================================
   DETAILSEITE MOBILE: Hero-Überdeckung verhindern
   ========================================================= */
@media (max-width: 900px){

  /* Hero: alles untereinander */
  .tw-detail .tw-hero{
    display:block !important;
  }

  /* Bild-Box darf NICHT über den Text "drüber rutschen" */
  .tw-detail .tw-hero__media{
    position:relative !important;
    z-index: 1 !important;
    margin-bottom: 14px !important;
  }

  /* Titel/Infos müssen über allem liegen (falls irgendwas schwebt) */
  .tw-detail .tw-hero__head{
    position:relative !important;
    z-index: 5 !important;
    margin-top: 0 !important;
  }

  /* Falls dein Theme/alte CSS einen negativen Abstand nutzt: kill it */
  .tw-detail .tw-hero__head,
  .tw-detail .tw-hero__media,
  .tw-detail .tw-hero__img{
    transform: none !important;
  }

  /* Sicherheitsnetz: kein negativer Margin, der überdeckt */
  .tw-detail .tw-hero__head{
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Optional: Bildhöhe auf Handy etwas begrenzen */
  .tw-detail .tw-hero__img{
    width:100% !important;
    height:auto !important;
    max-height: 320px !important;
    object-fit: cover !important;
    display:block !important;
  }
}
@media (max-width: 900px){
  .tw-detail .tw-hero *{
    clear: both;
  }
}
/* =========================================================
   DETAILSEITE MOBILE FIX – Labranda/alle Angebote
   verhindert Überdeckung: Bild oben, Titelbox darunter
   ========================================================= */
@media (max-width: 900px){

  /* Hero zwingend stapeln */
  .tw-detail .tw-hero{
    display: block !important;
    gap: 0 !important;
  }

  /* Bildblock */
  .tw-detail .tw-hero__media{
    position: relative !important;
    z-index: 1 !important;
    margin: 0 0 14px !important;
    border-radius: 22px !important;
    overflow: hidden !important;
  }

  /* Bild: keine komischen Höhen/Überhänge */
  .tw-detail .tw-hero__img{
    width: 100% !important;
    height: auto !important;
    max-height: 320px !important;
    object-fit: cover !important;
    display: block !important;
  }

  /* TITELBOX: NICHT mehr ins Bild ziehen */
  .tw-detail .tw-hero__head{
    position: relative !important;
    z-index: 5 !important;
    margin: 0 !important;          /* kill negative margins */
    padding: 0 !important;
    transform: none !important;     /* kill translateY */
    top: auto !important;
  }

  /* Falls deine Titelbox selbst als "Card" gestylt ist und nach oben rutscht */
  .tw-detail .tw-hero__head .tw-card,
  .tw-detail .tw-hero__head{
    margin-top: 0 !important;
  }

  /* Wenn irgendwo in der CSS ein "pull-up" gesetzt ist, neutralisieren wir ihn */
  .tw-detail .tw-hero__media,
  .tw-detail .tw-hero__head{
    translate: none !important;
  }
}
/* =========================================================
   DETAILSEITE MOBILE FIX – Labranda/alle Angebote
   verhindert Überdeckung: Bild oben, Titelbox darunter
   ========================================================= */
@media (max-width: 900px){

  /* Hero zwingend stapeln */
  .tw-detail .tw-hero{
    display: block !important;
    gap: 0 !important;
  }

  /* Bildblock */
  .tw-detail .tw-hero__media{
    position: relative !important;
    z-index: 1 !important;
    margin: 0 0 14px !important;
    border-radius: 22px !important;
    overflow: hidden !important;
  }

  /* Bild: keine komischen Höhen/Überhänge */
  .tw-detail .tw-hero__img{
    width: 100% !important;
    height: auto !important;
    max-height: 320px !important;
    object-fit: cover !important;
    display: block !important;
  }

  /* TITELBOX: NICHT mehr ins Bild ziehen */
  .tw-detail .tw-hero__head{
    position: relative !important;
    z-index: 5 !important;
    margin: 0 !important;          /* kill negative margins */
    padding: 0 !important;
    transform: none !important;     /* kill translateY */
    top: auto !important;
  }

  /* Falls deine Titelbox selbst als "Card" gestylt ist und nach oben rutscht */
  .tw-detail .tw-hero__head .tw-card,
  .tw-detail .tw-hero__head{
    margin-top: 0 !important;
  }

  /* Wenn irgendwo in der CSS ein "pull-up" gesetzt ist, neutralisieren wir ihn */
  .tw-detail .tw-hero__media,
  .tw-detail .tw-hero__head{
    translate: none !important;
  }
}
@media (max-width: 900px){
  .tw-detail__grid{
    margin-top:20px !important;
  }
}

.tw-hero__title{
  color:#ffffff !important;
  text-shadow: 0 4px 20px rgba(0,0,0,.45);
}
/* HERO: Titel im Hero immer weiß + besser lesbar */
.tw-hero__title,
.tw-hero__tagline {
  color: #ffffff !important;
  text-shadow: 0 4px 18px rgba(0,0,0,0.55) !important;
}

.tw-hero__search input,
.tw-hero__search select {
  color: #111 !important;
  border: 2px solid #fff !important;
}

/* ===== TRAVEL DEAL – GUTENBERG TEMPLATE ===== */
.twdeal-wrap{max-width:1000px;margin:0 auto;font-family:Arial,Helvetica,sans-serif;line-height:1.6}
.twdeal-hero{background:#0b1f3a;color:#fff;padding:30px;border-radius:14px;text-align:center;margin-bottom:30px}
.twdeal-hero h1{margin:0 0 10px;font-size:clamp(22px,3.2vw,36px);line-height:1.2;color:#fff}
.twdeal-hero p{margin:0 0 15px;font-size:16px;opacity:.95}
.twdeal-btn a{display:inline-block;background:#c9a227;color:#000 !important;padding:15px 30px;border-radius:10px;font-weight:900;text-decoration:none}
.twdeal-btn a:hover{background:#e0b93d}
.twdeal-card{background:#fff;padding:25px;border-radius:14px;box-shadow:0 10px 25px rgba(0,0,0,.05);margin-bottom:30px}
.twdeal-highlight{background:#f3f6fb;padding:15px;border-left:5px solid #c9a227;margin:15px 0;border-radius:10px}
.twdeal-list{list-style:none;padding:0;margin:0}
.twdeal-list li{margin-bottom:8px}
.twdeal-trust{background:#f9f9f9;padding:15px;border-radius:12px;font-size:14px;color:#555}
.twdeal-price{white-space:nowrap}

.tw-deal-alert{
  margin:30px 0;
  padding:28px;
  border-radius:20px;
  background:linear-gradient(135deg,#0b1f3a,#102b55);
  color:#fff;
  text-align:center;
}

.tw-deal-alert h3{
  margin-bottom:14px;
  font-size:20px;
}

.tw-deal-alert form{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.tw-deal-alert input{
  padding:14px 16px;
  border-radius:12px;
  border:none;
  min-width:240px;
  height:48px;
}

.tw-deal-alert button{
  padding:14px 22px;
  border:none;
  border-radius:12px;
  background:#c9a227;
  font-weight:700;
  cursor:pointer;
  height:48px;
}

.tw-deal-alert small{
  display:block;
  margin-top:12px;
  opacity:.8;
  font-size:12px;
}

@media (max-width:600px){
  .tw-deal-alert form{
    flex-direction:column;
  }
  .tw-deal-alert input,
  .tw-deal-alert button{
    width:100%;
    max-width:100%;
  }
}

.tw-deal-alert h3{
  color:#ffffff;
  font-weight:700;
  margin-bottom:8px;
}

@media (max-width: 768px) {
  .tw-deal-alert form { flex-direction: column; gap: 12px; }
  .tw-deal-alert input, .tw-deal-alert button { width: 100% !important; }
}
/* =========================================================
   TW EMPFEHLUNG / DEAL SHARE – MOBILE COMPACT FIX
   betrifft: [tw_empfehlung] + [tw_deal_share]
   ========================================================= */
@media (max-width: 720px){

  /* Boxen kompakter */
  .twempf-box{
    max-width: 100% !important;
    padding: 14px !important;
    border-radius: 16px !important;
  }

  .twempf-box h2{
    font-size: 18px !important;
    line-height: 1.2 !important;
    margin-bottom: 8px !important;
  }

  .twempf-note{
    font-size: 13px !important;
    margin-bottom: 10px !important;
  }

  /* Form: alles untereinander, volle Breite */
  .twempf-form{
    display: block !important;
    gap: 0 !important;
  }

  .twempf-input{
    width: 100% !important;
    min-height: 46px !important;
    border-radius: 14px !important;
    margin-bottom: 10px !important;
  }

  .twempf-btn{
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 14px !important;
    font-weight: 900 !important;
  }

  /* Linkbox weniger riesig */
  .twempf-linkbox{
    padding: 12px !important;
    border-radius: 14px !important;
  }
  .twempf-linkbox .val{
    font-size: 14px !important;
    line-height: 1.35 !important;
  }

  /* Actions: Buttons untereinander */
  .twempf-actions{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .twempf-actions a,
  .twempf-actions button{
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 14px !important;
    justify-content: center !important;
  }

  /* Deal Share Block: Abstände runter */
  .twempf-wa,
  .twempf-copy{
    padding: 12px 14px !important;
    font-size: 14px !important;
  }

  /* Kleine Texte kompakter */
  .twempf-small{
    font-size: 12px !important;
    line-height: 1.35 !important;
    margin-top: 8px !important;
  }

  /* Fehlermeldungen/OK Meldungen kompakter */
  .twempf-msg{
    padding: 10px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
  }
}
/* =========================================================
   DEAL-ALARM: Mobile einklappbar (Details/Summary)
   ========================================================= */

.tw-fold{
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 14px 30px rgba(0,0,0,.08);
  background:#fff;
  margin:18px 0;
}

.tw-fold__sum{
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  font-weight:1000;
  color:#0b1f3a;
  list-style:none;
  background: linear-gradient(135deg, rgba(255,212,0,.20), rgba(199,0,0,.10));
}

.tw-fold__sum::-webkit-details-marker{ display:none; }

.tw-fold__badge{
  background:#ffd400;
  color:#111;
  font-size:12px;
  font-weight:1000;
  padding:6px 10px;
  border-radius:999px;
  white-space:nowrap;
  box-shadow:0 10px 18px rgba(0,0,0,.12);
}

.tw-fold__body{ padding:14px 16px; }
.tw-fold__text{
  margin:0 0 10px;
  font-size:14px;
  font-weight:650;
  color:rgba(11,31,58,.75);
  line-height:1.45;
}
.tw-fold__small{
  display:block;
  margin-top:10px;
  font-size:12px;
  opacity:.75;
}

/* Mobile: standardmäßig zugeklappt */
@media (max-width: 720px){
  .tw-fold:not([open]) .tw-fold__body{ display:none; }
}

/* FluentForms im Deal-Alarm kompakt */
@media (max-width: 720px){
  .tw-deal-alert .ff-el-group{ margin-bottom:10px !important; }
  .tw-deal-alert input,
  .tw-deal-alert select,
  .tw-deal-alert textarea{
    width:100% !important;
    min-height:48px !important;
    border-radius:14px !important;
    font-size:16px !important;
  }
  .tw-deal-alert .ff-el-form-check label{
    font-size:13px !important;
    line-height:1.4 !important;
  }
  .tw-deal-alert button,
  .tw-deal-alert .ff-btn-submit{
    width:100% !important;
    min-height:52px !important;
    border-radius:16px !important;
    font-weight:1000 !important;
  }
}


/* =========================================================
   FIX: Deal-Alarm als einklappbarer Block (Details) – stabil
   Warum: vorher wurde <details> in .tw-deal-alert verschachtelt und zerlegte das Layout.
   ========================================================= */
.tw-deal-alert--fold{
  text-align: left; /* bessere Lesbarkeit */
}
.tw-deal-alert--fold .tw-fold{
  background: transparent;
  border: 0;
  box-shadow: none;
  margin: 0;
}
.tw-deal-alert--fold .tw-fold__sum{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  list-style:none;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 900;
}
.tw-deal-alert--fold .tw-fold__sum::-webkit-details-marker{ display:none; }

.tw-deal-alert--fold .tw-fold__left{ color:#fff; }
.tw-deal-alert--fold .tw-fold__badge{
  background:#c9a227;
  color:#111;
  font-size:12px;
  font-weight:900;
  padding:6px 10px;
  border-radius:999px;
  white-space:nowrap;
}

.tw-deal-alert--fold .tw-fold__body{
  padding: 12px 2px 0;
}
.tw-deal-alert--fold .tw-fold__text{
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.45;
  color: rgba(255,255,255,.92);
}
.tw-deal-alert--fold .tw-fold__small{
  display:block;
  margin-top:10px;
  font-size:12px;
  opacity:.85;
  color: rgba(255,255,255,.85);
}

/* Mobile: Box weniger hoch + standardmäßig zugeklappt */
@media (max-width: 720px){
  .tw-deal-alert{
    padding: 16px !important;
    margin: 18px 0 !important;
  }

  /* geschlossen: nur Summary sichtbar */
  #tw-deal-alarm:not([open]) .tw-fold__body{ display:none; }

  /* FluentForms in Deal-Alarm: kompakt */
  .tw-deal-alert .ff-el-group{ margin-bottom:10px !important; }
  .tw-deal-alert input,
  .tw-deal-alert select,
  .tw-deal-alert textarea{
    width:100% !important;
    min-height:48px !important;
    border-radius:14px !important;
    font-size:16px !important;
  }
  .tw-deal-alert .ff-el-form-check label{
    font-size:13px !important;
    line-height:1.4 !important;
  }
  .tw-deal-alert button,
  .tw-deal-alert .ff-btn-submit{
    width:100% !important;
    min-height:50px !important;
    border-radius:14px !important;
    font-weight:1000 !important;
  }
}

/* =========================================================
   FIX: [tw_deal_share] / [tw_empfehlung] unten – Button zu groß
   (dein Template steckt es in .tw-live-search, die zentriert/paddet)
   ========================================================= */
@media (max-width: 720px){
  /* Wrapper weniger wuchtig, damit unten nicht "mega" wird */
  .tw-live-search{
    padding: 12px !important;
    margin-top: 14px !important;
  }

  /* Empfehlungsbox in der Sidebar/unteren Box nicht riesig */
  .tw-live-search .twempf-box{
    padding: 12px !important;
    border-radius: 14px !important;
  }

  /* Button kleiner, aber noch gut klickbar */
  .tw-live-search .twempf-actions a,
  .tw-live-search .twempf-actions button{
    min-height: 44px !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
    border-radius: 14px !important;
  }

  /* Falls Plugin einen großen "Hauptbutton" nutzt */
  .tw-live-search .twempf-btn{
    min-height: 44px !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
    border-radius: 14px !important;
  }
}
/* =========================================================
   TW EMPFEHLUNG: "CODE HOLEN" Formular auf Mobile kompakt
   ========================================================= */
@media (max-width: 720px){

  /* Box insgesamt weniger wuchtig */
  .twempf-box{
    padding: 14px !important;
    border-radius: 16px !important;
  }

  /* Headline & Text kleiner */
  .twempf-box h2{
    font-size: 18px !important;
    line-height: 1.2 !important;
    margin: 0 0 8px !important;
  }
  .twempf-note{
    font-size: 13px !important;
    line-height: 1.35 !important;
    margin: 0 0 10px !important;
  }

  /* Formular: 1 Spalte */
  .twempf-form{
    display: block !important;
    margin-top: 8px !important;
  }

  .twempf-input{
    width: 100% !important;
    min-height: 46px !important;
    padding: 12px !important;
    border-radius: 14px !important;
    margin: 0 0 10px !important;
    font-size: 16px !important; /* iOS zoom prevention */
  }

  .twempf-btn{
    width: 100% !important;
    min-height: 48px !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    font-size: 15px !important;
    font-weight: 900 !important;
  }

  /* Der "Hinweis-Text" unter dem Formular (falls vorhanden) */
  .twempf-small{
    font-size: 12px !important;
    line-height: 1.35 !important;
    margin-top: 8px !important;
  }

  /* WICHTIG: falls irgendwo riesige Margins/Paddings reinfunken */
  .twempf-box *{
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}