:root {
  --slate: #1C3347;
  --gold: #B8903C;
  --ridge: #4E6E84;
  --cloud: #EDF1F4;
  --stone: #2B3540;
  --white: #F7F9FB;
  --muted: #7A8A96;
  --line: #D2D8DC;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: 'DM Sans', Arial, sans-serif; color: var(--stone); background: var(--white); line-height: 1.65; }
a { color: inherit; }
img { max-width: 100%; display: block; }
.container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }
.serif { font-family: 'Cormorant Garamond', Georgia, serif; }
.eyebrow { text-transform: uppercase; letter-spacing: .22em; font-size: .76rem; color: var(--gold); font-weight: 500; }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(247,249,251,.94); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(210,216,220,.75); }
.nav { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { text-decoration: none; display: flex; align-items: center; gap: 14px; min-width: 0; }
.mark { width: 48px; display: grid; gap: 4px; justify-items: center; flex: 0 0 auto; }
.mark span { height: 4px; border-radius: 3px; background: var(--slate); display: block; }
.mark span:nth-child(1){width:20px}.mark span:nth-child(2){width:28px}.mark span:nth-child(3){width:36px}.mark span:nth-child(4){width:44px}
.brand-name { color: var(--slate); letter-spacing: .20em; font-size: 1.2rem; text-transform: uppercase; font-weight: 500; line-height: 1; }
.brand-sub { color: var(--ridge); letter-spacing: .18em; font-size: .66rem; text-transform: uppercase; margin-top: 7px; }
.nav-links { display: flex; align-items: center; gap: 26px; }
.nav-links a { text-decoration: none; font-size: .92rem; color: var(--ridge); }
.nav-links a:hover, .nav-links a.active { color: var(--slate); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; padding: 12px 18px; border: 1px solid var(--gold); color: var(--slate); font-weight: 500; transition: .2s; }
.button:hover { background: var(--gold); color: #fff; }
.button.dark { background: var(--slate); border-color: var(--slate); color: #fff; }
.button.dark:hover { background: #294a64; }

.hero { min-height: 670px; color: #fff; position: relative; display: flex; align-items: end; background: linear-gradient(90deg, rgba(11,28,42,.84) 0%, rgba(11,28,42,.64) 42%, rgba(11,28,42,.12) 78%), url('lighthouse-hero.png') center/cover no-repeat; }
.hero::after { content:""; position:absolute; inset:auto 0 0; height:6px; background: linear-gradient(90deg,var(--gold) 0 12%, transparent 12%); }
.hero-content { position: relative; z-index: 1; padding: 120px 0 90px; max-width: 730px; }
.hero h1 { font-size: clamp(3.2rem, 7vw, 6.3rem); line-height: .95; font-weight: 500; margin: 15px 0 24px; letter-spacing: -.02em; }
.hero p { font-size: 1.2rem; max-width: 650px; color: rgba(255,255,255,.88); margin: 0 0 32px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.hero .button { color: #fff; }
.hero .button.dark { background: #fff; color: var(--slate); border-color:#fff; }

.section { padding: 92px 0; }
.section.cloud { background: var(--cloud); }
.section.slate { background: var(--slate); color: #fff; }
.section-head { max-width: 800px; margin-bottom: 48px; }
.section-head h2 { color: var(--slate); font-size: clamp(2.4rem, 5vw, 4.4rem); line-height: 1; font-weight: 500; margin: 12px 0 18px; }
.section.slate .section-head h2 { color:#fff; }
.section-head p { font-size: 1.08rem; color: var(--ridge); }
.section.slate .section-head p { color:#b8c8d3; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.card { background:#fff; border:1px solid var(--line); padding:30px; min-height:270px; }
.card .num { color:var(--gold); letter-spacing:.15em; font-size:.78rem; }
.card h3 { color:var(--slate); font-family:'Cormorant Garamond',Georgia,serif; font-size:1.8rem; line-height:1.1; margin:18px 0 14px; font-weight:500; }
.card p { color:#586772; margin:0; }

.split { display:grid; grid-template-columns:1.02fr .98fr; gap:56px; align-items:center; }
.image-panel { position:relative; }
.image-panel img { width:100%; aspect-ratio: 4/3; object-fit:cover; }
.image-panel::after { content:""; position:absolute; left:-18px; bottom:-18px; width:120px; height:5px; background:var(--gold); }
.copy h2 { color:var(--slate); font-size:clamp(2.6rem,5vw,4.5rem); line-height:1; font-weight:500; margin:12px 0 22px; }
.copy p { color:#53636f; font-size:1.05rem; }
.checklist { display:grid; gap:12px; margin:26px 0 0; padding:0; list-style:none; }
.checklist li { padding-left:25px; position:relative; }
.checklist li::before { content:""; position:absolute; left:0; top:.68em; width:10px; height:2px; background:var(--gold); }

.quote { padding:70px 0; background:var(--slate); color:#fff; text-align:center; }
.quote blockquote { margin:0 auto; max-width:850px; font-family:'Cormorant Garamond',Georgia,serif; font-size:clamp(2.3rem,5vw,4.3rem); line-height:1.08; font-weight:400; }
.quote cite { display:block; margin-top:22px; color:var(--gold); letter-spacing:.2em; text-transform:uppercase; font-size:.74rem; font-style:normal; }

.page-hero { background:var(--slate); color:#fff; padding:100px 0 80px; position:relative; overflow:hidden; }
.page-hero::after { content:""; position:absolute; right:-160px; bottom:-90px; width:520px; height:310px; opacity:.18; background:url('strata.png') center/cover; border-radius:50%; }
.page-hero h1 { font-size:clamp(3.4rem,7vw,6.2rem); line-height:.95; margin:14px 0 20px; font-weight:500; }
.page-hero p { max-width:720px; color:#c5d1d9; font-size:1.15rem; }
.service-row { display:grid; grid-template-columns:130px 1fr; gap:32px; padding:38px 0; border-top:1px solid var(--line); }
.service-row:last-child { border-bottom:1px solid var(--line); }
.service-no { color:var(--gold); letter-spacing:.18em; font-size:.8rem; }
.service-row h2 { font-family:'Cormorant Garamond',Georgia,serif; color:var(--slate); font-size:2.5rem; line-height:1.05; margin:0 0 12px; font-weight:500; }
.service-row p { margin:0; color:#586772; max-width:820px; }
.tags { display:flex; flex-wrap:wrap; gap:9px; margin-top:18px; }
.tag { border:1px solid var(--line); color:var(--ridge); padding:6px 10px; font-size:.78rem; background:#fff; }

.bio-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; align-items:start; }
.bio-image img { aspect-ratio: 4/5; object-fit:cover; width:100%; filter:saturate(.8); }
.bio-copy h2 { font-size:clamp(2.7rem,5vw,4.7rem); color:var(--slate); line-height:1; margin:10px 0 22px; font-weight:500; }
.credentials { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:30px; }
.credential { background:var(--cloud); padding:20px; border-left:3px solid var(--gold); }
.credential strong { display:block; color:var(--slate); margin-bottom:5px; }

.cta { background:var(--cloud); padding:70px 0; }
.cta-box { display:flex; justify-content:space-between; align-items:center; gap:32px; }
.cta h2 { color:var(--slate); font-size:clamp(2.4rem,5vw,4rem); line-height:1; margin:0 0 12px; font-weight:500; }
.cta p { margin:0; color:var(--ridge); }

.site-footer { background:#132a3b; color:#d9e1e6; padding:50px 0 30px; }
.footer-grid { display:grid; grid-template-columns:1.3fr .7fr .8fr; gap:40px; }
.footer-title { font-family:'Cormorant Garamond',Georgia,serif; font-size:1.9rem; color:#fff; letter-spacing:.08em; text-transform:uppercase; }
.footer-sub { color:var(--gold); text-transform:uppercase; letter-spacing:.18em; font-size:.68rem; }
.footer-links { display:grid; gap:8px; }
.footer-links a { text-decoration:none; color:#b7c5ce; }
.footer-links a:hover { color:#fff; }
.footer-bottom { margin-top:36px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:20px; color:#8fa4b1; font-size:.84rem; }

@media (max-width: 850px) {
  .nav-links a:not(.button) { display:none; }
  .hero { min-height:600px; background-position:38% center; }
  .grid-3, .split, .bio-grid, .footer-grid { grid-template-columns:1fr; }
  .service-row { grid-template-columns:1fr; gap:10px; }
  .credentials { grid-template-columns:1fr; }
  .cta-box { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 520px) {
  .container { width:min(var(--max),calc(100% - 26px)); }
  .brand-name { font-size:1rem; letter-spacing:.14em; }
  .brand-sub { font-size:.56rem; }
  .mark { width:38px; }
  .nav .button { display:none; }
  .section { padding:70px 0; }
  .hero-content { padding-bottom:70px; }
  .footer-bottom { flex-direction:column; }
}
