/*
Theme Name: SEO Niedersachsen
Theme URI: https://www.seo-niedersachsen.com
Author: Tim Benjamin Peters
Description: Individuelles Block-Theme für den OnePager SEO-Niedersachsen.com. Norddeutsche Klarheit, Navy + frisches Grün, Bricolage Grotesque + Instrument Sans.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: seo-niedersachsen
*/

/* ---------- Basis ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
:target { scroll-margin-top: 90px; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid var(--wp--preset--color--accent);
  outline-offset: 2px;
}

/* Skip-Link */
.sn-skip-link { position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--wp--preset--color--contrast); color: #fff; padding: 12px 20px; border-radius: 0 0 8px 0; }
.sn-skip-link:focus { left: 0; }

/* ---------- Header ---------- */
.sn-header { position: sticky; top: 0; z-index: 100; background: rgba(250,248,243,.92); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(15,28,38,.1); }
.sn-header .wp-block-navigation a { font-weight: 500; }
.sn-logo { font-family: var(--wp--preset--font-family--headline); font-weight: 800; font-size: 19px; letter-spacing: -.02em; color: var(--wp--preset--color--contrast); text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.sn-logo::before { content: ""; width: 12px; height: 12px; background: var(--wp--preset--color--accent); border-radius: 3px; }

/* ---------- Buttons ---------- */
.wp-block-button__link, .wp-element-button { border-radius: 9px; font-weight: 600; }
.is-style-outline .wp-block-button__link { border: 1.5px solid rgba(15,28,38,.25); color: var(--wp--preset--color--contrast); }
.is-style-outline .wp-block-button__link:hover { border-color: var(--wp--preset--color--contrast); }
.wp-block-button__link:hover { filter: brightness(.9); }

/* ---------- Karten & Chips ---------- */
.sn-card { background: #fff; border: 1px solid rgba(15,28,38,.1); border-radius: 14px; }
.sn-card--accent { border: 2px solid var(--wp--preset--color--accent); }
.sn-card--dark { background: var(--wp--preset--color--navy-soft); border: 1px solid rgba(255,255,255,.09); }
.sn-chip { display: inline-block; background: var(--wp--preset--color--tint); border-radius: 20px; padding: 7px 14px; font-size: 13.5px; font-weight: 500; }
.sn-chip--outline { background: #fff; border: 1px solid rgba(15,28,38,.12); padding: 8px 16px; font-size: 14.5px; }
.sn-eyebrow { font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--accent-dark); }
.sn-num { font-family: var(--wp--preset--font-family--headline); font-weight: 800; color: var(--wp--preset--color--accent); }
.sn-quote-bar { border-left: 4px solid var(--wp--preset--color--accent); padding-left: 22px; }

/* Listen mit Akzent-Strich */
.sn-list ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 7px; }
.sn-list li { padding-left: 18px; position: relative; }
.sn-list li::before { content: "–"; position: absolute; left: 0; color: var(--wp--preset--color--accent); font-weight: 700; }
.sn-list--check li::before { content: "\2713"; }

/* ---------- FAQ (core/details) ---------- */
.wp-block-details { background: #fff; border: 1px solid rgba(15,28,38,.1); border-radius: 12px; padding: 0 24px; }
.wp-block-details summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; font-weight: 600; font-size: 17px; min-height: 44px; cursor: pointer; list-style: none; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; color: var(--wp--preset--color--accent); font-size: 22px; transition: transform .2s; }
.wp-block-details[open] summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { padding-bottom: 22px; }

/* ---------- Formular (WPForms) ---------- */
.sn-form-card { background: #fff; border-radius: 16px; padding: 36px; }
.sn-form-card .wpforms-field label.wpforms-field-label { font-weight: 600; font-size: 14px; color: var(--wp--preset--color--contrast); }
.sn-form-card .wpforms-field input, .sn-form-card .wpforms-field textarea {
  width: 100%; box-sizing: border-box; border: 1.5px solid rgba(15,28,38,.2) !important; border-radius: 8px !important;
  padding: 12px 14px !important; font-size: 15.5px !important; background: var(--wp--preset--color--base) !important;
}
.sn-form-card button[type=submit] {
  width: 100%; background: var(--wp--preset--color--accent) !important; color: #fff !important; border: none !important;
  border-radius: 9px !important; padding: 16px !important; font-weight: 600 !important; font-size: 16.5px !important; cursor: pointer;
}
.sn-form-card button[type=submit]:hover { filter: brightness(.9); }

/* ---------- Sticky Mobile CTA ---------- */
.sn-mobile-cta { display: none; }
@media (max-width: 920px) {
  .sn-mobile-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 110; gap: 10px; align-items: center;
    background: rgba(15,28,38,.97); backdrop-filter: blur(8px); padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); }
  .sn-mobile-cta__tel { flex: none; width: 48px; height: 48px; border-radius: 10px; border: 1px solid rgba(255,255,255,.25); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; text-decoration: none; }
  .sn-mobile-cta__main { flex: 1; background: var(--wp--preset--color--accent); color: #fff; font-weight: 600; font-size: 15.5px; text-align: center; padding: 14px 10px; border-radius: 10px; text-decoration: none; }
  body { padding-bottom: 78px; }
}

/* ---------- Kontakt-Optionskarten ---------- */
.sn-contact-option { display: flex; align-items: center; gap: 14px; background: var(--wp--preset--color--navy-soft); border: 1px solid rgba(255,255,255,.1); border-radius: 12px; padding: 16px 20px; color: #fff; text-decoration: none; }
.sn-contact-option:hover { border-color: var(--wp--preset--color--accent-light); }
.sn-contact-option__icon { width: 38px; height: 38px; border-radius: 9px; background: rgba(95,206,147,.15); color: var(--wp--preset--color--accent-light); display: flex; align-items: center; justify-content: center; font-weight: 700; flex: none; }

/* ---------- Platzhalter-Markierung (vor Launch entfernen) ---------- */
.sn-ph { display: inline-block; border: 1.5px dashed #b8860b; color: #8a6508; background: #fdf6e3; border-radius: 6px; padding: 6px 10px; font-family: ui-monospace, Menlo, monospace; font-size: 12px; }

/* ---------- Responsiv ---------- */
@media (max-width: 920px) {
  .sn-hide-mobile { display: none !important; }
}