.checkout-hero {
  padding-top: var(--space-32);
}

.checkout-hero__layout {
  display: grid;
  gap: var(--space-24);
  align-items: center;
}

@media (min-width: 960px) {
  .checkout-hero__layout {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  }
}

.checkout-hero__intro {
  max-width: 40rem;
}

.checkout-hero__trust {
  margin-top: var(--space-20);
  display: grid;
  gap: var(--space-12);
}

@media (min-width: 720px) {
  .checkout-hero__trust {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.checkout-hero__trust-item {
  padding: var(--space-10);
  border-radius: var(--radius-md);
  background: var(--color-bg-alt);
  border: 1px solid var(--color-border-subtle);
}

.checkout-hero__trust-label {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: 600;
  margin-bottom: var(--space-3);
}

.checkout-hero__trust-note {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.checkout-hero__media {
  max-height: 340px;
}

.checkout-progress {
  padding-block: var(--space-16);
}

.checkout-steps {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-10);
}

.checkout-step {
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) var(--space-8);
  border-radius: var(--radius-round);
  border: 1px dashed var(--color-border-subtle);
  background: var(--color-bg-alt);
}

.checkout-step__index {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-xs);
  font-weight: 600;
  border: 1px solid var(--color-border);
  background: #fff;
}

.checkout-step__label {
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}

.checkout-step--active {
  border-style: solid;
  border-color: var(--color-primary-soft);
  background: radial-gradient(circle at top left, #f3dfd9 0, #fff7f2 45%, #ffffff 100%);
}

.checkout-step--active .checkout-step__index {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}

.checkout-step--active .checkout-step__label {
  color: var(--color-neutral-900);
}

.checkout-main {
  padding-top: 0;
}

.checkout-layout {
  display: grid;
  gap: var(--space-24);
  align-items: flex-start;
}

@media (min-width: 1024px) {
  .checkout-layout {
    grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr);
  }
}

.checkout-main__primary {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}

.checkout-main__summary {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}

.checkout-panel__header {
  margin-bottom: var(--space-12);
}

.checkout-panel__header--inline {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-10);
}

.checkout-panel__body {
  display: block;
}

.checkout-overview {
  display: grid;
  gap: var(--space-16);
}

@media (min-width: 840px) {
  .checkout-overview {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    align-items: stretch;
  }
}

.checkout-overview__list {
  list-style: none;
  margin-top: var(--space-12);
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

.checkout-overview__item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-10);
}

.checkout-overview__item-name {
  font-size: var(--font-size-sm);
  font-weight: 500;
}

.checkout-overview__item-price {
  font-size: var(--font-size-sm);
  white-space: nowrap;
}

.checkout-review {
  display: grid;
  gap: var(--space-16);
}

@media (min-width: 840px) {
  .checkout-review {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.5fr);
    align-items: stretch;
  }
}

.checkout-review__items {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  margin-bottom: var(--space-12);
}

.checkout-review__item {
  display: flex;
  justify-content: space-between;
  gap: var(--space-10);
}

.checkout-review__item-name {
  font-size: var(--font-size-sm);
  font-weight: 500;
}

.checkout-review__item-price {
  font-size: var(--font-size-sm);
  white-space: nowrap;
}

.checkout-review__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
}

.checkout-form__grid {
  align-items: flex-start;
}

.checkout-checkbox {
  display: flex;
  align-items: flex-start;
  gap: var(--space-6);
  font-size: var(--font-size-sm);
}

.checkout-checkbox input[type="checkbox"] {
  margin-top: 3px;
}

.checkout-radio-group {
  border: none;
  padding: 0;
  margin: 0;
}

.checkout-radio-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-10);
  padding: var(--space-10);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border-subtle);
  background: var(--color-bg-alt);
}

.checkout-radio-option + .checkout-radio-option {
  margin-top: var(--space-8);
}

.checkout-radio-option__main {
  display: flex;
  align-items: flex-start;
  gap: var(--space-8);
}

.checkout-radio-option input[type="radio"] {
  margin-top: 3px;
}

.checkout-radio-option label {
  margin-bottom: 0;
}

.checkout-radio-option__meta {
  display: block;
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-2);
}

