/* =============================================================
   AEGIS PEST CONTROL — colorful, friendly, mobile-first
   ============================================================= */
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&family=Caveat:wght@600;700&family=Atkinson+Hyperlegible:wght@400;700&display=swap');

:root{
  /* brand */
  --green:#1fae5b;
  --green-deep:#0f7a3e;
  --green-dark:#0b5e30;
  --leaf:#34c759;
  --forest:#0f7a3e;          /* alias used by inline styles */
  --lime:#c9f26d;

  --yellow:#ffc83a;
  --yellow-deep:#f3a712;
  --sun:#ffd84d;

  --red:#e23b3b;
  --red-deep:#b8261f;
  --oxblood:#e23b3b;         /* alias */
  --oxblood-2:#ffd84d;       /* alias (used on dark bgs as accent) */

  --orange:#ff7a2a;
  --coral:#ff5b67;

  --ink:#1a2233;
  --ink-2:#3a4358;
  --night:#0d1320;

  --paper:#fff8e8;
  --paper-2:#fff2cc;
  --cream:#fffaef;
  --bone:#fff3d6;            /* used by .bg-bone */
  --parchment:#fde6b6;       /* used by .bg-parchment */
  --line:#ead7a3;
  --line-soft:#f2e3b5;

  /* type */
  --sans:'Manrope', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --mono:'Fredoka', 'Manrope', system-ui, sans-serif;   /* "mono" = display in this theme */
  --display:'Fredoka', 'Manrope', system-ui, sans-serif;
  --script:'Caveat', cursive;

  --shadow-sm:0 4px 14px rgba(15,30,20,.10);
  --shadow:0 14px 40px rgba(15,30,20,.16);
  --shadow-lg:0 30px 70px rgba(15,30,20,.22);
  --radius:18px;
  --radius-lg:28px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.6;
  font-weight:500;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;inset:0;
  background:
    radial-gradient(900px 600px at 90% -10%, rgba(255,200,58,.25), transparent 60%),
    radial-gradient(700px 500px at -10% 30%, rgba(31,174,91,.10), transparent 60%);
  pointer-events:none;z-index:-1;
}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,textarea,select{font:inherit;color:inherit}
ul,ol{list-style:none}
::selection{background:var(--yellow);color:var(--ink)}

h1,h2,h3,h4,h5{font-family:var(--display);font-weight:700;line-height:1.05;color:var(--ink);letter-spacing:-.01em}
em{font-style:italic;color:var(--green-deep)}

/* ---------- a11y ---------- */
.skip{position:absolute;left:-9999px;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:1000;border-radius:0 0 12px 0}
.skip:focus{left:0;top:0}

/* ---------- container ---------- */
.wrap{max-width:1240px;margin:0 auto;padding:0 1.4rem}
@media (min-width:740px){.wrap{padding:0 2rem}}

/* ---------- urgent / promo banner ---------- */
.urgent{
  background:linear-gradient(90deg,var(--red) 0%,var(--red-deep) 100%);
  color:#fff;font-weight:600;font-size:.92rem;
  position:relative;overflow:hidden;
}
.urgent::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(45deg,transparent 0 18px,rgba(255,255,255,.06) 18px 22px);
  pointer-events:none;
}
.urgent .wrap{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.6rem 1.4rem;flex-wrap:wrap;position:relative;
}
.urgent strong{font-weight:800;background:var(--yellow);color:var(--ink);padding:.1rem .55rem;border-radius:6px;margin-right:.4rem}
.urgent a{
  display:inline-flex;align-items:center;gap:.4rem;
  background:#fff;color:var(--red-deep);font-weight:800;
  padding:.4rem .9rem;border-radius:999px;font-size:.92rem;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}
.urgent a:hover{transform:translateY(-1px)}

/* ---------- site header ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:var(--cream);
  border-bottom:3px solid var(--ink);
  box-shadow:0 6px 0 var(--green);
}
.site-header .nav{
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  padding:.9rem 1.4rem;
}
.brand{display:inline-flex;align-items:center;gap:.7rem}
/* Brand mark — friendly bug-in-shield logo painted via SVG background.
   Hides any text content placed inside (legacy markup uses an "A"). */
.brand-mark{
  display:inline-block;
  width:54px;height:54px;border-radius:16px;
  background-color:var(--green);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'><g fill='none' stroke-linecap='round'><line x1='20' y1='14' x2='12' y2='6' stroke='%23ffffff' stroke-width='3'/><line x1='40' y1='14' x2='48' y2='6' stroke='%23ffffff' stroke-width='3'/><circle cx='12' cy='6' r='3.2' fill='%23ffc83a'/><circle cx='48' cy='6' r='3.2' fill='%23ffc83a'/><circle cx='30' cy='32' r='18' fill='%23ffffff' stroke='%231a2233' stroke-width='2.4'/><line x1='30' y1='15' x2='30' y2='49' stroke='%231a2233' stroke-width='2.4'/><circle cx='22' cy='28' r='2.5' fill='%231a2233'/><circle cx='38' cy='28' r='2.5' fill='%231a2233'/><circle cx='23' cy='40' r='2' fill='%231a2233'/><circle cx='37' cy='40' r='2' fill='%231a2233'/><path d='M22 35 Q 30 41 38 35' stroke='%231a2233' stroke-width='2.2' fill='none'/></g></svg>");
  background-repeat:no-repeat;background-position:center;background-size:88% 88%;
  border:3px solid var(--ink);
  box-shadow:3px 3px 0 var(--ink);
  transform:rotate(-4deg);
  color:transparent;
  font-size:0;
  overflow:hidden;
  flex-shrink:0;
}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text strong{font-family:var(--display);font-weight:700;font-size:1.45rem;color:var(--ink)}
.brand-text small{font-size:.72rem;color:var(--ink-2);letter-spacing:.05em;margin-top:.15rem;font-weight:600}

.nav-links{display:flex;align-items:center;gap:.2rem}
.nav-links a{
  font-weight:700;font-size:.94rem;color:var(--ink);
  padding:.55rem .85rem;border-radius:10px;
  transition:background .15s, color .15s;
}
.nav-links a:hover{background:var(--paper-2);color:var(--green-deep)}
.nav-links a[aria-current="page"]{
  background:var(--yellow);color:var(--ink);
  box-shadow:0 3px 0 var(--ink);
}

.nav-cta{display:flex;align-items:center;gap:.8rem}
.nav-tel{
  display:none;
  font-family:var(--display);font-weight:700;font-size:1.1rem;color:var(--red-deep);
  text-align:right;line-height:1;
}
.nav-tel span{display:block;font-size:.7rem;color:var(--ink-2);font-weight:600;margin-top:.2rem;letter-spacing:.05em}

.nav-toggle{
  width:48px;height:48px;border-radius:12px;
  background:var(--ink);color:#fff;
  display:grid;place-items:center;
  border:3px solid var(--ink);box-shadow:3px 3px 0 var(--green);
}
.nav-toggle svg{width:24px;height:24px}

