:root{
  --navy:#14213D; --navy-deep:#0E172B; --navy-line:#2B3A5C;
  --gold:#C9A44C; --gold-ink:#8A6A1F;
  --paper:#F7F4EC; --stone:#ECE6D6;
  --ink:#1E2433; --muted:#4A5266; --on-navy:#D6DAE4;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Source Sans 3',system-ui,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.65}
img,svg{display:block}
a{color:var(--navy)}a:hover{color:var(--gold-ink)}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.15;margin:0;color:var(--navy)}
p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.narrow{max-width:760px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--navy);padding:8px 14px;z-index:2000}
.skip:focus{left:8px}

/* Header */
.site-header{background:var(--navy);color:var(--paper);border-bottom:1px solid var(--navy-line)}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:12px;color:var(--paper);text-decoration:none}
.brand:hover{color:var(--paper)}
.brand span{font-family:var(--serif);font-size:1.45rem;font-weight:600;letter-spacing:.02em}
.nav{display:flex;flex-wrap:wrap;gap:0 22px;font-size:.98rem}
.nav a{color:var(--paper);text-decoration:none;padding:12px 0;border-bottom:2px solid transparent}
.nav a:hover{color:var(--gold)}
.nav a[aria-current="page"]{border-bottom-color:var(--gold)}

/* Type helpers */
.eyebrow{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-bottom:8px}
.on-navy .eyebrow{color:var(--gold)}
.h2{font-size:clamp(2rem,4vw,2.4rem)}
.lead{font-size:1.15rem;color:var(--muted)}
.stack{display:flex;flex-direction:column;gap:16px}

