/*
Theme Name: deliverO
Theme URI: https://deliver-o.de
Description: Theme für deliverO – Amazon-Agentur. Kindtheme von Twenty Twenty-Five mit Logo-Farben (Schwarz/Gelb) und Montserrat.
Author: deliverO
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: deliver-o
*/

/* Kleine Ergänzungen, die theme.json nicht abdeckt */

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

/* Gelber Unterstrich als Markenakzent in Überschriften: <mark class="do-accent"> */
.do-accent { background: linear-gradient(transparent 62%, var(--wp--preset--color--accent) 62%); color: inherit; padding: 0 .08em; }

/* Karten für Leistungen, Referenzen, Schritte */
.do-card { border: 1px solid var(--wp--preset--color--line); border-radius: 14px; transition: border-color .2s, transform .2s; height: 100%; }
/* Karte mit weiteren Blöcken darunter nicht auf Spaltenhöhe strecken (sonst rutschen die Blöcke darunter aus der Spalte) */
.wp-block-column > .do-card:not(:only-child) { height: auto; }
.do-card:hover { border-color: var(--wp--preset--color--contrast); }
@media (prefers-reduced-motion: no-preference) { .do-card:hover { transform: translateY(-2px); } }

/* Nummerierte Schritte */
.do-step-number { display: inline-grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast); font-weight: 700; }

/* Referenzlogos einheitlich */
.do-logos img { max-height: 44px; width: auto; filter: grayscale(1); opacity: .75; }
.do-logos img:hover { filter: none; opacity: 1; }

