/* ==========================================================================
   Patriot Pickup Waste Solutions — brand theme
   Palette sampled directly from the owner's logo artwork (2026-10-06):
     navy base   #001830 / #0a2032   (dominant, ~34% of logo pixels)
     olive green #304830 / #495544   (secondary brand colour)
     gold / tan  #a89060 / #93876a   (primary accent)
     red         #a81830             (minor accent only — bunting + details)
     cream       #f3f5f2             (off-white from the badge field)
   ========================================================================== */
:root{
  --navy:#0f2338;        /* lifted from #001830 for on-screen legibility */
  --navy-deep:#0a1a2c;
  --navy-mid:#16324d;
  --navy-soft:#1d3f5e;

  --olive:#4a5c46;       /* brand green */
  --olive-deep:#3c4b45;
  --olive-light:#5d7257;

  --gold:#a89060;        /* primary accent */
  --gold-light:#c2a878;
  --gold-deep:#8a7248;

  --red:#a81830;         /* minor accent only */
  --red-deep:#871226;

  --cream:#f4f2ec;
  --ink:#16202b;
  --muted:#5a6673;
  --line:#dfe3e6;
  --bg:#ffffff;
  --bg-alt:#f6f5f1;
  --ok:#3f6b45;

  --radius:10px;
  --shadow:0 1px 3px rgba(15,35,56,.10),0 10px 26px rgba(15,35,56,.07);
  --wrap:1140px;
  --font:'Barlow','Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --font-display:'Oswald','Arial Narrow',Impact,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.68;font-size:17px}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy-mid);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:10px 14px;border-radius:6px;z-index:99}

/* ---------- typography ---------- */
h1,h2,h3,.display{font-family:var(--font-display);font-weight:600;letter-spacing:.4px;line-height:1.18}
h2{font-size:2.05rem;margin:0 0 8px;text-transform:uppercase;color:var(--navy)}
h3{font-size:1.2rem;margin:0 0 8px;text-transform:uppercase;color:var(--navy);letter-spacing:.6px}
.sub{color:var(--muted);font-size:1.08rem;margin:0 0 34px;max-width:64ch;font-family:var(--font)}

/* ---------- header ---------- */
.topbar{background:var(--navy-deep);color:#b9c9d9;font-size:14px;padding:7px 0;border-bottom:1px solid rgba(168,144,96,.25)}
.topbar .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.topbar a{color:#e8eef5}
.topbar strong{color:var(--gold-light)}

header.site{background:var(--navy);position:sticky;top:0;z-index:50;border-bottom:2px solid var(--gold)}
.nav{display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:13px;color:#fff;padding:10px 0}
.brand:hover{text-decoration:none}
.brand img.crest{width:54px;height:54px;flex:0 0 auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.brand .nm{font-family:var(--font-display);line-height:1;font-size:25px;font-weight:700;
  text-transform:uppercase;letter-spacing:1.4px;color:#fff}
.brand .nm span{display:block;font-family:var(--font);font-weight:600;font-size:10.5px;
  letter-spacing:2.1px;color:var(--gold);text-transform:uppercase;margin-top:3px}
nav.main{margin-left:auto;display:flex;align-items:center;gap:2px;flex-wrap:wrap}
nav.main a{color:#d8e3ee;padding:10px 11px;border-radius:7px;font-size:15px;font-weight:500}
nav.main a:hover{background:rgba(168,144,96,.18);color:#fff;text-decoration:none}
nav.main a[aria-current="page"]{background:rgba(168,144,96,.24);color:#fff}
.btn{display:inline-block;border:0;cursor:pointer;font:inherit;font-weight:700;border-radius:8px;
  padding:12px 20px;text-align:center;font-family:var(--font-display);text-transform:uppercase;
  letter-spacing:1.1px;font-size:15px}
.btn-primary{background:var(--gold);color:var(--navy-deep)}
.btn-primary:hover{background:var(--gold-light);text-decoration:none}
.btn-ghost{background:transparent;color:#fff;border:2px solid var(--gold)}
.btn-ghost:hover{background:rgba(168,144,96,.2);text-decoration:none}
.btn-outline{border:2px solid var(--navy);color:var(--navy);background:#fff}
.btn-outline:hover{background:var(--navy);color:#fff;text-decoration:none}
.btn-lg{padding:15px 26px;font-size:17px}
.header-cta{background:var(--red);color:#fff !important;margin-left:6px}
.header-cta:hover{background:var(--red-deep) !important}
.navtoggle{display:none}
#navchk{display:none}

/* ---------- hero ---------- */
.hero{background:
   linear-gradient(160deg,var(--navy-deep) 0%,var(--navy) 50%,var(--navy-mid) 100%);
  color:#fff;padding:60px 0 54px;position:relative;border-bottom:3px solid var(--olive)}
.hero h1{font-size:2.6rem;line-height:1.1;margin:0 0 16px;text-transform:uppercase;letter-spacing:.6px}
.hero p.lede{font-size:1.2rem;color:#cfdded;max-width:44ch;margin:0 0 26px;font-family:var(--font)}
.hero .btns{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.hero .phone{color:#fff;font-weight:700;font-size:1.1rem}
.hero-split{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.hero-crest{width:min(320px,80%);margin:0 auto;filter:drop-shadow(0 14px 30px rgba(0,0,0,.5))}
.hero-card{background:rgba(74,92,70,.28);border:1px solid rgba(168,144,96,.45);
  border-radius:14px;padding:26px}
.hero-card h3{margin:0 0 14px;font-size:1rem;letter-spacing:1.8px;color:var(--gold-light)}
.hero-card ul{margin:0;padding-left:20px;color:#e7eff7}
.hero-card li{margin-bottom:9px}

/* ---------- trust ---------- */
.trust{background:var(--olive-deep);padding:15px 0}
.trust ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 30px;justify-content:center}
.trust li{font-size:14.5px;font-weight:600;color:#eef3f6;display:flex;align-items:center;gap:8px;
  font-family:var(--font-display);text-transform:uppercase;letter-spacing:1.1px}
.trust li::before{content:"";width:7px;height:7px;background:var(--gold);border-radius:50%;flex:0 0 auto}

/* ---------- sections ---------- */
section{padding:56px 0}
section.alt{background:var(--bg-alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--olive);
  border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.card h3{margin-top:0}
.card p:last-child{margin-bottom:0}
.card ul{margin:10px 0 0;padding-left:19px;color:var(--muted);font-size:15.5px}
.card li{margin-bottom:6px}

.steps{counter-reset:s;display:grid;gap:20px;grid-template-columns:repeat(4,1fr)}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px 22px 22px;position:relative}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:-16px;left:22px;width:34px;height:34px;
  background:var(--gold);color:var(--navy-deep);border-radius:50%;display:grid;place-items:center;
  font-family:var(--font-display);font-weight:700;font-size:17px}
.step h4{margin:12px 0 6px;font-size:1.02rem;color:var(--navy);font-family:var(--font-display);
  text-transform:uppercase;letter-spacing:.9px}
.step p{margin:0;color:var(--muted);font-size:15px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;margin:18px 0;font-size:15.5px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}
th{background:var(--navy);color:#fff;font-weight:600;font-size:14.5px;font-family:var(--font-display);
  text-transform:uppercase;letter-spacing:.9px}
tbody tr:nth-child(even){background:var(--bg-alt)}

/* ---------- lists ---------- */
ul.checks{list-style:none;padding:0;margin:16px 0}
ul.checks li{padding-left:30px;position:relative;margin-bottom:9px}
ul.checks li::before{content:"✓";position:absolute;left:0;top:0;color:var(--olive);font-weight:700}
ul.crosses{list-style:none;padding:0;margin:16px 0}
ul.crosses li{padding-left:30px;position:relative;margin-bottom:9px;color:#3d4753}
ul.crosses li::before{content:"✕";position:absolute;left:0;top:0;color:var(--red);font-weight:700}
ul.plain{padding-left:22px}
ul.plain li{margin-bottom:7px}

/* ---------- callouts ---------- */
.note{border-left:4px solid var(--gold);background:var(--bg-alt);padding:16px 20px;
  border-radius:0 8px 8px 0;margin:22px 0}
.note strong{color:var(--navy)}
.note.warn{border-left-color:var(--olive)}
.note.limit{border-left-color:var(--red)}

/* ---------- faq ---------- */
details.faq{border:1px solid var(--line);border-radius:9px;background:#fff;margin-bottom:11px;overflow:hidden}
details.faq summary{cursor:pointer;padding:16px 20px;font-weight:600;color:var(--navy);list-style:none;
  display:flex;justify-content:space-between;gap:16px;align-items:center;font-family:var(--font-display);
  text-transform:uppercase;letter-spacing:.5px;font-size:16px}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-size:22px;color:var(--gold);font-weight:700;line-height:1}
details.faq[open] summary::after{content:"–"}
details.faq .ans{padding:0 20px 18px;color:#3d4753}
details.faq .ans p:first-child{margin-top:0}
details.faq .ans p:last-child{margin-bottom:0}

/* ---------- forms ---------- */
form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:block;font-weight:600;font-size:14.5px;margin-bottom:6px;color:var(--navy)}
input,select,textarea{width:100%;padding:11px 13px;border:1px solid #c6cfd6;border-radius:8px;
  font:inherit;font-size:16px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:3px solid rgba(168,144,96,.35);border-color:var(--gold)}
.field{margin-bottom:16px}
.req{color:var(--red)}
.hint{font-size:13.5px;color:var(--muted);margin-top:5px}

/* ---------- cta band ---------- */
.cta{background:linear-gradient(150deg,var(--olive-deep) 0%,var(--navy) 100%);
  color:#fff;padding:52px 0;text-align:center;border-top:3px solid var(--gold)}
.cta h2{color:#fff}
.cta p{color:#d5e0ea;max-width:56ch;margin:0 auto 24px;font-size:1.08rem;font-family:var(--font)}

/* ---------- cities ---------- */
.city{background:#fff;border:1px solid var(--line);border-left:4px solid var(--olive);
  border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.city h3{margin-top:0;display:flex;align-items:center;gap:9px}
.city p{margin:0;color:var(--muted);font-size:15.5px}

/* ---------- footer ---------- */
footer.site{background:var(--navy-deep);color:#a7bccf;padding:48px 0 22px;font-size:15px;
  border-top:3px solid var(--gold)}
footer.site h4{color:var(--gold);font-size:13.5px;text-transform:uppercase;letter-spacing:1.6px;
  margin:0 0 14px;font-family:var(--font-display)}
footer.site a{color:#cfdded}
.fbrand{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.fbrand img{width:70px;height:70px}
.fbrand .fnm{font-family:var(--font-display);font-size:21px;font-weight:700;color:#fff;
  text-transform:uppercase;letter-spacing:1.2px;line-height:1}
.fbrand .fnm span{display:block;font-family:var(--font);font-size:10px;letter-spacing:1.9px;
  color:var(--gold);margin-top:4px;font-weight:600}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;margin-bottom:34px}
.fgrid ul{list-style:none;padding:0;margin:0}
.fgrid li{margin-bottom:8px}
.fbot{border-top:1px solid rgba(168,144,96,.3);padding-top:18px;display:flex;
  justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13.5px;color:#8aa4bb}

/* ---------- page head ---------- */
.phead{background:var(--navy);color:#fff;padding:42px 0;border-bottom:3px solid var(--olive)}
.phead h1{margin:0 0 10px;font-size:2.2rem;text-transform:uppercase;letter-spacing:.6px}
.phead p{margin:0;color:#cfdded;font-size:1.08rem;max-width:62ch;font-family:var(--font)}

.legal h2{font-size:1.35rem;margin-top:34px}
.legal p,.legal li{color:#3d4753;font-size:16px}

/* ---------- responsive ---------- */
@media(max-width:980px){
  .hero-split,.split{grid-template-columns:1fr;gap:30px}
  .g3,.g4,.steps{grid-template-columns:repeat(2,1fr)}
  .fgrid{grid-template-columns:1fr 1fr;gap:26px}
  .hero-crest{max-width:220px}
}
@media(max-width:760px){
  body{font-size:16px}
  .hero{padding:42px 0}
  .hero h1{font-size:1.9rem}
  .hero p.lede{font-size:1.08rem}
  section{padding:40px 0}
  h2{font-size:1.55rem}
  nav.main{display:none;width:100%;order:3;flex-direction:column;align-items:stretch;margin:0 0 12px;padding-bottom:10px}
  #navchk:checked ~ nav.main{display:flex}
  nav.main a{padding:12px 10px;border-bottom:1px solid rgba(168,144,96,.2)}
  .navtoggle{display:block;margin-left:auto;background:rgba(168,144,96,.22);
    border:1px solid var(--gold);color:#fff;border-radius:8px;padding:9px 15px;font:inherit;
    font-weight:600;cursor:pointer}
  .brand img.crest{width:44px;height:44px}
  .brand .nm{font-size:19px}
  .g2,.g3,.g4,.steps,.fgrid,form .row{grid-template-columns:1fr}
  .phead h1{font-size:1.65rem}
  .header-cta{display:none}
}
@media print{header.site,.cta,footer.site,.topbar{display:none}}