:root { --ink:#211610; --ink-deep:#140D09; --ivory:#F7F1E8; --cream:#F2E9DC; --gold:#C9A063; --line:rgba(201,160,99,.28); --pad:max(22px, calc((100% - 1280px)/2 + 22px)); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--ink); color:var(--cream); font-family:'Jost',system-ui,sans-serif; font-weight:300; font-size:17px; line-height:1.8; text-wrap:pretty; -webkit-font-smoothing:antialiased; }
img, video { max-width:100%; display:block; }
a { color:var(--gold); text-decoration:none; }
a:hover { color:#E2C08A; }
::selection { background:var(--gold); color:var(--ink); }
:focus-visible { outline:1px solid var(--gold); outline-offset:3px; }

.wordmark { font-family:'Marcellus',serif; font-size:30px; line-height:1; letter-spacing:.2em; color:var(--ivory); white-space:nowrap; }
.hdr > a:first-child { display:inline-flex; align-items:center; min-height:44px; }
.hdr { position:sticky; top:0; z-index:60; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px var(--pad); background:rgba(20,13,9,.88); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.navlinks { display:flex; align-items:center; gap:30px; }
.navlink { font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:rgba(242,233,220,.75); min-height:44px; display:flex; align-items:center; }
.navlink.on, .navlink:hover { color:var(--gold); }
.lang { display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.18em; text-transform:uppercase; }
.lang a { color:rgba(242,233,220,.6); display:inline-flex; align-items:center; min-height:44px; padding:0 6px; }
.lang a.on { color:var(--gold); }
.burger { display:none; width:46px; height:46px; align-items:center; justify-content:center; background:none; border:1px solid rgba(247,241,232,.3); border-radius:999px; cursor:pointer; }
.burger span { display:block; width:18px; height:1px; background:var(--ivory); position:relative; }
.burger span::before, .burger span::after { content:""; position:absolute; left:0; width:18px; height:1px; background:var(--ivory); }
.burger span::before { top:-6px; } .burger span::after { top:6px; }
.drawer { position:fixed; inset:0; z-index:70; background:rgba(20,13,9,.97); display:flex; flex-direction:column; padding:80px 24px 32px; gap:6px; }
.drawer a { font-family:'Marcellus',serif; font-size:26px; color:var(--ivory); padding:14px 0; min-height:44px; }
.drawer .close { position:absolute; top:18px; right:20px; width:46px; height:46px; border:1px solid rgba(247,241,232,.3); border-radius:999px; background:none; color:var(--ivory); font-size:20px; cursor:pointer; }

.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:14px 30px; border-radius:999px; font-size:12px; letter-spacing:.2em; text-transform:uppercase; white-space:nowrap; }
.btn-gold { background:var(--gold); color:var(--ink); }
.btn-gold:hover { background:#E2C08A; color:var(--ink); }
.btn-ghost { border:1px solid rgba(247,241,232,.36); color:var(--ivory); }
.btn-ghost:hover { color:var(--ivory); border-color:var(--ivory); }
.btn-dark { background:var(--ink); color:var(--ivory); }
.btn-dark:hover { color:var(--ivory); }
.btn-outline-dark { border:1px solid rgba(33,22,16,.32); color:var(--ink); }
.btn-outline-dark:hover { color:var(--ink); }
.btnrow { display:flex; flex-wrap:wrap; gap:14px; }

section { padding:clamp(64px,10vh,140px) var(--pad); }
.kicker { margin:0 0 24px; font-size:11px; letter-spacing:.36em; text-transform:uppercase; color:var(--gold); }
h1.page { font-family:'Marcellus',serif; font-weight:400; font-size:clamp(30px,4.4vw,62px); line-height:1.16; margin:0; color:var(--ivory); }
h2 { font-family:'Marcellus',serif; font-weight:400; font-size:clamp(27px,3.2vw,46px); line-height:1.2; margin:0; color:var(--ivory); }
h3 { font-family:'Marcellus',serif; font-weight:400; margin:0; color:var(--ivory); }
p { margin:0; }
.body { font-size:17px; line-height:1.9; color:rgba(242,233,220,.78); max-width:62ch; }
.two { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px clamp(32px,6vw,110px); align-items:start; }
.pill { display:inline-flex; align-items:center; min-height:40px; padding:8px 18px; border:1px solid rgba(201,160,99,.4); border-radius:999px; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:rgba(242,233,220,.8); }

.light { background:var(--ivory); color:var(--ink); }
.light .kicker { color:#96683A; }
.light h1.page, .light h2, .light h3 { color:var(--ink); }
.light .body { color:rgba(33,22,16,.76); }
.facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:28px; margin-top:56px; padding-top:36px; border-top:1px solid rgba(33,22,16,.16); }
.facts .lbl { font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:rgba(33,22,16,.55); }
.facts .val { font-family:'Marcellus',serif; font-size:21px; margin-top:8px; }

footer { padding:clamp(48px,7vh,96px) var(--pad) 40px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:36px; align-items:start; font-size:15px; line-height:1.9; }
footer .lbl { font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:rgba(242,233,220,.5); margin-bottom:12px; }
footer .muted { color:rgba(242,233,220,.6); }

.stickycta { display:none; }

.gal-main picture { width:100%; height:auto; aspect-ratio:3/2; }
.gal-thumbs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:14px; }
.gal-thumbs picture { width:100%; height:auto; aspect-ratio:4/3; }
.lightbox { position:fixed; inset:0; z-index:80; background:rgba(20,13,9,.97); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; padding:72px 20px 24px; }
.lb-stage { width:min(1100px,100%); flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center; }
.lb-figure { margin:0; width:100%; max-height:100%; display:flex; flex-direction:column; min-height:0; }
.lb-figure picture { display:block; width:100%; height:auto; max-height:100%; aspect-ratio:3/2; min-height:0; flex:1 1 auto; }
.lb-figure img { width:100%; height:100%; max-height:100%; object-fit:contain; display:block; }
.lb-figure figcaption { flex:none; margin-top:14px; font-size:14px; color:rgba(242,233,220,.6); text-align:center; }
.lb-bar { flex:none; display:flex; align-items:center; gap:20px; }
.lb-nav { width:48px; height:48px; border:1px solid rgba(247,241,232,.3); border-radius:999px; background:none; color:var(--ivory); font-size:17px; cursor:pointer; }
.lb-nav:hover { border-color:var(--gold); color:var(--gold); }
.lb-count { font-size:12px; letter-spacing:.2em; color:rgba(242,233,220,.7); min-width:64px; text-align:center; }
.lightbox .close { position:fixed; top:18px; right:20px; width:48px; height:48px; border:1px solid rgba(247,241,232,.3); border-radius:999px; background:none; color:var(--ivory); font-size:20px; cursor:pointer; }

.amen { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:26px 32px; }
.amen .item { display:flex; gap:14px; align-items:flex-start; }
.amen svg { flex:none; width:22px; height:22px; stroke:var(--gold); stroke-width:1.6; fill:none; margin-top:3px; }
.amen .t { font-size:16px; color:rgba(242,233,220,.86); }

@media (max-width:1100px) {
  .hdr .btn-gold { display:none; }
}
@media (max-width:960px) {
  .navlinks { gap:20px; }
}
@media (max-width:768px) {
  :root { --pad:20px; }
  .wordmark { font-size:22px; letter-spacing:.18em; }
  .navlinks { display:none; }
  .burger { display:flex; }
  .two, footer { grid-template-columns:1fr; }
  .body { font-size:16px; }
  .btnrow { flex-direction:column; align-items:stretch; }
  .btn { width:100%; }
  .gal-thumbs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lb-figure picture { aspect-ratio:4/3; }
  body { padding-bottom:72px; }
  .stickycta { display:block; position:fixed; left:0; right:0; bottom:0; z-index:65; padding:12px 20px; background:rgba(20,13,9,.94); backdrop-filter:blur(12px); border-top:1px solid var(--line); }
  .stickycta .btn { width:100%; }
  footer p a { display:inline-block; padding:7px 0; }
  .route .row, .faq summary { min-height:48px; }
}
@media (max-width:480px) {
  .wordmark { font-size:19px; }
  h1.page { font-size:29px; }
  h2 { font-size:25px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }


/* ---- production additions ---- */
[hidden] { display:none !important; }
.hdr-overlay { position:fixed; top:0; left:0; right:0; background:transparent; backdrop-filter:none; border-bottom-color:transparent; transition:background .35s, border-color .35s; }
.hdr-overlay.scrolled { background:rgba(20,13,9,.88); backdrop-filter:blur(14px); border-bottom-color:var(--line); }
.lb-trigger { display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in; color:inherit; }
.lb-trigger:hover picture { opacity:.9; }
.lb-trigger picture { transition:opacity .25s; }

/* ---- header brand ---- */
.brand { display:flex; flex-direction:column; gap:6px; line-height:1; }
.brand-name { font-family:'Marcellus',serif; font-size:27px; letter-spacing:.2em; color:var(--ivory); white-space:nowrap; }
.brand-sub { font-size:9px; letter-spacing:.34em; text-transform:uppercase; color:rgba(201,160,99,.85); white-space:nowrap; }
.hdr { align-items:center; }
.hdr > a:first-child { min-height:52px; }
footer .brand-name { font-size:19px; }
footer .brand-sub { font-size:8px; letter-spacing:.3em; }
@media (max-width:768px) {
  .brand { gap:5px; }
  .brand-name { font-size:20px; letter-spacing:.17em; }
  .brand-sub { font-size:7.5px; letter-spacing:.26em; }
}
@media (max-width:480px) {
  .brand-name { font-size:18px; }
  .brand-sub { font-size:7px; letter-spacing:.22em; }
}

/* ---- mobile framing: photos whose composition/logo must stay whole ---- */
@media (max-width:768px) {
  picture.uncrop { aspect-ratio:auto !important; height:auto !important; max-width:100% !important; }
  picture.uncrop img { width:100% !important; height:auto !important; object-fit:contain !important; object-position:center !important; }
  picture.wide-relax { aspect-ratio:4/3 !important; }
  picture.tall-relax { aspect-ratio:16/10 !important; }
  picture.card-portrait { aspect-ratio:3/4 !important; }
}

@media (max-width:768px) {
  .gal-main picture { aspect-ratio:4/5 !important; }
  .gal-thumbs picture { aspect-ratio:1/1 !important; }
}
