.content-page {
  overflow-x: clip;
}

.content-hero {
  position: relative;

  padding-block: var(--space-13);

  background: var(--color-off-white);

  overflow: hidden;
}

.content-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);

  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.content-hero__content {
  max-width: 640px;
}

.content-hero__eyebrow {
  margin-bottom: var(--space-4);
}

.content-hero__title {
  font-family: var(--font-serif);
  font-size: clamp(3rem, 5.4vw, 5.25rem);
  font-weight: var(--font-weight-regular);
  line-height: 0.96;
  letter-spacing: -0.05em;

  color: var(--color-text);
}

.content-hero__description {
  max-width: 600px;

  margin-top: var(--space-5);

  font-size: var(--font-size-lg);
  line-height: 1.72;

  color: var(--color-text-secondary);
}

.content-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);

  margin-top: var(--space-7);
}

.content-hero__media {
  position: relative;

  aspect-ratio: 1.08 / 1;
  min-height: 500px;

  overflow: hidden;

  background: var(--color-sage);

  border-radius: var(--radius-2xl);
}

.content-hero__image {
  position: absolute;
  inset: 0;

  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;
}

.content-hero__floating-card {
  position: absolute;
  right: var(--space-5);
  bottom: var(--space-5);

  max-width: 250px;

  padding: var(--space-4);

  background: rgba(255, 255, 255, 0.94);

  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: var(--radius-lg);

  box-shadow: var(--shadow-sm);
}

.content-hero__floating-label {
  display: block;

  font-size: 0.625rem;
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.09em;
  text-transform: uppercase;

  color: var(--color-primary);
}

.content-hero__floating-text {
  display: block;

  margin-top: 5px;

  font-size: var(--font-size-sm);
  line-height: 1.5;

  color: var(--color-text);
}




.anatomy-section {
  padding-block: var(--space-15);

  background: var(--color-off-white);
}

.anatomy-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.anatomy-section__header {
  max-width: 760px;

  margin: 0 auto var(--space-10);

  text-align: center;
}

.anatomy-visual {
  position: relative;

  min-height: 720px;

  padding: var(--space-8);

  background: var(--color-off-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-2xl);

  overflow: hidden;
}

.anatomy-visual__person {
  position: absolute;
  top: 50%;
  left: 50%;

  width: min(48%, 540px);
  max-height: 92%;

  object-fit: contain;

  transform: translate(-50%, -50%);
}

.anatomy-visual__spine {
  position: absolute;
  top: 50%;
  left: 50%;

  width: min(20%, 200px);

  transform: translate(-50%, -50%);

  opacity: 0.35;

  pointer-events: none;
}

.anatomy-callout {
  position: absolute;

  display: flex;
  align-items: center;
  gap: var(--space-3);

  max-width: 240px;
}

.anatomy-callout--left {
  flex-direction: row-reverse;

  text-align: right;
}

.anatomy-callout--shoulder {
  top: 21%;
  left: 4%;
}

.anatomy-callout--upper-back {
  top: 43%;
  left: 2%;
}

.anatomy-callout--tension {
  top: 22%;
  right: 4%;
}

.anatomy-callout--movement {
  top: 47%;
  right: 2%;
}

.anatomy-callout--breathable {
  right: 7%;
  bottom: 15%;
}

.anatomy-callout__content {
  min-width: 0;
}

.anatomy-callout__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  line-height: 1.3;

  color: var(--color-text);
}

.anatomy-callout__text {
  margin-top: 3px;

  font-size: var(--font-size-xs);
  line-height: 1.5;

  color: var(--color-text-secondary);
}

.anatomy-callout__line {
  width: clamp(46px, 6vw, 88px);
  height: 1px;

  flex: 0 0 auto;

  background: var(--color-primary);

  opacity: 0.6;
}

.anatomy-callout__dot {
  width: 8px;
  height: 8px;

  flex: 0 0 8px;

  background: var(--color-primary);

  border: 2px solid var(--color-white);
  border-radius: 50%;

  box-shadow: 0 0 0 1px var(--color-primary);
}




.support-tabs {
  padding-block: var(--space-15);

  background: var(--color-sage);
}

.support-tabs__inner {
  width: min(
    calc(100% - 24px),
    1480px
  );

  margin-inline: auto;
}

.support-tabs__header {
  max-width: none;

  margin-bottom: var(--space-8);
}

.support-tabs .section__title,
.measure-section__title {
  white-space: nowrap;
}

.support-tabs__tablist {
  margin-bottom: var(--space-7);
}

.support-tabs__panel {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(460px, 0.85fr);
  align-items: stretch;

  min-height: auto;

  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-2xl);

  overflow: hidden;
}

.support-tabs__panel.is-active {
  margin-top: -24px;
}

.support-tabs__media {
  position: relative;

  min-height: auto;

  background: var(--color-white);

  overflow: hidden;
}

.support-tabs__image {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: contain;
}

.support-tabs__image[data-parallax],
.measure-section__image[data-parallax] {
  transform-origin: center;
  will-change: transform;
}

.support-tabs__content {
  position: relative;

  display: flex;
  flex-direction: column;
  justify-content: center;

  padding: clamp(1.25rem, 2vw, 2rem) clamp(3.75rem, 5vw, 4.75rem) clamp(1.25rem, 2vw, 2rem) clamp(1.25rem, 2vw, 2rem);
}

.support-tabs__number {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);

  display: flex;
  align-items: center;
  justify-content: center;

  width: 38px;
  height: 38px;

  color: var(--color-primary);
  background: var(--color-sage);

  border-radius: 50%;
}

.support-tabs__number svg,
.support-tabs__number [data-lucide] {
  width: 17px;
  height: 17px;
  stroke-width: 1.7;
}

.support-tabs__title {
  max-width: none;

  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 1.9vw, 1.95rem);
  font-weight: var(--font-weight-regular);
  line-height: 1.08;
  letter-spacing: 0;
  white-space: nowrap;
}

.support-tabs__text {
  margin-top: var(--space-3);

  font-size: var(--font-size-sm);
  line-height: 1.55;

  color: var(--color-text-secondary);
}

.support-tabs__benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);

  margin-top: var(--space-4);

  list-style: none;
}

.support-tabs__benefit {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);

  font-size: var(--font-size-xs);
  line-height: 1.4;

  color: var(--color-text);
}

