/*
Theme Name:  IntelliVET Ruhe
Theme URI:   https://intellivet.cloud
Author:      Morsdorf.IT
Author URI:  https://morsdorf-it.de
Description: Block-Theme für Praxen, die sich bewusst vom Klinik-Look abgrenzen — Naturtöne, viel Luft, wenig Text, große Bilder, Serif-Überschriften. Farben, Logo und Anschrift kommen aus IntelliVET.
Version:     1.1.5
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License:     GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: intellivet-praxis
Tags:        blog, one-column, full-site-editing, block-patterns, custom-colors
*/

/*
 * ===========================================================================
 * WAS DIESES THEME ANDERS MACHT — und warum
 * Zielgruppe ist das Gegenmodell: In der Erhebung vom 2026-09-17 waren die
 * Seiten mit Naturtönen (Creme, Beige, Braun, Holz — 27 % von 102) durchweg
 * die neuesten. Sie duzen, zeigen große Bilder, schreiben wenig und verzichten
 * auf jede Klinik-Anmutung.
 *
 *   ANORDNUNG   „Über uns" direkt nach dem Aufmacher, noch vor den
 *               Leistungen. In dieser Gruppe ist die Person das Angebot;
 *               wer sich abgrenzen will, verkauft kein Verfahren. Steht in
 *               aufbau.conf.
 *   SCHRIFT     Playfair Display für Überschriften, Open Sans für Text. Das
 *               machen 3 von 102 Seiten — eine Minderheitsposition, und hier
 *               die richtige: Genau dieser Gruppe steht sie zu. In den
 *               anderen drei Themes wäre sie Mode.
 *   LUFT        Die weitesten Abstandsstufen aller Themes (bis 12rem). Luft
 *               IST hier die Gestaltung — nicht Rahmen, nicht Karten.
 *   EINSPALTIG  Fast alles läuft in einer Spalte, 680 px schmal. Zweispaltige
 *               Gegenüberstellungen wirken geordnet; das ist das Gegenteil
 *               dessen, was dieses Theme sagen will.
 *   KEINE RAHMEN Trennung entsteht durch Abstand und durch Haarlinien, nicht
 *               durch Kästen.
 *
 * WARUM DIE TEXTDOMAIN „intellivet-praxis" HEISST: Die Bausteintexte sind in
 * allen unseren Themes dieselben. Siehe intellivet-stall/style.css.
 * ===========================================================================
 */

/* Auszeichnung im Aufmacher: hier keine farbige Pille, sondern eine gesperrte
   Kleinschrift. Eine Pille ist ein Etikett; dieses Theme etikettiert nicht. */
.iv-marke {
    display: block;
    margin: 0;
    padding: 0;
    background: none !important;
    color: var(--wp--preset--color--muted) !important;
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
}

/* Haarlinie als einziges Trennmittel. */
.iv-linie {
    border: 0;
    border-top: 1px solid var(--wp--preset--color--line);
    margin-block: var(--wp--preset--spacing--50);
}

/* Schritt-Ziffer im Ablauf: große, blasse Zahl neben dem Text — sie ordnet,
   ohne zu rufen. */
.iv-schritt {
    margin: 0;
    font-family: var(--wp--preset--font-family--titel);
    font-size: 3.2rem;
    line-height: 1;
    color: var(--wp--preset--color--primary-light);
}

/* Das große Zitat. Ein einziges, mittig, in der Serif — drei kleine Kästen
   nebeneinander wären in diesem Theme ein Fremdkörper. */
.iv-zitat {
    max-width: 38ch;
    margin-inline: auto;
    text-align: center;
}
.iv-zitat cite {
    display: block;
    margin-top: var(--wp--preset--spacing--30);
    font-family: var(--wp--preset--font-family--text);
    font-size: .95rem;
    font-style: normal;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--wp--preset--color--muted);
}

/* Erreichbarkeit als Liste — Tag links, Zeit rechts. Bewusst eine Liste und
   keine Tabelle: Sie überlebt den Layout-Wechsel als Ganzes (siehe
   _gemeinsam/TEXTSTELLEN.md). */
.iv-zeiten { list-style: none; margin: 0; padding: 0; }
.iv-zeiten li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--wp--preset--color--line);
}
.iv-zeiten li:last-child { border-bottom: 0; }

/* Leistungen aus IntelliVET: keine Karten, nur Abstand und Haarlinien. */
.wp-block-intellivet-leistungen .iv-leistung {
    border: 0;
    border-top: 1px solid var(--wp--preset--color--line);
    border-radius: 0;
    background: none;
    padding-top: var(--wp--preset--spacing--40);
}