@media (min-width:1024px){
  .nav-tel{display:block}
  .nav-toggle{display:none}
}
@media (max-width:1023px){
  .nav-links{
    position:fixed;left:0;right:0;top:0;
    background:var(--cream);
    flex-direction:column;align-items:stretch;gap:.4rem;
    padding:5.5rem 1.4rem 2rem;
    transform:translateY(-110%);
    transition:transform .3s ease;
    box-shadow:0 20px 50px rgba(0,0,0,.2);
    border-bottom:3px solid var(--ink);
    z-index:60;
  }
  .nav-links a{font-size:1.05rem;padding:.85rem 1rem;border-bottom:1px dashed var(--line)}
  body[data-nav-open="true"] .nav-links{transform:translateY(0)}
  body[data-nav-open="true"]{overflow:hidden}
}

/* ---------- generic sections / heads ---------- */
.section{padding:4rem 0;position:relative}
@media (min-width:740px){.section{padding:5.5rem 0}}
.bg-bone{background:var(--bone)}
.bg-parchment{background:var(--parchment)}
.bg-forest{
  background:
    radial-gradient(800px 400px at 80% 0%, rgba(255,200,58,.18), transparent 60%),
    linear-gradient(180deg,var(--green-deep) 0%,var(--green-dark) 100%);
  color:#fff;
}
.bg-forest h1,.bg-forest h2,.bg-forest h3,.bg-forest h4{color:#fff}
.bg-forest em{color:var(--yellow)}
.bg-forest .lede,.bg-forest p{color:rgba(255,255,255,.85)}
.bg-forest .eyebrow{color:var(--yellow)}

/* page-head */
.page-head{
  padding:2.6rem 0 1.4rem;
  background:linear-gradient(180deg,var(--paper-2) 0%,var(--paper) 100%);
  border-bottom:3px solid var(--ink);
  position:relative;
}
.page-head::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:8px;
  background:repeating-linear-gradient(90deg,var(--green) 0 30px,var(--yellow) 30px 60px,var(--red) 60px 90px,var(--ink) 90px 120px);
  opacity:.85;
}
.page-head-grid{
  display:grid;grid-template-columns:1fr;gap:1rem;
  align-items:end;
}
@media (min-width:880px){.page-head-grid{grid-template-columns:1.4fr 1fr;gap:2.4rem}}
.page-head h1{font-size:clamp(2.2rem,5vw,3.4rem)}
.page-head .lede{font-size:1.1rem}
.crumb{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-2);font-weight:600;margin-bottom:1rem;
}
.crumb a{color:var(--green-deep);border-bottom:2px solid var(--yellow)}
.crumb span{margin:0 .5rem;color:var(--line)}

.eyebrow{
  display:inline-block;font-family:var(--mono);font-weight:600;
  font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;
  background:var(--yellow);color:var(--ink);padding:.32rem .7rem;border-radius:999px;
  border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);
}
.lede{font-size:1.05rem;color:var(--ink-2);line-height:1.55}

.sec-head{display:grid;grid-template-columns:1fr;gap:1rem;align-items:end;margin-bottom:2.4rem}
@media (min-width:880px){.sec-head{grid-template-columns:1.3fr 1fr;gap:2.4rem}}
.sec-head h2{font-size:clamp(1.9rem,4vw,2.8rem)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--display);font-weight:700;font-size:1rem;
  padding:.95rem 1.6rem;border-radius:999px;
  border:3px solid var(--ink);
  box-shadow:4px 4px 0 var(--ink);
  transition:transform .12s, box-shadow .12s;
  cursor:pointer;line-height:1;white-space:nowrap;
}
.btn svg{width:18px;height:18px}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}

.btn-primary,.btn-oxblood{background:var(--red);color:#fff}
.btn-primary:hover,.btn-oxblood:hover{background:var(--red-deep)}
.btn-ghost{background:var(--yellow);color:var(--ink)}
.btn-ghost:hover{background:var(--sun)}
.btn-light{background:#fff;color:var(--ink)}
.btn-green{background:var(--green);color:#fff}
.btn-green:hover{background:var(--green-deep)}

/* ---------- HERO (index page) ---------- */
.hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(900px 500px at 80% 0%, rgba(255,200,58,.28), transparent 60%),
    linear-gradient(170deg,#fff8d8 0%,#cdf0c8 65%,#9ee0a1 100%);
  padding:3rem 0 6rem;
  border-bottom:3px solid var(--ink);
}
.hero::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:10px;
  background:repeating-linear-gradient(90deg,var(--green) 0 30px,var(--yellow) 30px 60px,var(--red) 60px 90px,var(--ink) 90px 120px);
}
.hero-grid{
  display:grid;grid-template-columns:1fr;gap:2.6rem;align-items:center;
}
@media (min-width:980px){.hero-grid{grid-template-columns:1.05fr .95fr;gap:2rem}}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--mono);font-weight:700;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;
  background:#fff;color:var(--ink);padding:.45rem .9rem;border-radius:999px;
  border:2.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);
}
.hero-eyebrow .dot{width:9px;height:9px;border-radius:50%;background:var(--red);
  box-shadow:0 0 0 0 rgba(226,59,59,.6);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(226,59,59,.6)}70%{box-shadow:0 0 0 12px rgba(226,59,59,0)}100%{box-shadow:0 0 0 0 rgba(226,59,59,0)}}

.hero h1{
  font-size:clamp(2.6rem,7vw,5rem);line-height:.98;margin:1.2rem 0 1rem;
}
.hero h1 .stamp{
  display:inline-block;background:var(--yellow);color:var(--ink);
  padding:.1rem .55rem;border-radius:12px;
  border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);
  transform:rotate(-2deg);
}
.hero h1 .underline{
  position:relative;display:inline-block;
}
.hero h1 .underline::after{
  content:"";position:absolute;left:-4%;right:-4%;bottom:-6px;height:14px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'><path d='M2 9 Q 50 1 100 7 T 198 5' stroke='%23e23b3b' stroke-width='4' fill='none' stroke-linecap='round'/></svg>") center/100% 100% no-repeat;
}
.hero p.hero-sub{font-size:1.18rem;color:var(--ink-2);max-width:46ch;margin-bottom:1.6rem;font-weight:500}
.hero-actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:1.8rem}
.hero-trust{
  display:flex;flex-wrap:wrap;gap:1.2rem 1.6rem;align-items:center;
  font-size:.9rem;color:var(--ink);font-weight:600;
}
.hero-trust span{display:inline-flex;align-items:center;gap:.45rem}
.hero-trust svg{width:22px;height:22px;color:var(--green-deep)}

