﻿/* ================================================
   CUSTOM PROPERTIES
================================================ */

@font-face
{
    font-family:swlong;
    src:url("/css/font/trade-gothic-lt-std-bold-no-2.otf");
}


:root {
  --cream:       #fdf8f3;
  --cream-dark:  #f5ede2;
  --blush:       #f4d4c9;
  --blush-dark:  #e2a899;
  --rose:        #c9948a;
  --rose-deep:   #b07068;
  --sage:        #9db5a0;
  --sage-light:  #c8dac8;
  --gold:        #c9a46e;
  --gold-light:  #e8d5b0;
  --lavender:    #b8aed4;
  --lav-light:   #ddd8ee;
  --dark:        #5a4a42;
  --text:        #6b5a52;
  --text-muted:  #9a8880;
  --white:       #ffffff;
  --swlongblue:	 #4BD5EE;

  --serif:  'Cormorant Garamond', Georgia, serif;
  --script: 'Dancing Script', cursive;
  --sans:   'Raleway', sans-serif;
  --swlongf:   'swlong', sans-serif;

  --section-pad: 100px 0;
}

/* ================================================
   RESET
================================================ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body {
  background: var(--cream);
  color: var(--text);
  font-family: var(--sans);
  font-weight: 300;
  line-height: 1.8;
  overflow-x: hidden;
}
img { max-width:100%; display:block; }
a { text-decoration:none; }

/* ================================================
   NAV
================================================ */
.nav {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  display: flex; align-items:center; justify-content:space-between;
  padding: 22px 50px;
  transition: all .4s ease;
}
.nav.scrolled {
  background: rgba(253,248,243,.96);
  backdrop-filter: blur(12px);
  padding: 14px 50px;
  box-shadow: 0 2px 24px rgba(90,74,66,.08);
}
.nav-logo {
  font-family: var(--script);
  font-size: 1.9rem;
  color: #fff;
  transition: color .3s;
}
.nav.scrolled .nav-logo { color: var(--rose); }

.nav-links { display:flex; gap:10px; list-style:none; }
.nav-links li {padding:0px 9px;}
.nav-links li.navflag {padding:0px 0px;}
.navflagfirst {padding-left:9px;}
.nav-links a {
  font-size: .72rem; font-weight:500;
  letter-spacing: .18em; text-transform:uppercase;
  color: rgba(255,255,255,.88);
  transition: color .3s;
}
.nav-links a img{width:25px;}
.nav.scrolled .nav-links a { color: var(--text); }
.nav-links a:hover { color: var(--gold) !important; }

.nav-toggle { display:none; flex-direction:column; gap:5px; cursor:pointer; z-index:1001; }
.nav-toggle span { display:block; width:24px; height:2px; background:#fff; transition:.3s; border-radius:2px; }
.nav.scrolled .nav-toggle span { background: var(--dark); }

/* Mobile menu */
.mobile-menu {
  display: none;
  position: fixed; inset:0; z-index:999;
  background: var(--cream);
  flex-direction:column; align-items:center; justify-content:center; gap:2px;
}
.mobile-menu.open { display:flex; }
.mobile-menu a {
  font-family: var(--serif); font-size:1.8rem; font-weight:300;
  color: var(--dark); letter-spacing:.05em;
}

.mobile-menu div{
	display:flex;gap:20%;
	width:60%;
	margin-top:20px;
}
.mobile-menu div a{width:25%;}
.mobile-menu div a img {
	width: 100%;
}
.mobile-menu a:hover { color: var(--rose); }

/* ================================================
   HERO
================================================ */
#hero {
  position:relative; height:100vh; min-height:680px;
  display:flex; align-items:center; overflow:hidden;
}
	.hero-bg {
		position: absolute;
		inset: 0;
		/* CHANGE: replace URL with your couple photo */
		background: url('../gfx/hero1.jpg') center/cover no-repeat;
		transform-origin: center center;
		will-change: transform;
	}
.hero-overlay {
  position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(90,74,66,.58) 0%, rgba(90,74,66,.28) 55%, rgba(184,174,212,.2) 100%);
}
.petals { position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }
.petal {
  position:absolute;
  border-radius: 50% 0 50% 0;
  opacity: .45;
  animation: petalFall linear infinite;
}
@keyframes petalFall {
  0%   { transform: translateY(-30px) rotate(0deg);   opacity:0; }
  8%   { opacity:.45; }
  92%  { opacity:.25; }
  100% { transform: translateY(110vh) rotate(600deg); opacity:0; }
}

