@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/InterVariable.woff2") format("woff2-variations");
}

:root {
  /* Brand */
  --color-brand-navy: #101552;
  --color-brand-blue: #1717ed;
  --color-brand-violet: #4b20e6;
  --color-brand-orange: #ff5a0a;
  --color-brand-pink: #e63389;
  --color-brand-black: #000;

  /* Category accents */
  --color-writing: #fb4b2e;
  --color-writing-contrast: #9f2d1b;
  --color-writing-surface: #feebe7;
  --color-writing-card-start: #fff8f6;
  --color-writing-card-end: #feebe7;
  --color-ai: #3028ed;
  --color-ai-contrast: #1f177f;
  --color-ai-surface: #efebff;
  --color-ai-card-start: #f8f6ff;
  --color-ai-card-end: #e7e0ff;
  --color-marketing: #019b68;
  --color-marketing-contrast: #075f47;
  --color-marketing-surface: #e7f5f1;
  --color-marketing-card-start: #f1fbf8;
  --color-marketing-card-end: #dcefe9;
  --color-productivity: #ff640a;
  --color-productivity-contrast: #9d3800;
  --color-productivity-surface: #ffede1;
  --color-productivity-card-start: #fff8f2;
  --color-productivity-card-end: #ffe2ca;
  --color-seo: #c94c5a;
  --color-seo-contrast: #8f3542;
  --color-seo-surface: #fbecee;
  --color-seo-card-start: #fff6f7;
  --color-seo-card-end: #f6dde1;
  --color-crm: #2f6f8f;
  --color-crm-contrast: #1f4f68;
  --color-crm-surface: #eaf4f8;
  --color-crm-card-start: #f5fafc;
  --color-crm-card-end: #d9eaf1;

  /* Neutrals */
  --color-text: #0c103d;
  --color-text-muted: #5f6480;
  --color-border: #e4e5ee;
  --color-surface: #fff;
  --color-surface-subtle: #f8f8fc;

  /* Status */
  --color-success: #007a51;
  --color-status-neutral-text: #252735;
  --color-status-neutral-border: #cfd2df;
  --color-status-neutral-surface: #fff;
  --color-warning: #f59e0b;
  --color-error: #c62828;

  /* Radius */
  --radius-control: 0.625rem;
  --radius-card: 0.75rem;
  --radius-panel: 1rem;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-card: 0 0.25rem 1.5rem rgb(24 27 82 / 8%);
  --shadow-card-hover: 0 0.75rem 2rem rgb(24 27 82 / 14%);
  --shadow-panel: 0 1.5rem 4rem rgb(8 12 55 / 24%);

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* Internal-page density */
  --navigation-page-hero-background:
    radial-gradient(circle at 86% 16%, rgb(75 32 230 / 16%), transparent 23rem),
    linear-gradient(135deg, #f3f0ff 0%, #ebe7fa 55%, #f7f5ff 100%);
  --internal-hero-padding-block: clamp(2rem, 2.25vw, 2.5rem);
  --internal-section-padding-block: clamp(1.5rem, 2vw, 2.25rem);
  --internal-section-padding-compact: clamp(1.25rem, 1.5vw, 1.75rem);
  --internal-panel-padding: clamp(1.25rem, 1.35vw, 1.5rem);

  /* Layout */
  --container-max: 80rem;
  --container-max-large: 132rem;
  --container-gutter: clamp(1rem, 3vw, 2rem);
  --header-height: 5.5rem;
  --site-header-category-height: 3.75rem;
  --site-header-full-height: calc(
    var(--header-height) + var(--site-header-category-height) + 2px
  );
  --site-header-compact-primary-height: 4.125rem;
  --site-header-compact-category-height: 3rem;
  --site-header-compact-height: calc(
    var(--site-header-compact-primary-height) +
      var(--site-header-compact-category-height) + 2px
  );
  --site-header-logo-width: 20rem;
  --site-header-compact-logo-width: 17.25rem;
  --site-header-admin-offset: 0px;
  --homepage-shelf-card-size: clamp(15.5rem, 23vw, 18rem);
  --homepage-shelf-card-min-height: 16rem;
  --category-directory-card-height: 22.5rem;
  --merchandising-card-teaser-lines: 3;
  --merchandising-card-section-gap: 0.7rem;
  --merchandising-card-footer-gap: 0.55rem;

  /* Typography */
  --type-display-size: clamp(2.6rem, 4vw, 3.25rem);
  --type-page-title-size: clamp(2.45rem, calc(1.75rem + 2.5vw), 4.25rem);
  --type-page-title-long-size: clamp(2.55rem, calc(1.9rem + 2.8vw), 4.75rem);
  --type-product-title-size: clamp(2.3rem, 4.2vw, 3.75rem);
  --type-section-title-size: clamp(1.75rem, calc(1.55rem + 0.75vw), 2.1rem);
  --type-section-title-compact-size: clamp(
    1.25rem,
    calc(1.15rem + 0.35vw),
    1.5rem
  );
  --type-homepage-shelf-title-size: clamp(
    1.25rem,
    calc(1.18rem + 0.45vw),
    1.625rem
  );
  --type-subsection-title-size: clamp(1.25rem, calc(1.18rem + 0.3vw), 1.4rem);
  --type-card-title-size: clamp(1.125rem, calc(1rem + 0.4vw), 1.375rem);
  --type-card-title-compact-size: clamp(0.95rem, calc(0.9rem + 0.1vw), 1.05rem);
  --type-body-large-size: clamp(1rem, calc(0.94rem + 0.18vw), 1.125rem);
  --type-body-size: 1rem;
  --type-body-editorial-size: 1.075rem;
  --type-small-size: 0.75rem;
  --type-eyebrow-size: 0.75rem;
  --type-control-size: 0.875rem;
  --type-navigation-size: 0.8rem;
  --type-navigation-emphasis-size: clamp(0.75rem, 1vw, 0.9rem);
  --type-display-line-height: 1.02;
  --type-page-title-line-height: 0.98;
  --type-section-title-line-height: 1.08;
  --type-subsection-title-line-height: 1.25;
  --type-card-title-line-height: 1.2;
  --type-body-line-height: 1.6;
  --type-body-large-line-height: 1.6;
  --type-body-editorial-line-height: 1.62;
  --type-eyebrow-line-height: 1.2;
  --type-page-title-tracking: -0.055em;
  --type-section-title-tracking: -0.045em;
  --type-subsection-title-tracking: -0.025em;
  --type-card-title-tracking: -0.025em;
  --type-eyebrow-tracking: 0.12em;
  --type-weight-regular: 400;
  --type-weight-medium: 500;
  --type-weight-semibold: 600;
  --type-weight-bold: 700;

  /* Internal-page roles mapped to the finalized homepage hierarchy */
  --internal-type-page-title-size: var(--type-display-size);
  --internal-type-page-title-line-height: var(--type-display-line-height);
  --internal-type-page-title-tracking: var(--type-section-title-tracking);
  --internal-type-section-title-size: var(--type-homepage-shelf-title-size);
  --internal-type-section-title-line-height: 1.12;
  --internal-type-card-title-size: var(--type-card-title-compact-size);
  --internal-type-body-size: var(--type-body-size);
  --internal-type-body-line-height: var(--type-body-line-height);

  /* Motion */
  --duration-fast: 140ms;
  --duration-standard: 220ms;
  --easing-standard: cubic-bezier(0.2, 0, 0, 1);
}

.category-menu__link.category-pill--writing,
.category-shelf.category-shelf--writing,
.software-review-related.continuation--writing,
.category-page.category-page--writing,
.discover-category-card.discover-category-card--writing,
.discover-tool-card.discover-tool-card--writing,
.featured-tools__slide.featured-tools__slide--writing,
.tool-month.tool-month--writing,
.guide-related-software__link.guide-related-software__link--writing,
.compare-result-tool.compare-result-tool--category-writing-self-publishing,
.editorial-compare-actions__tool.editorial-compare-actions__tool--writing,
.search-suggestions__link.search-suggestions__link--writing,
.search-result.search-result--writing {
  --category-accent: var(--color-writing);
  --category-accent-dark: var(--color-writing-contrast);
  --category-surface: var(--color-writing-surface);
  --category-card-start: var(--color-writing-card-start);
  --category-card-end: var(--color-writing-card-end);
}

.category-menu__link.category-pill--ai,
.category-shelf.category-shelf--ai,
.software-review-related.continuation--ai,
.category-page.category-page--ai,
.discover-category-card.discover-category-card--ai,
.discover-tool-card.discover-tool-card--ai,
.featured-tools__slide.featured-tools__slide--ai,
.tool-month.tool-month--ai,
.guide-related-software__link.guide-related-software__link--ai,
.compare-result-tool.compare-result-tool--category-ai-images-video-voice,
.editorial-compare-actions__tool.editorial-compare-actions__tool--ai,
.search-suggestions__link.search-suggestions__link--ai,
.search-result.search-result--ai {
  --category-accent: var(--color-ai);
  --category-accent-dark: var(--color-ai-contrast);
  --category-surface: var(--color-ai-surface);
  --category-card-start: var(--color-ai-card-start);
  --category-card-end: var(--color-ai-card-end);
}

.category-menu__link.category-pill--marketing,
.category-shelf.category-shelf--marketing,
.software-review-related.continuation--marketing,
.category-page.category-page--marketing,
.discover-category-card.discover-category-card--marketing,
.discover-tool-card.discover-tool-card--marketing,
.featured-tools__slide.featured-tools__slide--marketing,
.tool-month.tool-month--marketing,
.guide-related-software__link.guide-related-software__link--marketing,
.compare-result-tool.compare-result-tool--category-marketing-email,
.editorial-compare-actions__tool.editorial-compare-actions__tool--marketing,
.search-suggestions__link.search-suggestions__link--marketing,
.search-result.search-result--marketing {
  --category-accent: var(--color-marketing);
  --category-accent-dark: var(--color-marketing-contrast);
  --category-surface: var(--color-marketing-surface);
  --category-card-start: var(--color-marketing-card-start);
  --category-card-end: var(--color-marketing-card-end);
}

.category-menu__link.category-pill--productivity,
.category-shelf.category-shelf--productivity,
.software-review-related.continuation--productivity,
.category-page.category-page--productivity,
.discover-category-card.discover-category-card--productivity,
.discover-tool-card.discover-tool-card--productivity,
.featured-tools__slide.featured-tools__slide--productivity,
.tool-month.tool-month--productivity,
.guide-related-software__link.guide-related-software__link--productivity,
.compare-result-tool.compare-result-tool--category-everyday-productivity,
.editorial-compare-actions__tool.editorial-compare-actions__tool--productivity,
.search-suggestions__link.search-suggestions__link--productivity,
.search-result.search-result--productivity {
  --category-accent: var(--color-productivity);
  --category-accent-dark: var(--color-productivity-contrast);
  --category-surface: var(--color-productivity-surface);
  --category-card-start: var(--color-productivity-card-start);
  --category-card-end: var(--color-productivity-card-end);
}

.category-menu__link.category-pill--seo,
.category-shelf.category-shelf--seo,
.software-review-related.continuation--seo,
.category-page.category-page--seo,
.discover-category-card.discover-category-card--seo,
.discover-tool-card.discover-tool-card--seo,
.featured-tools__slide.featured-tools__slide--seo,
.tool-month.tool-month--seo,
.guide-related-software__link.guide-related-software__link--seo,
.compare-result-tool.compare-result-tool--category-seo-website-tools,
.editorial-compare-actions__tool.editorial-compare-actions__tool--seo,
.search-suggestions__link.search-suggestions__link--seo,
.search-result.search-result--seo {
  --category-accent: var(--color-seo);
  --category-accent-dark: var(--color-seo-contrast);
  --category-surface: var(--color-seo-surface);
  --category-card-start: var(--color-seo-card-start);
  --category-card-end: var(--color-seo-card-end);
}

.category-menu__link.category-pill--crm,
.category-shelf.category-shelf--crm,
.software-review-related.continuation--crm,
.category-page.category-page--crm,
.discover-category-card.discover-category-card--crm,
.discover-tool-card.discover-tool-card--crm,
.featured-tools__slide.featured-tools__slide--crm,
.tool-month.tool-month--crm,
.guide-related-software__link.guide-related-software__link--crm,
.compare-result-tool.compare-result-tool--category-business-sales-crm,
.editorial-compare-actions__tool.editorial-compare-actions__tool--crm,
.search-suggestions__link.search-suggestions__link--crm,
.search-result.search-result--crm {
  --category-accent: var(--color-crm);
  --category-accent-dark: var(--color-crm-contrast);
  --category-surface: var(--color-crm-surface);
  --category-card-start: var(--color-crm-card-start);
  --category-card-end: var(--color-crm-card-end);
}

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

html {
  color-scheme: light;
  overflow-x: clip;
  font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  font-synthesis: none;
  line-height: 1.5;
  text-size-adjust: 100%;
}

body {
  min-block-size: 100vh;
  padding-block-start: var(--site-header-full-height);
  margin: 0;
  overflow-wrap: break-word;
  color: var(--color-text);
  font-size: var(--type-body-size);
  line-height: var(--type-body-line-height);
  background: var(--color-surface-subtle);
}

.admin-bar {
  --site-header-admin-offset: 32px;
}

@media (width <= 782px) {
  .admin-bar {
    --site-header-admin-offset: 46px;
  }
}

:target {
  scroll-margin-block-start: calc(
    var(--site-header-compact-height) + var(--site-header-admin-offset) +
      var(--space-4)
  );
}

body.has-open-overlay {
  overflow: hidden;
}

button,
input {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
}

a {
  color: inherit;
}

img,
svg {
  display: block;
}

.software-logo-image {
  inline-size: 100%;
  max-inline-size: 100%;
  block-size: 100%;
  max-block-size: 100%;
  object-fit: contain;
}

svg {
  inline-size: 1em;
  block-size: 1em;
  fill: none;
  stroke: currentcolor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

[hidden] {
  display: none !important;
}

:where(a, button, input):focus-visible {
  outline: 0.1875rem solid var(--color-brand-blue);
  outline-offset: 0.1875rem;
}

.screen-reader-text {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.screen-reader-text:focus {
  z-index: 100000;
  inset-block-start: 1rem;
  inset-inline-start: 1rem;
  inline-size: auto;
  block-size: auto;
  padding: 0.75rem 1rem;
  margin: 0;
  overflow: visible;
  clip-path: none;
  color: var(--color-text);
  background: var(--color-surface);
  border: 2px solid currentcolor;
}

.site-container {
  inline-size: min(
    calc(100% - (2 * var(--container-gutter))),
    var(--container-max)
  );
  margin-inline: auto;
}

.button,
.icon-button,
.header-search-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: 2.75rem;
  border: 0;
  cursor: pointer;
}

.button {
  gap: var(--space-2);
  padding: 0.75rem 1.25rem;
  font-size: var(--type-control-size);
  font-weight: var(--type-weight-bold);
  line-height: 1;
  text-decoration: none;
  border-radius: var(--radius-control);
  transition:
    background-color var(--duration-fast) var(--easing-standard),
    border-color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard),
    color var(--duration-fast) var(--easing-standard);
}

.button svg {
  inline-size: 1rem;
  block-size: 1rem;
}

.button:disabled {
  cursor: not-allowed;
}

.button--primary,
.button--subscribe {
  color: #fff;
  background: var(--color-brand-navy);
}

.button--subscribe:disabled {
  color: #fff;
  opacity: 1;
}

.button--primary:hover,
.button--subscribe:not(:disabled):hover {
  background: #1b2170;
  box-shadow: 0 0.5rem 1rem rgb(16 21 82 / 18%);
}

.button--external-cta {
  color: #fff;
  background: var(--color-success);
  border: 1px solid var(--color-success);
  box-shadow: none;
}

.button--external-cta:hover {
  color: #fff;
  background: color-mix(in srgb, var(--color-success) 88%, #000);
  border-color: color-mix(in srgb, var(--color-success) 88%, #000);
  box-shadow: none;
}

.button--external-cta--outline {
  color: var(--color-success);
  background: var(--color-surface);
  border-color: var(--color-success);
}

.button--external-cta--outline:hover {
  color: #fff;
  background: var(--color-success);
  border-color: var(--color-success);
}

.button--review-cta {
  color: var(--category-accent-dark, var(--color-brand-blue));
  background: var(--color-surface);
  border: 1px solid var(--category-accent, var(--color-brand-blue));
  box-shadow: none;
}

.button--review-cta:hover {
  color: var(--category-accent-dark, var(--color-brand-blue));
  background: color-mix(
    in srgb,
    var(--category-accent, var(--color-brand-blue)) 8%,
    var(--color-surface)
  );
  border-color: var(--category-accent-dark, var(--color-brand-blue));
  box-shadow: none;
}

.icon-button {
  inline-size: 2.75rem;
  padding: 0;
  background: transparent;
  border-radius: var(--radius-pill);
}

.icon-button:hover {
  background: #f0f0fa;
}

.icon-button svg {
  inline-size: 1.6rem;
  block-size: 1.6rem;
  stroke-width: 2;
}

.site-header {
  position: fixed;
  z-index: 20;
  inset-block-start: var(--site-header-admin-offset);
  inset-inline: 0;
  background: var(--color-surface);
  box-shadow: 0 0 0 rgb(16 21 82 / 0%);
  transition: box-shadow var(--duration-standard) var(--easing-standard);
}

.site-header--compact {
  box-shadow: 0 0.35rem 1.1rem rgb(16 21 82 / 10%);
}

.site-header__primary {
  display: flex;
  align-items: center;
  min-block-size: var(--header-height);
  gap: clamp(0.75rem, 1.5vw, 1.5rem);
  transition: min-block-size var(--duration-standard) var(--easing-standard);
}

.site-brand-lockup {
  position: relative;
  display: block;
  flex: 0 0 19.5rem;
  inline-size: 19.5rem;
  block-size: var(--header-height);
  transition: block-size var(--duration-standard) var(--easing-standard);
}

.site-logo {
  position: relative;
  display: block;
  inline-size: 100%;
  block-size: 4.75rem;
  overflow: hidden;
  transition: block-size var(--duration-standard) var(--easing-standard);
}

.site-logo img {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 0;
  inline-size: var(--site-header-logo-width);
  max-inline-size: none;
  block-size: auto;
  transform: translateY(-50%);
  transition: inline-size var(--duration-standard) var(--easing-standard);
}

.site-brand-tagline {
  position: absolute;
  inset-block-end: 0.8rem;
  inset-inline: 5.5rem 0;
  margin: 0;
  color: var(--color-brand-black);
  font-size: var(--type-small-size);
  font-weight: var(--type-weight-medium);
  line-height: var(--type-eyebrow-line-height);
  text-align: center;
  transition: inset-block-end var(--duration-standard) var(--easing-standard);
}

.brand-principles,
.category-navigation__list,
.menu-drawer__navigation ul,
.search-suggestions ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.brand-principles {
  display: flex;
  flex: 1;
  align-items: center;
  min-inline-size: 0;
}

.brand-principle {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-inline-size: 0;
  padding-inline: clamp(0.6rem, 1vw, 1rem);
  font-size: var(--type-navigation-emphasis-size);
  font-weight: var(--type-weight-bold);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}

.brand-principle + .brand-principle {
  border-inline-start: 1px solid #d7d8e8;
}

.brand-principle__icon {
  display: grid;
  flex: 0 0 2rem;
  inline-size: 2rem;
  block-size: 2rem;
  place-items: center;
}

.brand-principle__icon svg {
  inline-size: 1.8rem;
  block-size: 1.8rem;
  stroke-width: 1.7;
}

.brand-principle__icon--compare {
  color: var(--color-brand-orange);
}

.brand-principle__icon--choose {
  color: var(--color-brand-blue);
}

.brand-principle__icon--create {
  color: var(--color-brand-pink);
}

.site-header__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.625rem;
}

.header-search-trigger {
  justify-content: flex-start;
  min-inline-size: clamp(8rem, 12vw, 11rem);
  padding-inline: 0.9rem;
  gap: 0.55rem;
  color: var(--color-text-muted);
  background: #f2f2f8;
  border-radius: var(--radius-pill);
}

.header-search-trigger:hover {
  color: var(--color-text);
  background: #ececf6;
}

.header-search-trigger__icon {
  font-size: 1rem;
}

.header-search-trigger__label {
  font-size: var(--type-navigation-size);
  white-space: nowrap;
}

.header-subscribe {
  min-inline-size: 5.4rem;
  padding-inline: 0.9rem;
  font-size: var(--type-navigation-size);
}

.mobile-search-trigger,
.mobile-menu-trigger {
  display: none;
}

.category-bar {
  background: #f7f7fc;
  border-block: 1px solid #f0f0f7;
}

.category-bar__inner {
  display: flex;
  align-items: center;
  min-block-size: var(--site-header-category-height);
  position: relative;
  gap: var(--space-6);
  transition: min-block-size var(--duration-standard) var(--easing-standard);
}

@media (width >= 64rem) {
  .site-header--compact .site-header__primary,
  .site-header--compact .site-brand-lockup {
    min-block-size: var(--site-header-compact-primary-height);
    block-size: var(--site-header-compact-primary-height);
  }

  .site-header--compact .site-logo {
    block-size: var(--site-header-compact-primary-height);
  }

  .site-header--compact .site-logo img {
    inline-size: var(--site-header-compact-logo-width);
  }

  .site-header--compact .site-brand-tagline {
    inset-block-end: 0.25rem;
  }

  .site-header--compact .category-bar__inner {
    min-block-size: var(--site-header-compact-category-height);
  }
}

.no-js body {
  padding-block-start: 0;
}

.no-js .site-header {
  position: sticky;
}

:where(.category-bar, .menu-drawer__navigation)
  :is(.category-menu__trigger, .header-navigation__link, .compare-tools-cta),
.menu-drawer__compare {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: 2.5rem;
  padding: 0.65rem 1rem;
  gap: var(--space-2);
  color: #fff;
  font-size: var(--type-navigation-size);
  font-weight: var(--type-weight-bold);
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  background: var(--color-brand-navy);
  border: 0;
  border-radius: var(--radius-control);
  transition:
    background-color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard);
}

:where(.category-bar, .menu-drawer__navigation) .category-menu__trigger {
  justify-content: space-between;
  list-style: none;
  cursor: pointer;
  transition:
    background-color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard),
    margin-block var(--duration-standard) var(--easing-standard);
}

