:root { --navy:#102d44; --navy-deep:#071f30; --sky:#2a7fb2; --sky-soft:#eef7fc; --pink:#e899bb; --pink-soft:#fff3f8; --gold:#be9140; --ivory:#fffdf9; --ink:#243847; --muted:#687c89; --line:#d7e1e6; --serif:"Libre Caslon Display",Georgia,serif; --sans:"DM Sans",Arial,sans-serif; --shell:min(1160px,calc(100% - 48px)); --shadow:0 18px 50px rgba(16,45,68,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--ivory); font:400 17px/1.7 var(--sans); }
a { color:inherit; }
.skip-link { position:fixed; left:16px; top:-80px; z-index:100; padding:10px 14px; color:white; background:var(--navy-deep); }
.skip-link:focus { top:16px; }
.shell { width:var(--shell); margin-inline:auto; }
.site-header { min-height:88px; padding:0 max(24px,calc((100vw - 1160px)/2)); display:flex; align-items:center; justify-content:space-between; gap:32px; color:white; background:var(--navy-deep); }
.brand { display:flex; align-items:center; gap:13px; text-decoration:none; }
.brand span { width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--pink); border-radius:50%; font:400 14px var(--serif); }
.brand strong { font:400 21px var(--serif); }
.site-nav { display:flex; align-items:center; gap:28px; }
.site-nav a { font-size:14px; font-weight:600; text-decoration:none; }
.site-nav a:hover { color:var(--pink); }
.menu-button { display:none; padding:10px 12px; border:1px solid rgba(255,255,255,.4); color:white; background:transparent; font:600 14px var(--sans); }
.hero { overflow:hidden; color:white; background:linear-gradient(125deg,var(--navy-deep),#236f99 70%,#9b7ba1); }
.hero-grid { min-height:680px; padding-block:90px; display:grid; grid-template-columns:1.12fr .88fr; align-items:center; gap:72px; }
.eyebrow { margin:0 0 16px; color:var(--sky); font-size:12px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.hero .eyebrow { color:#afd9f2; }
h1,h2,h3,p { overflow-wrap:break-word; }
h1 { max-width:760px; margin:0; font:400 clamp(54px,7vw,88px)/1.04 var(--serif); letter-spacing:-.035em; }
.hero-intro { max-width:650px; margin:26px 0 0; color:#dce9ef; font-size:18px; line-height:1.75; }
.actions { margin-top:34px; display:flex; flex-wrap:wrap; gap:13px; }
.button { min-height:48px; padding:13px 22px; display:inline-flex; align-items:center; justify-content:center; border:1px solid transparent; border-radius:999px; font-size:14px; font-weight:700; text-decoration:none; }
.button.primary { color:white; background:var(--navy-deep); }
.hero .button.primary { color:var(--navy-deep); background:white; }
.button.secondary { border-color:rgba(255,255,255,.5); color:white; }
.hero-art { min-height:470px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.34); border-radius:240px 240px 24px 24px; background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.03)); box-shadow:var(--shadow); }
.hero-art span { max-width:180px; text-align:center; color:#d8e8ef; font-size:13px; }
.section { padding:100px 0; }
.section.soft { background:linear-gradient(145deg,var(--sky-soft),var(--pink-soft)); }
.narrow { max-width:850px; }
h2 { margin:0; color:var(--navy-deep); font:400 clamp(40px,5vw,62px)/1.12 var(--serif); letter-spacing:-.025em; }
.narrow > p:last-child { max-width:720px; margin:24px 0 0; color:var(--muted); font-size:18px; }
.section-heading { margin-bottom:40px; display:grid; grid-template-columns:1fr 360px; align-items:end; gap:50px; }
.section-heading > p { margin:0; color:var(--muted); }
.card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.card { min-height:310px; padding:30px; display:flex; flex-direction:column; border:1px solid var(--line); border-top:5px solid var(--sky); background:white; box-shadow:0 14px 38px rgba(16,45,68,.07); }
.card.accent { border-top-color:var(--pink); }
.card.warm { border-top-color:var(--gold); }
.card > span { color:var(--muted); font-size:12px; font-weight:700; }
.card h3 { margin:36px 0 12px; color:var(--navy-deep); font:400 29px/1.2 var(--serif); }
.card p { margin:0; color:var(--muted); font-size:15px; }
.card a { margin-top:auto; padding-top:25px; color:var(--sky); font-size:13px; font-weight:700; text-decoration:none; }
.contact-panel { padding:52px; display:flex; align-items:center; justify-content:space-between; gap:40px; border:1px solid var(--line); background:white; box-shadow:14px 14px 0 #eadfd7; }
.contact-panel h2 { max-width:750px; font-size:clamp(36px,4vw,52px); }
.site-footer { padding:34px 0; color:#c9d8df; background:var(--navy-deep); font-size:13px; }
.site-footer .shell { display:flex; justify-content:space-between; gap:24px; }
.site-footer p { margin:0; }
:focus-visible { outline:3px solid #f0c96f; outline-offset:4px; }
@media (max-width:900px) { .hero-grid { grid-template-columns:1fr 340px; gap:38px; } .card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .section-heading { grid-template-columns:1fr; gap:18px; } }
@media (max-width:720px) { :root { --shell:min(100% - 28px,1160px); } body { font-size:16px; } .site-header { min-height:76px; padding-inline:14px; } .menu-button { display:block; } .site-nav { display:none; position:absolute; top:76px; left:14px; right:14px; z-index:10; padding:18px; flex-direction:column; align-items:stretch; color:var(--navy-deep); background:white; box-shadow:var(--shadow); } .site-nav.open { display:flex; } .hero-grid { min-height:auto; padding-block:76px; grid-template-columns:1fr; gap:46px; text-align:center; } h1 { font-size:clamp(46px,13vw,62px); } .hero-intro { margin-inline:auto; font-size:16px; } .actions { justify-content:center; } .hero-art { min-height:330px; width:min(90%,390px); margin-inline:auto; } .section { padding:64px 0; } h2 { font-size:clamp(36px,10vw,46px); } .card-grid { grid-template-columns:1fr; gap:13px; } .card { min-height:250px; } .contact-panel { padding:34px 25px; align-items:flex-start; flex-direction:column; box-shadow:8px 8px 0 #eadfd7; } .site-footer .shell { align-items:flex-start; flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }