/* Tarifs page: one warm pricing section, from header to assurance stripe. */
.tarifs-page .pricing {
  width: 100%;
  margin: 0;
  padding: calc(var(--nav-height) + clamp(54px, 7vw, 92px)) 0 clamp(42px, 7vw, 78px);
  border-top: 0;
  color: var(--ink);
  background:
    linear-gradient(180deg, rgba(var(--paper-2-rgb), 0.9), rgba(var(--paper-rgb), 0.96) 52%, rgba(var(--paper-rgb), 0.74)),
    var(--paper-grid);
}

.tarifs-pricing__head {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) auto;
  gap: clamp(28px, 5vw, 72px);
  align-items: end;
  margin-bottom: clamp(30px, 5vw, 56px);
}

.tarifs-pricing h1 {
  max-width: 760px;
  margin: 0;
  color: var(--ink);
  font-family: var(--serif);
  font-size: clamp(3.4rem, 7vw, 64px);
  font-weight: var(--weight-title);
  line-height: var(--title-line-height);
  text-wrap: balance;
}

.tarifs-pricing .page-hero__copy {
  max-width: 660px;
  margin: 22px 0 0;
  color: var(--body);
  font-size: clamp(1.12rem, 2vw, 18px);
  line-height: 1.7;
}

.tarifs-page .billing-toggle {
  width: min(100%, 320px);
  margin: 0;
  border-color: rgba(var(--ink-rgb), 0.12);
  background: rgba(var(--paper-2-rgb), 0.82);
}

.tarifs-page .billing-toggle::before {
  background: var(--ink);
}

.tarifs-page .billing-toggle__btn {
  color: var(--body);
}

.tarifs-page .billing-toggle__btn.is-active {
  color: var(--paper-2);
}

.tarifs-page .pricing__grid {
  gap: clamp(14px, 2vw, 22px);
  align-items: stretch;
}

.tarifs-page .tier {
  position: relative;
  min-height: 0;
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid rgba(var(--ink-rgb), 0.12);
  border-radius: 12px;
  color: var(--ink);
  background: rgba(var(--paper-2-rgb), 0.82);
  box-shadow: 0 1px 0 rgba(var(--white-rgb), 0.72) inset;
  transform: none;
}

.tarifs-page .tier--featured {
  border-color: rgba(var(--coral-rgb), 0.62);
  background:
    linear-gradient(180deg, rgba(var(--coral-rgb), 0.22), rgba(var(--paper-2-rgb), 0.92) 42%),
    var(--paper-2);
}

.tarifs-page .tier__badge {
  position: absolute;
  top: clamp(24px, 3vw, 34px);
  left: auto;
  right: clamp(24px, 3vw, 34px);
  width: fit-content;
  margin: 0;
  color: var(--ink);
  background: rgba(var(--coral-rgb), 0.42);
}

.tarifs-page .tier h2,
.tarifs-page.tarifs-page .pricing.pricing--tarifs :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3) {
  color: var(--ink);
}

.tarifs-page .tier h2 {
  font-size: clamp(1.55rem, 2.2vw, 32px);
}

.tarifs-page .tier__fit {
  border-color: rgba(var(--ink-rgb), 0.1);
  color: var(--coral-deep);
  background: rgba(var(--coral-rgb), 0.14);
}

.tarifs-page .tier :is(p, li),
.tarifs-page.tarifs-page .pricing.pricing--tarifs :is(p, li, small, dd) {
  color: var(--body);
  font-weight: var(--weight-regular);
}

.tarifs-page .tier__ownership strong {
  color: var(--ink);
}

.tarifs-page .tier__price {
  margin: 24px 0 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(var(--ink-rgb), 0.1);
}

.tarifs-page .tier__price b {
  color: var(--ink);
  font-size: clamp(2.75rem, 5vw, 3.35rem);
}

.tarifs-page .tier__price span {
  color: var(--body);
}

.tarifs-page .pricing .button--secondary {
  color: var(--ink);
  border: 1px solid rgba(var(--ink-rgb), 0.14);
  background: transparent;
}

.tarifs-page .pricing .button--secondary:hover {
  background: rgba(var(--ink-rgb), 0.06);
}

.tarifs-page .pricing .button--primary {
  box-shadow: none;
}

.pricing-page__assurances {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: clamp(26px, 4vw, 44px);
  border-top: 1px solid rgba(var(--ink-rgb), 0.12);
  border-bottom: 1px solid rgba(var(--ink-rgb), 0.12);
}

.pricing-page__assurances p {
  margin: 0;
  padding: 22px clamp(16px, 2vw, 24px);
  color: var(--muted);
  line-height: 1.55;
}

.pricing-page__assurances p + p {
  border-left: 1px solid rgba(var(--ink-rgb), 0.12);
}

.pricing-page__assurances strong {
  display: block;
  margin-bottom: 4px;
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: var(--weight-title);
}

@media (max-width: 980px) {
  .tarifs-pricing__head,
  .pricing-page__assurances {
    grid-template-columns: 1fr;
  }

  .tarifs-page .tier--featured {
    transform: none;
  }

  .pricing-page__assurances p + p {
    border-top: 1px solid rgba(var(--ink-rgb), 0.12);
    border-left: 0;
  }
}

@media (max-width: 640px) {
  .tarifs-page .pricing {
    padding-top: calc(var(--nav-height) + 38px);
  }

  .tarifs-pricing h1 {
    font-size: clamp(2.7rem, 11vw, 3.55rem);
  }

  .tarifs-page .billing-toggle {
    width: 100%;
  }
}
