/* ============================================================
   Gran Gala Victoriana — Page Styles
   Scoped to #gala-page to avoid conflict with site.css
   Palette: deep navy · antique gold · parchment cream
   ============================================================ */

#gala-page {
	--gv-navy:      #0b1426;
	--gv-navy-2:    #1a2a4a;
	--gv-gold:      #c9a063;
	--gv-gold-h:    #ddb97a;
	--gv-gold-dim:  rgba(201,160,99,.2);
	--gv-gold-glow: rgba(201,160,99,.3);
	--gv-cream:     #f7f3eb;
	--gv-text:      rgba(247,243,235,.85);
	--gv-muted:     rgba(247,243,235,.55);
	--gv-border:    rgba(201,160,99,.28);
	--gv-radius:    3px;
	--gv-tr:        220ms cubic-bezier(.4,0,.2,1);
	background: var(--gv-navy);
	color: var(--gv-text);
}

/* ── Shared eyebrow / heading ─────────────────────────────── */
#gala-page .gv-eyebrow {
	font-family: var(--dc-sans);
	font-size: .72rem;
	font-weight: 500;
	letter-spacing: .42em;
	text-transform: uppercase;
	color: var(--gv-gold);
	margin: 0 0 1rem;
}

#gala-page .gv-section__title {
	font-family: var(--dc-serif);
	font-weight: 500;
	font-size: clamp(1.9rem,4.5vw,3.2rem);
	line-height: 1.1;
	color: var(--gv-cream);
	margin: 0 0 1rem;
}

#gala-page .gv-section__title em {
	font-style: italic;
	color: var(--gv-gold);
}

#gala-page .gv-section__lede {
	font-family: var(--dc-serif);
	font-size: clamp(1.05rem,1.8vw,1.3rem);
	font-style: italic;
	color: var(--gv-text);
	max-width: 600px;
	margin: 0 auto;
	line-height: 1.5;
}

/* ── Sections ─────────────────────────────────────────────── */
#gala-page .gv-section {
	padding: clamp(64px,8vw,112px) clamp(20px,5vw,72px);
	max-width: 1200px;
	margin: 0 auto;
}

#gala-page .gv-section--narrow { max-width: 820px; }

#gala-page .gv-section__header {
	text-align: center;
	margin-bottom: clamp(36px,4vw,56px);
}

/* ── Hero ─────────────────────────────────────────────────── */
#gala-page .gv-hero {
	position: relative;
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-size: cover;
	background-position: center 30%;
	background-repeat: no-repeat;
	animation: gv-zoom 30s ease-out forwards;
}

@keyframes gv-zoom {
	from { background-size: 110%; }
	to   { background-size: 100%; }
}

#gala-page .gv-hero__overlay {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at 50% 40%, rgba(11,20,38,.35) 0%, rgba(11,20,38,.8) 70%),
		linear-gradient(180deg, rgba(11,20,38,.5) 0%, rgba(11,20,38,.65) 50%, var(--gv-navy) 100%);
}

#gala-page .gv-hero__content {
	position: relative;
	z-index: 2;
	max-width: 900px;
	padding: clamp(96px,12vh,160px) clamp(20px,5vw,60px) clamp(60px,8vh,100px);
	width: 100%;
}

#gala-page .gv-hero__title {
	font-family: var(--dc-serif);
	font-weight: 400;
	font-size: clamp(2.8rem,8vw,5.8rem);
	letter-spacing: .02em;
	line-height: 1.05;
	color: var(--gv-cream);
	margin: 0 0 1.2rem;
	text-shadow: 0 4px 30px rgba(0,0,0,.5);
}

#gala-page .gv-hero__meta {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: clamp(12px,2vw,32px);
	margin: 0 0 2.5rem;
}

#gala-page .gv-hero__meta-sep { color: var(--gv-gold); font-size: 1rem; }

#gala-page .gv-meta-label {
	display: block;
	font-size: .68rem;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--gv-gold);
	margin-bottom: 3px;
}

#gala-page .gv-meta-value {
	display: block;
	font-family: var(--dc-serif);
	font-size: 1.05rem;
	color: var(--gv-cream);
}

#gala-page .gv-cta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 16px 38px;
	background: var(--gv-gold);
	color: var(--gv-navy);
	font-family: var(--dc-sans);
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .28em;
	text-transform: uppercase;
	border-radius: var(--gv-radius);
	box-shadow: 0 0 30px var(--gv-gold-glow);
	transition: all var(--gv-tr);
}

#gala-page .gv-cta:hover {
	background: var(--gv-gold-h);
	transform: translateY(-2px);
	color: var(--gv-navy);
}