.support-tabs__benefit-icon {
  width: 17px;
  height: 17px;

  flex: 0 0 17px;

  margin-top: 2px;

  color: var(--color-primary);

  stroke-width: 1.8;
}




.how-steps {
  padding-block: var(--space-15);

  color: var(--color-white);
  background: var(--color-primary);
}

.how-steps__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.how-steps__header {
  max-width: 720px;

  margin-bottom: var(--space-10);
}

.how-steps__header .section__title {
  color: var(--color-white);
}

.how-steps__header .section__description {
  color: rgba(255, 255, 255, 0.7);
}

.how-steps__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));

  border-top: 1px solid rgba(255, 255, 255, 0.18);
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.how-step {
  position: relative;

  min-height: 310px;

  padding: var(--space-7) var(--space-6);
}

.how-step:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.18);
}

.how-step__number {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 42px;
  height: 42px;

  color: var(--color-sage);
  background: rgba(255, 255, 255, 0.1);

  border-radius: 50%;
}

.how-step__number svg,
.how-step__number [data-lucide] {
  width: 18px;
  height: 18px;
  stroke-width: 1.7;
}

.how-step__icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 48px;
  height: 48px;

  margin-top: var(--space-8);

  color: var(--color-primary);
  background: var(--color-white);

  border-radius: 50%;
}

.how-step__icon svg,
.how-step__icon [data-lucide] {
  width: 21px;
  height: 21px;

  stroke-width: 1.5;
}

.how-step__title {
  margin-top: var(--space-5);

  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
}

.how-step__text {
  margin-top: var(--space-3);

  font-size: var(--font-size-sm);
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.68);
}




.support-zones {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.support-zones__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.support-zones__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);

  margin-top: var(--space-9);
}

.support-zones .support-zone,
.fit-rules .fit-rule,
.fit-tips .fit-tip-card {
  position: relative;
  isolation: isolate;

  min-height: 314px;
  overflow: visible;
  padding: 0;

  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-xs);
  box-shadow: 0 2px 0 rgba(19, 35, 29, 0.08);

  cursor: pointer;
  perspective: 1000px;

  transition:
    box-shadow var(--transition-base),
    opacity var(--transition-base),
    transform var(--transition-base);
}

.support-zones .support-zone:focus-visible,
.fit-rules .fit-rule:focus-visible,
.fit-tips .fit-tip-card:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 4px;
}

.support-zones .support-zone::before,
.fit-rules .fit-rule::before,
.fit-tips .fit-tip-card::before {
  content: "";

  display: block;

  aspect-ratio: 4 / 3;

  background-color: var(--color-sage);
  background-image: var(--card-image);
  background-position: var(--card-position, center);
  background-size: cover;
}

.fit-rules .fit-rule::before {
  background-repeat: no-repeat;
  background-size: contain;
}

.support-zones__grid.is-showing .support-zone,
.fit-rules__grid.is-showing .fit-rule,
.fit-tips__grid.is-showing .fit-tip-card {
  opacity: 0.64;
  transform: scale(0.92);
}

.support-zones__grid.is-showing .support-zone:hover,
.fit-rules__grid.is-showing .fit-rule:hover,
.fit-tips__grid.is-showing .fit-tip-card:hover {
  opacity: 0.9;
  transform: scale(0.95);
}

.support-zones .support-zone.is-open,
.fit-rules .fit-rule.is-open,
.fit-tips .fit-tip-card.is-open {
  z-index: 5;

  opacity: 1;
  box-shadow: var(--shadow-md);
  transform: scale(1);
}

.support-zone:nth-child(1) {
  --card-image: url("../images/cards/posture-support-zones.webp");
}

.support-zone:nth-child(2) {
  --card-image: url("../images/cards/posture-fit-rules.webp");
}

.support-zone:nth-child(3) {
  --card-image: url("../images/aligna-black-back.jpg");
}

.support-zone:nth-child(4) {
  --card-image: url("../images/lifestyle-shoulder-alignment.jpg");
}

.support-zone:nth-child(2) {
  --card-position: 58% center;
}

.support-zone:nth-child(3) {
  --card-position: 43% center;
}

.support-zone:nth-child(4) {
  --card-position: 70% center;
}

.fit-rule:nth-child(1) {
  --card-image: url("../images/card-1.jpg");
}

.fit-rule:nth-child(2) {
  --card-image: url("../images/card-2.jpg");
}

.fit-rule:nth-child(3) {
  --card-image: url("../images/card-3.jpg");
}

.fit-rule:nth-child(4) {
  --card-image: url("../images/card-4.jpg");
}

.fit-rule:nth-child(2) {
  --card-position: 34% center;
}

.fit-rule:nth-child(3) {
  --card-position: 62% center;
}

.fit-rule:nth-child(4) {
  --card-position: 76% center;
}

.fit-tip-card:nth-child(1),
.fit-tip-card:nth-child(3) {
  --card-image: url("../images/cards/posture-fit-tips.webp");
}

.fit-tip-card:nth-child(2) {
  --card-image: url("../images/cards/posture-support-zones.webp");
  --card-position: 62% center;
}

.support-zone__diagram,
.fit-rule__icon,
.fit-tip-card__number {
  position: absolute;
  top: var(--space-4);
  left: var(--space-4);

  display: flex;
  align-items: center;
  justify-content: center;

  width: 40px;
  height: 40px;

  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.88);

  border: 0;
  border-radius: 50%;
  box-shadow: 0 8px 24px rgba(19, 35, 29, 0.12);
  backdrop-filter: blur(8px);

  transition:
    background-color var(--transition-fast),
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.support-zone__diagram svg,
.support-zone__diagram [data-lucide],
.fit-rule__icon svg,
.fit-rule__icon [data-lucide],
.fit-tip-card__number svg,
.fit-tip-card__number [data-lucide] {
  width: 20px;
  height: 20px;

  stroke-width: 1.8;
}

.support-zone__title::after,
.fit-rule__title::after,
.fit-tip-card__title::after {
  content: "";

  position: absolute;
  top: 50%;
  right: var(--space-5);

  width: 42px;
  height: 42px;

  background: var(--color-primary);

  border-radius: 50%;
  box-shadow: 0 3px 0 rgba(19, 35, 29, 0.2);

  transform: translateY(-50%);
  transition:
    background-color var(--transition-fast),
    transform var(--transition-fast),
    box-shadow var(--transition-fast);
}

