/*
 * Wedding page — Modernist design tokens for the /wedding microsite,
 * recoloured per the approved "turn 7" handoff. Enqueued only on the
 * page with slug "wedding" (see functions.php). Zero border-radius, no
 * shadows/gradients except the photo overlays, flush-left button labels.
 */

#our-story, #the-day, #travel, #stay, #wear, #gifts, #faqs, #rsvp {
	/* Matches the real sticky nav height: 16px padding + the 56px RSVP button
	 * + 16px padding + the 1px bottom border. Re-measure if the nav changes. */
	scroll-margin-top: 89px;
}

.wed-page {
	--wed-navy: var(--wp--preset--color--navy);
	--wed-petrol: var(--wp--preset--color--petrol);
	--wed-petrol-light: var(--wp--preset--color--petrol-light);
	--wed-petrol-dark: var(--wp--preset--color--petrol-dark);
	--wed-beige: var(--wp--preset--color--beige);
	--wed-sage: var(--wp--preset--color--sage);
	--wed-sage-dark: var(--wp--preset--color--sage-dark);
	--wed-rose-light: var(--wp--preset--color--rose-light);
	--wed-rose-deep: var(--wp--preset--color--rose-deep);
	--wed-card-sage: var(--wp--preset--color--card-tint-sage);
	--wed-card-petrol: var(--wp--preset--color--card-tint-petrol);
	margin: 0;
}

/* — ground + accent context — one of these three goes on every section wrapper —
 * Accent values are contrast-checked against their ground; the kicker/eyebrow is
 * 11px, so each pair must clear 4.5:1. Measured:
 *   light tan #cda77c on deep olive #3c452f .... 4.52:1
 *   light tan #cda77c on RSVP olive #313a27 .... 5.33:1
 *   deep tan  #896134 on beige      #efeae0 .... 4.58:1
 *   dark tan  #4d3416 on sage       #93a98c .... 4.56:1
 * Do not lighten the tans or lighten a dark ground without re-checking these.
 * Caveat: the .wed-onSage ground is currently unused. If you start using it,
 * note that body text (deep olive on sage) is only 3.98:1 and needs a darker
 * ground; likewise a sage-dark ground cannot carry the light-tan accent (3.24:1). */
.wed-onDark { --wed-accent: var(--wed-rose-light); }
.wed-onLight { --wed-accent: var(--wed-rose-deep); }
.wed-onSage { --wed-accent: #4d3416; }

.wed-section {
	padding: 58px 56px 62px;
}
@media (max-width: 782px) {
	.wed-section { padding: 26px 20px 30px; }
}

/* — typography — */
.wed-kicker {
	font: 600 11px/1 "Newsreader", Georgia, serif;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--wed-accent);
	margin: 0 0 20px;
}
/* the dash that used to sit before every eyebrow label is gone */
.wed-h1 {
	font: 300 clamp(56px, 9vw, 104px)/0.92 "Newsreader", serif;
	letter-spacing: -0.025em;
	margin: 0 0 24px;
}
.wed-h2 {
	font: 300 clamp(34px, 4.5vw, 52px)/1.03 "Newsreader", serif;
	margin: 0 0 22px;
}
.wed-stat-figure {
	font: 300 clamp(52px, 6.4vw, 78px)/0.95 "Newsreader", serif;
	letter-spacing: -0.02em;
	margin: 0 0 4px;
}
.wed-stat-label {
	font: 600 11px/1.3 "Newsreader", Georgia, serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	opacity: .65;
	margin-top: 8px;
}
.wed-day-time {
	font: 300 clamp(26px, 3vw, 38px)/1.05 "Newsreader", serif;
}
.wed-amp { font-style: italic; color: var(--wed-accent); }
.wed-intro { font-size: 18px; line-height: 1.55; max-width: 44ch; opacity: .85; }
.wed-measure { max-width: 52ch; }
.wed-eyebrow-label {
	font: 600 12px/1.3 "Newsreader", Georgia, serif;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--wed-accent);
	margin: 8px 0 6px;
}

