/* ===========================================================================
   Haus Rentei — Abschnitt PREISE UND BELEGUNG
   Jede Regel beginnt mit .t-preise. Farben, Radien und Schriften kommen
   aus _soul.css, es wird hier nichts Neues erfunden.
   =========================================================================== */

.t-preise{
  background:var(--papier);
  color:var(--tinte);
  padding:clamp(48px,7vw,104px) 0;
}
.t-preise [hidden]{display:none !important}

/* Fokus — alles, was man anklicken kann, zeigt einen Rahmen. */
.t-preise :focus-visible{
  outline:2px solid var(--tinte);
  outline-offset:3px;
}

/* ---------- Kopf --------------------------------------------------------- */
.t-preise__kopf{margin:0 0 clamp(26px,3.4vw,46px)}
.t-preise .vor{
  margin:0 0 clamp(12px,1.6vw,22px);
  font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--stumm);font-weight:500;
}
.t-preise h2{
  font-family:var(--anton);font-weight:400;text-transform:uppercase;
  font-size:clamp(31px,5.4vw,74px);line-height:.98;margin:0;letter-spacing:.004em;
}
.t-preise__lead{
  margin:clamp(14px,1.8vw,22px) 0 0;
  font-size:clamp(15px,1.2vw,18px);line-height:1.6;max-width:46ch;
}

/* ---------- die drei Sätze ----------------------------------------------- */
.t-preise__saetze{
  background:var(--sand);border-radius:var(--radius);overflow:hidden;
  display:grid;grid-template-columns:repeat(3,1fr);
}
.t-preise__satz{
  padding:clamp(24px,2.8vw,40px);
  border-left:1px solid var(--linie);
}
.t-preise__satz:first-child{border-left:0}
.t-preise__wann{
  margin:0 0 clamp(12px,1.4vw,18px);
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:500;color:var(--tinte);
}
.t-preise__zahl{
  margin:0;font-family:var(--anton);font-weight:400;
  font-size:clamp(40px,5.6vw,78px);line-height:.9;
  font-variant-numeric:tabular-nums;letter-spacing:.002em;
}
.t-preise__unter{
  margin:clamp(9px,1.1vw,14px) 0 0;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  color:var(--tinte);opacity:.66;
}

/* ---------- Blockgitter --------------------------------------------------- */
.t-preise__gitter{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:clamp(12px,1.4vw,20px);margin-top:clamp(12px,1.4vw,20px);
}
.t-preise__block{
  border:1px solid var(--linie);border-radius:var(--radius);
  background:var(--papier);padding:clamp(24px,2.8vw,40px);
  display:flex;flex-direction:column;
}
.t-preise__block h3{
  font-family:var(--anton);font-weight:400;text-transform:uppercase;
  font-size:clamp(20px,2.1vw,29px);line-height:1.04;
  margin:0 0 clamp(14px,1.6vw,20px);
}
.t-preise__liste{list-style:none;margin:0;padding:0}
.t-preise__liste li{
  position:relative;padding-left:22px;margin:0 0 9px;font-size:15px;
}
.t-preise__liste li::before{
  content:'';position:absolute;left:0;top:.68em;
  width:10px;height:1px;background:var(--tinte);
}
.t-preise__merk{
  margin:auto 0 0;padding-top:clamp(18px,2.2vw,26px);
  border-top:1px solid var(--linie);
  font-size:13.5px;line-height:1.55;color:var(--stumm);
}
.t-preise__merk b{font-weight:500;color:var(--tinte)}
.t-preise__geld{
  margin:0;font-family:var(--anton);font-weight:400;
  font-size:clamp(36px,4.4vw,62px);line-height:.9;
  font-variant-numeric:tabular-nums;
}
.t-preise__text{
  margin:clamp(12px,1.4vw,18px) 0 0;font-size:14.5px;line-height:1.6;color:var(--stumm);
}

/* ---------- Zeitfenster --------------------------------------------------- */
.t-preise__uhren{display:flex;align-items:flex-start;gap:clamp(12px,1.8vw,24px)}
.t-preise__uhr{flex:none;max-width:9.5em}
.t-preise__uhr b{
  display:block;font-family:var(--anton);font-weight:400;
  font-size:clamp(27px,3.1vw,44px);line-height:1;font-variant-numeric:tabular-nums;
}
.t-preise__uhr small{
  display:block;margin-top:8px;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--stumm);line-height:1.5;
}
.t-preise__spanne{flex:1;min-width:60px;text-align:center;padding-top:clamp(13px,1.5vw,21px)}
.t-preise__spanne i{display:block;height:1px;background:var(--linie)}
.t-preise__spanne span{
  display:inline-block;position:relative;margin-top:-8px;
  background:var(--papier);padding:0 10px;
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--stumm);
}

