/*
Theme Name:   Immobilien Sarasota (Kadence Child)
Theme URI:    https://www.immobiliensarasota.com/
Description:  Child-Theme für immobiliensarasota.com. Basiert auf Kadence und übernimmt Typografie, Abstände sowie Header- und Footer-Aufbau von bradentonbroker.de. Farbpalette, Typografie und Footer-Aufbau sind von dort übernommen; abweichend sind nur die Inhalte und die Bausteine dieser Domain.
Author:       Sea to Sky Realty · Weiss & Weiss International LLC
Author URI:   https://www.bradentonbroker.com/
Template:     kadence
Version:      1.0.6
Requires PHP: 7.4
Text Domain:  kadence-srq
Tags:         real-estate, german, sarasota
*/

/* ==========================================================================
   1 · Farbtoken
   --------------------------------------------------------------------------
   Seit dem 02.09.2026 aus der Kadence Global Palette von bradentonbroker.de
   übernommen. Die Palette regelt alles, was Kadence selbst zeichnet; diese
   Variablen decken ab, was in diesem Child-Theme dazukommt (Übergabeboxen,
   Faktenkästen, Tabellen, Hero).

   Beide Stellen müssen zusammenpassen. Wenn Du in der Palette etwas änderst,
   ändere es hier mit:

     palette1  #0E4A63  Ozean Tief (dunkle Flächen)
     palette2  #10788C  Türkis (Primärakzent)
     palette3  #A07440  Gold (Akzent)
     palette4  #F4EADB  Sand-Beige (helle Fläche)
     palette5  #FBF3E7  Sand (Seitenhintergrund)
     palette7  #0E4A63  Ozean Tief (Fließtext)
     palette8  #0A3A4E  Navy (Footer, Fließtextfarbe)
     palette9  #6B6B6B  Grau (Sekundärtext)
   ========================================================================== */

:root {
  --srq-accent:        #10788c;   /* Türkis, Primärakzent */
  --srq-accent-hover:  #0e4a63;   /* Ozean Tief */
  --srq-accent-soft:   #f4eadb;   /* Sand-Beige, Flächen und Hero */
  --srq-ink:           #0a3a4e;   /* Navy, Fließtext */
  --srq-muted:         #6b6b6b;   /* Grau, Sekundärtext */
  --srq-line:          #e3d5be;   /* warme Trennlinie, aus Sand abgeleitet */
  --srq-warn:          #a07440;   /* Gold */
  --srq-warn-soft:     #f6e8d2;   /* helles Gold */
}

/* ==========================================================================
   1b · Kontrastkorrekturen zur importierten Palette
   --------------------------------------------------------------------------
   Die Palette färbt Überschriften gold. Im Fließtext ist das gewollt und so
   auch auf bradentonbroker.de. Im Titelband und im Header trägt es nicht:
   Gold auf Ozean Tief kommt auf rund 2,5:1, der Untertitel stand in Sand auf
   Weiß und war praktisch unsichtbar.

   bradentonbroker.de korrigiert das in einer eigenen Datei des dortigen
   Child-Themes (30-corrections.css). Die haben wir bewusst nicht übernommen —
   hier steht die Entsprechung. Zielwerte aus dem Vergleich mit bb.de:
   H1 im Titelband #FBF3E7, Seitentitel und Untertitel #0E4A63.
   ========================================================================== */

.entry-hero .entry-title,
.page-hero-section .entry-title,
.entry-hero-container-inner .entry-title {
  color: #fbf3e7;
}

.entry-hero .kadence-breadcrumbs,
.entry-hero .kadence-breadcrumbs a,
.entry-hero .rank-math-breadcrumb,
.entry-hero .rank-math-breadcrumb a {
  color: #fbf3e7;
}

.entry-hero .kadence-breadcrumbs a:hover,
.entry-hero .rank-math-breadcrumb a:hover {
  color: #f4eadb;
}

.site-branding .site-title,
.site-branding .site-title a,
.site-title,
.site-title a {
  color: #0e4a63;
}

.site-branding .site-description,
.site-description {
  color: #0e4a63;
}

/* ==========================================================================
   2 · Hero über volle Breite
   Vorgabe: Das Hero-Bild hat immer volle Breite, ohne Container-Begrenzung.
   ========================================================================== */

/* Volle Breite kommt aus der Gutenberg-Ausrichtung „alignfull", nicht aus
   vw-Rechnerei. Sobald Kadence einen Container verschachtelt, verschiebt
   calc(50% - 50vw) den Block seitlich aus dem Bild — genau das war der Fehler
   im ersten Aufbau. Die Innenbreite regelt der Constrained-Layout-Container. */
.srq-hero {
  padding-block: 56px;
  background: var(--srq-accent-soft);
}

/* Steht der Hero als erster Block im Inhalt, blitzt darüber sonst ein
   weißer Streifen durch: der Innenabstand des weißen Inhaltskastens.
   Der wird hier zurückgenommen, damit die Fläche direkt unter dem
   Titelband ansetzt. */
.entry-content > .srq-hero:first-child {
  margin-top: calc(-1 * var(--global-content-boxed-padding, 2rem));
}

/* Kadence nullt bei .alignfull den seitlichen Innenabstand. Deshalb sitzt die
   Innenbreite nicht am Hero selbst, sondern an einem eigenen Container —
   so steht der Herotext in derselben Spalte wie der Rest der Seite. */
.srq-hero .srq-hero-innen {
  max-width: var(--wp--style--global--content-size, 1242px);
  margin-inline: auto;
  padding-inline: var(--global-content-edge-padding, 1.5rem);
}

.srq-hero .srq-hero-innen > *:first-child {
  margin-top: 0;
}