.hero-art{
  position:relative;display:grid;place-items:center;min-height:340px;
}
.hero-blob{
  position:absolute;inset:0;display:grid;place-items:center;
}
.hero-blob svg.blob{width:min(440px,90%);height:auto;color:var(--green)}
.hero-bug{
  position:relative;z-index:2;width:min(360px,80%);
  filter:drop-shadow(8px 12px 0 rgba(0,0,0,.18));
  animation:wobble 4s ease-in-out infinite;
}
@keyframes wobble{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(3deg) translateY(-8px)}}
.hero-badge{
  position:absolute;font-family:var(--display);font-weight:700;
  background:var(--red);color:#fff;padding:.6rem .9rem;border-radius:14px;
  border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);
  font-size:.95rem;text-align:center;line-height:1.05;z-index:3;
}
.hero-badge.top{top:6%;right:0;transform:rotate(8deg);background:var(--red)}
.hero-badge.top b{font-size:1.3rem;display:block}
.hero-badge.bot{bottom:8%;left:0;transform:rotate(-6deg);background:var(--ink);color:var(--yellow)}
.hero-badge.bot b{font-size:1.3rem;display:block;color:#fff}

/* ---------- PROMO STRIP (index) ---------- */
.promo-band{
  background:var(--ink);color:#fff;
  padding:1.2rem 0;border-bottom:3px solid var(--yellow);
  overflow:hidden;
}
.promo-track{
  display:flex;gap:2.5rem;align-items:center;font-family:var(--display);font-weight:700;font-size:1.15rem;
  white-space:nowrap;animation:marquee 30s linear infinite;
}
.promo-track span{display:inline-flex;align-items:center;gap:.6rem;color:var(--yellow)}
.promo-track .sep{color:var(--green);font-size:1.5rem}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- SERVICES GRID (index) ---------- */
.services-grid{
  display:grid;grid-template-columns:1fr;gap:1.2rem;
}
@media (min-width:640px){.services-grid{grid-template-columns:1fr 1fr}}
@media (min-width:980px){.services-grid{grid-template-columns:repeat(3,1fr)}}

.service-card{
  position:relative;background:#fff;
  padding:1.6rem 1.4rem 1.5rem;
  border-radius:var(--radius);
  border:3px solid var(--ink);
  box-shadow:6px 6px 0 var(--ink);
  transition:transform .18s, box-shadow .18s;
  overflow:hidden;
}
.service-card:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--ink)}
.service-card .icon{
  width:64px;height:64px;border-radius:18px;
  display:grid;place-items:center;margin-bottom:1rem;
  border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);
}
.service-card .icon svg{width:36px;height:36px;color:#fff}
.service-card h3{font-size:1.35rem;margin-bottom:.4rem}
.service-card p{color:var(--ink-2);font-size:.96rem;line-height:1.5;margin-bottom:1rem}
.service-card .more{
  display:inline-flex;align-items:center;gap:.35rem;
  font-family:var(--mono);font-weight:700;font-size:.86rem;letter-spacing:.06em;
  color:var(--ink);text-transform:uppercase;
  border-bottom:3px solid var(--yellow);padding-bottom:2px;
}
.service-card.c1 .icon{background:var(--green)}
.service-card.c2 .icon{background:var(--red)}
.service-card.c3 .icon{background:var(--orange)}
.service-card.c4 .icon{background:var(--ink)}
.service-card.c5 .icon{background:var(--yellow)}
.service-card.c5 .icon svg{color:var(--ink)}
.service-card.c6 .icon{background:var(--green-deep)}
.service-card::before{
  content:"";position:absolute;width:120px;height:120px;border-radius:50%;
  right:-40px;top:-40px;opacity:.12;background:var(--green);
}
.service-card.c2::before{background:var(--red)}
.service-card.c3::before{background:var(--orange)}
.service-card.c4::before{background:var(--ink)}
.service-card.c5::before{background:var(--yellow-deep)}

/* ---------- WHY US ---------- */
.why-grid{
  display:grid;grid-template-columns:1fr;gap:1.2rem;
}
@media (min-width:640px){.why-grid{grid-template-columns:1fr 1fr}}
@media (min-width:980px){.why-grid{grid-template-columns:repeat(4,1fr)}}
.why-card{
  background:var(--cream);
  border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.4rem 1.3rem;text-align:left;
  box-shadow:5px 5px 0 var(--ink);
  position:relative;
}
.why-card .num{
  position:absolute;top:-18px;left:-18px;
  width:48px;height:48px;border-radius:50%;
  background:var(--yellow);color:var(--ink);
  display:grid;place-items:center;
  font-family:var(--display);font-weight:700;font-size:1.25rem;
  border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);
}
.why-card h3{font-size:1.2rem;margin:.4rem 0 .4rem}
.why-card p{color:var(--ink-2);font-size:.94rem;line-height:1.5}
.why-card .ic{width:46px;height:46px;color:var(--green-deep);margin-bottom:.4rem}

