/* ===========================================================================
 * Gourmandises de Racha - main stylesheet
 * ---------------------------------------------------------------------------
 * Organisation:
 *   1.  Design tokens
 *   2.  Reset & base
 *   3.  Typography
 *   4.  Layout helpers
 *   5.  Buttons & form controls
 *   6.  Announcement bar
 *   7.  Header & navigation
 *   8.  Drawers — mobile menu (8) and cart (8b)
 *   9.  Footer
 *   10. Home sections
 *   11. Editorial / generic pages
 *   12. Floating WhatsApp button
 *   13. Accessibility & reduced motion
 * Product, cart and checkout styles live in woocommerce.css.
 * ========================================================================= */

/* ---------------------------------------------------------------------------
 * 1. Design tokens
 * Aliases over the theme.json presets, with literal fallbacks so the stylesheet
 * still renders correctly if the preset variables are ever unavailable.
 * ------------------------------------------------------------------------- */
:root {
	--gdr-ivory:    var(--wp--preset--color--ivory, #F7F1ED);
	--gdr-cream:    var(--wp--preset--color--cream, #FDFAF8);
	--gdr-blush:    var(--wp--preset--color--blush, #E8D8D5);
	--gdr-cocoa:    var(--wp--preset--color--cocoa, #261A18);
	--gdr-praline:  var(--wp--preset--color--praline, #9B5C3D);
	--gdr-gold:     var(--wp--preset--color--gold, #C6A36C);
	--gdr-burgundy: var(--wp--preset--color--burgundy, #7B2634);
	--gdr-muted:    var(--wp--preset--color--muted, #6B5B54);
	--gdr-line:     var(--wp--preset--color--line, #E6DCD6);
	--gdr-white:    var(--wp--preset--color--white, #FFFFFF);
	--gdr-success:  #3F7D5C;

	--gdr-font-heading: var(--wp--preset--font-family--heading, "Cormorant Garamond", Georgia, serif);
	--gdr-font-body:    var(--wp--preset--font-family--body, Manrope, Inter, system-ui, sans-serif);

	--gdr-space-2xs: 0.5rem;
	--gdr-space-xs:  1rem;
	--gdr-space-sm:  1.75rem;
	--gdr-space-md:  3rem;
	--gdr-space-lg:  4.5rem;
	--gdr-space-xl:  6.5rem;

	--gdr-radius:      2px;
	--gdr-radius-lg:   4px;
	--gdr-radius-pill: 999px;

	--gdr-shadow-soft: 0 1px 2px rgba(38, 26, 24, 0.04), 0 8px 24px rgba(38, 26, 24, 0.06);
	--gdr-shadow-lift: 0 2px 4px rgba(38, 26, 24, 0.05), 0 16px 40px rgba(38, 26, 24, 0.10);

	--gdr-container: 1240px;
	--gdr-container-narrow: 860px;
	--gdr-gutter: 1.25rem;

	--gdr-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--gdr-duration: 200ms;

	--gdr-header-height: 64px;
	--gdr-sticky-bar-height: 0px;
}

@media (min-width: 782px) {
	:root {
		--gdr-gutter: 2.5rem;
		--gdr-header-height: 84px;
	}
}

/* ---------------------------------------------------------------------------
 * 2. Reset & base
 * ------------------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--gdr-header-height) + 1rem);
}

body {
	margin: 0;
	background-color: var(--gdr-ivory);
	color: var(--gdr-cocoa);
	font-family: var(--gdr-font-body);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

img,
picture,
video,
svg { max-width: 100%; height: auto; display: block; }

button,
input,
select,
textarea { font: inherit; color: inherit; }

table { border-collapse: collapse; width: 100%; }

hr {
	border: 0;
	border-top: 1px solid var(--gdr-line);
	margin: var(--gdr-space-md) 0;
}

ul, ol { padding-inline-start: 1.25em; }

/* Prevent the sticky mobile bar from covering the end of the page. */
body.gdr-has-sticky-bar { padding-bottom: var(--gdr-sticky-bar-height); }

/* Lock scrolling while the mobile drawer is open. */
body.gdr-drawer-open { overflow: hidden; }

/*
 * The hidden attribute must win against a component's own display value.
 * Author rules outrank the UA sheet, so every `display: flex` / `inline-flex`
 * silently defeated `[hidden]` — the configurator's Retour and Ajouter au
 * panier buttons showed on every step because of it. Patching this per
 * component was already done four times below; this is the general rule.
 */
[hidden] { display: none !important; }

/* ---------------------------------------------------------------------------
 * 3. Typography
 * ------------------------------------------------------------------------- */
h1, h2, h3, .gdr-display {
	font-family: var(--gdr-font-heading);
	font-weight: 500;
	line-height: 1.14;
	letter-spacing: -0.005em;
	margin: 0 0 0.5em;
	color: var(--gdr-cocoa);
	text-wrap: balance;
}

h1, .gdr-display { font-size: clamp(2.25rem, 1.5rem + 3.2vw, 3.75rem); }
h2 { font-size: clamp(1.75rem, 1.25rem + 2vw, 2.5rem); }
h3 { font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem); }

h4, h5, h6 {
	font-family: var(--gdr-font-body);
	font-weight: 600;
	letter-spacing: 0.02em;
	margin: 0 0 0.5em;
	line-height: 1.35;
	color: var(--gdr-cocoa);
}
h4 { font-size: 1.0625rem; }
h5 { font-size: 0.9375rem; }
h6 { font-size: 0.875rem; }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

a {
	color: var(--gdr-praline);
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
}
a:hover { color: var(--gdr-burgundy); }

.gdr-lead {
	font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
	color: var(--gdr-muted);
	max-width: 58ch;
}

.gdr-eyebrow {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--gdr-praline);
	margin: 0 0 0.75rem;
}

/* Thin champagne rule under section titles - decorative only. */
.gdr-rule {
	display: block;
	width: 48px;
	height: 1px;
	background: var(--gdr-gold);
	border: 0;
	margin: 1rem 0 0;
}
.gdr-rule--center { margin-inline: auto; }

.gdr-section__head { margin-bottom: var(--gdr-space-sm); }
.gdr-section__head--center { text-align: center; }
.gdr-section__head--center .gdr-lead { margin-inline: auto; }
.gdr-section__head h2 { margin-bottom: 0.35em; }

/* ---------------------------------------------------------------------------
 * 4. Layout helpers
 * ------------------------------------------------------------------------- */
.gdr-container {
	width: 100%;
	max-width: var(--gdr-container);
	margin-inline: auto;
	padding-inline: var(--gdr-gutter);
}
.gdr-container--narrow { max-width: var(--gdr-container-narrow); }
.gdr-container--flush { padding-inline: 0; }

.gdr-section { padding-block: var(--gdr-space-lg); }
.gdr-section--tight { padding-block: var(--gdr-space-md); }
.gdr-section--roomy { padding-block: var(--gdr-space-xl); }
.gdr-section--cream { background: var(--gdr-cream); }
.gdr-section--blush { background: var(--gdr-blush); }
.gdr-section--cocoa { background: var(--gdr-cocoa); color: rgba(247, 241, 237, 0.86); }
.gdr-section--cocoa h1,
.gdr-section--cocoa h2,
.gdr-section--cocoa h3,
.gdr-section--cocoa h4 { color: var(--gdr-ivory); }
.gdr-section--cocoa .gdr-lead { color: rgba(247, 241, 237, 0.78); }
.gdr-section--cocoa .gdr-eyebrow { color: var(--gdr-gold); }
.gdr-section--cocoa a { color: var(--gdr-gold); }

.gdr-grid { display: grid; gap: var(--gdr-space-sm); }
.gdr-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.gdr-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.gdr-grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); }
.gdr-grid--tight { gap: var(--gdr-space-xs); }

.gdr-stack > * + * { margin-top: var(--gdr-space-xs); }
.gdr-center { text-align: center; }
.gdr-mt-md { margin-top: var(--gdr-space-md); }
.gdr-mt-sm { margin-top: var(--gdr-space-sm); }
.gdr-mt-xs { margin-top: var(--gdr-space-xs); }

/* Media frames keep every editorial image on a consistent aspect ratio. */
.gdr-frame {
	position: relative;
	overflow: hidden;
	background: var(--gdr-blush);
	border-radius: var(--gdr-radius);
}
.gdr-frame > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 400ms var(--gdr-ease);
}
.gdr-frame--portrait { aspect-ratio: 4 / 5; }
.gdr-frame--square   { aspect-ratio: 1 / 1; }
.gdr-frame--wide     { aspect-ratio: 3 / 2; }
.gdr-frame--tall     { aspect-ratio: 3 / 4; }

/* Placeholder shown wherever real photography is still missing. */
.gdr-placeholder {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	background:
		repeating-linear-gradient(45deg, rgba(198, 163, 108, 0.07) 0 14px, transparent 14px 28px),
		var(--gdr-cream);
	/* A visible edge, so a missing photo reads as a reserved frame, not a gap. */
	box-shadow: inset 0 0 0 1px rgba(198, 163, 108, 0.35);
	color: var(--gdr-praline);
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: center;
	padding: 1rem;
	width: 100%;
	height: 100%;
	min-height: 120px;
}
/* The icon sits in a thin champagne ring so a missing photo reads as intended. */
.gdr-placeholder svg {
	width: 22px;
	height: 22px;
	padding: 11px;
	box-sizing: content-box;
	border: 1px solid rgba(198, 163, 108, 0.5);
	border-radius: var(--gdr-radius-pill);
	opacity: 0.75;
}

/* ---------------------------------------------------------------------------
 * 5. Buttons & form controls
 * ------------------------------------------------------------------------- */
.gdr-btn,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 48px;
	padding: 0.95rem 1.85rem;
	border: 1px solid transparent;
	border-radius: var(--gdr-radius);
	background: var(--gdr-cocoa);
	color: var(--gdr-ivory);
	font-family: var(--gdr-font-body);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--gdr-duration) var(--gdr-ease),
		border-color var(--gdr-duration) var(--gdr-ease),
		color var(--gdr-duration) var(--gdr-ease);
}

.gdr-btn:hover,
.gdr-btn:focus-visible,
.wp-block-button__link:hover { background: var(--gdr-praline); color: var(--gdr-ivory); }

.gdr-btn--outline {
	background: transparent;
	color: var(--gdr-cocoa);
	border-color: var(--gdr-cocoa);
}
.gdr-btn--outline:hover,
.gdr-btn--outline:focus-visible { background: var(--gdr-cocoa); color: var(--gdr-ivory); }

.gdr-btn--light {
	background: var(--gdr-ivory);
	color: var(--gdr-cocoa);
	border-color: var(--gdr-ivory);
}
.gdr-btn--light:hover,
.gdr-btn--light:focus-visible { background: var(--gdr-gold); color: var(--gdr-cocoa); border-color: var(--gdr-gold); }

.gdr-btn--ghost {
	background: transparent;
	color: var(--gdr-praline);
	border-color: var(--gdr-line);
	min-height: 44px;
	padding: 0.7rem 1.25rem;
}
.gdr-btn--ghost:hover,
.gdr-btn--ghost:focus-visible { background: var(--gdr-blush); color: var(--gdr-burgundy); border-color: var(--gdr-blush); }

.gdr-btn--full { width: 100%; }
.gdr-btn--sm { min-height: 44px; padding: 0.65rem 1.1rem; font-size: 0.875rem; }
.gdr-btn[disabled],
.gdr-btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }

.gdr-btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: var(--gdr-space-xs);
}
.gdr-btn-row--center { justify-content: center; }
/*
 * A lone centred button on a phone reads as misaligned against the full-width
 * content above it, even though it is centred to the pixel. Letting it span the
 * row lines its edges up with that content — and takes the tap target from
 * ~230px to the full column. Rows with two buttons keep their natural width.
 */
@media (max-width: 781px) {
	.gdr-btn-row--center .gdr-btn:only-child { width: 100%; }
}

/* Text link with a hairline underline. */
.gdr-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-weight: 600;
	font-size: 0.9375rem;
	color: var(--gdr-praline);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 2px;
}
.gdr-link-arrow:hover { color: var(--gdr-burgundy); }