/* — buttons (core Buttons block, recoloured via block color attributes; this handles shape only) — */
.wed-page .wp-block-button__link {
	min-height: 44px;
	padding: 0 20px;
	font: 600 12px/1 "Newsreader", Georgia, serif;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 0;
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
}
.wed-page .is-style-outline .wp-block-button__link { border-width: 1px; }
.wed-btn-lg .wp-block-button__link { min-height: 56px; padding: 0 28px; font-size: 14px; }
.wed-btn-block { width: 100%; }
.wed-btn-block .wp-block-button__link { width: 100%; justify-content: space-between; }
.wed-page .wp-block-buttons { gap: 14px; row-gap: 12px; }

/* A cover with a real photo in it does not need the dim overlay — there is no
 * text sitting on these, so it was only muddying the picture. It had also
 * slipped: WordPress's default 1.2em block margin was landing on the
 * absolutely-positioned overlay span, so on the Our Story photos it sat 19.2px
 * below the image and 19.2px short of the bottom, showing as a dark band across
 * the top. Hidden rather than removed from the block markup, because the cover
 * block's saved HTML has to byte-match what its save() would produce or the
 * editor flags the block as invalid.
 * Empty slots keep their overlay — there it IS the placeholder background. */
.wed-hero-photo .wp-block-cover__background,
.wed-story-photos .wp-photo-slot .wp-block-cover__background,
.wed-photo-slot:has(img) .wp-block-cover__background { display: none; }

/* — photo slots (core Cover block; caption shown until Dan adds a real photo) — */
.wed-photo-slot .wp-block-cover__inner-container p {
	font: 600 10px/1.4 "Newsreader", Georgia, serif;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wed-beige);
	opacity: .8;
	text-align: center;
}
.wed-photo-slot--square,
.wed-photo-slot--square .wp-block-cover__inner-container { min-height: 200px; }
@media (max-width: 782px) {
	.wed-photo-slot--square,
	.wed-photo-slot--square .wp-block-cover__inner-container { min-height: 140px; }
}

/* — header / nav — */
.wed-nav {
	position: sticky;
	top: 0;
	z-index: 20;
	display: flex;
	align-items: center;
	gap: 28px;
	padding: 16px 56px;
	background: var(--wed-navy);
	border-bottom: 1px solid rgba(239, 234, 224, .28);
}
/* margin-right was auto, which swallowed the bar's free space before
 * .wed-nav-links could grow — so the RSVP button never reached the edge. */
.wed-nav-brand { font: 400 25px/1 "Newsreader", serif; color: var(--wed-beige); margin: 0; }
/* Without this the links paragraph and the RSVP button stack vertically and the
 * sticky bar becomes ~155px tall, which also throws out the scroll-margin below.
 * The margin reset matters as much as the flex: WordPress puts a default 1.2em
 * top margin on the group and on the buttons block, which survives inside a flex
 * row and pads the bar back out. */
.wed-nav-links { display: flex; align-items: center; gap: 28px; margin: 0; flex: 1; }

.wed-nav-links p { margin: 0; }
/* auto on the left pushes the RSVP button to the right-hand edge of the bar.
 * This has to come after the margin reset above, which previously zeroed it. */
.wed-nav-links .wp-block-buttons { margin: 0 0 0 auto; }
/* Scoped to the links paragraph on purpose: as `.wed-nav-links a` this also hit
 * the RSVP button's anchor, giving it a 24px right margin meant for the text
 * links. Combined with core's `.wp-block-buttons .wp-block-button__link
 * { width: 100% }` that made the button 24px wider than its label needed, and
 * flush-left alignment then left "RSVP" sitting 12px left of centre. */
.wed-nav-links p a {
	color: var(--wed-beige);
	text-decoration: none;
	font: 400 17px "Newsreader", Georgia, serif;
	margin-right: 26px;
}
.wed-nav-links p a:hover { color: var(--wed-rose-light); }
/* The big hero CTAs are flush-left by design; a small pill in the bar is not. */
.wed-nav .wp-block-button__link { justify-content: center; }
.wed-nav-toggle { display: none; }
@media (max-width: 782px) {
	.wed-nav { padding: 14px 20px; }
	.wed-nav-links { display: none; }
	.wed-nav-toggle {
		display: inline-flex;
		flex-direction: column;
		gap: 4px;
		width: 22px;
		padding: 11px 0;
		background: none;
		border: 0;
		cursor: pointer;
	}
	.wed-nav-toggle i { display: block; height: 2px; background: var(--wed-beige); }
	.wed-nav-links.is-open {
		display: flex;
		flex-direction: column;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--wed-navy);
		padding: 12px 20px 20px;
		border-bottom: 1px solid rgba(239, 234, 224, .28);
	}
	.wed-nav-links.is-open a { margin: 0; padding: 12px 0; min-height: 44px; }
}

