/* WordPress-Check (Landingpage WordPress Agentur Freiburg, P35, Fassung 2 vom 27.10.2026). Child assets/wordpress-check/snf-wordpress-check.css.
   Maße in rem (Theme: 1rem = 10 px), Farben wie der Ladezeit-Vergleich (Rot #8b0d14, Tinte #111, Fläche #f7f7f5, Linie #e3e1dc).
   Dazu die Stockwerke der Landingpage (Klassen snf-wpa-*). Lädt nur auf Seiten mit [snf_wp_check]. Rückbau: Datei löschen. */
.snf-wpc { --wpc-rot: #8b0d14; --wpc-tinte: #111; --wpc-flaeche: #f7f7f5; --wpc-linie: #e3e1dc; --wpc-gruen: #2f9e5b; --wpc-gelb: #f0a43a;
	margin: 2.8rem 0 1rem; text-align: left; }
.snf-wpc *, .snf-wpc *::before, .snf-wpc *::after { box-sizing: border-box; }

/* Eingabe als Aufforderung, wie beim Ladezeit-Vergleich */
.snf-wpc-form { position: relative; background: #fff; border: 2px solid var(--wpc-rot); border-radius: 1.6rem; padding: 2.4rem 2.4rem 2rem;
	box-shadow: 0 16px 40px rgba(139,13,20,.10); }