.support-zone__title::before,
.fit-rule__title::before,
.fit-tip-card__title::before {
  content: "";

  position: absolute;
  top: calc(50% - 3px);
  right: calc(var(--space-5) + 14px);
  z-index: 2;

  width: 14px;
  height: 14px;

  border-right: 3px solid var(--color-white);
  border-bottom: 3px solid var(--color-white);

  transform: translateY(-50%) rotate(45deg);
  transform-origin: center;
  transition: transform var(--transition-fast);
}

.support-zone.is-open .support-zone__diagram,
.fit-rule.is-open .fit-rule__icon,
.fit-tip-card.is-open .fit-tip-card__number {
  background: var(--color-white);
  transform: translateY(-1px);
}

.support-zone.is-open .support-zone__title::after,
.fit-rule.is-open .fit-rule__title::after,
.fit-tip-card.is-open .fit-tip-card__title::after {
  background: var(--color-warning);
  box-shadow: 0 2px 0 rgba(19, 35, 29, 0.15);
  transform: translateY(calc(-50% + 1px));
}

.support-zone.is-open .support-zone__title::before,
.fit-rule.is-open .fit-rule__title::before,
.fit-tip-card.is-open .fit-tip-card__title::before {
  transform: translateY(calc(-50% + 5px)) rotate(225deg);
}

.support-zone__title,
.fit-rule__title,
.fit-tip-card__title {
  position: relative;

  max-width: none;
  min-height: 54px;
  margin: 0;
  padding: var(--space-4) calc(var(--space-10) + var(--space-3)) var(--space-4) var(--space-5);

  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  line-height: 1.25;
}

.support-zone__text,
.fit-rule__text,
.fit-tip-card__text {
  position: relative;

  max-height: 0;
  margin: 0;
  overflow: hidden;
  padding: 0 var(--space-5);

  font-size: var(--font-size-sm);
  line-height: 1.55;

  background: var(--color-white);
  color: var(--color-text-secondary);

  transform: rotateX(-90deg);
  transform-origin: top;

  transition:
    max-height var(--transition-base),
    padding var(--transition-base),
    transform var(--transition-base);
}

.support-zone.is-open .support-zone__text,
.fit-rule.is-open .fit-rule__text,
.fit-tip-card.is-open .fit-tip-card__text {
  max-height: 180px;
  padding-block: 0 var(--space-5);

  transform: rotateX(0deg);
}




.exploded-view {
  padding-block: var(--space-15);

  background: var(--color-off-white);
}

.exploded-view__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);

  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.exploded-view__content {
  max-width: 500px;
}

.exploded-view__title {
  margin-top: var(--space-4);

  font-family: var(--font-serif);
  font-size: clamp(2.5rem, 4.5vw, 4.2rem);
  font-weight: var(--font-weight-regular);
  line-height: 1;
  letter-spacing: -0.045em;
}

.exploded-view__text {
  margin-top: var(--space-5);

  line-height: 1.75;

  color: var(--color-text-secondary);
}

.exploded-view__list {
  display: grid;
  gap: var(--space-4);

  margin-top: var(--space-7);

  list-style: none;
}

.exploded-view__item {
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: start;
  gap: var(--space-3);
}

.exploded-view__item-number {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 34px;
  height: 34px;

  color: var(--color-primary);
  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: 50%;
}

.exploded-view__item-number svg,
.exploded-view__item-number [data-lucide] {
  width: 16px;
  height: 16px;
  stroke-width: 1.7;
}

.exploded-view__item-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  line-height: 1.35;
}

.exploded-view__item-text {
  margin-top: 2px;

  font-size: var(--font-size-xs);
  line-height: 1.55;

  color: var(--color-text-secondary);
}

.exploded-view__visual {
  position: relative;

  min-height: 620px;

  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-2xl);

  overflow: hidden;
}

.exploded-view__image {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;
}




.dark-features {
  padding-block: var(--space-15);

  color: var(--color-white);
  background: var(--color-primary);
}

.dark-features__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.dark-features__header {
  max-width: 740px;

  margin-bottom: var(--space-9);
}

.dark-features__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.dark-feature-card {
  position: relative;

  display: flex;
  flex-direction: column;

  min-height: 530px;

  background: rgba(255, 255, 255, 0.06);

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius-xl);

  overflow: hidden;

  transition:
    transform var(--transition-base),
    background-color var(--transition-base),
    border-color var(--transition-base);
}

.dark-feature-card:hover {
  transform: translateY(-4px);

  background: rgba(255, 255, 255, 0.085);
  border-color: rgba(255, 255, 255, 0.22);
}

.dark-feature-card__body {
  padding: var(--space-6);
}

.dark-feature-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 44px;
  height: 44px;

  color: var(--color-primary);
  background: var(--color-white);

  border-radius: 50%;
}

.dark-feature-card__icon svg,
.dark-feature-card__icon [data-lucide] {
  width: 19px;
  height: 19px;

  stroke-width: 1.5;
}