/* ---------- Stornostaffel ------------------------------------------------- */
.t-preise__staffel{
  width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;
}
.t-preise__staffel th{
  text-align:left;vertical-align:top;font-weight:500;font-size:13.5px;
  padding:13px 18px 13px 0;border-top:1px solid var(--linie);white-space:nowrap;
}
.t-preise__staffel td{
  vertical-align:top;font-size:13.5px;color:var(--stumm);
  padding:13px 0;border-top:1px solid var(--linie);
}
.t-preise__staffel tr:first-child th,
.t-preise__staffel tr:first-child td{border-top:0;padding-top:0}

/* ---------- Kulanz -------------------------------------------------------- */
.t-preise__kulanz{background:var(--sand-hell);border-color:transparent}
.t-preise__zitat{
  margin:0 0 clamp(20px,2.4vw,28px);
  font-size:clamp(16px,1.35vw,20px);line-height:1.55;font-weight:500;max-width:40ch;
}
.t-preise__kulanz .knopf{align-self:flex-start;margin-top:auto}

/* ---------- Belegung ------------------------------------------------------ */
.t-preise__belegung{
  background:var(--sand);border-radius:var(--radius);
  padding:clamp(22px,3.2vw,48px);margin-top:clamp(12px,1.4vw,20px);
}
.t-preise__belkopf{margin:0 0 clamp(20px,2.6vw,34px)}
.t-preise__belegung h3{
  font-family:var(--anton);font-weight:400;text-transform:uppercase;
  font-size:clamp(25px,3.2vw,44px);line-height:1;margin:0;
}
.t-preise__belegung .vor{color:var(--tinte);opacity:.62;margin-bottom:clamp(10px,1.2vw,16px)}
.t-preise__lead2{
  margin:clamp(12px,1.4vw,18px) 0 0;font-size:15px;line-height:1.6;
  color:var(--tinte);opacity:.72;max-width:46ch;
}

/* Notfall: kein Kalender, dafür die Nummer. */
.t-preise__notfall{
  background:var(--papier);border-radius:var(--radius);
  padding:clamp(20px,2.6vw,34px);
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(14px,2vw,28px);
}
.t-preise__notfall p{margin:0;flex:1 1 300px;font-size:15px;line-height:1.6}

/* Kalenderkopf */
.t-preise__kalkopf{
  display:flex;align-items:center;gap:10px;margin:0 0 clamp(12px,1.6vw,20px);
}
.t-preise__monat{
  margin:0;flex:1;text-align:center;
  font-family:var(--anton);font-weight:400;text-transform:uppercase;
  font-size:clamp(19px,2.4vw,33px);line-height:1;font-variant-numeric:tabular-nums;
}
.t-preise__pfeil{
  flex:none;width:clamp(38px,3.4vw,46px);height:clamp(38px,3.4vw,46px);
  border-radius:50%;border:1px solid var(--linie);
  background:var(--papier);color:var(--tinte);
  cursor:pointer;display:grid;place-items:center;padding:0;
  transition:background .2s ease,color .2s ease;
}
.t-preise__pfeil:hover:not(:disabled){background:var(--tinte);color:var(--sand-hell)}
.t-preise__pfeil:disabled{opacity:.32;cursor:default}
.t-preise__pfeil svg{
  width:15px;height:15px;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
}

/* Raster */
.t-preise__raster{
  width:100%;table-layout:fixed;
  border-collapse:separate;border-spacing:clamp(3px,.5vw,8px);
}
.t-preise__raster th{
  padding:0 0 4px;text-align:center;font-weight:500;
  font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--tinte);opacity:.6;
}
.t-preise__raster th abbr{text-decoration:none;border:0}
.t-preise__raster td{padding:0;text-align:center;vertical-align:top}

/* ein Tag */
.t-preise__tag{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;width:100%;min-height:clamp(54px,6.2vw,88px);
  padding:6px 2px;border-radius:clamp(11px,1.2vw,18px);
  border:1px solid var(--linie);background-color:var(--papier);
  color:var(--tinte);font-family:var(--sans);cursor:pointer;text-align:center;
  transition:transform .2s ease,box-shadow .2s ease;
}
.t-preise__tag:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(18,18,17,.14)}
.t-preise__tz{
  font-family:var(--anton);font-weight:400;
  font-size:clamp(15px,1.8vw,26px);line-height:1;font-variant-numeric:tabular-nums;
}
.t-preise__tw{
  font-size:clamp(8px,.72vw,10px);line-height:1.1;letter-spacing:.04em;
  text-transform:uppercase;font-weight:500;
}
.t-preise__tp{
  font-size:clamp(8.5px,.76vw,11px);line-height:1.1;font-weight:500;
  font-variant-numeric:tabular-nums;
}
/* Am freien Tag zaehlt der Satz, das Wort steht nur zur Sicherheit dabei. */
.t-preise__tag--frei .t-preise__tw{opacity:.5}

/* vier Zustände — jeder auch ohne Farbe zu erkennen:
   frei = weiss mit Haarlinie, Option = schraffiert und gestrichelt,
   belegt = schwarz mit durchgestrichenem Satz, Anfrage = gepunktet. */