/* — hero — */
.wed-hero { display: grid; grid-template-columns: 1.05fr 1fr; min-height: 540px; }
.wed-hero-copy { padding: 66px 56px; display: flex; flex-direction: column; justify-content: center; }
/* margin:0 matters — the grid item otherwise picks up WordPress's default
 * 1.2em block margin and the photo stops 19.2px short of the panel top. */
.wed-hero-photo { min-height: 340px; margin: 0; align-self: stretch; border-left: 1px solid rgba(239, 234, 224, .28); }
@media (max-width: 782px) {
	.wed-hero { grid-template-columns: 1fr; }
	.wed-hero-photo { min-height: 300px; border-left: 0; order: -1; }
	.wed-hero-copy { padding: 28px 20px 30px; }
}

/* — stat row — */
.wed-stat-row {
	grid-template-columns: repeat(4, 1fr) !important;
	/* 24px here + 32px on each cell puts the figures on the same 56px gutter as
	 * every section below, so "270" lines up with the hero's "Dan". The borders
	 * sit outside the padding, so the rules still run the full width. */
	padding: 0 24px;
	border-top: 1px solid rgba(239, 234, 224, .28);
	border-bottom: 1px solid rgba(239, 234, 224, .28);
}
.wed-stat-cell { padding: 26px 32px; border-right: 1px solid rgba(239, 234, 224, .28); }
.wed-stat-cell:last-child { border-right: 0; }
@media (max-width: 782px) {
	/* the 24px desktop inset would stack with the cell padding here and push the
	 * figures off the 20px mobile gutter */
	.wed-stat-row { grid-template-columns: repeat(2, 1fr) !important; padding: 0; }
	.wed-stat-cell { padding: 18px 20px; border-bottom: 1px solid rgba(239, 234, 224, .28); }
}

/* — our story — */
/* Full-bleed, matching the hero: the section's own padding is moved off the
 * columns block and onto the copy column, so the photographs run to the top,
 * bottom and right edges of the olive panel instead of floating inside it. */
.wp-block-columns:has(.wed-story-photos) { padding: 0 !important; }
.wp-block-columns:has(.wed-story-photos) > .wp-block-column:first-child { padding: 58px 56px 62px; }
.wp-block-columns:has(.wed-story-photos) > .wp-block-column:last-child { align-self: stretch; }
.wed-story-photos {
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 0 !important;
	margin: 0;
	height: 100%;
	border-left: 1px solid rgba(239, 234, 224, .28);
	min-height: 400px;
}
.wed-story-photos > .wed-photo-slot { border-right: 1px solid rgba(239, 234, 224, .28); }
.wed-story-photos > .wed-photo-slot:last-child { border-right: 0; }
@media (max-width: 782px) {
	/* stacked: the copy column drops to the mobile gutter, the photos stay
	 * full-bleed and size to their own content rather than a stretched column */
	.wp-block-columns:has(.wed-story-photos) > .wp-block-column:first-child { padding: 26px 20px 30px; }
	.wed-story-photos { min-height: 0; height: auto; border-left: 0; gap: 2px !important; }
	.wed-story-photos > .wed-photo-slot { border-right: 0; }
}

/* — the day — */
.wed-day-grid {
	grid-template-columns: repeat(3, 1fr) !important;
	border-top: 2px solid rgba(27, 47, 67, .35);
}
.wed-day-cell { padding: 22px 26px 24px; border-bottom: 1px solid rgba(27, 47, 67, .2); border-left: 1px solid rgba(27, 47, 67, .2); }
.wed-day-cell:nth-child(3n+1) { border-left: 0; }
@media (max-width: 782px) {
	.wed-day-grid { grid-template-columns: 70px 1fr !important; }
	.wed-day-cell { display: contents; }
	.wed-day-cell .wed-day-time,
	.wed-day-cell { padding: 22px 20px 24px; }
	.wed-day-cell .wed-day-copy { padding: 14px 0; border-bottom: 1px solid rgba(27, 47, 67, .2); }
	.wed-day-cell { border-left: 0 !important; }
}