/* ---------- PRICING tiers (used by programs.html + index.html) ---------- */
.tiers{
  display:grid;grid-template-columns:1fr;gap:1.6rem;
}
@media (min-width:760px){.tiers{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.tiers{grid-template-columns:repeat(3,1fr)}}
.tier{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius-lg);
  padding:2rem 1.6rem 1.8rem;position:relative;
  box-shadow:6px 6px 0 var(--ink);display:flex;flex-direction:column;
}
.tier.flag{background:var(--green);color:#fff;transform:translateY(-8px)}
.tier.flag h3,.tier.flag .tier-price{color:#fff}
.tier.flag::before{
  content:"MOST POPULAR";
  position:absolute;top:-18px;left:50%;transform:translateX(-50%);
  background:var(--yellow);color:var(--ink);
  font-family:var(--mono);font-weight:700;font-size:.78rem;letter-spacing:.16em;
  padding:.35rem .9rem;border-radius:999px;
  border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);white-space:nowrap;
}
.tier.flag .tier-feat li::before{background:var(--yellow);color:var(--ink)}
.tier.flag em{color:var(--yellow)}
.tier-tag{
  font-family:var(--mono);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--green-deep);margin-bottom:.4rem;display:block;
}
.tier.flag .tier-tag{color:var(--yellow)}
.tier h3{font-size:1.6rem;margin-bottom:.7rem}
.tier-price{
  font-family:var(--display);font-weight:700;
  font-size:2.6rem;color:var(--red);margin:.2rem 0 1.2rem;line-height:1;
}
.tier-price small{font-size:.95rem;color:var(--ink-2);font-weight:600;display:inline-block;margin-left:.3rem}
.tier.flag .tier-price small{color:rgba(255,255,255,.85)}
.tier-feat{display:grid;gap:.55rem;margin-bottom:1.4rem;flex:1}
.tier-feat li{
  position:relative;padding-left:1.8rem;font-size:.96rem;color:var(--ink);line-height:1.45;
}
.tier.flag .tier-feat li{color:#fff}
.tier-feat li::before{
  content:"✓";position:absolute;left:0;top:.05rem;
  width:22px;height:22px;border-radius:50%;
  background:var(--green);color:#fff;display:grid;place-items:center;
  font-weight:800;font-size:.78rem;
}

/* ---------- spec-table ---------- */
.spec-table{
  width:100%;border-collapse:separate;border-spacing:0;
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  overflow:hidden;box-shadow:5px 5px 0 var(--ink);
}
.spec-table tr{border-bottom:2px solid var(--line)}
.spec-table tr:last-child{border-bottom:0}
.spec-table th,.spec-table td{padding:1rem 1.2rem;vertical-align:top;font-size:.95rem;line-height:1.5;text-align:left}
.spec-table th{
  font-family:var(--display);font-weight:700;color:var(--ink);
  width:34%;background:var(--paper-2);border-right:2px solid var(--line);
}
.spec-table td{color:var(--ink-2)}
@media (max-width:640px){
  .spec-table th,.spec-table td{display:block;width:100%;border-right:0}
  .spec-table th{padding-bottom:.4rem;background:var(--paper-2)}
  .spec-table td{padding-top:.5rem;border-bottom:1px solid var(--line)}
}

/* ---------- icon stack (mini features) ---------- */
.icon-stack{
  display:grid;grid-template-columns:1fr;gap:1.2rem;
}
@media (min-width:640px){.icon-stack{grid-template-columns:1fr 1fr}}
@media (min-width:980px){.icon-stack{grid-template-columns:repeat(4,1fr)}}
.icon-item{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.4rem 1.2rem;box-shadow:5px 5px 0 var(--ink);
}
.icon-item svg{
  width:46px;height:46px;color:#fff;background:var(--green);
  padding:10px;border-radius:14px;border:3px solid var(--ink);
  margin-bottom:.9rem;
}
.icon-item:nth-child(2) svg{background:var(--red)}
.icon-item:nth-child(3) svg{background:var(--orange)}
.icon-item:nth-child(4) svg{background:var(--ink)}
.icon-item h4{font-size:1.15rem;margin-bottom:.4rem}
.icon-item p{font-size:.93rem;color:var(--ink-2);line-height:1.5}

/* ---------- CTA banner ---------- */
.cta{
  background:linear-gradient(125deg,var(--red) 0%,var(--red-deep) 60%,#7c1414 100%);
  color:#fff;padding:3.4rem 0;position:relative;overflow:hidden;
  border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);
}
.cta::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(280px 280px at 8% 80%,rgba(255,200,58,.22),transparent 60%),
    radial-gradient(220px 220px at 92% 20%,rgba(255,255,255,.10),transparent 70%);
  pointer-events:none;
}
.cta-row{
  display:grid;grid-template-columns:1fr;gap:1.6rem;align-items:center;position:relative;
}
@media (min-width:880px){.cta-row{grid-template-columns:1.5fr 1fr;gap:2.4rem}}
.cta h2{color:#fff;font-size:clamp(1.9rem,4vw,2.8rem)}
.cta em{color:var(--yellow)}
/* eyebrow on red CTA bg — beat any inline color override from legacy markup */
.cta .eyebrow{background:var(--yellow);color:var(--ink)!important}
.cta p{color:rgba(255,255,255,.92)}
/* legacy inline overrides on buttons inside .cta — cream button text on red bg is fine,
   but make sure ghost buttons get an opaque base so they're readable */
.cta .btn-ghost{background:var(--yellow);color:var(--ink);border-color:var(--ink)}
.cta-actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:flex-start}
@media (min-width:880px){.cta-actions{justify-content:flex-end}}

/* ---------- TESTIMONIALS (index) ---------- */
.testi-grid{
  display:grid;grid-template-columns:1fr;gap:1.4rem;
}
@media (min-width:760px){.testi-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.testi-grid{grid-template-columns:repeat(3,1fr)}}
.testi{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.6rem 1.4rem;box-shadow:6px 6px 0 var(--ink);position:relative;
}
.testi .stars{color:var(--yellow-deep);font-size:1.05rem;letter-spacing:.1em;margin-bottom:.6rem}
.testi blockquote{font-size:1rem;line-height:1.55;color:var(--ink);margin-bottom:1rem;font-weight:500}
.testi cite{
  display:flex;align-items:center;gap:.7rem;font-style:normal;
}
.testi .avi{
  width:42px;height:42px;border-radius:50%;background:var(--green);color:#fff;
  display:grid;place-items:center;font-family:var(--display);font-weight:700;
  border:2.5px solid var(--ink);
}
.testi .who{display:flex;flex-direction:column;line-height:1.1}
.testi .who b{font-weight:700;color:var(--ink);font-size:.95rem}
.testi .who small{color:var(--ink-2);font-size:.82rem;margin-top:.15rem}
.testi::before{
  content:"“";position:absolute;top:-22px;right:18px;
  font-family:var(--display);font-size:4.5rem;color:var(--yellow);line-height:1;
  -webkit-text-stroke:3px var(--ink);
}

/* ---------- STATS strip ---------- */
.stats{
  background:var(--ink);color:#fff;padding:2.4rem 0;
  border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);
}
.stats-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;text-align:center;
}
@media (min-width:760px){.stats-grid{grid-template-columns:repeat(4,1fr)}}
.stat .num{font-family:var(--display);font-weight:700;font-size:clamp(2rem,4vw,3rem);color:var(--yellow);line-height:1}
.stat .lbl{display:block;margin-top:.3rem;font-size:.88rem;color:rgba(255,255,255,.78);font-weight:600;letter-spacing:.04em}

/* ---------- ABOUT team ---------- */
.cs-body{font-size:1.04rem;line-height:1.7;color:var(--ink);max-width:62ch}
.cs-body p{margin-bottom:1rem}
.team-grid{display:grid;grid-template-columns:1fr;gap:1.4rem}
@media (min-width:640px){.team-grid{grid-template-columns:1fr 1fr}}
@media (min-width:980px){.team-grid{grid-template-columns:repeat(3,1fr)}}
.member{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.4rem;box-shadow:5px 5px 0 var(--ink);
}
.member-photo{
  width:80px;height:80px;border-radius:50%;background:var(--green);color:#fff;
  font-family:var(--display);font-weight:700;font-size:1.8rem;
  display:grid;place-items:center;
  border:3px solid var(--ink);margin-bottom:.9rem;
}
.member:nth-child(2) .member-photo{background:var(--red)}
.member:nth-child(3) .member-photo{background:var(--orange)}
.member:nth-child(4) .member-photo{background:var(--green-deep)}
.member:nth-child(5) .member-photo{background:var(--yellow-deep)}
.member h4{font-size:1.2rem;margin-bottom:.2rem}
.member-role{font-family:var(--mono);font-weight:600;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green-deep);margin-bottom:.6rem;display:block}
.member p{font-size:.93rem;color:var(--ink-2);line-height:1.55}

