/* Reset + base */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-sans);
  font-size:var(--fs-base);
  line-height:1.6;
  color:var(--color-text);
  background:var(--color-bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:var(--color-primary);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--color-primary-600)}
h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2;color:var(--color-text);letter-spacing:-.02em}
h1{font-size:var(--fs-4xl)}
h2{font-size:var(--fs-3xl)}
h3{font-size:var(--fs-2xl)}
h4{font-size:var(--fs-xl)}
p{color:var(--color-text)}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:4px}

/* Layout helpers */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--sp-6)}
.section{padding:var(--sp-20) 0}
.section-sm{padding:var(--sp-12) 0}
.grid{display:grid;gap:var(--sp-6)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-5{grid-template-columns:repeat(5,1fr)}
.grid-1-1{grid-template-columns:1fr 1fr}
.grid-2-1{grid-template-columns:2fr 1fr}
.flex{display:flex}
.flex-center{display:flex;align-items:center;justify-content:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.gap-2{gap:var(--sp-2)} .gap-3{gap:var(--sp-3)} .gap-4{gap:var(--sp-4)} .gap-6{gap:var(--sp-6)}
.text-center{text-align:center}
.text-muted{color:var(--color-muted)}
.text-accent{color:var(--color-accent)}
.text-primary{color:var(--color-primary)}
.mt-2{margin-top:var(--sp-2)} .mt-3{margin-top:var(--sp-3)} .mt-4{margin-top:var(--sp-4)}
.mt-6{margin-top:var(--sp-6)} .mt-8{margin-top:var(--sp-8)} .mt-12{margin-top:var(--sp-12)}
.mb-2{margin-bottom:var(--sp-2)} .mb-4{margin-bottom:var(--sp-4)} .mb-6{margin-bottom:var(--sp-6)}
.mb-8{margin-bottom:var(--sp-8)} .mb-12{margin-bottom:var(--sp-12)}
.hidden{display:none!important}
.eyebrow{
  display:inline-block;font-size:var(--fs-xs);font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--color-accent);margin-bottom:var(--sp-3);
}

.section-head{max-width:720px;margin:0 auto var(--sp-12);text-align:center}
.section-head h2{margin-bottom:var(--sp-3)}
.section-head p{color:var(--color-muted);font-size:var(--fs-lg)}

/* Responsive grids */
@media (max-width:1024px){
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-5{grid-template-columns:repeat(3,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .grid-2-1{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  :root{--fs-4xl:2.25rem;--fs-3xl:1.875rem;--fs-5xl:2.75rem}
  .grid-2,.grid-3,.grid-4,.grid-5,.grid-1-1,.grid-2-1{grid-template-columns:1fr}
  .section{padding:var(--sp-16) 0}
}

/* Visibility Utilities */
.mobile-only { display: none !important; }
@media (max-width:900px) {
  .desktop-only { display: none !important; }
  .mobile-only { display: block !important; }
  span.mobile-only, button.mobile-only, a.mobile-only { display: inline-flex !important; }
}
