/* ============================================================
   HUB-DS — Reederei-Hub-Komponenten auf der DS-Foundation.
   Quelle: aus den Inline-<style>-Bridges der Mein-Schiff-Hub extrahiert,
   damit ALLE Reederei-Hubs dieselben Styles + Mobile-Breakpoints erben.
   Lädt zusätzlich zu auszeit-design-system.css + pilot-ship.css.
   ============================================================ */

/* ---------- Hero/DNA-Fazit ---------- */
#dna .fazit a{display:inline;white-space:nowrap}
#dna .fazit{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2rem}
#dna .fazit__col{background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:8px;padding:1.3rem 1.6rem;min-width:0;overflow-wrap:break-word}
#dna .fazit__col h3{margin:0 0 .6rem;font-family:'Playfair Display',serif;font-size:1.15rem}
#dna .fazit__col ul{margin:0;padding-left:1.1rem}
#dna .fazit__col li{margin:.4rem 0}

/* ---------- DNA-Matrix-Tabelle ---------- */
#dna .dna-matrix{width:100%;border-collapse:collapse;margin:1.6rem 0 .5rem;font:15px/1.5 Inter,system-ui,sans-serif}
#dna .dna-matrix th{text-align:left;padding:.6rem .9rem;font:600 12px/1 Inter;letter-spacing:.08em;text-transform:uppercase;color:#7A5E1A;border-bottom:2px solid rgba(0,0,0,.12)}
#dna .dna-matrix td{padding:.65rem .9rem;border-bottom:1px solid rgba(0,0,0,.08);vertical-align:top}
#dna .dna-matrix .axis{font-weight:600;white-space:nowrap}
#dna .dna-matrix .dots{color:#B0913B;letter-spacing:3px;white-space:nowrap;font-size:17px}
#dna .dna-matrix .note{color:#6E6A60;font-size:13.5px}