/* — travel & taxis — */
.wed-travel { grid-template-columns: 1fr 1fr !important; }
.wed-travel-copy { padding: 58px 56px 62px; }
@media (max-width: 782px) {
	.wed-travel { grid-template-columns: 1fr !important; }
	.wed-travel-copy { padding: 30px 20px 34px; }
}

/* — where to stay — */
/* This group does not carry .wed-section, so it gets no padding from there and
 * nothing else was supplying any — the copy and the table sat flush against the
 * panel edge on the bare 24px page offset instead of the 56px gutter. Matches
 * .wed-section deliberately; keep them in step. */
.wed-stay {
	grid-template-columns: 340px 1fr !important;
	gap: 56px !important;
	padding: 58px 56px 62px;
}
.wed-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.wed-table th { text-align: left; font: 600 11px "Newsreader", Georgia, serif; letter-spacing: .08em; text-transform: uppercase; opacity: .6; padding: 10px; border-bottom: 2px solid currentColor; }
.wed-table td { padding: 10px; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.wed-onLight .wed-table td { border-bottom-color: rgba(27, 47, 67, .2); }
@media (max-width: 782px) {
	.wed-stay { grid-template-columns: 1fr !important; gap: 0 !important; padding: 26px 20px 30px; }

	/* Four columns will not fit a phone: the headings break mid-word ("WHER E")
	 * and the notes column wraps to one word per line. Collapse each row into a
	 * labelled block instead. The labels are hard-coded per column because
	 * core/table gives no way to put a class or data attribute on a cell, and
	 * .wed-table is only ever this one table — check here if a column is added. */
	.wed-table thead { display: none; }
	.wed-table,
	.wed-table tbody,
	.wed-table tr,
	.wed-table td { display: block; width: auto; }
	.wed-table tr {
		padding: 16px 0;
		border-bottom: 1px solid rgba(239, 234, 224, .2);
	}
	.wed-table tr:last-child { border-bottom: 0; }
	.wed-table td { border: 0; padding: 3px 0; font-size: 15px; }
	.wed-table td:empty { display: none; }
	.wed-table td:first-child {
		font-size: 19px;
		line-height: 1.25;
		margin-bottom: 8px;
	}
	.wed-table td:not(:first-child)::before {
		display: block;
		font-size: 10px;
		letter-spacing: .12em;
		text-transform: uppercase;
		opacity: .55;
		margin-top: 8px;
	}
	.wed-table td:nth-child(2)::before { content: "Distance"; }
	.wed-table td:nth-child(3)::before { content: "Rough cost"; }
	.wed-table td:nth-child(4)::before { content: "Notes"; }
}

/* — wear + gifts — */
.wed-wear-gifts { grid-template-columns: 1fr 1fr !important; }
.wed-wear-gifts > div { padding: 58px 40px 62px 56px; }
.wed-wear-gifts > div + div { padding: 58px 56px 62px 40px; border-left: 1px solid rgba(27, 47, 67, .2); }
@media (max-width: 782px) {
	.wed-wear-gifts { grid-template-columns: 1fr !important; }
	/* These columns are the only padding these sections get — .wed-faqs and the
	 * message wall have no rule of their own and sit inside this grid too. Zeroing
	 * it here put four sections' text flush against the page edge on mobile, so
	 * drop to the mobile section gutter rather than to nothing. */
	.wed-wear-gifts > div,
	.wed-wear-gifts > div + div { padding: 26px 20px 30px; border-left: 0; }
}

/* — gallery — */
.wed-gallery-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 2px !important; }
@media (max-width: 782px) {
	.wed-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* — RSVP — */
.wed-rsvp-intro { max-width: 60ch; }

/* — FAQs (core Details block) — */
.wed-faqs .wp-block-details {
	border-bottom: 1px solid rgba(27, 47, 67, .2);
	padding: 15px 0;
	margin: 0;
}
.wed-faqs .wp-block-details:first-child { border-top: 2px solid rgba(27, 47, 67, .35); }
.wed-faqs .wp-block-details summary {
	font: 400 17px/1.4 "Newsreader", Georgia, serif;
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	min-height: 44px;
}
.wed-faqs .wp-block-details summary::-webkit-details-marker { display: none; }
.wed-faqs .wp-block-details summary::after {
	content: "+";
	font: 300 22px/1 "Newsreader", serif;
	color: var(--wed-accent);
	transition: transform 150ms ease;
	flex: none;
}
.wed-faqs .wp-block-details[open] summary::after { content: "\2013"; }
.wed-faqs .wp-block-details p { font-size: 16px; line-height: 1.6; opacity: .8; margin: 10px 0 0; }
/* No max-width on the answers: the accordion itself is capped at 820px, so the
 * answer can run the full row, matching the rule under it. The old 52ch cap
 * dated from when the FAQs were half of a two-column grid. */
/* The wall used to take the right-hand column here. With the FAQs on their own
 * the accordion would otherwise stretch the full content width and strand the
 * "+" a long way from its question. */
.wed-faqs { max-width: 820px; margin-inline: auto; }
.wed-faqs .wed-kicker,
.wed-faqs .wed-h2 { text-align: center; }
/* the kicker's leading rule is an inline-block, so it centres with the text */

/* — footer — */
.wed-footer {
	padding: 34px 56px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	align-items: center;
	border-top: 1px solid rgba(239, 234, 224, .28);
	font-size: 13px;
}
.wed-footer a { color: var(--wed-petrol-light); }
@media (max-width: 782px) {
	.wed-footer { padding: 26px 20px 100px; flex-direction: column; align-items: flex-start; }
}

/* — sticky mobile RSVP bar — */
.wed-sticky-rsvp {
	display: none;
}
@media (max-width: 782px) {
	.wed-sticky-rsvp {
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 15;
		align-items: center;
		gap: 12px;
		background: var(--wed-beige);
		border-top: 2px solid var(--wed-navy);
		padding: 10px 16px;
	}
	.wed-sticky-rsvp .wed-sticky-copy { margin-right: auto; }
	.wed-sticky-rsvp .wed-sticky-label {
		font: 600 10px/1.2 "Newsreader", Georgia, serif;
		letter-spacing: .14em;
		text-transform: uppercase;
		color: var(--wed-rose-deep);
		margin: 0;
	}
	.wed-sticky-rsvp .wed-sticky-date { font: 400 15px/1.3 "Newsreader", Georgia, serif; color: var(--wed-navy); margin: 0; }
	.wed-sticky-rsvp.is-hidden { display: none; }
}

/* — countdown reveal (avoids a flash of "0" before JS runs) — */
.wed-countdown[data-ready="false"] { visibility: hidden; }

/* — accessibility — */
/* WordPress's global styles put a 2px outline on every :focus inside
 * .wp-site-blocks — plain :focus, so a mouse click on an FAQ question left a box
 * drawn round it. Cancel that for pointer focus only; keyboard focus still gets
 * the tan/deep-tan ring below via :focus-visible, which is what actually needs it. */
.wed-page :focus:not(:focus-visible) { outline: none; }
.wed-page :focus-visible { outline: 2px solid var(--wed-rose-light); outline-offset: 2px; }
.wed-onLight :focus-visible, .wed-onSage :focus-visible { outline-color: var(--wed-rose-deep); }
@media not (prefers-reduced-motion: reduce) {
	html:has(.wed-page) { scroll-behavior: smooth; }
}
@media (prefers-reduced-motion: reduce) {
	.wed-page * { transition: none !important; }
}
.wed-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--wed-beige);
	color: var(--wed-navy);
	padding: 12px 20px;
	z-index: 100;
}
.wed-skip-link:focus { left: 0; }

