/* A small companion page using the landing page's established typography and navigation. */
:root { --ink:#102a39; --night:#091924; --side:clamp(22px,5.2vw,78px); --max:1230px; }
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; color:var(--ink); background:#e5eef2; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; height:auto; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
a:focus-visible, button:focus-visible { outline:3px solid #37b9e0; outline-offset:4px; }
::selection { background:#51c3e8; color:#062235; }
.wrap { width:min(var(--max),calc(100% - 2*var(--side))); margin-inline:auto; }
.nav { position:fixed; z-index:200; inset:0 0 auto; color:#fff; border-bottom:1px solid rgba(220,244,252,.11); background:rgba(8,25,36,.94); -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px); }
.nav-inner { height:75px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.wordmark { display:flex; align-items:center; gap:9px; white-space:nowrap; font-size:24px; font-weight:760; letter-spacing:-.065em; }
.wordmark b { color:#32bbe9; }
.logo-symbol { height:29px; width:29px; display:inline-flex; align-items:center; justify-content:center; border:2px solid #33b8e2; border-radius:50%; font-size:15px; color:#3ac1ec; font-weight:800; letter-spacing:-.06em; }
.nav-links { display:flex; gap:29px; align-items:center; }
.nav-links a { font-size:12px; color:#c5d6de; font-weight:620; }
.nav-links a:hover { color:white; }
.nav-links a.nav-cta { background:white; color:#17374a; padding:12px 16px; border-radius:6px; font-weight:760; }
.menu-btn { display:none; cursor:pointer; border:0; color:#fff; background:transparent; min-width:44px; min-height:44px; padding:9px; font-size:23px; }
.eyebrow { font-size:11px; font-weight:760; letter-spacing:.18em; text-transform:uppercase; color:#087497; }
.eyebrow.light { color:#83d7f0; }
h1, h2 { letter-spacing:-.05em; line-height:1.1; font-weight:720; }
h1 { font-size:clamp(38px,4.3vw,64px); margin:20px 0 25px; }
h1 em { font-style:normal; color:#087497; }
h2 { font-size:clamp(30px,3.2vw,43px); margin:15px 0 23px; }
p { color:#486674; line-height:1.85; font-size:16px; margin:0 0 18px; }
.about-intro { padding:140px 0 80px; }
.about-lead { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:clamp(40px,6vw,90px); align-items:center; }
.about-intro-copy { max-width:680px; }
.breadcrumb { display:inline-flex; align-items:center; gap:12px; min-height:44px; margin-bottom:20px; font-size:12px; color:#486674; }
.breadcrumb:hover { text-decoration:underline; }
.breadcrumb span { color:#8ca9b6; }
.about-standfirst { font-size:clamp(18px,1.5vw,21px); line-height:1.7; }
.archive-photo { width:100%; max-width:360px; margin:0; padding:12px; border:1px solid #c3d7e1; border-radius:12px; background:#f8fbfc; align-self:start; }
.archive-photo img { width:100%; height:auto; border-radius:6px; }
.archive-photo figcaption { font-size:12px; color:#486674; line-height:1.65; padding:13px 4px 4px; }
.about-intro-photo { justify-self:center; max-width:359px; }
.about-work { padding:72px 0; background:#edf3f5; }
.about-section-copy { max-width:820px; margin:0 auto 38px; }
.archive-pair { display:grid; grid-template-columns:repeat(2,minmax(0,360px)); align-items:start; justify-content:center; gap:32px; }
.archive-note { max-width:752px; margin:25px auto 0; font-size:12px; line-height:1.75; }
.about-renewal { padding:80px 0; }
.about-renewal-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:clamp(35px,6vw,85px); }
.about-next { background:#0d2534; padding:75px 0; color:#fff; }
.about-next-inner { max-width:900px; }
.about-next p { color:#bdd3df; max-width:780px; }
.about-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:27px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:17px; min-height:50px; padding:0 21px; border-radius:7px; font-size:12px; font-weight:760; border:1px solid transparent; }
.btn-blue { background:#33b8e1; color:#082332; }
.btn-blue:hover { background:#74d6f4; }
.btn-ghost { border-color:#6d8794; color:#fff; }
.btn-ghost:hover { border-color:#e0f8ff; }
.footer { padding:30px 0; background:#071923; color:#d1e3eb; }
.footer-inner { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.footer .wordmark { font-size:20px; color:#fff; }
.footer .logo-symbol { width:25px; height:25px; font-size:13px; }
.footer p { font-size:11px; color:#9bb8c6; line-height:1.7; margin:0; }
.footer .mail { font-size:12px; color:#d4eaf2; }
.skip-link { position:fixed; z-index:300; top:8px; left:16px; padding:13px 18px; color:#102a39; background:#fff; border-radius:5px; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
@media(max-width:780px) {
  .nav-inner { height:65px; }
  .wordmark { font-size:22px; }
  .menu-btn { display:block; }
  .nav-links { display:none; position:absolute; top:65px; left:0; right:0; padding:18px 22px 24px; background:#0a2130; border-top:1px solid #315263; flex-direction:column; align-items:stretch; gap:0; box-shadow:0 20px 30px rgba(0,0,0,.18); }
  .nav-links.open { display:flex; }
  .nav-links a { min-height:44px; padding:13px 0; }
  .nav-links .nav-cta { margin-top:12px; text-align:center; }
  .about-intro { padding-top:99px; padding-bottom:52px; }
  .about-lead, .about-renewal-grid { grid-template-columns:minmax(0,1fr); gap:32px; }
  .about-intro-photo { width:min(100%,359px); }
  .breadcrumb { margin-bottom:16px; }
  .about-work, .about-renewal, .about-next { padding-block:52px; }
  .footer-inner { flex-direction:column; align-items:start; }
}
@media(max-width:620px) {
  .archive-pair { grid-template-columns:minmax(0,360px); gap:28px; }
  .about-actions { flex-direction:column; align-items:stretch; }
  .btn { padding:13px 15px; text-align:center; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }