/*
Theme Name:  IntelliVET Praxis
Theme URI:   https://intellivet.cloud
Author:      Morsdorf.IT
Author URI:  https://morsdorf-it.de
Description: Block-Theme für Tierarzt- und Tiertherapie-Praxen. Farben, Logo und Anschrift kommen aus IntelliVET; Terminbuchung, Gutscheine und Kurse binden sich selbst ein, sobald die Praxis sie gebucht hat.
Version:     1.7.0
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:        block-theme, full-site-editing, business, one-column, block-patterns
*/

/*
 * Fast alles steckt in theme.json — hier steht nur, was sich dort nicht
 * ausdrücken lässt.
 *
 * SCHRIFTEN KOMMEN AUS DIESEM ORDNER, NICHT VON GOOGLE
 * Wer Google Fonts direkt einbindet, schickt die IP-Adresse jedes Besuchers
 * ohne Einwilligung an Google. Für eine Praxis-Website in Deutschland ist das
 * ein Abmahnrisiko (LG München I, 3 O 17493/20). Die Dateien liegen deshalb
 * unter assets/fonts/ und werden in theme.json per @font-face eingebunden.
 */

/* Bilder im Kreis — das Gestaltungsmerkmal, das die Startseite trägt. */
.iv-rund img {
    border-radius: 50%;
    aspect-ratio: 1;
    object-fit: cover;
}

/* Eingebettete IntelliVET-Flächen sollen nicht in einer Karte stecken:
   Sie bringen ihre eigene Rahmung mit, zwei wirken wie ein Fehler. */
.iv-flaeche iframe {
    display: block;
    max-width: 100%;
}

/* Auszeichnung über einer Überschrift ("Zertifizierte Tierosteopathin"). */
.iv-marke {
    display: inline-block;
    border-radius: 999px;
    padding: 0.35em 1em;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Wer mit der Tastatur navigiert, muss sehen, wo er ist. Der Standard-Umriss
   verschwindet auf dunklen Flächen — deshalb ein eigener mit Abstand. */
:where(a, button, input, select, textarea, .wp-block-button__link):focus-visible {
    outline: 3px solid var(--wp--preset--color--accent);
    outline-offset: 2px;
}

/* Wer Bewegung abgestellt hat, bekommt keine. */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/*
 * Seitenname nur zeigen, wenn KEIN Logo da ist.
 *
 * Beides nebeneinander liest sich wie ein Fehler — und ein Logo trägt den
 * Namen fast immer schon. Ohne Logo braucht die Website aber einen Namen im
 * Kopf, deshalb keine feste Entscheidung, sondern eine vom Inhalt abhängige.
 */
.iv-kopfmarke:has(.wp-block-site-logo img) .wp-block-site-title {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

/*
 * Sprungmarken im Menü: Der Kopfbereich steht fest oben, ohne Abstand
 * verschwände die Überschrift des Zielabschnitts darunter.
 */
:target,
[id="ueber-uns"], [id="leistungen"], [id="termin"], [id="kontakt"] {
    scroll-margin-top: 6rem;
}

html {
    scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}