/* ---------- FAQ ---------- */
.faq-list{display:grid;gap:.9rem}
.faq{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  box-shadow:4px 4px 0 var(--ink);overflow:hidden;
}
.faq summary{
  list-style:none;cursor:pointer;padding:1.1rem 3rem 1.1rem 1.3rem;
  font-family:var(--display);font-weight:700;font-size:1.05rem;color:var(--ink);
  position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";position:absolute;right:1.2rem;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border-radius:50%;background:var(--yellow);color:var(--ink);
  display:grid;place-items:center;font-size:1.4rem;line-height:1;
  border:2.5px solid var(--ink);
}
.faq[open] summary::after{content:"−";background:var(--red);color:#fff}
.faq-body{
  padding:0 1.3rem 1.2rem;color:var(--ink-2);font-size:.97rem;line-height:1.6;
  border-top:2px dashed var(--line);padding-top:.9rem;
}

/* ---------- FORM ---------- */
.contact-grid{display:grid;grid-template-columns:1fr;gap:2rem}
@media (min-width:960px){.contact-grid{grid-template-columns:1.55fr 1fr;gap:2.4rem;align-items:start}}

.form{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius-lg);
  padding:1.6rem 1.5rem;box-shadow:7px 7px 0 var(--ink);
  display:grid;gap:1.1rem;
}
@media (min-width:640px){.form{padding:2rem 2rem}}
.field{display:flex;flex-direction:column;gap:.4rem}
.field label{
  font-family:var(--display);font-weight:700;font-size:.98rem;color:var(--ink);
  display:flex;align-items:center;gap:.4rem;
}
.req{color:var(--red);font-weight:800}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:1rem;color:var(--ink);
  padding:.75rem .9rem;border-radius:12px;
  border:2.5px solid var(--ink);
  background:var(--cream);
  width:100%;
}
.field textarea{resize:vertical;min-height:120px;line-height:1.55}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:0;background:#fff;border-color:var(--green-deep);
  box-shadow:0 0 0 4px rgba(31,174,91,.18);
}
.field-help{font-size:.82rem;color:var(--ink-2);font-weight:500}
.field-row{display:grid;grid-template-columns:1fr;gap:1.1rem}
@media (min-width:640px){.field-row{grid-template-columns:1fr 1fr}}

.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{
  display:inline-flex;align-items:center;gap:.4rem;cursor:pointer;
  padding:.45rem .9rem;border-radius:999px;
  border:2.5px solid var(--ink);background:var(--cream);
  font-weight:600;font-size:.88rem;color:var(--ink);
}
.chip input{appearance:none;width:14px;height:14px;border-radius:50%;border:2px solid var(--ink);background:#fff;margin:0}
.chip input:checked{background:var(--green);border-color:var(--ink)}
.chip:has(input:checked){background:var(--yellow);box-shadow:2px 2px 0 var(--ink)}

.form-foot{
  display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding-top:.5rem;flex-wrap:wrap;
}
.form-msg{font-size:.92rem;color:var(--ink-2);font-weight:600}
.form-msg.err{color:var(--red)}
.form-msg.ok{color:var(--green-deep)}

/* contact side */
.contact-side{display:grid;gap:1rem}
.contact-block{
  background:var(--cream);border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.2rem 1.3rem;box-shadow:4px 4px 0 var(--ink);
}
.contact-block h4{
  font-family:var(--mono);font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-deep);margin-bottom:.45rem;
}
.contact-block a{font-family:var(--display);font-weight:700;font-size:1.5rem;color:var(--ink);border-bottom:3px solid var(--yellow)}
.contact-block p{font-size:.98rem;color:var(--ink);line-height:1.55}
.contact-block .sub{display:block;margin-top:.5rem;color:var(--ink-2);font-size:.85rem;line-height:1.5;font-weight:500}

/* ---------- SPECIES library ---------- */
.species-bar{
  display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.6rem;
}
.species-bar button{
  padding:.55rem 1rem;border-radius:999px;
  border:2.5px solid var(--ink);background:#fff;color:var(--ink);
  font-weight:700;font-size:.88rem;font-family:var(--display);
  cursor:pointer;
}
.species-bar button[aria-pressed="true"]{background:var(--green);color:#fff;box-shadow:3px 3px 0 var(--ink)}

.species-grid{display:grid;grid-template-columns:1fr;gap:1.2rem}
@media (min-width:640px){.species-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.species-grid{grid-template-columns:repeat(3,1fr)}}
.species{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.3rem 1.3rem;box-shadow:5px 5px 0 var(--ink);
}
.species-cat{
  font-family:var(--mono);font-weight:600;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--green-deep);display:block;margin-bottom:.3rem;
}
.species h4{font-size:1.2rem;margin-bottom:.2rem}
.species .latin{font-style:italic;font-size:.9rem;color:var(--ink-2);margin-bottom:.8rem}
.species dl{display:grid;gap:.5rem}
.species dt{font-family:var(--mono);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red-deep)}
.species dd{font-size:.93rem;color:var(--ink-2);line-height:1.5;margin-bottom:.3rem}

/* ---------- FOOTER ---------- */
.site-footer{
  background:var(--ink);color:#fff;
  padding:3.4rem 0 1.6rem;border-top:6px solid var(--green);
  position:relative;
}
.site-footer::before{
  content:"";position:absolute;left:0;right:0;top:-6px;height:6px;
  background:repeating-linear-gradient(90deg,var(--green) 0 30px,var(--yellow) 30px 60px,var(--red) 60px 90px,var(--ink) 90px 120px);
}
.foot-grid{
  display:grid;grid-template-columns:1fr;gap:2rem;margin-bottom:2.4rem;
}
@media (min-width:640px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.foot-grid{grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2.4rem}}
.foot-brand{
  font-family:var(--display);font-weight:700;font-size:2rem;color:#fff;
  display:inline-flex;align-items:center;gap:.6rem;margin-bottom:.7rem;
}
.foot-brand::before{
  content:"";
  width:42px;height:42px;border-radius:12px;
  background-color:var(--green);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'><g fill='none' stroke-linecap='round'><line x1='20' y1='14' x2='12' y2='6' stroke='%23ffffff' stroke-width='3'/><line x1='40' y1='14' x2='48' y2='6' stroke='%23ffffff' stroke-width='3'/><circle cx='12' cy='6' r='3.2' fill='%23ffc83a'/><circle cx='48' cy='6' r='3.2' fill='%23ffc83a'/><circle cx='30' cy='32' r='18' fill='%23ffffff' stroke='%231a2233' stroke-width='2.4'/><line x1='30' y1='15' x2='30' y2='49' stroke='%231a2233' stroke-width='2.4'/><circle cx='22' cy='28' r='2.5' fill='%231a2233'/><circle cx='38' cy='28' r='2.5' fill='%231a2233'/><circle cx='23' cy='40' r='2' fill='%231a2233'/><circle cx='37' cy='40' r='2' fill='%231a2233'/><path d='M22 35 Q 30 41 38 35' stroke='%231a2233' stroke-width='2.2' fill='none'/></g></svg>");
  background-repeat:no-repeat;background-position:center;background-size:90% 90%;
  border:2.5px solid var(--yellow);
  transform:rotate(-4deg);
  flex-shrink:0;
}
.foot-brand em{color:var(--yellow);font-style:normal}
.foot-tag{font-size:.95rem;color:rgba(255,255,255,.75);line-height:1.6;max-width:36ch}
.site-footer h4{
  font-family:var(--mono);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--yellow);margin-bottom:.9rem;
}
.foot-list{display:grid;gap:.45rem}
.foot-list a{color:rgba(255,255,255,.82);font-size:.95rem;font-weight:500}
.foot-list a:hover{color:var(--yellow)}
.foot-sub{font-size:.88rem;color:rgba(255,255,255,.72);line-height:1.6}
.foot-bottom{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;
  padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.12);
  font-size:.82rem;color:rgba(255,255,255,.6);
}
.foot-bottom a{color:rgba(255,255,255,.82);border-bottom:1px solid rgba(255,255,255,.25)}