/* ── Invitation ───────────────────────────────────────────── */
#gala-page .gv-invitation {
	background: linear-gradient(180deg, var(--gv-navy) 0%, var(--gv-navy-2) 100%);
	text-align: center;
	padding: clamp(56px,7vw,100px) clamp(20px,5vw,72px);
}

#gala-page .gv-invitation__body {
	max-width: 720px;
	margin: 0 auto;
	font-family: var(--dc-serif);
	font-size: clamp(1.1rem,2vw,1.45rem);
	font-weight: 300;
	line-height: 1.6;
	color: var(--gv-cream);
}

#gala-page .gv-ornament {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	color: var(--gv-gold);
	max-width: 480px;
	margin: 2.5rem auto;
}

#gala-page .gv-ornament::before,
#gala-page .gv-ornament::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--gv-gold) 40%, var(--gv-gold) 60%, transparent);
	opacity: .6;
}

#gala-page .gv-ornament span {
	font-family: var(--dc-serif);
	font-size: 1.3rem;
	letter-spacing: .2em;
}

/* ── Experience features ──────────────────────────────────── */
#gala-page .gv-experience {
	background: var(--gv-navy-2);
	max-width: 100%;
	padding: clamp(64px,8vw,112px) clamp(20px,5vw,72px);
}

#gala-page .gv-experience .gv-section__header { max-width: 1200px; margin: 0 auto clamp(36px,4vw,56px); }

#gala-page .gv-features {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
	gap: 1.5rem;
	max-width: 1200px;
	margin: 0 auto;
}

#gala-page .gv-feature {
	text-align: center;
	padding: 2rem 1.5rem;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--gv-border);
	border-radius: var(--gv-radius);
	transition: transform var(--gv-tr), border-color var(--gv-tr), background var(--gv-tr);
}

#gala-page .gv-feature:hover {
	transform: translateY(-4px);
	border-color: var(--gv-gold);
	background: var(--gv-gold-dim);
}

#gala-page .gv-feature__icon {
	font-family: var(--dc-serif);
	font-size: 2.4rem;
	color: var(--gv-gold);
	margin-bottom: 1rem;
	line-height: 1;
}

#gala-page .gv-feature__title {
	font-family: var(--dc-serif);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--gv-cream);
	margin: 0 0 .6rem;
}

#gala-page .gv-feature__text {
	font-size: .9rem;
	color: var(--gv-text);
	line-height: 1.6;
	margin: 0;
}

/* ── Program timeline ─────────────────────────────────────── */
#gala-page .gv-program {
	background: linear-gradient(180deg, var(--gv-navy-2) 0%, var(--gv-navy) 100%);
}

#gala-page .gv-program__list {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	position: relative;
}

#gala-page .gv-program__list::before {
	content: '';
	position: absolute;
	left: 30px;
	top: 18px;
	bottom: 18px;
	width: 1px;
	background: linear-gradient(180deg, transparent, var(--gv-gold) 12%, var(--gv-gold) 88%, transparent);
	opacity: .45;
}

#gala-page .gv-program__item {
	display: grid;
	grid-template-columns: 62px 1fr;
	gap: 1.4rem;
	padding: 1.4rem 0;
}

#gala-page .gv-program__num {
	width: 58px; height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--gv-navy);
	border: 1.5px solid var(--gv-gold);
	border-radius: 50%;
	color: var(--gv-gold);
	font-family: var(--dc-serif);
	font-size: 1.25rem;
	font-weight: 600;
	flex-shrink: 0;
	position: relative;
	z-index: 2;
}

#gala-page .gv-program__body { padding-top: 8px; }

#gala-page .gv-program__title {
	font-family: var(--dc-serif);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--gv-cream);
	margin: 0 0 .4rem;
}

#gala-page .gv-program__text {
	font-size: .92rem;
	color: var(--gv-text);
	line-height: 1.6;
	margin: 0;
}

/* ── Host ─────────────────────────────────────────────────── */
#gala-page .gv-host {
	background: var(--gv-navy);
	max-width: 100%;
	padding: clamp(64px,8vw,112px) clamp(20px,5vw,72px);
}

#gala-page .gv-host__grid {
	display: grid;
	grid-template-columns: 1fr 1.3fr;
	gap: 4rem;
	max-width: 1100px;
	margin: 0 auto;
	align-items: center;
}

#gala-page .gv-host__image {
	position: relative;
	border-radius: var(--gv-radius);
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0,0,0,.6);
	aspect-ratio: 4 / 5;
}

#gala-page .gv-host__image img {
	width: 100%; height: 100%;
	object-fit: cover;
	object-position: center 25%;
}

