/* ============================================================
   Scrub Squad — Site v2 ("Minimal Sage & Clay") shared stylesheet
   Design tokens + all shared components. Every page links this
   file. Page-specific one-off styles go in a <style> block in
   that page only, never redefine these base rules.
   ============================================================ */
:root{
  --ink:#22241f;
  --sage:#5c6b56;
  --sage-dark:#3c4638;
  --stone:#efece4;
  --paper:#fbfaf6;
  --line:#dfdccf;
  --muted:#7a7c73;
  --clay:#b9754a;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;color:var(--ink);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased;font-weight:300;}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:500;letter-spacing:-.01em;}
.container{max-width:1180px;margin:0 auto;padding:0 40px;}
a{color:inherit;text-decoration:none;}

header{position:sticky;top:0;z-index:50;background:rgba(251,250,246,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
nav{display:flex;align-items:center;justify-content:space-between;height:96px;}
.brand img{height:52px;width:auto;display:block;}
.navlinks{display:flex;gap:36px;font-size:13px;letter-spacing:.03em;color:var(--ink);}
.navlinks a{opacity:.65;transition:opacity .2s;position:relative;}
.navlinks a:hover, .navlinks a.active{opacity:1;}
.nav-drop{position:relative;}
.nav-drop>.drop-label{opacity:.65;transition:opacity .2s;cursor:default;}
.nav-drop:hover>.drop-label, .nav-drop.active>.drop-label{opacity:1;}
.nav-drop .drop-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:18px;opacity:0;visibility:hidden;transition:opacity .18s ease, visibility .18s ease;}
.nav-drop:hover .drop-menu{opacity:1;visibility:visible;}
.nav-drop .drop-menu-inner{background:var(--paper);border:1px solid var(--line);border-radius:4px;box-shadow:0 12px 30px rgba(0,0,0,.1);min-width:190px;padding:8px;}
.nav-drop .drop-menu-inner a{display:block;padding:10px 14px;font-size:13px;color:var(--ink);opacity:.75;border-radius:3px;transition:.15s;white-space:nowrap;}
.nav-drop .drop-menu-inner a:hover, .nav-drop .drop-menu-inner a.active{opacity:1;background:var(--stone);}
.btn-line{border-bottom:1px solid var(--ink);padding-bottom:3px;font-size:13px;letter-spacing:.02em;white-space:nowrap;}
.btn-clay{background:var(--clay);color:#fff;padding:14px 30px;font-size:13px;letter-spacing:.03em;border-radius:2px;transition:.2s;white-space:nowrap;display:inline-block;}
.btn-clay:hover{background:var(--sage-dark);}
.navcta{display:flex;align-items:center;gap:28px;}
.mobile-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px;z-index:60;}
.mobile-toggle span{width:24px;height:2px;background:var(--ink);display:block;transition:.2s;}
.mobile-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.mobile-toggle.open span:nth-child(2){opacity:0;}
.mobile-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Simple sub-page hero (image-less, text-only banner) */
.page-hero{padding:70px 0 60px;border-bottom:1px solid var(--line);}
.page-hero .kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-bottom:20px;font-weight:500;}
.page-hero h1{font-size:46px;line-height:1.1;margin-bottom:18px;color:var(--ink);max-width:760px;}
.page-hero h1 .accent{color:var(--clay);font-style:italic;}
.page-hero p{font-size:17px;color:var(--muted);max-width:560px;}
.page-hero .hero-actions{display:flex;gap:20px;align-items:center;margin-top:32px;}
.page-hero .trust-badges{display:flex;gap:24px;flex-wrap:wrap;margin-top:28px;font-size:13px;color:var(--sage-dark);}
.page-hero .trust-badges span::before{content:"✓ ";color:var(--clay);}

/* Split hero with image (homepage-style, reused on service/location pages) */
.hero{padding:60px 0 0;}
.hero-wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;min-height:560px;}
.hero-copy{display:flex;flex-direction:column;justify-content:center;padding-right:80px;padding-bottom:60px;}
.kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-bottom:28px;font-weight:500;}
.hero-copy h1{font-size:48px;line-height:1.08;margin-bottom:22px;color:var(--ink);}
.hero-copy h1 .accent{color:var(--clay);font-style:italic;}
.hero-copy p{font-size:17px;color:var(--muted);max-width:440px;margin-bottom:32px;}
.hero-actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap;}
.hero-img{position:relative;overflow:hidden;background:var(--stone);}
.hero-img img{width:100%;height:100%;object-fit:cover;display:block;min-height:480px;}