/* ---------- helpers ---------- */
.mt-2{margin-top:.6rem}
.mt-3{margin-top:1.2rem}
.mt-4{margin-top:2rem}
.mb-3{margin-bottom:1.2rem}
.mb-4{margin-bottom:2rem}
.center{text-align:center}
.dim{color:var(--ink-2)}
.mono{font-family:var(--mono);letter-spacing:.04em}
.section-tight{padding:2.4rem 0}

/* fade-in reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:translateY(0)}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* ---------- CAPS (numbered cards on preservation page) ---------- */
.caps{
  display:grid;grid-template-columns:1fr;gap:1.4rem;
}
@media (min-width:640px){.caps{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.caps{grid-template-columns:repeat(3,1fr)}}
.cap{
  background:#fff;border:3px solid var(--ink);border-radius:var(--radius);
  padding:1.5rem 1.4rem;box-shadow:5px 5px 0 var(--ink);position:relative;
}
.cap-num{
  display:inline-grid;place-items:center;
  width:46px;height:46px;border-radius:14px;
  background:var(--green);color:#fff;
  font-family:var(--display);font-weight:700;font-size:1.15rem;
  border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);
  margin-bottom:.8rem;
}
.cap:nth-child(2) .cap-num{background:var(--red)}
.cap:nth-child(3) .cap-num{background:var(--orange)}
.cap:nth-child(4) .cap-num{background:var(--ink)}
.cap:nth-child(5) .cap-num{background:var(--yellow-deep)}
.cap:nth-child(6) .cap-num{background:var(--green-deep)}
.cap h3{font-size:1.2rem;margin-bottom:.45rem}
.cap p{font-size:.95rem;color:var(--ink-2);line-height:1.55}

/* ---------- QUOTE block ---------- */
.quote{
  max-width:60ch;margin:0 auto;text-align:center;
}
.quote-text{
  font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,3vw,2rem);
  line-height:1.3;color:inherit;margin-bottom:1.2rem;
  position:relative;padding:0 1.5rem;
}
.quote-text::before,.quote-text::after{
  font-family:var(--display);font-size:2.4rem;color:var(--yellow);
  line-height:1;vertical-align:-.15em;
}
.quote-text::before{content:"“";margin-right:.2rem}
.quote-text::after{content:"”";margin-left:.2rem}
.quote-text em{color:var(--yellow);font-style:italic}
.quote-meta{
  font-family:var(--mono);font-size:.85rem;letter-spacing:.08em;
  color:rgba(255,255,255,.78);
}
.quote-meta strong{color:#fff;font-weight:700}

/* ---------- AREAS list (service-areas.html) ---------- */
.areas{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem;
}
.areas li{
  background:#fff;border:3px solid var(--ink);border-radius:14px;
  padding:.85rem 1rem;font-weight:700;color:var(--ink);
  box-shadow:3px 3px 0 var(--ink);
  display:flex;justify-content:space-between;align-items:center;gap:.5rem;
}
.areas li small{
  font-family:var(--mono);font-weight:600;font-size:.78rem;letter-spacing:.08em;
  background:var(--paper-2);color:var(--ink-2);padding:.18rem .55rem;border-radius:999px;
}

/* ---------- LEGAL pages (privacy/terms/warranty) ---------- */
.legal{
  max-width:740px;margin:0 auto;padding:3rem 1.4rem 4rem;
}
.legal h2{
  font-size:1.45rem;margin:2rem 0 .6rem;color:var(--ink);
  padding-bottom:.3rem;border-bottom:3px solid var(--yellow);display:inline-block;
}
.legal h2:first-of-type{margin-top:.5rem}
.legal p{margin-bottom:1rem;color:var(--ink-2);line-height:1.7;font-size:1rem}
.legal ul{margin:.6rem 0 1.2rem 1.2rem;list-style:disc;color:var(--ink-2)}
.legal ul li{margin-bottom:.4rem;line-height:1.55}

/* ---------- LATIN-NAME (legacy name on database/about pages) ---------- */
.latin-name{font-style:italic;font-size:.9rem;color:var(--ink-2);display:block;margin-bottom:.7rem}

/* =============================================================
   CHATBOT WIDGET
   ============================================================= */
.chat-widget{
  position:fixed;right:1.2rem;bottom:1.2rem;z-index:100;
  font-family:var(--sans);
}
.chat-launcher{
  display:flex;align-items:center;gap:.6rem;
  background:var(--green);color:#fff;
  padding:.85rem 1.2rem;border-radius:999px;
  border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);
  font-family:var(--display);font-weight:700;font-size:1rem;
  cursor:pointer;transition:transform .15s, box-shadow .15s;
}
.chat-launcher:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.chat-launcher svg{width:22px;height:22px}
.chat-launcher .pulse{
  width:10px;height:10px;border-radius:50%;background:var(--yellow);
  box-shadow:0 0 0 0 rgba(255,200,58,.7);animation:pulse 1.6s infinite;
}
@media (max-width:540px){.chat-launcher .lbl{display:none}.chat-launcher{padding:.85rem;border-radius:50%;width:60px;height:60px;justify-content:center}}

.chat-panel{
  position:fixed;right:1.2rem;bottom:5.2rem;z-index:101;
  width:min(380px,calc(100vw - 2rem));
  height:min(560px,calc(100vh - 7rem));
  background:#fff;border:3px solid var(--ink);border-radius:20px;
  box-shadow:8px 8px 0 var(--ink);
  display:none;flex-direction:column;overflow:hidden;
}
.chat-panel[data-open="true"]{display:flex;animation:chatIn .25s ease}
@keyframes chatIn{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@media (max-width:540px){
  .chat-panel{right:.6rem;left:.6rem;bottom:5rem;width:auto;height:calc(100vh - 7rem);max-height:75vh}
}

.chat-head{
  background:var(--green);color:#fff;
  padding:.95rem 1.1rem;display:flex;align-items:center;gap:.7rem;
  border-bottom:3px solid var(--ink);
}
.chat-head .avi{
  width:38px;height:38px;border-radius:12px;background:#fff;
  display:grid;place-items:center;flex-shrink:0;
  border:2.5px solid var(--ink);
}
.chat-head .avi svg{width:24px;height:24px;color:var(--green)}
.chat-head .who{flex:1;line-height:1.2}
.chat-head .who b{font-family:var(--display);font-weight:700;font-size:1.05rem;display:block}
.chat-head .who small{font-size:.78rem;color:rgba(255,255,255,.9);display:flex;align-items:center;gap:.35rem}
.chat-head .who small::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime)}
.chat-head .close{
  width:32px;height:32px;border-radius:10px;background:rgba(0,0,0,.18);color:#fff;
  display:grid;place-items:center;border:2px solid rgba(255,255,255,.4);
  font-size:1.1rem;font-weight:700;
}
.chat-head .close:hover{background:rgba(0,0,0,.32)}

