/*
Theme Name: Welzerberg
Theme URI: https://www.hundehotel-welzerberg.de
Author: Hundehotel Welzerberg
Description: Schlankes Block-Theme (Full Site Editing) für das Hundehotel Welzerberg in Lindlar. Warme Farben, selbst gehostete Schriften, keine externen Abhängigkeiten.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: welzerberg
*/

/* ---------------------------------------------------------------------------
   Ergänzungen zu theme.json – nur, was sich dort nicht abbilden lässt.
   --------------------------------------------------------------------------- */

html {
	scroll-behavior: smooth;
	scroll-padding-top: 6rem;
}

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

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Header ----------------------------------------------------------------- */

.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: saturate(1.4) blur(10px);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	background-color: color-mix(in srgb, var(--wp--preset--color--base) 88%, transparent) !important;
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 10%, transparent);
}

.admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 32px); }

.site-header .wp-block-site-logo img {
	border-radius: 8px;
	height: auto;
}

.site-header .wp-block-site-title a { text-decoration: none; }

.site-header .wp-block-navigation a:where(:not(.wp-element-button)) {
	text-decoration: none;
	padding-block: .35em;
	border-bottom: 2px solid transparent;
	transition: border-color .2s ease, color .2s ease;
}

.site-header .wp-block-navigation a:where(:not(.wp-element-button)):hover,
.site-header .wp-block-navigation .current-menu-item > a,
.site-header .wp-block-navigation a[aria-current="page"] {
	border-bottom-color: var(--wp--preset--color--accent);
}

.wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--50);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	gap: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--large);
	font-family: var(--wp--preset--font-family--heading);
}

@media (max-width: 781px) {
	.site-header .header-cta { display: none; }
}

/* Inhaltsbausteine ------------------------------------------------------- */

.eyebrow {
	letter-spacing: .14em;
	text-transform: uppercase;
}

.is-style-card {
	background: var(--wp--preset--color--base);
	border-radius: 20px;
	box-shadow: 0 1px 2px rgb(36 57 45 / 6%), 0 8px 28px rgb(36 57 45 / 8%);
	transition: transform .25s ease, box-shadow .25s ease;
}

.is-style-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 2px 4px rgb(36 57 45 / 6%), 0 14px 36px rgb(36 57 45 / 12%);
}

.is-style-card-flat {
	border-radius: 20px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 14%, transparent);
}

.icon-badge img {
	width: 56px;
	height: 56px;
	padding: 12px;
	border-radius: 16px !important;
	background: var(--wp--preset--color--accent-soft);
}

.hero-image img { aspect-ratio: 4 / 3.4; object-fit: cover; }

.hero-badge {
	position: relative;
	margin-top: -3.5rem !important;
	margin-left: var(--wp--preset--spacing--40) !important;
	width: fit-content;
	box-shadow: 0 10px 30px rgb(36 57 45 / 18%);
}

@media (max-width: 781px) {
	.hero-badge { margin-top: -2.5rem !important; }
}

.fact-number {
	font-variant-numeric: lining-nums tabular-nums;
	line-height: 1 !important;
}

.price-tag {
	font-variant-numeric: lining-nums;
	line-height: 1 !important;
}

.step-number,
.step-number.has-background {
	display: inline-grid;
	padding: 0 !important;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 999px;
	font-weight: 700;
}

.quote-band blockquote { border: 0; padding: 0; }

/* FAQ (core/details) ----------------------------------------------------- */

.wp-block-details {
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--forest) 14%, transparent);
	padding-block: var(--wp--preset--spacing--30);
}

.wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	list-style: none;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

.wp-block-details summary::-webkit-details-marker { display: none; }

.wp-block-details summary::after {
	content: "+";
	font-family: var(--wp--preset--font-family--body);
	color: var(--wp--preset--color--accent);
	font-size: 1.5em;
	line-height: 1;
	transition: transform .2s ease;
}

.wp-block-details[open] summary::after { transform: rotate(45deg); }

.wp-block-details > :not(summary) { margin-top: var(--wp--preset--spacing--20); }

