:root{
  --navy:#111d2b;
  --navy-2:#1a2a3d;
  --cream:#f4ead7;
  --paper:#fbf7ef;
  --tan:#b9926e;
  --muted:#776f65;
  --ink:#1d1d1b;
  --line:rgba(17,29,43,.15);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);line-height:1.65}
a{color:inherit}
img{max-width:100%;display:block}
.shell{width:min(var(--max),calc(100% - 40px));margin:0 auto}
.topbar{background:var(--navy);color:var(--cream);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.12)}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{text-decoration:none;display:flex;flex-direction:column;line-height:1}
.brand strong{font-family:Georgia,'Times New Roman',serif;font-size:22px;letter-spacing:.02em;font-weight:600}
.brand span{font-size:10px;text-transform:uppercase;letter-spacing:.28em;color:var(--tan);margin-top:8px}
.navlinks{display:flex;align-items:center;gap:28px}
.navlinks a{text-decoration:none;font-size:13px;letter-spacing:.06em}
.navlinks a:hover{color:var(--tan)}
.nav-cta{border:1px solid var(--tan);padding:10px 15px}
.menu{display:none;background:none;border:0;color:var(--cream);font-size:28px}
.hero{background:linear-gradient(120deg,rgba(17,29,43,.98),rgba(17,29,43,.89)),radial-gradient(circle at 78% 30%,rgba(185,146,110,.3),transparent 32%);color:var(--cream);padding:108px 0 96px}
.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--tan);font-weight:700;margin-bottom:18px}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;line-height:1.08;margin-top:0}
h1{font-size:clamp(48px,7vw,86px);max-width:900px;margin-bottom:26px;font-weight:500}
h2{font-size:clamp(34px,5vw,58px);font-weight:500;margin-bottom:22px}
h3{font-size:25px;font-weight:500;margin-bottom:10px}
.hero p{font-size:clamp(18px,2vw,23px);max-width:720px;color:rgba(244,234,215,.82);margin:0 0 34px}
.actions{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;text-decoration:none;padding:14px 19px;border:1px solid var(--tan);font-size:13px;font-weight:700;letter-spacing:.05em}
.btn.primary{background:var(--tan);color:var(--navy)}
.btn.light{color:var(--cream)}
.btn.dark{color:var(--navy)}
.section{padding:86px 0}
.section.navy{background:var(--navy);color:var(--cream)}
.section.cream{background:var(--cream)}
.section.white{background:#fff}
.lead{font-size:20px;max-width:780px;color:var(--muted)}
.navy .lead{color:rgba(244,234,215,.75)}
.grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:start}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cards{margin-top:40px}
.card{background:#fff;padding:30px;border:1px solid var(--line);min-height:240px}
.navy .card{background:var(--navy-2);border-color:rgba(255,255,255,.1)}
.card p{color:var(--muted)}
.navy .card p{color:rgba(244,234,215,.7)}
.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--tan);font-weight:700}
.rule{width:52px;height:2px;background:var(--tan);margin:25px 0}
.statement{font-family:Georgia,'Times New Roman',serif;font-size:clamp(31px,4.8vw,56px);line-height:1.13;max-width:960px}
.list{display:grid;gap:0;border-top:1px solid var(--line);margin-top:28px}
.list-row{display:grid;grid-template-columns:260px 1fr;gap:28px;padding:25px 0;border-bottom:1px solid var(--line)}
.list-row strong{font-family:Georgia,'Times New Roman',serif;font-size:21px;font-weight:500}
.meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.meta span{border:1px solid rgba(185,146,110,.45);padding:10px 13px;font-size:12px;letter-spacing:.05em}
.quote{font-family:Georgia,'Times New Roman',serif;font-size:31px;line-height:1.3;border-left:3px solid var(--tan);padding-left:25px}
.subhero{background:var(--navy);color:var(--cream);padding:76px 0 64px}
.subhero h1{font-size:clamp(44px,6vw,72px);margin-bottom:16px}
.subhero p{max-width:720px;font-size:19px;color:rgba(244,234,215,.77)}
.table{border-top:1px solid var(--line);margin-top:30px}
.table-row{display:grid;grid-template-columns:1fr 2fr;gap:30px;padding:24px 0;border-bottom:1px solid var(--line)}
.table-row b{font-family:Georgia,'Times New Roman',serif;font-size:20px;font-weight:500}
.cta{background:var(--tan);color:var(--navy);padding:58px 0}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:35px}
.cta h2{font-size:38px;margin:0 0 8px}
.cta p{margin:0;max-width:650px}
.contact-card{background:#fff;border:1px solid var(--line);padding:34px}
.contact-card a{font-family:Georgia,'Times New Roman',serif;font-size:25px;text-decoration:none;display:block;margin:9px 0}
.small{font-size:13px;color:var(--muted)}
footer{background:#0d1722;color:rgba(244,234,215,.58);padding:42px 0}
.footer-grid{display:flex;justify-content:space-between;gap:30px;align-items:flex-end}
footer a{color:rgba(244,234,215,.75);text-decoration:none}
footer .brand strong{color:var(--cream)}
@media(max-width:850px){
 .navlinks{display:none;position:absolute;top:76px;left:0;right:0;background:var(--navy);padding:20px;flex-direction:column;align-items:flex-start;border-top:1px solid rgba(255,255,255,.1)}
 .navlinks.open{display:flex}.menu{display:block}.grid-2,.grid-3{grid-template-columns:1fr}.list-row,.table-row{grid-template-columns:1fr;gap:8px}.cta-inner,.footer-grid{align-items:flex-start;flex-direction:column}.hero{padding:78px 0 72px}.section{padding:64px 0}
}

/* image-ready sections */
.photo-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;margin-top:38px}
.photo-stack{display:grid;gap:22px}
.photo-placeholder{margin:0;min-height:250px;border:1px solid rgba(185,146,110,.35);background:linear-gradient(135deg,rgba(17,29,43,.06),rgba(185,146,110,.14));display:flex;align-items:flex-end;padding:18px;position:relative;overflow:hidden}
.photo-placeholder.tall{min-height:522px}
.photo-placeholder.wide{min-height:360px}
.photo-placeholder::before{content:'PHOTO';position:absolute;top:18px;left:18px;font-size:10px;letter-spacing:.22em;font-weight:700;color:var(--tan)}
.photo-placeholder figcaption{font-size:13px;color:var(--muted);max-width:36ch}
.navy .photo-placeholder{background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(185,146,110,.10));border-color:rgba(185,146,110,.35)}
.navy .photo-placeholder figcaption{color:rgba(244,234,215,.65)}
@media(max-width:850px){.photo-grid{grid-template-columns:1fr}.photo-placeholder.tall{min-height:360px}}