:where(.category-bar, .menu-drawer__navigation)
  .category-menu__trigger:focus-visible {
  outline: 0.1875rem solid var(--color-brand-blue);
  outline-offset: 0.1875rem;
}

.category-menu__trigger::-webkit-details-marker {
  display: none;
}

.category-menu--mobile .category-menu__trigger {
  display: flex;
  min-block-size: 3rem;
  padding-inline: var(--space-3);
  font-size: var(--type-control-size);
}

.category-menu__label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.category-menu__chevron {
  display: inline-flex;
  transition: transform var(--duration-fast) var(--easing-standard);
}

.category-menu__chevron svg {
  inline-size: 1rem;
  block-size: 1rem;
}

.category-menu[open] > .category-menu__trigger .category-menu__chevron {
  transform: rotate(180deg);
}

.category-menu__panel {
  position: static;
  inline-size: min(58rem, 100%);
  max-block-size: calc(
    100dvh - var(--site-header-full-height) - var(--space-6)
  );
  padding: var(--space-4);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-panel);
  box-shadow: var(--shadow-card-hover);
}

@supports (transition-behavior: allow-discrete) and
  selector(details::details-content) {
  .category-menu::details-content {
    block-size: 0;
    overflow: clip;
    content-visibility: hidden;
    transition:
      block-size var(--duration-standard) var(--easing-standard),
      content-visibility var(--duration-standard) allow-discrete;
  }

  .category-menu[open]::details-content {
    block-size: var(--category-panel-height, auto);
    content-visibility: visible;
  }

  @media (width >= 64rem) {
    .js.category-navigation-ready body {
      transition: padding-block-start var(--duration-standard)
        var(--easing-standard);
    }
  }
}

