:root {
  --clsColorRed: #e5231b;
  --clsColorRedDark: #bf1812;
  --clsColorInk: #2c364a;
  --clsColorText: #4a4e55;
  --clsColorMuted: #717981;
  --clsColorLine: #dce0e4;
  --clsColorSoft: #f6f7f9;
  --clsColorWhite: #ffffff;
  --clsShadow: 0 18px 50px rgba(44, 54, 74, 0.12);
  --clsRadius: 1.1rem;
  --clsMaxWidth: 74rem;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--clsColorText);
  background: var(--clsColorWhite);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1rem;
  line-height: 1.65;
}

img { display: block; max-width: 100%; }

a { color: var(--clsColorRed); text-underline-offset: 0.18em; }

a:hover { color: var(--clsColorRedDark); }

h1, h2, h3, p { margin-top: 0; }

h1, h2, h3 { color: var(--clsColorInk); line-height: 1.1; }

h1 { font-size: clamp(2.5rem, 7vw, 4.9rem); font-weight: 400; letter-spacing: -0.055em; }

h2 { font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 400; letter-spacing: -0.04em; }

h3 { font-size: 1.22rem; }

.clsContainer { width: min(calc(100% - 2.5rem), var(--clsMaxWidth)); margin: 0 auto; }

.clsSkipLink {
  position: fixed;
  z-index: 100;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.65rem 0.85rem;
  color: var(--clsColorWhite);
  background: var(--clsColorInk);
  transform: translateY(-140%);
}

.clsSkipLink:focus { transform: translateY(0); }

.clsSiteHeader { position: sticky; z-index: 20; top: 0; background: rgba(255, 255, 255, 0.96); border-bottom: 1px solid rgba(44, 54, 74, 0.1); backdrop-filter: blur(14px); }

.clsHeaderInner { display: flex; align-items: center; justify-content: space-between; min-height: 5.3rem; gap: clamp(0.5rem, 2vw, 1rem); }

.clsBrand { flex: 1 1 auto; min-width: 0; }

.clsBrand img { width: 22.3125rem; max-width: 100%; height: auto; }

.clsMenuToggle { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.55rem 0.7rem; color: var(--clsColorInk); border: 1px solid var(--clsColorLine); border-radius: 0.35rem; background: var(--clsColorWhite); font: inherit; font-weight: 700; cursor: pointer; }

.clsMainNav { position: absolute; top: 100%; right: 0; left: 0; display: none; padding: 1rem 1.25rem 1.25rem; background: var(--clsColorWhite); border-bottom: 1px solid var(--clsColorLine); box-shadow: 0 16px 24px rgba(44, 54, 74, 0.1); }

.clsMainNav.clsMenuOpen { display: grid; gap: 0.5rem; }

.clsMainNav a { padding: 0.45rem 0; color: var(--clsColorInk); font-size: 1.1rem; font-weight: 700; text-decoration: none; }

.clsMainNav a:hover { color: var(--clsColorRed); }