/* — RSVP form —
 * Hand-written markup now (see form.html), so these target our own classes
 * rather than the plugin's. Colours and sizes carry over from the Fluent Forms
 * restyle this replaced: beige on the dark RSVP ground, 48px minimum control
 * height, square corners, tan focus ring. */
.wed-form { max-width: 640px; }
.wed-field { margin: 0 0 22px; border: 0; padding: 0; }
/* :not(.wed-choice) matters — without it this beats .wed-choice on specificity
 * and the radio/consent labels shrink to the 12px field-label size. */
.wed-field > label:not(.wed-choice),
.wed-field > legend {
	display: block;
	font-size: 12px;
	letter-spacing: .04em;
	margin: 0 0 6px;
	padding: 0;
	color: var(--wed-beige);
}
.wed-req { color: var(--wed-rose-light); margin-left: 2px; }
.wed-help {
	font-size: 13px;
	line-height: 1.45;
	opacity: .72;
	margin: 0 0 8px;
	max-width: 52ch;
}
.wed-form input[type="text"],
.wed-form input[type="email"],
.wed-form input[type="tel"],
.wed-form input[type="number"],
.wed-form textarea {
	width: 100%;
	box-sizing: border-box;
	min-height: 48px;
	padding: 12px 14px;
	/* form controls do not inherit font-family */
	font-family: inherit;
	font-size: 16px;
	color: var(--wed-beige);
	background: rgba(255, 255, 255, .12);
	border: 1px solid rgba(239, 234, 224, .45);
	border-radius: 0;
}
.wed-form textarea { min-height: 90px; resize: vertical; }
.wed-form ::placeholder { color: rgba(239, 234, 224, .5); }
.wed-form input:focus-visible,
.wed-form textarea:focus-visible {
	outline: 2px solid var(--wed-rose-light);
	outline-offset: 2px;
	border-color: var(--wed-rose-light);
}

