@layer base {

   

  *, *::before, *::after { box-sizing: border-box; }

  * { margin: 0; }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
     
    scroll-padding-top: calc(var(--header-h) + 1rem);
  }

   
  body {
    background-color: var(--c-bg);
    background-image: var(--wash-page);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: var(--c-text);
    font-family: var(--font-body);
    font-size: var(--t-base);
    line-height: var(--lead-normal);
    font-synthesis-weight: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    min-height: 100svh;
  }

  img, picture, svg, video, canvas { display: block; max-width: 100%; }
  img, video { height: auto; }

  input, button, textarea, select { font: inherit; color: inherit; }

   
  [hidden] { display: none !important; }

   
  p, li, h1, h2, h3, h4, dd, dt, figcaption { overflow-wrap: break-word; }

   

  :focus-visible {
    outline: 3px solid var(--c-blue);
    outline-offset: 2px;
    border-radius: var(--r-sm);
  }

   
  .band :focus-visible,
  .on-ink :focus-visible {
    outline-color: var(--c-green);
  }

   

   
  h1, h2, h3, h4 {
    font-family: var(--font-display);
    font-weight: var(--weight-display-text);
    line-height: var(--lead-snug);
    letter-spacing: var(--track-display-text);
    font-variation-settings: "wdth" var(--width-display-text);
    text-wrap: balance;
  }

   
  h1 { font-size: var(--t-3xl); line-height: var(--lead-tight); }
  h2 { font-size: var(--t-2xl); }
  h3 { font-size: var(--t-xl); }
  h4 { font-size: var(--t-lg); font-weight: 500; }

  p, li, dd { text-wrap: pretty; }

   
  h5, h6,
  dt, summary, legend, caption,
  .card__title, .machine-name, .result-title, .where-next-label,
  .tier-card h3, .stat-what { text-wrap: balance; }

  .prose, .lede, blockquote, figcaption { text-wrap: pretty; }

   
  .prose > * { max-width: var(--maxw-text); }
  .prose > * + * { margin-block-start: var(--stack); }
  .prose h2, .prose h3 { margin-block-start: calc(var(--stack) * 1.75); }

  .lede {
    font-size: var(--t-lg);
    line-height: var(--lead-relax);
    color: var(--c-text-muted);
    max-width: var(--maxw-text);
  }

   
  .eyebrow {
    font-family: var(--font-display);
    font-size: var(--t-eyebrow);
    font-weight: 700;
    font-variation-settings: "wdth" var(--width-eyebrow);
    letter-spacing: var(--track-eyebrow-display);
    text-transform: uppercase;
    color: var(--c-text);
    display: flex;
    align-items: center;
    gap: 0.625rem;
  }

   
  .eyebrow::before {
    content: "";
    flex: 0 0 var(--eyebrow-rule);
    block-size: var(--eyebrow-rule-h);
    border-radius: var(--r-sm);
    background: var(--c-green);
  }

   
  .band .eyebrow::before,
  .cta-band .eyebrow::before,
  .on-ink .eyebrow::before,
  .site-footer .eyebrow::before,
  .result-head .eyebrow::before,
  .calc-result .eyebrow::before { display: none; }

   
  .variant-select .eyebrow::before { display: none; }

   

  .num, .spec-value, code, kbd, samp {
    font-family: var(--font-data);
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1, "zero" 1;
  }

   
  .prose, body { font-variant-numeric: proportional-nums; }

   

   
  a {
    color: var(--c-link);
    text-underline-offset: 0.16em;
    text-decoration-thickness: from-font;
    transition: color var(--dur-fast) var(--ease);
  }
  a:hover { color: var(--c-link-hover); }

   
  a.link-green { color: var(--c-green-text); }

   

  ul[class], ol[class] { list-style: none; padding: 0; }

  .prose ul, .prose ol { padding-inline-start: 1.25em; }
  .prose li + li { margin-block-start: var(--stack-tight); }

   

  table { border-collapse: collapse; width: 100%; }

  th, td {
    text-align: start;
    padding: 0.6rem 0.75rem;
    border-block-end: var(--bw) solid var(--c-line);
    vertical-align: baseline;
  }

  th {
    font-family: var(--font-body);
    font-weight: 600;
    font-size: var(--t-sm);
    color: var(--c-text-muted);
  }

   

  hr {
    border: 0;
    border-block-start: var(--bw) solid var(--c-line);
    margin-block: var(--sec-tight);
  }

  figure { margin: 0; }

  figcaption {
    font-size: var(--t-sm);
    color: var(--c-text-muted);
    margin-block-start: var(--stack-tight);
    max-width: var(--maxw-text);
  }

   

  .visually-hidden {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .skip-link {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    padding: 0.75rem 1.25rem;
    background: var(--c-ink);
    color: var(--c-on-ink);
    z-index: calc(var(--z-modal) + 1);
    transform: translateY(-120%);
  }
  .skip-link:focus { transform: none; }

   

   
  [data-js] [data-reveal] {
    opacity: 1;
    transform: translateY(0.5rem);
  }

  [data-js] [data-reveal].is-in {
    opacity: 1;
    transform: none;
    transition: transform var(--dur-slow) var(--ease-out);
     
    transition-delay: calc(var(--reveal-i, 0) * var(--stagger-scroll, 30ms));
  }

  @media (prefers-reduced-motion: reduce) {
    [data-js] [data-reveal] { opacity: 1; transform: none; }
  }

   

   

  @media print {
    .site-header, .site-footer, .cta-band,
    .whatsapp-button, .sticky-mobile-cta { display: none; }
    body { background: #FFF; color: #000; }
  }

}