/* Pricing configurator: one card, one segmented choice, one call to action.
   One type scale and one spacing scale for every state and for the FAQ below.
   Colors: #1a1a1a titles, prices, active control; #333 body; #6b6b6b secondary;
   #dfdbd6 borders. Inter comes from the page. */
.pricing-configurator,
.pricing-objections {
  --pc-title: 56px;
  --pc-price: 64px;
  --pc-subtitle: 24px;
  --pc-text: 18px;
  --pc-control: 16px;
  --pc-button: 18px;
  --pc-faq-title: 42px;
  --pc-gap-control: 32px;   /* segmented control -> title or price */
  --pc-gap-title: 12px;     /* title or price -> subtitle */
  --pc-gap-block: 28px;     /* subtitle -> discovery lines -> features */
  --pc-gap-cta: 32px;       /* features -> call to action */
  --pc-gap-faq: 72px;       /* card -> FAQ */
}

.pricing-configurator {
  max-width: 680px;
  margin: 0 auto;
  text-align: left;
}

.pricing-config-card {
  background: #fff;
  border: 1px solid #dfdbd6;
  border-radius: 20px;
  padding: 28px 36px 32px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.pricing-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.pricing-config-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid #dfdbd6;
  border-radius: 999px;
  background: #f7f5f1;
  color: #1a1a1a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.pricing-config-badge[hidden] { display: none; }

/* Segmented control. */
.pricing-options {
  display: grid;
  grid-template-columns: repeat(6, minmax(max-content, 1fr));
  gap: 2px;
  margin: 0 0 var(--pc-gap-control);
  padding: 3px;
  background: #f5f3ef;
  border: 1px solid #dfdbd6;
  border-radius: 12px;
}

.pricing-options button {
  min-width: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #6b6b6b;
  font: inherit;
  font-size: var(--pc-control);
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.pricing-options button:hover { color: #1a1a1a; background: rgba(0, 0, 0, 0.04); }
.pricing-options button[aria-checked="true"] { background: #1a1a1a; color: #fff; }
.pricing-options button:focus-visible { outline: 2px solid #0a66c2; outline-offset: 2px; }

/* Selected offer: the title (Mode découverte, Sur mesure) and the price share
   one display style, so every state opens the same way. */
.pricing-panel[hidden] { display: none; }

.pricing-panel-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0;
}

.pricing-config-amount,
.pricing-panel-title {
  color: #1a1a1a;
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.pricing-config-amount {
  font-size: var(--pc-price);
  font-weight: 800;
}

.pricing-panel-title {
  margin: 0;
  font-size: var(--pc-title);
  font-weight: 700;
}

.pricing-config-period {
  color: #6b6b6b;
  font-size: var(--pc-text);
  font-weight: 500;
}

.pricing-panel-lede {
  margin: var(--pc-gap-title) 0 0;
  color: #333;
  font-size: var(--pc-subtitle);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.015em;
}
.pricing-panel-lede strong { color: #1a1a1a; font-weight: 700; }

.pricing-panel-note {
  margin: 8px 0 0;
  color: #6b6b6b;
  font-size: var(--pc-text);
  font-weight: 400;
  line-height: 1.5;
}

.pricing-discovery-grants {
  display: grid;
  gap: 6px;
  margin: var(--pc-gap-block) 0 0;
  color: #333;
  font-size: var(--pc-text);
  font-weight: 400;
  line-height: 1.4;
}
.pricing-discovery-grants strong { color: #1a1a1a; font-weight: 700; }

.pricing-config-features {
  display: grid;
  gap: 12px;
  margin: var(--pc-gap-block) 0 0;
  padding-top: var(--pc-gap-block);
  border-top: 1px solid #dfdbd6;
}

.pricing-config-features li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #333;
  font-size: var(--pc-text);
  font-weight: 400;
  line-height: 1.45;
}

.pricing-config-check {
  color: #22c55e;
  font-weight: 800;
}

.pricing-config-btn {
  display: block;
  width: 100%;
  margin-top: var(--pc-gap-cta);
  padding: 16px 24px;
  border-radius: 12px;
  background: #1a1a1a;
  color: #fff;
  text-align: center;
  font-size: var(--pc-button);
  font-weight: 700;
  line-height: 1.3;
  transition: background 0.15s, transform 0.1s;
}
.pricing-config-btn:hover { background: #303030; }
.pricing-config-btn:active { transform: scale(0.99); }
.pricing-config-btn:focus-visible { outline: 2px solid #0a66c2; outline-offset: 3px; }
.pricing-custom-booking .pricing-config-btn { box-sizing: border-box; }

@media (min-width: 601px) {
  .pricing-config-features { grid-template-columns: 1fr 1fr; column-gap: 28px; }
}

@media (max-width: 600px) {
  .pricing-configurator,
  .pricing-objections {
    --pc-title: 38px;
    --pc-price: 44px;
    --pc-subtitle: 20px;
    --pc-text: 16px;
    --pc-control: 14px;
    --pc-button: 16px;
    --pc-faq-title: 32px;
    --pc-gap-control: 24px;
    --pc-gap-title: 10px;
    --pc-gap-block: 22px;
    --pc-gap-cta: 24px;
    --pc-gap-faq: 48px;
  }
  .pricing-config-card { padding: 20px 18px 22px; border-radius: 16px; }
  .pricing-config-btn { padding: 14px 20px; }
}

/* Six choices do not fit one row on phones: two rows of three, same control. */
@media (max-width: 480px) {
  .pricing-options { grid-template-columns: repeat(3, minmax(max-content, 1fr)); }
  .pricing-options button { padding: 10px 4px; }
}

@media (max-width: 360px) {
  .pricing-options button { padding: 10px 2px; }
  .pricing-config-badge { padding: 3px 8px; font-size: 11px; }
}

/* Purchase FAQ, on the pricing pages (h3) and on the home page (h2). */
.pricing-objections {
  max-width: 720px;
  margin: var(--pc-gap-faq) auto 0;
  text-align: left;
}
/* On the home page the FAQ is its own section after the pricing section's
   bottom padding; together they make the same card -> FAQ gap. */
.home .pricing-objections.home-purchase-faq {
  margin-top: calc(var(--pc-gap-faq) - var(--home-section-gap-sm));
}

.pricing-objections > h2,
.pricing-objections > h3,
.home .pricing-objections.home-purchase-faq > h2 {
  margin: 0 0 24px;
  text-align: center;
  color: #1a1a1a;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: var(--pc-faq-title);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.pricing-faq-item {
  border-top: 1px solid #dfdbd6;
}

.pricing-faq-item:last-child {
  border-bottom: 1px solid #dfdbd6;
}

.pricing-faq-item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 2px;
  cursor: pointer;
  list-style: none;
  color: #1a1a1a;
  font-size: var(--pc-text);
  font-weight: 700;
  line-height: 1.4;
}

.pricing-faq-item summary::-webkit-details-marker { display: none; }
.pricing-faq-item summary::after {
  content: '+';
  color: #6b6b6b;
  font-size: 22px;
  font-weight: 400;
}
.pricing-faq-item[open] summary::after { content: '−'; }

.pricing-faq-item p {
  margin: -4px 0 20px;
  color: #333;
  font-size: var(--pc-text);
  font-weight: 400;
  line-height: 1.6;
}