/* Sections */
.section{padding:88px 0}
.section.tint{background:var(--stone)}
.on-navy{background:var(--navy);color:var(--paper)}
.on-navy h1,.on-navy h2,.on-navy h3{color:var(--paper)}
.on-navy .lead,.on-navy p{color:var(--on-navy)}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:start}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.card{background:var(--paper);padding:28px;border-radius:6px;display:flex;flex-direction:column;gap:8px}
.tint .card{background:var(--paper)}
.section:not(.tint) .card{background:#fff;border:1px solid #E3DCC8}
.card h3{font-size:1.6rem}

/* Page hero (inner pages) */
.page-hero{background:var(--navy);color:var(--paper);padding:72px 0 80px}
.page-hero h1{color:var(--paper);font-size:clamp(2.4rem,5vw,3.6rem);margin-bottom:14px}
.page-hero p{color:var(--on-navy);font-size:1.15rem;max-width:640px}
.page-hero .eyebrow{color:var(--gold)}

/* Home hero */
.hero{background:var(--navy);color:var(--paper)}
.hero .wrap{padding-top:96px;padding-bottom:112px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.hero h1{color:var(--paper);font-size:clamp(2.6rem,6vw,4.5rem);line-height:1.08;max-width:820px}
.hero p.sub{max-width:620px;font-size:1.15rem;color:var(--on-navy)}
.hero .tag{font-size:.85rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}

/* Buttons */
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.hero .btns{justify-content:center}
.btn{display:inline-block;font-weight:600;padding:13px 26px;border-radius:4px;text-decoration:none;border:1px solid transparent;font-size:1rem;font-family:var(--sans);cursor:pointer;min-height:48px}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:#D6B562;color:var(--navy)}
.btn-line{border-color:var(--paper);color:var(--paper)}
.btn-line:hover{background:var(--paper);color:var(--navy)}
.btn-navy{background:var(--navy);color:var(--paper)}
.btn-navy:hover{background:#1F3058;color:var(--paper)}

/* Events */
.events{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.event{display:grid;grid-template-columns:96px 1fr;gap:20px;align-items:center;background:#fff;border:1px solid #E3DCC8;border-radius:6px;padding:18px 22px}
.tint .event{border-color:transparent}
.event-date{text-align:center;border-right:1px solid #E3DCC8;padding-right:18px}
.event-date .d{display:block;font-family:var(--serif);font-size:2.4rem;line-height:1;color:var(--navy);font-weight:600}
.event-date .m{display:block;white-space:nowrap;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);font-weight:600;margin-top:4px}
.event h3{font-size:1.45rem}
.event p{color:var(--muted);font-size:.98rem}
.event .badge{display:inline-block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;background:var(--navy);color:var(--gold);padding:3px 8px;border-radius:3px;margin-left:8px;vertical-align:middle;font-family:var(--sans)}
.event.is-past{opacity:.55}
.event.is-past .badge{display:none}
.past-note{font-size:.9rem;color:var(--muted);margin-top:10px}
.next{background:var(--paper);color:var(--ink);border-radius:6px;padding:28px;display:flex;flex-direction:column;gap:6px;border-top:4px solid var(--gold)}
.on-navy .next p{color:var(--muted)}
.on-navy .next .eyebrow{color:var(--gold-ink)}
.on-navy .next .when{color:var(--navy)}
.next .when{font-family:var(--serif);font-size:2rem;color:var(--navy);font-weight:600}

/* Details list */
.facts{margin:0;display:grid;grid-template-columns:max-content 1fr;gap:14px 24px;border-top:2px solid var(--navy);padding-top:24px}
.facts dt{font-weight:600;color:var(--navy)}
.facts dd{margin:0}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.steps li{border-top:1px solid var(--gold);padding-top:16px}
.steps .n{font-family:var(--serif);font-size:2.2rem;color:var(--gold);line-height:1}
.steps h3{font-size:1.4rem;margin:6px 0 4px}
.section:not(.on-navy) .steps .n{color:var(--gold-ink)}

/* FAQ */
.faq{border-top:1px solid #D9D1BC}
.faq details{border-bottom:1px solid #D9D1BC}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-family:var(--serif);font-size:1.4rem;font-weight:600;color:var(--navy);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:16px;font-family:var(--sans);font-size:1.6rem;color:var(--gold-ink)}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 20px;color:var(--muted)}

/* Form */
.form{display:grid;gap:18px;background:#fff;border:1px solid #E3DCC8;border-radius:6px;padding:28px}
.form .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:600;color:var(--navy);font-size:.95rem}
.form input,.form textarea{font:inherit;font-weight:400;color:var(--ink);padding:12px 14px;border:1px solid #B9B09A;border-radius:4px;background:#fff;min-height:48px}
.form input:focus,.form textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--navy)}
.form textarea{min-height:120px;resize:vertical}
.form .hint{font-size:.88rem;color:var(--muted)}

/* Placeholder marker — delete once real content is in */
.todo{background:#FFF3C4;outline:1px dashed #B8923A;padding:0 4px}

/* Stat */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px}
.stat{border-top:1px solid var(--gold);padding-top:14px}
.stat .v{font-family:var(--serif);font-size:2.6rem;color:var(--paper);font-weight:600;line-height:1.1}
.stat .l{color:var(--on-navy);font-size:.95rem}

/* Photos */
.split.center{align-items:center}
figure{margin:0}
.frame{background:#fff;padding:8px;border:1px solid var(--gold);border-radius:4px}
.on-navy .frame{background:var(--navy-deep)}
.frame img,.card-img img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:2px}
.stack .frame{margin-top:8px}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.photo-card{padding:0;overflow:hidden}
.photo-card>:not(.card-img){padding:0 24px}
.photo-card>.card-img{margin-bottom:12px;border-bottom:3px solid var(--gold)}
.photo-card>:last-child{padding-bottom:24px}
.photo-card .eyebrow{margin-bottom:0}

/* Gallery */
.gallery{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:16px}
.g-item{display:block;position:relative;border-radius:4px;overflow:hidden;background:var(--navy);text-decoration:none}
.g-item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .5s ease,opacity .3s}
.g-item:hover img,.g-item:focus-visible img{transform:scale(1.04);opacity:.85}
.g-item:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.g-cap{position:absolute;left:0;right:0;bottom:0;padding:28px 14px 10px;background:linear-gradient(transparent,rgba(14,23,43,.85));color:var(--paper);font-size:.9rem}
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;margin:0}
.lightbox::backdrop{background:rgba(14,23,43,.94)}
.lightbox[open]{display:flex;align-items:center;justify-content:center}
.lightbox figure{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:min(92vw,1400px);padding:0 56px}
.lightbox img{max-width:100%;max-height:80vh;width:auto;height:auto;border:1px solid var(--gold);border-radius:2px}
.lightbox figcaption{color:var(--paper);font-family:var(--serif);font-size:1.3rem;text-align:center}
.lb-btn{position:fixed;background:transparent;border:1px solid rgba(201,164,76,.6);color:var(--gold);width:48px;height:48px;border-radius:50%;font-size:1.8rem;line-height:1;cursor:pointer}
.lb-btn:hover{background:var(--gold);color:var(--navy)}
.lb-close{top:16px;right:16px}
.lb-prev{left:12px;top:50%;transform:translateY(-50%)}
.lb-next{right:12px;top:50%;transform:translateY(-50%)}
@media (max-width:560px){.lightbox figure{padding:0 8px}.lb-prev,.lb-next{top:auto;bottom:16px;transform:none}}

/* Footer */
.site-footer{background:var(--navy-deep);color:#C3C9D6;padding:48px 0 40px;font-size:.92rem}
.site-footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.site-footer h2{font-family:var(--serif);color:var(--paper);font-size:1.3rem;margin-bottom:10px}
.site-footer a{color:#C3C9D6}
.site-footer a:hover{color:var(--gold)}
.site-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.site-footer .legal{grid-column:1/-1;border-top:1px solid var(--navy-line);padding-top:20px;color:#9AA3B5}

/* Opening scene (home only) */
.intro{position:fixed;inset:0;z-index:1000;pointer-events:none;animation:introGone 0s linear 4.4s forwards}
@keyframes introGone{to{visibility:hidden}}
.door{position:absolute;top:0;bottom:0;width:50%;background:var(--navy);animation:1.3s cubic-bezier(.7,0,.3,1) 3s forwards}
.door-l{left:0;border-right:1px solid var(--gold);animation-name:doorL}
.door-r{right:0;border-left:1px solid var(--gold);animation-name:doorR}
.door-frame{position:absolute;inset:28px;border:1px solid rgba(201,164,76,.35)}
@keyframes doorL{to{transform:translateX(-101%)}}
@keyframes doorR{to{transform:translateX(101%)}}
.intro-mark{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px;animation:introFade .5s ease 2.7s forwards}
.draw{stroke-dasharray:120;stroke-dashoffset:120;animation:draw 1.2s ease-out forwards}
.d1{animation-delay:.3s}.d2{animation-delay:.9s}
@keyframes draw{to{stroke-dashoffset:0}}
.intro-name{font-family:var(--serif);font-size:2.4rem;font-weight:600;color:var(--paper);letter-spacing:.04em;opacity:0;animation:rise .8s ease 1.6s forwards}
.intro-sub{font-size:.8rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);opacity:0;animation:rise .8s ease 1.9s forwards}
.hero-rise{opacity:0;animation:rise .9s ease 3.6s forwards}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes introFade{to{opacity:0}}
/* Seen it already this visit, or prefers less motion: skip the opening */
.seen .intro{display:none}
.seen .hero-rise{opacity:1;animation:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .intro{display:none}
  .hero-rise{opacity:1;animation:none}
}

@media (max-width:560px){
  .section{padding:64px 0}
  .event{grid-template-columns:72px 1fr;gap:14px;padding:16px}
  .event-date{padding-right:12px}
  .event-date .d{font-size:2rem}
  .facts{grid-template-columns:1fr;gap:4px}
  .facts dd{margin-bottom:12px}
}
