.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link:not(:focus) { width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); }
.plans-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:28px 0; }
.plans-header img { width:110px; }
.plans-header>a:last-child { font:500 19px var(--display); padding:12px 0; }
.plans-intro { background:var(--sky); padding:32px 0 48px; text-align:center; }
.intro-brand { display:flex; justify-content:center; align-items:center; gap:16px; margin-bottom:22px; }
.intro-brand img { width:64px; }
.plans-intro h1 { font-size:clamp(36px,4.7vw,64px); line-height:1.08; color:var(--ink); }
.plans-intro h1 span { color:#ae365a; }
.plans-intro h1+p { max-width:610px; margin:24px auto; }
.preview-notice { max-width:720px; margin:28px auto 0; background:#ffffffad; border:1px solid #a2d7e2; border-radius:18px; padding:18px 24px; font-size:14px; }
.plans-section { background:var(--paper); padding:46px 0 56px; }
.plan-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.plan-card { display:flex; flex-direction:column; border:2px solid #c6e2e4; background:white; border-radius:28px; padding:28px 24px; box-shadow:0 7px 0 #084c6509; }
.plan-card.essential { border-color:#56adb7; }
.plan-card.pro { border-color:#cd6183; background:#fff3f6; }
.plan-kicker { font-size:11px; font-weight:800; letter-spacing:1.3px; color:#466c77; }
.plan-card h3 { font-size:38px; margin:14px 0; color:var(--ink); }
.pro h3 { color:#ae365a; }
.plan-description { font-size:14px; min-height:48px; }
.plan-price { font:600 43px/1.1 var(--display); margin:24px 0 !important; white-space:nowrap; }
.plan-price span { display:block; font:400 13px/1.6 var(--body); margin-top:8px; }
.plan-button { display:flex; justify-content:center; align-items:center; text-align:center; min-height:52px; padding:13px 12px; border-radius:16px; font:600 20px/1.2 var(--display); text-decoration:none; }
.secondary { background:#eaf7fa; color:var(--deep); border:1px solid #bedce4; }
.teal { background:var(--ink); color:white; box-shadow:0 5px 0 #08566b; }
.plan-button.pink { color:white; }
.plan-button:hover { filter:brightness(.96); }
.plan-card ul { list-style:none; padding:0; margin:26px 0 18px; font-size:14px; }
.plan-card li { position:relative; padding:10px 0 10px 22px; border-bottom:1px solid #084c6510; }
.plan-card li::before { content:'✓'; position:absolute; left:0; color:var(--ink); font-weight:700; }
.card-footnote { margin-top:auto; font-size:12px; color:#49636b; }
.shared-benefits { text-align:center; max-width:760px; margin:28px auto 0; font-size:14px; }
.future-feature { margin-top:40px; display:grid; grid-template-columns:1.5fr 1fr; gap:40px; align-items:center; background:#f0eafa; padding:30px; border-radius:24px; }
.future-label { font-size:11px; font-weight:800; color:#654586; letter-spacing:1px; }
.future-feature h2 { font-size:30px; margin:12px 0; color:#654586; }
.future-feature p { font-size:14px; }
.future-disclaimer { border-left:2px solid #cbb9e0; padding-left:24px; }
.summary-section { background:#e5f6f8; padding:64px 0; }
.summary-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; max-width:980px; }
.summary-grid h2 { font-size:48px; margin:18px 0 24px; color:var(--ink); }
.summary-note { font-size:13px; color:#486a73; }
.summary-card { background:white; border:1px solid #b9dce3; border-radius:26px; padding:28px; }
.summary-card label,.summary-card legend { font-weight:600; font-size:14px; }
.summary-card select { display:block; width:100%; font:500 17px var(--body); color:var(--deep); background:white; border:1px solid #85b9c5; border-radius:12px; padding:14px; margin:8px 0 24px; }
.summary-card fieldset { padding:0; margin:0; border:0; min-width:0; }
.stepper { display:flex; align-items:center; justify-content:space-between; max-width:180px; margin:14px 0; border:1px solid #b9dce3; border-radius:14px; }
.stepper button { width:48px; min-height:48px; border:0; border-radius:13px; background:#eaf7fa; color:var(--deep); font-size:24px; }
.stepper button:disabled { opacity:.45; cursor:default; }
.stepper output { font-weight:700; font-size:20px; }
.summary-card fieldset p,#single-child { font-size:13px; }
.price-breakdown { border-top:1px solid #d4e7ec; margin-top:24px; padding-top:18px; font-size:14px; }
.price-breakdown p:not(:last-child) { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.price-breakdown p span:last-child { white-space:nowrap; }
.total-row { padding-top:18px; border-top:1px solid #d4e7ec; }
#total-price { font:600 30px var(--display); white-space:nowrap; }
#certificate-note { font-size:12px; }
.checkout-status { background:#fff5d7; padding:18px; border-radius:14px; margin-top:24px; font-size:13px; color:#655224; }
.checkout-status p { margin-top:8px; }
.plans-faq { background:var(--paper); padding:56px 0 64px; }
.plans-faq .wrap { max-width:820px; }
.plans-faq h2 { font-size:38px; color:var(--ink); margin-bottom:28px; }
.plans-faq details { border-bottom:1px solid #ccdee2; padding:8px 0; }
.plans-faq summary { display:flex; align-items:center; justify-content:space-between; gap:20px; list-style:none; min-height:56px; padding:12px 0; font-weight:600; }
.plans-faq summary::after { content:'+'; flex-shrink:0; font-size:24px; }
.plans-faq details[open] summary::after { content:'−'; }
.plans-faq details p { padding:0 24px 18px 0; font-size:14px; }
.plans-footer { display:flex; align-items:center; justify-content:space-between; gap:28px; font-size:13px; }
.plans-footer img { width:140px; }
[hidden] { display:none !important; }
#test-checkout { border-top:1px solid #d4e7ec; padding-top:24px; margin-top:24px; }
#test-checkout h3 { font-size:25px; margin-bottom:14px; }
#test-checkout p { font-size:14px; margin:12px 0; }
#test-checkout input:not([type="checkbox"]) { width:100%; padding:12px; border:1px solid #85b9c5; border-radius:12px; margin:8px 0 16px; font-size:16px; }
#test-checkout button { width:100%; margin:14px 0; border:0; cursor:pointer; }
#test-checkout button:disabled { opacity:.6; cursor:wait; }
#test-checkout .checkout-small { font-size:12px; }
.account-action { min-height:44px; background:#eaf7fa; color:var(--deep); border-radius:12px; padding:10px; }
.test-consent { display:flex; gap:12px; align-items:flex-start; margin-top:20px; }
.test-consent input { flex:0 0 22px; width:22px; height:22px; }
#checkout-message { color:#9c294b; }
#checkout-current { border-top:1px solid #d4e7ec; padding-top:24px; margin-top:24px; }
@media(max-width:960px) and (min-width:721px) {
  .plan-grid { gap:12px; }
  .plan-card { padding:24px 16px; }
  .plan-description { min-height:70px; }
  .plan-price { font-size:34px; }
  .plan-button { font-size:18px; }
  .summary-grid { gap:36px; }
}
@media(max-width:720px) {
  .plans-header { padding: max(20px, env(safe-area-inset-top)) 0 18px; }
  .plans-header img { width:92px; }
  .plans-header>a:last-child { font-size:17px; }
  .plans-intro { padding:20px 0 32px; }
  .intro-brand { gap:12px; }
  .intro-brand img { width:54px; }
  .intro-brand .eyebrow { font-size:10px; letter-spacing:1px; }
  .plans-intro h1 { font-size:36px; }
  .plans-intro h1 br { display:none; }
  .plans-intro h1 span { display:block; margin-top:6px; }
  .plans-intro h1+p { font-size:15px; margin:20px auto; }
  .preview-notice { padding:16px; text-align:left; font-size:13px; }
  .plans-section { padding:28px 0 36px; }
  .plan-grid { grid-template-columns:minmax(0,1fr); gap:22px; }
  .plan-card { padding:26px; }
  .plan-description { min-height:0; font-size:15px; }
  .plan-card li { font-size:15px; }
  .card-footnote { font-size:13px; }
  .shared-benefits { text-align:left; }
  .future-feature { grid-template-columns:minmax(0,1fr); padding:24px; gap:20px; }
  .future-disclaimer { border-left:0; border-top:1px solid #cbb9e0; padding:18px 0 0; }
  .summary-section { padding:36px 0; }
  .summary-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
  .summary-grid h2 { font-size:38px; }
  .summary-grid h2 br { display:none; }
  .summary-card { padding:24px 20px; }
  .plans-faq { padding:36px 0; }
  .plans-faq h2 { font-size:32px; }
  .plans-footer { flex-direction:column; align-items:flex-start; gap:20px; }
  .plans-footer>a:last-child { min-height:44px; display:flex; align-items:center; }
}