@media (width >= 64rem) {
  .has-expanded-categories body {
    overflow-anchor: none;
  }

  .js body:has(.category-bar .category-menu[open]) {
    padding-block-start: calc(
      var(--site-header-full-height) +
        var(--site-header-category-panel-space, 0px)
    );
  }

  .category-bar__inner {
    --category-row-height: var(--site-header-category-height);

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0 var(--space-6);
  }

  .site-header--compact .category-bar__inner {
    --category-row-height: var(--site-header-compact-category-height);
  }

  .category-bar .category-menu {
    min-inline-size: 0;
    grid-area: 1 / 1 / 2 / 3;
  }

  .category-bar .category-menu__trigger {
    display: inline-flex;
    margin-block: calc((var(--category-row-height) - 2.5rem) / 2);
  }

  .category-bar .category-menu__content {
    padding-block-end: var(--space-4);
  }

  .header-navigation {
    min-block-size: var(--category-row-height);
    grid-area: 1 / 2;
    transition: min-block-size var(--duration-standard) var(--easing-standard);
  }
}

@supports not (
  (transition-behavior: allow-discrete) and selector(details::details-content)
) {
  .js .site-header {
    position: sticky;
  }

  .js body,
  .js body:has(.category-bar .category-menu[open]) {
    padding-block-start: 0;
  }
}

.category-menu__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
  padding: 0;
  margin: 0;
  list-style: none;
}

.category-menu__link {
  display: flex;
  align-items: center;
  min-block-size: 4rem;
  padding: var(--space-3);
  gap: var(--space-3);
  color: var(--color-text);
  font-size: var(--type-card-title-compact-size);
  font-weight: var(--type-weight-bold);
  letter-spacing: var(--type-card-title-tracking);
  line-height: 1.15;
  text-decoration: none;
  background: linear-gradient(
    135deg,
    var(--category-card-start, var(--color-surface)),
    var(--category-card-end, var(--color-surface-subtle))
  );
  border: 1px solid
    color-mix(
      in srgb,
      var(--category-accent, var(--color-brand-navy)) 28%,
      var(--color-surface)
    );
  border-radius: var(--radius-control);
  transition:
    background-color var(--duration-fast) var(--easing-standard),
    border-color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard),
    transform var(--duration-fast) var(--easing-standard);
}

.category-menu__link:is(:hover, :focus-visible) {
  color: var(--category-accent-dark, var(--color-brand-navy));
  background: linear-gradient(
    135deg,
    var(--category-surface, var(--color-surface-subtle)),
    color-mix(
      in srgb,
      var(--category-card-end, var(--color-surface-subtle)) 90%,
      var(--category-accent, var(--color-brand-navy))
    )
  );
  border-color: var(--category-accent-dark, var(--color-brand-navy));
  box-shadow: var(--shadow-card-hover);
  transform: translateY(-0.125rem);
}

.category-icon-badge {
  --category-icon-shift-x: 0;
  --category-icon-shift-y: 0;

  position: relative;
  display: grid;
  flex-shrink: 0;
  background: color-mix(
    in srgb,
    var(--color-surface) 65%,
    var(--category-surface, var(--color-surface-subtle))
  );
  border-radius: var(--radius-control);
  place-items: center;
}

.category-icon-badge > svg {
  transform: translate(
    var(--category-icon-shift-x),
    var(--category-icon-shift-y)
  );
}

.category-icon-badge--sparkle,
.category-icon-badge--currency {
  --category-icon-shift-x: 0;
  --category-icon-shift-y: 0;
}

.category-icon-badge--create {
  --category-icon-shift-x: 0.03rem;
  --category-icon-shift-y: -0.03rem;
}

.category-icon-badge--trend {
  --category-icon-shift-y: 0.04rem;
}

.category-icon-badge--check {
  --category-icon-shift-x: 0.03rem;
  --category-icon-shift-y: 0.05rem;
}

.category-icon-badge--search {
  --category-icon-shift-x: -0.04rem;
  --category-icon-shift-y: -0.04rem;
}

.category-icon-badge::after {
  position: absolute;
  inset: 0;
  border: 2px solid
    color-mix(
      in srgb,
      var(--category-accent, var(--color-brand-navy)) 55%,
      var(--color-surface)
    );
  border-radius: inherit;
  content: "";
  pointer-events: none;
}

.category-menu__icon {
  padding: var(--space-2);
  color: var(--category-accent-dark, var(--color-brand-navy));
}

@media (width >= 64rem) {
  .category-bar .category-menu__list {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .category-bar .category-menu__list > li {
    grid-column: span 2;
    min-inline-size: 0;
  }

  .category-bar
    .category-menu__list:has(> :nth-child(7):last-child)
    > li:nth-child(n + 4) {
    grid-column: span 3;
  }
}

.header-navigation {
  display: flex;
  align-items: center;
  margin-inline-start: auto;
  gap: var(--space-4);
}

.header-navigation__icon {
  display: inline-flex;
  flex-shrink: 0;
}

.header-navigation__icon svg {
  inline-size: 1.1rem;
  block-size: 1.1rem;
}

.category-menu--mobile .category-menu__panel {
  position: static;
  inline-size: 100%;
  max-block-size: none;
  padding: 0;
  border: 0;
  box-shadow: none;
}

.category-menu--mobile .category-menu__content {
  padding-block: var(--space-2);
}

.category-menu--mobile .category-menu__list {
  grid-template-columns: 1fr;
}

.category-menu--mobile .category-menu__link {
  min-block-size: 3rem;
}

.menu-drawer__compare {
  inline-size: 100%;
  min-block-size: 3rem;
  padding: 0.75rem 1rem;
  margin-block-end: var(--space-3);
  font-size: var(--type-control-size);
}

:where(.category-bar, .menu-drawer__navigation)
  :is(.category-menu__trigger, .header-navigation__link, .compare-tools-cta):is(
    :hover,
    :focus-visible
  ),
:where(.category-bar, .menu-drawer__navigation)
  .category-menu[open]
  > .category-menu__trigger,
.menu-drawer__compare:hover,
.menu-drawer__compare:focus-visible {
  color: #fff;
  background: #24207f;
  box-shadow: 0 0.4rem 1rem rgb(24 27 82 / 18%);
}

.compare-tools-cta__icon,
.menu-drawer__compare-icon {
  display: inline-flex;
  color: var(--color-brand-orange);
}

.compare-tools-cta__icon svg,
.menu-drawer__compare-icon svg {
  inline-size: 1.1rem;
  block-size: 1.1rem;
  stroke-width: 1.9;
}

.site-main {
  min-inline-size: 0;
}

.tool-month {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 28% 75%, rgb(26 67 162 / 48%), transparent 23rem),
    radial-gradient(circle at 90% 26%, rgb(83 36 185 / 56%), transparent 22rem),
    linear-gradient(112deg, #111c5f 0%, #171b6c 48%, #2d208c 100%);
}

.tool-month__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(22rem, 1.1fr);
  min-block-size: 20rem;
}

.tool-month__content {
  z-index: 1;
  align-self: center;
  max-inline-size: 38rem;
  padding-block: 2rem 2.5rem;
}

.tool-month__eyebrow {
  display: inline-flex;
  align-items: center;
  min-block-size: 2rem;
  padding: 0.4rem 0.95rem;
  margin: 0 0 0.75rem;
  gap: 0.45rem;
  color: #11122f;
  font-size: var(--type-eyebrow-size);
  font-weight: var(--type-weight-bold);
  letter-spacing: var(--type-eyebrow-tracking);
  line-height: var(--type-eyebrow-line-height);
  text-transform: uppercase;
  background: linear-gradient(90deg, #ff7d1a, var(--color-brand-orange));
  border-radius: var(--radius-pill);
}

.tool-month__eyebrow svg {
  inline-size: 0.8rem;
  block-size: 0.8rem;
  fill: currentcolor;
  stroke-width: 1.2;
}

.tool-month h1 {
  margin: 0;
  font-size: var(--type-display-size);
  font-weight: var(--type-weight-semibold);
  letter-spacing: var(--type-section-title-tracking);
  line-height: var(--type-display-line-height);
}

.tool-month__description {
  max-inline-size: 35rem;
  margin: 0.75rem 0 1rem;
  color: #f0f1ff;
  font-size: var(--type-body-large-size);
  line-height: var(--type-body-large-line-height);
}

.tool-month__offer-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  max-inline-size: 100%;
  gap: 0.75rem 1rem;
}

.tool-month__facts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  min-inline-size: 0;
  gap: 0.75rem;
  min-block-size: 2.25rem;
  font-size: 0.92rem;
}

.score-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.45rem 0.75rem;
  gap: 0.35rem;
  color: #11122f;
  font-weight: 700;
  background: #ff7c19;
  border-radius: var(--radius-pill);
}

.score-pill svg {
  inline-size: 0.85rem;
  block-size: 0.85rem;
  fill: currentcolor;
  stroke-width: 1.2;
}

.tool-month__divider {
  align-self: stretch;
  inline-size: 1px;
  min-block-size: 1.5rem;
  background: rgb(255 255 255 / 28%);
}

.tool-month__free-plan {
  display: inline-flex;
  align-items: center;
  min-block-size: 1.65rem;
  padding-inline: 0.6rem;
  color: var(--color-status-neutral-text);
  font-size: 0.75rem;
  font-weight: 700;
  background: var(--color-status-neutral-surface);
  border: 1px solid var(--color-status-neutral-border);
  border-radius: var(--radius-pill);
}

.tool-month__price {
  min-inline-size: 0;
  color: #fff;
  overflow-wrap: anywhere;
}

.tool-month__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.tool-month__actions .button {
  min-inline-size: 7.4rem;
  min-block-size: 2.8rem;
}

.button--light {
  color: var(--color-text);
  background: #fff;
  box-shadow: 0 0.4rem 1rem rgb(3 7 35 / 16%);
}

.button--light:hover {
  background: #f5f6ff;
  box-shadow: 0 0.7rem 1.4rem rgb(3 7 35 / 24%);
}

.button--outline-light {
  color: #fff;
  background: transparent;
  border: 1px solid rgb(255 255 255 / 38%);
}

.button--outline-light:hover {
  background: rgb(255 255 255 / 10%);
  border-color: rgb(255 255 255 / 68%);
}

.tool-month__visual-space {
  display: grid;
  place-self: center end;
  inline-size: min(100%, 34rem);
  block-size: 20rem;
  min-inline-size: 0;
  min-block-size: 0;
  place-items: center;
}

.tool-month__visual-space img {
  display: block;
  inline-size: auto;
  max-inline-size: 62%;
  block-size: auto;
  max-block-size: 62%;
  object-fit: contain;
  border-radius: var(--radius-card);
  box-shadow: 0 1.25rem 3rem rgb(3 7 35 / 28%);
}

@media (width >= 64rem) {
  .tool-month__content {
    padding-block: 1.75rem 2.15rem;
  }

  .tool-month__description {
    margin-block: 0.65rem 0.85rem;
  }
}