/* Häkchenliste */
.do-checks { list-style: none; padding-left: 0; }
.do-checks li { position: relative; padding-left: 1.8em; margin-bottom: .5em; }
.do-checks li::before { content: ""; position: absolute; left: 0; top: .35em; width: 1.05em; height: 1.05em; border-radius: 50%; background: var(--wp--preset--color--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 10.5 3 3 7-7' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat; }

/* FAQ als aufklappbare Fragen */
.wp-block-details { border-bottom: 1px solid var(--wp--preset--color--line); padding: 1rem 0; }
.wp-block-details summary { font-weight: 600; cursor: pointer; }

/* Fokus gut sichtbar (Tastatur) */
:where(a, button, input, textarea, select, summary):focus-visible { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 2px; }

.do-header-cta .wp-block-button__link { white-space: nowrap; }
@media (max-width: 600px) { header .wp-block-buttons > .wp-block-button.do-header-cta { display: none; } }

/* Logos der Referenzen in Kacheln (PIKOSCH-Logo ist für dunklen Grund gemacht) */
.do-logo-tile { align-items: center; justify-content: center; height: 110px; border-radius: 12px; background: var(--wp--preset--color--surface); padding: 14px 24px; margin-bottom: 1.2rem; overflow: hidden; }
.do-logo-tile.is-dark { background: var(--wp--preset--color--night); }
.do-logo-tile figure { margin: 0; min-width: 0; max-width: 100%; flex: 0 1 auto; }
.do-logo-tile a { display: block; }
.do-logo-tile img { display: block; width: auto; height: auto; max-height: 72px; max-width: 100%; object-fit: contain; }
.do-logo-bar { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-top: .6rem; }
.do-logo-tile.is-small { height: 84px; margin: 0; padding: 12px 12px; }
.do-logo-tile.is-small img { max-height: 46px; }
/* Hochformat-Logos (Jean-Pierre Sand) dürfen höher sein */
.do-logo-tile img[src*="jean-pierre-sand"] { max-height: 86px; }
.do-logo-tile.is-small img[src*="jean-pierre-sand"] { max-height: 62px; }
/* LED-Bilder-Logo hat einen weißen Grund und ist hellrosa: weiße Kachel mit Rand */
.do-logo-tile:has(img[src*="ledbilder"]) { background: #fff; border: 1px solid var(--wp--preset--color--line); }

/* Marken ohne Logodatei: Namenskacheln */
.do-logo-tile.is-word p { margin: 0; line-height: 1.15; }
.do-logo-tile.is-word a { text-decoration: none; color: var(--wp--preset--color--contrast); display: flex; flex-direction: column; align-items: center; gap: 4px; }
.do-word-freshe { font-family: var(--wp--preset--font-family--montserrat); font-weight: 400; letter-spacing: .08em; font-size: .9rem; text-align: center; }
.do-word-help { font-family: var(--wp--preset--font-family--montserrat); font-weight: 800; font-size: 1.15rem; }
.do-word-sub { font-size: .66rem; color: var(--wp--preset--color--muted); letter-spacing: .02em; }
/* Umrandeter Button auf dunklem Grund */
.has-night-background-color .is-style-outline .wp-block-button__link { color: var(--wp--preset--color--base); border-color: var(--wp--preset--color--base); }
.has-night-background-color .is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }

/* Prephouse-Block im Corporate Design von Prephouse: Schwarz, Orange #F7931E, Readex Pro */
.pp-block { background: #000; color: #fff; font-family: var(--wp--preset--font-family--readex-pro); }
.pp-block :where(h1, h2, h3, p, li, a) { font-family: inherit; }
.pp-block h2 { font-weight: 700; letter-spacing: -.01em; }
.pp-block .pp-text { color: #d6d6d6; }
.pp-block .pp-eyebrow { color: var(--wp--preset--color--prephouse); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: var(--wp--preset--font-size--small); }
.pp-block .pp-logo { margin-bottom: .4rem; }
.pp-block .do-checks li::before { background-color: var(--wp--preset--color--prephouse); }
.pp-block .pp-button .wp-block-button__link { background: var(--wp--preset--color--prephouse); color: #000; border-radius: 6px; font-weight: 600; }
.pp-block .pp-button .wp-block-button__link:hover { background: #fff; color: #000; }
.pp-block a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--prephouse); }

/* Kontaktformular */
.do-form { display: grid; gap: .2rem; }
.do-form-reihe { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 600px) { .do-form-reihe { grid-template-columns: 1fr; } }
.do-form label { display: block; font-weight: 600; font-size: .95rem; margin-bottom: .35rem; }
.do-form input[type=text], .do-form input[type=email], .do-form input[type=tel], .do-form textarea { width: 100%; box-sizing: border-box; font: inherit; padding: .75rem .9rem; border: 1px solid var(--wp--preset--color--line); border-radius: 10px; background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
.do-form input:focus, .do-form textarea:focus { border-color: var(--wp--preset--color--contrast); }
.do-form-check label { font-weight: 400; display: flex; gap: .6rem; align-items: flex-start; }
.do-form-check input { margin-top: .3rem; width: 1.1rem; height: 1.1rem; flex: none; accent-color: var(--wp--preset--color--contrast); }
.do-form button { border: 0; cursor: pointer; }
.do-form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.do-form-fehler { background: #fdecea; color: #8a1c13; border-radius: 10px; padding: 1rem 1.2rem; }
.do-form-ok { background: var(--wp--preset--color--surface); border-left: 4px solid var(--wp--preset--color--accent); border-radius: 10px; padding: 1.2rem 1.4rem; }
.do-breadcrumb a { color: var(--wp--preset--color--muted); text-decoration: none; }
.do-breadcrumb a:hover { color: var(--wp--preset--color--contrast); }

/* Sprachumschalter im Kopf */
.do-lang a { font-weight: 600; font-size: .85em; letter-spacing: .04em; border: 1px solid var(--wp--preset--color--line); border-radius: 6px; padding: .15em .45em; }
/* Pippi Lissi: Wortmarke wie auf der Verpackung – weiße Serifenschrift auf Pink */
.do-logo-tile.is-pippi { background: #E5007D; }
.do-word-pippi { font-family: Georgia, 'Times New Roman', serif; color: #fff; font-size: 1.35rem; letter-spacing: .01em; }
.do-logo-tile.is-pippi a { color: #fff; }