.dark-feature-card__title {
  margin-top: var(--space-6);

  font-family: var(--font-serif);
  font-size: 1.8rem;
  font-weight: var(--font-weight-regular);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

.dark-feature-card__text {
  margin-top: var(--space-3);

  font-size: var(--font-size-sm);
  line-height: 1.65;

  color: rgba(255, 255, 255, 0.7);
}

.dark-feature-card__link {
  margin-top: var(--space-5);

  color: var(--color-sage);
}

.dark-feature-card__media {
  min-height: 250px;

  margin-top: auto;

  overflow: hidden;
}

.dark-feature-card__image {
  width: 100%;
  height: 100%;

  object-fit: cover;
}




.comparison-section {
  padding-block: var(--space-15);

  background: var(--color-off-white);
}

.comparison-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.comparison-section__header {
  max-width: 760px;

  margin-bottom: var(--space-9);
}

.comparison-table-wrap {
  width: 100%;

  overflow-x: auto;

  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
}

.comparison-table {
  min-width: 760px;

  background: var(--color-white);
}

.comparison-table th,
.comparison-table td {
  padding: var(--space-5) var(--space-6);

  text-align: center;

  border-bottom: 1px solid var(--color-border);
}

.comparison-table tr:last-child th,
.comparison-table tr:last-child td {
  border-bottom: 0;
}

.comparison-table th:first-child,
.comparison-table td:first-child {
  width: 36%;

  text-align: left;
}

.comparison-table thead th {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  line-height: 1.35;

  color: var(--color-text);

  background: var(--color-off-white);
}

.comparison-table thead th:nth-child(2) {
  color: var(--color-white);
  background: var(--color-primary);
}

.comparison-table tbody th {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  line-height: 1.45;

  color: var(--color-text);
}

.comparison-table tbody td {
  font-size: var(--font-size-sm);

  color: var(--color-text-secondary);
}

.comparison-table tbody td:nth-child(2) {
  background: var(--color-sage);
}

.comparison-table__icon {
  width: 19px;
  height: 19px;

  margin-inline: auto;

  color: var(--color-primary);

  stroke-width: 1.8;
}

.comparison-table__dash {
  color: #a1a8a3;
}




.measure-section {
  padding-block: var(--space-15);

  background: var(--color-off-white);
}

.measure-section__inner {
  display: grid;
  grid-template-columns: minmax(460px, 0.85fr) minmax(0, 1.15fr);
  align-items: stretch;

  width: min(
    calc(100% - 24px),
    1480px
  );

  margin-inline: auto;

  background: var(--color-sage);

  border-radius: var(--radius-2xl);

  overflow: hidden;
}

.measure-section__content {
  display: flex;
  flex-direction: column;
  justify-content: center;

  padding: clamp(1.25rem, 2vw, 2rem);
}

.measure-section__title {
  margin-top: var(--space-2);

  font-family: var(--font-serif);
  font-size: clamp(1.65rem, 2.4vw, 2.45rem);
  font-weight: var(--font-weight-regular);
  line-height: 1.08;
  letter-spacing: 0;
}

.measure-section__steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);

  margin-top: var(--space-3);

  list-style: none;
}

.measure-step {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);

  align-items: start;
}

.measure-step__number {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 32px;
  height: 32px;

  color: var(--color-primary);
  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: 50%;
}

.measure-step__number svg,
.measure-step__number [data-lucide] {
  width: 15px;
  height: 15px;
  stroke-width: 1.7;
}

.measure-step__title {
  max-width: 260px;

  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  line-height: 1.35;
}

.measure-step__text {
  margin-top: 2px;

  font-size: var(--font-size-xs);
  line-height: 1.45;

  color: var(--color-text-secondary);
}

.measure-section__media {
  position: relative;

  min-height: auto;

  background: var(--color-white);
}

.measure-section__image {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: contain;
  object-position: center;
}




.size-chart-section {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.size-chart-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.size-chart-section__header {
  max-width: 650px;

  margin: 0 auto var(--space-8);

  text-align: center;
}

.size-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(3rem, 8vw, 7rem);
}

.size-chart-card {
  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  overflow: hidden;
}

.size-chart {
  width: 100%;

  table-layout: fixed;
}

.size-chart th,
.size-chart td {
  padding: var(--space-4) var(--space-5);

  text-align: center;

  border-bottom: 1px solid var(--color-border);
}

.size-chart tr:last-child td {
  border-bottom: 0;
}

.size-chart th {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.07em;
  text-transform: uppercase;

  color: var(--color-text-secondary);
  background: var(--color-off-white);
}

.size-chart td {
  font-size: var(--font-size-sm);
  line-height: 1.35;

  color: var(--color-text);
}

.size-chart td:first-child {
  font-weight: var(--font-weight-semibold);

  color: var(--color-primary);
}

.size-chart__recommended {
  background: var(--color-sage);
}




.fit-rules {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.fit-rules__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.fit-rules__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);

  margin-top: var(--space-8);
}




.fit-tips {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.fit-tips__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.fit-tips__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);

  margin-top: var(--space-8);
}




.support-cta {
  padding-block: var(--space-12);

  background: var(--color-off-white);
}

.support-cta__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.65fr);
  align-items: start;

  width: min(
    calc(100% - 24px),
    1480px
  );

  margin-inline: auto;

  background: var(--color-off-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-2xl);

  overflow: visible;
}

.support-cta__content {
  position: sticky;
  top: calc(
    var(--header-height) +
    var(--promo-bar-height) +
    var(--space-6)
  );

  padding: clamp(2.5rem, 6vw, 5rem);
}

.support-cta [data-aos][data-aos] {
  opacity: 1;
  transform: none;
}

.support-cta__title {
  font-family: var(--font-serif);
  font-size: clamp(2.2rem, 4vw, 3.6rem);
  font-weight: var(--font-weight-regular);
  line-height: 1;
  letter-spacing: -0.04em;
}

.support-cta__text {
  max-width: 560px;

  margin-top: var(--space-4);

  line-height: 1.7;

  color: var(--color-text-secondary);
}

.support-cta__actions {
  margin-top: var(--space-6);
}

.support-cta__media {
  min-height: 340px;
  height: 100%;

  background: var(--color-sage);

  border-radius: 0 var(--radius-2xl) var(--radius-2xl) 0;
  overflow: hidden;
}

.support-cta__image {
  width: 100%;
  height: 100%;

  object-fit: cover;
}




.results-grid-section {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.results-grid-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.results-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);

  margin-top: var(--space-8);
}

.result-card {
  overflow: hidden;

  background: var(--color-off-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
}

.result-card__visual {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  min-height: 410px;
}

.result-card__side {
  position: relative;

  overflow: hidden;
}

.result-card__side + .result-card__side {
  border-left: 1px solid var(--color-white);
}

.result-card__image {
  width: 100%;
  height: 100%;

  object-fit: cover;
}

.result-card__label {
  position: absolute;
  top: var(--space-4);
  left: var(--space-4);

  padding: 6px 10px;

  font-size: 0.625rem;
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.08em;
  text-transform: uppercase;

  color: var(--color-text);
  background: rgba(255, 255, 255, 0.93);

  border-radius: var(--radius-round);
}

.result-card__body {
  padding: var(--space-6);
}

.result-card__quote {
  font-family: var(--font-serif);
  font-size: 1.35rem;
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.result-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);

  margin-top: var(--space-4);

  font-size: var(--font-size-xs);

  color: var(--color-text-secondary);
}