.trust-strip {
  --trust-card-border: linear-gradient(
    135deg,
    rgb(23 23 237 / 34%),
    rgb(75 32 230 / 24%)
  );
  --trust-card-surface: linear-gradient(
    145deg,
    var(--color-surface) 42%,
    rgb(75 32 230 / 3.5%) 100%
  );
  --trust-card-icon-surface: linear-gradient(145deg, #eaf1ff, #eeeaff);
  --trust-card-shadow: 0 0.5rem 1.6rem rgb(24 27 82 / 11%);

  position: relative;
  z-index: 2;
  margin-block-start: -2rem;
}

.site-main--without-tool .trust-strip {
  margin-block-start: 0;
}

.trust-strip__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.trust-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  min-block-size: 4.75rem;
  padding: 0.75rem 0.9rem;
  gap: 0.75rem;
  background:
    var(--trust-card-surface) padding-box,
    var(--trust-card-border) border-box;
  border: 1px solid transparent;
  border-radius: var(--radius-card);
  box-shadow: var(--trust-card-shadow);
}

.trust-card__value {
  color: var(--color-brand-blue);
  font-size: clamp(2.05rem, 3vw, 2.5rem);
  font-weight: var(--type-weight-bold);
  letter-spacing: -0.05em;
  line-height: 1;
}

.trust-card__copy {
  min-inline-size: 0;
}

.trust-card__copy h3,
.trust-card__copy p {
  margin: 0;
}

.trust-card__copy h3 {
  color: var(--color-text);
  font-size: 0.8rem;
  font-weight: var(--type-weight-bold);
  line-height: 1.25;
}

.trust-card__copy p {
  margin-block-start: 0.2rem;
  color: var(--color-text-muted);
  font-size: 0.64rem;
  line-height: 1.25;
}

.trust-card__icon {
  display: grid;
  inline-size: 2.15rem;
  block-size: 2.15rem;
  color: var(--color-brand-violet);
  background: var(--trust-card-icon-surface);
  border-radius: var(--radius-pill);
  box-shadow: inset 0 0 0 1px rgb(48 40 237 / 9%);
  place-items: center;
}

.trust-card__icon svg {
  inline-size: 1.15rem;
  block-size: 1.15rem;
}

.trust-card__date {
  margin-block-start: 0.15rem;
  color: var(--color-brand-blue);
  font-size: 1.05rem;
  font-weight: var(--type-weight-bold);
  letter-spacing: -0.025em;
  line-height: 1.15;
}

.trust-card__seal {
  display: grid;
  inline-size: 2.3rem;
  block-size: 2.3rem;
  color: #fff;
  background: linear-gradient(
    145deg,
    var(--color-brand-blue),
    var(--color-brand-violet)
  );
  border-radius: 45% 55% 48% 52%;
  box-shadow: 0 0.3rem 0.8rem rgb(23 23 237 / 20%);
  place-items: center;
  transform: rotate(8deg);
}

.trust-card__seal svg {
  inline-size: 1.1rem;
  block-size: 1.1rem;
  stroke-width: 2.5;
  transform: rotate(-8deg);
}

.category-shelves {
  overflow-x: clip;
  padding-block: 1.75rem 2rem;
}

.category-shelf {
  --category-accent: var(--color-brand-blue);
  --category-band: color-mix(
    in srgb,
    var(--category-accent) 7.5%,
    var(--color-surface)
  );
  --category-card-start: #f8f7ff;
  --category-card-end: #ebe7ff;
  --homepage-card-start: color-mix(
    in srgb,
    var(--category-card-start) 96%,
    var(--category-accent) 4%
  );
  --homepage-card-end: color-mix(
    in srgb,
    var(--category-card-end) 96%,
    var(--category-accent) 4%
  );
  --homepage-card-border-strength: 30%;
  --homepage-card-border-hover-strength: 40%;
  --homepage-card-border: color-mix(
    in srgb,
    var(--category-accent) var(--homepage-card-border-strength),
    var(--color-surface)
  );
  --category-monogram-surface: #fff;

  position: relative;
  isolation: isolate;
  padding-block: 1rem 0.5rem;
}

.category-shelf--writing,
.category-shelf--productivity {
  --homepage-card-border-strength: 28%;
}

.category-shelf--marketing {
  --homepage-card-border-strength: 32%;
}

.category-shelf::before {
  position: absolute;
  z-index: -1;
  inset-block: 0;
  inset-inline-start: 50%;
  inline-size: 100vw;
  content: "";
  background: var(--category-band);
  transform: translateX(-50%);
}

.category-shelf + .category-shelf {
  margin-block-start: 1rem;
}

.category-shelf__header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-block-end: 0;
  gap: var(--space-5);
}

.category-shelf__heading-group {
  display: flex;
  align-items: flex-start;
  min-inline-size: 0;
  gap: 0.75rem;
}

.category-shelf__heading-icon {
  flex: 0 0 1.9rem;
  inline-size: 1.9rem;
  block-size: 1.9rem;
  color: var(--category-accent);
}

.category-shelf__heading-icon svg {
  inline-size: 1.45rem;
  block-size: 1.45rem;
  stroke-width: 2.4;
}

.category-shelf__header h2,
.category-shelf__header p {
  margin: 0;
}

.category-shelf__intro {
  max-inline-size: min(100%, 76rem);
  margin: 0.65rem 0 0.85rem;
  color: #4a4f69;
  font-size: 0.86rem;
  line-height: 1.62;
}

.category-shelf__header h2 {
  font-size: var(--type-homepage-shelf-title-size);
  font-weight: var(--type-weight-semibold);
  letter-spacing: var(--type-section-title-tracking);
  line-height: 1.12;
}

.category-shelf__header p {
  margin-block-start: 0.25rem;
  color: var(--color-text-muted);
  font-size: 0.75rem;
  line-height: 1.35;
}

.category-shelf__see-all {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-block-size: 2.6rem;
  padding: 0.65rem 1rem;
  gap: 0.45rem;
  color: var(--category-accent);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  border: 2px solid currentcolor;
  border-radius: var(--radius-control);
  transition:
    color var(--duration-fast) var(--easing-standard),
    background-color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard);
}

.category-shelf__see-all:hover {
  color: #fff;
  background: var(--category-accent);
  box-shadow: 0 0.5rem 1.1rem rgb(24 27 82 / 12%);
}

.category-shelf__see-all svg {
  inline-size: 1rem;
  block-size: 1rem;
}

.software-rail-shell {
  position: relative;
}

.software-rail {
  display: flex;
  padding: 0.25rem 3rem 0.7rem 0.25rem;
  margin-inline: -0.25rem;
  gap: 1rem;
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-padding-inline: 0.25rem;
  scroll-snap-type: inline mandatory;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
}

.software-rail::-webkit-scrollbar {
  display: none;
}

.software-rail:focus-visible {
  outline: 0.1875rem solid var(--category-accent);
  outline-offset: 0.15rem;
  border-radius: var(--radius-card);
}

.merchandising-card__teaser {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--merchandising-card-teaser-lines);
}

.merchandising-card__footer {
  display: grid;
  align-self: end;
  align-content: end;
  margin-block-start: auto;
  gap: var(--merchandising-card-footer-gap);
}

.merchandising-card__rating-price {
  min-inline-size: 0;
  min-block-size: 2.7em;
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.35;
  overflow-wrap: break-word;
}

.merchandising-card__rating {
  display: inline-flex;
  align-items: center;
  min-block-size: 1.65rem;
  padding: 0.2rem 0.55rem;
  gap: 0.3rem;
  color: var(--category-accent-dark);
  font-weight: var(--type-weight-bold);
  line-height: 1;
  white-space: nowrap;
  background: color-mix(
    in srgb,
    var(--category-accent) 10%,
    var(--color-surface)
  );
  border: 1px solid
    color-mix(in srgb, var(--category-accent) 24%, var(--color-surface));
  border-radius: var(--radius-pill);
}

.merchandising-card__rating svg {
  display: inline-block;
  flex: 0 0 auto;
  inline-size: 0.75rem;
  block-size: 0.75rem;
  margin-inline-end: 0;
  color: var(--category-accent);
  fill: currentcolor;
  stroke-width: 1.2;
  vertical-align: -0.08em;
}

.merchandising-card__price {
  display: inline;
}

.software-card {
  display: grid;
  flex: 0 0 var(--homepage-shelf-card-size);
  grid-template-rows: minmax(0, 1fr) auto;
  min-inline-size: 0;
  min-block-size: var(--homepage-shelf-card-min-height);
  overflow: hidden;
  background: linear-gradient(
    118deg,
    var(--homepage-card-start),
    var(--homepage-card-end)
  );
  border: 1px solid var(--homepage-card-border);
  border-radius: var(--radius-card);
  box-shadow: 0 0.35rem 1.1rem rgb(24 27 82 / 6%);
  scroll-snap-align: start;
  transform: translateY(0);
  transition:
    border-color var(--duration-standard) var(--easing-standard),
    box-shadow var(--duration-standard) var(--easing-standard),
    transform var(--duration-fast) var(--easing-standard);
  will-change: transform;
}

.merchandising-card--illustrated {
  background: var(--color-surface);
}

.merchandising-card__illustration {
  display: block;
  overflow: hidden;
  background: var(--category-surface);
}

.merchandising-card__illustration img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.software-card--illustrated {
  --software-card-description-reserve: 4.05em;
  --software-card-price-reserve: 3.75em;
  --software-card-best-for-reserve: 3.75em;

  block-size: 25.35rem;
  min-block-size: 25.35rem;
}

.software-card:hover {
  border-color: color-mix(
    in srgb,
    var(--category-accent) var(--homepage-card-border-hover-strength),
    var(--color-surface)
  );
  box-shadow: var(--shadow-card-hover);
  transform: translateY(-0.125rem);
}

.software-card:focus-within {
  box-shadow: var(--shadow-card-hover);
}

.software-card__link {
  --software-card-link-padding-block-start: 0.9rem;
  --software-card-link-padding-inline: 1rem;
  --software-card-link-padding-block-end: 0.65rem;

  display: grid;
  grid-template-rows: auto minmax(3.15rem, 1fr) auto;
  block-size: 100%;
  padding: var(--software-card-link-padding-block-start)
    var(--software-card-link-padding-inline)
    var(--software-card-link-padding-block-end);
  row-gap: var(--merchandising-card-section-gap);
  color: var(--color-text);
  text-decoration: none;
  background: transparent;
  border-radius: var(--radius-card) var(--radius-card) 0 0;
}

.software-card--illustrated .software-card__link {
  grid-template-rows: auto auto minmax(3.15rem, 1fr) auto;
}

.software-card--illustrated .merchandising-card__illustration {
  block-size: 7rem;
  margin-block-start: calc(-1 * var(--software-card-link-padding-block-start));
  margin-inline: calc(-1 * var(--software-card-link-padding-inline));
}

.software-card__link:focus-visible {
  outline-offset: -0.25rem;
}

.software-card__top,
.software-card__identity,
.software-card__badges {
  display: flex;
  align-items: center;
}

.software-card__top {
  align-items: flex-start;
  justify-content: space-between;
  min-inline-size: 0;
  gap: 0.5rem;
}

.software-card__identity {
  min-inline-size: 0;
  gap: 0.65rem;
}

.software-card__monogram {
  display: grid;
  flex: 0 0 2.45rem;
  inline-size: 2.45rem;
  block-size: 2.45rem;
  color: var(--category-accent);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1;
  background: var(--category-monogram-surface);
  border: 1px solid rgb(24 27 82 / 7%);
  border-radius: 0.55rem;
  box-shadow: 0 0.25rem 0.7rem rgb(24 27 82 / 6%);
  place-items: center;
}