.snf-wpc-form label { display: block; font: 700 2rem/1.3 "Space Grotesk", sans-serif; color: var(--wpc-tinte); margin: 0 0 1.2rem; }
.snf-wpc-form label::after { content: " \2193"; color: var(--wpc-rot); }
.snf-wpc-zeile { display: flex; gap: 1rem; flex-wrap: wrap; }
.snf-wpc-zeile input[type="url"] { flex: 1 1 28rem; min-width: 0; padding: 1.6rem 1.8rem; border: 2px solid #c9c6bf; border-radius: 1.2rem;
	font: inherit; font-size: 1.9rem; background: #fff; color: var(--wpc-tinte); }
.snf-wpc-zeile input[type="url"]::placeholder { color: #8a8a85; }
.snf-wpc-zeile input[type="url"]:focus-visible { outline: 3px solid var(--wpc-rot); outline-offset: 2px; border-color: var(--wpc-rot); }
.snf-wpc-zeile button, .snf-wpc-uebernehmen { flex: 0 0 auto; padding: 1.6rem 2.8rem; border: 0; border-radius: 1.2rem; background: var(--wpc-rot); color: #fff;
	font: inherit; font-size: 1.7rem; font-weight: 700; cursor: pointer; transition: background .15s ease; }
.snf-wpc-zeile button:hover, .snf-wpc-uebernehmen:hover { background: #6e0a10; }
.snf-wpc-zeile button:focus-visible, .snf-wpc-uebernehmen:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.snf-wpc-zeile button[disabled] { background: #9a9a96; cursor: wait; }
.snf-wpc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.snf-wpc-hinweis { font-size: 1.4rem; color: #555; margin: .8rem 0 0; }
.snf-wpc-status { min-height: 2.4rem; margin: 1.6rem 0 0; font-size: 1.5rem; }
.snf-wpc-status[data-art="fehler"] { color: var(--wpc-rot); font-weight: 600; }
.snf-wpc-lauf .snf-wpc-status::before { content: ""; display: inline-block; width: 1.4rem; height: 1.4rem; margin-right: .8rem; vertical-align: -2px;
	border: 2px solid var(--wpc-linie); border-top-color: var(--wpc-rot); border-radius: 50%; animation: snf-wpc-dreh .8s linear infinite; }
@keyframes snf-wpc-dreh { to { transform: rotate(360deg); } }

/* Ergebnis */
.snf-wpc-ergebnis { margin-top: 1.6rem; background: var(--wpc-tinte); color: #fff; border-radius: 1.6rem; padding: 2.8rem 2.8rem 2.4rem;
	box-shadow: 0 16px 40px rgba(17,17,17,.18); }
.snf-wpc-ergebnis p, .snf-wpc-ergebnis dt, .snf-wpc-ergebnis dd, .snf-wpc-ergebnis li, .snf-wpc-ergebnis h3, .snf-wpc-ergebnis h4 { color: #fff; }
.snf-wpc-kopf { display: flex; align-items: center; gap: 2rem; border-bottom: 1px solid rgba(255,255,255,.18); padding-bottom: 1.8rem; margin-bottom: 2rem; }
.snf-wpc-host { margin: 0 0 .4rem; font: 700 2.4rem/1.2 "Space Grotesk", sans-serif; word-break: break-all; }
.snf-wpc-urteil { margin: 0; font-size: 1.6rem; }
.snf-wpc-marke { display: inline-block; background: var(--wpc-rot); color: #fff; border-radius: .6rem; padding: .1rem .8rem; font-weight: 700; }

/* Ringe: Note im Kopf und Ladezeit */
.snf-wpc-ring { position: relative; flex: 0 0 auto; width: 9.6rem; height: 9.6rem; }
.snf-wpc-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.snf-wpc-ring-bg { fill: none; stroke: rgba(255,255,255,.15); stroke-width: 10; }
.snf-wpc-ring-fg { fill: none; stroke: #fff; stroke-width: 10; stroke-linecap: round; stroke-dasharray: 402; transition: stroke-dashoffset 1s ease-out; }
.snf-wpc-ring span { position: absolute; inset: 0; display: grid; place-items: center; font: 700 2.1rem/1 "Space Grotesk", sans-serif; color: #fff; }
.snf-wpc-gruen .snf-wpc-ring-fg { stroke: var(--wpc-gruen); }
.snf-wpc-gelb .snf-wpc-ring-fg { stroke: var(--wpc-gelb); }
.snf-wpc-rot .snf-wpc-ring-fg { stroke: #e2474f; }
.snf-wpc-ring.snf-wpc-lauf svg { animation: snf-wpc-dreh2 1.4s linear infinite; }
.snf-wpc-ring.snf-wpc-lauf .snf-wpc-ring-fg { stroke: rgba(255,255,255,.6); stroke-dasharray: 60 342; stroke-dashoffset: 0 !important; }
@keyframes snf-wpc-dreh2 { from { transform: rotate(-90deg); } to { transform: rotate(270deg); } }

/* Ladezeit-Karte und Steckbrief nebeneinander */
.snf-wpc-oben { display: grid; grid-template-columns: 22rem 1fr; gap: 1.2rem; align-items: stretch; }
.snf-wpc-lz { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: .8rem;
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 1.2rem; padding: 1.6rem 1.4rem; }
.snf-wpc-lz .snf-wpc-ring { width: 11rem; height: 11rem; }
.snf-wpc-lz .snf-wpc-ring span { font-size: 3.2rem; }
.snf-wpc-lz-text { margin: 0; font-size: 1.4rem; line-height: 1.4; }
.snf-wpc-lz a, .snf-wpc-ergebnis a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.snf-wpc-klein-titel { margin: 0; font-size: 1.2rem; letter-spacing: .05em; text-transform: uppercase; color: rgba(255,255,255,.7) !important; }
.snf-wpc-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); gap: 1rem; margin: 0; }
.snf-wpc-z { margin: 0; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 1.2rem; padding: 1.2rem 1.4rem; }
.snf-wpc-z dt { font-size: 1.2rem; letter-spacing: .05em; text-transform: uppercase; color: rgba(255,255,255,.65) !important; margin: 0 0 .4rem; }
.snf-wpc-z dd { margin: 0; font: 600 1.7rem/1.35 "Space Grotesk", sans-serif; overflow-wrap: anywhere; }
.snf-wpc-klein { font-weight: 400; font-size: 1.35rem; color: rgba(255,255,255,.72) !important; margin: .4rem 0 0; }

/* Die zehn Dinge */
.snf-wpc-unter { margin: 2.8rem 0 1.2rem; }
.snf-wpc-top { list-style: none; counter-reset: wpc; margin: 0; padding: 0; display: grid; gap: .8rem; }
.snf-wpc-top li { counter-increment: wpc; position: relative; margin: 0; padding: 1.4rem 1.6rem 1.4rem 6rem; border-radius: 1.2rem;
	background: rgba(255,255,255,.06); border-left: 4px solid rgba(255,255,255,.25); }
.snf-wpc-top li::before { content: counter(wpc); position: absolute; left: 1.6rem; top: 1.4rem; width: 3rem; height: 3rem; border-radius: 50%;
	display: grid; place-items: center; font: 700 1.5rem/1 "Space Grotesk", sans-serif; background: rgba(255,255,255,.12); color: #fff; }
.snf-wpc-top li.snf-wpc-g3 { border-left-color: #e2474f; }
.snf-wpc-top li.snf-wpc-g3::before { background: #e2474f; }
.snf-wpc-top li.snf-wpc-g2 { border-left-color: var(--wpc-gelb); }
.snf-wpc-top h4 { margin: .4rem 0 .4rem; font-size: 1.7rem; line-height: 1.35; }
.snf-wpc-top p { margin: 0; font-size: 1.5rem; line-height: 1.5; color: rgba(255,255,255,.85) !important; }
.snf-wpc-chips { display: flex; gap: .6rem; flex-wrap: wrap; }
.snf-wpc-chip, .snf-wpc-bereich { font-size: 1.15rem; letter-spacing: .05em; text-transform: uppercase; border-radius: 99rem; padding: .2rem .8rem; }
.snf-wpc-chip { background: rgba(255,255,255,.14); }
.snf-wpc-g3 .snf-wpc-chip { background: #e2474f; }
.snf-wpc-g2 .snf-wpc-chip { background: var(--wpc-gelb); color: #111; }
.snf-wpc-bereich { border: 1px solid rgba(255,255,255,.25); color: rgba(255,255,255,.8); }
.snf-wpc-leer { font-size: 1.6rem; }
.snf-wpc-gut { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.snf-wpc-gut li { margin: 0; padding: .5rem 1.1rem .5rem 3rem; border-radius: 99rem; background: rgba(47,158,91,.18); font-size: 1.4rem; position: relative; }
.snf-wpc-gut li::before { content: "\2713"; position: absolute; left: 1.1rem; color: #6fd39a; font-weight: 700; }
.snf-wpc-schluss { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; margin: 2.8rem 0 0; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.18); }
.snf-wpc-schluss p { margin: 0; flex: 1 1 26rem; font-size: 1.5rem; }
.snf-wpc-stand { margin: 1.6rem 0 0; font-size: 1.3rem; color: rgba(255,255,255,.6) !important; }
@media (max-width: 700px) {
	.snf-wpc-form, .snf-wpc-ergebnis { padding: 2rem 1.6rem; }
	.snf-wpc-zeile button, .snf-wpc-uebernehmen { width: 100%; }
	.snf-wpc-oben { grid-template-columns: 1fr; }
	.snf-wpc-raster { grid-template-columns: 1fr 1fr; gap: .8rem; }
	.snf-wpc-z { padding: 1rem 1.1rem; }
	.snf-wpc-z dd { font-size: 1.5rem; }
	.snf-wpc-kopf { gap: 1.4rem; }
	.snf-wpc-ring { width: 8rem; height: 8rem; }
	.snf-wpc-ring span { font-size: 1.8rem; }
	.snf-wpc-top li { padding-left: 5.2rem; }
	.snf-wpc-top li::before { left: 1.2rem; }
}

/* Stockwerke der Landingpage */
.snf-wpa-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(34rem, 100%), 1fr)); gap: 1.6rem; margin: 2.8rem 0 0; text-align: left; }
.snf-wpa-raster > div { background: #fff; border: 1px solid rgba(17,17,17,.10); border-radius: 1.6rem; padding: 2.4rem 2.2rem; box-shadow: 0 10px 30px rgba(17,17,17,.05); }
.snf-wpa-raster.snf-wpa-zwei { grid-template-columns: repeat(auto-fit, minmax(min(30rem, 100%), 1fr)); }
.snf-wpa-zwei > div { border-top: 4px solid #8b0d14; }
.snf-wpa-raster h3 { margin: 0 0 .8rem; }
.snf-wpa-raster p { margin: 0; }
.snf-wpa-raster .snf-wpa-nr { display: inline-block; font: 700 1.3rem/1 "Space Grotesk", sans-serif; letter-spacing: .08em; color: #8b0d14; margin: 0 0 1rem; }
.snf-wpa-raster p + p { margin-top: 1rem; }
/* Leiste der Themes und Page-Builder: linksbündig wie die Überschrift, unser Theme vorn (Daniel, 27.10.2026: „verschoben“, „unschön unter“) */
.snf-wpa-leiste { display: flex; flex-wrap: wrap; gap: .8rem; margin: 2rem 0 2.8rem; padding: 0; list-style: none; justify-content: flex-start; }
.snf-wpa-leiste li { margin: 0; padding: .7rem 1.4rem; border-radius: 99rem; background: #fff; border: 1px solid rgba(17,17,17,.14); font-weight: 600; font-size: 1.5rem; }
.snf-wpa-leiste li::before { display: none; }
.snf-wpa-leiste li.snf-wpa-eigen { background: #8b0d14; border-color: #8b0d14; color: #fff; }
.snf-wpa-direkt { max-width: 78rem; margin: 0 auto; text-align: left; }
.snf-wpa-direkt .snf-wpa-merke { border-left: 4px solid #8b0d14; padding: 1.2rem 0 1.2rem 2rem; margin: 2rem 0 0; font-size: 1.8rem; line-height: 1.55; }
