/* =========================================================
   WORLD PEST CONTROL & LOGISTICS — GLOBAL STYLES
   Design system: "field spec sheet" — technical, industrial,
   editorial. Deep forest green + paper + a single rust signal
   accent. Condensed grotesque headlines, humanist sans body,
   monospace used only for standards codes / data labels.
   ========================================================= */

:root{
  /* ---- color ---- */
  --forest-950:#0F1B13;
  --forest-900:#153322;
  --forest-800:#1B4332;
  --green-700:#1F6B3D;
  --green-600:#2C7A46;
  --green-500:#3C9057;
  --paper:#FAFAF6;
  --paper-dim:#F1F1EA;
  --ink:#161E19;
  --ink-soft:#4A544D;
  --line:#D7D9CC;
  --line-strong:#B7BBA8;
  --signal:#C1440E;
  --signal-dim:#8F3309;
  --white:#FFFFFF;

  /* ---- type ---- */
  --font-display:'Archivo', 'Arial Narrow', sans-serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'Courier New', monospace;

  /* ---- scale ---- */
  --step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.9rem);
  --step-0:  clamp(1rem, 0.95rem + 0.2vw, 1.08rem);
  --step-1:  clamp(1.2rem, 1.1rem + 0.4vw, 1.4rem);
  --step-2:  clamp(1.5rem, 1.3rem + 0.8vw, 1.9rem);
  --step-3:  clamp(1.9rem, 1.5rem + 1.6vw, 2.6rem);
  --step-4:  clamp(2.4rem, 1.8rem + 2.6vw, 3.6rem);
  --step-5:  clamp(3.1rem, 2.2rem + 4vw, 5rem);

  /* ---- layout ---- */
  --container: 1240px;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --radius-sm: 2px;
  --radius-md: 3px;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html:focus-within{ scroll-behavior:auto; }

/* Offset anchor targets (service sections, #inspection, industry items…)
   so the sticky header never covers the heading being scrolled to. */
[id]{ scroll-margin-top: 96px; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:var(--step-0);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img, svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul, ol{ margin:0; padding:0; list-style:none; }
button{ font:inherit; cursor:pointer; }
input, select, textarea{ font:inherit; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:800;
  letter-spacing:-0.01em;
  line-height:1.05;
  margin:0;
  color:var(--forest-900);
}

p{ margin:0 0 1em; max-width:62ch; }
p:last-child{ margin-bottom:0; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.tag{
  font-family:var(--font-mono);
  font-size:0.72rem;
  letter-spacing:0.04em;
  color:var(--green-700);
  display:inline-flex;
  align-items:center;
  gap:0.5em;
}
.tag::before{
  content:"";
  width:6px; height:6px;
  background:var(--signal);
  display:inline-block;
}

.rule{
  border:none;
  border-top:1px solid var(--line);
  margin:0;
}

.visually-hidden{
  position:absolute; width:1px; height:1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;
}

/* focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--signal);
  outline-offset:2px;
}

[data-reveal]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
  will-change:opacity, transform;
}
[data-reveal].is-revealed{ opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}