.software-card__monogram--logo {
  padding: 0.25rem;
  background: var(--color-surface);
}

.software-card__logo {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
}

.software-card h3 {
  min-inline-size: 0;
  margin: 0;
  color: var(--color-text);
  font-size: var(--type-card-title-compact-size);
  font-weight: var(--type-weight-bold);
  letter-spacing: var(--type-card-title-tracking);
  line-height: 1.15;
  transition: color var(--duration-fast) var(--easing-standard);
}

.software-card__badges {
  flex: 0 0 auto;
  gap: 0.3rem;
}

.software-card__badge {
  display: inline-flex;
  align-items: center;
  min-block-size: 1.35rem;
  padding-inline: 0.5rem;
  color: #fff;
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1;
  border-radius: var(--radius-pill);
}

.software-card__badge--pick {
  background: var(--color-brand-navy);
}

.software-card__badge--free {
  color: var(--color-status-neutral-text);
  background: var(--color-status-neutral-surface);
  border: 1px solid var(--color-status-neutral-border);
}

.software-card__description {
  align-self: start;
  margin: 0;
  color: #252947;
  font-size: 0.77rem;
  line-height: 1.35;
}

.software-card--illustrated .software-card__description {
  min-block-size: var(--software-card-description-reserve);
}

.software-card__footer {
  min-inline-size: 0;
}

.software-card--illustrated .software-card__footer {
  grid-template-rows: auto auto;
  align-content: start;
}

.merchandising-card--illustrated .merchandising-card__rating-price {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: start;
  column-gap: 0.4rem;
}

.software-card--illustrated .merchandising-card__rating-price {
  min-block-size: var(--software-card-price-reserve);
}

.merchandising-card--illustrated .merchandising-card__rating {
  justify-self: start;
}

.merchandising-card--illustrated .merchandising-card__rating-price-separator {
  display: none;
}

.merchandising-card--illustrated .merchandising-card__price {
  display: block;
}

.software-card__best-for {
  min-block-size: 2.5em;
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.25;
}

.software-card--illustrated .software-card__best-for {
  min-block-size: var(--software-card-best-for-reserve);
}

.software-card__best-for strong {
  margin-inline-end: 0.25rem;
}

.card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-inline-size: 0;
  min-block-size: 2.35rem;
  gap: 0.65rem;
}

.card-actions__review,
.card-actions__external {
  display: inline-flex;
  align-items: center;
  min-block-size: 1.9rem;
  gap: 0.3rem;
  padding: 0.32rem 0.58rem;
  font-size: 0.73rem;
  font-weight: var(--type-weight-semibold);
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  border: 1px solid;
  border-radius: 0.5rem;
}

.card-actions__review {
  color: var(--category-accent-dark, var(--color-brand-blue));
  background: var(--color-surface);
  border-color: var(--category-accent, var(--color-brand-blue));
}

.merchandising-card--illustrated .card-actions__review {
  background: color-mix(
    in srgb,
    var(--category-accent, var(--color-brand-blue)) 8%,
    var(--color-surface)
  );
}

.card-actions__review svg {
  inline-size: 0.8rem;
  block-size: 0.8rem;
}

.card-actions__external {
  justify-content: flex-end;
  margin-inline-start: auto;
  color: var(--color-success);
  font-weight: var(--type-weight-bold);
  background: var(--color-surface);
  border-color: var(--color-success);
}

.merchandising-card--illustrated .card-actions__external {
  background: color-mix(
    in srgb,
    var(--color-success) 10%,
    var(--color-surface)
  );
}

.card-actions__review:hover {
  color: var(--category-accent-dark, var(--color-brand-blue));
  text-decoration: none;
  background: color-mix(
    in srgb,
    var(--category-accent, var(--color-brand-blue)) 8%,
    var(--color-surface)
  );
  border-color: var(--category-accent-dark, var(--color-brand-blue));
}

.merchandising-card--illustrated .card-actions__review:hover {
  color: #fff;
  background: var(--category-accent);
  border-color: var(--category-accent);
}

.card-actions__external:hover,
.merchandising-card--illustrated .card-actions__external:hover {
  color: #fff;
  text-decoration: none;
  background: var(--color-success);
  border-color: var(--color-success);
}

.card-actions--homepage {
  align-self: end;
  padding: 0.4rem 1rem 0.7rem;
  border-block-start: 1px solid rgb(24 27 82 / 7%);
}

.software-rail__control {
  position: absolute;
  z-index: 3;
  inset-block-start: 50%;
  display: grid;
  inline-size: 2.75rem;
  block-size: 2.75rem;
  padding: 0;
  color: var(--color-surface);
  background: var(--category-accent-dark);
  border: 1.5px solid var(--category-accent-dark);
  border-radius: var(--radius-pill);
  box-shadow:
    0 0 0 3px rgb(255 255 255 / 90%),
    0 0.35rem 1rem rgb(24 27 82 / 20%);
  cursor: pointer;
  place-items: center;
  transform: translateY(-50%);
  transition:
    color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard),
    background-color var(--duration-fast) var(--easing-standard);
}

.software-rail__control:focus-visible {
  outline: 3px solid var(--color-brand-navy);
  outline-offset: 5px;
}

.software-rail__control:disabled {
  visibility: hidden;
}

.software-rail__control:hover:enabled {
  color: var(--category-accent-dark);
  background: var(--color-surface);
  box-shadow:
    0 0 0 3px rgb(255 255 255 / 90%),
    0 0.45rem 1.25rem rgb(24 27 82 / 24%);
}

.software-rail__control--previous {
  inset-inline-start: -1.2rem;
}

.software-rail__control--previous svg {
  transform: rotate(180deg);
}

.software-rail__control--next {
  inset-inline-end: -1.2rem;
}

.software-rail__control svg {
  inline-size: 1.2rem;
  block-size: 1.2rem;
}

.no-js .software-rail__controls {
  display: none;
}

/* Shared compact review navigation; no offer or rating UI. */
.continuation-link {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr) auto;
  min-block-size: 4rem;
  padding: var(--space-3);
  align-items: center;
  gap: var(--space-3);
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  text-decoration: none;
  transition:
    border-color var(--duration-fast) var(--easing-standard),
    box-shadow var(--duration-fast) var(--easing-standard);
}

.continuation-link:hover,
.continuation-link:focus-visible {
  color: var(--category-accent-dark, var(--color-brand-navy));
  border-color: var(--category-accent-dark, var(--color-brand-navy));
  box-shadow: var(--shadow-card);
}

.continuation-link:focus-visible {
  outline: 3px solid var(--category-accent-dark, var(--color-brand-navy));
  outline-offset: 3px;
}

.continuation-link__logo {
  display: grid;
  inline-size: 2.5rem;
  block-size: 2.5rem;
  overflow: hidden;
  color: var(--category-accent-dark, var(--color-brand-navy));
  background: var(--category-surface, var(--color-surface-subtle));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  font-size: var(--type-small-size);
  font-weight: var(--type-weight-bold);
  place-items: center;
}

.continuation-link__logo img {
  inline-size: 100%;
  block-size: 100%;
  padding: var(--space-1);
  object-fit: contain;
}

.continuation-link__copy {
  min-inline-size: 0;
}

.continuation-link__copy strong {
  display: block;
  font-size: var(--type-body-size);
  line-height: 1.35;
}

.continuation-link__action {
  color: var(--category-accent-dark, var(--color-brand-navy));
  font-size: 1.25rem;
}

.review-methodology {
  padding: 1rem 1.25rem 1.1rem;
  background:
    linear-gradient(
        135deg,
        color-mix(in srgb, var(--color-brand-blue) 5%, var(--color-surface)) 0%,
        var(--color-surface) 54%,
        color-mix(in srgb, var(--color-brand-orange) 5%, var(--color-surface))
          100%
      )
      padding-box,
    linear-gradient(
        115deg,
        color-mix(in srgb, var(--color-brand-blue) 30%, var(--color-surface)),
        color-mix(in srgb, var(--color-brand-violet) 18%, var(--color-surface)),
        color-mix(in srgb, var(--color-brand-orange) 28%, var(--color-surface))
      )
      border-box;
  border: 1px solid transparent;
  border-radius: var(--radius-panel);
  box-shadow: 0 0.85rem 2.25rem rgb(24 27 82 / 10%);
}

.review-methodology__header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-block-end: 0.75rem;
  gap: var(--space-5);
}

.review-methodology__header h2 {
  margin: 0;
  font-size: var(--type-subsection-title-size);
  font-weight: var(--type-weight-semibold);
  letter-spacing: var(--type-section-title-tracking);
  line-height: 1.1;
}

