@font-face {
  font-family: "Manrope";
  src: url("/fonts/manrope-variable.ttf") format("truetype-variations");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

:root {
  --font-sans: "Manrope", "Segoe UI", Arial, sans-serif;
  --type-body-size: 16.5px;
  --type-body-leading: 1.65;
  --type-reading-size: 18px;
  --type-reading-leading: 1.78;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font-sans);
}

body {
  font-size: var(--type-body-size);
  font-weight: 450;
  line-height: var(--type-body-leading);
  letter-spacing: -0.006em;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures;
}

h1,
h2,
h3,
h4,
h5,
h6,
.brand {
  font-family: var(--font-sans);
  font-weight: 760;
  text-wrap: balance;
}

h1 { line-height: 1.03; letter-spacing: -0.042em; }
h2 { line-height: 1.08; letter-spacing: -0.034em; }
h3 { line-height: 1.16; letter-spacing: -0.026em; }
h4,
h5,
h6 { line-height: 1.24; letter-spacing: -0.018em; }

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

.nav {
  font-family: var(--font-sans);
  font-size: clamp(16px, 1.08vw, 18px);
  font-weight: 760;
  letter-spacing: -0.018em;
}

.btn,
.textButton,
.filterNav a,
.filterNav button,
.choice,
.comparisonChoice,
.countryDialogTrigger {
  font-family: var(--font-sans);
  font-weight: 740;
  line-height: 1.25;
  letter-spacing: -0.01em;
}

.announcement {
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.45;
  letter-spacing: 0.025em;
}

.eyebrow,
.productMeta,
.articleCard > span,
.articleVisualMap header span {
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: 0.135em;
}

.hero h1,
.partnerHero h1,
.ntcHero h1 {
  font-size: clamp(48px, 5.25vw, 82px);
  font-weight: 790;
  line-height: 1.01;
  letter-spacing: -0.046em;
}

.pageHero h1 {
  max-width: 1050px;
  font-size: clamp(44px, 4.8vw, 70px);
  font-weight: 780;
  line-height: 1.035;
  letter-spacing: -0.041em;
}

.articleHeroCopy h1 {
  font-size: clamp(44px, 4.7vw, 72px);
  line-height: 1.035;
  letter-spacing: -0.041em;
}

.productSummary h1 {
  font-family: var(--font-sans);
  font-size: clamp(42px, 4.8vw, 70px);
  font-weight: 790;
  line-height: 1.035;
  letter-spacing: -0.041em;
}

.sectionHeader h2,
.panel h2,
.routineGuide h2,
.partnerPath h2,
.partnerTeaser h2,
.partnerProductCta h2,
.ntcHomeFeature h2,
.ntcProductBlock h2,
.ntcTrustCta h2 {
  font-weight: 760;
  line-height: 1.075;
  letter-spacing: -0.036em;
}

.lead,
.pageHero > p:not(.eyebrow),
.articleHeroCopy > p:not(.eyebrow):not(.articleByline) {
  font-size: clamp(18px, 1.35vw, 21px);
  line-height: 1.58;
  letter-spacing: -0.012em;
}

.content {
  max-width: 780px;
}

.content p,
.content li,
.articleBody,
.articleBody p,
.articleBody li {
  font-size: var(--type-reading-size);
  line-height: var(--type-reading-leading);
  letter-spacing: -0.008em;
}

