/* Homepage LTV payback card (see ltv_card.py). Illustrative curve; no performance data. */
.lifetime-value-section .ltv-card{display:flex;flex-direction:column;padding:34px 32px 26px;border:1px solid #e6e0f0;border-radius:20px;background:radial-gradient(circle at 80% 34%,rgba(185,163,238,.3),rgba(185,163,238,0) 42%),linear-gradient(180deg,#faf8fd 0%,#f3effa 100%);box-shadow:0 1px 2px rgba(75,63,114,.04),0 18px 48px -24px rgba(75,63,114,.18);color:#3a3355;container:ltv-card/inline-size}
.lifetime-value-section .ltv-card::before{content:none}
.lifetime-value-section .ltv-card .ltv-card-kicker{font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:#6b6482}
.lifetime-value-section .ltv-card .ltv-card-title{display:flex;align-items:center;gap:18px;margin-top:14px}
.lifetime-value-section .ltv-card .ltv-card-title strong{font-size:52px;font-weight:300;line-height:1;letter-spacing:-.02em;color:#4b3f72}
.lifetime-value-section .ltv-card .ltv-card-title span{font-size:14px;line-height:1.45;color:#6f6888}
.lifetime-value-section .ltv-card .ltv-card-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:20px 0 0;padding:0;list-style:none;font-size:12px;color:#5e5778}
.lifetime-value-section .ltv-card .ltv-card-legend li{display:flex;align-items:center;gap:8px}
.lifetime-value-section .ltv-card .ltv-card-legend i{display:block;width:16px;height:10px;border-radius:3px;box-sizing:border-box}
.lifetime-value-section .ltv-card .ltv-swatch-cost{background:rgba(228,138,162,.45);border:1px solid #c9667f}
.lifetime-value-section .ltv-card .ltv-swatch-value{background:rgba(138,107,209,.45);border:1px solid #6b4fc0}
.lifetime-value-section .ltv-card .ltv-swatch-even{border:1.5px dashed #8e86a6}
/* The plot box keeps the design's 904:400 proportions; shapes stretch, marks do not. */
.lifetime-value-section .ltv-card .ltv-card-plot{position:relative;aspect-ratio:904/400;margin-top:44px;background-image:radial-gradient(#dcd3ec 1px,transparent 1.3px);background-size:14px 14px}
.lifetime-value-section .ltv-card .ltv-card-plot svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.lifetime-value-section .ltv-card .ltv-card-marks{position:absolute;inset:0;pointer-events:none}
.lifetime-value-section .ltv-card .ltv-card-dot{position:absolute;box-sizing:border-box;width:9px;height:9px;border-radius:50%;background:#fff;border:2px solid #6b4fc0;transform:translate(-50%,-50%)}
.lifetime-value-section .ltv-card .ltv-card-dot-cac{width:11px;height:11px;border-color:#c9667f}
.lifetime-value-section .ltv-card .ltv-card-dot-payback{width:15px;height:15px;border-width:2.5px}
.lifetime-value-section .ltv-card .ltv-card-label{position:absolute;font-size:11px;line-height:1;white-space:nowrap;color:#5e4aa8}
.lifetime-value-section .ltv-card .ltv-card-label-even{transform:translateY(calc(-100% - 7px));letter-spacing:.06em;color:#6b6482}
.lifetime-value-section .ltv-card .ltv-card-label-cac{transform:translate(-50%,12px);font-size:12px;font-weight:500;letter-spacing:.08em;color:#a84a63}
.lifetime-value-section .ltv-card .ltv-card-label-payback{transform:translate(calc(-100% - 12px),calc(-100% - 10px));font-size:14px;font-weight:600;color:#4b3f72}
.lifetime-value-section .ltv-card .ltv-card-label-repeat{transform:translate(-50%,calc(-100% - 10px))}
.lifetime-value-section .ltv-card .ltv-card-label-ltv{right:0;top:0;transform:translateY(-50%);font-size:16px;font-weight:600;color:#4b3f72}
.lifetime-value-section .ltv-card .ltv-card-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:30px 0 0;padding:0;list-style:none;border-top:1px solid #dcd4ea;text-align:center}
.lifetime-value-section .ltv-card .ltv-card-stages li{position:relative;padding:22px 4px 0}
.lifetime-value-section .ltv-card .ltv-card-stages li::before{content:'';position:absolute;left:50%;top:-6px;box-sizing:border-box;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#fff;border:1.5px solid #a898d0}
.lifetime-value-section .ltv-card .ltv-card-stages span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#6b6482}
.lifetime-value-section .ltv-card .ltv-card-stages strong{display:block;margin-top:6px;font-size:14px;font-weight:400;line-height:1.3;color:#3a3355}
.lifetime-value-section .ltv-card .ltv-card-caption{margin-top:28px;padding:0;font-size:13px;line-height:1.5;color:#6b6482}
@media(max-width:1000px){
  .lifetime-value-section .ltv-card{padding:28px 24px 22px}
  .lifetime-value-section .ltv-card .ltv-card-title strong{font-size:44px}
  .lifetime-value-section .ltv-card .ltv-card-stages span{font-size:9px;letter-spacing:.06em}
  .lifetime-value-section .ltv-card .ltv-card-stages strong{font-size:13px}
}
/* Narrow cards (phones, and the two-column tablet layout): a taller plot,
   shorter labels and stage names that may wrap. */
@media(max-width:560px){
  .lifetime-value-section .ltv-card{padding:24px 18px 20px;border-radius:16px}
}
@container ltv-card (max-width:480px){
  .lifetime-value-section .ltv-card .ltv-card-kicker{font-size:10px;letter-spacing:.14em}
  .lifetime-value-section .ltv-card .ltv-card-title{gap:14px;margin-top:12px}
  .lifetime-value-section .ltv-card .ltv-card-title strong{font-size:40px}
  .lifetime-value-section .ltv-card .ltv-card-title span{font-size:13px}
  .lifetime-value-section .ltv-card .ltv-card-legend{gap:6px 16px;margin-top:16px;font-size:11px}
  .lifetime-value-section .ltv-card .ltv-card-plot{aspect-ratio:904/560;margin-top:36px;background-size:12px 12px}
  .lifetime-value-section .ltv-card .ltv-card-label{font-size:10px}
  .lifetime-value-section .ltv-card .ltv-card-label-repeat{font-size:12px;font-weight:600}
  .lifetime-value-section .ltv-card .ltv-card-label-repeat span{display:none}
  .lifetime-value-section .ltv-card .ltv-card-label-cac{font-size:11px}
  .lifetime-value-section .ltv-card .ltv-card-label-payback{font-size:12px}
  .lifetime-value-section .ltv-card .ltv-card-label-ltv{font-size:14px}
  .lifetime-value-section .ltv-card .ltv-card-stages{margin-top:26px}
  .lifetime-value-section .ltv-card .ltv-card-stages li{padding:18px 2px 0}
  .lifetime-value-section .ltv-card .ltv-card-stages span{font-size:8.5px;letter-spacing:.04em}
  .lifetime-value-section .ltv-card .ltv-card-stages strong{margin-top:5px;font-size:12px}
  .lifetime-value-section .ltv-card .ltv-card-caption{margin-top:22px;font-size:12px}
}