/* Aufklappbare Fragen ohne Kasten. */
#fragen .wp-block-details {
    border-top: 1px solid var(--wp--preset--color--line);
    padding: var(--wp--preset--spacing--30) 0;
}
#fragen .wp-block-details summary {
    font-family: var(--wp--preset--font-family--titel);
    font-size: 1.2rem;
    cursor: pointer;
}

/* WhatsApp-Verweis: erscheint nur, wenn in IntelliVET eine Nummer steht. */
.iv-whatsapp {
    display: inline-block;
    padding: .7em 1.6em;
    border-radius: 999px;
    background: #25D366;
    color: #0B2E13;
    font-weight: 600;
    text-decoration: none;
}
.iv-whatsapp:hover { opacity: .9; }

/* Menü mit vielen Einträgen umbrechen statt abschneiden. */
.wp-block-navigation__container { flex-wrap: wrap; }

/* Bilder groß und randlos — in diesem Theme tragen sie die Seite. */
.iv-bild-gross img {
    width: 100%;
    height: auto;
    border-radius: 0;
}

/* Sprungmarken: Der Kopfbereich steht fest oben. */
:target,
[id="ueber-uns"], [id="leistungen"], [id="termin"], [id="kontakt"],
[id="ablauf"], [id="einsatzgebiet"], [id="qualifikationen"],
[id="indikationen"], [id="stimmen"], [id="fragen"] {
    scroll-margin-top: 6rem;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

/* ===================================================== Eigene Mittel (2. Fassung)
 *
 * Die anderen Themes haben inzwischen jedes ihr eigenes Mittel: Sport schräge
 * Kanten und Konturziffern, Stall Fotostreifen und Bogenkanten mit Hufspur,
 * Klinik die überlappende Infoleiste. Hier ist es die ASYMMETRIE — und die
 * Abwesenheit von allem anderen.
 *
 * Kein Rahmen, kein Kasten, keine Fläche, keine Zierde. Was bleibt, ist die
 * Lage der Dinge zueinander.
 */

/*
 * ÜBERSCHRIFTEN HÄNGEN NACH LINKS AUS der Textspalte heraus.
 *
 * Das ist der einzige Bruch in diesem Theme, und er ist berechnet: Die
 * Überschrift beginnt zwei Zeichen links vom Text, dadurch liest man sie als
 * Marke am Rand und nicht als erste Textzeile. In einer schmalen Spalte ist
 * das der einzige Platz, an dem sich etwas auszeichnen lässt, ohne laut zu
 * werden.
 *
 * Auf dem Telefon nicht: Dort gibt es links keinen Platz zum Aushängen.
 */
@media (min-width: 900px) {
    section.wp-block-group > h2,
    .wp-block-group > h2 { margin-left: -2.5rem; }
}

/*
 * BILDER LAUFEN NACH RECHTS AUS DER SPALTE.
 *
 * Nicht randabfallend über die ganze Breite (das ist Stalls Mittel), sondern
 * um ein Stück breiter als der Text — genug, dass es auffällt, wenig genug,
 * dass die Spalte bestehen bleibt. Der Text daneben behält seine Kante.
 */
@media (min-width: 900px) {
    /*
     * NUR BILDER IN DER SPALTE, nicht randabfallende.
     *
     * Ein negativer rechter Rand laesst ein Bild aus der Textspalte
     * herauslaufen — das ist hier das Mittel. Bei einem `alignfull`-Bild, das
     * schon die ganze Breite hat, schiebt derselbe Rand es ueber den
     * Fensterrand hinaus: Am 2026-09-17 war die Seite dadurch 37 Pixel zu
     * breit und hatte eine waagerechte Scrollleiste, auf jeder Seite.
     *
     * Gemessen, nicht geschaetzt: `document.scrollWidth` 1739 gegen
     * `clientWidth` 1702, Verursacher `figure.iv-bild-gross.alignfull`.
     */
    .iv-bild-gross:not(.alignfull) { margin-right: clamp(-6rem, -4vw, -2rem); }
}

/* Randabfallende Bilder bleiben im Fenster — unabhaengig davon, was sonst
   an Raendern gesetzt ist. */
.iv-bild-gross.alignfull { margin-left: 0; margin-right: 0; max-width: 100%; }

/* Eine Haarlinie pro Abschnitt, nicht mehr. Sie steht kurz und links, nicht
   über die ganze Breite — ein Absatzzeichen, kein Trennstrich. */
.iv-linie { width: 4rem; margin-left: 0; border-top-width: 1px; }

/* Die Serif bleibt, aber ruhiger: 700 ist das einzige Schnittgewicht der
   Datei, also kommt die Ruhe aus der Größe und dem Zeilenabstand. */
h1, h2 { letter-spacing: -0.015em; }
h1 { line-height: 1.12; }