.review-methodology__learn-more {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  padding-block: 0.35rem;
  gap: 0.4rem;
  color: var(--color-brand-blue);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

.review-methodology__learn-more:hover {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.review-methodology__learn-more svg,
.review-step__connector svg {
  inline-size: 1rem;
  block-size: 1rem;
}

.review-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0;
  margin: 0;
  gap: 3.5rem;
  list-style: none;
}

.review-step {
  --review-step-accent: var(--color-brand-blue);
  --review-step-background: color-mix(
    in srgb,
    var(--review-step-accent) 7%,
    var(--color-surface)
  );
  --review-step-border: color-mix(
    in srgb,
    var(--review-step-accent) 23%,
    var(--color-surface)
  );

  position: relative;
  min-inline-size: 0;
}

.review-step--compare {
  --review-step-accent: var(--color-brand-orange);
}

.review-step--choose {
  --review-step-accent: var(--color-brand-blue);
}

.review-step--create {
  --review-step-accent: var(--color-brand-pink);
}

.review-step__content {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  block-size: 100%;
  min-block-size: 3.75rem;
  padding: 0.55rem 0.75rem;
  gap: 0.75rem;
  color: var(--color-text);
  background: var(--review-step-background);
  border: 1px solid var(--review-step-border);
  border-radius: var(--radius-control);
}

.review-step__icon {
  display: grid;
  inline-size: 2.75rem;
  block-size: 2.75rem;
  color: var(--review-step-accent);
  background: color-mix(
    in srgb,
    var(--review-step-accent) 14%,
    var(--color-surface)
  );
  border: 1px solid
    color-mix(in srgb, var(--review-step-accent) 20%, var(--color-surface));
  border-radius: var(--radius-pill);
  place-items: center;
}

.review-step__icon svg {
  inline-size: 1.6rem;
  block-size: 1.6rem;
  stroke-width: 1.8;
}

.review-step__copy {
  display: grid;
  min-inline-size: 0;
  gap: 0.2rem;
}

.review-step__title {
  color: color-mix(in srgb, var(--review-step-accent) 28%, var(--color-text));
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.2;
}

.review-step__description {
  color: #454a68;
  font-size: 0.72rem;
  line-height: 1.35;
}

.review-step__connector {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-end: -2.65rem;
  display: grid;
  inline-size: 1.75rem;
  color: var(--color-brand-violet);
  transform: translateY(-50%);
  place-items: center;
}

.homepage-newsletter {
  display: grid;
  grid-template-columns: minmax(18rem, 0.9fr) minmax(28rem, 1.1fr);
  align-items: center;
  margin-block-start: 1.5rem;
  padding: 1.25rem 2.5rem;
  gap: 2.5rem;
  color: #fff;
  background:
    radial-gradient(circle at 86% 30%, rgb(79 42 199 / 48%), transparent 21rem),
    linear-gradient(108deg, #111958 0%, #151865 58%, #211879 100%);
  border-radius: var(--radius-panel);
}

.homepage-newsletter__copy h2,
.homepage-newsletter__copy p {
  margin: 0;
}

.homepage-newsletter__copy h2 {
  font-size: var(--type-subsection-title-size);
  font-weight: var(--type-weight-semibold);
  letter-spacing: var(--type-subsection-title-tracking);
  line-height: 1.15;
}

.homepage-newsletter__copy p {
  max-inline-size: 34rem;
  margin-block-start: 0.35rem;
  color: #eff0ff;
  font-size: 0.76rem;
  line-height: 1.45;
}

.homepage-newsletter__form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
}

.newsletter-signup__fields {
  display: contents;
}

.newsletter-signup__fields[hidden],
.newsletter-signup__provider-errors,
.newsletter-signup [data-element="success"] {
  display: none !important;
}

.newsletter-signup[data-state="loading"] [data-element="submit"] {
  cursor: wait;
}

.newsletter-signup__status[hidden] {
  display: none;
}

.newsletter-signup__legal {
  margin: 0.5rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.72rem;
  line-height: 1.45;
}

.newsletter-signup__legal a,
.consent-policy-link a,
.consent-dialog__policy a {
  color: inherit;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.15em;
}

.homepage-newsletter .newsletter-signup__legal {
  grid-column: 1 / -1;
  color: #eff0ff;
}

.homepage-newsletter__form input,
.homepage-newsletter__submit {
  min-block-size: 3rem;
  border-radius: var(--radius-control);
}

.homepage-newsletter__form input {
  inline-size: 100%;
  padding: 0.7rem 1rem;
  color: var(--color-text);
  opacity: 1;
  background: #fff;
  border: 1px solid rgb(255 255 255 / 54%);
  box-shadow: inset 0 0 0 1px rgb(16 21 82 / 4%);
}

.homepage-newsletter__form input::placeholder {
  color: #74788f;
  opacity: 1;
}

.homepage-newsletter__submit {
  min-inline-size: 9rem;
  padding: 0.75rem 1.4rem;
  color: #fff;
  font-weight: 700;
  background: linear-gradient(105deg, var(--color-brand-orange), #ff3a12);
  border: 0;
  box-shadow: 0 0.45rem 1rem rgb(3 7 35 / 18%);
}

.homepage-newsletter__submit:disabled {
  cursor: not-allowed;
  opacity: 1;
}

.homepage-newsletter__status {
  grid-column: 1 / -1;
  margin: 0;
  color: #eff0ff;
  font-size: 0.72rem;
  line-height: 1.4;
}

.homepage-newsletter__status[data-state="success"] {
  color: #bfffe8;
}

.homepage-newsletter__status[data-state="error"] {
  color: #ffd4d4;
}

.social-links {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  gap: 0.5rem;
  list-style: none;
}

.social-links__link {
  display: inline-flex;
  align-items: center;
  min-inline-size: 0;
  gap: 0.6rem;
  color: var(--color-text);
  text-decoration: none;
}

.social-links__icon {
  display: grid;
  flex: 0 0 auto;
  inline-size: 2rem;
  block-size: 2rem;
  color: var(--color-brand-blue);
  background: #f0efff;
  border-radius: 0.65rem;
  place-items: center;
}

.social-links__icon svg {
  inline-size: 1.1rem;
  block-size: 1.1rem;
  stroke-width: 1.9;
}

.social-links__text {
  display: grid;
  min-inline-size: 0;
  line-height: 1.25;
}

.social-links__platform {
  color: var(--color-text-muted);
  font-size: var(--type-small-size);
}

.social-links__handle {
  overflow-wrap: anywhere;
  font-weight: var(--type-weight-semibold);
}

.site-footer {
  padding-block: 0.85rem 1.5rem;
  background: #fff;
}

.site-footer__inner {
  display: grid;
  grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
  align-items: start;
  gap: 1rem 2rem;
}

.site-footer__brand-column {
  min-inline-size: 0;
}

.site-footer__brand {
  display: flex;
  align-items: center;
  min-inline-size: 0;
  gap: 0.3rem;
}

.site-logo.site-logo--footer {
  position: relative;
  display: block;
  flex: 0 0 11.25rem;
  inline-size: 11.25rem;
  block-size: 2.75rem;
  overflow: hidden;
}

.site-logo.site-logo--footer img {
  position: absolute;
  display: block;
  inset-block-start: 50%;
  inset-inline-start: 0;
  inline-size: 100%;
  max-inline-size: 100%;
  block-size: auto;
  transform: translateY(-50%);
}

.site-footer__copyright {
  flex: 0 0 auto;
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--type-small-size);
  line-height: var(--type-eyebrow-line-height);
  white-space: nowrap;
}

.social-links--footer {
  margin-block-start: 0.1rem;
}

.social-links--footer .social-links__link {
  padding: 0.25rem 0.4rem;
  color: var(--color-text-muted);
  border-radius: var(--radius-pill);
  font-size: var(--type-small-size);
}

.social-links--footer .social-links__link:hover {
  color: var(--color-brand-blue);
  background: #f7f6ff;
}

.social-links--footer .social-links__icon {
  inline-size: 1.75rem;
  block-size: 1.75rem;
  background: #f4f3ff;
  border-radius: 0.55rem;
}

.social-links--footer .social-links__icon svg {
  inline-size: 1rem;
  block-size: 1rem;
}

.social-links--footer .social-links__platform {
  display: none;
}

.site-footer__content {
  padding-block-start: 0;
}

.site-footer__navigation {
  display: flex;
  align-items: center;
  min-block-size: 2.75rem;
}

.site-footer__navigation ul {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0;
  margin: 0;
  gap: 0.5rem 1.25rem;
  list-style: none;
}

.site-footer__navigation a,
.site-footer__control,
.site-footer__pending {
  color: #565c7d;
  font-size: var(--type-small-size);
  text-decoration: none;
}

.site-footer__control {
  padding: 0;
  font-family: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.site-footer__pending {
  color: var(--color-text-muted);
}

.site-footer__navigation a:hover,
.site-footer__control:hover {
  color: var(--color-brand-blue);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.site-footer__status {
  max-inline-size: 49rem;
  margin: 0.65rem 0 0;
  color: var(--color-text-muted);
  font-size: var(--type-small-size);
  line-height: 1.55;
}

.site-footer__disclosure {
  max-inline-size: 49rem;
  margin: 0.65rem 0 0;
  color: var(--color-text-muted);
  font-size: var(--type-small-size);
  line-height: 1.55;
}

.consent-notice {
  position: fixed;
  z-index: 110;
  inset-block-end: 1.25rem;
  inset-inline-start: 50%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  inline-size: min(calc(100% - 2rem), 72rem);
  padding: 1.15rem 1.25rem;
  gap: 1rem 1.5rem;
  background: #fff;
  border: 1px solid #dcddf3;
  border-radius: var(--radius-panel);
  box-shadow: 0 1.25rem 3.5rem rgb(16 21 82 / 20%);
  transform: translateX(-50%);
}

.consent-notice__copy h2,
.consent-dialog h2,
.consent-category h3 {
  margin: 0;
  color: var(--color-text);
}

.consent-notice__copy h2,
.consent-dialog h2 {
  font-size: var(--type-subsection-title-size);
  letter-spacing: var(--type-subsection-title-tracking);
  line-height: var(--type-subsection-title-line-height);
}

.consent-notice__copy p,
.consent-dialog__header p,
.consent-category p {
  color: var(--color-text-muted);
  line-height: 1.55;
}

.consent-notice__copy p {
  max-inline-size: 48rem;
  margin: 0.35rem 0 0;
  font-size: var(--type-small-size);
}

.consent-notice__copy .consent-policy-link {
  margin-block-start: 0.2rem;
  font-weight: var(--type-weight-semibold);
}

.consent-notice__actions,
.consent-dialog__actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.consent-dialog__policy {
  padding: 0 1.5rem 1.5rem;
  margin: -0.65rem 0 0;
  color: var(--color-text-muted);
  font-size: var(--type-small-size);
  font-weight: var(--type-weight-semibold);
  text-align: end;
}

.consent-notice__actions {
  justify-content: flex-end;
}

.consent-button {
  min-inline-size: 9.75rem;
}

.consent-button--accept {
  color: var(--color-brand-navy);
  background: var(--color-brand-orange);
}

.consent-button--accept:hover {
  background: #ff6a24;
  box-shadow: 0 0.5rem 1rem rgb(255 100 10 / 18%);
}

.consent-button--reject {
  color: #fff;
  background: var(--color-brand-navy);
}

.consent-button--reject:hover {
  background: #1b2170;
  box-shadow: 0 0.5rem 1rem rgb(16 21 82 / 18%);
}

.consent-button--save {
  color: var(--color-brand-navy);
  background: #f1f0ff;
  border: 1px solid #d5d3f5;
}

.consent-button--save:hover {
  background: #e7e5ff;
}

.consent-link-button {
  min-block-size: 2.75rem;
  padding: 0.5rem 0.25rem;
  color: var(--color-brand-navy);
  font-family: inherit;
  font-size: var(--type-control-size);
  font-weight: var(--type-weight-bold);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.consent-dialog {
  inline-size: min(calc(100% - 2rem), 44rem);
  max-block-size: min(46rem, calc(100dvh - 2rem));
  padding: 0;
  overflow-y: auto;
  color: var(--color-text);
  background: #fff;
  border: 0;
  border-radius: var(--radius-panel);
  box-shadow: var(--shadow-panel);
}

.consent-dialog::backdrop {
  background: rgb(7 10 42 / 62%);
}

.consent-dialog__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1.5rem 1.5rem 1.25rem;
  gap: 1rem;
  background: linear-gradient(135deg, #fff 30%, #f3f1ff 100%);
  border-block-end: 1px solid #e7e6f5;
}

.consent-dialog__header p {
  max-inline-size: 36rem;
  margin: 0.45rem 0 0;
  font-size: var(--type-small-size);
}

.consent-dialog__close {
  flex: 0 0 auto;
}

dialog.consent-dialog .consent-dialog__close svg {
  fill: none;
  stroke: currentcolor;
}

.consent-categories {
  display: grid;
  padding: 1.25rem 1.5rem;
  gap: 0.85rem;
}

.consent-category {
  position: relative;
  padding: 1rem 1.1rem;
  background: #fafafe;
  border: 1px solid #e3e3ef;
  border-radius: var(--radius-control);
}

.consent-category__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.consent-category h3 {
  font-size: var(--type-card-title-size);
  letter-spacing: var(--type-card-title-tracking);
  line-height: var(--type-card-title-line-height);
}

.consent-category p {
  max-inline-size: 34rem;
  margin: 0.35rem 4.5rem 0 0;
  font-size: var(--type-small-size);
}

.consent-category__required {
  padding: 0.35rem 0.65rem;
  color: var(--color-brand-blue);
  font-size: 0.7rem;
  font-weight: var(--type-weight-bold);
  background: #eeedff;
  border-radius: var(--radius-pill);
}

.consent-toggle {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  inline-size: 3.25rem;
  block-size: 1.8rem;
  cursor: pointer;
}

.consent-toggle input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
}

.consent-toggle > span[aria-hidden="true"] {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  background: #c8cad9;
  border-radius: var(--radius-pill);
  transition: background-color var(--duration-fast) var(--easing-standard);
}

.consent-toggle > span[aria-hidden="true"]::after {
  position: absolute;
  inset-block-start: 0.2rem;
  inset-inline-start: 0.2rem;
  inline-size: 1.4rem;
  block-size: 1.4rem;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 0.15rem 0.4rem rgb(16 21 82 / 24%);
  content: "";
  transition: transform var(--duration-fast) var(--easing-standard);
}

.consent-toggle input:checked + span[aria-hidden="true"] {
  background: linear-gradient(135deg, var(--color-brand-blue), #6c2ceb);
}

.consent-toggle input:checked + span[aria-hidden="true"]::after {
  transform: translateX(1.45rem);
}

.consent-toggle input:focus-visible + span[aria-hidden="true"] {
  outline: 0.1875rem solid var(--color-brand-blue);
  outline-offset: 0.1875rem;
}

.consent-dialog__actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  padding: 0 1.5rem 1.5rem;
}

.site-overlay {
  position: fixed;
  z-index: 100;
  inset: 0;
}

.site-overlay__backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  padding: 0;
  background: rgb(7 10 42 / 58%);
  border: 0;
  cursor: pointer;
}

.search-panel,
.menu-drawer,
.subscribe-panel {
  position: absolute;
  z-index: 1;
  background: #fff;
  box-shadow: var(--shadow-panel);
}

.search-panel {
  inset-block-start: clamp(1rem, 7vh, 4rem);
  inset-inline-start: 50%;
  inline-size: min(calc(100% - 2rem), 52rem);
  max-block-size: calc(100dvh - 2rem);
  padding: clamp(1.25rem, 3vw, 2rem);
  overflow-y: auto;
  border-radius: var(--radius-panel);
  transform: translateX(-50%);
}

.search-panel__header,
.menu-drawer__header,
.subscribe-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

.search-panel h2,
.menu-drawer h2,
.subscribe-panel h2 {
  margin: 0;
  font-size: var(--type-subsection-title-size);
  line-height: var(--type-subsection-title-line-height);
}

.search-form {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-block-start: var(--space-5);
}

.search-form__icon {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 1rem;
  color: #6d7189;
  transform: translateY(-50%);
  pointer-events: none;
}

.search-form input {
  min-inline-size: 0;
  min-block-size: 3.25rem;
  padding: 0.75rem 1rem 0.75rem 2.8rem;
  color: var(--color-text);
  background: #f7f7fb;
  border: 1px solid var(--color-border);
  border-start-start-radius: var(--radius-control);
  border-end-start-radius: var(--radius-control);
}

.search-form .button {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}

.search-suggestions {
  display: grid;
  margin-block-start: var(--space-2);
  gap: var(--space-5);
}

.search-suggestions h3 {
  margin: 0 0 var(--space-3);
  font-size: var(--type-eyebrow-size);
  font-weight: var(--type-weight-bold);
  letter-spacing: var(--type-eyebrow-tracking);
  line-height: var(--type-eyebrow-line-height);
  text-transform: uppercase;
}

.search-suggestions ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.search-suggestions__link {
  display: inline-flex;
  min-block-size: 2.5rem;
  align-items: center;
  padding-inline: 0.9rem;
  gap: 0.35rem;
  color: var(--category-accent-dark, var(--color-brand-blue));
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  background: var(--category-surface, #f0efff);
  border-radius: var(--radius-pill);
}

.search-suggestions__group--software ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.search-popular,
.search-result {
  display: flex;
  min-inline-size: 0;
  min-block-size: 3.6rem;
  align-items: center;
  padding: 0.55rem 0.65rem;
  gap: 0.7rem;
  color: var(--color-text);
  text-decoration: none;
  background: #fafafe;
  border: 1px solid #ececf4;
  border-radius: var(--radius-control);
}

.search-popular__media,
.search-result__media {
  display: grid;
  flex: 0 0 2.35rem;
  inline-size: 2.35rem;
  block-size: 2.35rem;
  overflow: hidden;
  color: var(--color-brand-blue);
  font-size: 0.72rem;
  font-weight: 700;
  background: #eceaff;
  border-radius: 0.5rem;
  place-items: center;
}

.search-popular .search-popular__media img,
.search-result .search-result__media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
}

.search-popular > span:last-child,
.search-result__copy {
  display: grid;
  min-inline-size: 0;
  gap: 0.15rem;
}

.search-popular strong,
.search-result strong {
  overflow: hidden;
  font-size: 0.85rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-popular small,
.search-result small {
  overflow: hidden;
  color: var(--color-text-muted);
  font-size: 0.7rem;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-suggestions__link:hover,
.search-suggestions__link:focus-visible,
.search-popular:hover,
.search-popular:focus-visible,
.search-result:hover,
.search-result:focus-visible,
.search-result.is-active {
  color: var(--category-accent-dark, var(--color-brand-blue));
  background: var(--category-surface, #f4f3ff);
}

.search-panel__status {
  min-block-size: 1.25rem;
  margin: 0.7rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.75rem;
}

.search-panel__status[data-state="loading"]::before {
  display: inline-block;
  inline-size: 0.75rem;
  block-size: 0.75rem;
  margin-inline-end: 0.4rem;
  border: 0.12rem solid #d8d8e8;
  border-block-start-color: var(--color-brand-blue);
  border-radius: 50%;
  content: "";
  animation: exploripo-search-spin 0.65s linear infinite;
}

.search-panel__status[data-state="error"] {
  color: var(--color-error);
}

[data-search-results] {
  margin-block-start: var(--space-2);
}

[data-search-results] ul,
.search-page__results {
  display: grid;
  padding: 0;
  margin: 0;
  gap: 0.5rem;
  list-style: none;
}

.search-result__type {
  margin-inline-start: auto;
  color: var(--color-text-muted);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.subscribe-panel {
  inset-block-start: 50%;
  inset-inline-start: 50%;
  inline-size: min(calc(100% - 2rem), 34rem);
  padding: clamp(1.25rem, 3vw, 2rem);
  border-radius: var(--radius-panel);
  transform: translate(-50%, -50%);
}

.subscribe-panel > p {
  margin: 0.75rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.85rem;
  line-height: 1.55;
}

.subscribe-panel__form {
  display: grid;
  margin-block-start: var(--space-5);
  gap: 0.55rem;
}

.subscribe-panel__form label {
  font-size: 0.78rem;
  font-weight: 700;
}

.subscribe-panel__form input {
  inline-size: 100%;
  min-block-size: 3rem;
  padding: 0.7rem 0.9rem;
  color: var(--color-text);
  background: #f8f8fc;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
}

.subscribe-panel__form .button {
  justify-self: start;
  min-inline-size: 8rem;
}

.subscribe-panel__submit {
  color: #fff;
  background: linear-gradient(105deg, var(--color-brand-orange), #ff3a12);
  box-shadow: 0 0.45rem 1rem rgb(3 7 35 / 18%);
}

.subscribe-panel__submit:hover {
  background: linear-gradient(105deg, #ff671f, var(--color-brand-orange));
  box-shadow: 0 0.55rem 1.15rem rgb(3 7 35 / 22%);
}

.subscribe-panel__status {
  margin: 0.3rem 0 0;
  color: var(--color-text-muted);
  font-size: 0.72rem;
  line-height: 1.45;
}

.subscribe-panel__status[data-state="success"] {
  color: #08765a;
}

.subscribe-panel__status[data-state="error"] {
  color: #a52323;
}

.no-js-search-link {
  display: inline-flex;
  align-items: center;
  min-block-size: 2.75rem;
  padding-inline: 0.7rem;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: none;
}

.search-page {
  min-block-size: 55vh;
  padding-block: clamp(2rem, 6vw, 5rem);
}

.search-page__header {
  max-inline-size: 52rem;
}

.search-page__header h1 {
  margin: 0;
  font-size: var(--type-page-title-size);
  letter-spacing: var(--type-page-title-tracking);
  line-height: var(--type-page-title-line-height);
}

.search-page__header p {
  margin: 0.65rem 0 0;
  color: var(--color-text-muted);
}

.search-page .search-form {
  max-inline-size: 52rem;
  margin-block: 1.5rem 2rem;
}

.search-page__results {
  max-inline-size: 52rem;
}

.search-page__empty {
  color: var(--color-text-muted);
}

@keyframes exploripo-search-spin {
  to {
    transform: rotate(1turn);
  }
}

.menu-drawer {
  inset-block: 0;
  inset-inline-end: 0;
  inline-size: min(88vw, 24rem);
  padding: 1.25rem;
  overflow-y: auto;
}

.menu-drawer__navigation {
  margin-block: 1.5rem;
}

.menu-drawer__navigation > ul {
  display: grid;
  gap: var(--space-2);
}

.menu-drawer__link.header-navigation__link {
  display: flex;
  align-items: center;
  min-block-size: 3rem;
  padding-inline: 0.75rem;
  font-size: var(--type-control-size);
  text-decoration: none;
}

.menu-drawer__subscribe {
  inline-size: 100%;
  min-block-size: 3rem;
}

.no-js .mobile-menu-trigger,
.no-js .mobile-search-trigger,
.no-js .header-search-trigger {
  display: none;
}

@media (width >= 75rem) {
  :root {
    --homepage-shelf-card-size: clamp(18rem, calc(11.7rem + 7vw), 23.25rem);
  }

  .brand-principles {
    margin-inline-start: 1rem;
  }

  .site-brand-lockup {
    inset-block-start: 0.1875rem;
  }

  .brand-principle {
    flex: 1 1 0;
    justify-content: center;
    padding-inline: 1.35rem;
  }
}

@media (width >= 100rem) {
  :root {
    --container-max: clamp(
      80rem,
      calc(48rem + 35vw),
      var(--container-max-large)
    );
  }
}

@media (width < 75rem) {
  :root {
    --site-header-logo-width: 15.2rem;
    --site-header-compact-logo-width: 13.875rem;
  }

  .site-brand-lockup {
    flex-basis: 14.75rem;
    inline-size: 14.75rem;
    block-size: 4.75rem;
  }

  .site-brand-lockup .site-logo {
    block-size: 4.75rem;
  }

  .site-logo img {
    inline-size: var(--site-header-logo-width);
  }

  .site-brand-tagline {
    display: none;
  }

  .brand-principle {
    padding-inline: 0.6rem;
  }

  .brand-principle__icon {
    flex-basis: 1.75rem;
    inline-size: 1.75rem;
  }

  .header-search-trigger {
    min-inline-size: 3rem;
    inline-size: 3rem;
    padding: 0;
    justify-content: center;
  }

  .header-search-trigger__label {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  .trust-card {
    padding-inline: 0.9rem;
    gap: 0.55rem;
  }

  .trust-card__icon {
    inline-size: 2.1rem;
    block-size: 2.1rem;
  }
}

@media (64rem <= width < 75rem) {
  :root {
    --homepage-shelf-card-min-height: 16rem;
  }

  .site-header__primary {
    display: grid;
    grid-template-columns:
      clamp(15.2rem, 23vw, 17rem) repeat(3, minmax(0, 1fr))
      auto auto;
    column-gap: clamp(0.75rem, 1.2vw, 1rem);
  }

  .site-brand-lockup {
    inline-size: 100%;
    flex-basis: auto;
  }

  .brand-principles,
  .site-header__actions {
    display: contents;
  }

  .brand-principles {
    margin-inline-start: 0;
  }

  .brand-principle {
    justify-content: center;
    padding-inline: clamp(0.25rem, 0.6vw, 0.45rem);
    gap: 0.375rem;
    font-size: clamp(0.73rem, 1.05vw, 0.82rem);
  }

  .brand-principle__icon {
    flex-basis: 1.5rem;
    inline-size: 1.5rem;
    block-size: 1.5rem;
  }

  .brand-principle__icon svg {
    inline-size: 1.45rem;
    block-size: 1.45rem;
  }

  .site-header__actions {
    gap: 0.5rem;
  }

  .header-subscribe {
    min-inline-size: 5.25rem;
    padding-inline: 0.8rem;
  }

  .category-bar__inner {
    gap: var(--space-4);
  }
}

@media (75rem <= width < 90rem) {
  :root {
    --site-header-logo-width: clamp(17.25rem, 22vw, 20rem);
    --site-header-compact-logo-width: clamp(14.75rem, 19vw, 17.25rem);
  }

  .site-brand-lockup {
    flex-basis: clamp(16.75rem, 21.5vw, 19.5rem);
    inline-size: clamp(16.75rem, 21.5vw, 19.5rem);
  }

  .brand-principle {
    padding-inline: clamp(0.8rem, 1.2vw, 1.35rem);
  }
}

@media (width < 64rem) {
  :root {
    --header-height: 4.75rem;
    --site-header-category-height: 0rem;
    --homepage-shelf-card-min-height: 16rem;
  }

  .brand-principles,
  .header-search-trigger,
  .header-subscribe,
  .compare-navigation {
    display: none;
  }

  .js .category-bar {
    display: none;
  }

  .site-header__primary {
    justify-content: space-between;
  }

  .homepage-newsletter {
    grid-template-columns: minmax(14rem, 0.9fr) minmax(22rem, 1.1fr);
    padding-inline: 1.5rem;
    gap: 1.5rem;
  }

  .site-footer__inner {
    grid-template-columns: minmax(13rem, 15rem) minmax(0, 1fr);
    gap: 1rem 1.5rem;
  }

  .site-footer__navigation ul {
    justify-content: flex-start;
  }

  .site-brand-lockup {
    flex-basis: clamp(10.25rem, 26vw, 14rem);
    inline-size: clamp(10.25rem, 26vw, 14rem);
    block-size: 3.75rem;
  }

  .site-brand-lockup .site-logo {
    block-size: 3.75rem;
  }

  .site-logo img {
    inline-size: clamp(10.45rem, 26.3vw, 14.2rem);
  }

  .site-header__actions {
    gap: 0.25rem;
  }

  .mobile-search-trigger,
  .mobile-menu-trigger {
    display: inline-flex;
  }

  .no-js .category-bar__inner {
    min-block-size: 4rem;
    flex-wrap: wrap;
    padding-block: var(--space-3);
  }

  .no-js .category-menu__panel {
    position: static;
    inline-size: 100%;
    margin-block: var(--space-2);
  }

  .no-js .category-menu__list {
    grid-template-columns: 1fr;
  }

  .no-js .header-navigation {
    flex-wrap: wrap;
    margin-inline-start: 0;
  }

  .tool-month {
    inline-size: calc(100% - (2 * var(--container-gutter)));
    margin-block-start: 1rem;
    margin-inline: auto;
    border-radius: var(--radius-panel);
  }

  .tool-month__inner {
    display: block;
    inline-size: 100%;
    min-block-size: 0;
  }

  .tool-month__content {
    max-inline-size: 42rem;
    padding: 1.4rem 1.5rem 1.6rem;
  }

  .tool-month__offer-row {
    display: block;
  }

  .tool-month__actions {
    margin-block-start: 0.75rem;
  }

  .tool-month__visual-space {
    display: none;
  }

  .trust-strip {
    margin-block-start: 0.8rem;
  }

  .trust-strip__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .trust-card {
    min-block-size: 5.25rem;
  }

  .category-shelves {
    padding-block: 1.75rem 2rem;
  }

  .category-shelf + .category-shelf {
    margin-block-start: 1rem;
  }

  .category-shelf__header {
    align-items: center;
    margin-block-end: 0.65rem;
  }

  .category-shelf__intro {
    max-inline-size: min(100%, 56rem);
    margin-inline-start: 0;
  }

  .software-rail {
    padding-inline-end: 1rem;
    gap: 0.75rem;
  }

  .software-card {
    flex-basis: clamp(15.5rem, 76%, 20rem);
  }

  .software-rail__control--previous {
    display: none;
  }

  .software-rail__control--next {
    inset-inline-end: -0.25rem;
  }
}

@media (48rem <= width < 64rem) {
  .site-brand-lockup .site-logo img {
    inline-size: 100%;
  }

  .site-header__actions {
    gap: var(--space-3);
  }

  .mobile-search-trigger,
  .mobile-menu-trigger {
    inline-size: 3rem;
    block-size: 3rem;
  }
}

@media (width < 48rem) {
  :root {
    --category-directory-card-height: 24rem;
    --type-homepage-shelf-title-size: 1.2rem;
    --type-section-title-compact-size: 1.2rem;
  }

  .review-methodology {
    padding: 0.85rem 0.75rem 1rem;
  }

  .review-methodology__header {
    align-items: center;
    margin-block-end: 0.55rem;
    gap: 0.25rem;
  }

  .review-methodology__header h2 {
    font-size: var(--type-subsection-title-size);
    white-space: nowrap;
  }

  .review-methodology__learn-more {
    min-inline-size: 0;
    font-size: 0.68rem;
    text-align: end;
  }

  .review-steps {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.35rem;
  }

  .review-step__content {
    grid-template-columns: auto minmax(0, 1fr);
    min-block-size: 4.25rem;
    padding: 0.55rem 0.75rem;
    gap: 0.65rem;
  }

  .review-step__icon {
    inline-size: 2.5rem;
    block-size: 2.5rem;
  }

  .review-step__icon svg {
    inline-size: 1.45rem;
    block-size: 1.45rem;
  }

  .review-step__title {
    font-size: 0.78rem;
  }

  .review-step__description {
    font-size: 0.7rem;
  }

  .review-step__connector {
    display: none;
  }

  .homepage-newsletter {
    display: block;
    padding: 1.15rem 1.25rem 1.25rem;
  }

  .homepage-newsletter__copy h2 {
    font-size: var(--type-subsection-title-size);
  }

  .homepage-newsletter__copy p {
    margin-block-start: 0.45rem;
    font-size: 0.76rem;
  }

  .homepage-newsletter__form {
    grid-template-columns: minmax(0, 1fr);
    margin-block-start: 0.9rem;
    gap: 0.55rem;
  }

  .homepage-newsletter__form input,
  .homepage-newsletter__submit {
    inline-size: 100%;
    min-block-size: 3.1rem;
  }

  .site-footer {
    padding-block: 0.65rem 1.5rem;
  }

  .site-footer__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .site-footer__brand {
    min-block-size: 5.5rem;
  }

  .site-logo.site-logo--footer {
    flex-basis: 10.5rem;
    inline-size: 10.5rem;
    block-size: 2.625rem;
  }

  .site-footer__content {
    padding-block-start: 0;
  }

  .site-footer__navigation ul {
    gap: 0.55rem 1.2rem;
  }

  .site-footer__navigation a,
  .site-footer__control,
  .site-footer__pending {
    font-size: var(--type-small-size);
  }

  .site-footer__disclosure {
    margin-block-start: 0.8rem;
    font-size: var(--type-small-size);
  }

  .consent-notice {
    inset-block-end: 0.75rem;
    grid-template-columns: minmax(0, 1fr);
    inline-size: calc(100% - 1.5rem);
    max-block-size: calc(100dvh - 1.5rem);
    padding: 1rem;
    overflow-y: auto;
    gap: 0.85rem;
  }

  .consent-notice__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .consent-notice__actions .consent-button {
    min-inline-size: 0;
    padding-inline: 0.7rem;
  }

  .consent-notice__actions .consent-link-button {
    grid-column: 1 / -1;
  }

  .consent-dialog {
    inline-size: calc(100% - 1rem);
    max-block-size: calc(100dvh - 1rem);
  }

  .consent-dialog__header,
  .consent-categories {
    padding-inline: 1rem;
  }

  .consent-dialog__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding: 0 1rem 1rem;
  }

  .consent-dialog__policy {
    padding-inline: 1rem;
    text-align: start;
  }

  .consent-dialog__actions .consent-button {
    inline-size: 100%;
    min-inline-size: 0;
  }
}

@media (width < 23rem) {
  .review-methodology__header {
    flex-wrap: wrap;
  }

  .review-methodology__learn-more {
    margin-inline-start: auto;
  }
}

@media (width <= 35rem) {
  :root {
    --type-display-size: 2.35rem;
    --type-product-title-size: clamp(2rem, 10vw, 2.65rem);
  }

  .software-card--illustrated.software-card--writing {
    --merchandising-card-teaser-lines: 4;
    --software-card-description-reserve: 5.4em;
    --software-card-price-reserve: 5.4em;
    --software-card-best-for-reserve: 5em;

    block-size: 26.35rem;
    min-block-size: 26.35rem;
  }

  .tool-month__content {
    padding: 1.15rem 1.25rem 1.25rem;
  }

  .tool-month h1 {
    font-size: var(--type-display-size);
  }

  .tool-month__description {
    margin-block: 0.55rem 0.8rem;
    font-size: 0.95rem;
    line-height: 1.48;
  }

  .tool-month__facts {
    gap: 0.6rem;
    font-size: 0.88rem;
  }

  .tool-month__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-block-start: 0.8rem;
  }

  .tool-month__actions .button {
    min-inline-size: 0;
    padding-inline: 0.75rem;
  }

  .trust-strip__grid {
    gap: 0.6rem;
  }

  .trust-card {
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-block-size: 5.2rem;
    padding: 0.65rem 0.5rem;
    gap: 0.25rem;
  }

  .trust-card__value {
    font-size: 1.85rem;
  }

  .trust-card__copy h3 {
    font-size: 0.7rem;
    line-height: 1.15;
  }

  .trust-card__copy p {
    font-size: 0.6rem;
    line-height: 1.25;
  }

  .trust-card__icon {
    inline-size: 1.4rem;
    block-size: 1.4rem;
  }

  .trust-card__icon svg {
    inline-size: 0.8rem;
    block-size: 0.8rem;
  }

  .trust-card__seal {
    inline-size: 1.4rem;
    block-size: 1.4rem;
  }

  .trust-card__date {
    font-size: 0.86rem;
  }

  .category-shelf__header {
    gap: 0.65rem;
  }

  .category-shelf__heading-group {
    gap: 0.5rem;
  }

  .category-shelf__heading-icon {
    flex-basis: 1.5rem;
    inline-size: 1.5rem;
    block-size: 1.5rem;
  }

  .category-shelf__heading-icon svg {
    inline-size: 1.15rem;
    block-size: 1.15rem;
  }

  .category-shelf__header h2 {
    font-size: var(--type-homepage-shelf-title-size);
  }

  .category-shelf__intro {
    max-inline-size: 34rem;
    margin: 0.55rem 0 0.75rem;
    font-size: 0.8rem;
    line-height: 1.58;
  }

  .category-shelf__see-all {
    min-block-size: 2.3rem;
    padding-inline: 0.7rem;
    font-size: 0.7rem;
    border-width: 1.5px;
  }

  .category-shelf__see-all svg {
    inline-size: 0.85rem;
    block-size: 0.85rem;
  }

  .software-card__link {
    --software-card-link-padding-block-start: 0.85rem;
    --software-card-link-padding-inline: 0.9rem;
    --software-card-link-padding-block-end: 0.8rem;
  }

  .software-card--illustrated .merchandising-card__illustration {
    block-size: 6.5rem;
  }

  .card-actions--homepage {
    padding-inline: 0.9rem;
  }

  .software-card__description {
    font-size: 0.75rem;
  }

  .search-panel {
    inset-block-start: 0;
    inline-size: 100%;
    max-block-size: 100dvh;
    border-start-start-radius: 0;
    border-start-end-radius: 0;
  }

  .search-form {
    grid-template-columns: 1fr;
    gap: 0.65rem;
  }

  .search-form input,
  .search-form .button {
    border-radius: var(--radius-control);
  }

  .search-form .button {
    inline-size: 100%;
  }

  .search-form__icon {
    inset-block-start: 1.625rem;
  }

  .search-suggestions__group--software ul {
    grid-template-columns: minmax(0, 1fr);
  }

  .subscribe-panel {
    inset-block: auto 0;
    inline-size: 100%;
    border-end-start-radius: 0;
    border-end-end-radius: 0;
    transform: translateX(-50%);
  }

  .subscribe-panel__form .button {
    inline-size: 100%;
  }
}

.software-card:hover h3,
.software-card__link:focus-visible h3 {
  color: var(--category-accent);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after,
  .category-menu::details-content {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}