/* Inputs */
.gdr-field { display: block; margin-bottom: var(--gdr-space-xs); }
.gdr-field__label {
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	margin-bottom: 0.35rem;
	color: var(--gdr-cocoa);
}
.gdr-field__required { color: var(--gdr-burgundy); }
.gdr-field__hint {
	display: block;
	font-size: 0.8125rem;
	color: var(--gdr-muted);
	margin-top: 0.35rem;
}
.gdr-field__error {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--gdr-burgundy);
	margin-top: 0.35rem;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="search"],
input[type="date"],
input[type="password"],
select,
textarea {
	width: 100%;
	min-height: 48px;
	padding: 0.7rem 0.9rem;
	background: var(--gdr-white);
	border: 1px solid var(--gdr-line);
	border-radius: var(--gdr-radius);
	color: var(--gdr-cocoa);
	font-size: 1rem; /* 16px prevents iOS zoom on focus */
	transition: border-color var(--gdr-duration) var(--gdr-ease), box-shadow var(--gdr-duration) var(--gdr-ease);
}
textarea { min-height: 130px; resize: vertical; line-height: 1.6; }

input:focus,
select:focus,
textarea:focus {
	outline: none;
	border-color: var(--gdr-praline);
	box-shadow: 0 0 0 3px rgba(155, 92, 61, 0.16);
}

