/*
Theme Name: InterAlpen Holding 2026
Theme URI: https://interalpenholding.com/
Author: Meradim
Description: Eigenständiges, performantes Theme für die Website der InterAlpen Holding GmbH.
Version: 1.20.0
Requires at least: 6.8
Requires PHP: 8.0
Text Domain: interalpen-holding
*/

/* Diese Datei ergänzt css/styles.css um das, was es im Entwurf noch
   nicht gab: die Rechtsseiten, die 404-Seite und die Kleinigkeiten,
   die erst durch WordPress dazukommen (Adminleiste, Blockeditor).
   Das Regelwerk des Entwurfs bleibt unangetastet. */

/* ---------------------------------------------------------
   WordPress-Adminleiste
   Der Header liegt fest oben; die Leiste würde ihn sonst
   überdecken. Nur für angemeldete Redakteure sichtbar.
   --------------------------------------------------------- */
body.admin-bar .header {
  top: calc(32px + 1rem);
}

@media (max-width: 782px) {
  body.admin-bar .header {
    top: calc(46px + 0.75rem);
  }
}

/* ---------------------------------------------------------
   Rechtsseiten

   Bewusst auf dunklem Grund wie die gesamte Website. Eine helle
   Rechtsseite würde die Marke an genau der Stelle verlassen, an
   der Sorgfalt am meisten zählt.
   --------------------------------------------------------- */
/* Aufbau wie auf den Rechtsseiten von InterAlpen Immobilien
   (Stand v1.4.14, linksbündig): Die Lesespalte steht geometrisch
   zentriert zur Seite; Vorspann und Überschrift beginnen linksbündig
   auf derselben Kante wie der Fließtext; die Navigation läuft in der
   linken Randspalte seitlich mit. */
.ia-legal-page {
  min-height: 70vh;
  padding: clamp(7.5rem, 13vw, 11rem) 0 clamp(4.5rem, 9vw, 7.5rem);
  color: var(--stone);
  background: var(--night);
}

.ia-legal-page__inner {
  --ia-legal-columns: minmax(9rem, 1fr) minmax(0, 38rem) minmax(9rem, 1fr);
  --ia-legal-gap: clamp(1.5rem, 3vw, 3rem);

  width: min(1200px, calc(100% - 2 * var(--pad)));
  margin: 0 auto;
  display: grid;
  grid-template-columns: var(--ia-legal-columns);
  column-gap: var(--ia-legal-gap);
}

.ia-legal-page__eyebrow {
  grid-column: 2;
  margin: 0 0 1.1rem;
  color: var(--bronze);
  font-size: var(--text-eyebrow);
  font-weight: 650;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: left;
}

/* Keine Silbentrennung: Statt Wörter zu teilen, wird die
   Überschrift kleiner. Deshalb kein hyphens, sondern eine
   Größe, die auch "Datenschutzerklärung" auf 375 px trägt. */
.ia-legal-page h1 {
  width: 100%;
  grid-column: 2;
  max-width: 18ch;
  margin: 0 0 clamp(2rem, 5vw, 3.5rem);
  color: var(--ivory);
  font-size: clamp(1.75rem, 5.2vw, 3.25rem);
  font-weight: var(--display-weight);
  line-height: var(--display-leading);
  letter-spacing: var(--display-tracking);
  text-wrap: balance;
  text-align: left;
  -webkit-hyphens: none;
  hyphens: none;
}

.ia-legal-page__layout {
  grid-column: 1 / -1;
  width: 100%;
  display: grid;
  grid-template-columns: var(--ia-legal-columns);
  gap: var(--ia-legal-gap);
  align-items: start;
}

.ia-legal-page__layout .ia-legal-nav {
  grid-column: 1;
}

.ia-legal-page__layout .ia-legal-content {
  grid-column: 2;
  text-align: left;
}

/* ---------------------------------------------------------
   Seitliche Rechtsnavigation
   --------------------------------------------------------- */
.ia-legal-nav {
  position: sticky;
  top: 7.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  padding-top: 0.2rem;
}

.ia-legal-nav a {
  width: max-content;
  max-width: 100%;
  /* `--cocoa` (#4A5670) ergab auf dem Nachtgrund nur 2,43:1 bei 12 px -
     die Navigation zwischen Impressum, AGB, Datenschutz, Widerruf und
     Cookie-Richtlinie war damit kaum lesbar. #7C88A0 liefert 4,94:1 und
     bleibt deutlich ruhiger als der aktive Eintrag (--ivory, 16,6:1). */
  color: #7C88A0;
  font-size: var(--text-ui);
  letter-spacing: 0.04em;
  text-decoration: none;
  transition: color 0.25s var(--ease-out);
}

.ia-legal-nav a[aria-current="page"],
.ia-legal-nav a:hover,
.ia-legal-nav a:focus-visible {
  color: var(--ivory);
}

