/*
Theme Name:   FamDeko Child
Theme URI:    https://famdeko.de/
Description:  Child-Theme für Fam.Deko – Dekoverleih für Hochzeit & Feiern (Hello Elementor).
Author:       LiD Werbeagentur
Template:     hello-elementor
Version:      0.8.1
Text Domain:  famdeko-child
*/

/* Farben und Typografie kommen aus dem Elementor Global Kit.
   Hier nur, was das Kit nicht abdeckt. */
:root {
	--fd-ivory: #FBF8F4;
	--fd-sand: #F3ECE4;
	--fd-gold: #B8956A;
	--fd-gold-dark: #9C7A50;
	--fd-rose: #D9B8AC;
	--fd-espresso: #2F2A26;
	--fd-white: #FFFFFF;
	--fd-whatsapp: #25D366;
	--fd-serif: 'Cormorant Garamond', Georgia, serif;
	--fd-sans: 'Jost', 'Helvetica Neue', Arial, sans-serif;
}

html { scroll-behavior: smooth; }
body { color: var(--fd-espresso); background: var(--fd-ivory); }
::selection { background: var(--fd-rose); color: var(--fd-espresso); }

/* ---------- Bausteine ---------- */
.fd-eyebrow {
	font: 500 13px/1.2 var(--fd-sans); letter-spacing: .24em; text-transform: uppercase;
	color: var(--fd-gold); margin: 0;
}
.fd-divider { display: block; width: 64px; height: 1px; background: var(--fd-gold); margin: 18px auto; }

