:root { --forest:#073c2f; --deep:#052f25; --gold:#c7a04a; --paper:#f7f5ee; --ink:#15352d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; line-height:1.5; }
.site-header { height:108px; display:flex; align-items:center; padding:0 clamp(28px,6vw,112px); background:var(--forest); color:#fff; }
.brand { display:flex; align-items:center; gap:14px; }
.brand-number { display:inline-grid; place-items:center; width:76px; height:64px; border:2px solid currentColor; font:400 2.9rem/1 Georgia,"Times New Roman",serif; }
.brand-name { font:400 1.22rem/1.15 Georgia,"Times New Roman",serif; letter-spacing:.15em; text-transform:uppercase; }
.brand-name b { font-weight:400; letter-spacing:.42em; }
.hero { position:relative; min-height:min(720px,calc(100vh - 108px)); display:flex; align-items:center; overflow:hidden; color:#fff; background:url("assets/585-exterior.png") center/cover no-repeat; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,36,27,.74),rgba(3,36,27,.42) 32%,rgba(3,36,27,.04) 62%); }
.hero-copy { position:relative; width:min(620px,78%); margin-left:clamp(32px,11vw,210px); }
.eyebrow { margin:0 0 18px; font-size:.78rem; font-weight:700; letter-spacing:.23em; text-transform:uppercase; }
.eyebrow span { color:var(--gold); padding:0 8px; }
.hero .eyebrow::after,.gold::after { content:""; display:block; width:82px; margin-top:13px; border-bottom:2px solid var(--gold); }
h1,h2 { margin:0; font-family:Georgia,"Times New Roman",serif; font-weight:400; letter-spacing:-.025em; }
h1 { font-size:clamp(4rem,6.6vw,7rem); line-height:.92; }
.hero-copy>p:last-child { max-width:520px; margin:28px 0 0; font-size:clamp(1rem,1.5vw,1.28rem); }
.highlights { min-height:142px; display:grid; grid-template-columns:repeat(3,1fr); padding:22px clamp(24px,7vw,130px); background:var(--forest); color:#fff; }
.highlight { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border-left:1px solid rgba(199,160,74,.7); }
.highlight:first-child { border-left:0; }
.highlight svg { width:31px; height:31px; fill:none; stroke:var(--gold); stroke-width:1.5; }
.highlight p { margin:8px 0 0; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; }
.highlight b { font-weight:400; }
.building { display:grid; grid-template-columns:1fr 1fr; gap:clamp(42px,7vw,110px); align-items:center; padding:clamp(80px,9vw,150px) clamp(28px,7vw,132px) 54px; }
.gold { color:var(--gold); }
.building h2,.gallery h2,.contact h2 { font-size:clamp(2.5rem,4vw,4.8rem); line-height:1.02; }
.building-copy>p:last-child { max-width:630px; margin:28px 0 0; font-size:clamp(1rem,1.2vw,1.18rem); }
.building-photo { min-height:430px; background:url("assets/585-exterior.png") 72% 55%/auto 120% no-repeat; }
.gallery { padding:40px clamp(28px,7vw,132px) clamp(70px,9vw,135px); }
.gallery h2 { text-align:center; margin-bottom:34px; }
.gallery h2::before { content:""; display:block; width:48px; margin:0 auto 18px; border-top:2px solid var(--gold); }
.gallery-grid { display:grid; grid-template-columns:1fr 1.45fr; gap:18px; height:min(410px,30vw); }
.gallery-photo { min-height:260px; background-image:url("assets/585-exterior.png"); background-repeat:no-repeat; }
.church { background-size:auto 116%; background-position:0 65%; }
.facade { background-size:auto 122%; background-position:80% 55%; }
.contact { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(45px,8vw,135px); align-items:center; padding:clamp(64px,7vw,100px) clamp(28px,9vw,165px); background:var(--forest); color:#fff; }
.contact-heading { padding-right:48px; border-right:1px solid var(--gold); }
.contact h2 { font-size:clamp(2.7rem,4.4vw,5.1rem); }
.contact-details p { display:flex; align-items:center; gap:15px; margin:0 0 12px; }
.contact-details p>span:first-child { width:22px; color:var(--gold); text-align:center; }
.contact a { color:inherit; text-decoration:none; }
.email-button { display:block; width:100%; margin-top:28px; padding:15px 24px; border:1px solid var(--gold); text-align:center; font-size:.78rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; }
.email-button:hover,.email-button:focus-visible { background:var(--gold); color:var(--deep); }
footer { padding:20px; background:var(--deep); color:rgba(255,255,255,.84); text-align:center; font:.78rem Georgia,"Times New Roman",serif; letter-spacing:.04em; }
@media (max-width:700px) {
  .site-header { height:74px; padding:0 17px; }
  .brand { gap:9px; }
  .brand-number { width:55px; height:47px; font-size:2.08rem; }
  .brand-name { font-size:.88rem; }
  .hero { min-height:570px; align-items:flex-start; background-size:auto 100%; background-position:28% center; }
  .hero-shade { background:linear-gradient(90deg,rgba(3,36,27,.58),rgba(3,36,27,.06) 80%); }
  .hero-copy { width:calc(100% - 42px); margin:54px 21px 0; }
  h1 { font-size:clamp(3.15rem,15vw,4.5rem); }
  .hero-copy>p:last-child { max-width:305px; font-size:1rem; }
  .highlights { min-height:108px; padding:14px 5px; }
  .highlight { padding:0 7px; }
  .highlight svg { width:23px; height:23px; }
  .highlight p { font-size:.53rem; letter-spacing:.13em; }
  .building { grid-template-columns:1fr; padding:66px 22px 32px; gap:32px; text-align:center; }
  .building .gold::after { margin-inline:auto; }
  .building h2 { font-size:clamp(2.25rem,11vw,3.3rem); }
  .building-copy>p:last-child { font-size:.95rem; }
  .building-photo { min-height:270px; background-size:auto 108%; background-position:71% 56%; }
  .gallery { padding:38px 14px 58px; }
  .gallery h2 { font-size:2.5rem; margin-bottom:24px; }
  .gallery-grid { grid-template-columns:1fr; height:auto; gap:8px; }
  .gallery-photo { min-height:220px; }
  .church { background-size:auto 110%; background-position:0 66%; }
  .facade { background-size:auto 112%; background-position:73% 55%; }
  .contact { grid-template-columns:1fr; gap:28px; padding:54px 22px 44px; }
  .contact-heading { padding:0; border:0; }
  .contact h2 { font-size:2.75rem; }
  .contact-details { font-size:.9rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
