:root{
  --navy:#13294b; --navy-2:#0c1c36; --red:#b3202f; --red-dk:#8f1824;
  --cream:#fbf7ef; --ink:#1b2433; --muted:#4a5568; --line:#d9d2c3; --white:#fff;
  --head:"Oswald","DIN Condensed","Arial Narrow",sans-serif;
  --body:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--cream);color:var(--ink);font:18px/1.55 var(--body);-webkit-text-size-adjust:100%}
img{max-width:100%;display:block}
a{color:var(--navy)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #f2b705;outline-offset:2px}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.narrow{max-width:560px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 12px;z-index:10}
.skip:focus{left:8px;top:8px}
.draft{background:#f2b705;color:#1b1b1b;text-align:center;font:600 14px/1.3 var(--body);padding:8px 16px}

.top{background:var(--navy);}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;padding-bottom:10px}
.logo-tpt{height:30px;width:auto}
.logo-era{height:40px;width:auto}

.hero{position:relative;color:#fff;min-height:min(88vh,820px);min-height:min(88svh,820px);display:flex;align-items:flex-end;overflow:hidden;background:var(--navy-2)}
.hero picture,.hero-img{position:absolute;inset:0;width:100%;height:100%}
.hero-img{object-fit:cover;object-position:50% 70%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,28,54,.15) 0%,rgba(12,28,54,.35) 35%,rgba(12,28,54,.88) 75%,rgba(12,28,54,.96) 100%)}
.hero-in{position:relative;padding-top:48px;padding-bottom:36px;width:100%}
.eyebrow{margin:0 0 6px;font:600 15px/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:#ffd6d9}
.eyebrow span{color:#fff;letter-spacing:.3em;margin-right:6px}
h1{font:600 clamp(48px,13vw,104px)/.95 var(--head);margin:0 0 14px;text-transform:uppercase;letter-spacing:.01em;text-shadow:0 2px 18px rgba(0,0,0,.35)}
h1 span{color:#ff4d5a;display:inline-block}
.when{font-size:21px;line-height:1.35;margin:0 0 10px}
.when strong{font:600 26px/1.2 var(--head);letter-spacing:.02em;text-transform:uppercase}
.lede{max-width:560px;margin:0 0 18px;color:#e9eef6}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 26px;border-radius:999px;font:600 18px/1 var(--body);text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-dk)}
.btn-ghost{border-color:#fff;color:#fff;background:rgba(255,255,255,.06)}
.btn-ghost:hover{background:rgba(255,255,255,.18)}
.btn-wide{width:100%}
.hosted{margin:0;font-size:15px;color:#d5deea}

.details{padding:48px 0 36px}
h2{font:600 34px/1.1 var(--head);text-transform:uppercase;color:var(--navy);margin:0 0 18px;letter-spacing:.02em}
h2::after{content:"";display:block;width:56px;height:4px;background:var(--red);margin-top:10px;border-radius:2px}
.cards{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:1fr}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 18px 12px;border-top:5px solid var(--navy)}
.card-flag{border-top-color:var(--red)}
.card h3{font:600 20px/1.2 var(--head);text-transform:uppercase;letter-spacing:.04em;margin:0 0 6px;color:var(--navy)}
.card p{margin:0 0 8px}
.link{font-weight:600}
.pending{background:#fff3c4;border:1px dashed #b8860b;padding:0 4px;border-radius:4px}
.who{margin:18px 0 0;font-size:19px}

.photo-band img{width:100%;height:220px;object-fit:cover}

.rsvp{padding:44px 0 48px;background:#fff;border-top:1px solid var(--line)}
.sub{margin:-4px 0 18px;color:var(--muted)}
.field{margin:0 0 16px}
label{display:block;font-weight:600;margin:0 0 6px}
.req,.opt{font-weight:400;color:var(--muted);font-size:15px}
input[type=text],input[type=tel],input[type=email],select{width:100%;min-height:50px;padding:10px 12px;font:18px var(--body);color:var(--ink);background:#fff;border:2px solid #b9b2a3;border-radius:10px}
select{appearance:none;-webkit-appearance:none;padding-right:44px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%2313294b' stroke-width='2.2'/%3E%3C/svg%3E") no-repeat right 16px center}
a[href^="tel:"]{white-space:nowrap}
input[aria-invalid=true],select[aria-invalid=true]{border-color:var(--red)}
.check{display:flex;gap:10px;align-items:flex-start}
.check input{width:24px;height:24px;margin:2px 0 0;flex:none;accent-color:var(--navy)}
.check label{font-weight:400;margin:0}
.err{color:var(--red);margin:6px 0 0;font-size:15px;font-weight:600}
.use{font-size:15px;color:var(--muted);margin:4px 0 16px}
.form-msg{min-height:1.5em;margin:12px 0 0;font-weight:600}
.form-msg.bad{color:var(--red)}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.contact{font-size:16px;color:var(--muted);margin-top:22px}

.foot{background:var(--navy-2);color:#d5deea;padding:32px 0 40px;font-size:15px}
.foot a{color:#fff}
.foot-logos{display:flex;gap:18px;align-items:center;margin-bottom:14px}
.foot-logos img:first-child{height:26px;width:auto}
.foot-logos img:last-child{height:36px;width:auto}
.eho{display:flex;gap:12px;align-items:flex-start}
.eho-icon{width:38px;height:38px;flex:none;color:#fff}
.small{font-size:13px;color:#aab6c8}

@media (min-width:720px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .hero{min-height:640px}
  .hero-in{padding-bottom:56px}
  .logo-tpt{height:36px}.logo-era{height:48px}
  .photo-band img{height:320px}
}
@media (min-width:1000px){
  .cards{grid-template-columns:repeat(4,1fr)}
}