:root {
    --blue: #005b96;
    --blue-dark: #073f6b;
    --green: #3aaa35;
    --green-dark: #238729;
    --ink: #15344f;
    --muted: #5d7283;
    --line: #dbe6ee;
    --soft: #f4f9fc;
    --white: #ffffff;
    --shadow: 0 14px 35px rgba(12, 65, 103, 0.10);
    --radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; color: var(--ink); background: var(--white); line-height: 1.6; font-size:15px; }
a { color: var(--blue); text-decoration: none; }
img { max-width: 100%; }
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.narrow { max-width: 850px; }
.centered { text-align: center; }
.top-gap { margin-top: 30px; }
.brand {
    max-width: 190px;
}
.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.98); border-bottom: 1px solid var(--line); }
.header-row { display: flex; align-items: center; gap: 28px; min-height: 82px; }
.brand { display: inline-flex; align-items: center; gap: 9px; color: var(--blue-dark); min-width: 185px; }
.brand-mark { width: 46px; height: 52px; display: grid; place-items: center; border-radius: 12px 24px 12px 24px; background: linear-gradient(145deg,var(--green),var(--blue)); color: white; font-size: 34px; font-weight: 800; }
.brand-text { display: flex; flex-direction: column; line-height: 1.05; }
.brand-text strong { font-size: 22px; }
.brand-text small { text-transform: uppercase; letter-spacing: .08em; font-size: 10px; }
.main-nav { margin-left: auto; }
.nav-toggle { display: none; background: none; border: 0; font-size: 26px; }
.nav-menu { display: flex; align-items: center; gap: 22px; }
.nav-menu > a, .nav-drop-button { font: inherit; color: var(--ink); background: none; border: 0; padding: 28px 0; cursor: pointer; }
.nav-dropdown { position: relative; }
.dropdown-menu { display: none; position: absolute; top: 70px; left: -20px; width: 260px; padding: 12px; background: white; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.dropdown-menu a { display: block; padding: 9px 10px; border-radius: 8px; }
.dropdown-menu a:hover { background: var(--soft); }
.nav-dropdown:hover .dropdown-menu { display: block; }
.header-contact { display: flex; align-items: center; gap: 14px; }
.phone-link { font-weight: 800; color: var(--blue-dark); }

.button { display: inline-flex; justify-content: center; align-items: center;padding:5px 15px; border-radius: 999px; font-weight: 800; border: 2px solid transparent;     text-align: center;}
.button-green { background: var(--green); color: white; }
.button-green:hover { background: var(--green-dark); }
.button-outline { border-color: var(--blue); color: var(--blue); background: white; }
.full { width: 100%; }

.home-hero, .service-hero { padding: 72px 0; background: radial-gradient(circle at 80% 20%, #e7f8eb, transparent 30%), linear-gradient(135deg,#f8fcff,#edf7fb); }
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 58px; align-items: center; }
.eyebrow, .section-heading span { color: var(--blue); font-weight: 800; text-transform: uppercase; letter-spacing: .14em; font-size: 12px; }
h1 { margin: 10px 0 18px; font-size: clamp(38px, 6vw, 68px); line-height: 1.02; color: var(--blue-dark); }
h2 { color: var(--blue-dark); line-height: 1.15; }
.hero-lead { font-size: 20px; color: var(--muted); max-width: 720px; }
.hero-actions { display: flex; gap: 12px; margin: 28px 0 22px; flex-wrap: wrap; }
.hero-points { display: flex; flex-wrap: wrap; gap: 10px; }
.hero-points span { padding: 8px 13px; border-radius: 999px; background: white; border: 1px solid var(--line); font-weight: 700; font-size: 14px; }

.quote-card { background: white; padding: 26px; border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--line); }
.quote-card h2 { margin-top: 0; font-size: 30px; }
.quote-card form { display: grid; gap: 12px; }
.quote-card label { display: grid; gap: 5px; font-weight: 700; font-size: 14px; }
.quote-card label span { font-weight: 400; color: var(--muted); }
.quote-card input, .quote-card select, .quote-card textarea { width: 100%; border: 1px solid #cbd9e2; border-radius: 9px; padding: 12px 13px; font: inherit; background: white; }
.quote-card .consent { display: flex; align-items: flex-start; gap: 9px; font-weight: 400; font-size: 12px; }
.quote-card .consent input { width: auto; margin-top: 4px; }

.section { padding: 76px 0; }
.section-soft { background: var(--soft); }
.section-heading { max-width: 790px; margin-bottom: 34px; }
.section-heading.centered { margin-left: auto; margin-right: auto; }
.section-heading h2 { margin: 8px 0; font-size: clamp(30px,4vw,46px); }
.services-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.service-card, .feature-grid article, .steps-grid article, .content-card, .side-card { padding: 25px; background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 9px 25px rgba(12,65,103,.06); }
.service-card h2, .service-card h3 { margin-top: 0; }
.service-card a { font-weight: 800; }
.feature-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.feature-grid strong { color: var(--blue-dark); font-size: 18px; }
.steps-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.steps-grid b { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--blue); color: white; }
.content-grid { display: grid; grid-template-columns: 1.5fr .7fr; gap: 28px; align-items: start; }
.check-list { padding-left: 20px; }
.side-links { display: grid; gap: 8px; margin-bottom: 20px; }
.side-links a { padding: 11px 12px; border-radius: 10px; background: var(--soft); font-weight: 700; }
.link-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; }
.link-grid a, .location-card { padding: 15px; background: white; border: 1px solid var(--line); border-radius: 12px; font-weight: 800; }
.location-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }
.page-hero { padding:30px 0; background: linear-gradient(135deg,#edf7fb,#f7fcf8); }
.page-hero.compact h1 { font-size: clamp(36px,5vw,56px); }

.cta-band { padding: 44px 0; color: white; background: linear-gradient(105deg,var(--blue-dark),var(--blue)); }
.cta-band h2 { color: white; margin: 0 0 7px; font-size: 34px; }
.cta-row { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }

.site-footer { background: #073b63; color: #d7e8f3; padding: 60px 0 25px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
.site-footer h3 { color: white; }
.site-footer a { display: block; color: #e6f1f7; margin: 8px 0; }
.footer-brand { color: white; }
.footer-phone { font-size: 22px; font-weight: 800; }
.footer-bottom { margin-top: 35px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.14); font-size: 13px; }
.mobile-cta { display: none; }


form#contactForm {padding: 20px;background:linear-gradient(135deg, #095bb8, #0aa7eb);box-shadow: 0 0 10px #0000004f;border-radius: 10px; color:#fff;}
.form-control{width: 100%;border: 1px solid #cddce9;border-radius: 10px;padding:7px 10px;font: inherit;color:#10233f;background: #fff;}
.form-grid {display:grid;grid-template-columns: repeat(2, 1fr);gap:6px 10px;}
.full{grid-column: 1 / -1;}
span.label {font-size: 14px;}
button.btn.green.full-btn.btn-submit {background:linear-gradient(135deg, #165499, #05151c);color: #fff;width: 100%;margin: 10px 0;cursor: pointer;padding: 15px;border: 0;border-radius: 10px;display: block;}
p.form-note {font-size: 11px;text-align: center;margin: 0;}
.headTitle{text-align:center;}
div#quote-form-title {font-weight: bold;text-align: center;font-size: 28px;}
.form-consent{text-align: center;color: #fff;}
.form-control.invalidField,.form-control.is-invalid {border: 2px solid red !important;}
.form-control.valid {border: 2px solid #28a745 !important;}
.error {display: block;color: red;font-size: 12px;margin-top: 4px;}
.honeypot {position: absolute !important;left: -9999px !important;width: 1px !important;height: 1px !important;overflow: hidden !important;}
.loader {display: inline-block;width: 14px;height: 14px;border: 2px solid rgba(255,255,255,.4);border-top-color: #fff;border-radius: 50%;animation: spin .7s linear infinite;vertical-align: middle;margin-right: 5px;}
@keyframes spin {to {transform: rotate(360deg);}}
 
.form-control::placeholder{font-size:12px;}
select::placeholder{font-size:12px;}
select{font-size:12px;}
.date_time{font-size:12px; padding:8px 10px;}
p.form-consent a {font-weight: 700;color: #f3dd65;}

.topsection {display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 40px;}
 
@media (max-width:359px) {
.form-grid{grid-template-columns:1fr;}   
}

@media (max-width: 991px) {
.topsection{grid-template-columns:1fr;}
.nav-toggle { display: block; }
.main-nav { margin-left: auto; }
.nav-menu {display:none;position:fixed;top:0;left:0;right: 0;flex-direction:column;align-items:stretch;gap:0;padding:14px;background:white;border:0;border-radius:0;box-shadow:var(--shadow);max-width:300px;height:100vh;overflow:auto;}
.nav-menu.open { display: flex; }
.nav-menu > a, .nav-drop-button { padding: 12px; text-align: left; }
.dropdown-menu { position: static; display: block; width: auto; box-shadow: none; border: 0; padding-left: 18px; }
.hero-grid, .content-grid { grid-template-columns: 1fr; }
.services-grid { grid-template-columns: repeat(2,1fr); }
.feature-grid, .steps-grid { grid-template-columns: repeat(2,1fr); }
.link-grid { grid-template-columns: repeat(2,1fr); }
.location-grid { grid-template-columns: repeat(3,1fr); }
.footer-grid { grid-template-columns: repeat(2,1fr); }
.nav-menu > a, .nav-drop-button{        padding: 7px 0;}
.dropdown-menu{padding-left: 0;padding: 0;}
.dropdown-menu a{  border-radius: 8px;border-bottom: 1px solid #eee;  padding: 5px 10px;}
}

@media (max-width:767px) {
.footer-grid{gap:0;}
}

@media (max-width: 640px) {
.container { width: min(100% - 28px, 1180px); }
.header-row { min-height: 72px; }
.brand-text strong { font-size: 18px; }
.home-hero, .service-hero, .section { padding: 48px 0; }
h1 { font-size: 40px; }
.hero-lead { font-size: 17px; }
.services-grid, .feature-grid, .steps-grid, .link-grid, .location-grid, .footer-grid { grid-template-columns: 1fr; }
.cta-row { flex-direction: column; align-items: flex-start; }
.mobile-cta { position: fixed; bottom: 0; left: 0; right: 0; z-index: 200; display: grid; grid-template-columns: 1fr 1fr; box-shadow: 0 -5px 20px rgba(0,0,0,.15); }
.mobile-cta a { padding: 14px; text-align: center; font-weight: 800; color: white; background: var(--blue); }
.mobile-cta a:last-child { background: var(--green); }
body { padding-bottom: 52px; }
}

@media screen and (min-width:480px) and (max-width: 991px) {
.header-row {min-height: auto;padding: 5px 0;gap: 0;}
.brand{min-width: 150px;}
.brand-mark{font-size: 20px;width: 30px;height: 40px;}
.brand-text small{font-size: 9px;}
.header-contact{gap:10px;}
.button{    font-size: 13px;    padding: 5px 10px;font-weight: 500;}
}

@media (max-width:479px) {
.header-row {min-height: auto;padding: 5px 0;}
.header-contact {position: fixed;top: 62px;left: 0;right: 0;background: #005b96;padding: 5px 15px;justify-content: space-between;color: #fff;}
.phone-link {font-weight: 800;color: #fff;}
.button-green{    padding: 5px 10px;font-weight: 500;}
.main-nav{        z-index: 9;}
}