section{padding:100px 0;}
section.tight{padding:70px 0;}
.head{max-width:640px;margin-bottom:56px;}
.head.center{margin-left:auto;margin-right:auto;text-align:center;}
.head .kicker{margin-bottom:20px;}
.head h2{font-size:38px;color:var(--ink);margin-bottom:16px;}
.head p{color:var(--muted);font-size:16px;max-width:560px;}
.head.center p{margin:0 auto;}

/* Services list (numbered rows) - used on homepage + service overview blocks */
.services-list{border-top:1px solid var(--line);}
.svc-row{display:grid;grid-template-columns:90px 1fr 1fr 140px;gap:32px;align-items:center;padding:32px 0;border-bottom:1px solid var(--line);transition:.2s;}
.svc-row:hover{background:var(--stone);}
.svc-idx{font-family:'Fraunces',serif;font-size:16px;color:var(--clay);}
.svc-row h3{font-size:22px;font-weight:500;}
.svc-row p{font-size:14.5px;color:var(--muted);}
.svc-row .svc-link{font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-align:right;border-bottom:1px solid var(--ink);padding-bottom:3px;justify-self:end;white-space:nowrap;}

/* Why / benefit grid */
.why{background:var(--stone);}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;}
.why-num{font-family:'Fraunces',serif;font-size:13px;color:var(--sage);letter-spacing:.1em;margin-bottom:18px;}
.why-card h3{font-size:20px;margin-bottom:10px;font-weight:500;}
.why-card p{font-size:14.5px;color:var(--muted);}

/* Two-column content block (text + image or text + facts box) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start;}
.split.reverse{direction:rtl;}
.split.reverse > *{direction:ltr;}
.split h2{font-size:32px;margin-bottom:18px;}
.split h3{font-size:19px;margin:26px 0 12px;color:var(--sage-dark);}
.split p{color:var(--muted);font-size:15.5px;margin-bottom:16px;}
.split ul{list-style:none;margin:16px 0;}
.split ul li{padding-left:22px;position:relative;margin-bottom:12px;color:var(--muted);font-size:15px;}
.split ul li::before{content:"—";position:absolute;left:0;color:var(--clay);}
.split ul li strong{color:var(--ink);font-weight:500;}
.split img{width:100%;border-radius:4px;display:block;margin-bottom:24px;}
.facts-box{background:var(--stone);padding:32px;border-radius:4px;}
.facts-box h4{font-family:'Fraunces',serif;font-size:18px;margin-bottom:18px;font-weight:500;}
.facts-box ul{list-style:none;}
.facts-box ul li{margin-bottom:12px;font-size:14.5px;color:var(--muted);}
.facts-box ul li strong{color:var(--ink);}
.facts-box ul li::before{content:none;}

/* Neighborhood/area column grid */
.area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:40px;margin-top:20px;}
.area-col h4{font-family:'Fraunces',serif;font-size:17px;color:var(--sage-dark);margin-bottom:14px;font-weight:500;}
.area-col ul{list-style:none;}
.area-col ul li{font-size:14.5px;color:var(--muted);padding:5px 0;border-bottom:1px solid var(--line);}

