/* =========================================================
   ThrottleReady — base layer
   Resets, page shell, typography primitives, utilities.
   Transcribed from design_files/styles.css.
   ========================================================= */

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--concrete);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,4vw,40px);}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}
.display{font-family:var(--anton);text-transform:uppercase;font-weight:400;letter-spacing:.005em;line-height:.92;}

/* ---------- Section ---------- */
/* Vertical padding only. Using the shorthand here would reset .wrap's
   horizontal gutter to zero whenever the two classes share an element. */
.section{padding-top:clamp(48px,8vw,92px);padding-bottom:clamp(48px,8vw,92px);}
.sec-label{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--orange);margin-bottom:14px;}

/* ---------- Image placeholder ----------
   Every image in the design handoff is one of these. They stay until real
   photography exists; the data-label attribute names what belongs there. */
.ph{
  position:relative;overflow:hidden;background:#dad9d3;
  background-image:repeating-linear-gradient(135deg, rgba(0,0,0,.045) 0 12px, rgba(0,0,0,0) 12px 24px);
}
.ph[data-label]::after{
  content:attr(data-label);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#83827c;text-align:center;padding:10px;
}
.ph.dark{background:#23242a;background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 12px, rgba(255,255,255,0) 12px 24px);}
.ph.dark[data-label]::after{color:#6f7178;}

/* ---------- Utilities ---------- */
.muted{color:var(--muted);}
/* self-declared certification note */
.declared-note{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--muted);line-height:1.5;}
.declared-note svg{flex:none;margin-top:1px;}
.center{text-align:center;}
.divider-h{height:1px;background:var(--line);border:none;margin:0;}
.tnum{font-variant-numeric:tabular-nums;}
.hide-d{display:none;}
.chip-scroll{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.chip-scroll::-webkit-scrollbar{display:none;}

/* Screen-reader-only text. Not in the original stylesheet — the mockups had no
   skip link, but WordPress themes need one for WCAG 2.1 AA (spec §9). */
.screen-reader-text{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.screen-reader-text:focus{
  position:fixed;top:10px;left:10px;z-index:100000;width:auto;height:auto;
  clip:auto;white-space:normal;padding:13px 22px;border-radius:var(--r-sm);
  background:var(--hivis);color:var(--char);font-weight:800;font-size:14px;
}