input[aria-invalid="true"],
select[aria-invalid="true"],
textarea[aria-invalid="true"] { border-color: var(--gdr-burgundy); }

select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236B5B54' stroke-width='1.5'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px;
	padding-right: 2.25rem;
}

/* Honeypot field - visually removed but not display:none (bots ignore that). */
.gdr-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Notices */
.gdr-notice {
	padding: 1rem 1.15rem;
	border-radius: var(--gdr-radius);
	border-left: 3px solid var(--gdr-gold);
	background: var(--gdr-cream);
	font-size: 0.9375rem;
	margin-bottom: var(--gdr-space-xs);
}
.gdr-notice--success { border-left-color: var(--gdr-success); }
.gdr-notice--error { border-left-color: var(--gdr-burgundy); }
.gdr-notice--info { border-left-color: var(--gdr-praline); }
.gdr-notice ul { margin: 0.5rem 0 0; }

/* Badges */
.gdr-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.3rem 0.65rem;
	border-radius: var(--gdr-radius-pill);
	background: var(--gdr-blush);
	color: var(--gdr-cocoa);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.2;
	white-space: nowrap;
}
.gdr-badge--burgundy { background: var(--gdr-burgundy); color: var(--gdr-ivory); }
.gdr-badge--gold { background: var(--gdr-gold); color: var(--gdr-cocoa); }
.gdr-badge--out { background: var(--gdr-line); color: var(--gdr-muted); }
.gdr-badge--cocoa { background: var(--gdr-cocoa); color: var(--gdr-ivory); }

/* ---------------------------------------------------------------------------
 * 6. Announcement bar
 * ------------------------------------------------------------------------- */
.gdr-announcement {
	background: var(--gdr-cocoa);
	color: rgba(247, 241, 237, 0.92);
	font-size: 0.8125rem;
	letter-spacing: 0.02em;
	position: relative;
	z-index: 60;
}
.gdr-announcement__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	min-height: 38px;
	padding-block: 0.4rem;
	text-align: center;
}
.gdr-announcement__items {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.gdr-announcement__item {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}
.gdr-announcement__item + .gdr-announcement__item::before {
	content: "";
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--gdr-gold);
	margin-right: 0.85rem;
}
.gdr-announcement a { color: var(--gdr-gold); }

/* ---------------------------------------------------------------------------
 * 7. Header & navigation
 * ------------------------------------------------------------------------- */
.gdr-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--gdr-cream);
	border-bottom: 1px solid var(--gdr-line);
}

.gdr-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: var(--gdr-header-height);
}

.gdr-brand {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	text-decoration: none;
	color: var(--gdr-cocoa);
	flex-shrink: 0;
}
.gdr-brand__mark {
	width: 44px;
	height: 44px;
	flex: 0 0 44px;
}
.gdr-brand__mark img { width: 100%; height: 100%; object-fit: contain; }
.gdr-brand__text {
	font-family: var(--gdr-font-heading);
	font-size: 1.2rem;
	line-height: 1.05;
	font-weight: 500;
	letter-spacing: 0.005em;
}
.gdr-brand__text span { display: block; }
.gdr-brand:hover { color: var(--gdr-praline); }

@media (min-width: 992px) {
	.gdr-brand__mark { width: 52px; height: 52px; flex-basis: 52px; }
	.gdr-brand__text { font-size: 1.45rem; }
}

/* Primary navigation (desktop) */
.gdr-nav { display: none; }
/* 1080px rather than 992: below that the seven entries, the logo and the
   icons together overflow the header. Measured at 1024px (35px over) and at
   1060px (2px over); 1080px is the first width with room to spare. */
@media (min-width: 1080px) {
	.gdr-nav { display: block; flex: 1 1 auto; }
	/*
	 * The gap and the type scale with the viewport instead of being fixed.
	 * A seventh entry made the row wider than the header at 992px, and each
	 * label broke across two lines — "Coffrets &" above "occasions" — which
	 * read as a fault rather than as a menu.
	 */
	.gdr-nav__list {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: clamp(0.8rem, 1.5vw, 1.85rem);
		margin: 0;
		padding: 0;
		list-style: none;
		min-width: 0;
	}
	.gdr-nav__list a {
		position: relative;
		display: inline-block;
		padding: 0.4rem 0;
		/* Never break a label in half: the row shrinks, the words do not. */
		white-space: nowrap;
		font-size: clamp(0.82rem, 1.05vw, 0.9375rem);
		font-weight: 500;
		letter-spacing: 0.01em;
		color: var(--gdr-cocoa);
		text-decoration: none;
	}
	.gdr-nav__list a::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: 1px;
		background: var(--gdr-praline);
		transform: scaleX(0);
		transform-origin: left;
		transition: transform var(--gdr-duration) var(--gdr-ease);
	}
	.gdr-nav__list a:hover,
	.gdr-nav__list .current-menu-item > a,
	.gdr-nav__list .current_page_item > a { color: var(--gdr-praline); }
	.gdr-nav__list a:hover::after,
	.gdr-nav__list .current-menu-item > a::after,
	.gdr-nav__list .current_page_item > a::after { transform: scaleX(1); }

	/* One level of dropdown, keyboard accessible. */
	.gdr-nav__list li { position: relative; }
	.gdr-nav__list .sub-menu {
		position: absolute;
		top: 100%;
		left: 50%;
		transform: translateX(-50%);
		min-width: 220px;
		margin: 0;
		padding: 0.5rem 0;
		list-style: none;
		background: var(--gdr-white);
		border: 1px solid var(--gdr-line);
		border-radius: var(--gdr-radius);
		box-shadow: var(--gdr-shadow-soft);
		opacity: 0;
		visibility: hidden;
		transition: opacity var(--gdr-duration) var(--gdr-ease), visibility var(--gdr-duration);
	}
	.gdr-nav__list li:hover > .sub-menu,
	.gdr-nav__list li:focus-within > .sub-menu { opacity: 1; visibility: visible; }
	.gdr-nav__list .sub-menu a {
		display: block;
		padding: 0.55rem 1.1rem;
		font-size: 0.9rem;
	}
	.gdr-nav__list .sub-menu a::after { display: none; }
	.gdr-nav__list .sub-menu a:hover { background: var(--gdr-cream); }
}

