/* =========================================================
   LIVERY — Theme CSS (nur Tokens)
   ========================================================= */

/* Reset & Basics */
body {
	background-color: var(--bg);
	color: var(--text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

a {
	color: var(--link);
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
	transition: text-decoration-thickness 0.15s ease-out;
}
a:hover {
	text-decoration-thickness: 2px;
}

/* Forms */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select,
.wp-block-search__input {
	height: 48px;
	border-radius: var(--radius-sm);
	border: 1.5px solid var(--input-border);
	background: var(--surface);
	color: var(--text);
	padding: 0 16px;
	transition: border-color 0.15s ease-out, box-shadow 0.15s ease-out;
	font-family: var(--font-body);
}

input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.wp-block-search__input:focus-visible {
	outline: none;
	border-color: var(--input-border-focus);
	box-shadow: 0 0 0 3px color-mix(in oklch, var(--input-border-focus) 30%, transparent);
}

input::placeholder,
textarea::placeholder {
	color: var(--text-subtle);
}

input[aria-invalid="true"] {
	border-color: var(--danger);
}

/* =========================================================
   BLOCK STYLES
   ========================================================= */

/* Buttons */
.wp-block-button__link {
	border-radius: var(--radius-sm) !important;
	min-height: 48px;
	padding: 0 24px !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: all 0.15s ease-out;
	text-decoration: none;
	border: 2px solid transparent;
}
.wp-block-button__link:active {
	transform: translateY(1px);
}
.wp-block-button__link:focus-visible {
	outline: 3px solid var(--focus);
	outline-offset: 2px;
}
.wp-block-button__link:disabled,
.wp-block-button__link[aria-disabled="true"] {
	cursor: not-allowed;
	opacity: 0.6;
	pointer-events: none;
}

/* Button: Primary (Default) */
.is-style-primary .wp-block-button__link,
.wp-block-button:not(.is-style-secondary):not(.is-style-accent):not(.is-style-ghost) .wp-block-button__link,
.wp-block-search__button {
	background-color: var(--btn-primary-bg) !important;
	color: var(--btn-primary-fg) !important;
}
.is-style-primary .wp-block-button__link:hover,
.wp-block-button:not(.is-style-secondary):not(.is-style-accent):not(.is-style-ghost) .wp-block-button__link:hover,
.wp-block-search__button:hover {
	background-color: var(--primary-hover) !important;
}

/* Button: Secondary */
.is-style-secondary .wp-block-button__link {
	background-color: var(--btn-secondary-bg) !important;
	color: var(--btn-secondary-fg) !important;
}
.is-style-secondary .wp-block-button__link:hover {
	background-color: var(--secondary-hover) !important;
}

/* Button: Accent */
.is-style-accent .wp-block-button__link {
	background-color: var(--btn-accent-bg) !important;
	color: var(--btn-accent-fg) !important;
}
.is-style-accent .wp-block-button__link:hover {
	background-color: var(--accent-hover) !important;
}

/* Button: Ghost (on Brand) */
.is-style-ghost .wp-block-button__link {
	background-color: transparent !important;
	color: var(--white) !important;
	border-color: var(--white) !important;
}
.is-style-ghost .wp-block-button__link:hover {
	background-color: var(--on-brand-hover) !important;
}

/* Groups */
.is-style-section-a {
	background-color: var(--section-a);
}
.is-style-section-b {
	background-color: var(--section-b);
}
.is-style-brand {
	background-color: var(--brand-surface);
	color: var(--on-brand);
	--focus: var(--yellow-400); /* override */
	--link: var(--on-brand);
}
.is-style-brand h1, .is-style-brand h2, .is-style-brand h3, .is-style-brand h4, .is-style-brand h5, .is-style-brand h6 {
	color: var(--on-brand);
}
.is-style-contact {
	background-color: var(--contact-bg);
	color: var(--contact-fg);
}
.is-style-contact h1, .is-style-contact h2, .is-style-contact h3, .is-style-contact h4, .is-style-contact h5, .is-style-contact h6 {
	color: var(--contact-fg);
}

.is-style-info-card {
	background-color: var(--surface);
	color: var(--text);
	border-radius: var(--radius-md);
	border-left: 4px solid var(--blue-800);
	border-image: var(--livery) 1 100%; /* If we want full stripe, but left border is fine */
	border-left: 4px solid transparent;
	background-image: linear-gradient(var(--surface), var(--surface)), var(--livery);
	background-origin: border-box;
	background-clip: padding-box, border-box;
	border-right: 0; border-top: 0; border-bottom: 0;
}
.is-style-card {
	background-color: var(--surface);
	border-radius: var(--radius-md);
	border: 1px solid var(--border);
	padding: 28px;
	box-shadow: none;
}

/* Headings */
.is-style-stripe {
	position: relative;
	padding-bottom: 24px;
}
.is-style-stripe::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 64px;
	height: 4px;
	background: var(--livery);
	transform: skewX(-12deg);
}

.is-style-eyebrow {
	font-family: var(--font-head);
	font-weight: 700;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

/* Images */
.is-style-hover-zoom figure, .is-style-hover-zoom {
	overflow: hidden;
	border-radius: var(--radius-md);
}
.is-style-hover-zoom img {
	transition: transform 0.4s ease-out;
}
.is-style-hover-zoom:hover img {
	transform: scale(1.03);
}

.is-style-portrait-round img {
	border-radius: 50%;
	border: 3px solid var(--secondary);
}

/* Paragraphs */
.is-style-contact-line {
	display: flex;
	align-items: center;
	min-height: 44px;
	gap: 12px;
}
.is-style-contact-line a {
	text-decoration: none;
	color: inherit;
	font-weight: 600;
}
.is-style-contact-line a:hover {
	text-decoration: underline;
}
.is-style-contact-line a[href^="tel:"]::before,
.is-style-contact-line a[href^="mailto:"]::before {
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-color: var(--primary);
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	vertical-align: middle;
	margin-right: 12px;
}
/* Base64 basic icons for tel and mailto */
.is-style-contact-line a[href^="tel:"]::before {
	-webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>');
	mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>');
}
.is-style-contact-line a[href^="mailto:"]::before {
	-webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>');
	mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>');
}

.is-style-lead {
	font-size: 1.125rem;
	line-height: 1.6;
}
@media (min-width: 768px) {
	.is-style-lead { font-size: 1.25rem; }
}

/* =========================================================
   UTILITIES & SPECIFICS
   ========================================================= */

/* Hero Stripe */
.has-livery-stripe-bottom {
	position: relative;
}
.has-livery-stripe-bottom::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 10px;
	background: var(--livery);
}

/* Footer Top Stripe */
.has-livery-stripe-top {
	position: relative;
}
.has-livery-stripe-top::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 4px;
	background: var(--livery);
}

/* Reveal Animation */
.livery-reveal {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.4s ease-out, transform 0.4s ease-out;
}
.livery-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}
/* No-JS fallback */
html:not(.js) .livery-reveal {
	opacity: 1;
	transform: none;
}

/* Navbar specific */
.livery-navbar-buttons {
	display: flex;
	gap: 16px;
	align-items: center;
}
@media (max-width: 959px) {
	.livery-navbar-buttons {
		flex-direction: column;
		width: 100%;
		align-items: stretch;
	}
}

/* Form specific on Brand */
.is-style-brand input {
	background: var(--on-brand-input-bg);
	color: var(--on-brand-input-fg);
	border-color: transparent;
}
.is-style-brand input::placeholder {
	color: var(--text-muted);
}