/* Reset + base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body{font-family:var(--font-body);background:var(--navy);color:var(--navy);line-height:1.55;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
img,svg,video{display:block;max-width:100%;height:auto}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
a{color:inherit;text-decoration:none}
input,textarea,select{font-family:inherit;font-size:100%}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}

/* Skip to content */
.skip{position:absolute;top:-100px;left:8px;background:var(--gold);color:var(--navy);padding:10px 18px;border-radius:6px;font-weight:600;font-size:0.9rem;z-index:200;transition:top 0.2s}
.skip:focus{top:8px}

/* Typography */
h1, h2 {
  font-family: var(--font-heading);
  letter-spacing: -0.035em;
  line-height: 1.1;
  color: inherit;
}
h3, h4, h5 {
  font-family: var(--font-subheading);
  letter-spacing: -0.015em;
  line-height: 1.25;
  color: inherit;
}
h1 {
  font-size: clamp(2.4rem, 6vw, 5.2rem);
  font-weight: 800;
}
h2 {
  font-size: clamp(1.9rem, 4vw, 3.3rem);
  font-weight: 700;
}
h3 {
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  font-weight: 600;
}
h4 {
  font-size: 1.15rem;
  font-weight: 600;
}
p {
  font-size: 1.02rem;
  line-height: 1.75;
  letter-spacing: -0.01em;
}
.lead {
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.7;
  letter-spacing: -0.012em;
}
.eyebrow {
  display: inline-block;
  font-family: var(--font-label);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  padding: 6px 14px;
  border: 1px solid var(--border-dark);
  border-radius: var(--r-pill);
  background: rgba(245, 197, 24, 0.05);
}
.text-gold { color: var(--gold); }
.text-grey { color: var(--grey); }
.text-grey-soft { color: var(--grey-soft); }
.text-white { color: var(--white); }
strong { font-weight: 600; }
em { font-style: italic; }

/* Layout */
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.container-narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 24px}
section{padding:120px 0;position:relative}
.section-light{background:var(--white);color:var(--navy)}
.section-light-grey{background:var(--light);color:var(--navy)}
.section-dark{background:var(--navy);color:var(--white)}
.section-gradient{background:radial-gradient(ellipse at 50% 0%,#11203A 0%,#0C1626 70%);color:var(--white);position:relative;overflow:hidden}
.section-header{text-align:center;max-width:780px;margin:0 auto 60px}
.section-header h2{margin:18px 0}
.section-header p{color:var(--grey)}
.section-dark .section-header p,.section-gradient .section-header p{color:var(--grey-soft)}
.divider{height:1px;background:var(--border-soft);max-width:120px;margin:24px auto;border:none}

@media (max-width:768px){
  section{padding:80px 0}
  h1{line-height:1.05}
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}
}

/* Specific Font Pairings & Polished Overrides */

/* Subheadings & Descriptions (Manrope) */
.hero-sub, 
.subhero p, 
.big-question-sub, 
.form-card-sub, 
.sysc-desc, 
.outcome p, 
.proc-content p, 
.case-card p, 
.blog-card p, 
.cta-left p,
.retainer p {
  font-family: var(--font-subheading) !important;
  font-weight: 500 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.6 !important;
}

/* UI Buttons, Inputs, Labels & Small Meta-text (Space Grotesk) */
button, 
.btn, 
.nav-link, 
.nav-cta, 
.eyebrow, 
.logos-label, 
.logo-item, 
.team-role, 
.outcome-icon, 
.proc-circle, 
.sysc-tag, 
.sysc-price, 
.sysc-price-num, 
.sysc-price-from, 
.retainer-price, 
.form-submit, 
label, 
input, 
textarea, 
select, 
.honey, 
.cmdk-item-kind, 
.cmdk-input, 
.case-card-header h4, 
.float-wa, 
.results-grid, 
.result-val, 
.result-lbl, 
.blog-tag, 
.blog-readmore {
  font-family: var(--font-label) !important;
}

/* Uppercase tracking for eyebrows, labels, and small badges */
.logos-label,
.team-role,
.sysc-tag,
.blog-tag,
.cmdk-item-kind,
label {
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
}

/* Stats, Pricing, Numbers & Meta Value Counters */
.result-val,
.sysc-price-num,
.retainer-price {
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* Navigation, CTA links and Buttons UI spacing */
.btn,
.nav-link,
.nav-cta,
.form-submit,
.blog-readmore {
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}

/* Legal Content & Neutral Footnotes (IBM Plex Sans) */
.legal-content, 
.legal-content p, 
.legal-content h3, 
.footer-bottom, 
.footer-bottom div, 
.footer-bottom a, 
.footer-bottom span {
  font-family: var(--font-legal) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.65 !important;
  font-size: 0.86rem !important;
}