.hero-content {
  position:relative; z-index:2;
  width:100%; max-width:96%; margin:0 auto; padding:0 60px;
  display:flex; justify-content:space-between; align-items:center; gap:50px;
}
.hero-left { flex:1; margin-top:-100px;}

.hero-eyebrow {
  display:block;
  font-size:.7rem; font-weight:500; letter-spacing:.28em; text-transform:uppercase;
  color: var(--gold-light); margin-bottom:14px;
}
.hero-title {
  font-family: var(--serif);
  font-size: clamp(2.8rem, 5.5vw, 5.2rem);
  font-weight:300; line-height:1.08; color:#fff; margin-bottom:36px;
}
.hero-title em { font-style:italic; color: var(--gold-light); }

/* CHANGE: couple names, date, location */
.hero-names { font-family:var(--script); font-size:3.5rem; color:#fff; line-height:1.2; }
.hero-names .amp { color: var(--gold-light); }
.hero-divider { width:55px; height:1px; background:var(--gold-light); margin:14px 0; }
.hero-meta { font-size:.88rem; letter-spacing:.08em; color:rgba(255,255,255,.85); }
.hero-meta strong { color: var(--gold-light); font-weight:500; }

/* Countdown */
.hero-right { flex-shrink:0; margin-top:-400px;}
.countdown-box {
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius:20px;
  padding: 36px 32px; text-align:center;
}
.countdown-eyebrow {
  display:block; font-size:.65rem; font-weight:500;
  letter-spacing:.25em; text-transform:uppercase;
  color: var(--gold-light); margin-bottom:22px;
}
.countdown-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.cd-item { display:flex; flex-direction:column; align-items:center; }
.cd-num {
  font-family:var(--serif); font-size:2.8rem; font-weight:300;
  color:#fff; line-height:1; min-width:54px; text-align:center;
}
.cd-unit {
  font-size:.58rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(255,255,255,.6); margin-top:5px;
}

/* Scroll hint */
.scroll-hint {
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  z-index:2; display:flex; flex-direction:column; align-items:center; gap:7px;
  color:rgba(255,255,255,.65); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
}
.scroll-mouse {
  width:22px; height:36px;
  border:2px solid rgba(255,255,255,.45); border-radius:11px;
  display:flex; justify-content:center; padding-top:6px;
}
.scroll-dot { width:3px; height:6px; background:#fff; border-radius:3px; animation:dotBounce 2s infinite; }
@keyframes dotBounce { 0%,100%{transform:translateY(0);opacity:1} 50%{transform:translateY(7px);opacity:.3} }

/* ================================================
   SHARED SECTION STYLES
================================================ */
section { padding: var(--section-pad); }
.container { max-width:1200px; margin:0 auto; padding:0 48px; }

.s-eyebrow {
  display:block; text-align:center;
  font-size:.68rem; font-weight:500; letter-spacing:.28em; text-transform:uppercase;
  color: var(--rose); margin-bottom:10px;
}
.s-title {
  font-family:var(--serif);
  font-size: clamp(2.2rem,4vw,3.8rem);
  font-weight:300; line-height:1.15;
  color:var(--dark); text-align:center; margin-bottom:14px;
}
.s-title em { font-style:italic; color:var(--rose); }

.s-rule {
  display:flex; align-items:center; justify-content:center; gap:14px;
  margin-bottom:62px;
}
.s-rule::before,.s-rule::after {
  content:''; flex:1; max-width:90px; height:1px; background:var(--blush-dark);
}
.s-rule-icon { color:var(--rose); font-size:1.1rem; }

/* generic fade-in target */
.fi { opacity:0; transform:translateY(32px); }

/* ================================================
   OUR STORY
================================================ */
#story { background: var(--cream-dark); overflow:hidden; }

/* Star Wars */
/*.sw-wrap {
  perspective:500px; height:420px; overflow:hidden;
  margin-bottom:90px; background:#080814;
  border-radius:18px; position:relative;
  display:flex; align-items:flex-end; justify-content:center;
}
.sw-stars {
  position:absolute; inset:0;
  background:
    radial-gradient(1px 1px at 15% 25%, #fff 1px, transparent 0),
    radial-gradient(1px 1px at 73% 18%, rgba(255,255,255,.7) 1px, transparent 0),
    radial-gradient(1px 1px at 44% 65%, rgba(255,255,255,.5) 1px, transparent 0),
    radial-gradient(1px 1px at 88% 77%, rgba(255,255,255,.8) 1px, transparent 0),
    radial-gradient(1px 1px at 29% 88%, rgba(255,255,255,.4) 1px, transparent 0),
    radial-gradient(1px 1px at 62% 38%, rgba(255,255,255,.6) 1px, transparent 0),
    radial-gradient(1px 1px at 8%  50%, rgba(255,255,255,.5) 1px, transparent 0),
    radial-gradient(1px 1px at 93% 12%, rgba(255,255,255,.9) 1px, transparent 0),
    #080814;
  background-size:200px 200px,180px 180px,160px 160px,
                  140px 140px,220px 220px,170px 170px,130px 130px,190px 190px,auto;
}
.sw-fade {
  position:absolute; top:0; left:0; right:0; height:110px;
  background:linear-gradient(to bottom,#080814,transparent); z-index:2;
}
.sw-crawl {
  position:relative; z-index:1; width:58%; padding-bottom:40px;
  transform-origin:center bottom;
  transform: perspective(380px) rotateX(28deg);
  animation: swCrawl 28s linear forwards;
  animation-play-state: paused;
}
@keyframes swCrawl { from{top:100%} to{top:-280%} }

.sw-episode {
  font-family:var(--serif); font-size:1rem; font-weight:600;
  color:#ffd700; text-align:center; letter-spacing:.25em; text-transform:uppercase;
  margin-bottom:6px;
}
.sw-title {
  font-family:var(--serif); font-size:2.2rem; font-weight:600;
  color:#ffd700; text-align:center; text-transform:uppercase; line-height:1.2;
  margin-bottom:42px;
}
.sw-body {
  font-family:var(--sans); font-size:.95rem; line-height:2;
  color:#ffd700; text-align:justify; font-weight:400;
}
*/
/* Story blocks */
.story-block {
  display:grid; grid-template-columns:1fr 1fr;
  gap:64px; align-items:center; margin-bottom:90px;
}
	.story-block.cen {
		grid-template-columns: 1fr;
		gap: 40px;
        text-align:center;
	}
	.story-block.rev {
		direction: rtl;
	}
.story-block.rev > * { direction:ltr; }
.story-block.wide { grid-template-columns:1fr; }

.story-img {
  border-radius:16px; overflow:hidden;
  box-shadow:0 20px 60px rgba(90,74,66,.14);
  position:relative;
}
.story-img::after {
  content:''; position:absolute; inset:0;
  border:1px solid rgba(201,164,110,.3); border-radius:16px; pointer-events:none;
}
.story-img img {
  width:100%; height:360px; object-fit:cover;
  transition:transform .7s ease;
}
.story-img:hover img { transform:scale(1.04); }

.story-text h3 { font-family:var(--script); font-size:2rem; color:var(--rose); margin-bottom:14px; }
.story-text p { color:var(--text); font-size:1.2rem; line-height:1.9; margin-bottom:14px;font-weight:400;}
.cen .story-text p  {
	max-width:800px;margin:0px auto 14px auto;
}
.story-text p.longlong
{
	color: var(--swlongblue);
	font-family: var(--swlongf);
	background:rgba(0,0,0,0.7);
	font-size:1.2rem;
	width:70%;
	display:block;
	margin:0px auto 14px auto;
	border-radius: 16px;
	padding-bottom:10px;
	text-align:left;
	padding:10px 5%;
}

.story-img-full img
{
	width:20%;
	float:left;
	height:440px;
}

.story-img-full img:nth-child(2)
{
	width:60%;
}

.story-img-full-mob
{
	display:none;
}

.story-img-full-tri img
{
	width:100%;
	float:left;
	height:630px;
}

.story-img-full-tri-mob
{
	display:none;
}

.story-img-full-tri img:nth-child(2)
{
	width:30%;
}

/* ================================================
   WHERE
================================================ */
#where { background:var(--cream); }

.venue-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }

.venue-name { font-family:var(--serif); font-size:2.1rem; font-weight:300; color:var(--dark); margin-bottom:6px; }
.venue-name em { font-style:italic; color:var(--rose); }
.venue-addr { font-size:.85rem; color:var(--text-muted); letter-spacing:.06em; margin-bottom:26px; }
.venue-desc { color:var(--text); line-height:1.9; margin-bottom:26px; }

.venue-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.venue-list-box{box-shadow:0 20px 60px rgba(90,74,66,.12);width:100%; height:300px;  }
.venue-list li { display:flex; align-items:flex-start; gap:12px; font-size:.92rem; }
.venue-list .ico { font-size:1.1rem; flex-shrink:0; margin-top:2px; }
.venue-list strong { font-weight:600; color:var(--dark); }

.venue-map { border-radius:16px; overflow:hidden;height:700px; margin-top:75px; }
.venue-map iframe { width:100%; height:100%; border:none;border-radius:16px;}

/* ================================================
   WHEN / SCHEDULE
================================================ */
#when { background:var(--cream-dark); }

.when-hero { text-align:center; margin-bottom:80px; }
.when-num {
  display:block;
  font-family:var(--serif); font-size:clamp(5rem,13vw,10rem);
  font-weight:300; line-height:.9; color:var(--blush-dark);
}
.when-month {
  font-size:.85rem; font-weight:500; letter-spacing:.4em; text-transform:uppercase;
  color:var(--rose); margin-top:10px; display:block;
}
.when-year { font-family:var(--serif); font-size:1.9rem; font-weight:300; color:var(--text-muted); }

/* Timeline */
.timeline { position:relative; max-width:720px; margin:0 auto; }
.timeline::before {
  content:''; position:absolute; left:50%; top:0; bottom:0; width:1px;
  background:linear-gradient(to bottom, transparent, var(--blush-dark) 10%, var(--blush-dark) 90%, transparent);
  transform:translateX(-50%);
}
.tl-item {
  display:flex; align-items:center; margin-bottom:54px;
  position:relative; opacity:0; transform:translateY(22px);
}
.tl-item:nth-child(odd) { flex-direction:row-reverse; }

.tl-content { flex:1; padding:0 52px; }
.tl-item:nth-child(odd) .tl-content { text-align:right; }
.tl-time { font-family:var(--serif); font-size:1.4rem; font-weight:300; color:var(--rose); }
.tl-event { font-family:var(--serif); font-size:1.15rem; color:var(--dark); }
.tl-desc { font-size:.82rem; color:var(--text-muted); margin-top:3px; }

.tl-dot {
  width:48px; height:48px;
  background:var(--blush); border:3px solid var(--rose); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:1.25rem;
  position:absolute; left:50%; transform:translateX(-50%); z-index:2;
  box-shadow:0 4px 20px rgba(201,148,138,.3);
  flex-shrink:0;
}

/* ================================================
   CELEBRATION CODE
================================================ */
#code { background:linear-gradient(135deg, var(--lav-light) 0%, var(--blush) 100%); }

.code-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.code-card {
  background:var(--white); border-radius:20px; padding:38px 28px;
  text-align:center; box-shadow:0 10px 40px rgba(90,74,66,.08);
  transition:transform .3s, box-shadow .3s;
}
.code-card:hover { transform:translateY(-6px); box-shadow:0 22px 60px rgba(90,74,66,.14); }
.code-card.star { background:var(--rose); }
.code-card-ico { font-size:2.8rem; margin-bottom:18px; }
.code-card-title { font-family:var(--serif); font-size:1.35rem; font-weight:300; color:var(--dark); margin-bottom:12px; }
.code-card.star .code-card-title { color:#fff; }
.code-card-body { font-size:.88rem; color:var(--text-muted); line-height:1.8; }
.code-card.star .code-card-body { color:rgba(255,255,255,.88); }

/* ================================================
   WEATHER
================================================ */
#weather { background:var(--cream); }

.weather-intro { max-width:700px; margin:0 auto 56px; text-align:center; line-height:1.9; }

.weather-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-bottom:44px; }
.w-card {
  background:var(--cream-dark); border-radius:16px; padding:28px 18px;
  text-align:center; border:1px solid var(--blush);
  transition:all .3s;
}
.w-card:hover { background:var(--blush); transform:translateY(-4px); }
.w-ico { font-size:2.4rem; margin-bottom:10px; }
.w-label { font-size:.7rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--text-muted); margin-bottom:7px; }
.w-val { font-family:var(--serif); font-size:1.55rem; font-weight:300; color:var(--dark); }

