/* ============================================================
   Aire Serv of Weatherford — Design Tokens
   Palette: Neighborly Navy #10254B / Service Red #D62B27 /
            Warm White #FAF7F2 / Steel #6B7684 / Sun #F4A825
   Type: 'Poppins' (display) + 'Inter' (body/UI)
   Signature: diagonal red "service stripe" — echoes the
   van livery — used as a section-divider motif throughout.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600;700;800&family=Inter:wght@400;500;600;700&family=Montserrat:wght@600;700;800&family=Nunito:wght@600;700;800&display=swap');

:root{
  --navy: #10254B;
  --navy-light: #1B3A6B;
  --red: #D62B27;
  --red-dark: #A81F1C;
  --warm: #FAF7F2;
  --steel: #6B7684;
  --sun: #F4A825;
  --line: #E4DFD5;
  --radius: 10px;
  --radius-sm: 6px;
  --font-display: 'Poppins', sans-serif;
  --font-body: 'Inter', sans-serif;
  --container-max: 1160px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--navy);
  background:var(--warm);
  line-height:1.6;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.2;}
.container{max-width:var(--container-max);margin:0 auto;padding:0 24px;}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 28px;border-radius:var(--radius-sm);font-weight:600;
  font-size:15px;border:2px solid transparent;cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--btn-primary-override, var(--red));color:#fff;box-shadow:0 6px 18px rgba(214,43,39,.28);}
.btn-primary:hover{background:var(--red-dark);}
.btn-outline{border-color:var(--btn-outline-override, #fff);color:var(--btn-outline-override, #fff);}
.btn-outline:hover{background:#fff;color:var(--navy);}
.btn-navy{background:var(--btn-navy-override, var(--navy));color:#fff;}

.eyebrow{
  display:inline-block;font-family:var(--font-display);font-weight:700;
  font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--red);margin-bottom:10px;
}

/* ---------- Diagonal Service Stripe (signature element) ---------- */
.stripe-divider{
  position:relative;height:64px;overflow:hidden;
  background:var(--warm);
}
.stripe-divider svg{width:100%;height:100%;display:block;}

/* ---------- Header ---------- */
.top-bar{
  background:var(--navy);color:#cdd6e6;font-size:13.5px;
}
.top-bar .container{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:8px;padding-bottom:8px;flex-wrap:wrap;gap:6px;
}
.top-bar a{color:#fff;font-weight:600;}
site-header,.site-header{
  background:var(--nav-bg-override, #fff);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:50;
}
.nav-wrap{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 0;
}
.logo{
  display:flex;align-items:center;gap:10px;
  font-family:var(--font-display);font-weight:800;font-size:21px;
  color:var(--navy);
}
.logo .mark{
  width:38px;height:38px;border-radius:8px;
  background:linear-gradient(135deg,var(--red),var(--red-dark));
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:19px;transform:skewX(-8deg);
}
.logo .mark span{display:inline-block;transform:skewX(8deg);}
.logo small{display:block;font-family:var(--font-body);font-weight:600;font-size:11px;letter-spacing:.06em;color:var(--steel);text-transform:uppercase;}
.nav-links{display:flex;gap:30px;align-items:center;}
.nav-links a{font-weight:600;font-size:15px;color:var(--navy);position:relative;padding:4px 0;}
.nav-links a.active,.nav-links a:hover{color:var(--red);}
.nav-cta{display:flex;align-items:center;gap:16px;}
.nav-phone{font-weight:700;font-size:16px;}
.nav-phone small{display:block;font-weight:500;font-size:11.5px;color:var(--steel);}
.burger{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--navy);}

/* ---------- Hero ---------- */
.hero{
  position:relative;background:var(--navy);color:#fff;overflow:hidden;
  padding:76px 0 96px;
}
.hero::after{
  content:"";position:absolute;right:-10%;top:-20%;width:60%;height:160%;
  background:linear-gradient(135deg,var(--red) 0%, var(--red-dark) 45%, transparent 46%);
  opacity:.9;transform:skewX(-12deg);
}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;position:relative;z-index:2;}
.hero h1{font-size:clamp(32px,4.2vw,52px);margin-bottom:18px;}
.hero p{font-size:18px;color:#dde3ee;max-width:520px;margin-bottom:32px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
.hero-badges{display:flex;gap:28px;margin-top:42px;flex-wrap:wrap;}
.hero-badges div{font-size:13.5px;color:#c6cfdf;}
.hero-badges strong{display:block;font-family:var(--font-display);font-size:26px;color:#fff;}
.hero-visual{
  position:relative;z-index:2;background:rgba(10,15,25,.5);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.2);border-radius:var(--radius);
  padding:26px;color:#fff;box-shadow:0 30px 60px rgba(0,0,0,.35);
}
.hero-visual h3{font-size:17px;margin-bottom:14px;}
.hero-visual .row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14.5px;}
.hero-visual .row:last-child{border-bottom:none;}
.hero-visual .dot{width:8px;height:8px;border-radius:50%;background:var(--red);flex-shrink:0;}

/* ---------- Sections ---------- */
section{padding:80px 0;}
.section-head{max-width:640px;margin-bottom:48px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head h2{font-size:clamp(26px,3vw,36px);}
.section-head p{color:var(--steel);margin-top:12px;font-size:16px;}

/* Services grid */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.service-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 26px;transition:box-shadow .2s ease, transform .2s ease;
}
.service-card:hover{box-shadow:0 18px 40px rgba(16,37,75,.1);transform:translateY(-4px);}
.service-icon{
  width:50px;height:50px;border-radius:9px;background:var(--navy);
  display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:18px;
  font-size:22px;
}
.service-card h3{font-size:18.5px;margin-bottom:10px;}
.service-card p{color:var(--steel);font-size:14.5px;}
.service-card a{color:var(--red);font-weight:600;font-size:14px;display:inline-block;margin-top:14px;}

/* Why us / stats */
.why-strip{background:var(--navy);color:#fff;padding:52px 0;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.stats-grid strong{display:block;font-family:var(--font-display);font-size:34px;color:var(--sun);}
.stats-grid span{font-size:13.5px;color:#c6cfdf;}

/* Two column feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.split img,.split .imgbox{border-radius:var(--radius);}
.checklist li{display:flex;gap:12px;margin-bottom:14px;font-size:15px;align-items:flex-start;}
.checklist li::before{content:"✓";flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--red);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:700;margin-top:2px;}

/* Testimonials */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.testi-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;}
.testi-stars{color:var(--sun);margin-bottom:12px;font-size:15px;}
.testi-card p{font-style:italic;color:var(--navy);margin-bottom:16px;}
.testi-name{font-weight:700;font-size:14px;color:var(--steel);}

/* CTA band */
.cta-band{
  background:linear-gradient(120deg,var(--red),var(--red-dark));
  color:#fff;padding:56px 0;text-align:center;
}
.cta-band h2{font-size:clamp(24px,3vw,32px);margin-bottom:14px;}
.cta-band p{margin-bottom:26px;color:#ffe3e2;}

/* Careers */
.job-card{
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--red);
  border-radius:var(--radius);padding:24px 26px;margin-bottom:18px;
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
}
.job-card h3{font-size:17px;margin-bottom:6px;}
.job-card p{color:var(--steel);font-size:14.5px;max-width:520px;}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;}
.contact-info-card{background:var(--navy);color:#fff;border-radius:var(--radius);padding:32px;}
.contact-info-card .row{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.14);}
.contact-info-card .row:last-child{border-bottom:none;}
.contact-info-card .row b{display:block;font-size:15px;}
.contact-info-card .row span{font-size:13.5px;color:#c6cfdf;}
.form-field{margin-bottom:16px;}
.form-field label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px;}
.form-field input,.form-field textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);
  font-family:var(--font-body);font-size:14.5px;background:#fff;
}
.form-field textarea{min-height:120px;resize:vertical;}
.form-note{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;}