.t-preise__tag--frei{background-color:var(--papier)}
.t-preise__tag--option{
  background-color:var(--sand-hell);
  background-image:repeating-linear-gradient(45deg,
    var(--linie) 0 3px, rgba(0,0,0,0) 3px 8px);
  border-style:dashed;border-color:var(--stumm);
}
.t-preise__tag--belegt{
  background-color:var(--tinte);border-color:var(--tinte);color:var(--sand-hell);
}
.t-preise__tag--belegt .t-preise__tp{text-decoration:line-through;opacity:.62}
.t-preise__tag--anfrage{
  background-color:var(--papier);
  border-style:dotted;border-width:2px;border-color:var(--stumm);
}
.t-preise__tag--anfrage .t-preise__tp{opacity:.5}
.t-preise__tag[data-gewaehlt]{box-shadow:0 0 0 2px var(--tinte)}
.t-preise__tag--belegt[data-gewaehlt]{box-shadow:0 0 0 2px var(--tinte),0 0 0 4px var(--sand)}

/* vergangene Tage: sichtbar, aber nicht anzuklicken */
.t-preise__leer{
  display:flex;align-items:center;justify-content:center;
  min-height:clamp(54px,6.2vw,88px);
  font-family:var(--anton);font-weight:400;
  font-size:clamp(15px,1.8vw,26px);line-height:1;
  font-variant-numeric:tabular-nums;color:var(--tinte);opacity:.24;
}

/* Auswahlzeile */
.t-preise__fussleiste{
  margin-top:clamp(14px,1.8vw,22px);
  background:var(--papier);border-radius:var(--pille);
  padding:clamp(12px,1.4vw,16px) clamp(16px,2vw,26px);
  display:flex;flex-wrap:wrap;align-items:center;
  gap:clamp(12px,1.6vw,22px);
}
.t-preise__auswahl{
  margin:0;flex:1 1 260px;font-size:14.5px;line-height:1.5;
  font-variant-numeric:tabular-nums;
}
.t-preise__fussleiste .knopf{flex:none}

/* Legende */
.t-preise__legende{
  list-style:none;margin:clamp(16px,2vw,24px) 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:10px clamp(16px,2vw,28px);
}
.t-preise__legende li{
  display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--tinte);
}
.t-preise__marke{
  flex:none;width:24px;height:24px;border-radius:8px;
  border:1px solid var(--linie);background-color:var(--papier);
}
.t-preise__marke--option{
  background-color:var(--sand-hell);
  background-image:repeating-linear-gradient(45deg,
    var(--linie) 0 3px, rgba(0,0,0,0) 3px 8px);
  border-style:dashed;border-color:var(--stumm);
}
.t-preise__marke--belegt{background-color:var(--tinte);border-color:var(--tinte)}
.t-preise__marke--anfrage{border-style:dotted;border-width:2px;border-color:var(--stumm)}

/* Stand */
.t-preise__stand{
  margin:clamp(16px,2vw,24px) 0 0;
  font-size:12.5px;line-height:1.6;color:var(--tinte);opacity:.7;max-width:74ch;
}
.t-preise__stand b{font-weight:500;font-variant-numeric:tabular-nums}

/* ---------- schmal -------------------------------------------------------- */
@media(max-width:960px){
  .t-preise__gitter{grid-template-columns:1fr}
}
@media(max-width:760px){
  .t-preise__saetze{grid-template-columns:1fr}
  .t-preise__satz{border-left:0;border-top:1px solid var(--linie)}
  .t-preise__satz:first-child{border-top:0}
  .t-preise__uhren{flex-direction:column;align-items:flex-start;gap:16px}
  .t-preise__uhr{max-width:none}
  .t-preise__spanne{width:100%;text-align:left;padding-top:0}
  .t-preise__spanne span{margin-left:-10px}
  .t-preise__staffel th,
  .t-preise__staffel td{display:block;white-space:normal;padding:0}
  .t-preise__staffel th{padding-top:13px;border-top:1px solid var(--linie)}
  .t-preise__staffel td{padding-bottom:13px;border-top:0}
  .t-preise__staffel tr:first-child th{padding-top:0}
  .t-preise__fussleiste{border-radius:var(--radius)}
}
@media(max-width:460px){
  .t-preise__belegung{padding:16px 9px}
  .t-preise__belkopf{padding:0 5px}
  .t-preise__raster{border-spacing:2px}
  .t-preise__tag{padding:5px 1px;gap:2px}
  /* Auf dem Handy sind sieben Spalten schmal. Gemischte Schreibung baut
     rund ein Fuenftel schmaler als Versalien — so bleibt "Anfrage" lesbar
     und laeuft nicht aus dem Feld. */
  .t-preise__tw{font-size:8.5px;letter-spacing:0;text-transform:none}
  .t-preise__tp{font-size:8.5px}
  .t-preise__legende,
  .t-preise__stand,
  .t-preise__notfall{margin-left:5px;margin-right:5px}
  .t-preise__legende li{font-size:12px}
}

/* ---------- Ruhe ---------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  .t-preise__tag:hover{transform:none}
  .t-preise *{transition-duration:.001ms !important;animation-duration:.001ms !important}
}