.weather-tip {
  background:var(--sage-light); border-radius:16px; padding:30px 38px;
  display:flex; align-items:flex-start; gap:20px;
}
.weather-tip-ico { font-size:2rem; flex-shrink:0; }
.weather-tip h4 { font-family:var(--serif); font-size:1.15rem; font-weight:400; color:var(--dark); margin-bottom:8px; }
.weather-tip p { font-size:.88rem; color:var(--text); line-height:1.85; }

/* ================================================
   TRAVEL
================================================ */
#travel { background:var(--cream-dark); }

.tabs {
  display:flex; gap:0; margin:0 auto 48px;
  background:var(--blush); border-radius:50px; padding:5px;
  max-width:380px;
}
.tab {
  flex:1; padding:10px 18px; border:none; background:transparent; cursor:pointer;
  font-family:var(--sans); font-size:.75rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--text);
  border-radius:50px; transition:all .3s;
}
.tab.on { background:var(--white); color:var(--rose); box-shadow:0 4px 14px rgba(90,74,66,.1); }

.t-panel { display:none; }
.t-panel.on { display:block; }

.transport-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:44px; }
.tr-card { background:var(--white); border-radius:16px; padding:28px 22px; box-shadow:0 4px 20px rgba(90,74,66,.06); }
.tr-ico { font-size:2.3rem; margin-bottom:13px; }
#donations .tr-ico {text-align:center;}
.tr-title { font-family:var(--serif); font-size:1.15rem; font-weight:400; color:var(--dark); margin-bottom:10px; }
#donations .tr-title {width:100%;text-align:center;font-size:1.5rem;}
.tr-body { font-size:.85rem; color:var(--text-muted); line-height:1.82; }
.tr-body strong { color:var(--dark); }

