:root {
  --sky: #4DB2FF;
  --ocean: #0057D6;
  --sun: #FFC629;
  --orange: #FF8A3C;
  --green: #5BB318;
  --sand: #F6EAD3;
  --cloud: #E9F5FF;
  --navy: #062B67;
  --ink: #17324D;
  --muted: #5E7184;
  --white: #FFFFFF;
  --line: #D8E6F2;
  --shadow: 0 14px 38px rgba(6,43,103,.10);
  --radius: 20px;
  --display: "Baloo 2", "Trebuchet MS", system-ui, sans-serif;
  --body: "Nunito", Arial, system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--body);
  color: var(--ink);
  background: linear-gradient(180deg, #fff 0, #fff 68%, #f8fbfe 100%);
  line-height: 1.6;
  padding-bottom: 0;
}
a { color: inherit; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
.shell { width: min(1180px, calc(100% - 36px)); margin-inline: auto; }

.skip-link { position: fixed; left: 14px; top: -80px; z-index: 200; background: var(--navy); color: white; padding: 10px 14px; border-radius: 8px; }
.skip-link:focus { top: 14px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(216,230,242,.9);
}
.header-inner { min-height: 86px; display: grid; grid-template-columns: 190px 1fr auto; gap: 22px; align-items: center; }
.brand { align-self: stretch; display: flex; align-items: center; overflow: hidden; }
.brand img { width: 178px; height: auto; transform: translateY(2px); }
.primary-nav { display: flex; align-items: center; justify-content: center; gap: 3px; }
.nav-item { position: relative; }
.nav-item > a { text-decoration: none; display: block; padding: 12px 11px; font-weight: 800; color: var(--navy); border-radius: 12px; white-space: nowrap; }
.nav-item > a:hover, .nav-item.is-active > a { background: var(--cloud); color: var(--ocean); }
.mega-menu { display: none; position: absolute; top: calc(100% + 8px); left: 0; min-width: 255px; background: white; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: 9px; }
.mega-menu::before { content: ""; position: absolute; top: -10px; left: 0; right: 0; height: 12px; }
.mega-menu a { display: block; text-decoration: none; padding: 10px 12px; border-radius: 10px; color: var(--ink); font-weight: 700; }
.mega-menu a:hover { background: var(--cloud); color: var(--ocean); }
.nav-item:hover .mega-menu, .nav-item:focus-within .mega-menu { display: block; }
.header-actions { display: flex; align-items: center; gap: 10px; }
.search-trigger { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: white; color: var(--navy); font-size: 25px; cursor: pointer; }
.menu-toggle { display: none; }

.button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 44px; padding: 10px 18px; text-decoration: none; font-weight: 900; border-radius: 999px; border: 2px solid transparent; transition: transform .15s ease, box-shadow .15s ease; }
.button:hover { transform: translateY(-1px); box-shadow: 0 8px 22px rgba(6,43,103,.14); }
.button-primary { color: white; background: linear-gradient(135deg, var(--orange), #ff6f1e); }
.button-secondary { color: var(--ocean); background: white; border-color: var(--ocean); }
.header-cta { white-space: nowrap; }

.hero-shell { display: grid; grid-template-columns: 1.02fr .98fr; gap: 36px; align-items: center; padding-block: 64px 44px; }
.eyebrow { color: var(--ocean); font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 900; margin: 0 0 8px; }
h1, h2, h3 { font-family: var(--display); color: var(--navy); letter-spacing: -.025em; }
h1 { font-size: clamp(2.35rem, 6vw, 4.8rem); line-height: .98; margin: 0 0 18px; }
h2 { font-size: clamp(1.7rem, 3vw, 2.45rem); line-height: 1.1; margin: 0; }
.lead { font-size: clamp(1.05rem, 2vw, 1.3rem); color: var(--muted); max-width: 700px; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; }
.hero-brand-card { background: radial-gradient(circle at 70% 20%, #fff8d3 0, #eaf7ff 45%, #fff 80%); border-radius: 34px; box-shadow: var(--shadow); padding: 20px; min-height: 390px; display: grid; place-items: center; overflow: hidden; }
.hero-brand-card img { width: 100%; max-width: 630px; }
.build-note { display: inline-flex; margin-top: 24px; padding: 7px 11px; background: #eff9e8; color: #417c17; border-radius: 999px; font-size: .88rem; font-weight: 800; }

.quick-paths { padding-block: 24px 70px; }
.section-heading { margin-bottom: 20px; }
.card-grid { display: grid; gap: 16px; }
.card-grid-4 { grid-template-columns: repeat(4, 1fr); }
.card-grid-3 { grid-template-columns: repeat(3, 1fr); }
.path-card, .route-card { text-decoration: none; background: white; border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: 0 8px 28px rgba(6,43,103,.06); transition: .15s ease; }
.path-card:hover, .route-card:hover { transform: translateY(-3px); border-color: #a9cfef; box-shadow: var(--shadow); }
.path-card > span { font-size: 1.65rem; display: block; }
.path-card strong, .route-card strong { display: block; color: var(--navy); font-size: 1.04rem; margin-top: 10px; }
.path-card small, .route-card small { color: var(--muted); display: block; margin-top: 3px; }
.path-card-commercial { background: linear-gradient(135deg, #fff7e7, #fff); border-color: #ffd68d; }

.page-shell { padding-block: 34px 76px; min-height: 62vh; }
.breadcrumbs { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: .9rem; color: var(--muted); margin-bottom: 36px; }
.breadcrumbs a { color: var(--ocean); text-decoration: none; font-weight: 800; }
.page-intro { display: grid; grid-template-columns: 76px 1fr; gap: 20px; align-items: start; max-width: 880px; }
.page-icon { width: 68px; aspect-ratio: 1; display: grid; place-items: center; background: var(--cloud); border-radius: 20px; font-size: 2rem; }
.page-intro h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
.conversion-strip { display: flex; gap: 20px; align-items: center; justify-content: space-between; margin: 34px 0; padding: 20px 22px; border-radius: 18px; background: linear-gradient(120deg, #fff7e8, #fff); border: 1px solid #ffd693; }
.conversion-strip strong, .conversion-strip span { display: block; }
.conversion-strip span { color: var(--muted); margin-top: 2px; }
.route-list { margin-top: 34px; }
.route-card { min-height: 170px; }
.route-card-icon { font-size: 1.7rem; }
.content-placeholder, .notice { margin-top: 34px; border: 1px dashed #aac9e2; background: #f7fbff; border-radius: 18px; padding: 28px; max-width: 900px; }
.content-placeholder h2 { margin-bottom: 8px; }
.notice-info { border-style: solid; }

.search-panel { position: fixed; inset: 0; z-index: 180; background: rgba(2,22,50,.54); padding: 8vh 18px; opacity: 0; transition: opacity .18s ease; }
.search-panel.is-open { opacity: 1; }
.search-dialog { background: white; max-width: 820px; border-radius: 26px; padding: 26px; box-shadow: 0 28px 80px rgba(2,22,50,.28); }
.search-head { display: flex; justify-content: space-between; gap: 18px; }
.search-head h2 { margin-top: 0; }
.search-close { border: 0; background: var(--cloud); color: var(--navy); width: 42px; height: 42px; border-radius: 50%; font-size: 1.7rem; cursor: pointer; }
.search-field span { display: block; font-size: .9rem; font-weight: 800; color: var(--muted); margin-bottom: 6px; }
.search-field input { width: 100%; border: 2px solid #c8ddec; border-radius: 14px; padding: 13px 14px; font-size: 1.05rem; outline: 0; }
.search-field input:focus { border-color: var(--ocean); box-shadow: 0 0 0 4px rgba(0,87,214,.09); }
.search-results { display: grid; margin-top: 14px; gap: 7px; max-height: 45vh; overflow: auto; }
.search-results a { text-decoration: none; padding: 11px 12px; border-radius: 12px; background: #f8fbfe; }
.search-results a:hover { background: var(--cloud); }
.search-results strong, .search-results small { display: block; }
.search-results small { color: var(--muted); }
.search-hint { color: var(--muted); }

.site-footer { background: var(--navy); color: white; padding: 52px 0 86px; }
.footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 34px; }
.footer-grid h2 { color: white; font-family: var(--body); font-size: 1rem; margin: 0 0 10px; }
.footer-grid a, .footer-link-button { color: #dcecff; text-decoration: none; display: block; margin: 8px 0; background: none; border: 0; padding: 0; text-align: left; }
.footer-grid a:hover { color: white; text-decoration: underline; }
.footer-link-button:disabled { opacity: .55; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.16); margin-top: 34px; padding-top: 22px; color: #c8dcf3; display: flex; justify-content: space-between; gap: 24px; font-size: .9rem; }
.affiliate-note { max-width: 640px; text-align: right; }
.mobile-action-bar { display: none; }

@media (max-width: 1050px) {
  .header-inner { grid-template-columns: 170px 1fr auto; gap: 10px; }
  .nav-item > a { padding-inline: 7px; font-size: .93rem; }
  .header-cta { padding-inline: 14px; }
  .card-grid-4 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px) {
  body { padding-bottom: 68px; }
  .site-header { position: sticky; }
  .header-inner { grid-template-columns: 1fr auto auto; min-height: 72px; }
  .brand img { width: 150px; }
  .menu-toggle { display: inline-flex; align-items: center; gap: 7px; grid-column: 2; grid-row: 1; border: 1px solid var(--line); background: white; color: var(--navy); border-radius: 12px; padding: 9px 12px; font-weight: 900; }
  .primary-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: white; border-bottom: 1px solid var(--line); box-shadow: var(--shadow); padding: 12px 18px 18px; }
  .primary-nav.is-open { display: block; }
  .nav-item > a { padding: 12px; }
  .mega-menu { position: static; display: grid; box-shadow: none; border: 0; background: #f8fbfe; margin: 0 0 8px 12px; }
  .nav-item:hover .mega-menu { display: grid; }
  .header-actions { grid-column: 3; grid-row: 1; }
  .header-cta { display: none; }
  .hero-shell { grid-template-columns: 1fr; padding-top: 42px; }
  .hero-brand-card { min-height: auto; }
  .card-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-bottom { display: block; }
  .affiliate-note { text-align: left; }
  .mobile-action-bar { display: grid; grid-template-columns: repeat(3, 1fr); position: fixed; z-index: 120; left: 10px; right: 10px; bottom: 10px; background: white; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 18px 42px rgba(2,22,50,.20); overflow: hidden; }
  .mobile-action-bar a { text-decoration: none; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 54px; font-size: .72rem; font-weight: 900; color: var(--navy); }
  .mobile-action-bar a span:first-child { font-size: 1.1rem; }
  .mobile-action-bar .is-commercial { color: white; background: linear-gradient(135deg, var(--orange), #ff6f1e); }
}

@media (max-width: 620px) {
  .shell { width: min(100% - 24px, 1180px); }
  .brand img { width: 134px; }
  .search-trigger { width: 40px; height: 40px; }
  .hero-shell { gap: 22px; }
  .hero-brand-card { padding: 8px; border-radius: 24px; }
  .card-grid-4, .card-grid-3 { grid-template-columns: 1fr; }
  .page-intro { grid-template-columns: 1fr; }
  .conversion-strip { align-items: stretch; flex-direction: column; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
}

/* =========================================================
   STUFE 3 – DESIGN SYSTEM 1.0
   ========================================================= */
:root {
  --commercial: #FF7A21;
  --commercial-dark: #E95F05;
  --surface: #FFFFFF;
  --surface-soft: #F7FBFF;
  --surface-warm: #FFF9EF;
  --success-soft: #EFF8E9;
  --focus: #7CC7FF;
  --shadow-sm: 0 8px 24px rgba(6,43,103,.07);
  --shadow-md: 0 18px 48px rgba(6,43,103,.12);
  --shadow-lg: 0 30px 80px rgba(6,43,103,.16);
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --space-1: .4rem;
  --space-2: .75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
}

body { background: #fff; }
a, button, select, input { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.section-space { padding-block: clamp(54px, 7vw, 92px); }
.section-space-tight { padding-top: clamp(38px, 5vw, 68px); padding-bottom: clamp(44px, 6vw, 76px); }
.section-heading p { margin: 9px 0 0; color: var(--muted); max-width: 700px; }
.section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 28px; }
.section-heading-narrow { max-width: 660px; margin-bottom: 28px; }
.text-link { color: var(--ocean); text-decoration: none; font-weight: 900; white-space: nowrap; }
.text-link:hover { text-decoration: underline; }
.brand-kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--ocean); background: var(--cloud); border: 1px solid #cbe8ff; border-radius: 999px; padding: 7px 12px; font-size: .88rem; font-weight: 900; margin-bottom: 18px; }
.brand-kicker::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 4px rgba(255,198,41,.18); }
.button-lg { min-height: 50px; padding: 12px 22px; }
.button-commercial { color: white; background: linear-gradient(135deg, var(--commercial), #FF9A37); box-shadow: 0 8px 20px rgba(255,122,33,.22); }
.button-commercial:hover { box-shadow: 0 14px 30px rgba(255,122,33,.28); }
.button-outline { color: var(--navy); background: white; border-color: #B7D6EC; }
.button-light { color: var(--navy); background: white; border-color: white; }
.eyebrow-light { color: #DFF2FF; }

/* =========================================================
   STUFE 4 – STARTSEITE
   ========================================================= */
.home-hero { overflow: hidden; background: radial-gradient(circle at 12% 15%, rgba(77,178,255,.14), transparent 32%), linear-gradient(180deg, #fff 0%, #fbfdff 100%); }
.home-hero-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(420px, 1.05fr); gap: clamp(34px, 5vw, 74px); align-items: center; }
.home-hero-copy h1 { max-width: 720px; font-size: clamp(3rem, 6vw, 5.5rem); }
.home-hero-lead { max-width: 700px; font-size: clamp(1.1rem, 1.7vw, 1.34rem); }
.hero-proof { margin-top: 28px; display: flex; gap: 18px; flex-wrap: wrap; color: var(--muted); font-size: .92rem; font-weight: 800; }
.hero-proof span { display: inline-flex; align-items: center; gap: 6px; }
.hero-proof b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--success-soft); color: #3E8617; }
.home-hero-visual { min-width: 0; }
.travel-visual { position: relative; isolation: isolate; min-height: 520px; overflow: hidden; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); border: 1px solid #dceaf5; background: #DFF3FF; }
.visual-sky { position: absolute; inset: 0 0 35%; z-index: -5; background: linear-gradient(180deg, #55B9FF 0%, #DDF5FF 85%); }
.visual-sun { position: absolute; width: 120px; height: 120px; border-radius: 50%; right: 9%; top: 9%; z-index: -4; background: #FFD34A; box-shadow: 0 0 0 20px rgba(255,211,74,.13); }
.visual-mountains { position: absolute; inset: auto -8% 24% 22%; height: 47%; z-index: -3; background: linear-gradient(145deg, transparent 0 31%, #D6E7EC 31% 48%, #6FA5C5 48% 55%, transparent 55%), linear-gradient(35deg, transparent 0 31%, #E8F2F5 31% 49%, #4D8EBA 49% 56%, transparent 56%); opacity: .95; }
.visual-water { position: absolute; inset: 57% 0 0; z-index: -2; background: linear-gradient(180deg, #35B8E7 0%, #0980BF 58%, #0872AD 100%); }
.visual-water::before, .visual-water::after { content: ""; position: absolute; left: -10%; width: 120%; height: 38px; border-radius: 50%; border-top: 7px solid rgba(255,255,255,.88); }
.visual-water::before { top: 18%; transform: rotate(-2deg); }
.visual-water::after { top: 51%; transform: rotate(2deg); opacity: .58; }
.hero-mascot-logo { position: absolute; z-index: 2; width: min(86%, 650px); left: 50%; bottom: 0; transform: translateX(-50%); filter: drop-shadow(0 12px 22px rgba(2,31,70,.18)); }
.visual-card { position: absolute; z-index: 3; display: grid; gap: 1px; min-width: 145px; padding: 10px 13px; border-radius: 14px; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); box-shadow: var(--shadow-sm); border: 1px solid rgba(255,255,255,.8); }
.visual-card span { font-size: .72rem; color: var(--muted); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.visual-card b { color: var(--navy); }
.visual-card-top { left: 5%; top: 8%; }
.visual-card-bottom { right: 4%; bottom: 8%; }
.media-note { margin: 9px 0 0; color: #718598; font-size: .78rem; text-align: right; }

.trust-bar { border-block: 1px solid var(--line); background: #fff; }
.trust-bar-grid { min-height: 92px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: center; }
.trust-bar-grid > div { display: grid; grid-template-columns: 42px 1fr; column-gap: 12px; align-items: center; }
.trust-bar-grid strong, .trust-bar-grid small { display: block; }
.trust-bar-grid strong { color: var(--navy); }
.trust-bar-grid small { color: var(--muted); }
.trust-icon { width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; grid-row: span 2; font-weight: 900; }
.trust-icon-blue { color: var(--ocean); background: var(--cloud); }
.trust-icon-orange { color: #C45000; background: #FFF0E6; }
.trust-icon-green { color: #3E8617; background: #EFF8E9; }

.finder-section { background: linear-gradient(180deg, #F7FBFF, #fff); }
.finder-layout { border: 1px solid #D7EAF7; border-radius: var(--radius-xl); padding: clamp(26px, 4vw, 46px); background: white; box-shadow: var(--shadow-md); }
.mini-finder { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 12px; align-items: end; }
.form-field span { display: block; margin: 0 0 7px; font-size: .83rem; color: var(--muted); font-weight: 900; }
.form-field select { width: 100%; min-height: 50px; border: 1.5px solid #BED7E9; border-radius: 14px; padding: 0 42px 0 13px; color: var(--navy); background: white; font-weight: 800; outline: none; }
.form-field select:focus { border-color: var(--ocean); box-shadow: 0 0 0 4px rgba(0,87,214,.08); }
.finder-submit { min-height: 50px; border: 0; cursor: pointer; }
.finder-result { margin-top: 20px; border-radius: 18px; background: var(--surface-soft); border: 1px solid #D9EAF5; padding: 18px; }
.finder-result h3 { margin: 0 0 10px; font-size: 1.3rem; }
.finder-result-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.finder-result a { display: block; padding: 12px; border-radius: 13px; background: white; border: 1px solid var(--line); text-decoration: none; color: var(--navy); font-weight: 900; }
.finder-result small { display: block; color: var(--muted); font-weight: 700; margin-top: 3px; }

.category-section { background: white; }
.category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.category-card { position: relative; display: grid; grid-template-columns: 86px 1fr; gap: 16px; align-items: center; min-height: 170px; padding: 20px; background: white; border: 1px solid var(--line); border-radius: 22px; text-decoration: none; box-shadow: var(--shadow-sm); overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.category-card::after { content: ""; position: absolute; right: -28px; bottom: -32px; width: 110px; height: 110px; border-radius: 50%; opacity: .10; background: currentColor; }
.category-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.category-card img { width: 78px; height: 78px; }
.category-card h3 { margin: 0 0 4px; font-size: 1.25rem; }
.category-card p { margin: 0 0 9px; color: var(--muted); font-size: .9rem; line-height: 1.45; }
.category-card .card-link { color: var(--ocean); font-weight: 900; font-size: .88rem; }
.accent-blue { color: var(--ocean); }
.accent-green { color: var(--green); }
.accent-orange { color: var(--orange); }
.accent-yellow { color: #D89B00; }

.destinations-section { background: #F9FCFF; }
.destination-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.destination-card { background: white; border-radius: 24px; overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.destination-media { position: relative; height: 220px; display: block; overflow: hidden; text-decoration: none; }
.destination-media::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 75% 16%, rgba(255,255,255,.55) 0 8%, transparent 9%), linear-gradient(180deg, transparent 45%, rgba(3,32,65,.16)); }
.destination-wave { position: absolute; left: -8%; right: -8%; bottom: -44px; height: 115px; border-radius: 48% 52% 0 0 / 45% 55% 0 0; background: rgba(255,255,255,.22); transform: rotate(-3deg); }
.destination-visual-label { position: absolute; left: 16px; top: 16px; padding: 6px 9px; border-radius: 999px; background: rgba(255,255,255,.86); color: var(--navy); font-size: .75rem; font-weight: 900; backdrop-filter: blur(7px); }
.tone-sea { background: linear-gradient(145deg, #52C8F3 0 44%, #0B8CC9 45% 67%, #F8DDA1 68%); }
.tone-sunset { background: linear-gradient(145deg, #FFB45A 0 38%, #FF8248 39% 54%, #1FA5D7 55% 74%, #F6E2A8 75%); }
.tone-mediterranean { background: linear-gradient(145deg, #42B6EE 0 48%, #137EB7 49% 68%, #F6E9C9 69%); }
.tone-volcano { background: linear-gradient(145deg, #89D6F3 0 45%, #4B6578 46% 64%, #D79C61 65% 76%, #1697BF 77%); }
.tone-mountain { background: linear-gradient(145deg, #93D9F5 0 41%, #E5F3F8 42% 51%, #638A9F 52% 67%, #7EBB55 68%); }
.tone-coast { background: linear-gradient(145deg, #96DDF7 0 43%, #2797C8 44% 63%, #F4E5BD 64% 74%, #B7D46E 75%); }
.destination-body { padding: 18px 19px 20px; }
.destination-kicker { margin: 0 0 2px; color: var(--muted); font-size: .82rem; font-weight: 800; }
.destination-body h3 { margin: 0 0 14px; font-size: 1.45rem; }
.destination-body h3 a { text-decoration: none; color: var(--navy); }
.destination-actions { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.offer-link { color: var(--commercial-dark); font-size: .86rem; font-weight: 900; text-decoration: none; text-align: right; }
.offer-link:hover { text-decoration: underline; }

.commercial-section { background: linear-gradient(135deg, #0063D8 0%, #0A4AA4 65%, #062B67 100%); color: white; }
.commercial-shell { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(30px, 6vw, 80px); align-items: center; }
.commercial-copy h2 { color: white; font-size: clamp(2rem, 4vw, 3.4rem); max-width: 760px; }
.commercial-copy p { color: #DDEEFF; max-width: 760px; font-size: 1.04rem; }
.commercial-actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-top: 24px; }
.partner-ready { color: #CFE9FF; font-size: .84rem; font-weight: 800; }
.compare-widget-placeholder { background: white; color: var(--ink); border-radius: 24px; padding: 22px; box-shadow: 0 26px 70px rgba(0,0,0,.18); }
.compare-widget-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 18px; }
.compare-widget-head span { color: var(--muted); font-size: .82rem; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.compare-widget-head b { color: var(--navy); font-size: 1.2rem; }
.compare-widget-fields { display: grid; gap: 8px; }
.compare-widget-fields span { border: 1px solid var(--line); border-radius: 11px; padding: 10px 12px; color: #678; font-size: .88rem; }
.compare-widget-button { margin-top: 10px; border-radius: 12px; padding: 11px; text-align: center; background: linear-gradient(135deg, var(--commercial), #FF9A37); color: white; font-weight: 900; }
.compare-widget-placeholder small { display: block; color: var(--muted); margin-top: 9px; text-align: center; }

.family-section { background: white; }
.family-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.family-card { display: grid; place-items: center; text-align: center; min-height: 150px; padding: 16px 10px; border-radius: 20px; border: 1px solid var(--line); background: white; box-shadow: var(--shadow-sm); text-decoration: none; }
.family-card > span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--cloud); color: var(--ocean); font-size: 1.25rem; font-weight: 900; }
.family-card strong { color: var(--navy); margin-top: 9px; }
.family-card small { color: var(--muted); margin-top: 2px; font-size: .77rem; }
.family-card:hover { border-color: #B9D9EE; transform: translateY(-2px); }

.season-section { background: var(--surface-warm); }
.season-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.season-card { min-height: 190px; padding: 22px; border-radius: 22px; border: 1px solid rgba(255,255,255,.8); box-shadow: var(--shadow-sm); text-decoration: none; display: flex; flex-direction: column; align-items: flex-start; }
.season-card strong { color: var(--navy); font-size: 1.25rem; margin-top: 18px; }
.season-card small { color: #4E6478; margin-top: 4px; flex: 1; }
.season-card b { color: var(--navy); font-size: .87rem; margin-top: 18px; }
.season-dot { width: 35px; height: 35px; border-radius: 50%; background: white; box-shadow: inset 0 0 0 8px rgba(255,255,255,.45); }
.tone-sun { background: linear-gradient(145deg, #FFF1A8, #FFD15B); }
.tone-autumn { background: linear-gradient(145deg, #FFE0B8, #FFB46A); }
.tone-warm { background: linear-gradient(145deg, #CDEFFF, #74CCEF); }
.tone-october { background: linear-gradient(145deg, #E9F7D8, #B9DB7F); }

.guide-section { background: white; }
.guide-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.guide-card { position: relative; min-height: 230px; padding: 22px; border-radius: 22px; border: 1px solid var(--line); background: linear-gradient(180deg, #fff, #fbfdff); text-decoration: none; box-shadow: var(--shadow-sm); }
.guide-number { color: var(--sky); font-family: var(--display); font-size: 2rem; font-weight: 900; }
.guide-card h3 { margin: 12px 0 7px; font-size: 1.25rem; }
.guide-card p { margin: 0; color: var(--muted); font-size: .9rem; }
.guide-card b { position: absolute; bottom: 20px; left: 22px; color: var(--ocean); font-size: .86rem; }

.final-cta-section { background: linear-gradient(180deg, #F7FBFF, #fff); }
.final-cta { display: grid; grid-template-columns: 120px 1fr auto; gap: 26px; align-items: center; padding: 24px 28px; border: 1px solid #D5E9F7; border-radius: 28px; background: white; box-shadow: var(--shadow-md); }
.final-cta img { width: 110px; height: 100px; object-fit: cover; object-position: center top; border-radius: 50%; background: var(--cloud); }
.final-cta h2 { font-size: clamp(1.6rem, 2.8vw, 2.3rem); }
.final-cta p { margin: 6px 0 0; color: var(--muted); max-width: 760px; }

@media (max-width: 1080px) {
  .home-hero-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .travel-visual { min-height: 470px; }
  .mini-finder { grid-template-columns: repeat(2, 1fr); }
  .finder-submit { grid-column: span 2; }
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .family-grid { grid-template-columns: repeat(3, 1fr); }
  .guide-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px) {
  .home-hero-grid { grid-template-columns: 1fr; }
  .home-hero-copy { text-align: left; }
  .home-hero-visual { max-width: 680px; width: 100%; margin-inline: auto; }
  .trust-bar-grid { grid-template-columns: 1fr; padding-block: 18px; gap: 12px; }
  .trust-bar-grid > div { min-height: 50px; }
  .commercial-shell { grid-template-columns: 1fr; }
  .destination-grid { grid-template-columns: repeat(2, 1fr); }
  .season-grid { grid-template-columns: repeat(2, 1fr); }
  .final-cta { grid-template-columns: 90px 1fr; }
  .final-cta img { width: 82px; height: 82px; }
  .final-cta .button { grid-column: 1 / -1; }
}

@media (max-width: 650px) {
  .section-space { padding-block: 50px; }
  .home-hero-copy h1 { font-size: clamp(2.7rem, 15vw, 4rem); }
  .travel-visual { min-height: 390px; border-radius: 26px; }
  .visual-card { display: none; }
  .media-note { text-align: left; }
  .mini-finder { grid-template-columns: 1fr; }
  .finder-submit { grid-column: auto; }
  .finder-result-list { grid-template-columns: 1fr; }
  .section-heading-row { display: block; }
  .section-heading-row > .text-link { display: inline-flex; margin-top: 14px; }
  .category-grid, .destination-grid, .season-grid, .guide-grid { grid-template-columns: 1fr; }
  .category-card { grid-template-columns: 72px 1fr; min-height: 150px; padding: 17px; }
  .category-card img { width: 66px; height: 66px; }
  .destination-media { height: 190px; }
  .family-grid { grid-template-columns: repeat(2, 1fr); }
  .commercial-section { padding-block: 58px; }
  .final-cta { grid-template-columns: 1fr; text-align: left; }
  .final-cta img { width: 88px; height: 88px; }
}

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

/* CHECK24 Pauschalreise-Vergleichsrechner */
.affiliate-widget {
  margin-top: 2rem;
  border: 1px solid rgba(11, 61, 145, .14);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(11, 61, 145, .09);
  padding: clamp(1rem, 2.5vw, 2rem);
}
.affiliate-widget-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.25rem;
}
.affiliate-widget-head h2 { margin: .25rem 0 .4rem; }
.affiliate-widget-head p { margin: 0; max-width: 70ch; }
.affiliate-label {
  flex: 0 0 auto;
  border-radius: 999px;
  background: #f6ead3;
  color: #5e4918;
  font-size: .78rem;
  font-weight: 800;
  padding: .45rem .7rem;
}
.check24-desktop-widget {
  width: 100%;
  min-height: 680px;
  overflow: visible;
}
.check24-mobile-fallback {
  display: none;
  padding: 1.2rem;
  border-radius: 18px;
  background: #e9f5ff;
  color: #0b3d91;
}
.check24-mobile-fallback p { margin-bottom: 0; }
.affiliate-disclosure {
  margin: 1rem 0 0;
  color: #5f6673;
  font-size: .86rem;
}
.conversion-followup { margin-top: 1.5rem; }
@media (max-width: 1000px) {
  .check24-desktop-widget { display: none; }
  .check24-mobile-fallback { display: block; }
  .affiliate-widget-head { flex-direction: column; }
}

/* CHECK24 Pauschalreise Billboard-Kurzrechner */
.check24-short-widget { width: 100%; }
.check24-short-widget-frame { width: 100%; min-height: 200px; overflow: hidden; border-radius: 18px; background: #fff; }
.check24-short-widget.is-compact .check24-short-widget-frame { border-radius: 14px; }
.home-check24-short { min-width: 0; }
.home-check24-short .check24-short-widget-frame { box-shadow: 0 20px 55px rgba(0, 31, 88, .22); }
.affiliate-disclosure-light { display: block; margin-top: 10px; color: #dfeeff; opacity: .95; }
.check24-mobile-short { display: none; }
.check24-mobile-intro { margin: 0 0 12px; color: var(--ink, #10284a); }
@media (max-width: 993px) {
  .check24-desktop-widget { display: none; }
  .check24-mobile-fallback { display: none; }
  .check24-mobile-short { display: block; }
}

/* =========================================================
   Phase 5 + 6: redaktionelle Seitentemplates & Familien-Check
   ========================================================= */
.editorial-template,
.methodology-page { padding-bottom: clamp(56px, 8vw, 96px); }

.compact-page-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr);
  gap: clamp(24px, 5vw, 56px);
  align-items: center;
  margin: 20px 0 34px;
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, #fff 0%, #f7fbff 68%, #e9f5ff 100%);
  box-shadow: var(--shadow-sm);
}
.compact-page-copy h1 { margin: 2px 0 10px; font-size: clamp(2.05rem, 4.5vw, 4rem); line-height: 1.02; }
.compact-page-copy .lead { max-width: 820px; margin-bottom: 10px; }
.template-note { max-width: 780px; color: var(--muted); margin: 0; }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.compact-page-visual {
  min-height: 220px;
  border-radius: 24px;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  background: linear-gradient(145deg, #bde9ff, #60bced 52%, #f6df9f 53%);
  color: var(--navy);
  overflow: hidden;
}
.compact-page-visual span { font-size: 3rem; }
.compact-page-visual b { font-family: var(--display); font-size: 1.2rem; margin-top: 6px; }
.compact-page-visual small { margin-top: 2px; font-weight: 800; opacity: .75; }

.template-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 32px; align-items: start; }
.template-content { min-width: 0; }
.editorial-section {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 14px;
  padding: 30px 0;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 110px;
}
.editorial-section:first-child { padding-top: 8px; }
.section-index {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: var(--cloud);
  color: var(--ocean);
  font-weight: 900;
  font-size: .78rem;
}
.editorial-section h2 { margin: 1px 0 7px; font-size: clamp(1.45rem, 2.4vw, 2.05rem); }
.editorial-section p { color: var(--muted); margin: 0; max-width: 760px; }
.content-skeleton { display: grid; gap: 7px; margin-top: 16px; max-width: 720px; }
.content-skeleton span { height: 8px; border-radius: 999px; background: #eef3f6; }
.content-skeleton span:nth-child(2) { width: 92%; }
.content-skeleton span:nth-child(3) { width: 71%; }

.template-sidebar { position: sticky; top: 96px; display: grid; gap: 16px; }
.sidebar-card { padding: 18px; border-radius: 18px; border: 1px solid var(--line); background: white; box-shadow: var(--shadow-sm); }
.sidebar-card > strong { display: block; color: var(--navy); margin-bottom: 10px; }
.sidebar-card > a:not(.button) { display: block; color: var(--ink); text-decoration: none; padding: 7px 0; border-top: 1px solid #edf2f5; font-size: .86rem; font-weight: 800; }
.sidebar-card > a:not(.button):hover { color: var(--ocean); }
.sidebar-commercial { background: #fff8f2; border-color: #ffd8bd; }
.sidebar-commercial p { color: var(--muted); font-size: .85rem; }
.button-block { width: 100%; justify-content: center; }
.affiliate-label { display: inline-block; font-size: .68rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; color: #9d4d12; margin-bottom: 7px; }
.inline-conversion-card { display: flex; gap: 22px; justify-content: space-between; align-items: center; margin: 24px 0; padding: 22px; border-radius: 20px; background: #fff6ef; border: 1px solid #ffd4b6; }
.inline-conversion-card h3 { margin: 0 0 4px; }
.inline-conversion-card p { color: var(--muted); margin: 0; }

.family-check { margin: 0 0 38px; padding: clamp(22px, 4vw, 34px); border: 1px solid #d8e9f6; border-radius: 26px; background: #f8fcff; }
.family-check-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.family-check-head h2 { margin: 0 0 5px; font-size: clamp(1.65rem, 3vw, 2.45rem); }
.family-check-head p:not(.eyebrow) { margin: 0; color: var(--muted); max-width: 720px; }
.family-check-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.family-check-item { min-height: 126px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: white; }
.family-check-label { display: flex; align-items: center; gap: 8px; color: var(--navy); }
.family-check-icon { width: 32px; height: 32px; border-radius: 10px; background: var(--cloud); display: grid; place-items: center; }
.family-check-item small { display: block; margin-top: 7px; color: var(--muted); font-size: .75rem; }
.rating-dots { display: flex; gap: 5px; margin-top: 13px; }
.rating-dots span { width: 18px; height: 8px; border-radius: 999px; background: #e4ebef; }
.rating-dots span.is-on { background: var(--green); }
.rating-pending { margin-top: 13px; padding: 6px 8px; border-radius: 8px; background: #f1f4f6; color: #667a89; font-size: .76rem; font-weight: 900; text-align: center; }
.family-check-item.is-unrated { background: #fcfdfe; }

.methodology-hero { margin: 20px 0 46px; padding: clamp(26px, 5vw, 52px); border-radius: 28px; background: linear-gradient(135deg, #eef8ff, #fff 68%); border: 1px solid #d8eaf6; }
.methodology-hero h1 { margin: 0 0 10px; font-size: clamp(2.2rem, 5vw, 4.5rem); }
.methodology-hero .lead { max-width: 900px; }
.methodology-principles { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 22px; }
.methodology-principles span { padding: 8px 11px; border-radius: 999px; background: white; border: 1px solid #d7e8f4; color: var(--navy); font-size: .82rem; font-weight: 900; }
.method-section { margin: 52px 0; }
.compact-heading { max-width: 820px; margin-bottom: 22px; }
.compact-heading h2 { margin: 0 0 6px; font-size: clamp(1.8rem, 3.5vw, 2.8rem); }
.compact-heading p:not(.eyebrow) { color: var(--muted); }
.scale-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 11px; }
.scale-card { padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: white; box-shadow: var(--shadow-sm); }
.scale-card > strong { display: inline-grid; place-items: center; width: 52px; height: 36px; border-radius: 12px; background: var(--cloud); color: var(--ocean); }
.scale-card h3 { margin: 13px 0 6px; font-size: 1rem; }
.scale-card p { margin: 0; color: var(--muted); font-size: .82rem; }
.criteria-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.criterion-card { padding: 19px; border: 1px solid var(--line); border-radius: 19px; background: white; }
.criterion-title { display: flex; gap: 9px; align-items: center; }
.criterion-title span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: var(--cloud); }
.criterion-title h3 { margin: 0; font-size: 1.1rem; }
.criterion-card > p { color: var(--ink); font-size: .85rem; line-height: 1.45; }
.criterion-card ul { margin: 10px 0 0; padding-left: 18px; color: var(--muted); font-size: .8rem; line-height: 1.55; }
.rules-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.rules-list article { padding: 21px; border-radius: 18px; border: 1px solid var(--line); background: #fbfdff; }
.rules-list strong { color: var(--navy); }
.rules-list p { margin: 7px 0 0; color: var(--muted); }
.independence-box { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: clamp(24px, 4vw, 38px); border-radius: 24px; background: #f4faed; border: 1px solid #d7e9c6; }
.independence-box h2 { margin: 0 0 7px; }
.independence-box p:not(.eyebrow) { max-width: 820px; color: #506347; }
.no-total-score { padding: 32px; border-radius: 24px; background: var(--surface-warm); }

@media (max-width: 980px) {
  .compact-page-hero { grid-template-columns: 1fr; }
  .compact-page-visual { min-height: 170px; }
  .template-layout { grid-template-columns: 1fr; }
  .template-sidebar { position: static; grid-template-columns: repeat(2, 1fr); }
  .family-check-grid, .criteria-grid { grid-template-columns: repeat(2, 1fr); }
  .scale-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 640px) {
  .editorial-template, .methodology-page { padding-bottom: 48px; }
  .compact-page-hero { margin-top: 12px; padding: 20px; border-radius: 20px; }
  .compact-page-copy h1 { font-size: clamp(2rem, 10vw, 2.75rem); }
  .compact-page-visual { min-height: 128px; border-radius: 16px; }
  .compact-page-visual span { font-size: 2.2rem; }
  .compact-page-visual small { font-size: .72rem; }
  .hero-actions .button { width: 100%; justify-content: center; }
  .editorial-section { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 24px 0; }
  .section-index { width: 34px; height: 34px; border-radius: 10px; }
  .template-sidebar { grid-template-columns: 1fr; }
  .inline-conversion-card, .independence-box { align-items: stretch; flex-direction: column; }
  .family-check { padding: 18px; border-radius: 20px; }
  .family-check-head { align-items: flex-start; flex-direction: column; }
  .family-check-grid, .criteria-grid, .rules-list, .scale-grid { grid-template-columns: 1fr; }
  .family-check-item { min-height: 108px; }
  .methodology-hero { margin-top: 12px; padding: 22px; border-radius: 20px; }
  .method-section { margin: 40px 0; }
  .scale-card { min-height: 0; }
}

/* Phase 7: vollständiger Urlaubsfinder */
.finder-page { background: linear-gradient(180deg, #f7fbff 0, #fff 34%); }
.finder-hero { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:32px; align-items:end; margin-bottom:30px; }
.finder-hero h1 { font-size:clamp(2.35rem,5vw,4.2rem); }
.finder-hero-note { padding:20px; border:1px solid #cfe4f5; border-radius:20px; background:#fff; box-shadow:0 10px 28px rgba(6,43,103,.06); }
.finder-hero-note strong,.finder-hero-note span { display:block; }
.finder-hero-note span { margin-top:5px; color:var(--muted); }
.full-finder { background:#fff; border:1px solid var(--line); border-radius:26px; padding:clamp(18px,3vw,32px); box-shadow:var(--shadow); }
.finder-question-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.finder-question { min-width:0; margin:0; padding:18px; border:1px solid var(--line); border-radius:18px; }
.finder-question legend { padding:0 6px; font-weight:900; color:var(--navy); }
.finder-question legend span { display:inline-grid; place-items:center; width:28px; height:28px; margin-right:8px; border-radius:50%; background:var(--cloud); color:var(--ocean); }
.finder-options { display:flex; flex-wrap:wrap; gap:9px; margin-top:10px; }
.finder-options label { cursor:pointer; }
.finder-options input { position:absolute; opacity:0; pointer-events:none; }
.finder-options span { display:inline-flex; padding:9px 12px; border:1px solid #cbddeb; border-radius:999px; background:#fff; font-weight:800; color:var(--ink); }
.finder-options input:checked + span { background:var(--cloud); border-color:var(--ocean); color:var(--ocean); box-shadow:0 0 0 2px rgba(0,87,214,.08); }
.finder-options input:focus-visible + span { outline:3px solid rgba(0,87,214,.25); outline-offset:2px; }
.finder-form-actions { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:22px; }
.finder-form-actions > span { color:var(--muted); font-size:.9rem; }
.finder-results { margin-top:42px; }
.finder-results .section-heading p:last-child { color:var(--muted); max-width:780px; }
.finder-result-cards { display:grid; gap:14px; }
.finder-destination-card { display:grid; grid-template-columns:52px 1fr; gap:16px; padding:20px; background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:0 8px 24px rgba(6,43,103,.05); }
.finder-rank { width:46px; height:46px; border-radius:15px; display:grid; place-items:center; background:var(--cloud); color:var(--ocean); font:900 1.2rem var(--display); }
.finder-destination-copy h3 { margin:0 0 5px; font-size:1.5rem; }
.finder-match-label { margin:0; font-weight:900; color:var(--ink); }
.finder-destination-copy ul { margin:8px 0 14px; padding-left:20px; }
.finder-card-actions { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.finder-card-actions .button { min-height:40px; padding:8px 15px; }
.finder-method-note { margin-top:22px; padding:20px; border-radius:18px; background:#fff9e9; border:1px solid #f3d98d; }
.finder-method-note strong { color:var(--navy); }
.finder-method-note p { margin:5px 0 8px; }
.finder-method-note a,.text-link { color:var(--ocean); font-weight:900; text-decoration:none; }
@media (max-width:860px) { .finder-hero { grid-template-columns:1fr; gap:14px; } .finder-question-grid { grid-template-columns:1fr; } }
@media (max-width:560px) { .full-finder { padding:14px; border-radius:20px; } .finder-question { padding:14px; } .finder-options { display:grid; grid-template-columns:1fr 1fr; } .finder-options span { width:100%; justify-content:center; text-align:center; border-radius:12px; min-height:44px; } .finder-destination-card { grid-template-columns:40px 1fr; padding:16px; } .finder-rank { width:38px; height:38px; border-radius:12px; } }

/* Phase 8 editorial destination content */
.editorial-list{margin:.7rem 0 0;padding-left:1.2rem}.editorial-list li{margin:.45rem 0}.destination-summary{font-size:1.05rem;font-weight:700;margin-bottom:.9rem}.editorial-status{display:block;margin:.35rem 0 .75rem;color:var(--muted,#667085)}.family-check-reason{display:block;margin-top:.35rem;font-size:.76rem;line-height:1.35;color:var(--muted,#667085)}

/* Phase 9: redaktionelle Familienseiten */
.family-destination-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.family-destination-card{padding:18px;border:1px solid var(--line);border-radius:17px;background:#fbfdff}.family-destination-card h3{margin:0 0 7px;font-size:1.08rem}.family-destination-card h3 a{color:var(--navy);text-decoration:none}.family-destination-card p{margin:0 0 9px;color:var(--muted);font-size:.88rem;line-height:1.5}@media(max-width:640px){.family-destination-grid{grid-template-columns:1fr}}

/* Phase 9.5 SEO / trust layer */
.editorial-byline {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .9rem;
  align-items: center;
  margin: .9rem 0 0;
  font-size: .86rem;
  line-height: 1.45;
  color: var(--ink, #17324D);
}
.editorial-byline span,
.editorial-byline a {
  display: inline-flex;
  align-items: center;
}
.editorial-byline a {
  font-weight: 800;
  text-underline-offset: 2px;
}
@media (max-width: 640px) {
  .editorial-byline { align-items: flex-start; gap: .35rem .65rem; }
}


/* Phase 12 affiliate/admin */
.affiliate-products{margin:36px 0;padding:24px;border:1px solid #dbe9f7;border-radius:22px;background:#f8fbff}.affiliate-products__head h2{margin:.25rem 0}.affiliate-product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:18px}.affiliate-product-card{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:16px;border-radius:18px;background:#fff;border:1px solid #e3edf7}.affiliate-product-card img,.affiliate-product-placeholder{width:110px;height:110px;object-fit:contain;border-radius:14px;background:#f1f6fb;display:grid;place-items:center;font-size:2rem}.commercial-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:24px 0}.commercial-card{padding:20px;border:1px solid #dbe9f7;border-radius:18px;background:#fff;text-decoration:none;color:inherit}.commercial-card strong,.commercial-card span{display:block}.admin-body{background:#f2f6fb}.admin-shell{max-width:1050px;margin:0 auto;padding:30px 18px 60px}.admin-card{background:#fff;padding:22px;border-radius:18px;margin:18px 0;box-shadow:0 8px 28px rgba(6,43,103,.08)}.admin-card label{display:grid;gap:6px;margin:10px 0;font-weight:700}.admin-card input,.admin-card select,.admin-card textarea{width:100%;padding:11px;border:1px solid #b9c9da;border-radius:10px;font:inherit}.admin-card input[type=checkbox]{width:auto}.admin-slot{border:1px solid #dbe5ef;border-radius:14px;margin:18px 0;padding:16px}.admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px}.admin-grid .wide{grid-column:1/-1}.notice-error{border-color:#d84949;background:#fff1f1}.notice-success{border-color:#43a363;background:#eefaf2}@media(max-width:700px){.affiliate-product-card{grid-template-columns:1fr}.admin-grid{grid-template-columns:1fr}.admin-grid .wide{grid-column:auto}}

/* =========================================================
   Phase 13: responsive editorial image system
   ========================================================= */
.editorial-hero-media {
  width: 100%;
  margin: 0;
  aspect-ratio: var(--image-ratio, 16/10);
  max-height: 360px;
  overflow: hidden;
  border-radius: inherit;
  background: linear-gradient(145deg, #eef8ff, #f7fbff);
}
.editorial-hero-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: var(--image-focal, 50% 50%);
}
.compact-page-visual {
  min-height: 0;
  aspect-ratio: 16/10;
  background: #eef7fd;
}
.compact-page-visual .editorial-hero-media { height: 100%; max-height: none; }
.destination-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .28s ease;
}
.destination-card:hover .destination-media img { transform: scale(1.025); }
.destination-media::before { z-index: 1; pointer-events: none; }
.destination-wave { z-index: 2; }

@media (max-width: 980px) {
  .compact-page-visual { width: min(100%, 660px); max-height: 260px; }
}
@media (max-width: 640px) {
  .compact-page-visual { width: 100%; aspect-ratio: 16/8; max-height: 160px; }
  .editorial-hero-media { aspect-ratio: 16/8; max-height: 160px; }
  .destination-media { height: 168px; }
}
.travel-visual.has-editorial-photo { padding: 0; background: #eaf6fd; }
.travel-visual.has-editorial-photo .editorial-hero-media { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; border-radius: inherit; }
.home-hero-brand-overlay { position: absolute; right: 18px; bottom: 12px; width: min(34%, 230px); z-index: 3; filter: drop-shadow(0 8px 14px rgba(0,0,0,.18)); }
.home-hero-brand-overlay .hero-mascot-logo { width: 100%; height: auto; }
@media (max-width: 650px) { .home-hero-brand-overlay { width: min(42%, 165px); right: 10px; bottom: 8px; } }

/* Phase 16 - Performance & Mobile QA */
@media (max-width: 620px) {
  input, select, textarea { font-size: 16px; }
  .button, button, .search-trigger, .menu-toggle { min-height: 44px; }
  .affiliate-widget, .check24-short-widget-frame { max-width: 100%; overflow-x: clip; }
  .affiliate-product-card { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@supports (content-visibility: auto) {
  main > section:not(:first-child) { content-visibility: auto; contain-intrinsic-size: 1px 700px; }
}

/* Phase 15 - Consent / Legal */
.footer-link-button{border:0;background:none;padding:0;color:inherit;font:inherit;text-align:left;cursor:pointer}.footer-link-button:hover{text-decoration:underline}
.consent-backdrop{position:fixed;inset:0;background:rgba(6,43,103,.48);z-index:9998}.consent-panel{position:fixed;inset:auto 16px 16px;z-index:9999;display:flex;justify-content:center}.consent-card{width:min(760px,100%);max-height:min(86vh,760px);overflow:auto;background:#fff;border:1px solid #d5e4f1;border-radius:24px;padding:clamp(20px,4vw,30px);box-shadow:0 24px 70px rgba(6,43,103,.28)}.consent-card h2{margin:.2rem 0 .55rem}.consent-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}.consent-details{border-top:1px solid var(--line);padding-top:14px}.consent-details summary{cursor:pointer;font-weight:900;color:var(--navy);margin-bottom:12px}.consent-details label{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:12px 0;border-top:1px solid #edf2f7}.consent-details label span{display:grid;gap:3px}.consent-details small{color:var(--muted);line-height:1.4}.consent-details input{width:22px;height:22px;flex:0 0 auto}.consent-links{font-size:.85rem;margin:14px 0 0}.consent-open{overflow:hidden}.external-consent-placeholder{padding:24px;border:1px dashed #9fc8e8;border-radius:18px;background:#f7fbff;text-align:center}.external-consent-placeholder p{max-width:680px;margin:.55rem auto 1rem;color:var(--muted)}.legal-content{max-width:900px}.legal-content h2{margin-top:2rem}.legal-content h3{margin-top:1.35rem}.legal-content ul{padding-left:1.25rem}.legal-content li{margin:.35rem 0}.legal-table{width:100%;border-collapse:collapse;margin:1rem 0}.legal-table th,.legal-table td{padding:10px 12px;border:1px solid var(--line);vertical-align:top;text-align:left}.legal-table th{background:#f5f9fc}.legal-note{padding:16px;border-radius:14px;background:#fff8e8;border:1px solid #efd99a}
@media(max-width:640px){.consent-panel{inset:auto 8px 8px}.consent-card{border-radius:18px}.consent-actions .button{width:100%}.consent-details label{align-items:flex-start}.legal-table{display:block;overflow-x:auto}}
.consent-panel[hidden],.consent-backdrop[hidden]{display:none!important}