/* Galerie ---------------------------------------------------------------- */

.wp-block-gallery.has-nested-images figure.wp-block-image img {
	border-radius: 16px;
}

/* Contact Form 7 --------------------------------------------------------- */

.wpcf7 form { display: grid; gap: var(--wp--preset--spacing--30); }

.wpcf7 .wb-form-row {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}

.wpcf7 label {
	display: block;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--forest);
}

.wpcf7 label .wpcf7-form-control-wrap { margin-top: .4rem; display: block; }

.wpcf7 .wb-required { color: var(--wp--preset--color--accent); }

.wpcf7 input:where([type="text"], [type="email"], [type="tel"], [type="date"], [type="number"]),
.wpcf7 select,
.wpcf7 textarea {
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	font-weight: 400;
	font-size: 1rem;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--base);
	border: 1.5px solid color-mix(in srgb, var(--wp--preset--color--forest) 22%, transparent);
	border-radius: 12px;
	padding: .8rem 1rem;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.wpcf7 textarea { min-height: 9rem; resize: vertical; }

.wpcf7 input:focus, .wpcf7 select:focus, .wpcf7 textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--forest);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--wp--preset--color--sage) 30%, transparent);
}

.wpcf7 .wpcf7-acceptance label {
	display: flex;
	gap: .6rem;
	align-items: flex-start;
	font-weight: 400;
	color: var(--wp--preset--color--ink);
}

.wpcf7 .wpcf7-acceptance input { margin-top: .3rem; width: 1.1rem; height: 1.1rem; accent-color: var(--wp--preset--color--forest); }

.wpcf7 .wpcf7-list-item { margin: 0; }

.wpcf7 input[type="submit"] {
	justify-self: start;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
	color: var(--wp--preset--color--base);
	background: var(--wp--preset--color--accent);
	border: 0;
	border-radius: 999px;
	padding: .95rem 2rem;
	transition: background-color .2s ease, transform .2s ease;
}

.wpcf7 input[type="submit"]:hover { background: var(--wp--preset--color--accent-dark); transform: translateY(-1px); }
.wpcf7 input[type="submit"]:disabled { opacity: .6; cursor: wait; }

.wpcf7 .wpcf7-spinner { margin: 0 0 0 1rem; }

.wpcf7-not-valid-tip { font-size: var(--wp--preset--font-size--small); margin-top: .35rem; color: var(--wp--preset--color--accent-dark); }

.wpcf7 form .wpcf7-response-output {
	margin: 0;
	padding: 1rem 1.25rem;
	border-radius: 12px;
	border-width: 1.5px;
}

.wpcf7 form.sent .wpcf7-response-output { border-color: var(--wp--preset--color--sage); background: var(--wp--preset--color--sage-soft); }
.wpcf7 form:where(.invalid, .unaccepted, .failed, .spam, .aborted) .wpcf7-response-output { border-color: var(--wp--preset--color--accent); background: var(--wp--preset--color--accent-soft); }

.wb-form-note { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); margin: 0; }

/* Footer ----------------------------------------------------------------- */

.site-footer a { text-decoration-color: color-mix(in srgb, currentColor 40%, transparent); text-underline-offset: .2em; }
.site-footer a:hover { text-decoration-color: currentColor; }

/* Seiteninhalt: Abstand oben/unten nur, wenn keine volle-Breite-Sektion anschließt */
.wb-page-content > :first-child:not(.alignfull) { margin-top: var(--wp--preset--spacing--50); }
.wb-page-content > :last-child:not(.alignfull) { margin-bottom: var(--wp--preset--spacing--60); }
.wb-page-content > .alignfull + :not(.alignfull),
.wb-page-content > :not(.alignfull) + .alignfull { margin-top: var(--wp--preset--spacing--50); }
.wb-page-content .lead { font-size: var(--wp--preset--font-size--medium); color: var(--wp--preset--color--muted); }

.wb-plain-list { list-style: none; }
.wb-page-content > .lead:has(+ .alignfull) { margin-bottom: var(--wp--preset--spacing--50); }