.hotel-group { margin-bottom:42px; }
.hotel-group-title {
  font-family:var(--serif); font-size:1.55rem; font-weight:300; color:var(--dark);
  margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid var(--blush);
}
.hotel-sub { font-size:.85rem; color:var(--text-muted); margin-bottom:22px; }
.hotel-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.hotel-card {
  background:var(--white); border-radius:16px; padding:22px;
  box-shadow:0 4px 20px rgba(90,74,66,.06);
  border-left:4px solid var(--blush-dark);
}
.hotel-name { font-family:var(--serif); font-size:1.05rem; font-weight:400; color:var(--dark); margin-bottom:5px; }
.hotel-stars { color:var(--gold); font-size:.82rem; margin-bottom:8px; }
.hotel-body { font-size:.83rem; color:var(--text-muted); line-height:1.75; }

.coach-banner {
  background:linear-gradient(135deg, var(--rose), var(--lavender));
  border-radius:20px; padding:42px; color:#fff; text-align:center; margin-top:36px;
}
.coach-banner h3 { font-family:var(--serif); font-size:1.75rem; font-weight:300; margin-bottom:14px; }
.coach-banner p { font-size:.92rem; line-height:1.85; max-width:580px; margin:0 auto 22px; opacity:.92; }
.btn-outline {
  display:inline-block; padding:13px 34px;
  background:#fff; color:var(--rose); border-radius:50px;
  font-size:.78rem; font-weight:600; letter-spacing:.15em; text-transform:uppercase;
  transition:all .3s;
}
.btn-outline:hover { background:var(--cream); transform:scale(1.04); }
.btn-outline-rev{background:var(--rose); color:#fff;margin:10px auto;width:auto;display:table;}
.btn-outline-rev:hover { background:var(--cream); transform:scale(1.04); color:var(--rose); }
/* ================================================
   RSVP
================================================ */
#rsvp { background:linear-gradient(155deg, var(--blush) 0%, var(--lav-light) 100%); }

.rsvp-wrap {
  max-width:600px; margin:0 auto;
  background:var(--white); border-radius:24px; padding:52px;
  box-shadow:0 30px 80px rgba(90,74,66,.13);
}
.rsvp-deadline { text-align:center; font-size:.83rem; color:var(--rose); font-weight:500; letter-spacing:.08em; margin-bottom:32px; }
.rsvp-deadline strong { font-weight:600; }

.fg { margin-bottom:22px; }
.fl { display:block; font-size:.72rem; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--text-muted); margin-bottom:7px; }
.fi-input, .fi-sel, .fi-area {
  width:100%; padding:13px 17px;
  background:var(--cream); border:1px solid var(--blush);
  border-radius:10px; font-family:var(--sans); font-size:.93rem; color:var(--text);
  outline:none; transition:border-color .3s, box-shadow .3s;
}
.fi-input:focus, .fi-sel:focus, .fi-area:focus {
  border-color:var(--rose); box-shadow:0 0 0 3px rgba(201,148,138,.14);
}
.fi-area { resize:vertical; min-height:96px; }
.radio-group { display:flex; gap:18px; flex-wrap:wrap; }
.radio-label { display:flex; align-items:center; gap:8px; cursor:pointer; font-size:.92rem; }
.radio-label input { accent-color:var(--rose); width:17px; height:17px; }