.chat-body{
  flex:1;overflow-y:auto;padding:1rem;
  background:var(--cream);
  display:flex;flex-direction:column;gap:.7rem;
  scroll-behavior:smooth;
}
.chat-msg{
  max-width:82%;padding:.7rem .95rem;border-radius:18px;
  font-size:.95rem;line-height:1.45;
  border:2.5px solid var(--ink);
  word-wrap:break-word;
}
.chat-msg.bot{
  align-self:flex-start;background:#fff;color:var(--ink);
  border-bottom-left-radius:4px;box-shadow:3px 3px 0 var(--ink);
}
.chat-msg.user{
  align-self:flex-end;background:var(--yellow);color:var(--ink);
  border-bottom-right-radius:4px;box-shadow:3px 3px 0 var(--ink);
  font-weight:600;
}
.chat-msg.err{background:#ffe0e0;color:var(--red-deep);border-color:var(--red)}
.chat-typing{
  align-self:flex-start;display:inline-flex;gap:4px;
  background:#fff;border:2.5px solid var(--ink);border-radius:18px;
  padding:.7rem .95rem;box-shadow:3px 3px 0 var(--ink);
  border-bottom-left-radius:4px;
}
.chat-typing span{
  width:7px;height:7px;border-radius:50%;background:var(--ink-2);
  animation:chatBounce 1.2s infinite;
}
.chat-typing span:nth-child(2){animation-delay:.15s}
.chat-typing span:nth-child(3){animation-delay:.3s}
@keyframes chatBounce{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-6px);opacity:1}}

.chat-quick{
  display:flex;flex-wrap:wrap;gap:.4rem;
  padding:.6rem 1rem 0;
}
.chat-quick button{
  background:#fff;border:2px solid var(--ink);border-radius:999px;
  padding:.4rem .8rem;font-size:.82rem;font-weight:600;cursor:pointer;
  color:var(--ink);
}
.chat-quick button:hover{background:var(--yellow)}

.chat-form{
  display:flex;gap:.5rem;padding:.8rem;
  border-top:3px solid var(--ink);background:#fff;
}
.chat-form input{
  flex:1;padding:.7rem .9rem;border-radius:14px;
  border:2.5px solid var(--ink);background:var(--cream);
  font-family:var(--sans);font-size:.95rem;color:var(--ink);
}
.chat-form input:focus{outline:0;background:#fff;border-color:var(--green-deep);box-shadow:0 0 0 3px rgba(31,174,91,.18)}
.chat-form button{
  width:46px;height:46px;border-radius:14px;
  background:var(--red);color:#fff;border:2.5px solid var(--ink);
  display:grid;place-items:center;cursor:pointer;
  box-shadow:3px 3px 0 var(--ink);transition:transform .12s, box-shadow .12s;
}
.chat-form button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.chat-form button:disabled{background:var(--line);box-shadow:none;transform:none;cursor:not-allowed}
.chat-form button svg{width:20px;height:20px}

/* =============================================================
   ACCESSIBILITY WIDGET
   ============================================================= */
.a11y-widget{
  position:fixed;left:1.2rem;bottom:1.2rem;z-index:100;
  font-family:var(--sans);
}
.a11y-launcher{
  width:56px;height:56px;border-radius:50%;
  background:var(--ink);color:var(--yellow);
  border:3px solid var(--ink);box-shadow:5px 5px 0 var(--green);
  display:grid;place-items:center;cursor:pointer;
  transition:transform .15s, box-shadow .15s;
}
.a11y-launcher:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--green)}
.a11y-launcher svg{width:30px;height:30px}