.results-disclaimer {
  margin-top: var(--space-6);

  padding: var(--space-4) var(--space-5);

  font-size: var(--font-size-xs);
  line-height: 1.6;

  color: var(--color-text-secondary);
  background: var(--color-off-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}




.results-swiper-section {
  padding-block: var(--space-14);

  background: var(--color-sage);

  overflow: hidden;
}

.results-swiper-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.results-swiper {
  margin-top: var(--space-8);

  overflow: hidden;
}

.results-swiper__slide {
  height: auto;
}

.results-swiper__controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);

  margin-top: var(--space-6);
}




.bundle-pricing {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.bundle-pricing__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.bundle-pricing__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: var(--space-5);

  margin-top: var(--space-8);
}

.bundle-card {
  position: relative;

  display: flex;
  flex-direction: column;

  min-height: 560px;

  background: var(--color-off-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-2xl);

  overflow: hidden;

  transition:
    transform var(--transition-base),
    border-color var(--transition-base),
    box-shadow var(--transition-base);
}

.bundle-card:hover {
  transform: translateY(-4px);

  border-color: var(--color-border-strong);

  box-shadow: var(--shadow-sm);
}

.bundle-card--featured {
  color: var(--color-white);
  background: var(--color-primary);

  border-color: var(--color-primary);
}

.bundle-card__badge {
  position: absolute;
  top: var(--space-5);
  right: var(--space-5);
  z-index: 3;
}

.bundle-card__media {
  position: relative;

  min-height: 250px;

  padding: var(--space-6);

  background: var(--color-sage);

  overflow: hidden;
}

.bundle-card--featured .bundle-card__media {
  background: rgba(255, 255, 255, 0.08);
}

.bundle-card__image {
  width: 100%;
  height: 100%;

  max-height: 220px;

  object-fit: contain;
}

.bundle-card__body {
  display: flex;
  flex-direction: column;

  flex: 1;

  padding: var(--space-6);
}

.bundle-card__title {
  font-family: var(--font-serif);
  font-size: 2rem;
  font-weight: var(--font-weight-regular);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

.bundle-card__description {
  margin-top: var(--space-3);

  font-size: var(--font-size-sm);
  line-height: 1.6;

  color: var(--color-text-secondary);
}

.bundle-card--featured .bundle-card__description {
  color: rgba(255, 255, 255, 0.72);
}

.bundle-card__price {
  margin-top: var(--space-6);
}

.bundle-card__current-price {
  font-size: 2rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1;
}

.bundle-card__old-price {
  margin-left: var(--space-2);

  font-size: var(--font-size-sm);

  color: var(--color-text-secondary);
  text-decoration: line-through;
}

.bundle-card--featured .bundle-card__old-price {
  color: rgba(255, 255, 255, 0.55);
}

.bundle-card__saving {
  display: block;

  margin-top: var(--space-2);

  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);

  color: var(--color-primary);
}

.bundle-card--featured .bundle-card__saving {
  color: var(--color-sage);
}

.bundle-card__benefits {
  display: grid;
  gap: var(--space-3);

  margin-top: var(--space-6);

  list-style: none;
}

.bundle-card__benefit {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);

  font-size: var(--font-size-sm);
  line-height: 1.45;
}

.bundle-card__benefit svg,
.bundle-card__benefit [data-lucide] {
  width: 16px;
  height: 16px;

  flex: 0 0 16px;

  margin-top: 2px;

  color: var(--color-primary);
}

.bundle-card--featured .bundle-card__benefit svg,
.bundle-card--featured .bundle-card__benefit [data-lucide] {
  color: var(--color-sage);
}

.bundle-card__action {
  margin-top: auto;
  padding-top: var(--space-7);
}

.bundle-card__action .btn {
  width: 100%;
}

.bundle-lifestyle {
  padding-block: var(--space-14);

  background: var(--color-sage);
}

.bundle-lifestyle__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: stretch;

  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;

  background: var(--color-white);

  border-radius: var(--radius-2xl);

  overflow: hidden;
}

.bundle-lifestyle__content {
  display: flex;
  flex-direction: column;
  justify-content: center;

  padding: clamp(3rem, 6vw, 5.5rem);
}

.bundle-lifestyle__title {
  font-family: var(--font-serif);
  font-size: clamp(2.6rem, 4.6vw, 4.4rem);
  font-weight: var(--font-weight-regular);
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.bundle-lifestyle__text {
  margin-top: var(--space-5);

  line-height: 1.7;

  color: var(--color-text-secondary);
}

.bundle-lifestyle__action {
  margin-top: var(--space-7);
}

.bundle-lifestyle__media {
  min-height: 560px;

  background: var(--color-warm-gray);
}

.bundle-lifestyle__image {
  width: 100%;
  height: 100%;

  object-fit: cover;
}




.reviews-summary,
.review-summary {
  padding-block: var(--space-13);

  background: var(--color-off-white);
}

.reviews-summary__inner,
.review-summary__inner {
  display: grid;
  grid-template-columns: minmax(280px, 0.7fr) minmax(0, 1.3fr);
  gap: clamp(2rem, 4vw, 4.5rem);

  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;

  padding: var(--space-8);

  background: var(--color-off-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-2xl);
}

.reviews-summary__score-area,
.review-summary__score-card {
  display: flex;
  flex-direction: column;
  justify-content: center;

  text-align: center;
}

.reviews-summary__score,
.review-summary__score {
  font-family: var(--font-serif);
  font-size: 5rem;
  line-height: 0.9;

  color: var(--color-primary);
}

.reviews-summary__stars,
.review-summary__stars {
  justify-content: center;

  margin-top: var(--space-4);
}

.reviews-summary__count,
.review-summary__count {
  margin-top: var(--space-3);

  font-size: var(--font-size-sm);

  color: var(--color-text-secondary);
}

.review-summary__eyebrow {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;

  color: var(--color-text-secondary);
}

.review-summary__badge {
  width: fit-content;

  margin: var(--space-5) auto 0;
}

.review-summary__distribution {
  display: grid;
  align-content: center;
  gap: var(--space-5);
}

.review-summary__distribution-header {
  max-width: 520px;
}

.review-summary__title {
  font-family: var(--font-serif);
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-regular);
  line-height: 1;
}

