/* Design tokens from Figma "AO Bau FeuerMoment - my draft" (frame TYPOGRAFIA I KOLORY). Full reference: context/figma-design-tokens.md */
:root {
	--aob-black-3: #11100e;
	--aob-black-2: #292724;
	--aob-black-1: #77716b;
	--aob-light-1: #f5f2ed;
	--aob-light-2: #e4ded5;
	--aob-light-3: #c9c1b7;
	--aob-white: #f5f2ed;
	--aob-dark-graphite: #252525;
	--aob-brand: #f26a0a;
	--aob-brand-end: #f25b0a; /* end stop of the orange gradient (not a Figma variable) */
	--aob-brand-2: #c88a4a; /* Figma "Brand 2" (gold) */
	--aob-gold-border: rgba(200, 138, 74, 0.5);
	--aob-gold-soft: rgba(200, 138, 74, 0.3);
	--aob-btn-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--aob-gold-faint: rgba(200, 138, 74, 0.05);

	--aob-font-display: "ogg", "Times New Roman", serif; /* Adobe Fonts (Typekit) family name is lowercase */
	--aob-font-body: "Bricolage Grotesque", system-ui, sans-serif;
	--aob-font-form: var(--aob-font-body);

	--aob-radius: 8px; /* Figma Border-radius (some chips use 4px) */
	--aob-radius-pill: 800px;
	--aob-section-gap: 48px; /* Figma section-gap */
	--aob-cards-gap: 16px; /* Figma cards-gap */
	--aob-pad-x: 24px; /* Figma padding-horizontal */
	--aob-pad-y: 24px; /* Figma padding-vertical */
	--aob-shadow-button-secondary: 0 2px 10px rgba(242, 106, 10, 0.18);
	--aob-gutter: clamp(20px, 6.94vw, 100px);
	--aob-shadow-glass: 0 9px 11.9px rgba(0, 0, 0, 0.15);
	--aob-shadow-button: 0 2px 5px rgba(242, 106, 10, 0.18);
	--aob-gradient-button: linear-gradient(105.86deg, var(--aob-brand) 0%, var(--aob-brand-end) 100%);
	--aob-glass-bg: rgba(0, 0, 0, 0.55);
	--aob-glass-border: rgba(255, 255, 255, 0.08);
}

/* Layout helpers: 1240px grid + outer section padding (same as the agency's .p-2 convention). */
:not(#_) .aob-container {
	width: 100%;
	max-width: 1240px;
	margin-inline: auto;
}
:not(#_) .aob-p-2 { padding: 5rem 2rem; }
:not(#_) .aob-px-2 { padding-inline: 2rem; }
@media (max-width: 767px) {
	:not(#_) .aob-p-2 { padding: 5rem 1rem; }
	:not(#_) .aob-px-2 { padding-inline: 1rem; }
}

/* Hello Elementor sets `white-space: nowrap` on buttons; accordion questions live inside a button, so long ones
   stopped wrapping and stretched the page sideways on phones (916 px wide on a 390 px screen). */
:not(#_) .aob-faq__trigger,
:not(#_) .aob-post-faq__trigger,
:not(#_) .aob-why__trigger,
:not(#_) .aob-service-principles__trigger { white-space: normal; }

/* Long, dynamic German texts: automatic hyphenation (needs lang="de", set by aob_apply_content_lang()), a hard break as
   fallback for words that still do not fit, balanced headline lines and no one-word last lines in paragraphs. */
:not(#_) [class*="aob-"]:is(section, header, footer, article, aside, nav, dialog) { -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 7 3 3; overflow-wrap: break-word; }
:not(#_) [class*="aob-"]:is(h1, h2, h3, h4, h5, h6) { text-wrap: balance; }
:not(#_) [class*="aob-"]:is(p, li) { text-wrap: pretty; }