* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Jost', sans-serif; color: #2C2416; background: #FAF7F2; overflow-x: hidden; }
/* NAV */
nav {
 position: fixed; top: 0; left: 0; right: 0; z-index: 100;
 padding: 20px 60px;
 display: flex; justify-content: space-between; align-items: center;
 background: rgba(250,247,242,0.95);
 backdrop-filter: blur(10px);
 border-bottom: 1px solid rgba(122,158,126,0.15);
}
.nav-brand { font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 400; color: #2C2416; text-decoration: none; }
.nav-links { display: flex; gap: 32px; align-items: center; }
.nav-links a { font-size: 12px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: #6B5E4E; text-decoration: none; transition: color 0.2s; }
.nav-links a:hover { color: #C4745A; }
.nav-cta { background: #2C2416; color: #FAF7F2 !important; padding: 10px 24px; border-radius: 100px; }
.nav-cta:hover { background: #C4745A; color: white !important; }
/* HERO */
.hero {
 min-height: 100vh;
 position: relative;
 display: flex; align-items: center;
 overflow: hidden;
 padding-top: 80px;
}
.hero-bg {
 position: absolute; inset: 0;
 background-image: url('images/hero-bg.jpg');
 background-size: cover; background-position: center;
 filter: brightness(0.4);
}
.hero-overlay {
 position: absolute; inset: 0;
 background: linear-gradient(135deg, rgba(44,36,22,0.7) 0%, rgba(122,158,126,0.2) 100%);
}
.hero-content {
 position: relative; z-index: 2;
 max-width: 800px;
 padding: 80px 80px;
}
.hero-tag {
 display: inline-block;
 font-size: 11px; font-weight: 500; letter-spacing: 0.25em; text-transform: uppercase;
 color: #B8D4BB;
 border: 1px solid rgba(184,212,187,0.4);
 padding: 6px 16px; border-radius: 100px;
 margin-bottom: 32px;
}
.hero-title {
 font-family: 'Cormorant Garamond', serif;
 font-size: clamp(52px, 8vw, 96px);
 font-weight: 300; line-height: 1;
 color: white;
 margin-bottom: 24px;
}
.hero-title em { font-style: italic; color: #E8B89A; }
.hero-hook {
 font-size: clamp(16px, 2vw, 20px);
 font-weight: 300; line-height: 1.7;
 color: rgba(255,255,255,0.85);
 max-width: 560px;
 margin-bottom: 48px;
}
.hero-hook strong { color: white; font-weight: 500; }
.hero-buttons { display: flex; gap: 16px; flex-wrap: wrap; }
.btn-primary {
 display: inline-block; padding: 16px 40px;
 background: #C4745A; color: white;
 font-size: 12px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase;
 text-decoration: none; border-radius: 100px;
 transition: all 0.3s ease;
}
.btn-primary:hover { background: #a85e47; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(196,116,90,0.4); }
.btn-outline {
 display: inline-block; padding: 16px 40px;
 background: transparent; color: white;
 font-size: 12px; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase;
 text-decoration: none; border-radius: 100px;
 border: 1px solid rgba(255,255,255,0.4);
 transition: all 0.3s ease;
}
.btn-outline:hover { background: rgba(255,255,255,0.1); border-color: white; }
.urgency-bar {
 position: absolute; bottom: 40px; left: 80px; right: 80px;
 display: flex; align-items: center; gap: 16px;
}
.urgency-pill {
 background: #C4745A; color: white;
 font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
 padding: 8px 20px; border-radius: 100px;
 animation: pulse 2s infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.7} }
.urgency-text { font-size: 14px; color: rgba(255,255,255,0.8); font-weight: 300; }
/* DATES */
.dates-section { padding: 100px 80px; background: #FDF9F4; }
.section-eyebrow { font-size: 11px; font-weight: 500; letter-spacing: 0.25em; text-transform: uppercase; color: #7A9E7E; margin-bottom: 12px; display: block; }
.section-heading { font-family: 'Cormorant Garamond', serif; font-size: clamp(36px, 4vw, 56px); font-weight: 300; color: #2C2416; margin-bottom: 56px; line-height: 1.2; }
.section-heading em { font-style: italic; color: #C4745A; }
.dates-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.dates-interest { margin-top: 40px; text-align: center; font-size: 14px; color: #A89880; }
.dates-interest a { color: #C4745A; text-decoration: underline; text-underline-offset: 3px; transition: color 0.2s; }
.dates-interest a:hover { color: #2C2416; }
.date-card {
 border: 1px solid rgba(122,158,126,0.2);
 border-radius: 24px; padding: 40px 32px;
 background: #FAF7F2; position: relative; overflow: hidden;
 transition: all 0.3s ease;
}
.date-card:hover { transform: translateY(-6px); box-shadow: 0 24px 56px rgba(44,36,22,0.1); border-color: #7A9E7E; }
.date-card.featured { background: #2C2416; border-color: #2C2416; }
.date-badge {
 position: absolute; top: 20px; right: 20px;
 background: #C4745A; color: white;
 font-size: 9px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase;
 padding: 5px 12px; border-radius: 100px;
}
.date-price { white-space: nowrap; } .date-number { font-family: 'Cormorant Garamond', serif; font-size: 56px; font-weight: 300; line-height: 1; color: #7A9E7E; margin-bottom: 4px; }
.date-card.featured .date-number { color: #B8D4BB; }
.date-month { font-family: 'Cormorant Garamond', serif; font-size: 28px; font-weight: 300; color: #2C2416; margin-bottom: 4px; }
.date-card.featured .date-month { color: white; }
.date-day { font-size: 12px; color: #A89880; font-weight: 300; margin-bottom: 24px; }
.date-card.featured .date-day { color: rgba(255,255,255,0.5); }
.date-divider { width: 100%; height: 1px; background: rgba(44,36,22,0.1); margin-bottom: 24px; }
.date-card.featured .date-divider { background: rgba(255,255,255,0.15); }
.date-price-was { font-size: 14px; color: #A89880; text-decoration: line-through; margin-bottom: 4px; }
.date-price { font-family: 'Cormorant Garamond', serif; font-size: 48px; font-weight: 300; color: #C4745A; line-height: 1; }
.date-card.featured .date-price { color: #E8B89A; }
.date-note { font-size: 12px; color: #A89880; font-weight: 300; margin-bottom: 28px; }
.date-card.featured .date-note { color: rgba(255,255,255,0.4); }
.date-btn {
 display: block; text-align: center;
 padding: 13px 24px; border-radius: 100px;
 font-size: 11px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase;
 text-decoration: none; transition: all 0.3s ease;
 border: 1px solid #2C2416; color: #2C2416; background: transparent;
}
.date-card.featured .date-btn { border-color: rgba(255,255,255,0.3); color: white; }
.date-btn:hover { background: #C4745A; border-color: #C4745A; color: white; }
/* HOOK IMAGE SECTION */
.hook-section {
 position: relative; overflow: hidden;
 min-height: 500px; display: flex; align-items: center;
}
.hook-bg { position: absolute; inset: 0; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; background-image: url('images/hook-bg.png'); background-size: cover; background-position: center top; filter: brightness(0.35); }
.hook-content { position: relative; z-index: 2; padding: 80px; max-width: 700px; }
.hook-quote {
 font-family: 'Cormorant Garamond', serif;
 font-size: clamp(28px, 4vw, 48px);
 font-weight: 300; line-height: 1.4;
 color: white;
 margin-bottom: 32px;
}
.hook-quote em { font-style: italic; color: #E8B89A; }
.hook-sub { font-size: 15px; font-weight: 300; color: rgba(255,255,255,0.75); line-height: 1.8; max-width: 500px; }
/* WHAT IS IT */
.about-event { padding: 100px 80px; background: #FAF7F2; display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 720px; margin: 0 auto; }
.about-event-image { border-radius: 24px; overflow: hidden; aspect-ratio: 4/5; }
.about-event-image img { width: 100%; height: 100%; object-fit: cover; }
.about-event-content {}
.about-event-content p { font-size: 15px; font-weight: 300; line-height: 1.9; color: #6B5E4E; margin-bottom: 20px; }
.about-event-content strong { color: #2C2416; font-weight: 500; }
/* OFFERINGS */
.offerings { padding: 100px 80px; background: #2C2416; }
.offerings .section-eyebrow { color: #B8D4BB; }
.offerings .section-heading { color: white; }
.offerings-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.offering-card {
 border-radius: 20px; overflow: hidden;
 position: relative;
 aspect-ratio: 4/3;
}
.offering-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.offering-card:hover img { transform: scale(1.05); }
.offering-overlay {
 position: absolute; inset: 0;
 background: linear-gradient(to top, rgba(44,36,22,0.9) 0%, rgba(44,36,22,0.1) 60%);
 display: flex; flex-direction: column; justify-content: flex-end;
 padding: 28px;
}
.offering-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 18px; font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 400; color: white; margin-bottom: 4px; }
.offering-desc { font-size: 12px; color: rgba(255,255,255,0.6); font-weight: 300; }
/* INCLUDES LIST */
.includes { padding: 80px 80px; background: #FDF9F4; }
.includes-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 48px; }
.include-item {
 padding: 24px 20px;
 border: 1px solid rgba(122,158,126,0.2);
 border-radius: 16px; background: #FAF7F2;
 text-align: center;
 transition: all 0.3s ease;
}
.include-item:hover { border-color: #7A9E7E; transform: translateY(-3px); }
.include-emoji { font-size: 28px; margin-bottom: 10px; display: flex; justify-content: center; align-items: center; height: 48px; }
.include-text { font-size: 13px; font-weight: 400; color: #6B5E4E; line-height: 1.4; }
/* VENUE */
.venue-section { padding: 100px 80px; background: #FAF7F2; }
.venue-gallery { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 300px 300px; gap: 16px; margin-top: 48px; }
.venue-img { border-radius: 16px; overflow: hidden; }
.venue-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.venue-img:hover img { transform: scale(1.03); }
.venue-img.tall { grid-row: span 2; }
.venue-tag {
 display: inline-flex; align-items: center; gap: 8px;
 margin-top: 24px;
 font-size: 13px; color: #6B5E4E; font-weight: 300;
}
.venue-tag strong { color: #2C2416; font-weight: 500; }
.venue-dot { width: 6px; height: 6px; border-radius: 50%; background: #7A9E7E; }
/* ABOUT SURBHI */
.about-surbhi { padding: 100px 80px; background: #2C2416; display: grid; grid-template-columns: 400px 1fr; gap: 80px; align-items: center; }
.about-photo { position: relative; }
.about-photo img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top; border-radius: 200px 200px 24px 24px; }
.about-photo-accent { position: absolute; bottom: -16px; right: -16px; width: 100px; height: 100px; border-radius: 50%; background: #C4745A; opacity: 0.3; z-index: -1; }
.about-text .section-eyebrow { color: #B8D4BB; font-size: 13px; }
.about-name { font-family: 'Cormorant Garamond', serif; font-size: clamp(40px, 5vw, 64px); font-weight: 300; color: white; line-height: 1; margin-bottom: 8px; }
.about-role { font-size: 12px; color: #7A9E7E; font-weight: 500; letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 32px; }
.about-text p { font-size: 15px; font-weight: 300; line-height: 1.9; color: rgba(255,255,255,0.7); margin-bottom: 16px; }
.about-text p strong { color: white; font-weight: 500; }
/* FAQ */
.faq { padding: 100px 80px; background: #FAF7F2; }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 56px; }
.faq-item { padding: 32px 32px; border-bottom: 1px solid rgba(44,36,22,0.08); }
.faq-item:nth-child(odd) { border-right: 1px solid rgba(44,36,22,0.08); }
.faq-q { font-family: 'Cormorant Garamond', serif; font-size: 20px; font-weight: 400; color: #2C2416; margin-bottom: 12px; }
.faq-a { font-size: 14px; font-weight: 300; line-height: 1.8; color: #6B5E4E; }
/* FINAL CTA */
.final-cta {
 padding: 120px 80px; text-align: center;
 background: #C4745A; position: relative; overflow: hidden;
}
.final-cta::before {
 content: 'Meet Yourself';
 position: absolute; font-family: 'Cormorant Garamond', serif;
 font-size: 180px; font-weight: 300;
 color: rgba(255,255,255,0.07);
 white-space: nowrap;
 top: 50%; left: 50%; transform: translate(-50%, -50%);
 pointer-events: none; user-select: none;
}
.final-cta .section-eyebrow { color: rgba(255,255,255,0.7); }
.final-cta-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(40px, 6vw, 72px); font-weight: 300; color: white; line-height: 1.15; margin-bottom: 24px; }
.final-cta-title em { font-style: italic; }
.final-cta-sub { font-size: 15px; font-weight: 300; color: rgba(255,255,255,0.8); max-width: 460px; margin: 0 auto 48px; line-height: 1.8; }
.btn-white { display: inline-block; padding: 18px 56px; background: white; color: #C4745A; font-size: 12px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; border-radius: 100px; transition: all 0.3s ease; }
.btn-white:hover { background: #2C2416; color: white; transform: translateY(-2px); box-shadow: 0 8px 32px rgba(44,36,22,0.3); }
/* PAST EVENT GALLERY */
.gallery-section { padding: 100px 80px; background: #FAF7F2; text-align: center; }
.gallery-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 grid-template-rows: repeat(4, 260px);
 gap: 12px;
 max-width: 1100px;
 margin: 0 auto;
}
.gallery-item { overflow: hidden; border-radius: 16px; }
.gallery-item--feature { grid-column: span 2; grid-row: span 2; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease; }
.gallery-item:hover img { transform: scale(1.04); }
/* FOOTER */
footer { padding: 40px 80px; background: #1a1510; display: flex; justify-content: space-between; align-items: center; }
.footer-brand { font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 300; color: #FAF7F2; }
.footer-tagline { font-size: 13px; color: #6B5E4E; font-weight: 300; }
.footer-links { display: flex; gap: 24px; }
.footer-links a { font-size: 12px; color: #6B5E4E; text-decoration: none; letter-spacing: 0.08em; text-transform: uppercase; transition: color 0.2s; }
.footer-links a:hover { color: #FAF7F2; }
/* MOBILE */
@media(max-width:768px){
 nav { padding: 16px 24px; }
 .nav-links { display: none; }
 .hero-content, .hook-content { padding: 60px 24px; }
 .urgency-bar { left: 24px; right: 24px; bottom: 24px; }
 .dates-section, .about-event, .offerings, .includes, .venue-section, .about-surbhi, .faq, .final-cta { padding: 60px 24px; }
 .dates-grid, .includes-grid { grid-template-columns: 1fr; }
 .offerings-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
 .offering-card { aspect-ratio: 3/4; }
 .offering-name { font-size: 13px !important; }
 .offering-desc { font-size: 11px !important; }
 .about-event, .about-surbhi { grid-template-columns: 1fr; gap: 40px; }
 .venue-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
 .venue-img.tall { grid-row: span 1; }
 .faq-grid { grid-template-columns: 1fr; }
 .faq-item:nth-child(odd) { border-right: none; }
 .gallery-section { padding: 60px 24px; }
 .gallery-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(5, 180px); }
 .gallery-item--feature { grid-column: span 2; grid-row: span 1; }
 footer { flex-direction: column; gap: 16px; padding: 32px 24px; text-align: center; }
}