.review-summary__text {
  margin-top: var(--space-2);

  font-size: var(--font-size-sm);
  line-height: 1.6;

  color: var(--color-text-secondary);
}

.rating-distribution,
[data-reviews-distribution] {
  display: grid;
  gap: var(--space-3);
}

.rating-distribution__row,
.rating-breakdown__row {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 46px;
  align-items: center;
  gap: var(--space-3);
}

.rating-distribution__label,
.rating-distribution__value,
.rating-breakdown__label,
.rating-breakdown__value {
  font-size: var(--font-size-xs);

  color: var(--color-text-secondary);
}

.rating-distribution__value,
.rating-breakdown__value {
  text-align: right;
}

.rating-distribution__track,
.rating-breakdown__track {
  height: 7px;

  background: var(--color-white);

  border-radius: var(--radius-round);

  overflow: hidden;
}

.rating-distribution__bar,
.rating-breakdown__bar {
  width: var(--rating-width, 0%);
  height: 100%;

  background: var(--color-primary);

  border-radius: inherit;
}




.reviews-list-section,
.reviews-section {
  padding-block: var(--space-14);

  background: var(--color-off-white);

  overflow: hidden;
}

.reviews-list-section__inner,
.reviews-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.reviews-section__header,
.ugc-section__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-8);
}

.reviews-section__arrows,
.ugc-section__arrows {
  display: flex;
  gap: var(--space-2);
}

.reviews-swiper {
  margin-top: var(--space-8);

  width: 100%;
  max-width: 100%;

  overflow: hidden;
}

.reviews-swiper__slide {
  min-width: 0;
  height: auto;
}

.reviews-swiper__controls,
.reviews-section__pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);

  margin-top: var(--space-7);
}




.ugc-section {
  padding-block: var(--space-14);

  background: var(--color-off-white);

  overflow: hidden;
}

.ugc-section__inner {
  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
}

.ugc-swiper {
  margin-top: var(--space-8);

  overflow: visible;
}

.ugc-card {
  position: relative;

  aspect-ratio: 4 / 5;

  overflow: hidden;

  background: var(--color-off-white);

  border-radius: var(--radius-xl);
}

.ugc-card__image {
  width: 100%;
  height: 100%;

  object-fit: cover;
}

.ugc-card__label {
  position: absolute;
  left: var(--space-4);
  bottom: var(--space-4);

  padding: 6px 10px;

  font-size: 0.625rem;
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.07em;
  text-transform: uppercase;

  color: var(--color-text);
  background: rgba(255, 255, 255, 0.92);

  border-radius: var(--radius-round);
}

.ugc-card__overlay {
  position: absolute;
  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(17, 19, 17, 0) 45%,
    rgba(17, 19, 17, 0.32) 100%
  );

  pointer-events: none;
}

.ugc-section__controls,
.ugc-section__pagination {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-2);

  margin-top: var(--space-6);
}




.faq-section {
  padding-block: var(--space-14);

  background: var(--color-off-white);
}

.faq-section__inner,
.faq-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  gap: clamp(3rem, 7vw, 7rem);

  width: min(
    calc(100% - 48px),
    1040px
  );

  margin-inline: auto;
}

.faq-section__header {
  position: sticky;
  top: calc(
    var(--promo-bar-height) +
    var(--header-height) +
    var(--space-8)
  );

  align-self: start;

  max-width: 680px;

  padding: var(--space-6) 0 var(--space-6) var(--space-5);
  margin-bottom: var(--space-8);

  border-left: 1px solid var(--color-border);
}

.faq-section__header::before {
  content: "";

  display: block;

  width: 54px;
  height: 2px;

  margin-bottom: var(--space-4);

  background: var(--color-primary);
}

.faq-section__header .section__title {
  position: relative;

  display: inline-block;
}

.faq-section__header .section__title::after {
  content: "";

  position: absolute;
  left: 0;
  bottom: -0.35em;

  width: 72%;
  height: 1px;

  background: var(--color-primary);
}

.faq-section__header .section__description {
  display: grid;
  gap: var(--space-3);

  max-width: 360px;
  margin-top: var(--space-7);
}

.faq-section__header .section__description span {
  position: relative;

  display: block;

  padding-left: var(--space-6);

  line-height: 1.55;
}

.faq-section__header .section__description span::before {
  content: "";

  position: absolute;
  top: 0.72em;
  left: 0;

  width: 13px;
  height: 13px;

  background:
    linear-gradient(var(--color-white), var(--color-white)) center / 5px 5px no-repeat,
    var(--color-primary);

  border-radius: 50%;
  box-shadow: 0 0 0 4px var(--color-sage);
}

.faq-categories {
  position: sticky;
  top: calc(
    var(--promo-bar-height) +
    var(--header-height) +
    var(--space-8)
  );

  display: grid;
  gap: var(--space-2);
}

.faq-categories__label {
  margin-bottom: var(--space-2);

  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;

  color: var(--color-primary);
}

.faq-categories__list {
  display: grid;
  gap: var(--space-2);
}

.faq-categories__button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);

  min-height: 44px;

  padding: 0 var(--space-4);

  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.07em;
  text-transform: uppercase;

  color: var(--color-text-secondary);
  background: transparent;

  border: 1px solid transparent;
  border-radius: var(--radius-md);

  transition:
    color var(--transition-base),
    background-color var(--transition-base),
    border-color var(--transition-base);
}

.faq-categories__button:hover {
  color: var(--color-primary);
  background: var(--color-off-white);
}

.faq-categories__button.is-active,
.faq-categories__button[aria-selected="true"] {
  color: var(--color-primary);
  background: var(--color-sage);

  border-color: var(--color-border);
}

.faq-categories__count {
  font-size: 0.625rem;
  font-weight: var(--font-weight-medium);

  color: var(--color-text-secondary);
}

.faq-content {
  min-width: 0;
}

.faq-group {
  scroll-margin-top: calc(
    var(--promo-bar-height) +
    var(--header-height) +
    var(--space-7)
  );
}

.faq-group__header {
  margin-bottom: var(--space-4);
}

.faq-group__eyebrow {
  display: block;

  margin-bottom: var(--space-2);

  font-size: 0.6875rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;

  color: var(--color-text-secondary);
}