/* ---------------------------------------------------------
   Einwilligung widerrufen - auch auf dem Telefon

   Complianz blendet seinen eigenen Verwaltungsknopf unter 768 px
   selbst aus und setzt dort auf einen Fusszeilenlink. Der Fusslink
   ist entfallen (er trug die in Complianz 7.5 nicht mehr angebundene
   Klasse `cmplz-show-banner` und tat nichts). Ohne diese Regel gaebe
   es auf Telefonen keinen Weg mehr, die Einwilligung erneut zu
   oeffnen oder zu widerrufen.

   Der Zustand `cmplz-dismissed` bleibt ausgenommen: Ist der Knopf
   bewusst weggeklickt, bleibt er weg.
   --------------------------------------------------------- */
@media (max-width: 768px) {
  #cmplz-manage-consent .cmplz-manage-consent.cmplz-show:not(.cmplz-dismissed) {
    display: block;
  }
}

/* ---------------------------------------------------------
   Einwilligungsbanner in der Farbwelt der Website

   Complianz liefert den Banner in seiner Werkseinstellung aus: weißer
   Grund, dunkelgrauer Text und ein hartes Violettblau `#3B29FF` für
   Zustimmen-Knopf, Verweise und Schalter. Auf dieser Seite wirkte das
   wie ein Fremdkörper.

   Alle Werte hier stammen aus den Marken-Tokens der Website. Es wird
   ausschließlich umgefärbt — Maße, Abstände und Radien bleiben, wie
   Complianz sie setzt.

   ZUM DOPPELTEN `:root`: Das ist kein Tippfehler. Complianz definiert
   seine Variablen selbst auf `:root`, und sein Stylesheet
   `banner-1-optin.css` wird NACH dem Theme geladen. Bei gleicher
   Spezifität gewänne dann die spätere Datei. `:root:root` liegt eine
   Stufe höher und setzt sich unabhängig von der Ladereihenfolge durch —
   ohne `!important` und ohne Eingriff in die Plugin-Einstellungen.
   --------------------------------------------------------- */
:root:root {
  /* Fläche und Text */
  --cmplz_banner_background_color: #111726;   /* --night */
  --cmplz_text_color: #C6CEDC;                /* --stone */
  --cmplz_hyperlink_color: #F4F7FB;           /* --ivory */

  /* Auf dunklem Grund braucht der Banner eine sichtbare Kante, sonst
     verschwimmt er mit Hero und Fußzeile. Werkseinstellung war 0px. */
  --cmplz_banner_border_color: rgba(226, 234, 246, 0.22);
  --cmplz_banner_border_width: 1px 1px 1px 1px;

  /* Alle drei Knöpfe tragen dieselbe ruhige Geisterfassung: gleiche
     Fläche, gleiche Kante, gleiche Schrift.

     Zustimmen war zuerst als heller Vollton gesetzt, wie `.button--light`
     auf der übrigen Seite. Das war gestalterisch naheliegend, hier aber
     falsch: Ein optisch hervorgehobenes „Zustimmen" neben einem blassen
     „Ablehnen" lenkt die Entscheidung. Genau das ist bei einer
     Einwilligung nicht zulässig — Annehmen und Ablehnen müssen
     gleichwertig aussehen. Gleiches Gewicht ist hier also nicht nur
     Wunsch, sondern der rechtlich saubere Zustand. */
  --cmplz_button_accept_background_color: transparent;
  --cmplz_button_accept_border_color: rgba(226, 234, 246, 0.28);
  --cmplz_button_accept_text_color: #F4F7FB;
  --cmplz_button_deny_background_color: transparent;
  --cmplz_button_deny_border_color: rgba(226, 234, 246, 0.28);
  --cmplz_button_deny_text_color: #F4F7FB;
  --cmplz_button_settings_background_color: transparent;
  --cmplz_button_settings_border_color: rgba(226, 234, 246, 0.28);
  --cmplz_button_settings_text_color: #F4F7FB;

  /* Schalter. Der Punkt bleibt hell, deshalb muss die aktive Bahn hell
     genug für den Punkt und dunkel genug für den Bannergrund sein. */
  --cmplz_slider_active_color: #7C88A0;
  --cmplz_slider_inactive_color: #3A4560;
  --cmplz_slider_bullet_color: #F4F7FB;
}

/* Der schwebende Verwaltungsknopf trägt eigene Flächen, die nicht über
   die Variablen laufen. Er wird hier auf dieselbe Geisterfassung
   gebracht wie Ablehnen und Einstellungen. */
#cmplz-manage-consent .cmplz-manage-consent {
  color: #F4F7FB;
  background-color: #111726;
  border: 1px solid rgba(226, 234, 246, 0.28);
}

#cmplz-manage-consent .cmplz-manage-consent:hover,
#cmplz-manage-consent .cmplz-manage-consent:focus-visible {
  color: #151D2E;
  background-color: #F4F7FB;
  border-color: #F4F7FB;
}

/* ---------------------------------------------------------
   Lesespalte
   --------------------------------------------------------- */
.ia-legal-content {
  min-width: 0;
  font-size: var(--text-body);
  line-height: 1.72;
  overflow-wrap: break-word;
}

.ia-legal-content > *:first-child {
  margin-top: 0;
}