/* Header actions */
.gdr-header__actions {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	flex-shrink: 0;
}

.gdr-iconbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--gdr-radius);
	background: transparent;
	color: var(--gdr-cocoa);
	cursor: pointer;
	text-decoration: none;
	transition: background-color var(--gdr-duration) var(--gdr-ease), color var(--gdr-duration) var(--gdr-ease);
}
.gdr-iconbtn:hover,
.gdr-iconbtn:focus-visible { background: var(--gdr-blush); color: var(--gdr-praline); }
.gdr-iconbtn svg { width: 21px; height: 21px; }

.gdr-cart-count {
	position: absolute;
	top: 4px;
	right: 2px;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	border-radius: var(--gdr-radius-pill);
	background: var(--gdr-burgundy);
	color: var(--gdr-ivory);
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
}
.gdr-cart-count[hidden] { display: none; }

@media (min-width: 1080px) {
	.gdr-burger { display: none; }
}

/* Search panel toggled from the header. */
.gdr-searchpanel {
	display: none;
	border-top: 1px solid var(--gdr-line);
	background: var(--gdr-white);
	padding-block: var(--gdr-space-xs);
}
.gdr-searchpanel.is-open { display: block; }
.gdr-searchpanel form { display: flex; gap: 0.5rem; }
.gdr-searchpanel input[type="search"] { flex: 1 1 auto; }

/* ---------------------------------------------------------------------------
 * 8. Mobile drawer
 * ------------------------------------------------------------------------- */
.gdr-drawer {
	position: fixed;
	inset: 0;
	z-index: 100;
	visibility: hidden;
	pointer-events: none;
}
.gdr-drawer.is-open { visibility: visible; pointer-events: auto; }

.gdr-drawer__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(38, 26, 24, 0.45);
	opacity: 0;
	transition: opacity var(--gdr-duration) var(--gdr-ease);
}
.gdr-drawer.is-open .gdr-drawer__backdrop { opacity: 1; }

.gdr-drawer__panel {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(88vw, 380px);
	display: flex;
	flex-direction: column;
	background: var(--gdr-cream);
	transform: translateX(100%);
	transition: transform 260ms var(--gdr-ease);
	overflow-y: auto;
	overscroll-behavior: contain;
}
.gdr-drawer.is-open .gdr-drawer__panel { transform: translateX(0); }

.gdr-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem var(--gdr-gutter);
	border-bottom: 1px solid var(--gdr-line);
}
.gdr-drawer__title {
	font-family: var(--gdr-font-heading);
	font-size: 1.25rem;
	margin: 0;
}
.gdr-drawer__body { padding: var(--gdr-space-xs) var(--gdr-gutter) var(--gdr-space-md); }

.gdr-drawer__list {
	margin: 0 0 var(--gdr-space-sm);
	padding: 0;
	list-style: none;
}
.gdr-drawer__list > li { border-bottom: 1px solid var(--gdr-line); }
.gdr-drawer__list a {
	display: block;
	padding: 0.95rem 0;
	font-size: 1.0625rem;
	font-weight: 500;
	color: var(--gdr-cocoa);
	text-decoration: none;
}
.gdr-drawer__list a:hover { color: var(--gdr-praline); }
.gdr-drawer__list .sub-menu {
	margin: 0 0 0.5rem;
	padding: 0 0 0.5rem 0.9rem;
	list-style: none;
	border-left: 1px solid var(--gdr-line);
}
.gdr-drawer__list .sub-menu a { padding: 0.55rem 0; font-size: 0.95rem; color: var(--gdr-muted); }

/* ---------------------------------------------------------------------------
 * 8b. Cart drawer
 *
 * Lives here rather than in woocommerce.css because the header cart icon — and
 * therefore the drawer — is on every page, while the shop stylesheet loads only
 * in shop context. Self-contained for the same reason: it borrows nothing from
 * the product styles.
 * ------------------------------------------------------------------------- */
.gdr-drawer--cart .gdr-drawer__panel { background: var(--gdr-cream); }
.gdr-cartdrawer { display: flex; flex-direction: column; flex: 1; padding-bottom: var(--gdr-space-xs); }
.gdr-cartdrawer__inner { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.gdr-cartdrawer__inner.is-busy { opacity: 0.55; pointer-events: none; }
.gdr-cartdrawer__inner { transition: opacity var(--gdr-duration) var(--gdr-ease); }

.gdr-cartdrawer__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--gdr-space-xs);
	text-align: center;
	padding: var(--gdr-space-md) 0;
	color: var(--gdr-muted);
}
.gdr-cartdrawer__empty svg { color: var(--gdr-blush); }
.gdr-cartdrawer__empty p { margin: 0; }

.gdr-cartlines { list-style: none; margin: 0 0 var(--gdr-space-sm); padding: 0; }
.gdr-cartline {
	display: grid;
	grid-template-columns: 64px 1fr auto;
	gap: 0.85rem;
	align-items: start;
	padding: var(--gdr-space-xs) 0;
	border-bottom: 1px solid var(--gdr-line);
}
.gdr-cartline:first-child { padding-top: 0; }

.gdr-cartline__media img {
	display: block;
	width: 64px;
	height: 80px;
	object-fit: cover;
	border-radius: var(--gdr-radius);
	background: var(--gdr-ivory);
}
.gdr-cartline__body { min-width: 0; }
.gdr-cartline__name { margin: 0 0 0.2rem; font-size: 0.95rem; line-height: 1.35; }
.gdr-cartline__name a { color: var(--gdr-cocoa); text-decoration: none; }
.gdr-cartline__name a:hover { color: var(--gdr-praline); }
.gdr-cartline__meta {
	margin: 0 0 0.5rem;
	font-size: 0.82rem;
	color: var(--gdr-muted);
	line-height: 1.4;
}
.gdr-cartline__meta p { margin: 0; }
.gdr-cartline__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	flex-wrap: wrap;
}
.gdr-cartline__price {
	font-size: 0.95rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums lining-nums;
	white-space: nowrap;
}

