@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap');

:root { --navy: #0c2e47; --navy-2: #123d5b; --gold: #c9a743; --gold-light: #e9d58a; --white: #fff; --paper: #f7f8f7; --mist: #ebeeef; --ink: #1f2c33; --muted: #64727a; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--ink); font-family: 'DM Sans', sans-serif; line-height: 1.55; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
.container { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.site-header { position: absolute; top: 0; left: 0; width: 100%; z-index: 5; color: white; background: linear-gradient(180deg, rgba(5,22,35,.72), transparent); }
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height: 92px; }
.brand { display:block; width: 170px; height: 65px; overflow:hidden; }
.brand img { width: 100%; height: 100%; object-fit: contain; object-position: left center; } .brand-fallback { display:none; height:100%; align-items:center; color:white; font-size:15px; font-weight:700; letter-spacing:.16em; } .brand-fallback small { display:block; color:var(--gold-light); font-size:8px; letter-spacing:.25em; margin-top:3px; } .brand-fallback.is-visible { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.main-nav { display:flex; align-items:center; gap: 25px; font-size: 12px; font-weight: 600; letter-spacing:.01em; }
.main-nav > a:not(.button) { opacity:.88; transition:color .2s, opacity .2s; }
.main-nav > a:not(.button):hover { color: var(--gold-light); opacity:1; }
.menu-toggle { display:none; background:none; border:0; color:inherit; }
.button { display:inline-flex; align-items:center; justify-content:center; gap: 10px; background:var(--gold); color:var(--navy); border: 1px solid var(--gold); padding: 15px 22px; font-size: 12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; transition:transform .25s, background .25s, box-shadow .25s; cursor:pointer; }
.button:hover { transform:translateY(-3px); background:var(--gold-light); box-shadow:0 11px 24px rgba(201,167,67,.2); }
.button-small { padding: 12px 16px; margin-left:5px; }
.hero-section { position:relative; min-height: 750px; display:flex; align-items:center; overflow:hidden; background:var(--navy); color:white; }
.hero-image { position:absolute; width:100%; height:100%; object-fit:cover; object-position:center; animation: slowZoom 14s ease-out forwards; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg, rgba(6,28,44,.94) 0%, rgba(12,46,71,.77) 48%, rgba(12,46,71,.33) 100%); }
.hero-content { position:relative; z-index:1; padding-top: 100px; }
.eyebrow, .kicker { margin:0 0 17px; color:var(--gold); text-transform:uppercase; letter-spacing:.18em; font-size:10px; font-weight:700; }
.eyebrow.light { color:var(--gold-light); }
h1, h2, h3, p { margin-top:0; }
h1, h2 { font-family:'Playfair Display', serif; font-weight:500; letter-spacing:-.035em; line-height:1.1; }
h1 { max-width: 770px; font-size: clamp(46px, 6vw, 80px); margin-bottom:26px; }
h2 { font-size:clamp(40px, 5vw, 64px); margin-bottom:25px; color:var(--navy); }
h1 em, h2 em { color:var(--gold); font-style:italic; }
.hero-copy { max-width: 480px; color: rgba(255,255,255,.82); font-size:16px; line-height:1.8; margin-bottom:33px; }
.hero-actions { display:flex; align-items:center; gap:29px; }
.light-link { color:white; }
.text-link { display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; transition:gap .2s; }
.text-link:hover { gap:14px; }
.navy-link { color:var(--navy); }
.hero-note { position:absolute; right:48px; bottom:40px; z-index:1; display:flex; align-items:center; gap:13px; font-size:10px; text-transform:uppercase; letter-spacing:.13em; color:rgba(255,255,255,.7); }
.line { width:65px; display:inline-block; height:1px; background:currentColor; }
.intro-strip { background:var(--gold); color:var(--navy); }
.intro-grid { display:grid; grid-template-columns: 1fr 2.1fr auto; align-items:center; min-height:137px; gap:30px; }
.intro-grid .kicker { color:var(--navy); margin:0; }
.intro-statement { font-family:'Playfair Display',serif; font-size:25px; margin:0; }
.intro-statement strong { font-style:italic; }
.circle-arrow { width:46px; height:46px; border:1px solid rgba(12,46,71,.5); border-radius:50%; display:grid; place-items:center; transition:background .2s, transform .2s; }
.circle-arrow:hover { background:rgba(255,255,255,.25); transform:rotate(45deg); }
.section { padding:120px 0; }
.split-grid { display:grid; grid-template-columns: 1.04fr .96fr; align-items:center; gap:100px; }
.image-frame { position:relative; }
.about-image-wrap { height:525px; }
.about-image-wrap:before { content:''; position:absolute; inset:-18px 18px 18px -18px; border:1px solid var(--gold); z-index:0; }
.image-frame img { width:100%; height:100%; object-fit:cover; position:relative; z-index:1; }
.image-caption { position:absolute; z-index:2; left:28px; bottom:27px; color:white; text-transform:uppercase; font-size:10px; letter-spacing:.13em; display:flex; gap:11px; align-items:center; }
.image-caption span:last-child { color:rgba(255,255,255,.64); }
.caption-mark { display:inline-block; width:23px; height:2px; background:var(--gold); }
.about-copy p:not(.eyebrow) { color:var(--muted); font-size:15px; line-height:1.9; max-width:500px; }
.about-copy strong { color:var(--navy); }
.statement-box { margin:31px 0 30px; padding:23px 26px; border-left:3px solid var(--gold); color:var(--navy); font-family:'Playfair Display',serif; font-size:23px; line-height:1.4; }
.statement-box span { color:var(--gold); font-style:italic; }
.mission-section { position:relative; min-height:555px; background:var(--navy); color:white; overflow:hidden; display:flex; align-items:center; }
.mission-image { position:absolute; right:0; top:0; bottom:0; width:42%; }
.mission-image:after { content:''; position:absolute; inset:0; background:linear-gradient(90deg, var(--navy) 0%, rgba(12,46,71,.35) 65%, rgba(12,46,71,.15)); }
.mission-image img { width:100%; height:100%; object-fit:cover; }
.mission-content { position:relative; z-index:1; }
.mission-content h2 { color:white; max-width:700px; font-size:clamp(37px,4.3vw,59px); }
.mission-quote { position:relative; }
.quote-mark { position:absolute; left:-38px; top:-41px; font-family:'Playfair Display',serif; font-size:120px; line-height:1; color:var(--gold); opacity:.8; }
.mission-footer { display:flex; align-items:center; gap:15px; color:rgba(255,255,255,.6); font-size:10px; letter-spacing:.15em; text-transform:uppercase; margin-top:55px; }
.gold-line { background:var(--gold); width:50px; }
.section-heading { margin-bottom:57px; }
.section-heading.with-intro { display:grid; grid-template-columns: 1.1fr .9fr; gap:60px; align-items:end; }
.section-heading > p, .involved-heading > p { color:var(--muted); font-size:15px; line-height:1.8; margin:0; max-width:390px; }
.objectives-section { background:var(--paper); }
.objectives-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.objective-card { position:relative; min-height:237px; background:white; padding:28px 25px; border:1px solid #e4e8e9; transition:transform .25s, box-shadow .25s, border-color .25s; }
.objective-card:hover { transform:translateY(-7px); box-shadow:0 20px 40px rgba(12,46,71,.09); border-color:var(--gold); }
.icon-box { width:43px; height:43px; display:grid; place-items:center; color:var(--navy); background:#f1e8c9; margin-bottom:23px; transition:background .2s, color .2s; }
.objective-card:hover .icon-box { background:var(--navy); color:var(--gold-light); }
.objective-card h3 { font-family:'Playfair Display',serif; color:var(--navy); font-size:22px; font-weight:500; line-height:1.15; margin-bottom:12px; text-transform:capitalize; }
.objective-card p { color:var(--muted); font-size:13px; line-height:1.6; margin:0; }
.card-arrow { position:absolute; right:20px; top:20px; color:var(--gold); }
.values-section { padding:110px 0 0; background:var(--navy); color:white; }
.values-layout { display:grid; grid-template-columns:1fr 1fr; gap:120px; }
.values-heading h2 { color:white; }
.values-heading > p:not(.eyebrow) { max-width:420px; color:rgba(255,255,255,.7); line-height:1.8; font-size:15px; margin-bottom:30px; }
.values-list { border-top:1px solid rgba(255,255,255,.2); }
.value-row { display:grid; grid-template-columns:43px 1fr auto; align-items:center; min-height:77px; border-bottom:1px solid rgba(255,255,255,.2); }
.value-row span { color:var(--gold); font-size:10px; letter-spacing:.1em; }
.value-row h3 { font-family:'Playfair Display',serif; font-size:30px; font-weight:500; margin:0; }
.value-row svg { color:var(--gold); }
.values-promise { display:grid; grid-template-columns:repeat(4,1fr); margin-top:95px; border-top:1px solid rgba(255,255,255,.2); }
.values-promise div { display:flex; align-items:center; gap:12px; min-height:92px; padding-right:20px; color:rgba(255,255,255,.75); font-size:12px; border-right:1px solid rgba(255,255,255,.2); }
.values-promise div:not(:first-child) { padding-left:25px; }
.values-promise div:last-child { border:0; }
.values-promise svg { flex:none; color:var(--gold); }
.impact-section { background:white; }
.impact-content { display:grid; grid-template-columns:1fr 1fr; gap:42px; align-items:stretch; }
.impact-list { border-top:1px solid #dce2e3; }
.impact-item { display:grid; grid-template-columns:35px 1fr auto; align-items:center; min-height:60px; border-bottom:1px solid #dce2e3; transition:padding .2s, background .2s; }
.impact-item:hover { padding-left:10px; background:var(--paper); }
.impact-item span { color:var(--gold); font-size:10px; font-weight:700; }
.impact-item h3 { margin:0; color:var(--navy); font-size:15px; font-weight:600; text-transform:capitalize; }
.impact-item svg { color:var(--gold); }
.impact-feature { position:relative; min-height:460px; overflow:hidden; background:var(--navy); color:white; }
.impact-feature img { width:100%; height:100%; object-fit:cover; opacity:.62; }
.impact-feature:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(12,46,71,.96), transparent 75%); }
.impact-feature-copy { position:absolute; bottom:31px; left:31px; z-index:1; max-width:300px; }
.impact-feature-copy h3 { font-family:'Playfair Display',serif; font-weight:500; font-size:31px; margin:0 0 9px; }
.impact-feature-copy p:not(.eyebrow) { color:rgba(255,255,255,.73); font-size:13px; line-height:1.7; }
.stats-row { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #dce2e3; border-bottom:1px solid #dce2e3; margin-top:65px; }
.stats-row div { padding:27px 20px 27px 0; border-right:1px solid #dce2e3; }
.stats-row div:not(:first-child) { padding-left:25px; }
.stats-row div:last-child { border:0; }
.stats-row strong { display:block; color:var(--gold); font-family:'Playfair Display',serif; font-size:42px; font-weight:500; line-height:1; margin-bottom:9px; }
.stats-row span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.1em; }
.section-soft { background:var(--paper); }
.governance-bottom { display:grid; grid-template-columns:.8fr 1.2fr; gap:90px; }
.governance-copy > p { color:var(--muted); font-size:15px; line-height:1.8; max-width:400px; }
.board-roles { display:flex; flex-wrap:wrap; gap:8px; margin-top:35px; }
.board-roles span { border:1px solid #d6dddf; padding:10px 13px; color:var(--navy); font-size:11px; }
.leadership-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:end; }
.leader-card { background:white; border-bottom:2px solid var(--gold); transition:transform .25s, box-shadow .25s; }
.leader-card:nth-child(2), .leader-card:nth-child(4), .leader-card:nth-child(6), .leader-card:nth-child(8) { transform:translateY(-18px); }
.leader-card:hover { transform:translateY(-7px); box-shadow:0 20px 40px rgba(12,46,71,.1); }
.leader-card:nth-child(2):hover, .leader-card:nth-child(4):hover, .leader-card:nth-child(6):hover, .leader-card:nth-child(8):hover { transform:translateY(-25px); }
.leader-photo { position:relative; aspect-ratio:3/4; overflow:hidden; background:var(--mist); }
.leader-photo img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.leader-card:hover .leader-photo img { transform:scale(1.05); }
.leader-fallback { display:none; }
.leader-fallback.is-visible { display:grid; place-items:center; position:absolute; inset:0; background:var(--navy); color:var(--gold-light); font-size:34px; font-weight:700; font-family:'Playfair Display',serif; letter-spacing:.04em; }
.leader-name { color:var(--navy); font-size:14px; font-weight:700; margin:14px 14px 4px; }
.leader-role { display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; padding:0 14px 16px; }
.integrity-section { background:var(--navy); padding:96px 0; color:white; }
.integrity-layout { display:grid; grid-template-columns:1fr 1fr; gap:130px; align-items:start; }
.integrity-layout h2 { color:white; }
.integrity-layout > div > p:not(.eyebrow) { color:rgba(255,255,255,.75); line-height:1.8; margin:0 0 20px; max-width:420px; }
.integrity-layout ul { padding:0; margin:0; list-style:none; display:grid; gap:12px; color:rgba(255,255,255,.76); font-size:13px; }
.integrity-layout li { display:flex; align-items:center; gap:12px; }
.integrity-layout li svg { color:var(--gold); }
.involved-section { background:var(--gold); }
.involved-heading { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:end; }
.involved-heading .eyebrow { color:var(--navy); }
.involved-heading h2 { color:var(--navy); }
.involved-heading > p { color:rgba(12,46,71,.74); }
.involved-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:55px; }
.involved-card { background:rgba(255,255,255,.58); padding:28px 24px; min-height:225px; border:1px solid rgba(12,46,71,.12); transition:transform .2s, background .2s; }
.involved-card:hover { transform:translateY(-6px); background:white; }
.involved-card > svg { color:var(--navy); }
.involved-card h3 { font-family:'Playfair Display',serif; font-size:23px; color:var(--navy); font-weight:500; margin:22px 0 9px; }
.involved-card p { font-size:13px; color:rgba(12,46,71,.7); line-height:1.6; margin-bottom:24px; }
.contact-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:130px; align-items:start; }
.contact-info h2 { max-width:480px; }
.contact-info > p:not(.eyebrow) { color:var(--muted); font-size:15px; line-height:1.8; max-width:410px; }
.contact-details { margin-top:38px; display:grid; grid-template-columns:1fr 1fr; gap:25px 20px; }
.contact-details span { display:block; color:var(--gold); font-size:10px; text-transform:uppercase; letter-spacing:.1em; margin-bottom:6px; }
.contact-details strong { color:var(--navy); font-size:13px; font-weight:600; }
.social-links { display:flex; gap:9px; margin-top:35px; }
.social-links a { width:33px; height:33px; display:grid; place-items:center; color:var(--navy); border:1px solid #cbd5d8; transition:background .2s, color .2s; }
.social-links a:hover { background:var(--navy); color:var(--gold-light); }
.contact-form { background:white; padding:34px; border:1px solid #dfe5e6; box-shadow:0 20px 55px rgba(12,46,71,.06); display:grid; gap:20px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.contact-form label { display:grid; gap:8px; color:var(--navy); font-size:11px; font-weight:700; }
.contact-form input, .contact-form textarea { width:100%; border:0; border-bottom:1px solid #d1d9db; outline:none; padding:7px 0 10px; color:var(--ink); font-size:13px; background:transparent; resize:vertical; transition:border .2s; }
.contact-form input:focus, .contact-form textarea:focus { border-color:var(--gold); }
.contact-form input::placeholder, .contact-form textarea::placeholder { color:#a6afb2; }
.contact-form .button { justify-self:start; margin-top:8px; }
.form-success { min-height:390px; display:grid; place-content:center; text-align:center; justify-items:center; }
.form-success > svg { color:var(--gold); margin-bottom:20px; }
.form-success h3 { font-family:'Playfair Display',serif; color:var(--navy); font-size:28px; font-weight:500; margin-bottom:7px; }
.form-success p { color:var(--muted); font-size:13px; margin-bottom:25px; }
.site-footer { background:#071f31; color:white; padding:72px 0 25px; }
.footer-top { display:grid; grid-template-columns:1.7fr .7fr .7fr .8fr; gap:55px; padding-bottom:65px; }
.footer-brand img { width:170px; height:60px; object-fit:contain; object-position:left; margin-bottom:19px; } .footer-brand .brand-fallback { margin-bottom:19px; }
.footer-brand p { max-width:260px; color:rgba(255,255,255,.6); font-family:'Playfair Display',serif; font-size:17px; line-height:1.45; }
.footer-links, .footer-social { display:flex; flex-direction:column; align-items:flex-start; gap:11px; font-size:12px; }
.footer-links span, .footer-social > span { color:var(--gold-light); text-transform:uppercase; letter-spacing:.13em; font-size:10px; font-weight:700; margin-bottom:9px; }
.footer-links a { color:rgba(255,255,255,.62); transition:color .2s; }
.footer-links a:hover { color:var(--gold-light); }
.footer-social .social-links { margin-top:3px; }
.footer-social .social-links a { color:white; border-color:rgba(255,255,255,.25); }
.footer-bottom { display:flex; justify-content:space-between; border-top:1px solid rgba(255,255,255,.16); padding-top:22px; color:rgba(255,255,255,.45); text-transform:uppercase; letter-spacing:.08em; font-size:9px; }
@keyframes slowZoom { from { transform:scale(1.01); } to { transform:scale(1.08); } }
@media (max-width: 1000px) { .main-nav { gap:15px; font-size:11px; } .split-grid { gap:55px; } .values-layout, .integrity-layout, .contact-layout { gap:60px; } .objectives-grid { grid-template-columns:repeat(2,1fr); } .footer-top { gap:30px; } .leadership-grid { grid-template-columns:repeat(4,1fr); } .leader-card:nth-child(2), .leader-card:nth-child(4), .leader-card:nth-child(6), .leader-card:nth-child(8) { transform:none; } }
@media (max-width: 760px) { .container { width:min(100% - 36px, 560px); } .site-header { background:rgba(7,31,49,.87); } .header-inner { min-height:76px; } .brand { width:145px; height:56px; } .menu-toggle { display:block; } .main-nav { position:absolute; display:none; top:76px; left:0; right:0; padding:18px; background:var(--navy); flex-direction:column; align-items:stretch; gap:0; box-shadow:0 15px 25px rgba(0,0,0,.15); } .main-nav.is-open { display:flex; } .main-nav > a { padding:13px 5px; } .main-nav .button-small { margin:8px 0 0; text-align:center; } .hero-section { min-height:680px; } .hero-content { padding-top:85px; } h1 { font-size:46px; } .hero-note { display:none; } .hero-actions { flex-direction:column; align-items:flex-start; gap:20px; } .intro-grid { grid-template-columns:1fr auto; gap:12px; padding:25px 0; min-height:auto; } .intro-grid .kicker { grid-column:1 / -1; } .intro-statement { font-size:22px; } .section { padding:78px 0; } .split-grid, .section-heading.with-intro, .values-layout, .impact-content, .governance-bottom, .integrity-layout, .contact-layout, .involved-heading { grid-template-columns:1fr; gap:35px; } .about-image-wrap { height:380px; margin-left:15px; } h2 { font-size:45px; } .mission-section { min-height:650px; } .mission-image { width:100%; opacity:.47; } .mission-image:after { background:linear-gradient(90deg, rgba(12,46,71,.95), rgba(12,46,71,.6)); } .quote-mark { left:-5px; top:-45px; } .mission-content h2 { position:relative; font-size:42px; } .mission-footer { margin-top:40px; } .objectives-grid { grid-template-columns:1fr 1fr; gap:10px; } .objective-card { min-height:245px; padding:21px 17px; } .objective-card h3 { font-size:19px; } .values-section { padding-top:78px; } .values-promise { grid-template-columns:1fr 1fr; margin-top:65px; } .values-promise div { min-height:75px; } .values-promise div:nth-child(2) { border-right:0; } .values-promise div:not(:first-child) { padding-left:12px; } .impact-feature { min-height:350px; } .stats-row { grid-template-columns:1fr 1fr; } .stats-row div:nth-child(2) { border-right:0; } .stats-row div:nth-child(3), .stats-row div:nth-child(4) { border-top:1px solid #dce2e3; } .stats-row div:nth-child(3) { padding-left:0; } .stats-row div:nth-child(4) { padding-left:25px; } .leadership-grid { grid-template-columns:repeat(2,1fr); } .leader-card:nth-child(2), .leader-card:nth-child(4), .leader-card:nth-child(6), .leader-card:nth-child(8) { transform:none; } .leader-card:hover { transform:translateY(-7px); } .integrity-section { padding:78px 0; } .involved-grid { grid-template-columns:1fr 1fr; gap:10px; margin-top:30px; } .involved-card { min-height:250px; padding:22px 17px; } .contact-form { padding:24px 19px; } .footer-top { grid-template-columns:1fr 1fr; gap:38px 20px; } .footer-brand { grid-column:1 / -1; } .footer-bottom { flex-direction:column; gap:10px; line-height:1.5; } }
@media (max-width: 420px) { h1 { font-size:40px; } h2 { font-size:39px; } .objectives-grid, .involved-grid { grid-template-columns:1fr; } .objective-card, .involved-card { min-height:auto; } .values-promise { grid-template-columns:1fr; } .values-promise div, .values-promise div:not(:first-child) { border-right:0; padding-left:0; min-height:56px; } .form-row { grid-template-columns:1fr; gap:20px; } .footer-top { grid-template-columns:1fr; } .leadership-grid { grid-template-columns:1fr 1fr; } .leader-card:hover { transform:translateY(-7px); } }