.btn-submit {
  width:100%; padding:15px; background:var(--rose); color:#fff;
  border:none; border-radius:50px; font-family:var(--sans);
  font-size:.82rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  cursor:pointer; transition:all .3s;display:inline-block;text-align:center;
}
.btn-submit:hover { background:var(--dark); transform:translateY(-2px); box-shadow:0 12px 32px rgba(90,74,66,.2); }
#donations{
	    background: var(--cream-dark);
}
}
/* ================================================
   FAQ
================================================ */
#faq { background:var(--cream); }

.faq-list { max-width:820px; margin:0 auto; }
.faq-item { border-bottom:1px solid var(--blush); }
.faq-item:first-child { border-top:1px solid var(--blush); }

.faq-q {
  width:100%; display:flex; justify-content:space-between; align-items:center;
  padding:22px 0; background:none; border:none;
  font-family:var(--serif); font-size:1.15rem; font-weight:400; color:var(--dark);
  text-align:left; cursor:pointer; gap:16px; transition:color .3s;
}
.faq-q:hover { color:var(--rose); }
.faq-icon { font-size:1.15rem; color:var(--rose); flex-shrink:0; transition:transform .4s; font-style:normal; }
.faq-item.open .faq-icon { transform:rotate(45deg); }
.faq-a { height:0; overflow:hidden; }
.faq-a-inner { padding-bottom:22px; color:var(--text); line-height:1.9; font-size:.93rem; }