.a11y-panel{
  position:fixed;left:1.2rem;bottom:5.4rem;z-index:101;
  width:min(280px,calc(100vw - 2rem));
  background:#fff;border:3px solid var(--ink);border-radius:18px;
  box-shadow:8px 8px 0 var(--ink);
  display:none;overflow:hidden;
}
.a11y-panel[data-open="true"]{display:block;animation:chatIn .25s ease}
.a11y-panel header{
  background:var(--ink);color:var(--yellow);
  padding:.85rem 1rem;display:flex;align-items:center;justify-content:space-between;
}
.a11y-panel header strong{font-family:var(--display);font-weight:700;font-size:1rem}
.a11y-panel header button{
  width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.12);color:var(--yellow);
  display:grid;place-items:center;border:0;font-weight:700;
}
.a11y-options{padding:.7rem;display:grid;gap:.4rem}
.a11y-options button{
  display:flex;align-items:center;gap:.6rem;width:100%;
  padding:.7rem .85rem;border-radius:12px;background:var(--cream);
  border:2px solid var(--ink);font-weight:600;font-size:.92rem;color:var(--ink);
  cursor:pointer;text-align:left;
}
.a11y-options button:hover{background:var(--yellow)}
.a11y-options button[aria-pressed="true"]{background:var(--green);color:#fff;box-shadow:2px 2px 0 var(--ink)}
.a11y-options button[data-a11y="reset"]{background:var(--red);color:#fff;border-color:var(--ink);justify-content:center}
.a11y-options button[data-a11y="reset"]:hover{background:var(--red-deep)}
.a11y-options button .ic{font-size:1.1rem;line-height:1;flex-shrink:0;width:22px;text-align:center}

/* === A11y body modes (WCAG AAA-leaning) === */
body.a11y-large{font-size:19px}
body.a11y-large h1{font-size:clamp(2.8rem,7vw,5.3rem)}
body.a11y-large h2{font-size:clamp(2rem,4.5vw,3rem)}
body.a11y-large h3{font-size:1.45rem}
body.a11y-large .lede{font-size:1.22rem}
body.a11y-large p,body.a11y-large li,body.a11y-large .field input,body.a11y-large .field textarea{font-size:1.05rem}
body.a11y-large .btn{padding:1.05rem 1.7rem;font-size:1.05rem}

/* Dyslexia-friendly: Atkinson Hyperlegible (Braille Institute open font),
   bold weight, wider tracking, no italic for body text. Font is loaded via
   the top-of-file @import. */
body.a11y-dyslexia,
body.a11y-dyslexia h1,body.a11y-dyslexia h2,body.a11y-dyslexia h3,body.a11y-dyslexia h4,
body.a11y-dyslexia p,body.a11y-dyslexia li,body.a11y-dyslexia a,body.a11y-dyslexia span,
body.a11y-dyslexia input,body.a11y-dyslexia textarea,body.a11y-dyslexia select,body.a11y-dyslexia button{
  font-family:'Atkinson Hyperlegible', 'Comic Sans MS', system-ui, sans-serif !important;
  font-style:normal!important;
  letter-spacing:.02em;
}
body.a11y-dyslexia em{font-style:normal!important;font-weight:700!important;text-decoration:underline;text-decoration-thickness:2px}

/* Wider spacing — WCAG 1.4.12 reflow + spacing minimums (×1.5 line height, etc.) */
body.a11y-spacing{line-height:1.75!important}
body.a11y-spacing p,body.a11y-spacing li,body.a11y-spacing a,body.a11y-spacing span,
body.a11y-spacing h1,body.a11y-spacing h2,body.a11y-spacing h3,body.a11y-spacing h4{
  letter-spacing:.12em!important;
  word-spacing:.18em!important;
}
body.a11y-spacing p{margin-bottom:1.4rem!important;line-height:2!important}

/* Grayscale (light-sensitivity / focus-on-content) */
body.a11y-grayscale{filter:grayscale(1) contrast(1.05)}
body.a11y-grayscale .chat-widget,body.a11y-grayscale .a11y-widget{filter:none}

body.a11y-contrast{background:#000!important;color:#fff!important}
body.a11y-contrast::before{display:none}
body.a11y-contrast .site-header,
body.a11y-contrast .service-card,
body.a11y-contrast .tier,
body.a11y-contrast .testi,
body.a11y-contrast .why-card,
body.a11y-contrast .contact-block,
body.a11y-contrast .form,
body.a11y-contrast .faq,
body.a11y-contrast .cap,
body.a11y-contrast .spec-table,
body.a11y-contrast .areas li,
body.a11y-contrast .icon-item,
body.a11y-contrast .species,
body.a11y-contrast .member,
body.a11y-contrast .testi,
body.a11y-contrast .chip,
body.a11y-contrast .field input,
body.a11y-contrast .field select,
body.a11y-contrast .field textarea,
body.a11y-contrast .nav-links a,
body.a11y-contrast .chat-panel,
body.a11y-contrast .chat-body,
body.a11y-contrast .a11y-panel{background:#000!important;color:#fff!important;border-color:#fff!important}
body.a11y-contrast .page-head,
body.a11y-contrast .hero,
body.a11y-contrast .section,
body.a11y-contrast .bg-bone,
body.a11y-contrast .bg-parchment{background:#000!important}
body.a11y-contrast .hero::after,body.a11y-contrast .page-head::after,body.a11y-contrast .site-footer::before{display:none}
body.a11y-contrast h1,body.a11y-contrast h2,body.a11y-contrast h3,body.a11y-contrast h4,body.a11y-contrast h5,
body.a11y-contrast p,body.a11y-contrast li,body.a11y-contrast a,body.a11y-contrast span,
body.a11y-contrast .lede,body.a11y-contrast .crumb,body.a11y-contrast .deck{color:#fff!important}
body.a11y-contrast em{color:var(--yellow)!important}
body.a11y-contrast .eyebrow{background:var(--yellow)!important;color:#000!important;border-color:#fff!important}
body.a11y-contrast .btn{border-color:#fff!important;color:#fff!important;background:#000!important;box-shadow:4px 4px 0 var(--yellow)!important}
body.a11y-contrast .btn-primary,body.a11y-contrast .btn-oxblood{background:var(--red)!important;color:#fff!important}
body.a11y-contrast .btn-ghost{background:var(--yellow)!important;color:#000!important}
body.a11y-contrast .stats{background:#000!important;border-color:#fff!important}
body.a11y-contrast .urgent,body.a11y-contrast .cta,body.a11y-contrast .promo-band{background:#000!important;border-color:#fff!important}

body.a11y-underline a:not(.btn):not(.brand):not(.foot-brand){text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:3px!important}

body.a11y-motion *,body.a11y-motion *::before,body.a11y-motion *::after{
  animation:none!important;transition:none!important;
}

/* hide scrollbar inside chat body when motion disabled keeps layout stable */
.chat-body::-webkit-scrollbar{width:8px}
.chat-body::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.chat-body::-webkit-scrollbar-track{background:transparent}

/* =============================================================
   AUDIT FIXES — defensive rules for legacy inline styles & markup
   ============================================================= */

/* Some inner pages reference CSS vars that don't exist in the new palette.
   Provide aliases so the inline styles still resolve to a readable color. */
:root{
  --serif:var(--display);
  --moss:var(--ink);
  --slate:var(--ink-2);
  --oxblood:var(--red);            /* used in inline border colors */
}

/* .cs-body — 2-col label/body layout used by preservation + about story sections */
.cs-body{display:grid;grid-template-columns:1fr;gap:1.2rem;align-items:start}
@media (min-width:880px){.cs-body{grid-template-columns:200px 1fr;gap:2.4rem}}
.cs-body > aside{
  font-family:var(--mono);font-weight:700;font-size:.8rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--green-deep);
  padding:.5rem .85rem;background:var(--yellow);border:2px solid var(--ink);
  border-radius:999px;display:inline-block;justify-self:start;
  box-shadow:2px 2px 0 var(--ink);
}
.cs-body p{font-size:1rem;line-height:1.7;color:var(--ink);margin-bottom:1rem}

/* Inline-link styling residue on dark backgrounds (footer addresses) */
.site-footer address a[style*="247,241,222"]{color:rgba(255,255,255,.88)!important}
.site-footer .foot-tag,.site-footer address{color:rgba(255,255,255,.78)}

/* dispatch.html contact sidebar — service-area link "Full list" needs visible color */
.contact-block a[style*="oxblood"]{color:var(--green-deep)!important;border-bottom:2px solid var(--yellow)!important}

/* FAQ category headers — inline styles use --mono + --oxblood; ensure spacing */
.faq-list + h2,.section h2[style*="oxblood"]{margin-top:2rem!important}

/* careers.html role articles — inline border-top:1px solid var(--line) needs the var */
/* Already handled by alias above. */

/* preservation.html clients list — `--bone` is defined; `--line` is defined. OK. */

/* Make sure chatbot/a11y widgets float above sticky header on tiny screens */
.chat-widget,.a11y-widget{z-index:200}
.chat-panel,.a11y-panel{z-index:201}

/* Hide chat & a11y widgets when nav drawer is open on mobile to avoid stacking */
@media (max-width:1023px){
  body[data-nav-open="true"] .chat-widget,
  body[data-nav-open="true"] .a11y-widget{display:none}
}

/* Brand text on very small screens — let "Aegis Pest Busters" wrap nicely */
@media (max-width:380px){
  .brand-text strong{font-size:1.1rem;line-height:1.05}
  .brand-text small{font-size:.65rem}
  .brand-mark{width:44px;height:44px}
}

/* Ensure form textarea doesn't break out of card on mobile */
.form textarea{max-width:100%}

/* Make sure focus rings always visible for keyboard users */
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}
.btn:focus-visible,.chat-form button:focus-visible{outline-offset:5px}

/* legacy classes from previous index design — neutralized so old markup never breaks layout */
.volume,.index-overlay,.frontispiece,.section-opener,.essay,.footnotes,
.specimen-set,.specimen,.subscription,.with-margin,.correspondence,
.colophon-foot,.divider-rule,.epigraph,.imprint-block{all:revert}