.content h2,
.articleBody h2 {
  margin-top: 2.15em;
  margin-bottom: 0.62em;
  font-size: clamp(30px, 3.1vw, 40px);
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.content h3,
.articleBody h3,
.articleFaq h3 {
  margin-top: 1.8em;
  margin-bottom: 0.55em;
  font-size: clamp(22px, 2.1vw, 27px);
  line-height: 1.22;
  letter-spacing: -0.022em;
}

.articleBody table {
  font-size: 16px;
  line-height: 1.55;
}

.articleByline {
  font-size: 15px !important;
  font-weight: 650;
  line-height: 1.5 !important;
}

.articleAnswer {
  font-size: 19px;
  font-weight: 520;
  line-height: 1.65;
}

.articleToc,
.articleRelated,
.articleFaq {
  font-size: 16px;
  line-height: 1.6;
}

.articleToc b,
.articleRelated a,
.faq summary {
  font-weight: 750;
}

.goalCard h3,
.categoryCard h3,
.productCard h3,
.articleCard h3,
.detailCard h2,
.countryCard h2,
.socialCard h3,
.benefitGrid h3,
.partnerSteps h3,
.ntcThree h3,
.qualityGrid h3,
.ntcCompare h3,
.ntcEvidenceGrid h3 {
  line-height: 1.18;
  letter-spacing: -0.027em;
}

.goalCard p,
.categoryCard p,
.productCard > p,
.articleCard p,
.detailCard p,
.socialCard p,
.partnerPath p,
.partnerPath li,
.benefitGrid p,
.partnerSteps p,
.proofList span {
  font-size: 16px;
  line-height: 1.62;
}

.productMeta,
.tags span,
.price small,
.cardCheckoutNote,
.purchasePanel small,
.imageSourceNote,
.zoomHint {
  font-size: 12px;
  line-height: 1.45;
}

.purchasePanel > span {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.4;
}

.purchasePanel h2 {
  font-size: 26px;
  line-height: 1.16;
}

.routineGuide label,
.partnerForm label {
  font-size: 15px;
  line-height: 1.45;
}

.routineGuide input,
.routineGuide select,
.partnerForm input,
.partnerForm select,
.partnerForm textarea,
.countrySearch input,
.countryControls input,
.searchBox input {
  font-size: 16px;
  line-height: 1.4;
}

.footer {
  font-size: 15.5px;
  line-height: 1.62;
}

.footerLinks,
.footerSocial,
.footerUtilities {
  line-height: 1.45;
}

.legal {
  font-size: 13.5px;
  line-height: 1.65;
  letter-spacing: 0;
}

.ntcComparisonHeading p {
  font-size: 15px;
  line-height: 1.58;
}

.ntcComparisonLane > p,
.ntcFlowCopy p,
.ntcModalThree p,
.ntcModalCompare p {
  font-size: 14px;
  line-height: 1.58;
}

.ntcComparisonInfographic.compact .ntcComparisonHeading p {
  font-size: 14px;
  line-height: 1.55;
}

.ntcComparisonInfographic.compact .ntcComparisonLane > p {
  font-size: 13px;
  line-height: 1.55;
}

.ntcComparisonLane header small,
.ntcFlowCopy span,
.ntcProofRail span,
.ntcInfographicNote {
  font-size: 11.5px;
  line-height: 1.48;
}

.ntcBadge small {
  font-size: 10px;
  line-height: 1.15;
  letter-spacing: 0.1em;
}

.ntcBadge b,
.ntcProofRail b {
  font-size: 13.5px;
  line-height: 1.2;
}

.marketMarqueeItem {
  font-size: 13px;
  font-weight: 760;
  line-height: 1.3;
  letter-spacing: 0.095em;
}

.breadcrumbs,
.countryCard p,
.countryCard small,
.countrySource,
.currentCountry,
.ntcSourceNote {
  font-size: 13px;
  line-height: 1.55;
}

@media (max-width: 660px) {
  :root {
    --type-body-size: 16px;
    --type-reading-size: 17px;
    --type-reading-leading: 1.72;
  }

  .announcement {
    font-size: 12px;
    line-height: 1.4;
  }

  .nav.open {
    font-size: 17px;
    line-height: 1.25;
  }

  .hero h1,
  .partnerHero h1,
  .ntcHero h1,
  .pageHero h1,
  .articleHeroCopy h1,
  .productSummary h1 {
    font-size: clamp(37px, 10.8vw, 46px);
    line-height: 1.055;
    letter-spacing: -0.037em;
  }

  .russianSite .hero h1,
  .russianSite .partnerHero h1,
  .russianSite .ntcHero h1,
  .russianSite .pageHero h1 {
    font-size: clamp(35px, 10vw, 43px);
    line-height: 1.08;
    letter-spacing: -0.032em;
  }

  .sectionHeader h2,
  .panel h2,
  .routineGuide h2,
  .partnerPath h2,
  .partnerTeaser h2,
  .partnerProductCta h2,
  .ntcHomeFeature h2,
  .ntcProductBlock h2,
  .ntcTrustCta h2 {
    font-size: clamp(32px, 9vw, 42px);
    line-height: 1.1;
    letter-spacing: -0.03em;
  }

  .eyebrow,
  .productMeta,
  .articleCard > span,
  .articleVisualMap header span {
    font-size: 11.5px;
    letter-spacing: 0.12em;
  }

  .articleAnswer {
    padding: 20px;
    font-size: 17.5px;
  }

  .articleToc,
  .articleRelated {
    padding: 22px;
  }

  .articleBody table {
    font-size: 14px;
  }

  .footer {
    font-size: 15px;
  }

  .legal {
    font-size: 13px;
  }
}