.gdr-cartline__remove {
	appearance: none;
	background: none;
	border: 0;
	padding: 0.25rem;
	cursor: pointer;
	color: var(--gdr-muted);
	line-height: 0;
	border-radius: var(--gdr-radius);
	transition: color var(--gdr-duration) var(--gdr-ease);
}
.gdr-cartline__remove:hover { color: var(--gdr-burgundy); }

.gdr-cartqty {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	border: 1px solid var(--gdr-line);
	border-radius: var(--gdr-radius);
	background: var(--gdr-white);
	overflow: hidden;
}
/*
 * Held to its content width. The shop stylesheet stretches number inputs to
 * fill their row, which left the stepper spanning the whole line and pushed
 * the price onto its own.
 */
.gdr-cartdrawer .gdr-cartqty__btn { flex: 0 0 28px; }
.gdr-cartdrawer .gdr-cartqty__input { flex: 0 0 40px; width: 40px; min-width: 0; }
.gdr-cartqty__btn {
	appearance: none;
	background: none;
	border: 0;
	width: 28px;
	height: 30px;
	cursor: pointer;
	color: var(--gdr-muted);
	font-size: 1rem;
	line-height: 1;
	transition: background var(--gdr-duration) var(--gdr-ease), color var(--gdr-duration) var(--gdr-ease);
}
.gdr-cartqty__btn:hover { background: var(--gdr-cream); color: var(--gdr-praline); }
.gdr-cartqty__input {
	width: 34px;
	height: 30px;
	border: 0;
	border-inline: 1px solid var(--gdr-line);
	text-align: center;
	font: inherit;
	font-size: 0.9rem;
	font-variant-numeric: tabular-nums;
	background: transparent;
	color: var(--gdr-cocoa);
	appearance: textfield;
	-moz-appearance: textfield;
}
.gdr-cartqty__input::-webkit-outer-spin-button,
.gdr-cartqty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.gdr-cartdrawer__foot { margin-top: auto; padding-top: var(--gdr-space-xs); }
.gdr-cartdrawer__subtotal {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin: 0 0 0.4rem;
	font-size: 1.05rem;
}
/*
 * The body font, not the display serif. Cormorant Garamond sets old-style
 * figures — the 1 and the 2 of "1 250" sit at different heights — which reads
 * as a rendering fault on a price the customer is checking. Manrope's lining
 * figures line up, and match the per-line prices right above.
 */
.gdr-cartdrawer__subtotal span:last-child {
	font-family: var(--gdr-font-body);
	font-size: 1.2rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums lining-nums;
	color: var(--gdr-cocoa);
	white-space: nowrap;
}
.gdr-cartdrawer__note {
	margin: 0 0 var(--gdr-space-xs);
	font-size: 0.82rem;
	color: var(--gdr-muted);
	line-height: 1.45;
}
.gdr-cartdrawer__cartlink { display: inline-flex; margin-top: 0.85rem; font-size: 0.9rem; }

.gdr-cartdrawer__status {
	margin: 0;
	padding: 0 var(--gdr-gutter);
	font-size: 0.85rem;
	color: var(--gdr-muted);
}
.gdr-cartdrawer__status:empty { display: none; }

/* ---------------------------------------------------------------------------
 * 9. Footer
 * ------------------------------------------------------------------------- */
.gdr-footer {
	background: var(--gdr-cocoa);
	color: rgba(247, 241, 237, 0.78);
	padding-block: var(--gdr-space-lg) var(--gdr-space-sm);
	font-size: 0.9375rem;
}
.gdr-footer a {
	color: rgba(247, 241, 237, 0.78);
	text-decoration: none;
}
.gdr-footer a:hover { color: var(--gdr-gold); text-decoration: underline; }

.gdr-footer__grid {
	display: grid;
	gap: var(--gdr-space-sm);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
}
@media (min-width: 992px) {
	.gdr-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: var(--gdr-space-md); }
}

.gdr-footer__title {
	font-family: var(--gdr-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--gdr-gold);
	margin: 0 0 1rem;
}
.gdr-footer__list { margin: 0; padding: 0; list-style: none; }
.gdr-footer__list li + li { margin-top: 0.6rem; }

.gdr-footer__brand { max-width: 34ch; }
.gdr-footer__brand .gdr-brand { color: var(--gdr-ivory); margin-bottom: 1rem; }
.gdr-footer__brand .gdr-brand:hover { color: var(--gdr-gold); }
.gdr-footer__tagline {
	font-family: var(--gdr-font-heading);
	font-size: 1.15rem;
	color: var(--gdr-ivory);
	margin-bottom: 0.75rem;
}

.gdr-social {
	display: flex;
	gap: 0.5rem;
	margin-top: 1.15rem;
	padding: 0;
	list-style: none;
}
.gdr-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid rgba(247, 241, 237, 0.22);
	border-radius: var(--gdr-radius-pill);
	color: var(--gdr-ivory);
}
.gdr-social a:hover {
	background: var(--gdr-gold);
	border-color: var(--gdr-gold);
	color: var(--gdr-cocoa);
}
.gdr-social svg { width: 18px; height: 18px; }

.gdr-footer__bottom {
	margin-top: var(--gdr-space-md);
	padding-top: var(--gdr-space-xs);
	border-top: 1px solid rgba(247, 241, 237, 0.14);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	font-size: 0.8125rem;
	color: rgba(247, 241, 237, 0.6);
}
.gdr-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---------------------------------------------------------------------------
 * 10. Home sections
 * ------------------------------------------------------------------------- */

/* --- Hero --- */
.gdr-hero {
	position: relative;
	background: var(--gdr-blush);
	overflow: hidden;
}
.gdr-hero__grid {
	display: grid;
	gap: 0;
	align-items: stretch;
}
@media (min-width: 992px) {
	.gdr-hero__grid { grid-template-columns: 1fr 1.1fr; min-height: min(74vh, 660px); }
}
.gdr-hero__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--gdr-space-md) var(--gdr-gutter) var(--gdr-space-lg);
}
@media (min-width: 992px) {
	.gdr-hero__content {
		padding: var(--gdr-space-lg) var(--gdr-space-md) var(--gdr-space-lg) max(var(--gdr-gutter), calc((100vw - var(--gdr-container)) / 2 + var(--gdr-gutter)));
	}
}
.gdr-hero__title {
	font-size: clamp(2.5rem, 1.6rem + 4.2vw, 4.25rem);
	line-height: 1.04;
	margin-bottom: 0.35em;
}
.gdr-hero__subtitle {
	font-size: clamp(1.0625rem, 1rem + 0.5vw, 1.3rem);
	color: var(--gdr-cocoa);
	opacity: 0.82;
	max-width: 32ch;
	margin-bottom: 0;
}
.gdr-hero__media { position: relative; min-height: 320px; }
.gdr-hero__media .gdr-frame,
.gdr-hero__media .gdr-placeholder { height: 100%; border-radius: 0; }
.gdr-hero__media .gdr-frame { aspect-ratio: auto; }
@media (max-width: 991px) {
	.gdr-hero__grid { grid-template-areas: "media" "content"; }
	.gdr-hero__media { grid-area: media; aspect-ratio: 4 / 3; min-height: 0; }
	.gdr-hero__content { grid-area: content; }
}