.ia-legal-content > * + * {
  margin-top: 1.2em;
}

.ia-legal-translation-note {
  margin: 0 0 2rem;
  padding: 0.9rem 1rem;
  color: var(--stone);
  border-left: 2px solid var(--bronze);
  background: rgba(255, 255, 255, 0.035);
  font-size: var(--text-small);
}

.ia-legal-content h2 {
  margin-top: 2.5em;
  color: var(--ivory);
  font-size: clamp(1.28rem, 2.1vw, 1.75rem);
  font-weight: var(--display-weight);
  line-height: 1.14;
  letter-spacing: -0.022em;
  -webkit-hyphens: none;
  hyphens: none;
}

.ia-legal-content h3 {
  margin-top: 2em;
  color: var(--ivory);
  font-size: clamp(1.08rem, 1.5vw, 1.3rem);
  font-weight: var(--display-weight);
  line-height: 1.2;
  letter-spacing: -0.018em;
}

.ia-legal-content__subtitle {
  color: var(--ivory);
  font-size: clamp(1.15rem, 1.9vw, 1.5rem);
  font-weight: var(--display-weight);
  line-height: 1.2;
}

.ia-legal-content ul,
.ia-legal-content ol {
  margin-left: 0;
  padding-left: 1.15rem;
}

.ia-legal-content li + li {
  margin-top: 0.4em;
}

.ia-legal-content li::marker {
  color: var(--bronze);
}

.ia-legal-content a {
  color: var(--ivory);
  text-decoration: underline;
  text-decoration-color: var(--bronze);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.ia-legal-content a:hover,
.ia-legal-content a:focus-visible {
  text-decoration-color: currentColor;
}

/* Mehrzeilige Blöcke wie Anschriften */
.ia-legal-lines {
  overflow-wrap: anywhere;
}

.ia-legal-line {
  display: inline;
}

/* Leerzeilen im Muster-Widerrufsformular als ruhige Linie */
.ia-legal-line--form {
  display: block;
  width: min(100%, 26rem);
  height: 1.3em;
  color: transparent;
  border-bottom: 1px solid var(--hair-strong);
  overflow: hidden;
  white-space: nowrap;
  user-select: none;
}

/* Ankreuzzeilen der Widerrufsbelehrung */
.ia-legal-checkbox-line {
  padding-left: 1.7rem;
  text-indent: -1.7rem;
}

.ia-legal-content address {
  font-style: normal;
}

/* ---------------------------------------------------------
   Einfache Inhaltsseiten und 404
   --------------------------------------------------------- */
.ia-content-page {
  min-height: 70vh;
  padding: clamp(7.5rem, 13vw, 11rem) 0 clamp(4.5rem, 9vw, 7.5rem);
  color: var(--stone);
  background: var(--night);
}

.ia-content-page__inner {
  width: min(880px, calc(100% - 2 * var(--pad)));
  margin: 0 auto;
}

.ia-content-page h1 {
  max-width: 18ch;
  margin: 0 0 clamp(1.5rem, 4vw, 2.5rem);
  color: var(--ivory);
  font-size: clamp(1.75rem, 5.2vw, 3.25rem);
  font-weight: var(--display-weight);
  line-height: var(--display-leading);
  letter-spacing: var(--display-tracking);
  text-wrap: balance;
  -webkit-hyphens: none;
  hyphens: none;
}

.ia-content-page__content > * + * {
  margin-top: 1.2em;
}

.ia-content-page__content a {
  color: var(--ivory);
  text-decoration: underline;
  text-decoration-color: var(--bronze);
  text-underline-offset: 0.18em;
}

.ia-not-found .eyebrow {
  color: var(--bronze);
}

/* ---------------------------------------------------------
   Anfrageformular - Serverantwort

   Der Versandweg ist noch nicht eingerichtet. Die Regeln stehen
   trotzdem schon bereit, damit die Rückmeldung im Markenbild
   erscheint, sobald ein Empfänger hinterlegt ist.
   --------------------------------------------------------- */
.ia-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.inquiry-notice {
  margin: 0 0 1.25rem;
  padding: 0.95rem 1.1rem;
  border: 1px solid var(--hair-strong);
  border-radius: var(--radius);
  font-size: var(--text-small);
  line-height: 1.55;
}

.inquiry-notice--success {
  color: var(--ivory);
  border-color: var(--bronze);
}

.inquiry-notice--error {
  color: var(--ivory);
  border-color: #96331a;
}

@media (max-width: 900px) {
  .ia-legal-page__inner,
  .ia-legal-page__layout {
    grid-template-columns: minmax(0, 1fr);
    column-gap: 0;
  }

  .ia-legal-page__eyebrow,
  .ia-legal-page h1,
  .ia-legal-page__layout .ia-legal-nav,
  .ia-legal-page__layout .ia-legal-content {
    grid-column: 1;
  }

  .ia-legal-nav {
    position: static;
    flex-flow: row wrap;
    gap: 0.65rem 1.1rem;
    padding-bottom: 1.4rem;
    border-bottom: 1px solid var(--hair);
  }
}
