/* Trip-Seite — ergänzt style.css */
.trip-hero{
  padding:clamp(3rem,8vw,5.5rem) 0 clamp(2.5rem,6vw,4rem);
  background:
    radial-gradient(800px 420px at 85% 0%, rgba(61,142,163,.42), transparent 62%),
    linear-gradient(170deg,var(--tief) 0%,var(--tief-weich) 100%);
  color:var(--auf-dunkel)
}
.trip-hero .auge{color:rgba(255,255,255,.72);display:flex;align-items:center;gap:.6rem}
.trip-hero .lead{color:rgba(255,255,255,.85);max-width:52ch}
.privat{background:var(--akzent);color:#fff;padding:.2rem .6rem;border-radius:999px;
  letter-spacing:.08em;font-size:.7rem}
.fakten{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.fakt{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  border-radius:12px;padding:.6rem .9rem;font-size:.93rem}
.fakt b{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(255,255,255,.6);font-weight:650;margin-bottom:.1rem}

.zwei{display:grid;gap:2.5rem;grid-template-columns:1fr 1fr}
@media (max-width:760px){.zwei{grid-template-columns:1fr}}
.liste-haken,.liste-punkt{list-style:none;padding:0;margin:0 0 1.4rem;display:grid;gap:.7rem}
.liste-haken li,.liste-punkt li{position:relative;padding-left:1.9rem;color:var(--text-leise)}
.liste-haken li::before{content:"";position:absolute;left:0;top:.2em;width:1.2rem;height:1.2rem;
  border-radius:50%;background:var(--wasser) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.6 2.6L12 5.5' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat}
.liste-punkt li::before{content:"";position:absolute;left:.35rem;top:.6em;width:.5rem;height:.5rem;
  border-radius:50%;border:2px solid var(--text-leise)}

.ablauf{list-style:none;margin:2rem 0 1rem;padding:0;display:grid;gap:0}
.ablauf li{display:grid;grid-template-columns:7.5rem 1fr;gap:1rem;padding:1rem 0;
  border-bottom:1px solid rgba(255,255,255,.12)}
.ablauf b{color:#8fc5d4;font-weight:650}
.ablauf span{color:rgba(255,255,255,.85)}
@media (max-width:520px){.ablauf li{grid-template-columns:1fr;gap:.2rem}}
.klein-hell{font-size:.92rem;color:rgba(255,255,255,.6)}

.plaetze{height:14px;border-radius:999px;background:var(--linie);overflow:hidden;margin:1.4rem 0 .5rem}
.plaetze__balken{height:100%;display:flex}
.plaetze__balken span{display:block;height:100%}
.p-fix{background:var(--wasser)}
.p-offen{background:color-mix(in srgb,var(--wasser) 40%,transparent)}
.crew-liste{list-style:none;padding:0;margin:1.6rem 0 0;display:grid;gap:.75rem;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.crew-liste li{display:flex;align-items:center;gap:.8rem;padding:.85rem 1rem;background:var(--schaum);
  border:1px solid var(--linie);border-radius:var(--radius)}
.avatar{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  font-weight:700;color:#fff;background:linear-gradient(140deg,var(--wasser),var(--tief))}
.crew-liste .wer{min-width:0}
.crew-liste .wer b{display:block;line-height:1.3}
.crew-liste .wer small{display:block;color:var(--text-leise);font-size:.83rem}
.marke-z{display:inline-block;margin-top:.2rem;font-size:.72rem;font-weight:650;
  padding:.1rem .5rem;border-radius:999px}
.z-fix{background:color-mix(in srgb,#1f7a5c 18%,transparent);color:#1f7a5c}
.z-angefragt{background:color-mix(in srgb,var(--akzent) 16%,transparent);color:var(--akzent-dk)}
.crew-liste li.frei{border-style:dashed;background:transparent;color:var(--text-leise)}
.crew-liste li.frei .avatar{background:transparent;border:2px dashed var(--linie);color:var(--text-leise)}
.crew-liste li.du{border-color:var(--wasser);box-shadow:0 0 0 2px color-mix(in srgb,var(--wasser) 25%,transparent)}

.kosten{display:grid;gap:1.5rem;grid-template-columns:1fr 1fr;align-items:center;margin-top:2rem}
@media (max-width:700px){.kosten{grid-template-columns:1fr}}
.kosten__gross{background:var(--schaum);border-radius:var(--radius-gr);padding:1.6rem;border:1px solid var(--linie)}
.kosten__betrag{display:block;font-size:clamp(2.4rem,6vw,3.4rem);font-weight:750;
  letter-spacing:-.03em;color:var(--akzent-dk);line-height:1;font-variant-numeric:tabular-nums}
.kosten__text{display:block;margin-top:.5rem;color:var(--text-leise);font-size:.95rem}
.kosten__tabelle,.aufschluesselung table{width:100%;border-collapse:collapse;font-size:.95rem}
.kosten__tabelle th,.kosten__tabelle td,.aufschluesselung td{padding:.55rem .3rem;
  border-bottom:1px solid var(--linie);text-align:left}
.kosten__tabelle th{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-leise)}
.kosten__tabelle td:last-child,.aufschluesselung td:last-child{text-align:right;font-variant-numeric:tabular-nums}
.kosten__tabelle tr.jetzt td{font-weight:700;color:var(--text)}
.aufschluesselung{margin-top:1.6rem}
.aufschluesselung summary{cursor:pointer;font-weight:600;color:var(--wasser)}
.aufschluesselung table{margin-top:.8rem}
.geschaetzt{font-size:.75rem;color:var(--text-leise);margin-left:.4rem}

.form .feld>span em{font-weight:420;font-style:normal;color:var(--text-leise)}

/* Ziel */
.ziel-satz{font-size:1.05rem;margin:.4rem 0 0;color:var(--text)}
.ziel-satz b{color:var(--akzent-dk)}
.plaetze{position:relative;overflow:visible}
.plaetze__balken{border-radius:999px;overflow:hidden}
.plaetze__marke{position:absolute;top:-6px;bottom:-6px;width:3px;border-radius:2px;background:var(--akzent)}
.plaetze__marke::after{content:attr(data-text);position:absolute;bottom:calc(100% + 3px);left:50%;
  transform:translateX(-50%);font-size:.72rem;font-weight:650;color:var(--akzent-dk);white-space:nowrap}
#crew .plaetze{margin-top:2.2rem}

/* Angebote */
.angebote{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));margin:2rem 0 1rem}
.angebot{background:var(--schaum);border:1px solid var(--linie);border-radius:var(--radius);
  padding:1.2rem 1.25rem;display:flex;flex-direction:column;gap:.55rem}
.angebot.st-gewaehlt{border-color:#1f7a5c;box-shadow:0 0 0 2px color-mix(in srgb,#1f7a5c 25%,transparent)}
.angebot.st-abgesagt{opacity:.5}
.angebot__kopf{display:flex;justify-content:space-between;gap:.6rem;align-items:flex-start}
.angebot h3{margin:0;font-size:1.1rem;line-height:1.25}
.angebot .boot{margin:0;color:var(--text-leise);font-size:.9rem}
.angebot .stand{flex:none;font-size:.7rem;font-weight:650;padding:.15rem .55rem;border-radius:999px;
  background:var(--linie);color:var(--text-leise);white-space:nowrap}
.angebot .stand.s-angebot,.angebot .stand.s-gewaehlt{background:color-mix(in srgb,#1f7a5c 18%,transparent);color:#1f7a5c}
.angebot .stand.s-angefragt{background:color-mix(in srgb,var(--akzent) 16%,transparent);color:var(--akzent-dk)}
.angebot .preis{margin:.3rem 0 0;line-height:1.1}
.angebot .preis b{font-size:1.75rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text)}
.angebot .preis small{display:block;font-size:.8rem;color:var(--text-leise);margin-top:.2rem}
.angebot .drin{margin:0;font-size:.92rem}
.angebot .notiz{margin:0;font-size:.83rem;color:var(--text-leise)}
.angebot .einzeln{margin:0;font-size:.8rem;font-weight:600;color:var(--wasser)}
.angebot__fuss{display:flex;gap:.6rem;align-items:center;justify-content:space-between;flex-wrap:wrap;
  margin-top:auto;padding-top:.6rem;border-top:1px solid var(--linie)}
.angebot__fuss a{font-size:.85rem;color:var(--wasser)}
.fav{font:inherit;font-size:.85rem;font-weight:620;padding:.4rem .8rem;border-radius:999px;cursor:pointer;
  background:transparent;color:var(--text);border:1.5px solid var(--linie)}
.fav:hover{border-color:var(--akzent)}
.fav.an{background:var(--akzent);border-color:var(--akzent);color:#fff}
.angebot .stimmen{width:100%;font-size:.8rem;color:var(--text-leise);margin:0}

/* Persönlicher Link */
.mein-link{margin-top:2rem;background:var(--schaum);border:1px solid var(--wasser);border-radius:var(--radius);
  padding:1.1rem 1.2rem}
.mein-link p{margin:.3rem 0 .8rem}
.mein-link__zeile{display:flex;gap:.5rem}
.mein-link__zeile input{flex:1;min-width:0;font:inherit;font-size:.86rem;padding:.55rem .75rem;
  border:1px solid var(--linie);border-radius:10px;background:var(--sand);color:var(--text)}

/* Öffentliche Trip-Seite */
.trip-hero--bild{position:relative;isolation:isolate;
  background:linear-gradient(180deg,rgba(11,43,51,.55) 0%,rgba(11,43,51,.88) 70%,var(--tief) 100%),
    url("../assets/img/lineup-oben.jpg") center 30%/cover}
.trip-hero--bild h1{max-width:16ch}
.stand-kasten{margin:1.8rem 0 1.6rem;max-width:560px;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:1rem 1.15rem}
.stand-kasten__titel{margin:0;font-weight:650}
.stand-kasten__text{margin:.2rem 0 0;font-size:.92rem;color:rgba(255,255,255,.78)}
.stand-kasten .plaetze{background:rgba(255,255,255,.16);margin:2rem 0 .6rem}
.stand-kasten .plaetze__marke::after{color:#ffb397}
.plan-fakten{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:2rem 0 2.5rem}
.plan-fakten div{background:var(--schaum);border:1px solid var(--linie);border-radius:var(--radius);padding:1.1rem 1.2rem}
.plan-fakten dt{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:650;color:var(--wasser);margin-bottom:.35rem}
.plan-fakten dd{margin:0;color:var(--text-leise)}
.plan-fakten dd b{color:var(--text)}
.plan-listen h3{margin-bottom:1rem}
.schritte-liste{list-style:none;counter-reset:s;margin:2rem 0 3rem;padding:0;display:grid;gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.schritte-liste li{counter-increment:s;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--radius);padding:1.1rem 1.2rem}
.schritte-liste li::before{content:counter(s);display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;
  background:var(--akzent);color:#fff;font-weight:700;margin-bottom:.7rem}
.schritte-liste b{display:block;color:#fff;margin-bottom:.3rem}
.schritte-liste span{color:rgba(255,255,255,.78);font-size:.95rem}
.woche-titel{color:#fff;margin-top:1rem}
.trip-hero .knopf--leer{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.42)}
.trip-hero .knopf--leer:hover{box-shadow:inset 0 0 0 1.5px #fff}
.trip-hero .hero__knoepfe{display:flex;gap:.75rem;flex-wrap:wrap}