/* --- Trust strip --- */
.gdr-trust {
	background: var(--gdr-cream);
	border-block: 1px solid var(--gdr-line);
	padding-block: var(--gdr-space-sm);
}
.gdr-trust__grid {
	display: grid;
	gap: var(--gdr-space-xs);
	grid-template-columns: repeat(2, minmax(0, 1fr));
	text-align: center;
}
@media (min-width: 782px) {
	.gdr-trust__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.gdr-trust__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem;
}
.gdr-trust__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border: 1px solid var(--gdr-gold);
	border-radius: var(--gdr-radius-pill);
	color: var(--gdr-praline);
}
.gdr-trust__icon svg { width: 20px; height: 20px; }
.gdr-trust__label {
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.35;
	margin: 0;
}
.gdr-trust__desc {
	font-size: 0.8125rem;
	color: var(--gdr-muted);
	margin: 0;
}

/* --- Occasions --- */
.gdr-occasions__grid {
	display: grid;
	gap: var(--gdr-space-xs);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 782px) { .gdr-occasions__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.gdr-occasion {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--gdr-radius);
	text-decoration: none;
	color: var(--gdr-ivory);
	background: var(--gdr-cocoa);
}
.gdr-occasion .gdr-frame { aspect-ratio: 3 / 4; }
.gdr-occasion img { transition: transform 500ms var(--gdr-ease); }
.gdr-occasion:hover img { transform: scale(1.04); }
.gdr-occasion__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(38, 26, 24, 0.72) 0%, rgba(38, 26, 24, 0.18) 48%, rgba(38, 26, 24, 0) 100%);
}
.gdr-occasion__label {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 1rem 0.9rem;
	font-family: var(--gdr-font-heading);
	font-size: 1.2rem;
	line-height: 1.15;
	text-align: center;
	color: var(--gdr-ivory);
}
.gdr-occasion__count {
	display: block;
	font-family: var(--gdr-font-body);
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--gdr-gold);
	margin-top: 0.25rem;
}

/* --- Split feature (box builder promo, story) --- */
.gdr-split {
	display: grid;
	gap: var(--gdr-space-sm);
	align-items: center;
}
@media (min-width: 992px) {
	.gdr-split { grid-template-columns: 1fr 1fr; gap: var(--gdr-space-md); }
	.gdr-split--reverse .gdr-split__media { order: 2; }
}
.gdr-split__content { max-width: 52ch; }

.gdr-steps {
	counter-reset: gdr-step;
	list-style: none;
	margin: var(--gdr-space-xs) 0 0;
	padding: 0;
}
.gdr-steps li {
	counter-increment: gdr-step;
	position: relative;
	padding-left: 3rem;
	margin-bottom: 1.15rem;
}
.gdr-steps li::before {
	content: counter(gdr-step);
	position: absolute;
	left: 0;
	top: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid var(--gdr-gold);
	border-radius: var(--gdr-radius-pill);
	font-family: var(--gdr-font-heading);
	font-size: 1rem;
	color: var(--gdr-praline);
	background: var(--gdr-white);
}
.gdr-steps strong { display: block; font-size: 1rem; }
.gdr-steps span { font-size: 0.9375rem; color: var(--gdr-muted); }

/* --- Testimonials --- */
.gdr-testimonials__grid {
	display: grid;
	gap: var(--gdr-space-xs);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}
.gdr-testimonial {
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
	padding: var(--gdr-space-sm);
	background: var(--gdr-white);
	border: 1px solid var(--gdr-line);
	border-radius: var(--gdr-radius);
}
.gdr-testimonial__stars { color: var(--gdr-gold); letter-spacing: 0.1em; font-size: 0.9rem; }
.gdr-testimonial__quote {
	font-family: var(--gdr-font-heading);
	font-size: 1.2rem;
	line-height: 1.45;
	margin: 0;
	color: var(--gdr-cocoa);
}
.gdr-testimonial__meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-top: auto;
	padding-top: 0.5rem;
	border-top: 1px solid var(--gdr-line);
}
.gdr-testimonial__avatar {
	width: 44px;
	height: 44px;
	flex: 0 0 44px;
	border-radius: var(--gdr-radius-pill);
	overflow: hidden;
	background: var(--gdr-blush);
}
.gdr-testimonial__avatar img { width: 100%; height: 100%; object-fit: cover; }
.gdr-testimonial__name { font-weight: 600; font-size: 0.9375rem; margin: 0; }
.gdr-testimonial__occasion { font-size: 0.8125rem; color: var(--gdr-muted); margin: 0; }

/* --- Instagram grid --- */
.gdr-instagram__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.5rem;
}
@media (min-width: 782px) { .gdr-instagram__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.gdr-instagram__item { display: block; overflow: hidden; border-radius: var(--gdr-radius); }
.gdr-instagram__item:hover img { transform: scale(1.05); }

/* --- FAQ accordion --- */
.gdr-faq { max-width: 860px; margin-inline: auto; }
.gdr-faq__item {
	border-bottom: 1px solid var(--gdr-line);
}
.gdr-faq__question {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	width: 100%;
	padding: 1.15rem 0;
	background: transparent;
	border: 0;
	font-family: var(--gdr-font-body);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.4;
	text-align: left;
	color: var(--gdr-cocoa);
	cursor: pointer;
}
.gdr-faq__question:hover { color: var(--gdr-praline); }
.gdr-faq__icon {
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	margin-top: 2px;
	position: relative;
}
.gdr-faq__icon::before,
.gdr-faq__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	background: var(--gdr-praline);
	transform: translate(-50%, -50%);
	transition: transform var(--gdr-duration) var(--gdr-ease), opacity var(--gdr-duration) var(--gdr-ease);
}
.gdr-faq__icon::before { width: 14px; height: 1px; }
.gdr-faq__icon::after { width: 1px; height: 14px; }
.gdr-faq__question[aria-expanded="true"] .gdr-faq__icon::after,
.gdr-accordion__trigger[aria-expanded="true"] .gdr-faq__icon::after { opacity: 0; transform: translate(-50%, -50%) rotate(90deg); }