/* --- brand lockup --- */
.brand{align-items:flex-start;gap:9px}
.brand-mark{height:44px;width:auto;display:block}
.brand-tagline{height:11px;width:auto;display:block;opacity:.92}
.footer-brand .brand-mark{height:52px}
.footer-brand span{font-size:10px;text-transform:uppercase;letter-spacing:.24em;color:var(--tan);margin-top:10px}
@media(max-width:720px){.brand-mark{height:36px}.brand-tagline{height:9px}}

/* --- photographs --- */
figure.photo{margin:0;overflow:hidden;border-radius:2px;background:#0d1620}
figure.photo img{width:100%;height:100%;object-fit:cover;display:block}
figure.photo.tall img{aspect-ratio:3/4}
figure.photo figcaption{font-size:12px;letter-spacing:.02em;color:rgba(244,234,215,.5);padding:10px 2px 0}
.section.white figure.photo figcaption{color:#6B6257}
.hero{position:relative;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block}
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(17,29,43,.94) 0%,rgba(17,29,43,.82) 46%,rgba(17,29,43,.55) 100%)}
.hero .shell{position:relative;z-index:1}

/* brand sizing refinements */
.brand-mark{height:56px}
.footer-brand .brand-mark{height:64px}
.hero-tagline{height:26px;width:auto;display:block;margin:0 0 26px;opacity:.95}
@media(max-width:720px){.brand-mark{height:44px}.hero-tagline{height:19px;margin-bottom:20px}}