.srq-hero .srq-hero-sub {
  font-size: 1.15rem;
  line-height: 1.55;
  max-width: 46em;
}

.srq-hero .wp-block-buttons {
  margin-top: 26px;
}

.srq-hero img,
.srq-hero .kb-image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* ==========================================================================
   3 · IDX-Übergabe
   Der Wechsel nach bradentonbroker.com wird sichtbar angekündigt, nicht
   versteckt. Ein angekündigter Domainwechsel wird akzeptiert, ein
   überraschender führt zum Absprung.
   ========================================================================== */

.srq-idx {
  display: block;
  border: 1px solid var(--srq-line);
  border-left: 3px solid var(--srq-accent);
  border-radius: 0 4px 4px 0;
  padding: 18px 20px;
  margin: 28px 0;
  background: #fff;
}

.srq-idx__label {
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--srq-muted);
  display: block;
  margin-bottom: 8px;
}

.srq-idx__link {
  font-weight: 600;
  font-size: 1.02rem;
  color: var(--srq-accent);
  text-decoration: none;
  display: inline-block;
}

.srq-idx__link:hover,
.srq-idx__link:focus-visible {
  color: var(--srq-accent-hover);
  text-decoration: underline;
}

.srq-idx__note {
  display: block;
  font-size: .82rem;
  color: var(--srq-muted);
  margin-top: 6px;
}

/* ==========================================================================
   4 · Verweis nach bradentonbroker.de
   Für die beiden Seitennotizen (Longboat Key, Lakewood Ranch) und für jede
   Stelle, an der eine Erklärung auf der .de-Seite liegt.
   ========================================================================== */

.srq-verweis {
  border: 1px solid var(--srq-line);
  border-left: 3px solid var(--srq-warn);
  border-radius: 0 4px 4px 0;
  padding: 16px 20px;
  margin: 24px 0;
  background: var(--srq-warn-soft);
}

.srq-verweis p { margin: 0 0 10px; }
.srq-verweis p:last-child { margin-bottom: 0; }

.srq-verweis a {
  font-weight: 600;
  color: var(--srq-accent);
}

/* ==========================================================================
   5 · Stand-Datum und Quellenangaben
   Jede Seite trägt sichtbar Veröffentlichungs- und Aktualisierungsdatum,
   jede Zahl ihre Quelle. Genau daran scheitert der Wettbewerb.
   ========================================================================== */

.srq-stand {
  font-size: .82rem;
  color: var(--srq-muted);
  border-top: 1px solid var(--srq-line);
  padding-top: 12px;
  margin-top: 32px;
  display: block;
}

.srq-quelle {
  font-size: .82rem;
  color: var(--srq-muted);
  display: block;
  margin-top: -8px;
  margin-bottom: 20px;
}

.srq-quelle a { color: var(--srq-muted); text-decoration: underline; }
.srq-quelle a:hover { color: var(--srq-accent); }

/* Wir sind Makler, keine Kanzlei. Gehört unter jede Seite, die Regeln,
   Steuern oder Pflichten berührt. */
.srq-kein-rat {
  font-size: .85rem;
  line-height: 1.5;
  color: var(--srq-muted);
  background: #fff;
  border: 1px solid var(--srq-line);
  border-radius: 4px;
  padding: 14px 18px;
  margin: 32px 0 0;
}

/* ==========================================================================
   6 · Zahlenkasten für die Lagenseiten
   ========================================================================== */

.srq-fakten {
  display: grid;
  gap: 1px;
  background: var(--srq-line);
  border: 1px solid var(--srq-line);
  border-radius: 4px;
  overflow: hidden;
  margin: 26px 0;
}

@media (min-width: 640px) {
  .srq-fakten { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
  .srq-fakten { grid-template-columns: repeat(4, 1fr); }
}

.srq-fakt { background: #fff; padding: 16px 18px; }

.srq-fakt__wert {
  display: block;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--srq-ink);
  font-variant-numeric: tabular-nums;
}

.srq-fakt__label {
  display: block;
  font-size: .8rem;
  color: var(--srq-muted);
  margin-top: 6px;
  line-height: 1.35;
}

/* ==========================================================================
   7 · Formulare (Gravity Forms)
   Kein schwarzer Hintergrund bei Formularen — ausdrückliche Vorgabe.
   ========================================================================== */

.gform_wrapper {
  background: #fff;
  border: 1px solid var(--srq-line);
  border-radius: 4px;
  padding: 22px 24px;
}

.gform_wrapper .gform_title { margin-top: 0; }

.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"] {
  background: var(--srq-accent);
  border-color: var(--srq-accent);
  color: #fff;
}

.gform_wrapper .gform_button:hover,
.gform_wrapper input[type="submit"]:hover {
  background: var(--srq-accent-hover);
  border-color: var(--srq-accent-hover);
}

/* ==========================================================================
   8 · Tabellen
   Preis- und Statustabellen scrollen in ihrem eigenen Container, damit die
   Seite auf dem Telefon nie seitlich wandert.
   ========================================================================== */

.srq-tabelle { overflow-x: auto; margin: 24px 0; }
.srq-tabelle table { min-width: 560px; width: 100%; border-collapse: collapse; }
.srq-tabelle th,
.srq-tabelle td { padding: 10px 12px; border-bottom: 1px solid var(--srq-line); text-align: left; vertical-align: top; }
.srq-tabelle thead th { background: var(--srq-accent-soft); font-size: .8rem; }
.srq-tabelle td.zahl,
.srq-tabelle th.zahl { text-align: right; font-variant-numeric: tabular-nums; }

/* ==========================================================================
   9 · Barrierefreiheit
   ========================================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--srq-accent);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}