/* Pricing presentation. The overview is separate from selectable bundle cards. */
:root { --site-header-height: 80px; }
html { scroll-padding-top: calc(var(--site-header-height) + 16px); }
.view { scroll-margin-top: calc(var(--site-header-height) + 16px); }
html.embedded body { padding-top: var(--site-header-height); min-height: 0; overflow: hidden; }
html.embedded .app-nav { display: none; }
.app-nav { position: sticky; top: 0; z-index: 50; background: rgba(12,19,34,.94); border-bottom: 1px solid rgba(255,255,255,.07); backdrop-filter: blur(18px); }
.app-nav-inner { max-width: 1180px; min-height: 80px; padding: 14px 28px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.app-brand { display: inline-flex; align-items: center; gap: 9px; color: #f7f9ff; text-decoration: none; flex-shrink: 0; }
.app-brand img { display: block; width: 34px; height: 34px; object-fit: contain; }
.brand-name { font-size: 18px; font-weight: 800; letter-spacing: -.035em; }
.app-nav-actions { display: flex; align-items: center; gap: 20px; }
.pricing-languages { display: flex; align-items: center; gap: 2px; }
.pricing-languages a { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 40px; color: #98a7c1; font-size: 11px; font-weight: 650; text-decoration: none; border-radius: 8px; }
.pricing-languages a[aria-current] { color: #f3f6ff; background: rgba(255,255,255,.06); }
.ava-access { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 10px 21px; border-radius: 999px; background: linear-gradient(135deg,#3f8cff,#7859ff); color: white; font-size: 13px; font-weight: 650; text-decoration: none; line-height: 1.5; transition: filter .2s,transform .2s; }
.ava-access:hover { filter: brightness(1.08); transform: translateY(-1px); }
[data-view="home"] .hero { padding: 48px 0 24px; }
[data-view="home"] .hero h1 { font-size: clamp(34px,4.5vw,62px); line-height: 1.08; letter-spacing: -.05em; max-width: 890px; }
[data-view="home"] .hero p { max-width: 620px; font-size: 15px; margin-top: 20px; color: #aebbd0; }
.pricing-navigation { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px; margin: 0 auto 28px; padding: 4px 0; }
.pricing-navigation a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 17px; color: #a8b5cb; border-radius: 999px; text-decoration: none; font-size: 12px; font-weight: 550; line-height: 1.4; transition: background .2s,color .2s; }
.pricing-navigation a:hover { color: #f3f6ff; background: rgba(255,255,255,.035); }
.pricing-navigation a.active { color: #f0f4ff; background: rgba(143,163,217,.1); }
.agent-overview-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.agent-card { display: grid; grid-template-rows: auto auto auto 1fr auto 18px; align-content: start; min-width: 0; padding: 28px; border: 1px solid rgba(var(--agent-rgb),.23); border-radius: 22px; background: linear-gradient(150deg,rgba(var(--agent-rgb),.075),rgba(13,20,35,.9)); box-shadow: 0 8px 24px rgba(0,0,0,.13); transition: border-color .2s; }
.agent-card:hover { border-color: rgba(var(--agent-rgb),.4); }
.agent-category { color: var(--agent-light); font-size: 10px; font-weight: 700; letter-spacing: .11em; line-height: 1.5; }
.agent-card h2 { margin: 14px 0 8px; color: #f0f4fc; font-size: 30px; font-weight: 700; line-height: 1.2; letter-spacing: -.04em; }
.agent-status { display: inline-flex; align-items: center; justify-self: start; gap: 7px; color: var(--agent-light); font-size: 11px; font-weight: 550; line-height: 1.6; }
.agent-status::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--agent-accent); }
.agent-description { margin: 20px 0 24px; color: #b3bfd3; font-size: 13px; line-height: 1.75; }
.agent-pricing-link { display: inline-flex; align-items: center; justify-content: center; justify-self: start; gap: 12px; min-height: 46px; padding: 10px 20px; border-radius: 999px; background: linear-gradient(135deg,var(--agent-accent-2),color-mix(in srgb,var(--agent-accent-2) 86%,#000)); color: #fff; font-size: 13px; font-weight: 650; line-height: 1.5; text-decoration: none; transition: filter .2s,transform .2s; }
.agent-card[data-agent="ava"] .agent-pricing-link { background: linear-gradient(135deg,#3f8cff,#7859ff); }
.agent-pricing-link:hover { filter: brightness(1.1); transform: translateY(-1px); }
.agent-card .agent-trial { margin: 10px 0 0; color: #9aaeca; font-size: 10px; line-height: 1.6; }
.pricing-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; max-width: 1076px; margin: 0 auto; padding: 24px 0 32px; border-top: 1px solid rgba(255,255,255,.08); color: #8797b0; font-size: 12px; }
.pricing-footer a { display: inline-flex; align-items: center; min-height: 40px; color: #bac7df; text-decoration: underline; text-underline-offset: 4px; }
@media(max-width:1100px) {
  .agent-overview-grid { gap: 16px; }
  .agent-card { padding: 24px; }
  .pricing-footer { margin-inline: 22px; }
}
@media(min-width:641px) and (max-width:900px) {
  .agent-overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .agent-card:last-child { grid-column: 1 / -1; width: calc((100% - 16px) / 2); justify-self: center; }
}
@media(max-width:640px) {
  :root { --site-header-height: 72px; }
  .app-nav-inner { min-height: 72px; padding: 12px 18px; gap: 12px; }
  .app-nav-actions { gap: 10px; }
  .app-brand { gap: 6px; }
  .app-brand img { width: 27px; height: 27px; }
  .brand-name { font-size: 16px; }
  .ava-access { min-height: 42px; padding: 9px 13px; font-size: 11px; }
  .pricing-languages a { min-width: 27px; font-size: 10px; }
  [data-view="home"] .hero { padding: 32px 0 18px; }
  [data-view="home"] .hero p { font-size: 13px; line-height: 1.7; margin-top: 16px; }
  .pricing-navigation { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; max-width: 370px; margin-bottom: 22px; }
  .pricing-navigation a { min-height: 38px; padding: 8px 10px; font-size: 11px; }
  .agent-overview-grid { grid-template-columns: 1fr; gap: 16px; }
  .agent-card { grid-template-rows: auto auto auto 1fr auto; padding: 24px; }
  .agent-card .agent-trial { margin-top: 12px; }
  .agent-description { margin: 16px 0 20px; }
}

/* Existing plan selection, comparisons and capacity controls. */
.three-plans, .standard-configurator .pricing.three-plans,
[data-view="zoe"] .plans.three-plans { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.three-plans > :is(.card,.plan) { display: flex; flex-direction: column; min-width: 0; opacity: 1 !important; }
.three-plans > :is(.card,.plan) > .choose { margin-top: auto; }
.three-plans .features, .three-plans .feature-list { margin-bottom: 24px; }
.standard-configurator .pricing .standard-plan-top { padding-right: 0; min-height: var(--plan-heading-height,100px); align-items: flex-start; }
.plan-badge-row { min-height: 34px; display: flex; align-items: flex-start; }
.standard-configurator .pricing .card .pop, [data-view="zoe"] .popular { position: static; align-self: flex-start; margin-bottom: 16px; }
.standard-configurator .pricing .card:has(.pop) .standard-plan-top { min-height: var(--plan-heading-height,100px); }
.standard-configurator .pricing .card.plan-selected, .standard-configurator .pricing .card.plan-selected.premium-tilt { transform: none !important; filter: none; }
[data-view="zoe"] .plan-top { min-height: 105px; }
.standard-configurator .pricing .title, [data-view="zoe"] .plan-name { font-size: 18px; }
.standard-configurator .pricing .price, [data-view="zoe"] .plan .price { font-size: clamp(30px,3.5vw,44px); }
.plan-capacity { color: var(--agent-light,#b8c9ff); font-size: 13px; font-weight: 750; line-height: 1.5; margin: 8px 0 14px; }
.plan-unit-rate { display: block; color: var(--muted); font-size: 11px; font-weight: 500; }
.availability-badge { display: inline-flex; align-items: center; width: max-content; max-width: 100%; border: 1px solid rgba(var(--agent-rgb,155,171,214),.32); background: rgba(var(--agent-rgb,155,171,214),.08); color: var(--agent-light,#becbf0); padding: 6px 10px; border-radius: 999px; font-size: 11px; font-weight: 750; margin-top: 12px; }
.agent > .availability-badge { display: table; margin: 12px 0 0; }
.hero .availability-intro { max-width: 680px; font-size: 14px; margin-top: 10px; }
.hero .monthly-only { font-size: 12px; margin: 23px auto; color: #b4bfd4; }
.capacity-control { margin: 18px 0 12px; padding: 18px 20px; border: 1px solid rgba(var(--agent-rgb,111,140,255),.25); border-radius: 18px; background: rgba(13,22,40,.6); }
.capacity-label { display: block; font-size: 14px; font-weight: 750; margin-bottom: 14px; }
.capacity-inputs { display: flex; align-items: center; gap: 10px; }
.capacity-range { min-width: 60px; flex: 1; width: 100%; height: 40px; accent-color: var(--agent-accent,#6f8cff); cursor: pointer; touch-action: pan-y; }
.capacity-range::-webkit-slider-thumb { width: 24px; height: 24px; }
.capacity-number { width: 100px; min-height: 42px; padding: 8px; color: #f5f7ff; background: #101a2d; border: 1px solid #536180; border-radius: 9px; text-align: center; }
.capacity-step { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%; border: 1px solid #536180; background: #17243b; color: white; font-size: 20px; }
.capacity-step:disabled { opacity: .4; cursor: default; }
.capacity-note { font-size: 11px; color: #aebbd0; line-height: 1.6; }
.capacity-details { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-top: 16px; }
.capacity-detail small { display: block; color: #a3b2ca; font-size: 10px; margin-bottom: 5px; }
.capacity-detail strong { display: block; color: #f3f6ff; font-size: 13px; line-height: 1.4; }
.configuration-error { color: #ffc1b8; font-size: 12px; line-height: 1.5; margin: 10px 0 0; }
.configuration-error:empty { display: none; }
.plan-suggestion { margin-top: 14px; display: flex; gap: 16px; align-items: center; border-top: 1px solid rgba(255,255,255,.09); padding-top: 12px; }
.plan-suggestion:empty { display: none; }
.plan-suggestion p { margin: 0; flex: 1; font-size: 12px; line-height: 1.6; color: #b9c8e4; }
.suggestion-action { flex-shrink: 0; min-height: 40px; border: 1px solid rgba(var(--agent-rgb,111,140,255),.6); border-radius: 10px; padding: 8px 14px; background: rgba(var(--agent-rgb,111,140,255),.12); color: var(--agent-light,#c3d0fa); font-size: 12px; font-weight: 750; }
.pricing-review, .standard-configurator .config-total.pricing-review, [data-view="zoe"] .checkout-strip.pricing-review { display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding: 20px; border-radius: 18px; background: linear-gradient(115deg,rgba(var(--agent-rgb,111,140,255),.09),rgba(var(--agent-rgb,111,140,255),.025)); border: 1px solid rgba(var(--agent-rgb,111,140,255),.25); }
.pricing-review-lines { display: grid; gap: 8px; }
.review-line { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; font-size: 12px; color: #b9c5db; }
.review-line strong { color: #eff4ff; text-align: right; }
.pricing-review .standard-checkout-total { justify-content: space-between; }
.pricing-review .config-amount { font-size: 27px; letter-spacing: -.03em; }
.pricing-review .standard-cta { border: 0; border-radius: 12px; padding: 13px 18px; background: var(--agent-button-gradient,linear-gradient(135deg,#405fc5,#6f8cff)); color: white; font-weight: 750; min-height: 44px; }
.pricing-review .standard-cta:disabled { opacity: .5; cursor: default; }
.simulation-label { color: var(--agent-light,#bed0ff); font-size: 12px; }
.option-status { grid-column: 2 / -1; color: var(--agent-light,#bfcbdf); font-size: 11px; line-height: 1.5; margin: 0; }
.option-status:empty { display: none; }
.three-plan-comparison { overflow-x: auto; }
.three-plan-comparison .bhead, .three-plan-comparison .brow,
[data-view="zoe"] .three-plan-comparison .breakdown-head, [data-view="zoe"] .three-plan-comparison .feature-row { grid-template-columns: minmax(230px,1.5fr) repeat(3,minmax(140px,1fr)); min-width: 720px; }
.comparison-price { display: block; font-size: 11px; color: #aab9d3; margin-top: 5px; }
.checkout-capacity-row strong { max-width: 60%; }
.launch-dialog { width: min(500px,calc(100vw - 32px)); padding: 0; border: 1px solid #455579; border-radius: 22px; background: linear-gradient(150deg,#1a2942,#10192b); color: #f3f6ff; box-shadow: 0 24px 100px #0008; max-height: calc(100dvh - 40px); }
.launch-dialog::backdrop { background: #080d19bd; backdrop-filter: blur(5px); }
.launch-form { display: grid; gap: 16px; padding: 28px; position: relative; }
.launch-form h2 { margin: 5px 24px 0 0; font-size: 23px; }
.launch-form p { margin: 0; font-size: 13px; color: #bdc9dc; line-height: 1.6; }
.launch-form label { display: grid; gap: 7px; font-size: 13px; }
.launch-form input:not([type="checkbox"]),.launch-form select { width: 100%; min-height: 44px; padding: 10px; background: #0e192a; color: #f5f7ff; border: 1px solid #516282; border-radius: 9px; }
.launch-form .launch-consent { display: flex; align-items: flex-start; line-height: 1.5; }
.launch-consent input { width: 18px; height: 18px; flex-shrink: 0; accent-color: #7b98ef; }
.launch-close { position: absolute; top: 12px; right: 12px; height: 32px; width: 32px; border-radius: 50%; background: #293953; color: white; border: 1px solid #50607b; font-size: 24px; }
.launch-selection { padding: 12px; border-radius: 10px; background: #24365466; }
:is(button,input,select,a):focus-visible { outline: 3px solid var(--agent-light,#a5bdff); outline-offset: 3px; }
@media(max-width:1050px) { .three-plans, .standard-configurator .pricing.three-plans, [data-view="zoe"] .plans.three-plans { gap: 12px; } .three-plans > :is(.card,.plan) { padding: 19px; } .standard-configurator .pricing .standard-plan-icon { display: none; } }
@media(max-width:800px) { .three-plans, .standard-configurator .pricing.three-plans, [data-view="zoe"] .plans.three-plans { grid-template-columns: 1fr; } .standard-configurator .pricing .standard-plan-top, .standard-configurator .pricing .card:has(.pop) .standard-plan-top { min-height: 0; } .capacity-details { grid-template-columns: 1fr 1fr; } .plan-suggestion { align-items: flex-start; flex-direction: column; } }
@media(max-width:520px) { .capacity-control { padding: 16px 14px; } .capacity-inputs { flex-wrap: wrap; justify-content: flex-end; } .capacity-range { flex-basis: 100%; } .pricing-review .standard-checkout-total { align-items: stretch; flex-direction: column; gap: 14px; } .review-line { font-size: 11px; } .launch-form { padding: 22px; } }

/* Keep all three columns aligned and readable during comparison. */
.standard-configurator .pricing.three-plans .card:not(.plan-selected),
[data-view="zoe"] .plans.three-plans .plan { transform: none !important; filter: none !important; }
[data-view="zoe"] .plans.three-plans .plan-top { padding-right: 0; align-items: flex-start; }
[data-view="zoe"] .three-plans .plan-badge-row .popular,
.standard-configurator .three-plans .plan-badge-row .pop { margin-bottom: 0; }
@media(max-width:800px) { .plan-badge-row:empty { display:none; } [data-view="zoe"] .plan-top { min-height:0; } }

.trial-banner { display:table; margin:14px auto 0 !important; padding:9px 16px; border:1px solid rgba(111,140,255,.34); background:rgba(111,140,255,.10); color:#cad6ff !important; border-radius:999px; font-size:13px !important; font-weight:700; line-height:1.6; }
.trial-reassurance { margin:16px 0 10px; color:#bacbff; font-size:11px; line-height:1.6; text-align:center; }
.pricing-review > .trial-reassurance { margin:0; text-align:right; }
.view:not([data-view="home"]):not([data-view="enterprise"]):not([data-view="ava"]) .hero h1 { font-size:clamp(32px,4.5vw,58px); }
@media(max-width:520px) { .trial-banner { font-size:11px !important; padding:8px 12px; } .pricing-review > .trial-reassurance { text-align:center; } }


/* A tall three-card stack must remain visible when it enters a small screen. */
html.motion-ready .pricing.three-plans.premium-reveal { opacity:1; --reveal-y:0px; transform:none; }

/* Ava: one benefit, a guided start, then the existing plans. */
[data-view="ava"] { --plan-heading-height: 80px; }
[data-view="ava"] .ava-conversion { padding: 20px 0 12px; }
.ava-kicker { color: #bdc7f1; font-size: 11px; font-weight: 650; line-height: 1.6; letter-spacing: .12em; }
.ava-conversion h1 { max-width: 1040px; margin: 10px auto 0; color: #f3f5fc; font-size: clamp(34px,3.9vw,52px); font-weight: 700; line-height: 1.08; letter-spacing: -.045em; text-wrap: balance; }
.ava-conversion h1 > span { display: block; }
.ava-benefit-accent { color: #b3bfff; }
.ava-conversion .ava-intro { max-width: 760px; margin-top: 12px; color: #bdc8dc; font-size: 17px; line-height: 1.6; }
.ava-setup-promise { margin: 12px auto 0; }
.ava-conversion .ava-setup-promise > p { max-width: 900px; margin: 0 auto; color: #e0e6fc; font-size: 14px; font-weight: 600; line-height: 1.6; }
.ava-conversion .ava-setup-promise > .ava-setup-condition { margin-top: 4px; color: #aab8d0; font-size: 13px; font-weight: 400; }
.ava-journey { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 20px 0 0; padding: 0; list-style: none; text-align: left; border: 1px solid rgba(162,180,239,.17); border-radius: 18px; background: rgba(114,137,199,.045); overflow: hidden; }
.ava-journey li { display: grid; grid-template-columns: 22px minmax(0,1fr); align-content: start; gap: 8px 12px; padding: 18px; min-width: 0; }
.ava-journey li > div { display: contents; }
.ava-journey li + li { border-left: 1px solid rgba(162,180,239,.13); }
.ava-step-number { color: #95a8d7; font-size: 11px; font-weight: 600; line-height: 24px; font-variant-numeric: tabular-nums; }
.ava-journey h2 { margin: 0; color: #eef2fc; font-size: 16px; font-weight: 600; line-height: 1.5; letter-spacing: -.025em; }
.ava-conversion .ava-journey p { grid-column: 1 / -1; margin: 0; color: #b7c3d9; font-size: 13px; font-weight: 400; line-height: 1.65; text-wrap: pretty; }
.ava-journey .ava-journey-support { background: rgba(131,149,222,.07); }
.ava-journey-support .ava-step-number { color: #c6ceff; }
.ava-conversion-action { margin-top: 16px; }
.ava-plan-link { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 50px; padding: 12px 24px; border: 1px solid #d4dcf9; border-radius: 14px; background: #e8edff; color: #172139; font-size: 14px; font-weight: 650; line-height: 1.5; text-decoration: none; transition: background .18s, transform .18s; }
.ava-plan-link:hover { background: #f7f9ff; transform: translateY(-1px); }
.ava-plan-link:focus-visible { outline: 3px solid #b3bfff; outline-offset: 5px; }
.ava-conversion .ava-trial-note { margin: 8px auto 0; color: #aebcda; font-size: 11px; line-height: 1.6; }
.ava-plan-context { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; padding-top: 8px; border-top: 1px solid rgba(162,180,239,.12); }
.ava-plan-context .monthly-only { margin: 0; color: #b4bfd4; font-size: 12px; line-height: 1.6; }
.ava-plan-context .pricing-navigation { margin: 0; padding: 0; gap: 2px; }
.ava-plan-context .pricing-navigation a { min-height: 34px; padding: 6px 12px; font-size: 11px; }
#ava-plans { scroll-margin-top: calc(var(--site-header-height) + 16px); }
#ava-plans:focus-visible { outline: 2px solid #b3bfff; outline-offset: 6px; border-radius: 22px; }
@media(max-width:1000px) {
  .ava-journey li { grid-template-columns: 1fr; gap: 6px; padding: 18px; }
  .ava-journey h2 { font-size: 15px; }
}
@media(max-width:700px) {
  [data-view="ava"] .ava-conversion { padding: 26px 0 22px; }
  .ava-conversion h1 { margin-top: 14px; font-size: clamp(34px,5.5vw,40px); line-height: 1.1; }
  .ava-conversion h1 > span { display: inline; }
  .ava-conversion .ava-intro { margin-top: 16px; font-size: 17px; line-height: 1.6; }
  .ava-conversion .ava-setup-promise > p { font-size: 14px; }
  .ava-conversion .ava-setup-promise > .ava-setup-condition { margin-top: 6px; font-size: 13px; }
  .ava-journey { grid-template-columns: 1fr; margin-top: 24px; }
  .ava-journey li { grid-template-columns: 24px minmax(0,1fr); gap: 12px; padding: 20px; }
  .ava-journey li > div { display: block; }
  .ava-journey li + li { border-left: 0; border-top: 1px solid rgba(162,180,239,.13); }
  .ava-journey h2 { font-size: 16px; }
  .ava-conversion .ava-journey p { margin-top: 8px; font-size: 13px; }
  .ava-plan-context { flex-direction: column; gap: 10px; padding-top: 16px; }
  .ava-plan-context .pricing-navigation { display: flex; width: 100%; max-width: none; }
}
@media(prefers-reduced-motion:reduce) { .ava-plan-link { transition: none; } .ava-plan-link:hover { transform: none; } }