/* ---------- Mobile Sticky-Leiste: WhatsApp · Anrufen · Anfrage ---------- */
.fd-mobile-bar { display: none; }
@media (max-width: 767px) {
	.fd-mobile-bar {
		display: grid; grid-template-columns: repeat(3, 1fr);
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
		background: var(--fd-espresso);
		box-shadow: 0 -2px 12px rgba(0,0,0,.18);
		padding-bottom: env(safe-area-inset-bottom);
	}
	.fd-mobile-bar a {
		display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
		min-height: 58px; font: 500 13px/1 var(--fd-sans); letter-spacing: .06em;
		color: var(--fd-white); text-decoration: none;
	}
	.fd-mobile-bar__wa { background: var(--fd-whatsapp); color: #fff; }
	.fd-mobile-bar__form { background: var(--fd-gold); }
	.fd-mobile-bar a:active { opacity: .85; }
	body { padding-bottom: calc(58px + env(safe-area-inset-bottom)); }
}

/* ---------- Header ---------- */
.fd-header { transition: box-shadow .3s, min-height .3s; border-bottom: 1px solid transparent; }
.fd-header.elementor-sticky--effects { box-shadow: 0 6px 24px rgba(47,42,38,.08); border-bottom-color: #EDE4D8; }
/* „Jetzt anfragen“ als dunkler Button im Menü */
.fd-mainnav .elementor-nav-menu--main .fd-menu-cta > a.elementor-item {
	background: var(--fd-espresso); color: var(--fd-white) !important;
	font-size: 13px !important; font-weight: 500 !important; letter-spacing: 2px !important; text-transform: uppercase;
	padding: 14px 26px !important; margin-left: 18px; border-radius: 2px; transition: background-color .2s;
}
.fd-mainnav .elementor-nav-menu--main .fd-menu-cta > a.elementor-item:hover,
.fd-mainnav .elementor-nav-menu--main .fd-menu-cta > a.elementor-item:focus-visible { background: var(--fd-gold); }
.fd-mainnav .elementor-nav-menu--main .fd-menu-cta > a.elementor-item::after,
.fd-mainnav .elementor-nav-menu--main .fd-menu-cta > a.elementor-item::before { display: none; }
.fd-mainnav .elementor-nav-menu--dropdown .fd-menu-cta > a { background: var(--fd-espresso) !important; color: #fff !important; justify-content: center; letter-spacing: 2px; text-transform: uppercase; font-size: 14px; }
.fd-mainnav .elementor-nav-menu--main .sub-menu { border-top: 1px solid var(--fd-gold); min-width: 260px; }
.fd-mainnav .elementor-nav-menu--dropdown.elementor-nav-menu__container { border-top: 1px solid #EDE4D8; }

/* ---------- Footer ---------- */
.fd-footer a { text-decoration: none; }
.fd-footer p { margin: 0 0 .8em; }
.fd-footer-rating a { color: #C9A878 !important; font-size: 14px; }
.fd-footer-orte .elementor-nav-menu { columns: 2; column-gap: 24px; }
.fd-footer-orte .elementor-nav-menu li { break-inside: avoid; }
.fd-footer-menu .elementor-item { line-height: 1.5 !important; }
.fd-copyright p { margin: 0; }
/* Mobiles Menü: volle Bildschirmbreite (statt Elementor-JS-„Stretch“, das bei Größenwechseln falsch rechnet) */
@media (max-width: 1024px) {
	.fd-mainnav { position: static; }
	.fd-header { position: relative; }
	.fd-mainnav .elementor-nav-menu--dropdown.elementor-nav-menu__container {
		position: absolute; left: 0 !important; right: 0; top: 100%; width: 100% !important; max-width: 100vw;
		margin-top: 0 !important; box-shadow: 0 16px 30px rgba(47,42,38,.12);
	}
	.fd-mainnav .elementor-nav-menu--dropdown a { padding-left: 24px !important; padding-right: 24px !important; }
}

/* ---------- Galerie [famdeko_galerie] ---------- */
.fd-gal__filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 0 40px; }
.fd-gal__filter button {
	font: 400 14px/1 var(--fd-sans); letter-spacing: .06em; padding: 11px 20px; cursor: pointer;
	background: transparent; color: var(--fd-espresso); border: 1px solid #D8CBBB; border-radius: 2px; transition: .2s;
}
.fd-gal__filter button:hover { border-color: var(--fd-gold); color: var(--fd-gold-dark); background: transparent; }
.fd-gal__filter button.is-active { background: var(--fd-espresso); border-color: var(--fd-espresso); color: #fff; }
.fd-gal__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.fd-gal--2 .fd-gal__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fd-gal--4 .fd-gal__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fd-gal__item { margin: 0 !important; position: relative; overflow: hidden; background: var(--fd-sand); }
.fd-gal__item[hidden] { display: none; }
.fd-gal__item img { display: block; width: 100%; aspect-ratio: 4 / 5; height: auto; object-fit: cover; transition: transform .7s ease; }
.fd-gal__item a:hover img { transform: scale(1.04); }
.fd-gal__item figcaption {
	position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 18px 14px; pointer-events: none;
	font: 500 20px/1.2 var(--fd-serif); color: #fff; background: linear-gradient(transparent, rgba(47,42,38,.7));
	opacity: 0; transform: translateY(8px); transition: .35s;
}
.fd-gal__item a:hover + figcaption, .fd-gal__item:focus-within figcaption { opacity: 1; transform: none; }
@media (max-width: 1024px) { .fd-gal__grid, .fd-gal--4 .fd-gal__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.fd-gal__grid { gap: 10px; }
	.fd-gal__item figcaption { opacity: 1; transform: none; font-size: 15px; padding: 26px 10px 8px; }
	.fd-gal__filter { gap: 6px; } .fd-gal__filter button { padding: 9px 12px; font-size: 13px; }
}

/* ---------- Buttons: Varianten ---------- */
.fd-btn-outline .elementor-button {
	background: transparent !important; color: var(--fd-espresso) !important;
	box-shadow: inset 0 0 0 1px var(--fd-espresso);
}
.fd-btn-outline .elementor-button:hover { background: var(--fd-espresso) !important; color: #fff !important; }
.fd-btn-wa .elementor-button { background: var(--fd-whatsapp) !important; }
.fd-btn-wa .elementor-button:hover { background: #1DA851 !important; }

/* ---------- Hero Startseite: Bogen-Bilder ---------- */
.fd-hero-media { position: relative; min-height: 620px; }
.fd-arch img { width: 100%; height: 100%; object-fit: cover; border-radius: 300px 300px 0 0; display: block; }
.fd-arch { position: absolute !important; right: 0; top: 0; width: 72% !important; height: 560px; }
.fd-arch .elementor-widget-container, .fd-arch .elementor-image { height: 100%; }
.fd-arch::after { content: ""; position: absolute; inset: -12px; border: 1px solid var(--fd-gold); border-radius: 312px 312px 0 0; pointer-events: none; }
.fd-arch--sm { left: 0; right: auto; top: 300px; width: 42% !important; height: 320px; z-index: 2; }
.fd-arch--sm img { border: 6px solid var(--fd-ivory); border-radius: 200px 200px 0 0; }
.fd-arch--sm::after { inset: -6px; border-radius: 206px 206px 0 0; }
@media (max-width: 1024px) {
	.fd-hero-media { min-height: 480px; }
	.fd-arch { height: 430px; } .fd-arch--sm { top: 230px; height: 250px; }
}
@media (max-width: 767px) {
	.fd-hero-media { min-height: 440px; margin-top: 10px; }
	.fd-arch { height: 400px; width: 74% !important; } .fd-arch--sm { top: 210px; height: 220px; width: 46% !important; }
}
.fd-h1-em { display: block; font-style: italic; color: var(--fd-gold-dark); }
.fd-trust a { color: var(--fd-gold-dark); text-decoration: none; font-size: 15px; }
.fd-trust a:hover { color: var(--fd-espresso); }

/* ---------- Anlass-Kacheln [famdeko_anlaesse] ---------- */
.fd-tiles { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px 22px; }
.fd-tile { flex: 0 0 calc(25% - 17px); text-decoration: none; color: var(--fd-espresso) !important; }
.fd-tile__m { display: block; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 160px 160px 0 0; background: var(--fd-ivory); }
.fd-tile__m img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; display: block; }
.fd-tile:hover .fd-tile__m img { transform: scale(1.05); }
.fd-tile__t { display: block; text-align: center; font: 500 24px/1.2 var(--fd-serif); margin-top: 14px; transition: color .2s; }
.fd-tile:hover .fd-tile__t { color: var(--fd-gold-dark); }
@media (max-width: 1024px) { .fd-tile { flex-basis: calc(33.333% - 15px); } }
@media (max-width: 767px) { .fd-tiles { gap: 22px 12px; } .fd-tile { flex-basis: calc(50% - 6px); } .fd-tile__t { font-size: 19px; } }

/* ---------- Ablauf [famdeko_ablauf] ---------- */
.fd-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px; counter-reset: none; }
.fd-steps li { border-top: 1px solid #E4D8C8; padding-top: 22px; }
.fd-steps__n { display: block; font: italic 400 42px/1 var(--fd-serif); color: var(--fd-gold); margin-bottom: 12px; }
.fd-steps__t { font-size: 26px !important; margin: 0 0 8px; }
.fd-steps p { margin: 0; font-size: 16px; color: #6E645C; }
@media (max-width: 1024px) { .fd-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .fd-steps { grid-template-columns: 1fr; gap: 26px; } }

/* ---------- Pakete [famdeko_pakete] ---------- */
.fd-pakete { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.fd-paket { background: var(--fd-ivory); border: 1px solid #E4D8C8; padding: 44px 30px 36px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.fd-paket p { margin: 0; }
.fd-paket__n { font: 500 12px/1.4 var(--fd-sans); letter-spacing: .2em; text-transform: uppercase; margin-bottom: 16px !important; }
.fd-paket__p { font: 500 58px/1 var(--fd-serif); color: var(--fd-gold-dark); margin-bottom: 16px !important; }
.fd-paket__p.is-anfrage { font-size: 40px; font-style: italic; }
.fd-paket__d { font-size: 16px; color: #6E645C; flex: 1; margin-bottom: 14px !important; }
.fd-paket__i { font-size: 13px; letter-spacing: .04em; color: var(--fd-gold-dark); margin-bottom: 24px !important; }
.fd-paket__btn {
	display: inline-block; padding: 15px 28px; font: 500 13px/1 var(--fd-sans); letter-spacing: 2px; text-transform: uppercase;
	color: var(--fd-espresso) !important; text-decoration: none; border: 1px solid var(--fd-espresso); transition: .2s;
}
.fd-paket__btn:hover { background: var(--fd-espresso); color: #fff !important; }
.fd-paket.is-hl { background: var(--fd-espresso); border-color: var(--fd-espresso); color: #fff; }
.fd-paket.is-hl .fd-paket__p { color: var(--fd-rose); }
.fd-paket.is-hl .fd-paket__d { color: #D8CEC3; }
.fd-paket.is-hl .fd-paket__i { color: #C9A878; }
.fd-paket.is-hl .fd-paket__btn { background: var(--fd-gold); color: #fff !important; border-color: var(--fd-gold); }
.fd-paket.is-hl .fd-paket__btn:hover { background: var(--fd-gold-dark); }
.fd-pakete__hinweis { text-align: center; font-size: 14px; color: #6E645C; margin: 26px 0 0; }
@media (max-width: 900px) { .fd-pakete { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; } }

/* ---------- Orte [famdeko_orte] ---------- */
.fd-orte { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.fd-orte a, .fd-orte span { display: inline-block; padding: 9px 18px; font-size: 15px; border: 1px solid #D8CBBB; background: var(--fd-ivory); color: var(--fd-espresso); text-decoration: none; transition: .2s; }
.fd-orte a:hover { border-color: var(--fd-espresso); background: var(--fd-espresso); color: #fff; }
.fd-orte span[aria-current] { background: var(--fd-gold); border-color: var(--fd-gold); color: #fff; }

/* ---------- FAQ [famdeko_faq] ---------- */
.fd-faq { display: grid; gap: 0; border-top: 1px solid #E4D8C8; text-align: left; }
.fd-faq__item { border-bottom: 1px solid #E4D8C8; }
.fd-faq__q { cursor: pointer; list-style: none; padding: 22px 50px 22px 0; position: relative; font: 500 23px/1.3 var(--fd-serif); color: var(--fd-espresso); }
.fd-faq__q::-webkit-details-marker { display: none; }
.fd-faq__q::after { content: '+'; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font: 300 30px/1 var(--fd-sans); color: var(--fd-gold); transition: transform .2s; }
.fd-faq__item[open] .fd-faq__q::after { transform: translateY(-50%) rotate(45deg); }
.fd-faq__a { padding: 0 40px 22px 0; color: #6E645C; }
.fd-faq__a p { margin: 0; }
.fd-faq__a a { color: var(--fd-gold-dark); }

/* ---------- Vorteile (Warum Fam.Deko) ---------- */
.fd-usp .elementor-icon-box-title { margin-bottom: 8px; }

/* ---------- Anlass-Seiten ---------- */
.fd-split-img img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 280px 280px 0 0; display: block; }
.fd-split-img { position: relative; }
.fd-split-img::after { content: ""; position: absolute; inset: -12px; border: 1px solid var(--fd-gold); border-radius: 292px 292px 0 0; pointer-events: none; }
@media (max-width: 767px) { .fd-split-img img { border-radius: 200px 200px 0 0; } .fd-split-img::after { inset: -8px; border-radius: 208px 208px 0 0; } }
.fd-ph-img { max-width: 360px; } .fd-ph-img img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.fd-faq__gruppe { font-size: 30px !important; margin: 50px 0 10px; }
.fd-faq__gruppe:first-child { margin-top: 0; }

/* Tabelle (Preise) */
.fd-table { width: 100%; border-collapse: collapse; background: var(--fd-ivory); font-size: 17px; }
.fd-table th, .fd-table td { text-align: left; padding: 16px 20px; border-bottom: 1px solid #E4D8C8; vertical-align: top; }
.fd-table th { font: 500 12px/1.4 var(--fd-sans); letter-spacing: .18em; text-transform: uppercase; color: var(--fd-gold-dark); background: var(--fd-white); }
.fd-table td a { color: var(--fd-espresso); text-decoration: underline; text-decoration-color: var(--fd-gold); text-underline-offset: 3px; }
.fd-table td strong { font: 500 22px/1 var(--fd-serif); color: var(--fd-gold-dark); }
.fd-table__note { text-align: center; font-size: 14px; color: #6E645C; margin: 22px 0 0; }
@media (max-width: 600px) { .fd-table { font-size: 15px; } .fd-table th, .fd-table td { padding: 12px; } }
/* Sichtbarer Platzhalter für fehlende Kundenangaben */
.fd-todo { background: #FFF4D6; border: 1px dashed #C9A13B; padding: 10px 14px; font-size: 15px; color: #6b5310 !important; }

.fd-orte--nachbarn a { font-size: 16px; padding: 12px 22px; }

/* ---------- Formular ---------- */
.fd-form .elementor-field-group > label { color: var(--fd-espresso); }
.fd-form .elementor-field-textual:focus, .fd-form select:focus { border-color: var(--fd-gold) !important; box-shadow: 0 0 0 3px rgba(184,149,106,.18); outline: 0; }
.fd-form .elementor-field-type-acceptance label { font-weight: 400 !important; font-size: 14px !important; line-height: 1.5; }
.fd-form .elementor-field-type-acceptance a { color: var(--fd-gold-dark); }
.fd-form .elementor-field-type-upload input { font-size: 14px; }
.fd-form .elementor-button { letter-spacing: 2px; text-transform: uppercase; font-size: 14px; padding: 18px 30px; }
.fd-form .elementor-mark-required .elementor-field-label::after { color: var(--fd-gold-dark); }

/* ---------- Rechtstexte ---------- */
.fd-legal h2 { font-size: 28px !important; margin: 32px 0 10px; }
.fd-legal p, .fd-legal li { font-size: 17px; }
.fd-legal a { color: var(--fd-gold-dark); }
.fd-legal h3 { font-size: 23px !important; margin: 26px 0 8px; }
.fd-legal h4 { font: 600 16px/1.4 var(--fd-sans) !important; margin: 18px 0 6px; }
.fd-legal p, .fd-legal li { overflow-wrap: anywhere; }
.fd-paket__ab { font: italic 400 26px/1 var(--fd-serif); vertical-align: 0.35em; margin-right: 2px; }