.gdr-faq__answer { padding: 0 0 1.25rem; color: var(--gdr-muted); max-width: 68ch; }
.gdr-faq__answer[hidden] { display: none; }

/* --- Final CTA --- */
.gdr-cta {
	text-align: center;
	background: var(--gdr-cocoa);
	color: var(--gdr-ivory);
	padding-block: var(--gdr-space-lg);
}
.gdr-cta h2 { color: var(--gdr-ivory); }
.gdr-cta p { color: rgba(247, 241, 237, 0.78); max-width: 54ch; margin-inline: auto; }

/* ---------------------------------------------------------------------------
 * 11. Editorial / generic pages
 * ------------------------------------------------------------------------- */
.gdr-page-header {
	background: var(--gdr-cream);
	border-bottom: 1px solid var(--gdr-line);
	padding-block: var(--gdr-space-md);
	text-align: center;
}
.gdr-page-header h1 { margin-bottom: 0.2em; }
.gdr-page-header .gdr-lead { margin-inline: auto; }

.gdr-breadcrumb {
	font-size: 0.8125rem;
	color: var(--gdr-muted);
	padding-block: 0.9rem;
}
.gdr-breadcrumb a { color: var(--gdr-muted); text-decoration: none; }
.gdr-breadcrumb a:hover { color: var(--gdr-praline); text-decoration: underline; }
.gdr-breadcrumb__sep { margin-inline: 0.45rem; color: var(--gdr-line); }

.gdr-entry-content > * + * { margin-top: 1.15rem; }
.gdr-entry-content h2 { margin-top: 2.25rem; }
.gdr-entry-content h3 { margin-top: 1.75rem; }
.gdr-entry-content img { border-radius: var(--gdr-radius); }
.gdr-entry-content ul,
.gdr-entry-content ol { padding-left: 1.35rem; }
.gdr-entry-content li + li { margin-top: 0.35rem; }
.gdr-entry-content blockquote {
	margin: 2rem 0;
	padding-left: 1.5rem;
	border-left: 2px solid var(--gdr-gold);
	font-family: var(--gdr-font-heading);
	font-size: 1.3rem;
	line-height: 1.45;
}
.gdr-entry-content table th,
.gdr-entry-content table td {
	padding: 0.7rem 0.75rem;
	border-bottom: 1px solid var(--gdr-line);
	text-align: left;
	font-size: 0.9375rem;
}
.gdr-entry-content table th { font-weight: 600; background: var(--gdr-cream); }

/* Empty state used by search / archives / cart. */
.gdr-empty {
	text-align: center;
	padding: var(--gdr-space-lg) var(--gdr-gutter);
	max-width: 560px;
	margin-inline: auto;
}
.gdr-empty__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	margin-bottom: var(--gdr-space-xs);
	border: 1px solid var(--gdr-line);
	border-radius: var(--gdr-radius-pill);
	color: var(--gdr-praline);
	background: var(--gdr-cream);
}
.gdr-empty__icon svg { width: 26px; height: 26px; }

/* 404 */
.gdr-404__code {
	font-family: var(--gdr-font-heading);
	font-size: clamp(4rem, 3rem + 8vw, 8rem);
	line-height: 1;
	color: var(--gdr-blush);
	margin: 0 0 0.15em;
}

/* Pagination */
.gdr-pagination {
	display: flex;
	justify-content: center;
	gap: 0.35rem;
	margin-top: var(--gdr-space-md);
}
.gdr-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 44px;
	padding: 0 0.5rem;
	border: 1px solid var(--gdr-line);
	border-radius: var(--gdr-radius);
	color: var(--gdr-cocoa);
	text-decoration: none;
	font-size: 0.9375rem;
}
.gdr-pagination .page-numbers:hover { border-color: var(--gdr-praline); color: var(--gdr-praline); }
.gdr-pagination .page-numbers.current {
	background: var(--gdr-cocoa);
	border-color: var(--gdr-cocoa);
	color: var(--gdr-ivory);
}

/* ---------------------------------------------------------------------------
 * 12. Floating contact buttons
 * Rendered only for the channels configured in the admin settings.
 * ------------------------------------------------------------------------- */
.gdr-floats {
	position: fixed;
	right: 1rem;
	bottom: calc(1rem + var(--gdr-sticky-bar-height));
	z-index: 90;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.6rem;
	transition: bottom var(--gdr-duration) var(--gdr-ease);
}

/* A circle, sized to match the WhatsApp button once its label is hidden. */
.gdr-float-round {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: var(--gdr-cocoa);
	color: var(--gdr-ivory);
	text-decoration: none;
	box-shadow: var(--gdr-shadow-lift);
	transition: background-color var(--gdr-duration) var(--gdr-ease);
}
.gdr-float-round:hover { background: var(--gdr-praline); color: var(--gdr-ivory); }
.gdr-float-round svg { width: 20px; height: 20px; flex: 0 0 20px; }

.gdr-whatsapp-float {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.8rem 1.1rem;
	border-radius: var(--gdr-radius-pill);
	background: var(--gdr-cocoa);
	color: var(--gdr-ivory);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	box-shadow: var(--gdr-shadow-lift);
	transition: background-color var(--gdr-duration) var(--gdr-ease);
}
.gdr-whatsapp-float:hover { background: var(--gdr-praline); color: var(--gdr-ivory); }
.gdr-whatsapp-float svg { width: 20px; height: 20px; flex: 0 0 20px; }
@media (max-width: 781px) {
	.gdr-whatsapp-float__label { display: none; }
	.gdr-whatsapp-float { padding: 0.9rem; }
}

/* ---------------------------------------------------------------------------
 * 13. Accessibility & reduced motion
 * ------------------------------------------------------------------------- */
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	white-space: nowrap;
}

.skip-link {
	position: absolute;
	top: -100px;
	left: 1rem;
	z-index: 200;
	padding: 0.85rem 1.25rem;
	background: var(--gdr-cocoa);
	color: var(--gdr-ivory);
	border-radius: var(--gdr-radius);
	text-decoration: none;
	font-weight: 600;
	transition: top var(--gdr-duration) var(--gdr-ease);
}
.skip-link:focus { top: 1rem; color: var(--gdr-ivory); }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--gdr-praline);
	outline-offset: 2px;
	border-radius: var(--gdr-radius);
}