/* Locations grid */
.loc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.loc-grid.cols-2{grid-template-columns:repeat(2,1fr);max-width:760px;}
.loc-card{border:1px solid var(--line);padding:40px 32px;transition:.25s;background:var(--paper);}
.loc-card:hover{background:var(--sage-dark);color:#fff;}
.loc-card:hover p, .loc-card:hover a{color:#e6e5db;}
.loc-card h3{font-size:24px;margin-bottom:12px;}
.loc-card p{font-size:14px;color:var(--muted);margin-bottom:20px;}
.loc-card a{font-size:12px;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:3px;}
.loc-nav{display:flex;gap:8px;margin-bottom:40px;flex-wrap:wrap;}
.loc-nav a{padding:10px 22px;border:1px solid var(--line);font-size:13px;border-radius:2px;transition:.2s;}
.loc-nav a:hover, .loc-nav a.active{background:var(--sage-dark);color:#fff;border-color:var(--sage-dark);}

/* Industry/benefit card grid (6-up) */
.icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;}
.icon-card{padding:28px;border:1px solid var(--line);border-radius:4px;}
.icon-card .emoji{font-size:28px;margin-bottom:16px;}
.icon-card h3{font-size:18px;margin-bottom:8px;font-weight:500;}
.icon-card p{font-size:14px;color:var(--muted);}

/* Testimonials */
.testi{background:var(--sage-dark);color:#fff;}
.testi .head h2{color:#fff;}
.testi .head p{color:#c3cabb;}
.testi .kicker{color:#a9b89e;}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
.testi-card p{font-family:'Fraunces',serif;font-size:18px;font-style:italic;line-height:1.5;margin-bottom:20px;color:#f2f1ea;}
.testi-author{font-size:12px;letter-spacing:.05em;color:#b9c2ac;}
.testi-author b{display:block;color:#fff;font-size:14px;font-family:'Inter';font-weight:500;margin-bottom:3px;}

/* CTA banner */
.cta{text-align:center;}
.cta .head{margin:0 auto 36px;}
.cta-actions{display:flex;gap:24px;justify-content:center;align-items:center;flex-wrap:wrap;}

/* Forms (quote + contact) */
.form-wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:start;}
.form-card{background:#fff;border:1px solid var(--line);padding:44px;border-radius:4px;}
.form-card h2{font-size:26px;margin-bottom:24px;}
.field{margin-bottom:20px;}
.field label{display:block;margin-bottom:8px;font-size:13px;font-weight:500;color:var(--ink);}
.field input, .field select, .field textarea{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:3px;font-size:15px;font-family:'Inter',sans-serif;background:var(--paper);color:var(--ink);}
.field input:focus, .field select:focus, .field textarea:focus{outline:none;border-color:var(--clay);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.consent-box{background:var(--stone);border-radius:3px;padding:16px;margin-bottom:20px;font-size:13px;color:var(--muted);}
.consent-box label{display:flex;gap:10px;align-items:flex-start;cursor:pointer;}
.consent-box input{width:auto;margin-top:3px;flex-shrink:0;}
.radio-row{display:flex;gap:20px;}
.radio-row label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;font-weight:400;}
.radio-row input{width:auto;}
.submit-btn{width:100%;padding:16px;background:var(--clay);color:#fff;border:none;border-radius:3px;font-size:15px;letter-spacing:.02em;cursor:pointer;transition:.2s;font-family:'Inter',sans-serif;}
.submit-btn:hover{background:var(--sage-dark);}
.form-note{margin-top:14px;text-align:center;color:var(--muted);font-size:13px;}
.form-note a{text-decoration:underline;}
.side-box{background:var(--stone);padding:32px;border-radius:4px;margin-bottom:20px;}
.side-box h4{font-family:'Fraunces',serif;font-size:17px;margin-bottom:16px;font-weight:500;}
.side-box ol, .side-box ul{padding-left:20px;color:var(--muted);font-size:14.5px;}
.side-box ol li, .side-box ul li{margin-bottom:10px;}
.side-box.dark{background:var(--sage-dark);color:#fff;}
.side-box.dark h4{color:#fff;}

/* Legal/prose pages (privacy, terms) */
.prose{max-width:820px;margin:0 auto;background:#fff;border:1px solid var(--line);padding:56px;border-radius:4px;}
.prose p{color:var(--muted);font-size:15.5px;margin-bottom:16px;}
.prose h2{font-size:22px;margin-top:36px;margin-bottom:14px;color:var(--ink);}
.prose ul{margin:12px 0 20px 22px;color:var(--muted);font-size:15px;}
.prose ul li{margin-bottom:8px;}
.prose a{text-decoration:underline;color:var(--sage-dark);}
.prose strong{color:var(--ink);font-weight:500;}
.prose .meta{color:var(--muted);font-size:14px;margin-bottom:28px;}

/* Photo gallery strip (multi-image rows) */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.gallery-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.gallery-grid img{width:100%;height:230px;object-fit:cover;border-radius:4px;display:block;transition:.3s;}
.gallery-grid img:hover{transform:scale(1.02);}

footer{background:var(--ink);color:#a8a99e;padding:80px 0 32px;font-size:14px;}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:48px;margin-bottom:60px;}
.foot-logo-box{display:inline-block;margin-bottom:18px;}
.foot-logo-box img{height:44px;display:block;}
.foot-col h5{color:#fff;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:20px;font-weight:500;}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:12px;}
.foot-col a{opacity:.85;transition:.2s;}
.foot-col a:hover{opacity:1;color:var(--clay);}
.foot-social{display:flex;gap:14px;margin-top:16px;}
.foot-social a{opacity:.7;transition:.2s;}
.foot-social a:hover{opacity:1;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:26px;display:flex;justify-content:space-between;font-size:12px;opacity:.6;flex-wrap:wrap;gap:12px;}

@media(max-width:960px){
  .mobile-toggle{display:flex;}
  .navlinks{
    display:flex;flex-direction:column;align-items:flex-start;gap:0;
    position:fixed;top:0;right:0;height:100vh;width:min(320px,80vw);
    background:var(--paper);border-left:1px solid var(--line);
    padding:100px 32px 32px;box-shadow:-8px 0 30px rgba(0,0,0,.12);
    transform:translateX(100%);transition:transform .25s ease;z-index:55;
    overflow-y:auto;
  }
  .navlinks.open{transform:translateX(0);}
  .navlinks a{opacity:1;padding:16px 0;width:100%;border-bottom:1px solid var(--line);font-size:16px;}
  .nav-drop{width:100%;}
  .nav-drop>.drop-label{display:block;padding:16px 0;width:100%;border-bottom:1px solid var(--line);font-size:16px;opacity:1;}
  .nav-drop .drop-menu{position:static;padding-top:0;opacity:1;visibility:visible;transform:none;max-height:0;overflow:hidden;transition:max-height .2s ease;}
  .nav-drop.open .drop-menu{max-height:220px;}
  .nav-drop .drop-menu-inner{background:none;border:none;box-shadow:none;padding:0 0 0 16px;min-width:0;}
  .nav-drop .drop-menu-inner a{border-bottom:1px solid var(--line);padding:14px 0;}
  .nav-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:54;}
  .nav-overlay.open{display:block;}
  .hero-wrap, .split, .form-wrap{grid-template-columns:1fr;gap:36px;}
  .hero-copy{padding-right:0;padding-bottom:0;}
  .hero-img img{min-height:340px;}
  .services-list .svc-row{grid-template-columns:1fr;gap:8px;}
  .why-grid, .loc-grid, .testi-grid, .foot-grid, .icon-grid, .field-row, .gallery-grid{grid-template-columns:1fr 1fr;}
  .page-hero h1{font-size:34px;}
  .hero-copy h1{font-size:34px;}
  .prose{padding:32px;}
}
@media(max-width:520px){
  .why-grid, .loc-grid, .testi-grid, .foot-grid, .icon-grid, .field-row, .gallery-grid, .loc-grid.cols-2{grid-template-columns:1fr;}
  .cta-actions, .hero-actions{flex-direction:column;align-items:stretch;}
  .container{padding:0 20px;}
}