/* Footer */
footer{background:var(--navy);color:#c6cfdf;padding:56px 0 24px;}
.footer-grid{display:flex;flex-wrap:wrap;gap:28px;margin-bottom:36px;}
.footer-grid > div{flex:1;min-width:150px;}
.footer-grid > div:first-child{flex:1.6;min-width:220px;}
.footer-grid h4{color:#fff;font-size:15px;margin-bottom:16px;}
.footer-grid ul li{margin-bottom:10px;font-size:14px;}
.footer-grid ul li a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}

/* Alerts */
.alert{padding:14px 18px;border-radius:8px;margin-bottom:18px;font-size:14.5px;}
.alert-success{background:#e5f6ea;color:#1c6b34;border:1px solid #b9e6c4;}
.alert-error{background:#fdeceb;color:var(--red-dark);border:1px solid #f5c6c3;}

/* Custom page rich-text content */
.page-content{font-size:16px;color:var(--navy);}
.page-content h1,.page-content h2,.page-content h3{margin:28px 0 14px;}
.page-content p{margin-bottom:16px;color:var(--steel);}
.page-content ul,.page-content ol{margin:0 0 16px 24px;}
.page-content li{margin-bottom:8px;color:var(--steel);}
.page-content img{border-radius:var(--radius);margin:20px 0;}
.page-content a{color:var(--red);text-decoration:underline;}

/* Responsive */
@media(max-width:1150px){
  /* 8 nav items (Home, Services, Areas We Serve, Gallery, About, FAQ,
     Careers, Contact) plus the phone widget and Book button no longer
     fit in one row below this width, so switch to the hamburger menu
     much earlier than a typical 2-3 item nav would need. */
  .nav-links{display:none;}
  .burger{display:block;}
}
@media(max-width:900px){
  .hero-grid,.split,.contact-grid{grid-template-columns:1fr;}
  .services-grid,.testi-grid{grid-template-columns:repeat(2,1fr);}
  .stats-grid{grid-template-columns:repeat(2,1fr);row-gap:28px;}
  .footer-grid > div{min-width:45%;}
}
@media(max-width:640px){
  .services-grid,.testi-grid{grid-template-columns:1fr;}
  .footer-grid > div,.footer-grid > div:first-child{min-width:100%;flex:1 1 100%;}
  .job-card{flex-direction:column;align-items:flex-start;}

  /* Header: prevent phone number / button / burger from
     squeezing into each other on narrow screens. */
  .nav-wrap{padding:12px 0;flex-wrap:nowrap;}
  .logo{font-size:16px;gap:8px;}
  .logo .mark{width:32px;height:32px;font-size:16px;flex-shrink:0;}
  .logo small{font-size:9.5px;}
  .logo img{height:32px !important;}
  .nav-cta{gap:8px;}
  .nav-phone{display:none;}
  .nav-cta .btn-primary{padding:10px 14px;font-size:13px;white-space:nowrap;}
  .burger{padding:6px 8px;flex-shrink:0;}
  .top-bar .container{flex-direction:column;align-items:flex-start;font-size:12px;gap:2px;}
}
@media(max-width:380px){
  .nav-cta .btn-primary{padding:9px 10px;font-size:12px;}
  .logo span > small{display:none;}
}
.service-icon svg{width:24px;height:24px;}

/* Full-bleed hero background wrapper (behind top-bar + header on homepage) */
.hero-bg-wrap{position:relative;background-size:cover;background-position:center top;}
.hero-bg-wrap .top-bar.on-photo{background:rgba(0,0,0,.28);border-bottom-color:rgba(255,255,255,.15);color:#dfe3ea;}
.hero-bg-wrap .top-bar.on-photo a{color:#fff;}
.hero-bg-wrap .site-header.on-photo{background:rgba(0,0,0,.18);backdrop-filter:blur(8px);border-bottom-color:rgba(255,255,255,.14);}
.hero-bg-wrap .site-header.on-photo .logo,.hero-bg-wrap .site-header.on-photo .nav-links a,.hero-bg-wrap .site-header.on-photo .nav-phone{color:#fff;}
.hero-bg-wrap .site-header.on-photo .nav-links a.active{color:var(--red);}
.hero-bg-wrap .site-header.on-photo .logo small{color:#dfe3ea;}

/* Content Blocks (Admin > Content Blocks) - generic sections added to any page */
.page-content-block{padding:60px 0;border-top:1px solid var(--line);}
.page-content-block h2{font-size:clamp(24px,3vw,32px);margin-bottom:18px;}

/* Optional text color overrides (Admin > Site Settings > Text Colors).
   Defaults to "inherit" so nothing changes unless explicitly set. */
:root{ --heading-color: inherit; --body-color: inherit; }
h1,h2,h3,h4,h5,h6{color:var(--heading-color);}
body{color:var(--body-color);}

/* Trust bar strip (Established / Mobile Service / Pricing / Areas) */
.trust-strip{padding:44px 0;background:var(--navy);border-bottom:1px solid rgba(255,255,255,.08);}
.trust-strip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.trust-strip-icon{width:52px;height:52px;border-radius:50%;background:rgba(214,43,39,.12);color:var(--red);display:flex;align-items:center;justify-content:center;margin:0 auto 12px;}
.trust-strip-icon span{width:24px;height:24px;display:inline-block;}
.trust-strip-item strong{display:block;font-family:'Poppins',sans-serif;font-size:15px;color:#fff;margin-bottom:2px;}
.trust-strip-item span{font-size:12.5px;color:#c6cfdf;}
@media(max-width:900px){ .trust-strip-grid{grid-template-columns:repeat(2,1fr);row-gap:28px;} }
@media(max-width:480px){ .trust-strip-grid{grid-template-columns:1fr;row-gap:24px;} }

/* Areas We Serve (homepage preview + full page) - responsive grids */
.areas-preview-grid,.areas-full-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.areas-preview-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius, 10px);padding:24px 18px;text-align:center;}
.areas-preview-icon{width:22px;height:22px;display:inline-block;color:var(--red);margin-bottom:10px;}
.areas-preview-name{font-weight:700;font-size:15.5px;color:#fff;}
.areas-preview-state{font-size:12.5px;color:#c6cfdf;}
.areas-full-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 18px;text-align:center;}
.areas-full-icon{width:24px;height:24px;display:inline-block;color:var(--red);margin-bottom:12px;}
.areas-full-name{font-weight:700;font-size:16px;color:var(--navy);}
.areas-full-state{font-size:13px;color:var(--steel);}
@media(max-width:900px){ .areas-preview-grid,.areas-full-grid{grid-template-columns:repeat(3,1fr);} }
@media(max-width:640px){ .areas-preview-grid,.areas-full-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:380px){ .areas-preview-grid,.areas-full-grid{grid-template-columns:1fr;} }

/* Hero slideshow (Admin > Hero Slideshow) - multiple rotating photos */
.hero-slideshow{position:absolute;inset:0;overflow:hidden;z-index:0;}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center top;opacity:0;transition:opacity 1.2s ease;}
.hero-slide.active{opacity:1;}
.hero-slide-dots{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:5;}
.hero-slide-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;border:1px solid rgba(255,255,255,.6);}
.hero-slide-dot.active{background:var(--red);border-color:var(--red);}
