:root { --navy:#073b5c; --navy-dark:#032a43; --blue:#2aa3d0; --pale:#eff8fb; --ink:#183849; --muted:#5b7280; --line:#d6e6ed; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
h1,h2,h3,p { margin-top:0; }
.site-header { align-items:center; background:rgba(247,252,254,.96); border-bottom:1px solid var(--line); display:flex; justify-content:space-between; min-height:108px; padding:8px clamp(20px,5vw,74px); position:sticky; top:0; z-index:10; }
.brand { align-items:center; display:inline-flex; }
.brand img { height:92px; object-fit:contain; width:auto; }
.site-header nav { align-items:center; display:flex; gap:30px; font-size:.92rem; font-weight:700; }
.site-header nav>a:not(.nav-phone):hover { color:var(--blue); }
.nav-phone { background:var(--navy); color:#fff; padding:13px 18px; }
.nav-phone:hover { background:var(--blue); }
.hero { display:grid; grid-template-columns:1.05fr .95fr; min-height:660px; }
.hero-copy { align-content:center; display:grid; justify-items:start; padding:clamp(64px,8vw,116px) clamp(24px,7vw,104px); }
.eyebrow { color:var(--blue); font-size:.74rem; font-weight:800; letter-spacing:.15em; margin-bottom:18px; text-transform:uppercase; }
h1 { color:var(--navy); font-size:clamp(3.4rem,6.4vw,6.6rem); letter-spacing:-.065em; line-height:.94; margin-bottom:26px; max-width:760px; }
.hero-text { color:var(--muted); font-size:clamp(1.05rem,1.5vw,1.22rem); line-height:1.65; margin-bottom:30px; max-width:610px; }
.button { align-items:center; border:0; cursor:pointer; display:inline-flex; font:inherit; font-weight:760; justify-content:center; min-height:52px; padding:0 23px; transition:.2s ease; }
.button.primary { background:var(--navy); color:#fff; }
.button.primary:hover { background:var(--blue); transform:translateY(-2px); }
.hero-photo { background:var(--pale); overflow:hidden; }
.hero-photo img { height:100%; object-fit:cover; object-position:52% center; width:100%; }
.services { background:radial-gradient(circle at 88% 12%,rgba(42,163,208,.12),transparent 28rem),var(--pale); padding:clamp(70px,8vw,110px) clamp(24px,6vw,90px); }
.section-heading { align-items:end; display:grid; gap:50px; grid-template-columns:1fr .72fr; margin-bottom:44px; }
.section-heading>p { color:var(--muted); line-height:1.7; margin-bottom:2px; max-width:500px; }
h2 { color:var(--navy); font-size:clamp(2.5rem,4.4vw,4.7rem); letter-spacing:-.055em; line-height:1; margin-bottom:0; }
.service-grid { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); }
.service-card { background:rgba(255,255,255,.96); border:1px solid var(--line); min-height:285px; overflow:hidden; padding:clamp(26px,3vw,38px); transition:.22s ease; }
.service-card:hover { border-color:#9fd5e8; box-shadow:0 20px 50px rgba(7,59,92,.09); transform:translateY(-5px); }
.service-card.featured { background:var(--navy); border-color:var(--navy); color:#fff; }
.service-topline { align-items:center; display:flex; justify-content:space-between; }
.service-number { color:#89a5b4; font-family:ui-monospace,monospace; font-size:.76rem; }
.featured .service-number { color:#8bdaf2; }
.service-label { background:rgba(117,212,242,.16); color:#91e0f8; font-size:.66rem; font-weight:800; letter-spacing:.1em; padding:7px 9px; text-transform:uppercase; }
.service-mark { background:var(--blue); display:block; height:3px; margin:44px 0 25px; width:46px; }
h3 { color:var(--navy); font-size:1.55rem; margin-bottom:14px; }
.featured h3 { color:#fff; }
.service-card p { color:var(--muted); line-height:1.6; margin-bottom:0; }
.featured p { color:#c5dce7; }
.service-promises { border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); margin-top:44px; padding-top:26px; }
.service-promises>span { color:var(--muted); font-size:.88rem; padding-right:22px; }
.service-promises>span+span { border-left:1px solid var(--line); padding-left:24px; }
.service-promises strong { color:var(--navy); }
.results { background:#fff; padding:clamp(70px,8vw,110px) clamp(24px,6vw,90px); padding-bottom:52px; }
.results-heading { align-items:end; display:grid; gap:50px; grid-template-columns:1fr .72fr; margin-bottom:36px; }
.results-heading>p { color:var(--muted); line-height:1.7; margin-bottom:2px; max-width:500px; }
.results-grid { display:grid; gap:14px; grid-template-columns:minmax(0,1.7fr) minmax(220px,.7fr); height:500px; }
.results-grid>* { min-height:0; }
.results figure { margin:0; overflow:hidden; position:relative; }
.results figure img { height:100%; object-fit:cover; width:100%; }
.comparison-pair { display:grid; gap:14px; grid-template-columns:repeat(2,minmax(0,1fr)); height:100%; min-height:0; overflow:hidden; }
.result-photo { background:var(--pale); min-height:0; }
.results figcaption { background:rgba(3,42,67,.88); bottom:14px; color:#fff; font-size:.7rem; font-weight:800; left:14px; letter-spacing:.12em; padding:8px 10px; position:absolute; text-transform:uppercase; }
.work-photos { display:grid; gap:14px; grid-template-rows:1fr 1fr; height:100%; min-height:0; overflow:hidden; }
.work-photos figure { min-height:0; }
.work-photos img { object-position:center 42%; }
.about { display:grid; gap:clamp(36px,8vw,110px); grid-template-columns:.9fr 1.1fr; padding:clamp(76px,10vw,138px) clamp(24px,7vw,106px); padding-top:58px; }
.about h2 { font-size:clamp(2.5rem,4.3vw,4.6rem); }
.about-text { border-left:3px solid var(--blue); padding-left:clamp(24px,4vw,46px); }
.about-text p { color:var(--muted); font-size:1.05rem; line-height:1.75; }
.about-text p:last-child { margin-bottom:0; }
.contact-section { align-items:center; background:var(--navy); color:#fff; display:grid; gap:clamp(40px,7vw,94px); grid-template-columns:.9fr minmax(420px,1.1fr); padding:clamp(68px,9vw,120px) clamp(24px,7vw,106px); }
.contact-section .eyebrow { color:#75d4f2; }
.contact-section h2 { color:#fff; font-size:clamp(2.6rem,4.5vw,4.8rem); }
.contact-intro>p:last-of-type { color:#c4dae5; line-height:1.7; margin:25px 0 0; max-width:600px; }
.contact-details { border-top:1px solid rgba(255,255,255,.18); display:grid; gap:24px; margin-top:38px; padding-top:28px; }
.contact-details div { display:grid; gap:7px; }
.contact-details span { color:#8eddf5; font-size:.7rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.contact-details a { font-size:clamp(1.15rem,2vw,1.55rem); font-weight:750; }
#contact-form { background:#fff; box-shadow:0 24px 60px rgba(0,0,0,.18); color:var(--ink); display:grid; gap:18px; padding:clamp(28px,4vw,44px); }
#contact-form label { color:var(--navy); display:grid; font-size:.82rem; font-weight:750; gap:8px; }
#contact-form input,#contact-form textarea,#contact-form select { background:var(--pale); border:1px solid var(--line); border-radius:0; color:var(--ink); font:inherit; outline:none; padding:13px 14px; width:100%; }
#contact-form input,#contact-form select { min-height:48px; }
#contact-form textarea { min-height:135px; resize:vertical; }
#contact-form input:focus,#contact-form textarea:focus,#contact-form select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(42,163,208,.14); }
.form-row { display:grid; gap:14px; grid-template-columns:1fr 1fr; }
.form-status { background:var(--navy-dark); border-left:4px solid var(--blue); bottom:24px; box-shadow:0 18px 45px rgba(3,42,67,.28); color:#fff; font-size:.9rem; font-weight:700; line-height:1.45; margin:0; max-width:380px; opacity:0; padding:17px 20px; pointer-events:none; position:fixed; right:24px; transform:translateY(14px); transition:opacity .2s ease,transform .2s ease; visibility:hidden; z-index:100; }
.form-status.is-visible { opacity:1; transform:translateY(0); visibility:visible; }
.form-status.is-success { border-left-color:#58d29b; }
.form-status.is-error { border-left-color:#ef6a6a; }
.form-status.is-loading { border-left-color:#8eddf5; }
#contact-form button:disabled { cursor:wait; opacity:.72; }
.website-field { height:1px; left:-10000px; overflow:hidden; position:absolute; width:1px; }
footer { align-items:center; background:var(--navy-dark); color:#fff; display:flex; font-size:.88rem; font-weight:700; justify-content:space-between; padding:26px clamp(24px,7vw,106px); }
footer a { color:#86d9f3; }
footer div { display:flex; gap:24px; }
@media (max-width:850px) { .hero{grid-template-columns:1fr}.hero-photo{height:580px}.service-grid{grid-template-columns:1fr}.service-promises{gap:15px;grid-template-columns:1fr}.service-promises>span+span{border-left:0;padding-left:0}.section-heading,.results-heading{align-items:start;grid-template-columns:1fr}.results-grid{grid-template-columns:1fr;height:auto}.comparison-pair{height:390px}.work-photos{grid-template-columns:1fr 1fr;grid-template-rows:none;height:180px}.about{grid-template-columns:1fr}.contact-section{grid-template-columns:1fr} }
@media (max-width:600px) { .site-header{min-height:84px;padding:6px 16px}.brand img{height:72px;width:auto}.site-header nav>a:not(.nav-phone){display:none}.nav-phone{font-size:.78rem;padding:11px}.hero{min-height:0}.hero-copy{padding:52px 22px 56px}h1{font-size:clamp(3rem,15vw,4.4rem)}.hero-photo{height:390px}.services,.results{padding-bottom:56px;padding-top:56px}.service-card{min-height:0;padding:26px}.service-mark{margin:26px 0 20px}.results-heading{gap:24px;margin-bottom:26px}.results-grid,.comparison-pair,.work-photos{gap:9px}.comparison-pair{height:280px}.work-photos{height:112px}.results figcaption{bottom:9px;left:9px}.about-text{padding-left:22px}.form-row{grid-template-columns:1fr}.form-status{bottom:16px;left:16px;max-width:none;right:16px}footer{align-items:flex-start;flex-direction:column;gap:10px}footer div{align-items:flex-start;flex-direction:column;gap:8px} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{transition:none!important} }