/* ---------- Zielgruppen-Karten ---------- */
.ms-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px;margin-top:36px}
.ms-target-card{display:flex;flex-direction:column;gap:10px;background:var(--ink-soft,#262522);border:1px solid rgba(245,243,239,.12);border-radius:10px;padding:28px 30px}
.ms-target-card__icon{width:42px;height:42px;color:var(--gold,#C9A84C)}
.ms-target-card__icon svg{width:42px;height:42px;display:block}
.ms-target-card__sub{font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--gold,#C9A84C)}
.ms-target-card__title{font-family:'Playfair Display',serif;font-size:1.3rem;margin:0;color:var(--paper,#F5F3EF)}
.ms-target-card__text{font-size:14.5px;line-height:1.6;color:rgba(245,243,239,.82)}
.ms-target-card__links{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:auto}
.ms-target-card__link{color:var(--gold,#C9A84C);font-weight:600;font-size:14px;white-space:nowrap}

/* ---------- Flotten-Karten ---------- */
/* Klassen-Gruppen-Überschrift über je einem Grid aus Einzel-Schiffs-Karten (Template-Standard) */
.flotte-group-heading{font-family:'Playfair Display',serif;font-size:1.4rem;margin:40px 0 4px;color:var(--ink,#1A1A1A)}
.section--dark .flotte-group-heading{color:var(--paper,#F5F3EF)}
.flotte-group-heading:first-of-type{margin-top:8px}
#schiffe .flotte-grid,.flotte-cards,.ms-fleet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px;margin-top:20px;align-items:stretch}
.flotte-card{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:10px;overflow:hidden}
.section--dark .flotte-card{background:var(--ink-soft,#262522);border-color:rgba(245,243,239,.12)}
.flotte-card__media{position:relative;aspect-ratio:16/10;overflow:hidden}
.flotte-card__image{width:100%;height:100%;object-fit:cover;display:block}
/* 'Bild folgt'-Platzhalter, wenn kein eigenes Reederei-Motiv vorhanden (dünne Mediathek) */
.is-pending{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:16/10;background:linear-gradient(135deg,rgba(38,37,34,.10),rgba(201,168,76,.12));color:var(--muted,#6E6A60);font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.is-pending::after{content:"Bild folgt"}
.flotte-card__body{display:flex;flex-direction:column;gap:9px;padding:24px 26px;flex:1 1 auto}
#schiffe .flotte-cards{align-items:stretch}
.flotte-grid>.flotte-card{padding:22px 24px}
.flotte-grid>.flotte-card>.flotte-card__title{margin-top:0}
.flotte-card__tag{align-self:flex-start;font:700 10px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--gold,#C9A84C);border:1px solid var(--gold,#C9A84C);border-radius:100px;padding:5px 11px}
.flotte-card__tag--luxus{color:#1A1A1A;background:var(--gold,#C9A84C);border-color:var(--gold,#C9A84C)}
.flotte-card__title{font-family:'Playfair Display',serif;font-size:1.35rem;margin:0}
.flotte-card__title a{color:inherit;text-decoration:none}
.flotte-card__sub{font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--gold,#C9A84C)}
.flotte-card__text{font-size:14.5px;line-height:1.6;color:var(--muted,#6E6A60)}
.section--dark .flotte-card__text{color:rgba(245,243,239,.78)}
.flotte-card__ships{display:flex;flex-wrap:wrap;gap:6px 12px;margin:2px 0}
.flotte-card__ship{font-size:14px;color:var(--gold-text,#7A5E1A);font-weight:600;white-space:nowrap}
.section--dark .flotte-card__ship{color:var(--gold,#C9A84C)}
.flotte-card__cta-group{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:6px}
.flotte-card__cta-group .btn{font-size:13px;padding:10px 18px}

/* ---------- Alle-Schiffe-Vergleichstabelle (breit → horizontal scrollbar) ---------- */
.ship-compare__table-wrapper{overflow-x:auto;margin-top:32px}
.ship-compare__table{width:100%;border-collapse:collapse;font:14px/1.5 Inter,system-ui,sans-serif}
.ship-compare__table th,.ship-compare__table td{padding:.6rem .85rem;border-bottom:1px solid rgba(0,0,0,.1);text-align:left;vertical-align:top}
.ship-compare__table thead th{font:700 11px/1 Inter;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-text,#7A5E1A);border-bottom:2px solid rgba(0,0,0,.15)}
.ship-compare__table tbody th{font-weight:600;color:var(--ink,#1A1A1A);white-space:nowrap}

/* ---------- vs-Vergleich: Karten (mobile) + Tabelle (desktop) ---------- */
.ms-vs-cards{display:none;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:32px}
.ms-vs-card{background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:10px;padding:24px 26px}
.ms-vs-card--highlight{border:2px solid var(--gold,#C9A84C)}
.ms-vs-card__title{font-family:'Playfair Display',serif;font-size:1.3rem;margin:0 0 2px}
.ms-vs-card__sub{font:700 11px/1.3 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-text,#7A5E1A);margin:0 0 14px}
.ms-vs-card__list{margin:0}
.ms-vs-card__list dt{font:700 11px/1.3 Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#6E6A60);margin-top:12px}
.ms-vs-card__list dd{margin:2px 0 0;font-size:14.5px;line-height:1.5}
.ms-vs-table-wrapper{overflow-x:auto;margin-top:28px}

/* ---------- Benedikt-Empfehlung ---------- */
.ms-benedikt-quote{display:grid;grid-template-columns:240px 1fr;gap:48px;align-items:center;margin-top:40px}
.ms-benedikt-quote__portrait{margin:0}
.ms-benedikt-quote__portrait img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:50%;border:3px solid var(--gold,#C9A84C);display:block}
.ms-benedikt-quote__label{display:block;font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--gold,#C9A84C);margin-bottom:14px}
.ms-benedikt-quote__text p{font-family:'Playfair Display',serif;font-style:italic;font-size:18px;line-height:1.65;color:rgba(245,243,239,.9);margin:0 0 14px}
.ms-benedikt-quote__text p:last-child{margin-bottom:0;font-size:16.5px;color:rgba(245,243,239,.74)}
.ms-benedikt-quote__signature{display:block;margin-top:18px;font-size:14px;font-weight:700;color:var(--gold,#C9A84C)}

/* ---------- Final-CTA + Globus-Teaser ---------- */
.cta-section{text-align:center;padding:72px 0}
.cta-section__title{font-family:'Playfair Display',serif;font-size:2rem;margin:0 0 12px}
.cta-section__text{max-width:60ch;margin:0 auto 22px;color:var(--muted,#6E6A60)}
.cta-section__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta-trust-hint{margin-top:16px;font-size:13px;color:var(--muted,#6E6A60)}
.cta-section .pill{display:inline-block;padding:4px 12px;border:1px solid var(--gold,#C9A84C);border-radius:100px;font-size:12px;color:var(--gold-text,#7A5E1A)}
.last-updated{font-size:12px;color:var(--muted,#6E6A60);margin-top:10px}
.fleet-cta-section{background:var(--ink,#1A1A1A);color:var(--paper,#F5F3EF);padding:72px 0;text-align:center}
.fleet-cta-section__inner{max-width:640px;margin:0 auto;padding:0 24px}
.fleet-cta-section__eyebrow{display:block;font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--gold,#C9A84C);margin:0 0 12px}
.fleet-cta-section__title{font-family:'Playfair Display',serif;font-size:2rem;margin:0 0 12px;color:var(--paper,#F5F3EF)}
.fleet-cta-section__text{color:rgba(245,243,239,.82);margin:0 0 22px}
.fleet-cta-section__btn{display:inline-block;font:600 15px/1 Inter,system-ui,sans-serif;padding:15px 32px;color:var(--paper,#F5F3EF);box-shadow:inset 0 0 0 1.5px rgba(245,243,239,.6);text-decoration:none}
.fleet-cta-section__btn:hover{background:var(--paper,#F5F3EF);color:var(--ink,#1A1A1A)}

/* ---------- ms-card-Familie (Kabinen/Kulinarik/Routen/Inklusive) ---------- */
.ms-card-grid,.ms-cabin-grid,.ms-dining-grid,.ms-bars-grid,.ms-routes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:24px;margin-top:32px}
.ms-card,.ms-cabin-card,.ms-dining-card,.ms-routes-card{display:flex;flex-direction:column;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:10px;overflow:hidden}
.section--dark .ms-card,.section--dark .ms-cabin-card,.section--dark .ms-dining-card,.section--dark .ms-routes-card{background:var(--ink-soft,#262522);border-color:rgba(245,243,239,.12)}
.ms-card__media{position:relative;overflow:hidden}
.ms-card__media--photo,.ms-card__media--photo-wide{aspect-ratio:16/10}
.ms-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.ms-card__media--icon{display:flex;align-items:center;justify-content:center;padding:24px 0 4px}
.ms-card__media--icon svg{width:40px;height:40px;color:var(--gold,#C9A84C)}
.ms-card__body{display:flex;flex-direction:column;gap:8px;padding:22px 24px;flex:1 1 auto}
.ms-card__sub{font:700 11px/1.3 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-text,#7A5E1A)}
.section--dark .ms-card__sub{color:var(--gold,#C9A84C)}
.ms-card__title{font-family:'Playfair Display',serif;font-size:1.22rem;line-height:1.25;margin:0}
.ms-card__text{font-size:14.5px;line-height:1.6;color:var(--muted,#6E6A60)}
.section--dark .ms-card__text{color:rgba(245,243,239,.8)}
.ms-card__footer{margin-top:auto;padding-top:10px;font-size:13px;color:var(--muted,#6E6A60)}
.section--dark .ms-card__footer{color:rgba(245,243,239,.7)}
.ms-card__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.ms-card__chip{font:600 12px/1 Inter,system-ui,sans-serif;padding:6px 12px;border:1px solid rgba(201,168,76,.5);border-radius:100px;color:var(--gold-text,#7A5E1A)}
.section--dark .ms-card__chip{color:var(--gold,#C9A84C)}
.ms-card__tag{align-self:flex-start;font:700 10px/1 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:5px 10px;border-radius:100px;border:1px solid var(--gold,#C9A84C);color:var(--gold-text,#7A5E1A)}
.ms-card__tag--inclusive{background:var(--gold,#C9A84C);color:#1A1A1A}
.ms-card__tag--extra{color:var(--muted,#6E6A60);border-color:rgba(0,0,0,.2)}
.ms-card-banner{display:flex;align-items:center;gap:16px;padding:20px 24px;background:rgba(201,168,76,.08);border:1px solid rgba(201,168,76,.3);border-radius:10px;margin-top:24px}
.ms-card-banner svg{width:44px;height:44px;flex:0 0 44px;color:var(--gold,#C9A84C)}

/* ---------- Reisetyp-Tabelle (.rt) ---------- */
.rt{width:100%;border-collapse:collapse;margin:1.6rem 0 0;font:15px/1.55 Inter,system-ui,sans-serif}
.rt th{text-align:left;padding:.6rem .9rem;font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--gold,#C9A84C);border-bottom:2px solid rgba(245,243,239,.2)}
.rt td{padding:.65rem .9rem;border-bottom:1px solid rgba(245,243,239,.12);vertical-align:top;color:rgba(245,243,239,.88)}
.rt .typ{font-weight:600;color:#fff}
.rt a{color:var(--gold,#C9A84C);font-weight:600}
.finder-cta{margin-top:1.6rem}

/* ---------- Aktuelle Angebote (Slot) ---------- */
#aktuelle-angebote .angebote-slot__live[hidden]{display:none}
#aktuelle-angebote .angebote-slot__cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:24px;margin:28px 0 0}
#aktuelle-angebote .angebote-card{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:8px;padding:24px 26px;text-align:left;overflow:hidden}
#aktuelle-angebote .angebote-card__image{display:block;width:calc(100% + 52px);margin:-24px -26px 6px;aspect-ratio:16/10;object-fit:cover}
#aktuelle-angebote .angebote-card__region{font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#7A5E1A}
#aktuelle-angebote .angebote-card__route{font-family:'Playfair Display',serif;font-size:20px;font-weight:600;line-height:1.2;margin:0;color:#1A1A1A}
#aktuelle-angebote .angebote-card__meta{font-size:13.5px;color:#6E6A60}
#aktuelle-angebote .angebote-card__price{font-family:'Playfair Display',serif;font-size:23px;color:#1A1A1A;margin-top:2px}
#aktuelle-angebote .angebote-card .btn{margin-top:auto;align-self:flex-start}

/* ============================================================
   MOBILE-BREAKPOINTS (≤680px) — gehören zentral hierher,
   damit jeder Hub sie erbt (statt pro Seite zu fehlen).
   ============================================================ */
@media (max-width:680px){
  /* DNA-Fazit + Benedikt einspaltig */
  #dna .fazit{grid-template-columns:1fr}
  #dna .fazit a{white-space:normal}
  .ms-benedikt-quote{grid-template-columns:1fr;gap:24px;justify-items:center;text-align:center}
  .ms-benedikt-quote__portrait img{width:160px;margin:0 auto}

  /* DNA-Matrix: Zeilen → gestapelte Karten (Achse/Wertung/Einordnung untereinander) */
  #dna .dna-matrix thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  #dna .dna-matrix,#dna .dna-matrix tbody,#dna .dna-matrix tr,#dna .dna-matrix td{display:block;width:100%}
  #dna .dna-matrix tr{border:1px solid rgba(0,0,0,.1);border-radius:8px;padding:12px 14px;margin-bottom:12px}
  #dna .dna-matrix td{border:0;padding:2px 0}
  #dna .dna-matrix .axis{white-space:normal;font-size:15px}
  #dna .dna-matrix .dots{font-size:19px}

  /* Reisetyp-Tabelle: Zeilen → gestapelt (Typ über Empfehlung) */
  .rt thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .rt,.rt tbody,.rt tr,.rt td{display:block;width:100%}
  .rt tr{border-bottom:1px solid rgba(245,243,239,.18);padding:10px 0}
  .rt td{border:0;padding:2px 0}
  .rt .typ{font-size:15px}

  /* vs-Vergleich: Tabelle aus, Karten an */
  .ms-vs-table-wrapper{display:none}
  .ms-vs-cards{display:grid}
}