/* tagline sits in a padded viewBox, so it needs more height to read */
.hero-tagline{height:52px;margin:0 0 18px}
@media(max-width:720px){.hero-tagline{height:38px}}
.hero-media::after{background:linear-gradient(100deg,rgba(17,29,43,.90) 0%,rgba(17,29,43,.72) 48%,rgba(17,29,43,.42) 100%)}

/* full-bleed photo band */
.band-photo{position:relative;line-height:0}
.band-photo img{width:100%;height:auto;max-height:clamp(300px,52vh,520px);object-fit:cover;object-position:center 42%;display:block}
.band-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(17,29,43,.30) 0%,rgba(17,29,43,.06) 40%,rgba(17,29,43,.62) 100%)}
.band-photo-cap{position:absolute;left:0;right:0;bottom:clamp(22px,4vw,40px);text-align:center;z-index:1}
.band-photo-cap img{height:clamp(26px,4.6vw,50px);width:auto;display:inline-block;opacity:.96}

/* person lockup: portrait beside the name, matching the site's rectangles */
.person{display:flex;align-items:flex-start;gap:22px}
.person-photo{width:152px;height:190px;object-fit:cover;flex:0 0 auto;
  border-radius:2px;display:block}
.person-id h2{margin:0 0 8px}
.person-id .lead{margin:0}
@media(max-width:560px){.person{gap:16px}.person-photo{width:104px;height:130px}}

/* ---------- mobile spacing and overflow fixes ---------- */
@media(max-width:850px){
  /* the 70px column gap became a 70px row gap once the grid stacked */
  .grid-2{gap:22px}
  .grid-3{gap:26px}
  .photo-grid{gap:14px}
  .section{padding:52px 0}
  .hero{padding:64px 0 56px}
  /* headings sat too far from the text they introduce */
  h2{margin-bottom:16px}
  .eyebrow{margin-bottom:10px}
  .lead{margin-bottom:14px}
  .cta{padding:48px 0}
}

/* long email address was overflowing: unbreakable 25-character word at 25px */
.lines a, a[href^="mailto"], a[href^="tel"]{
  overflow-wrap:anywhere;
  word-break:break-word;
  hyphens:none;
  max-width:100%;
}
@media(max-width:560px){
  .lines a, a[href^="mailto"]{font-size:19px;line-height:1.35}
  a[href^="tel"]{font-size:19px}
  .section{padding:44px 0}
  .grid-2{gap:18px}
}

/* cards use min-height to equalise a desktop row; once stacked it is dead space */
@media(max-width:850px){
  .card{min-height:0;padding:24px}
  .cards{margin-top:26px}
}

/* mobile menu: cover the viewport so page copy cannot show through beneath it */
@media(max-width:850px){
  .navlinks{position:fixed;top:76px;left:0;right:0;bottom:0;
    background:var(--navy);z-index:30;padding:28px 22px;
    overflow-y:auto;gap:6px}
  .navlinks a{padding:14px 0;font-size:16px;width:100%}
  .topbar{z-index:40}
  body.nav-open{overflow:hidden}
}
@media(max-width:850px){
  .navlinks a.nav-cta{width:auto;align-self:flex-start;margin-top:10px;padding:12px 22px}
}
/* keep the footer contact line modest on small screens */
@media(max-width:560px){
  footer a[href^="tel"], footer a[href^="mailto"], .footer-grid .small{font-size:12.5px}
}