#gala-page .gv-host__image::after {
	content: '';
	position: absolute;
	inset: 0;
	border: 1px solid var(--gv-gold);
	margin: 14px;
	pointer-events: none;
	opacity: .5;
}

#gala-page .gv-host__content .gv-eyebrow,
#gala-page .gv-host__content .gv-section__title { text-align: left; }

#gala-page .gv-host__bio {
	font-family: var(--dc-serif);
	font-size: 1.05rem;
	font-weight: 300;
	line-height: 1.7;
	color: var(--gv-cream);
	margin: 1.2rem 0;
}

#gala-page .gv-host__credentials {
	list-style: none;
	padding: 0;
	margin: 1.5rem 0 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .5rem 1.4rem;
}

#gala-page .gv-host__credentials li {
	position: relative;
	padding-left: 20px;
	font-size: .88rem;
	color: var(--gv-text);
}

#gala-page .gv-host__credentials li::before {
	content: '✦';
	position: absolute;
	left: 0;
	top: 0;
	color: var(--gv-gold);
	font-size: .8rem;
}

/* ── Event details ────────────────────────────────────────── */
#gala-page .gv-detail-card {
	max-width: 880px;
	margin: 0 auto;
	background: rgba(255,255,255,.025);
	border: 1px solid var(--gv-border);
	border-radius: var(--gv-radius);
	padding: clamp(24px,3vw,48px);
}

#gala-page .gv-detail-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin-bottom: 2rem;
}

#gala-page .gv-detail-row:last-child { margin-bottom: 0; }

#gala-page .gv-detail {
	border-left: 2px solid var(--gv-gold);
	padding-left: 1.1rem;
}

#gala-page .gv-detail__label {
	font-size: .68rem;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--gv-gold);
	margin: 0 0 .35rem;
}

#gala-page .gv-detail__value {
	font-family: var(--dc-serif);
	font-size: 1.25rem;
	font-weight: 500;
	color: var(--gv-cream);
	margin: 0;
	line-height: 1.3;
}

#gala-page .gv-detail__sub {
	font-size: .88rem;
	color: var(--gv-text);
	margin: .3rem 0 0;
	font-style: italic;
}

/* ── Gallery ──────────────────────────────────────────────── */
#gala-page .gv-gallery {
	background: var(--gv-navy-2);
}

#gala-page .gv-gallery__grid {
	display: grid;
	grid-template-columns: repeat(12,1fr);
	gap: 1rem;
}

#gala-page .gv-gallery__item {
	overflow: hidden;
	border-radius: var(--gv-radius);
	border: 1px solid var(--gv-border);
}

#gala-page .gv-gallery__item img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 600ms cubic-bezier(.2,.7,.3,1);
}

#gala-page .gv-gallery__item:hover img { transform: scale(1.06); }

#gala-page .gv-gallery__item--lg { grid-column: span 7; aspect-ratio: 7/5; }
#gala-page .gv-gallery__item--md { grid-column: span 5; aspect-ratio: 5/5; }
#gala-page .gv-gallery__item--sm { grid-column: span 4; aspect-ratio: 4/4; }

/* ── Press quote ──────────────────────────────────────────── */
#gala-page .gv-press {
	background: linear-gradient(180deg, var(--gv-navy-2) 0%, var(--gv-navy) 100%);
	padding: clamp(56px,7vw,96px) clamp(20px,5vw,72px);
}

#gala-page .gv-press__inner {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 3rem;
	align-items: center;
	max-width: 900px;
	margin: 0 auto;
}

#gala-page .gv-press__cover {
	box-shadow: 0 20px 60px rgba(0,0,0,.6);
	border: 1px solid var(--gv-gold);
	border-radius: var(--gv-radius);
	overflow: hidden;
}

#gala-page .gv-press__cover img { width: 100%; height: auto; display: block; }

#gala-page .gv-press__quote {
	font-family: var(--dc-serif);
	font-size: clamp(1.25rem,2vw,1.6rem);
	font-style: italic;
	color: var(--gv-cream);
	line-height: 1.5;
	margin: 0 0 1rem;
	position: relative;
	padding-left: 2.4rem;
}

#gala-page .gv-press__quote::before {
	content: '\201C';
	position: absolute;
	left: 0;
	top: -10px;
	font-family: var(--dc-serif);
	font-size: 4rem;
	color: var(--gv-gold);
	line-height: 1;
}

#gala-page .gv-press__cite {
	font-size: .82rem;
	color: var(--gv-gold);
	letter-spacing: .14em;
	text-transform: uppercase;
}