/* Radios and the consent box: custom controls, tan when chosen, so the
 * selected option reads clearly against the dark ground. */
.wed-choice {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	font-size: 16px;
	cursor: pointer;
}
.wed-form input[type="radio"],
.wed-form input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	flex: none;
	width: 20px;
	height: 20px;
	margin: 0;
	display: inline-grid;
	place-content: center;
	border: 1px solid rgba(239, 234, 224, .5);
	background: transparent;
	cursor: pointer;
	transition: border-color 120ms ease, background-color 120ms ease;
}
.wed-form input[type="radio"] { border-radius: 50%; }
.wed-form input[type="radio"]::before,
.wed-form input[type="checkbox"]::before {
	content: "";
	width: 10px;
	height: 10px;
	transform: scale(0);
	background: var(--wed-rose-light);
	transition: transform 120ms ease;
}
.wed-form input[type="radio"]::before { border-radius: 50%; }
.wed-form input[type="radio"]:checked,
.wed-form input[type="checkbox"]:checked {
	border-color: var(--wed-rose-light);
	background: rgba(205, 167, 124, .16);
}
.wed-form input[type="radio"]:checked::before,
.wed-form input[type="checkbox"]:checked::before { transform: scale(1); }
.wed-form input[type="radio"]:hover,
.wed-form input[type="checkbox"]:hover { border-color: var(--wed-rose-light); }
.wed-form input[type="radio"]:focus-visible,
.wed-form input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--wed-rose-light);
	outline-offset: 2px;
}

.wed-note {
	border-left: 2px solid var(--wed-rose-light);
	padding: 2px 0 2px 16px;
	margin: 0 0 22px;
	max-width: 52ch;
}
.wed-note p { margin: 0; font-size: 16px; line-height: 1.55; }

