.site-header .brand img{width:128px;height:128px;object-fit:contain}
:root{--pad-inline:clamp(14px,4vw,22px);} 
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..900;1,9..144,300..900&display=swap');

:root{
  --brand:#2364a6;
  --brand-dark:#1b4d83;
  --ink:#0d2033;
  --muted:#6b7c8f;
  --bg:#f2ebde;
  --card:#ffffff;
  --radius:16px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;color:var(--ink);background:var(--bg);overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-dark)}


.site-header{position:sticky;top:0;background:var(--bg);border-bottom:1px solid #e9eef5;z-index:50}
.site-header .brand{display:flex;align-items:center;gap:1rem;padding:16px 18px;font-weight:800;font-size:1.5rem}
.brand-line2{display:block;font-weight:600;font-size:1.05rem;color:var(--muted)}

.nav-toggle{margin-left:auto;margin-right:12px;border:0;background:none;font-size:1.5rem;display:inline-block}
.site-nav{display:none;gap:18px;padding:0 16px 14px}
.site-nav a{font-weight:600}
.nav-open .site-nav{display:flex;flex-wrap:wrap}

@media(min-width:900px){
  .site-header{display:flex;align-items:center;justify-content:space-between;padding:8px 24px}
  .nav-toggle{display:none}
  .site-nav{display:flex;padding:0}
  
  .brand-line1{font-size:1.5rem}
  .brand-line2{font-size:1.05rem}
}

.site-main{max-width:1100px;margin:0 auto;padding:18px}

.hero,.page-hero{background:linear-gradient(180deg,#e9f1fb,transparent 60%);padding:18px;border-radius:var(--radius)}
.badge{display:inline-block;background:#e9f1fb;color:var(--brand-dark);padding:6px 10px;border-radius:999px;font-weight:700;margin-bottom:8px}
h1{font-size:2.1rem;margin:.25rem 0 0}
.lede{color:var(--muted);max-width:60ch}

.cta-row{display:flex;gap:12px;margin:16px 0 18px}
.btn{display:inline-block;padding:14px 18px;border-radius:12px;font-weight:700;border:2px solid transparent}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-dark)}
.btn-ghost{background:var(--bg);border-color:#cfe0f6;color:var(--brand);}
.btn-ghost:hover{border-color:var(--brand)}

.cards{margin-top:24px}
.card-grid{display:grid;gap:14px;grid-template-columns:1fr}
.card{background:var(--card);padding:18px;border-radius:16px;border:1px solid #e9eef5;box-shadow:0 1px 2px rgba(13,32,51,.04)}
.card h3{margin-top:0}
@media(min-width:680px){.card-grid{grid-template-columns:repeat(3,1fr)}}

.page-hero{margin-bottom:18px}
.service-section{background:var(--bg);border:1px solid #e9eef5;border-radius:16px;padding:16px;margin:14px 0}
.service-section h2{margin-top:0}

.cta-center{text-align:center;margin:28px 0}

.gallery-grid{display:grid;gap:10px;grid-template-columns:1fr;max-width:100%;}
.gallery-item{border-radius:12px;overflow:hidden;border:1px solid #e9eef5;box-shadow:0 1px 2px rgba(13,32,51,.04)}
.gallery-item img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px;}
@media(min-width:720px){.gallery-grid{display:grid;gap:10px;grid-template-columns:1fr;max-width:100%;}.gallery-item img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px;}}

.steps{background:var(--bg);border:1px solid #e9eef5;border-radius:16px;padding:16px;margin:14px 0}
.steps li{margin:.5rem 0}

.contact-block .contact-card{background:var(--bg);border:1px solid #e9eef5;border-radius:16px;padding:16px;max-width:640px;margin:0 auto}
.contact-form{display:grid;gap:10px;margin-top:8px}
.contact-form input,.contact-form textarea{width:100%;padding:12px;border:1px solid #d7e3f3;border-radius:10px}

.site-footer{margin-top:36px;padding:24px 16px;background:#0d2033;color:#d4dde8}
.site-footer a{color:#9cc3ff}
.footer-inner{display:flex;gap:24px;flex-wrap:wrap;justify-content:space-between;max-width:1100px;margin:0 auto}
.mini-nav a{margin-right:12px}
.copyright{text-align:center;color:#8aa0b9;margin:10px 0 0}

/* BEFORE/AFTER SLIDER */
.ba-slider{position:relative;border-radius:16px;overflow:hidden;margin:14px 0;border:1px solid #e9eef5;background:#000}
.ba-slider::before{content:"";display:block;padding-top:56.25%;} /* fallback ratio */
.ba-slider[data-ratio="16/9"]::before{padding-top:56.25%}
.ba-track{position:absolute;inset:0}
.ba-track img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-track .ba-top{clip-path:inset(0 50% 0 0)}
.ba-handle{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--bg);box-shadow:0 0 0 2px rgba(35,100,166,.5);cursor:ew-resize}
.ba-handle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:var(--bg);border:3px solid var(--brand);box-shadow:0 4px 10px rgba(13,32,51,.2)}


/* --- Gallery grid refreshed --- */
.gallery-grid{display:grid;gap:10px;grid-template-columns:1fr;max-width:100%;}
.gallery-card{
  border-radius:16px;
  overflow:hidden;
  background:var(--bg);
  box-shadow:0 1px 2px rgba(0,0,0,.06);
}
.gallery-card img{
  display:block;
  width:100%;
  height:auto;
}
@media (min-width:900px){
  .gallery-grid{display:grid;gap:10px;grid-template-columns:1fr;max-width:100%;}
}


/* --- Logo sizing tweak: larger but responsive --- */
.site-logo img, .brand img, header .logo img {
  height: clamp(44px, 8.5vw, 72px);
  width: auto;
}
@media (min-width: 768px){
  .site-logo img, .brand img, header .logo img { height: clamp(56px, 6.5vw, 88px); }
}



/* --- Mobile polish: insurance card centering & contact form stack --- */
@media (max-width: 768px){
  .container, .page, .section, .content, .wrap { padding-left: 16px; padding-right: 16px; }
  .info-card, .insurance-card, .claim-box, .callout, .card {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
  }
}
/* tighter inner padding for cards so text doesn't look off-center on small screens */
.info-card, .insurance-card, .claim-box, .callout, .card{
  padding-left: clamp(14px, 4vw, 22px);
  padding-right: clamp(14px, 4vw, 22px);
}

/* Contact form cleanup on mobile */
@media (max-width: 600px){
  .contact-form, form.contact, .contact form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .contact-form .row, .form-row { display: contents; }
  .contact-form input, .contact-form textarea,
  form.contact input, form.contact textarea, .contact form input, .contact form textarea{
    width: 100%;
  }
  .contact-cta, .contact form button, .contact-form button[type="submit"]{
    width: 100%;
  }
}
/* Remove duplicate footer links block if present */
.footer-mini, .mini-nav + .address-block { display:none; }

/* Premium type styling for home cards */
section.cards > h2, section.cards .card h3{
  font-family: 'Fraunces', serif;
  letter-spacing: .2px;
}
section.cards .card h3{ font-weight: 700; font-size: 1.1rem; }
section.cards > h2{ font-weight: 800; font-size: 1.45rem; margin-bottom: 10px; }

/* Insurance steps alignment: keep the step card visually aligned under the hero heading */
.card ol{ list-style-position: inside; padding-left: 0; margin: 0; }
.card li{ padding-left: 0; margin-left: 0; }

@media (max-width: 768px){
  .site-main{ padding-left: 16px; padding-right: 16px; }
  .page-hero, .card{ margin-left: auto; margin-right: auto; }
}

/* Normalize left/right padding so hero + cards line up perfectly */
.page-hero{padding-left:var(--pad-inline);padding-right:var(--pad-inline);}
.card{padding-left:var(--pad-inline);padding-right:var(--pad-inline);}
.site-main{padding-left:16px;padding-right:16px;}
.card ol{list-style-position:inside;margin-left:0;padding-left:0;}
.card li{margin-left:0;padding-left:0;}

/* Service Areas as clean single-line bubbles (stacked) */
.chip-row{display:flex;flex-direction:column;gap:10px;}
.chip{display:block;border:1px solid #e1e8f3;border-radius:999px;background:var(--bg);padding:10px 14px;
      text-align:center;font-weight:600;box-shadow:0 1px 1px rgba(13,32,51,.03)}
@media (min-width: 900px){
  /* On larger screens, show 2 columns to avoid excessive vertical length */
  .chip-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
}

/* Personalized typography for service cards */
section.cards > h2{font-family:'Montserrat',sans-serif;font-weight:800;letter-spacing:.2px}
section.cards .card h3{font-family:'Montserrat',sans-serif;font-weight:800;letter-spacing:.2px}
section.cards .card p{font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;font-size:1rem;line-height:1.55}


/* Ensure card text fits nicely within rounded boxes on mobile */
.cards .card p,
.card p{margin:8px 0 0; line-height:1.55;}

/* Add a little extra padding so text doesn't crowd the edges */
.card{padding:20px;}
@media (min-width: 680px){
  .card{padding:22px;}
}

/* Service area chips: force pill look on all screens */
.chip{display:inline-block;border:1px solid #e1e8f3;border-radius:999px;background:var(--bg);padding:10px 14px;font-weight:600;box-shadow:0 1px 1px rgba(13,32,51,.03)}
.chip-row{display:flex;flex-wrap:wrap;gap:10px}


/* Fitment guard for small phones */
@media (max-width: 360px){.brand-line1{font-size:1.5rem}.brand-line2{font-size:1.05rem}}
  .brand-line2{font-size:1.05rem}
}


/* v4 contact normalization */
.contact form label{display:block;font-weight:600;margin:10px 0 6px}
.contact form input[type="text"],
.contact form input[type="email"],
.contact form input[type="tel"],
.contact form textarea{width:100%;padding:12px 14px;border:1px solid #e1e8f3;border-radius:14px;font:inherit}
.contact form textarea{min-height:120px;resize:vertical}
.contact form button[type="submit"], .contact form button{display:inline-block;padding:12px 18px;border-radius:14px;border:none;background:#2364a6;color:#fff;font-weight:700}


/* contact fitment v4.1 */
.contact main .card{background:#fff;border-radius:16px;padding:20px}
.contact form{max-width:760px;margin:0 auto}
.contact .form-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:680px){
  .contact .form-grid.two-col{grid-template-columns:1fr 1fr}
  .contact .form-grid .span-2{grid-column:1 / -1}
}
.contact form label{display:block;font-weight:600;margin:6px 0 4px}
.contact form input[type="text"],
.contact form input[type="email"],
.contact form input[type="tel"],
.contact form textarea{width:100%;padding:12px 14px;border:1px solid #e1e8f3;border-radius:14px;font:inherit}
.contact form textarea{min-height:130px;resize:vertical}
.contact form button[type="submit"]{padding:12px 18px;border-radius:14px;border:none;background:#2364a6;color:#fff;font-weight:700}