.checkout-radio-option__price {
  font-size: var(--font-size-sm);
  font-weight: 500;
  white-space: nowrap;
}

.checkout-delivery__note {
  margin-top: var(--space-10);
  padding: var(--space-8);
  border-radius: var(--radius-md);
  background: var(--color-primary-soft);
  font-size: var(--font-size-sm);
}

.checkout-badge-secure {
  display: inline-flex;
  align-items: center;
  gap: var(--space-4);
  padding: 0.25rem 0.6rem;
  border-radius: var(--radius-round);
  background: rgba(227, 231, 217, 0.7);
  font-size: var(--font-size-xs);
}

.checkout-badge-secure__dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--color-success);
}

.checkout-badge-secure__text {
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

.checkout-billing-extra {
  margin-top: var(--space-8);
  padding-top: var(--space-8);
  border-top: 1px dashed var(--color-border-subtle);
}

.checkout-promotions__form {
  display: grid;
  gap: var(--space-12);
}

.checkout-promotions__input-group {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) auto;
  gap: var(--space-8);
}

.checkout-promotions__note {
  margin-top: var(--space-8);
  font-size: var(--font-size-sm);
}

.checkout-payment__details {
  margin-top: var(--space-12);
}

.checkout-payment__section {
  padding: var(--space-10);
  border-radius: var(--radius-md);
  background: var(--color-bg-alt);
}

.checkout-payment__section + .checkout-payment__section {
  margin-top: var(--space-10);
}

.checkout-payment__security {
  margin-top: var(--space-10);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.checkout-badges-payment {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.checkout-badge {
  font-size: var(--font-size-xs);
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-round);
  border: 1px solid rgba(201, 184, 165, 0.7);
  background: #fff;
}

.checkout-loyalty__summary {
  padding: var(--space-8);
  border-radius: var(--radius-md);
  background: var(--color-accent-soft);
}

.checkout-loyalty__input-group {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) auto;
  gap: var(--space-8);
}

.checkout-preview__steps {
  list-style: decimal;
  padding-left: var(--space-20);
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

.checkout-preview__steps li {
  font-size: var(--font-size-sm);
}

.checkout-support__grid {
  display: grid;
  gap: var(--space-16);
}

@media (min-width: 840px) {
  .checkout-support__grid {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.2fr);
  }
}

.checkout-support__title {
  font-size: var(--font-size-lg);
  margin-bottom: var(--space-6);
}

.checkout-support__list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.checkout-support__list--compact {
  font-size: var(--font-size-sm);
}

.checkout-summary {
  position: sticky;
  top: var(--space-24);
}

.checkout-summary__header {
  margin-bottom: var(--space-10);
}

.checkout-summary__title {
  font-size: var(--font-size-xl);
  margin-bottom: var(--space-4);
}

.checkout-summary__rows {
  margin: 0;
}

.checkout-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: var(--font-size-sm);
  padding-block: var(--space-4);
}

.checkout-summary__row--emphasis {
  margin-top: var(--space-6);
  padding-top: var(--space-8);
  border-top: 1px solid var(--color-border-subtle);
  font-weight: 600;
}

.checkout-summary__row dt {
  color: var(--color-text-muted);
}

.checkout-summary__row dd {
  margin: 0;
}

.checkout-summary__trust {
  margin-top: var(--space-12);
  font-size: var(--font-size-xs);
}

.checkout-summary__footer {
  margin-top: var(--space-12);
}

.checkout-summary__disclaimer {
  margin-top: var(--space-6);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.checkout-recommendations__header {
  margin-bottom: var(--space-10);
}

.checkout-recommendations__body {
  display: grid;
  gap: var(--space-10);
}

.checkout-recommendations__media {
  max-height: 220px;
}

.checkout-recommendations__list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.checkout-recommendations__item-name {
  font-size: var(--font-size-sm);
  font-weight: 500;
}

.checkout-recommendations__item-meta {
  font-size: var(--font-size-xs);
}

@media (max-width: 720px) {
  .checkout-steps {
    overflow-x: auto;
  }

  .checkout-summary {
    position: static;
  }
}

@media (max-width: 480px) {
  .checkout-promotions__input-group,
  .checkout-loyalty__input-group {
    grid-template-columns: minmax(0, 1fr);
  }
}