/* Caulk Control brand: H1 "Barricade". White base, navy + blue, manila incident reports, red CONTAINED stamp. */
@import url("https://fonts.googleapis.com/css2?family=Anton&family=Barlow:wght@400;500;600;700&family=Courier+Prime:wght@400;700&family=Black+Ops+One&display=swap");

:root{
  --white:#FFFFFF;
  --paper:#F3F6FB;      /* section tint, blue-biased neutral */
  --navy:#0B1F3F;       /* nav, headlines, stripe */
  --blue:#1E5BD6;       /* buttons, links, ad tiles */
  --blue-dk:#1649AE;
  --line:#D3DBE8;
  --muted:#4B5A72;
  --manila:#E8DCC2;     /* incident reports */
  --rule:#D6C7A6;
  --ink:#1E2226;
  --red:#B3261E;        /* CONTAINED stamp, errors */
  --ok:#1F7A4D;

  --f-disp:"Anton",Impact,"Arial Narrow",sans-serif;
  --f-body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-rep:"Courier Prime","Courier New",ui-monospace,monospace;
  --f-stamp:"Black Ops One",Impact,sans-serif;

  --gutter:max(16px,env(safe-area-inset-left,0px));
  --gutter-r:max(16px,env(safe-area-inset-right,0px));
  --max:1120px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--navy);font-family:var(--f-body);font-size:17px;line-height:1.55}
img{max-width:100%;display:block}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.container{max-width:var(--max);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter-r)}
.h-disp{font-family:var(--f-disp);font-weight:400;text-transform:uppercase;line-height:.92;letter-spacing:.005em;margin:0;text-wrap:balance}
.eyebrow{font-family:var(--f-rep);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--red)}

/* Barricade stripe */
.stripe{height:12px;background:repeating-linear-gradient(-45deg,var(--navy) 0 12px,var(--white) 12px 24px);border-block:2px solid var(--navy)}

/* Nav */
.nav{background:var(--navy);color:var(--white)}
.nav .container{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:12px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--f-disp);font-size:22px;text-transform:uppercase;color:var(--white);text-decoration:none;letter-spacing:.01em}
.logo-img{display:block;flex:0 0 auto}
.nav-links{display:flex;gap:20px}
.nav-links a{color:var(--white);text-decoration:none;font-weight:600;font-size:15px}
.nav-links a:hover{text-decoration:underline}
@media (max-width:640px){.nav-links{display:none}}

/* Buttons + fields */
.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;background:var(--blue);color:var(--white);font-family:var(--f-disp);font-size:21px;text-transform:uppercase;letter-spacing:.03em;padding:14px 22px;border:0;border-radius:0;cursor:pointer;text-decoration:none;min-height:52px}
.btn:hover{background:var(--blue-dk)}
.btn:disabled{background:#8FA6CF;cursor:not-allowed}
.btn.block{display:flex;width:100%}
.btn.ghost{background:transparent;color:var(--navy);border:2px solid var(--navy)}
.lbl{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.field{width:100%;font:600 18px var(--f-body);padding:13px 12px;border:2px solid var(--navy);background:var(--white);color:var(--navy);border-radius:0;min-height:52px}
.field::placeholder{color:#8090A8;font-weight:500}
.err{color:var(--red);font-weight:600;font-size:15px;margin:6px 0 0}

/* Incident report card */
.report{background:var(--manila);color:var(--ink);font-family:var(--f-rep);padding:14px;position:relative;background-image:repeating-linear-gradient(0deg,transparent 0 23px,var(--rule) 23px 24px)}
.report .r1{display:flex;justify-content:space-between;gap:8px;font-size:12px;text-transform:uppercase;font-weight:700;border-bottom:2px solid var(--ink);padding-bottom:6px;margin-bottom:10px}
.report .pics{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}
.report .pics img{aspect-ratio:1/1;object-fit:cover;width:100%}
.report .r2{font-size:12px;text-transform:uppercase;display:grid;gap:2px}

.stamp{display:inline-block;font-family:var(--f-stamp);color:var(--red);border:3px solid var(--red);padding:3px 10px;transform:rotate(-9deg);letter-spacing:.06em;font-size:18px;line-height:1.1;background:rgba(232,220,194,.55)}
.report .stamp{position:absolute;right:14px;bottom:16px}
@media (prefers-reduced-motion:no-preference){
  .stamp.slam{animation:slam .4s cubic-bezier(.16,1,.3,1) both}
  @keyframes slam{from{transform:rotate(-9deg) scale(2.2);opacity:0}to{transform:rotate(-9deg) scale(1);opacity:1}}
}

/* Launch promo: regular price with a red slash, promo price in red */
.was{position:relative;display:inline-block;color:var(--muted);font-weight:600;white-space:nowrap}
.was::after{content:"";position:absolute;left:-6%;right:-6%;top:50%;height:max(2px,.11em);background:var(--red);transform:rotate(-14deg);transform-origin:center}
.now{color:var(--red);font-weight:800;white-space:nowrap}