:root{--navy:#14304d;--gold:#b8863f;--gold-light:#ecdfc2;--cream:#f8f5ee;--ink:#211d17;--muted:#6b6258;
--gutter:max(56px,calc((100% - 1128px)/2));--serif:'Source Serif 4',Georgia,serif;--sans:'Public Sans',system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.5}
img{max-width:100%}
h1,h2,h3{font-family:var(--serif);margin:0}
h2{color:var(--navy);text-align:center}

.btn{display:inline-block;text-decoration:none;border:0;border-radius:999px;font:700 15px var(--sans);cursor:pointer}
.btn--white{background:#fff;color:var(--navy);padding:10px 22px;font-size:14px}
.btn--gold{background:var(--gold);color:#fff;padding:15px 30px}
.btn--navy{background:var(--navy);color:#fff;padding:14px;font-size:14px}
.btn:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

.topbar{position:absolute;inset:0 0 auto 0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:22px var(--gutter)}
.logo img{display:block;border-radius:50%}

.hero{background:var(--navy)}
.hero__inner{display:grid;grid-template-columns:1.2fr 1fr;min-height:560px;max-width:1240px;margin:0 auto}
.hero__text{background:var(--navy);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:22px;padding:96px 56px 48px}
.hero h1{font-size:clamp(34px,4.5vw,56px);line-height:1.08;font-weight:700;color:#fff}
.hero h1 span{color:var(--gold-light)}
.hero p{margin:0;max-width:420px;font-size:16px;color:rgba(255,255,255,.75)}
.hero__photo{position:relative;overflow:hidden;min-height:360px}
.hero__photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.hero__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy) 0%,rgba(20,48,77,0) 22%,rgba(20,48,77,0) 92%,var(--navy) 100%)}
.hero__caption{position:absolute;z-index:1;right:24px;bottom:24px;background:rgba(20,48,77,.75);color:#fff;font-size:12.5px;padding:8px 14px;border-radius:999px}

.quote{background:var(--gold-light);text-align:center;padding:56px 24px}
.quote blockquote{margin:0 auto 22px;max-width:760px;font:400 26px/1.5 var(--serif);color:var(--navy)}
.quote p{margin:0;font-size:13px;font-style:italic;color:#8a7245}

.build{background:#fff;padding:64px var(--gutter)}
.build h2{font-size:26px;margin-bottom:32px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1128px;margin:0 auto}
.card{aspect-ratio:1;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center}
.card--blue{background:repeating-linear-gradient(135deg,#dde3ea,#dde3ea 12px,#eaeef2 12px,#eaeef2 24px)}
.card--sand{background:repeating-linear-gradient(135deg,#e6e0d2,#e6e0d2 12px,#f0ebe0 12px,#f0ebe0 24px)}
.card__dot{width:44px;height:44px;border-radius:50%}
.card__dot--navy{background:var(--navy)}.card__dot--gold{background:var(--gold)}
.card h3{font-size:18px;color:var(--navy)}
.card p{margin:0;font-size:13px;color:var(--muted)}

.moments{padding:56px var(--gutter)}
.moments h2{font-size:22px;margin-bottom:6px}
.moments__lead{text-align:center;font-size:13.5px;color:var(--muted);margin:0 0 28px}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1128px;margin:0 auto}
.gallery img,.ph{aspect-ratio:4/3;border-radius:8px;width:100%;object-fit:cover}
.ph{display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,#ddd4bd,#ddd4bd 12px,#e9e1cd 12px,#e9e1cd 24px)}
.ph span{font:11px ui-monospace,monospace;color:#8a7d5c;text-transform:uppercase}

.plan{background:#fff;padding:56px var(--gutter)}
.plan h2{font-size:22px;margin-bottom:36px}
.timeline{list-style:none;margin:0 auto;padding:0 20px;max-width:1128px;display:flex;justify-content:space-between;position:relative}
.timeline::before,.timeline::after{content:"";position:absolute;top:6px;left:20px;height:3px;border-radius:2px;background:var(--gold-light);right:20px}
.timeline::after{background:var(--gold);right:auto;width:calc((100% - 840px) * .78)}
.timeline li{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;gap:8px}
.timeline i{width:14px;height:14px;border-radius:50%;background:var(--gold-light);border:2px solid var(--gold)}
.timeline .done i{background:var(--gold)}
.timeline b{font-size:13px;color:var(--navy)}
.timeline span{font-size:12px;color:var(--muted);text-align:center}
.timeline .strong{font-weight:600}

.join{padding:64px 24px;text-align:center;background:repeating-linear-gradient(135deg,#0f2439,#0f2439 14px,#173352 14px,#173352 28px)}
.join__box{background:#fff;border-radius:14px;padding:44px;max-width:480px;margin:0 auto}
.join h2{font-size:25px;margin-bottom:8px}
.join p{margin:0 0 24px;font-size:14px;color:var(--muted)}
.join form{display:flex;flex-direction:column;gap:10px}
.join input{padding:13px 14px;border-radius:999px;border:1px solid rgba(20,48,77,.2);font:14px var(--sans)}
.join__thanks{color:var(--navy);font-weight:700;font-size:14px}

.footer{display:flex;justify-content:center;align-items:center;gap:12px;padding:26px var(--gutter);font-size:13px;color:var(--muted)}
.footer img{border-radius:50%}

@media (max-width:900px){
  .topbar{padding:16px 20px}
  .hero__inner{grid-template-columns:1fr}
  .hero__text{padding:96px 24px 40px}
  .hero__photo{min-height:0;aspect-ratio:4/5}
  .hero__photo::after{background:linear-gradient(180deg,var(--navy) 0%,rgba(20,48,77,0) 18%)}
  .build,.moments,.plan{padding:44px 20px}
  :root{--gutter:20px}
  .cards,.gallery{grid-template-columns:1fr}
  .card{aspect-ratio:auto;padding:32px 24px}
  .quote blockquote{font-size:21px}
  .timeline{flex-direction:column;gap:22px;padding:0 0 0 20px;align-items:flex-start}
  .timeline::before,.timeline::after{top:6px;bottom:6px;left:26px;right:auto;width:3px;height:auto}
  .timeline::after{width:3px;height:calc((100% - 12px) * .78)}
  .timeline li{flex-direction:row;gap:14px;align-items:center;flex:none}
  .join__box{padding:32px 22px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