/* The whole site must remain usable when motion is reduced. */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Respect the OS high-contrast / forced-colors mode. */
@media (forced-colors: active) {
	.gdr-btn,
	.wp-block-button__link { border: 1px solid currentColor; }
	.gdr-occasion__veil { display: none; }
}

/* Print: keep the essentials, drop the chrome. */
@media print {
	.gdr-announcement,
	.gdr-header,
	.gdr-footer,
	.gdr-floats,
	.gdr-sticky-atc { display: none !important; }
	body { background: #fff; color: #000; }
}

/* ---------------------------------------------------------------------------
 * 14. Small utilities added alongside the template parts
 * ------------------------------------------------------------------------- */
.gdr-trust__grid { list-style: none; margin: 0; padding: 0; }
.gdr-faq__heading { margin: 0; font-family: var(--gdr-font-body); }
.gdr-accordion__heading { margin: 0; font-family: var(--gdr-font-body); }

/* Outline button placed on a cocoa background. */
.gdr-btn--on-dark {
	color: var(--gdr-ivory);
	border-color: rgba(247, 241, 237, 0.4);
	background: transparent;
}
.gdr-btn--on-dark:hover,
.gdr-btn--on-dark:focus-visible {
	background: var(--gdr-ivory);
	border-color: var(--gdr-ivory);
	color: var(--gdr-cocoa);
}

/* Icon helper used by the previous-page chevron. */
.gdr-icon--flip { transform: rotate(180deg); }

/* Centered lead paragraph. */
.gdr-lead--center { margin-inline: auto; }

/* Search form (header panel, search page, 404). */
.gdr-searchform { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.gdr-searchform input[type="search"] { flex: 1 1 220px; }
.gdr-searchform .gdr-btn { flex: 0 0 auto; }

/* Post excerpt cards (blog / archives / search results). */
.gdr-excerpt {
	padding-bottom: var(--gdr-space-sm);
	margin-bottom: var(--gdr-space-sm);
	border-bottom: 1px solid var(--gdr-line);
}
.gdr-excerpt:last-child { border-bottom: 0; margin-bottom: 0; }
.gdr-excerpt__title {
	font-family: var(--gdr-font-heading);
	font-size: 1.5rem;
	font-weight: 500;
	margin: 0 0 0.35rem;
}
.gdr-excerpt__title a { color: var(--gdr-cocoa); text-decoration: none; }
.gdr-excerpt__title a:hover { color: var(--gdr-praline); }
.gdr-excerpt__meta {
	font-size: 0.8125rem;
	color: var(--gdr-muted);
	margin: 0 0 0.6rem;
}
.gdr-excerpt__text { color: var(--gdr-muted); margin-bottom: 0.85rem; }

/* ---------------------------------------------------------------------------
 * 15. Custom block styles (registered in inc/blocks.php)
 * ------------------------------------------------------------------------- */
.is-style-gdr-eyebrow {
	font-family: var(--gdr-font-body) !important;
	font-size: 0.75rem !important;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--gdr-praline);
}

.is-style-gdr-card {
	background: var(--gdr-white);
	border: 1px solid var(--gdr-line);
	border-radius: var(--gdr-radius);
	padding: var(--gdr-space-sm);
}

.is-style-gdr-portrait img {
	aspect-ratio: 4 / 5;
	object-fit: cover;
	width: 100%;
	border-radius: var(--gdr-radius);
}

.is-style-gdr-gold-rule {
	border: 0;
	height: 1px;
	width: 48px;
	background: var(--gdr-gold);
	margin-inline: auto;
}

/* ---------------------------------------------------------------------------
 * 16. Front-end forms (contact, devis)
 * ------------------------------------------------------------------------- */
.gdr-form { max-width: 720px; }
.gdr-form__row { display: grid; gap: 0 1rem; }
@media (min-width: 600px) {
	.gdr-form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.gdr-form fieldset { border: 0; margin: 0; padding: 0; }
.gdr-form legend { padding: 0; }

/* ---------------------------------------------------------------------------
 * 17. Logo on the dark footer
 *
 * The brand mark is a single dark-cocoa file, used in both the header and the
 * footer. On the cocoa footer it would be invisible, so it is turned to ivory
 * with a filter rather than by maintaining a second image file — one logo to
 * replace when the brand evolves, not two that can drift apart.
 * ------------------------------------------------------------------------- */
.gdr-footer .gdr-brand__mark img {
	filter: brightness(0) invert(1);
	opacity: 0.92;
}

/* A logo that is already light needs no inversion. Add the class to the
   footer brand if a light logo file is ever used instead. */
.gdr-footer .gdr-brand__mark.is-light img {
	filter: none;
	opacity: 1;
}

/* ---------------------------------------------------------------------------
 * 15. Occasion archive
 * The occasion's own photograph leads its page, so arriving from a tile on the
 * home page reads as a continuation rather than a jump somewhere else.
 * ------------------------------------------------------------------------- */
.gdr-occasion-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	min-height: clamp(14rem, 32vw, 22rem);
	overflow: hidden;
	background: var(--gdr-blush);
}
.gdr-occasion-hero__media { position: absolute; inset: 0; z-index: -2; }
.gdr-occasion-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.gdr-occasion-hero__veil {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to top, rgba(38, 26, 24, 0.80) 0%, rgba(38, 26, 24, 0.44) 55%, rgba(38, 26, 24, 0.20) 100%);
}
.gdr-occasion-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	padding-block: var(--gdr-space-lg);
	text-align: center;
	color: var(--gdr-ivory);
}
.gdr-occasion-hero h1 { color: var(--gdr-ivory); margin: 0; }
.gdr-occasion-hero .gdr-eyebrow { color: var(--gdr-gold); }
.gdr-occasion-hero .gdr-lead {
	color: rgba(247, 241, 237, 0.86);
	max-width: 46ch;
	margin: 0;
}
.gdr-occasion-hero__count {
	margin: 0;
	font-size: 0.8125rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(247, 241, 237, 0.72);
}

/* No photograph yet: the same shape, in brand colour rather than a grey box. */
.gdr-occasion-hero--plain { background: var(--gdr-blush); min-height: 0; }
.gdr-occasion-hero--plain .gdr-occasion-hero__inner { color: var(--gdr-cocoa); }
.gdr-occasion-hero--plain h1 { color: var(--gdr-cocoa); }
.gdr-occasion-hero--plain .gdr-eyebrow { color: var(--gdr-praline); }
.gdr-occasion-hero--plain .gdr-lead { color: var(--gdr-muted); }
.gdr-occasion-hero--plain .gdr-occasion-hero__count { color: var(--gdr-muted); }