/* ── RSVP form ────────────────────────────────────────────── */
#gala-page .gv-rsvp {
	background: var(--gv-navy);
	position: relative;
}

#gala-page .gv-rsvp::before {
	content: '';
	position: absolute;
	top: -100px;
	left: 50%;
	transform: translateX(-50%);
	width: 600px;
	height: 200px;
	background: radial-gradient(ellipse, var(--gv-gold-glow) 0%, transparent 70%);
	pointer-events: none;
}

#gala-page .gv-rsvp__form {
	max-width: 560px;
	margin: 0 auto;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--gv-border);
	border-radius: var(--gv-radius);
	padding: clamp(24px,3vw,40px);
	position: relative;
}

#gala-page .gv-field { margin-bottom: 1.3rem; }

#gala-page .gv-field__label {
	display: block;
	font-size: .7rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--gv-gold);
	margin-bottom: .4rem;
}

#gala-page .gv-field__input,
#gala-page .gv-field__select,
#gala-page .gv-field__textarea {
	width: 100%;
	background: rgba(0,0,0,.3);
	border: 1px solid var(--gv-border);
	border-radius: var(--gv-radius);
	color: var(--gv-cream);
	font-family: var(--dc-sans);
	font-size: .95rem;
	padding: 12px 14px;
	outline: none;
	transition: border-color var(--gv-tr), box-shadow var(--gv-tr);
}

#gala-page .gv-field__input:focus,
#gala-page .gv-field__select:focus,
#gala-page .gv-field__textarea:focus {
	border-color: var(--gv-gold);
	box-shadow: 0 0 0 3px var(--gv-gold-dim);
}

#gala-page .gv-field__input::placeholder { color: var(--gv-muted); }

#gala-page .gv-field__textarea { resize: vertical; min-height: 90px; }

#gala-page .gv-field__select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c9a063' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 12px;
	padding-right: 36px;
}

#gala-page .gv-field__select option { background: var(--gv-navy); color: var(--gv-cream); }

#gala-page .gv-rsvp__submit {
	width: 100%;
	background: var(--gv-gold);
	color: var(--gv-navy);
	border: 0;
	border-radius: var(--gv-radius);
	padding: 16px;
	font-family: var(--dc-sans);
	font-size: .82rem;
	font-weight: 700;
	letter-spacing: .3em;
	text-transform: uppercase;
	cursor: pointer;
	margin-top: .5rem;
	transition: all var(--gv-tr);
}

#gala-page .gv-rsvp__submit:hover {
	background: var(--gv-gold-h);
	transform: translateY(-1px);
}

#gala-page .gv-rsvp__note {
	font-size: .75rem;
	color: var(--gv-muted);
	text-align: center;
	margin: 1rem 0 0;
	font-style: italic;
}

#gala-page .gv-rsvp__msg {
	margin: 1rem 0 0;
	text-align: center;
	font-size: .9rem;
	padding: 12px;
	border-radius: var(--gv-radius);
}

#gala-page .gv-rsvp__msg--ok { background: rgba(100,200,120,.12); color: #8de8a0; border: 1px solid rgba(100,200,120,.25); }
#gala-page .gv-rsvp__msg--err { background: rgba(220,80,80,.1); color: #f5a0a0; border: 1px solid rgba(220,80,80,.2); }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 900px) {
	#gala-page .gv-host__grid { grid-template-columns: 1fr; gap: 2.5rem; }
	#gala-page .gv-press__inner { grid-template-columns: 1fr; text-align: center; }
	#gala-page .gv-press__cover { max-width: 260px; margin: 0 auto; }
	#gala-page .gv-press__quote { padding-left: 0; }
	#gala-page .gv-press__quote::before { display: none; }
	#gala-page .gv-gallery__item--lg,
	#gala-page .gv-gallery__item--md { grid-column: span 12; }
	#gala-page .gv-gallery__item--sm  { grid-column: span 6;  }
	#gala-page .gv-detail-row { grid-template-columns: 1fr; gap: 1.4rem; }
	#gala-page .gv-host__credentials { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
	#gala-page .gv-program__item { grid-template-columns: 50px 1fr; gap: 1rem; }
	#gala-page .gv-program__num  { width: 46px; height: 46px; font-size: 1rem; }
	#gala-page .gv-program__list::before { left: 23px; }
	#gala-page .gv-gallery__item--sm { grid-column: span 12; }
	#gala-page .gv-hero__meta { flex-direction: column; gap: .8rem; }
	#gala-page .gv-hero__meta-sep { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	#gala-page .gv-hero { animation: none; }
	#gala-page .gv-feature,
	#gala-page .gv-gallery__item img,
	#gala-page .gv-cta { transition: none; }
}
