/* ==========================================================================
   Gut Rechetsberg v328 — Darstellungs-Parität Apple ↔ Windows/Android
   Wird als letztes Stylesheet geladen.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Schriftgewichts-Achse "GR Sans"

   Ausgangslage: body{font-weight:300} und rund 550 weitere Deklarationen mit
   Gewicht 200–300. Avenir Next besitzt auf macOS/iOS kein Light — die Familie
   springt von Ultra Light (200) direkt auf Regular (400). Nach den CSS-Font-
   Matching-Regeln landet font-weight:300 deshalb auf Avenir Next Ultra Light,
   während Windows Segoe UI Light und Android Roboto Light rendert. Daher der
   sichtbar geringere Schriftkontrast auf iPhone, iPad und Mac.

   Lösung: eine eigene Familie, deren Gewichtsbereiche auf die tatsächlich
   vorhandenen Apple-Schnitte gemappt werden. 200 und 300 landen auf
   Avenir Light — einem echten Light-Schnitt, der Segoe UI Light optisch
   entspricht. Alle Quellen sind local(); auf Windows und Android schlagen sie
   fehl, die @font-face-Regeln werden ignoriert und der bisherige Stack greift
   unverändert weiter. Es wird nichts nachgeladen.
   -------------------------------------------------------------------------- */
/* Bis 250: Avenir Next Ultra Light. Die grossen Display-Titel stehen auf
   font-weight:200 und bleiben damit so fein wie ursprünglich gestaltet.
   v328 hatte sie versehentlich mit angehoben. */
@font-face{
  font-family:"GR Sans";
  font-style:normal;
  font-weight:1 250;
  src:local("AvenirNext-UltraLight"),local("Avenir Next Ultra Light"),
      local("Avenir-Light"),local("Avenir Light");
}
@font-face{
  font-family:"GR Sans";
  font-style:italic;
  font-weight:1 250;
  src:local("AvenirNext-UltraLightItalic"),local("Avenir-LightOblique");
}
/* 251-350: echtes Light. Hier sitzt der Fliesstext (body steht auf 300),
   der auf Apple sonst ebenfalls in Ultra Light gerendert wurde. */
@font-face{
  font-family:"GR Sans";
  font-style:normal;
  font-weight:251 350;
  src:local("Avenir-Light"),local("Avenir Light"),
      local("AvenirNext-Regular"),local("Avenir Next Regular");
}
@font-face{
  font-family:"GR Sans";
  font-style:italic;
  font-weight:251 350;
  src:local("Avenir-LightOblique"),local("Avenir Light Oblique"),
      local("AvenirNext-Italic");
}
@font-face{
  font-family:"GR Sans";
  font-style:normal;
  font-weight:351 450;
  src:local("AvenirNext-Regular"),local("Avenir Next Regular"),
      local("Avenir-Roman"),local("Avenir Roman");
}
@font-face{
  font-family:"GR Sans";
  font-style:italic;
  font-weight:351 450;
  src:local("AvenirNext-Italic"),local("Avenir Next Italic"),
      local("Avenir-Oblique");
}
@font-face{
  font-family:"GR Sans";
  font-style:normal;
  font-weight:451 550;
  src:local("AvenirNext-Medium"),local("Avenir Next Medium"),
      local("Avenir-Medium");
}
@font-face{
  font-family:"GR Sans";
  font-style:italic;
  font-weight:451 550;
  src:local("AvenirNext-MediumItalic"),local("Avenir-MediumOblique");
}
@font-face{
  font-family:"GR Sans";
  font-style:normal;
  font-weight:551 650;
  src:local("AvenirNext-DemiBold"),local("Avenir Next Demi Bold"),
      local("Avenir-Heavy");
}
@font-face{
  font-family:"GR Sans";
  font-style:normal;
  font-weight:651 1000;
  src:local("AvenirNext-Bold"),local("Avenir Next Bold"),
      local("Avenir-Black");
}

/* Keine künstliche Verdünnung durch Graustufen-Glättung auf Retina-Displays.
   Safari rendert sonst spürbar dünner als Chrome unter Windows. */
html.is-apple-v324 body{
  -webkit-font-smoothing:auto;
  -moz-osx-font-smoothing:auto;
}
html.is-apple-v324{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

/* --------------------------------------------------------------------------
   2. iOS: kein Auto-Zoom beim Fokussieren von Formularfeldern

   iOS Safari zoomt die gesamte Seite hinein, sobald ein fokussiertes Feld
   kleiner als 16px gesetzt ist — und zoomt danach nicht zurück. Das Anfrage-
   formular setzte auf Mobil 15px bzw. 13px. Android und Windows kennen dieses
   Verhalten nicht, daher fiel es dort nie auf.
   -------------------------------------------------------------------------- */
@media (max-width:820px){
  input,select,textarea,
  .form-field input,
  .form-field select,
  .form-field textarea,
  .child-count-field input,
  .child-age-field select{
    font-size:16px!important;
  }
  .child-age-field select{
    letter-spacing:.02em!important;
    padding-right:34px!important;
  }
  .child-age-field::after{right:13px!important}
}

/* --------------------------------------------------------------------------
   3. iOS-Viewporthöhe

   100vh entspricht auf iOS dem Viewport ohne eingeblendete Adressleiste. Voll-
   höhen-Panels ragen dadurch unter den sichtbaren Bereich. 100svh (small
   viewport height) ist der korrekte Wert; Browser ohne svh-Unterstützung
   ignorieren die Zeile und behalten den vh-Wert aus der Basisregel.
   -------------------------------------------------------------------------- */
@supports (height:100svh){
  html body[data-page="kleines-apartment-ii"] .ksa-moment .accom-photo-sticky{
    height:100svh!important;
  }
  html body[data-page="park"] .parkx-hero{
    min-height:calc(100svh - var(--header-h,0px))!important;
  }
}

/* --------------------------------------------------------------------------
   5. Serifentitel

   "Cormorant Garamond" wird nirgends geladen. Der Stack fällt deshalb auf
   Georgia zurück — vorhanden auf iOS, macOS und Windows, aber NICHT auf
   Android. Dort rendert stattdessen Noto Serif. Das ist der sichtbare
   Schriftunterschied bei den Unterkunftsnamen auf der Preisseite und bei
   den Überschriften der Regionsseite.

   Echte Gleichheit gibt es hier nur mit einer selbst gehosteten Schrift.
   Sobald die beiden Dateien unter fonts/ liegen, greift die Regel
   automatisch auf allen Geräten; fehlen sie, bleibt es beim bisherigen
   Verhalten. Cormorant Garamond steht unter der SIL Open Font License.
   -------------------------------------------------------------------------- */
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("fonts/cormorant-garamond-400.woff2") format("woff2");
}
@font-face{
  font-family:"Cormorant Garamond";
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url("fonts/cormorant-garamond-500.woff2") format("woff2");
}