/* ================================================
   FOOTER
================================================ */
footer {
  background:var(--dark); color:rgba(255,255,255,.65);
  text-align:center; padding:64px 40px 48px;
}
.footer-names { font-family:var(--script); font-size:3.2rem; color:var(--gold-light); margin-bottom:8px; }
.footer-date { font-size:.75rem; letter-spacing:.32em; text-transform:uppercase; margin-bottom:28px; }
.footer-sep { color:var(--gold); margin:0 8px; }
.footer-note { font-size:.75rem; opacity:.4; }

/* ================================================
   RESPONSIVE
================================================ */
@media(max-width:960px){
	.hero-right, .hero-left{margin-top:0px;}
  .nav-links { display:none; }
  .nav-toggle { display:flex; }
  .hero-content { flex-direction:column; padding:0 30px; text-align:center; }
  .hero-divider { margin:14px auto; }
  .countdown-grid { gap:8px; }
  .story-block { grid-template-columns:1fr; }
  .story-block.rev { direction:ltr; }
  .venue-grid, .code-grid, .weather-cards, .transport-grid, .hotel-grid { grid-template-columns:1fr; }
  .timeline::before { left:20px; }
  .tl-item, .tl-item:nth-child(odd) {
    flex-direction:row; padding-left:0; align-items:flex-start;
    padding-left:70px;
  }
  .tl-dot { left:20px; }
  .tl-item:nth-child(odd) .tl-content { text-align:left; padding:0 0 0 20px; }
  .tl-content { padding:0 0 0 20px; }
  .rsvp-wrap { padding:32px 24px; }
  .sw-crawl { width:88%; }
  .venue-map { margin-top:15px; }
}
@media(max-width:750px)
{
	/*.hero-bg {
		background: url('../gfx/heromob.jpg') center/cover no-repeat;
	}*/

	.story-text p.longlong
	{
		width:100%;
	}

	.story-img img 
	{
		height: 280px;
	}

	.story-img-full
	{
		display:none;
	}

	.story-img-full-mob, .story-img-full-tri-mob
	{
		display:block;
	}

	.story-img-full-mob img
	{
		width:50%;
		height:300px;
		float:left;
	}
	.story-img-full-mob img:nth-child(1)
	{
		width:100%;
		height:240px;
	}

	.story-img-full-tri
{
	display:none;
}
	
	.story-img-full-tri-mob img
	{
		width:100%;
		height:auto;
	}
	
	.story-img-full-tri img:nth-child(2)
	{
		width:100%;
		height:250px;

	}

	.story-block 
	{
		gap: 30px;
		margin-bottom:40px;
	}

	.venue-list-box
	{
		height:350px;
	}
}


@media(max-width:600px){
  :root { --section-pad: 72px 0; }
  .container { padding:0 22px; }
  .cd-num { font-size:2rem; }
  .code-grid { grid-template-columns:1fr; }
  .tabs { max-width:100%; }
}


#passwdmsg
{
	color:red;
	padding:10px 0px;
}

#passwdmsg.green
{
	color:black;
	font-size:25px;
	width:90%;
	margin:40px auto;
	text-align:center;
}