.faq-group + .faq-group {
  margin-top: var(--space-10);
}

.faq-group__title {
  margin-bottom: var(--space-4);

  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.1em;
  text-transform: uppercase;

  color: var(--color-primary);
}




.education-cta {
  padding-block: var(--space-12);

  background: var(--color-off-white);
}

.education-cta__inner {
  position: relative;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-8);

  width: min(
    calc(100% - 48px),
    var(--container-width)
  );

  margin-inline: auto;
  padding: var(--space-9);

  color: var(--color-white);
  background: var(--color-primary);

  border-radius: var(--radius-2xl);

  overflow: hidden;
}

.education-cta__content {
  position: relative;
  z-index: 2;

  max-width: 680px;
}

.education-cta__title {
  font-family: var(--font-serif);
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  font-weight: var(--font-weight-regular);
  line-height: 1;
  letter-spacing: -0.04em;
}

.education-cta__text {
  max-width: 600px;

  margin-top: var(--space-4);

  font-size: var(--font-size-sm);
  line-height: 1.7;

  color: rgba(255, 255, 255, 0.72);
}

.education-cta__trust {
  margin-top: var(--space-4);

  font-size: var(--font-size-xs);

  color: rgba(255, 255, 255, 0.66);
}

.education-cta__action {
  position: relative;
  z-index: 2;

  flex: 0 0 auto;
}




@media (max-width: 1199px) {
  .anatomy-visual {
    min-height: 660px;
  }

  .how-step {
    padding-inline: var(--space-5);
  }

  .dark-feature-card {
    min-height: 500px;
  }
}




@media (max-width: 991px) {
  .content-hero__inner,
  .anatomy-section__inner,
  .support-tabs__inner,
  .how-steps__inner,
  .support-zones__inner,
  .exploded-view__inner,
  .dark-features__inner,
  .comparison-section__inner,
  .measure-section__inner,
  .fit-rules__inner,
  .fit-tips__inner,
  .support-cta__inner,
  .results-grid-section__inner,
  .results-swiper-section__inner,
  .bundle-pricing__inner,
  .bundle-lifestyle__inner,
  .reviews-list-section__inner,
  .reviews-section__inner,
  .ugc-section__inner,
  .education-cta__inner {
    width: calc(100% - 40px);
  }

  .content-hero__inner {
    grid-template-columns: minmax(0, 0.92fr) minmax(320px, 1.08fr);

    gap: var(--space-8);
  }

  .content-hero__media {
    min-height: 450px;
  }

  .anatomy-visual {
    min-height: 610px;
  }

  .anatomy-callout {
    max-width: 190px;
  }

  .support-tabs__panel {
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
  }

  .support-tabs__media {
    min-height: 260px;
  }

  .measure-section__media {
    min-height: 260px;
  }

  .how-steps__grid,
  .support-zones__grid,
  .fit-rules__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .how-step:nth-child(2),
  .support-zone:nth-child(2),
  .fit-rule:nth-child(2) {
    border-right: 0;
  }

  .how-step:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  }

  .support-zone:nth-child(-n + 2),
  .fit-rule:nth-child(-n + 2) {
    border-bottom: 1px solid var(--color-border);
  }

  .support-zones .support-zone:nth-child(-n + 2),
  .fit-rules .fit-rule:nth-child(-n + 2) {
    border-bottom: 1px solid var(--color-border);
  }

  .exploded-view__inner {
    gap: var(--space-9);
  }

  .dark-features__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dark-feature-card:last-child {
    grid-column: 1 / -1;

    min-height: 430px;
  }

  .bundle-pricing__grid {
    gap: var(--space-4);
  }

  .bundle-card {
    min-height: 540px;
  }

  .reviews-summary__inner,
  .review-summary__inner {
    width: calc(100% - 40px);
  }

  .faq-section__inner,
  .faq-layout {
    width: calc(100% - 40px);
  }
}