.wed-form-submit {
	min-height: 54px;
	width: 100%;
	background: var(--wed-beige);
	color: var(--wed-navy);
	border: 0;
	border-radius: 0;
	font: 600 14px "Newsreader", Georgia, serif;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-align: left;
	padding: 0 20px;
	cursor: pointer;
}
.wed-form-submit:hover { background: #fff; }
.wed-form-submit:focus-visible { outline: 2px solid var(--wed-rose-light); outline-offset: 3px; }

/* Honeypot: off-screen rather than display:none, which some bots check for. */
.wed-form-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

[hidden] { display: none !important; }

/* Sub-pages (privacy, thanks) — they borrow the parent theme's page template,
 * whose header and footer are stripped at build time. This replaces them. */
/* These pages are outside .wed-page, where --wed-* is defined, so they use the
 * palette presets directly (with fallbacks) rather than inheriting nothing. */
.wed-subpage-footer {
	padding: 34px 56px;
	background: var(--wp--preset--color--navy, #3c452f);
	color: var(--wp--preset--color--beige, #efeae0);
	font-size: 14px;
}
.wed-subpage-footer p { margin: 0 0 6px; }
.wed-subpage-footer a { color: var(--wp--preset--color--rose-light, #cda77c); }
@media (max-width: 782px) {
	.wed-subpage-footer { padding: 26px 20px; }
}

/* Sub-page typography.
 * These pages use the parent theme's template, whose scale is wrong for this
 * site: the page title rendered at 15px while the section headings below it
 * were 75px — the headings were five times the size of the title. This puts
 * them on the wedding page's scale and gives the body a readable size. */
.wed-subpage-nav {
	padding: 20px 56px 0;
	font-size: 14px;
}
.wed-subpage-nav a {
	color: var(--wp--preset--color--rose-deep, #896134);
	text-decoration: none;
	font: 600 11px/1 "Newsreader", Georgia, serif;
	letter-spacing: .14em;
	text-transform: uppercase;
}
.wed-subpage-nav a:hover { text-decoration: underline; }

.page-template-default main .wp-block-post-title,
.page-template-default main > .wp-block-group h1 {
	font: 300 clamp(34px, 4vw, 46px)/1.05 "Newsreader", Georgia, serif !important;
	letter-spacing: -0.02em;
	margin: 8px 0 28px !important;
	text-align: left !important;
}
/* The template indents paragraphs to the content width while headings run
 * wider, so the two sat on different left edges. */
.page-template-default main .wp-block-post-content > * { margin-left: 0; margin-right: 0; }
.page-template-default main .wp-block-post-content h2 {
	font: 300 clamp(24px, 2.4vw, 30px)/1.15 "Newsreader", Georgia, serif !important;
	letter-spacing: -0.015em;
	margin: 36px 0 10px !important;
}
.page-template-default main .wp-block-post-content p,
.page-template-default main .wp-block-post-content li {
	font-size: 17px !important;
	line-height: 1.6;
	max-width: 62ch;
	/* the template centres anything narrower than the container, which pushed
	 * the body text in from the left while the headings stayed put */
	margin-inline: 0 !important;
}
@media (max-width: 782px) {
	.wed-subpage-nav { padding: 16px 20px 0; }
}

/* — centred sections —
 * The Day's header and the entire RSVP block sit centred in their container;
 * everything else stays flush left. */
#the-day > .wed-kicker,
#the-day > .wed-h2 {
	text-align: center;
}
#the-day > .wed-h2 {
	font-size: clamp(40px, 5vw, 58px);
	margin-bottom: 34px;
}

.wed-rsvp {
	text-align: center;
}
.wed-rsvp .wed-rsvp-intro {
	margin-left: auto;
	margin-right: auto;
}
.wed-rsvp .wed-form {
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

/* — photo band —
 * What is left of Our Story: the two photographs, full width, no copy. */
.wed-photo-band {
	background: var(--wed-navy);
	padding: 0;
}
.wed-photo-band .wed-story-photos {
	border-left: 0;
	min-height: 0;
	height: auto;
	grid-template-columns: repeat(2, 1fr) !important;
}
.wed-photo-band .wed-photo-slot { min-height: 420px; }
@media (max-width: 782px) {
	.wed-photo-band .wed-photo-slot { min-height: 220px; }
}

/* — per-guest meal blocks —
 * One form covers a whole invitation, so each guest gets their own block with
 * a name, three courses and a drinks preference. */
.wed-guests { margin: 0 0 26px; }
.wed-guest {
	border: 1px solid rgba(239, 234, 224, .28);
	border-left: 2px solid var(--wed-rose-light);
	padding: 22px 24px 6px;
	margin: 0 0 18px;
}
.wed-guest > legend {
	font: 600 11px/1 "Newsreader", Georgia, serif;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--wed-rose-light);
	padding: 0 10px;
	margin-left: -10px;
}
/* Course headings inside a guest block: quieter than the guest's own name. */
.wed-guest .wed-field--radio > legend {
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: none;
	opacity: .9;
	margin-bottom: 8px;
}
/* Menu lines wrap, so the control sits at the top rather than centred against
 * three lines of text. */
.wed-guest .wed-choice {
	align-items: flex-start;
	gap: 12px;
	min-height: 0;
	margin: 0 0 12px;
	font-size: 15px;
	line-height: 1.45;
}
.wed-guest .wed-choice input { margin-top: 2px; }
.wed-guest .wed-choice em {
	font-style: normal;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	opacity: .7;
	white-space: nowrap;
}
@media (max-width: 782px) {
	.wed-guest { padding: 18px 16px 4px; }
}

.wed-form-error {
	margin: 0 0 16px;
	padding: 12px 14px;
	border-left: 2px solid var(--wed-rose-light);
	background: rgba(205, 167, 124, .12);
	font-size: 15px;
	line-height: 1.5;
}