.clsHero { overflow: hidden; padding: clamp(4.5rem, 9vw, 8rem) 0 clamp(4.5rem, 9vw, 7rem); background: linear-gradient(135deg, #ffffff 0%, #f7f8fa 62%, #eceff2 100%); }

.clsHeroGrid { display: grid; gap: 3.2rem; align-items: center; }

.clsHeroCopy { max-width: 44rem; }

.clsEyebrow { margin-bottom: 1rem; color: var(--clsColorRed); font-size: 0.79rem; font-weight: 700; letter-spacing: 0.1em; line-height: 1.35; text-transform: uppercase; }

.clsLead { max-width: 41rem; margin: 1.6rem 0 2rem; font-size: clamp(1.13rem, 2.2vw, 1.42rem); line-height: 1.55; }

.clsButtonGroup { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem 1.5rem; }

.clsButton { display: inline-flex; align-items: center; justify-content: center; gap: 0.7rem; padding: 0.95rem 1.2rem; border-radius: 0.25rem; font-weight: 700; line-height: 1.3; text-align: center; text-decoration: none; transition: background 160ms ease, color 160ms ease, transform 160ms ease; }

.clsButton:hover { transform: translateY(-2px); }

.clsButtonPrimary { color: var(--clsColorWhite); background: var(--clsColorRed); box-shadow: 0 10px 20px rgba(229, 35, 27, 0.2); }

.clsButtonPrimary:hover { color: var(--clsColorWhite); background: var(--clsColorRedDark); }

.clsTextLink { display: inline-flex; align-items: center; gap: 0.55rem; padding: 0.3rem 0; color: var(--clsColorInk); border-bottom: 2px solid var(--clsColorRed); font-weight: 700; text-decoration: none; transition: color 180ms ease, gap 180ms ease; }

.clsScrollIcon { display: grid; width: 2.35rem; height: 2.35rem; place-items: center; color: var(--clsColorWhite); background: var(--clsColorRed); border-radius: 50%; }

.clsScrollIcon svg { width: 1.65rem; height: 1.65rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3.5; }

.clsTextLink:hover { gap: 0.8rem; color: var(--clsColorRedDark); }

.clsHeroHint { margin: 2rem 0 0; color: var(--clsColorMuted); font-size: 0.9rem; }

.clsHeroPanel { position: relative; padding: 1.5rem; color: var(--clsColorWhite); background: var(--clsColorInk); box-shadow: var(--clsShadow); }

.clsPanelTopline { position: relative; z-index: 1; display: flex; align-items: center; gap: 0.55rem; color: #dce3ec; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; }

.clsSignalDot { width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--clsColorRed); box-shadow: 0 0 0 0.26rem rgba(229, 35, 27, 0.22); }

.clsPulse { position: relative; z-index: 1; width: 100%; margin: 2rem 0 1.7rem; }

.clsPulse path { stroke: var(--clsColorRed); stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; }

.clsPanelStats { position: relative; z-index: 1; display: grid; gap: 1.25rem; }

.clsPanelStats strong, .clsPanelStats p { display: block; }

.clsPanelStats strong { font-size: 1.1rem; }

.clsPanelStats p { margin: 0; color: #cdd3dd; font-size: 0.9rem; }

.clsPanelNote { position: relative; z-index: 1; margin: 2rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, 0.2); color: #dce3ec; font-size: 0.82rem; line-height: 1.45; }

.clsSection { padding: clamp(4rem, 9vw, 7rem) 0; }

.clsIntroSection { background: var(--clsColorWhite); }

.clsIntroGrid { display: grid; gap: 1.2rem; }

.clsIntroGrid h2 { margin-bottom: 0; color: var(--clsColorRed); }

.clsIntroCopy { max-width: 44rem; }

.clsIntroCopy p:last-child { margin-bottom: 0; }

.clsPrincipleGrid { display: grid; gap: 1rem; margin-top: 3rem; }

.clsPrincipleCard { padding: 1.5rem; border-top: 3px solid var(--clsColorRed); background: var(--clsColorSoft); }

.clsPrincipleCard h3 { margin: 0 0 0.65rem; }

.clsPrincipleCard p { margin-bottom: 0; }

.clsBenefitSection { background: var(--clsColorInk); }

.clsBenefitSection h2, .clsBenefitSection h3 { color: var(--clsColorWhite); }

.clsBenefitSection .clsSectionHead > p:last-child { max-width: 39rem; color: #d7dde5; }

.clsSectionHead { max-width: 48rem; margin-bottom: 2.5rem; }

.clsSectionHead h2 { margin-bottom: 1rem; }

.clsBenefitGrid { display: grid; gap: 1px; background: rgba(255, 255, 255, 0.2); }

.clsBenefitCard { padding: 1.7rem; background: var(--clsColorInk); }

.clsBenefitCard p { margin-bottom: 0; color: #d7dde5; }

.clsIcon { display: grid; width: 2.5rem; height: 2.5rem; margin-bottom: 1.65rem; place-items: center; color: var(--clsColorRed); border: 2px solid rgba(255, 255, 255, 0.42); border-radius: 50%; }

.clsIcon svg { width: 1.55rem; height: 1.55rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; }

.clsIcon circle { fill: currentColor; stroke: none; }

.clsMethodSection { overflow: hidden; }

.clsMethodGrid { display: grid; gap: 3rem; align-items: center; }

.clsMethodImages { position: relative; min-height: 19rem; }

.clsMethodImage { position: absolute; width: 10rem; height: auto; border: 0.5rem solid var(--clsColorWhite); border-radius: 50%; box-shadow: var(--clsShadow); object-fit: cover; aspect-ratio: 1; }

.clsMethodImageOne { top: 0; left: 2%; width: 13rem; }

.clsMethodImageTwo { top: 5.3rem; right: 2%; }

.clsMethodImageThree { bottom: 0; left: 22%; width: 8rem; }

.clsSteps { display: grid; gap: 1.3rem; padding: 0; margin: 2rem 0; list-style: none; }

.clsSteps li { display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; }

.clsStepIcon { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; color: var(--clsColorRed); border: 1px solid var(--clsColorRed); border-radius: 50%; font-size: 1.1rem; font-weight: 700; }

.clsSteps strong { color: var(--clsColorInk); }

.clsSteps p { margin: 0.15rem 0 0; }

.clsCaution { padding: 1rem 1.1rem; margin-bottom: 0; border-left: 3px solid var(--clsColorRed); background: var(--clsColorSoft); font-size: 0.91rem; }

.clsAudienceSection { background: var(--clsColorSoft); }

.clsAudienceGrid { display: grid; gap: 2.5rem; }

.clsAudienceTitle { max-width: 32rem; }

.clsAudienceList { display: grid; gap: 1rem; }

.clsAudienceList article { padding: 1.35rem 0; border-bottom: 1px solid var(--clsColorLine); }

.clsAudienceList h3 { margin-bottom: 0.45rem; }

.clsAudienceList p { margin-bottom: 0; }

.clsFaqSection { padding-bottom: clamp(4rem, 9vw, 7rem); }

.clsFaqLayout { display: grid; gap: 2.4rem; }

.clsFaqLayout > div:first-child { max-width: 28rem; }

.clsFaqList { border-top: 1px solid var(--clsColorLine); }

.clsFaqItem { border-bottom: 1px solid var(--clsColorLine); }

.clsFaqItem summary { position: relative; padding: 1.1rem 2rem 1.1rem 0; color: var(--clsColorInk); font-weight: 700; cursor: pointer; list-style: none; }

.clsFaqItem summary::-webkit-details-marker { display: none; }

.clsFaqItem summary::after { position: absolute; right: 0.25rem; color: var(--clsColorRed); content: "+"; font-size: 1.35rem; }

.clsFaqItem[open] summary::after { content: "−"; }

.clsFaqAnswer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 360ms cubic-bezier(0.22, 1, 0.36, 1); }

.clsFaqAnswer p { min-height: 0; max-width: 46rem; padding: 0; margin-bottom: 0; overflow: hidden; transition: padding 360ms cubic-bezier(0.22, 1, 0.36, 1); }

.clsFaqItem[open].clsFaqOpen .clsFaqAnswer { grid-template-rows: 1fr; }

.clsFaqItem[open].clsFaqOpen .clsFaqAnswer p { padding-bottom: 1.15rem; }

.clsClosingSection { padding: 0 0 clamp(4rem, 9vw, 7rem); }

.clsClosingCard { display: grid; gap: 2rem; padding: clamp(2rem, 6vw, 4rem); color: var(--clsColorWhite); background: var(--clsColorRed); }

.clsClosingCard h2 { margin-bottom: 1rem; color: var(--clsColorWhite); }

.clsClosingCard p { max-width: 42rem; margin-bottom: 0; }

.clsClosingCard .clsEyebrow { color: var(--clsColorInk); }

.clsButtonLight { align-self: center; color: var(--clsColorRed); background: var(--clsColorWhite); }

.clsButtonLight:hover { color: var(--clsColorRedDark); background: #f5f5f5; }

.clsSiteFooter { padding: 2.4rem 0; color: #edf3f7; border-top: 0.25rem solid var(--clsColorRed); background: var(--clsColorInk); }

.clsFooterGrid { display: grid; gap: 1.5rem; }

.clsFooterGrid h2 { margin-bottom: 0.75rem; color: var(--clsColorWhite); font-size: 1.08rem; letter-spacing: 0; }

.clsFooterGrid p { margin-bottom: 0; font-size: 1rem; }

.clsFooterGrid a { color: var(--clsColorWhite); }

.clsFooterLogo { width: 16.25rem; height: auto; margin-bottom: 0.8rem; }

@media (min-width: 42rem) {
  .clsPanelStats { grid-template-columns: repeat(3, 1fr); }
  .clsPrincipleGrid { grid-template-columns: repeat(3, 1fr); }
  .clsBenefitGrid { grid-template-columns: repeat(2, 1fr); }
  .clsFooterGrid { grid-template-columns: 1.5fr 1fr 1fr; }
}

@media (min-width: 58rem) {
  .clsHeaderInner { min-height: 6.1rem; }
  .clsBrand { flex: 0 0 auto; }
  .clsMenuToggle { display: none; }
  .clsMainNav { position: static; display: flex; align-items: center; gap: clamp(0.75rem, 2vw, 1.75rem); padding: 0; border: 0; box-shadow: none; }
  .clsMainNav a { padding: 0; }
  .clsHeroGrid { grid-template-columns: minmax(0, 1.15fr) minmax(22rem, 0.72fr); gap: clamp(3rem, 8vw, 7rem); }
  .clsIntroGrid { grid-template-columns: 0.84fr 1.16fr; gap: 5rem; }
  .clsMethodGrid { grid-template-columns: 0.84fr 1.16fr; gap: clamp(4rem, 9vw, 8rem); }
  .clsMethodImages { min-height: 28rem; }
  .clsMethodImageOne { width: 18rem; }
  .clsMethodImageTwo { top: 7rem; width: 12.5rem; }
  .clsMethodImageThree { width: 10rem; }
  .clsAudienceGrid { grid-template-columns: 0.85fr 1.15fr; gap: clamp(4rem, 9vw, 8rem); }
  .clsFaqLayout { grid-template-columns: 0.7fr 1.3fr; gap: clamp(4rem, 9vw, 8rem); }
  .clsClosingCard { grid-template-columns: 1fr auto; align-items: center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .clsButton { transition: none; }
}