@media (max-width: 767px) {
  .content-hero {
    padding-block: var(--space-9);
  }

  .content-hero__inner {
    grid-template-columns: 1fr;

    width: calc(100% - 32px);
  }

  .content-hero__content {
    max-width: 620px;
  }

  .content-hero__title {
    font-size: clamp(2.9rem, 12vw, 4.4rem);
  }

  .content-hero__media {
    aspect-ratio: 1 / 1.08;
    min-height: 480px;
  }

  .anatomy-section,
  .support-tabs,
  .how-steps,
  .exploded-view,
  .dark-features,
  .comparison-section,
  .measure-section {
    padding-block: var(--space-13);
  }

  .anatomy-section__inner,
  .support-tabs__inner,
  .how-steps__inner,
  .support-zones__inner,
  .exploded-view__inner,
  .dark-features__inner,
  .comparison-section__inner,
  .measure-section__inner,
  .fit-rules__inner,
  .fit-tips__inner,
  .support-cta__inner,
  .results-grid-section__inner,
  .results-swiper-section__inner,
  .bundle-pricing__inner,
  .bundle-lifestyle__inner,
  .reviews-list-section__inner,
  .reviews-section__inner,
  .ugc-section__inner,
  .education-cta__inner {
    width: calc(100% - 32px);
  }

  .anatomy-visual {
    display: flex;
    flex-direction: column;

    min-height: auto;

    padding: var(--space-5);
  }

  .anatomy-visual__person {
    position: relative;
    top: auto;
    left: auto;

    width: min(100%, 430px);

    margin-inline: auto;

    transform: none;
  }

  .anatomy-visual__spine {
    display: none;
  }

  .anatomy-callout {
    position: relative;
    inset: auto;

    display: grid;
    grid-template-columns: 12px 1fr;

    max-width: none;

    margin-top: var(--space-3);

    text-align: left;
  }

  .anatomy-callout--left {
    flex-direction: row;

    text-align: left;
  }

  .anatomy-callout__line {
    display: none;
  }

  .anatomy-callout__dot {
    margin-top: 5px;
  }

  .support-tabs__panel {
    grid-template-columns: 1fr;

    min-height: auto;
  }

  .support-tabs__benefits,
  .measure-section__steps {
    grid-template-columns: 1fr;
  }

  .support-tabs__media {
    min-height: 240px;
  }

  .support-tabs__content {
    padding: var(--space-5);
  }

  .how-steps__grid,
  .support-zones__grid,
  .fit-rules__grid {
    grid-template-columns: 1fr;
  }

  .how-step,
  .support-zone,
  .fit-rule {
    min-height: auto;

    padding: var(--space-6) 0;
  }

  .how-step:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  }

  .support-zone:not(:last-child),
  .fit-rule:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid var(--color-border);
  }

  .support-zones .support-zone,
  .fit-rules .fit-rule,
  .fit-tips .fit-tip-card {
    min-height: 0;
    padding: 0;
  }

  .support-zones .support-zone:not(:last-child),
  .fit-rules .fit-rule:not(:last-child),
  .fit-tips .fit-tip-card:not(:last-child) {
    border-bottom: 1px solid var(--color-border);
  }

  .exploded-view__inner {
    grid-template-columns: 1fr;
  }

  .exploded-view__visual {
    min-height: 520px;
  }

  .dark-features__grid {
    grid-template-columns: 1fr;
  }

  .dark-feature-card,
  .dark-feature-card:last-child {
    grid-column: auto;

    min-height: 470px;
  }

  .measure-section__inner {
    grid-template-columns: 1fr;
  }

  .measure-section__content {
    padding: var(--space-5);
  }

  .measure-section__media {
    min-height: 240px;
  }

  .size-chart-section__inner {
    width: calc(100% - 32px);
  }

  .size-chart-grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .fit-tips__grid {
    grid-template-columns: 1fr;
  }

  .support-cta__inner {
    grid-template-columns: 1fr;
  }

  .support-cta__content {
    position: static;
  }

  .support-cta__media {
    border-radius: 0 0 var(--radius-2xl) var(--radius-2xl);
    min-height: 420px;
  }

  .results-grid {
    grid-template-columns: 1fr;
  }

  .bundle-pricing__grid {
    grid-template-columns: 1fr;
  }

  .bundle-card {
    min-height: 510px;
  }

  .bundle-lifestyle__inner {
    grid-template-columns: 1fr;
  }

  .bundle-lifestyle__media {
    min-height: 500px;
  }

  .reviews-summary__inner,
  .review-summary__inner {
    grid-template-columns: 1fr;

    width: calc(100% - 32px);

    gap: var(--space-8);
  }

  .faq-section__inner,
  .faq-layout {
    grid-template-columns: 1fr;

    width: calc(100% - 32px);

    gap: var(--space-7);
  }

  .faq-section__header {
    position: static;

    padding: 0 0 var(--space-2);
    margin-bottom: 0;

    border-left: 0;
  }

  .faq-section__header .section__description {
    max-width: none;
  }

  .faq-categories {
    position: static;

    display: flex;

    padding-bottom: var(--space-2);

    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .faq-categories__list {
    display: flex;
    gap: var(--space-2);
  }

  .faq-categories::-webkit-scrollbar {
    display: none;
  }

  .faq-categories__button {
    flex: 0 0 auto;
  }

  .education-cta__inner {
    align-items: flex-start;
    flex-direction: column;

    padding: var(--space-8) var(--space-6);
  }
}




@media (max-width: 479px) {
  .content-hero__inner,
  .anatomy-section__inner,
  .support-tabs__inner,
  .how-steps__inner,
  .support-zones__inner,
  .exploded-view__inner,
  .dark-features__inner,
  .comparison-section__inner,
  .measure-section__inner,
  .fit-rules__inner,
  .fit-tips__inner,
  .support-cta__inner,
  .results-grid-section__inner,
  .results-swiper-section__inner,
  .bundle-pricing__inner,
  .bundle-lifestyle__inner,
  .reviews-list-section__inner,
  .reviews-section__inner,
  .ugc-section__inner,
  .education-cta__inner {
    width: calc(100% - 24px);
  }

  .content-hero__title {
    font-size: clamp(2.7rem, 13vw, 3.8rem);
  }

  .content-hero__actions {
    display: grid;

    width: 100%;
  }

  .content-hero__actions .btn {
    width: 100%;
  }

  .content-hero__media {
    aspect-ratio: 1 / 1.12;
    min-height: 410px;
  }

  .content-hero__floating-card {
    right: var(--space-3);
    bottom: var(--space-3);
    left: var(--space-3);

    max-width: none;
  }

  .anatomy-visual {
    border-radius: var(--radius-xl);
  }

  .support-tabs__media {
    min-height: 220px;
  }

  .support-tabs__content {
    padding: var(--space-5);
  }

  .exploded-view__visual {
    min-height: 420px;
  }

  .dark-feature-card,
  .dark-feature-card:last-child {
    min-height: 440px;
  }

  .comparison-table th,
  .comparison-table td,
  .size-chart th,
  .size-chart td {
    padding: var(--space-3);
  }

  .measure-section__content {
    padding: var(--space-5);
  }

  .measure-section__media {
    min-height: 220px;
  }

  .support-cta__content {
    padding: var(--space-7) var(--space-5);
  }

  .support-cta__media {
    min-height: 360px;
  }

  .result-card__visual {
    min-height: 340px;
  }

  .result-card__body {
    padding: var(--space-5);
  }

  .bundle-card {
    min-height: 480px;
  }

  .bundle-card__body {
    padding: var(--space-5);
  }

  .bundle-lifestyle__content {
    padding: var(--space-7) var(--space-5);
  }

  .bundle-lifestyle__media {
    min-height: 420px;
  }

  .reviews-summary__inner,
  .review-summary__inner {
    width: calc(100% - 24px);

    padding: var(--space-6);
  }

  .reviews-summary__score,
  .review-summary__score {
    font-size: 4rem;
  }

  .rating-distribution__row,
  .rating-breakdown__row {
    grid-template-columns: 46px minmax(0, 1fr) 40px;
  }

  .faq-section__inner,
  .faq-layout {
    width: calc(100% - 24px);
  }

  .education-cta__inner {
    width: calc(100% - 24px);

    padding: var(--space-7) var(--space-5);
  }

  .education-cta__action {
    width: 100%;
  }

  .education-cta__action .btn {
    width: 100%;
  }
}




@media (prefers-reduced-motion: reduce) {
  .dark-feature-card,
  .bundle-card {
    transform: none !important;
    transition-duration: 0.01ms !important;
  }
}