:root { --paper:#f3f5f7; --line:#d4dae3; --muted:#617084; }
body { background:#dfe4ea; }

.packages { padding:58px clamp(24px,4vw,54px) 64px; background:var(--paper); }
.packages-head { margin-bottom:30px; display:grid; grid-template-columns:1.15fr .85fr; align-items:end; gap:64px; }
.packages .eyebrow { margin:0 0 11px; color:#0067e8; font-size:9px; font-weight:850; letter-spacing:.14em; text-transform:uppercase; }
.packages-head > p { max-width:410px; margin:0 0 4px; color:var(--muted); font-size:15px; line-height:1.55; }

.package-chooser { display:grid; grid-template-columns:minmax(0,.88fr) minmax(360px,1.12fr); border:1px solid var(--ink); background:#fff; }
.chooser-feature { min-width:0; padding:clamp(25px,3.5vw,46px); display:flex; flex-direction:column; color:#fff; background:#080b10; }
.stage-capacity { margin:0 0 9px; color:#8dbfff; font-size:8px; font-weight:820; letter-spacing:.09em; text-transform:uppercase; }
.chooser-feature h3 { max-width:430px; margin:0; font-size:clamp(38px,5vw,70px); line-height:.85; letter-spacing:-.075em; }
.stage-rate { margin:24px 0 0; display:flex; align-items:baseline; }
.stage-rate strong { font-size:clamp(28px,3.2vw,40px); line-height:1; letter-spacing:-.06em; }
.stage-rate small { color:#9ba8b8; font-size:9px; font-weight:700; letter-spacing:0; }
.stage-summary,.stage-truth { max-width:430px; margin:15px 0 0; color:#bcc5d0; font-size:clamp(9px,1.05vw,13px); line-height:1.5; }
.stage-truth { margin-bottom:22px; }
.primary-action { min-height:46px; margin-top:auto; padding:0 18px; border:0; display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; color:#fff; background:#0067e8; font:inherit; font-size:10px; font-weight:820; cursor:pointer; }
.primary-action:focus-visible { outline:3px solid #88beff; outline-offset:3px; }

.chooser-list { display:grid; grid-template-rows:repeat(4,1fr); }
.chooser-row { min-width:0; min-height:106px; padding:12px 14px; border:0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:76px minmax(0,1fr) auto; align-items:center; gap:16px; color:var(--ink); background:#fff; font:inherit; text-align:left; cursor:pointer; }
.chooser-row:last-child { border-bottom:0; }
.chooser-row:hover { background:#f7f9fb; }
.chooser-row[aria-selected="true"] { background:#edf5ff; box-shadow:inset 4px 0 #0067e8; }
.chooser-row:focus-visible { position:relative; z-index:1; outline:3px solid #0067e8; outline-offset:-3px; }
.chooser-row img { width:76px; height:76px; display:block; object-fit:cover; }
.chooser-row-copy { min-width:0; display:block; }
.chooser-row-copy b { display:block; overflow:hidden; font-size:clamp(14px,1.5vw,19px); letter-spacing:-.04em; text-overflow:ellipsis; white-space:nowrap; }
.chooser-row-copy > span { display:block; margin-top:4px; color:var(--muted); font-size:8px; font-weight:720; letter-spacing:.02em; text-transform:uppercase; }
.chooser-row > strong { font-size:clamp(15px,1.5vw,20px); letter-spacing:-.045em; }
.mobile-view-all-wrap { display:none; }

@media (max-width:820px) {
  .packages { padding-inline:18px; }
  .packages-head { grid-template-columns:1fr; gap:18px; }
  .packages-head > p { max-width:560px; }
}

@media (max-width:700px) {
  .package-chooser { grid-template-columns:1fr; }
  .chooser-feature { min-height:330px; padding:26px 22px; }
  .chooser-feature h3 { font-size:50px; }
  .primary-action { width:100%; justify-content:center; }
  .chooser-row { min-height:84px; grid-template-columns:58px minmax(0,1fr) auto; gap:11px; }
  .chooser-row img { width:58px; height:58px; }
  .chooser-row-copy b,.chooser-row > strong { font-size:15px; }
}

@media (max-width:520px) {
  body { background:#fff; }
  .packages { padding:36px 14px 40px; }
  .packages-head { margin-bottom:16px; gap:0; }
  .packages .eyebrow { margin-bottom:7px; }
  .packages .packages-head h2 { font-size:36px; line-height:.9; }
  .packages-head > p,.stage-summary { display:none; }
  .chooser-feature { min-height:0; padding:18px; }
  .stage-capacity { margin-bottom:6px; }
  .chooser-feature h3 { font-size:40px; }
  .stage-rate { margin-top:12px; }
  .stage-rate strong { font-size:30px; }
  .stage-truth { margin:10px 0 14px; font-size:9px; line-height:1.35; }
  .primary-action { min-height:44px; margin-top:0; }
  .chooser-row {
    min-height:70px;
    padding:8px 10px;
    grid-template-columns:52px minmax(0,1fr) auto;
    gap:10px;
  }
  .chooser-row img { width:52px; height:52px; }
  .chooser-row-copy b,.chooser-row > strong { font-size:15px; }
  .mobile-view-all-wrap {
    margin-top:9px;
    display:flex;
    justify-content:flex-end;
  }
  .mobile-view-all-packages {
    min-height:36px;
    padding:0 12px;
    border:1px solid #071321;
    display:inline-flex;
    align-items:center;
    gap:13px;
    color:#071321;
    background:#fff;
    font-size:10px;
    font-weight:800;
    text-decoration:none;
  }
  .mobile-view-all-packages span {
    color:#0067e8;
    font-size:14px;
    font-weight:700;
  }
  .mobile-view-all-packages:hover { background:#edf5ff; }
  .mobile-view-all-packages:focus-visible {
    outline:3px solid #0067e8;
    outline-offset:2px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .chooser-row,.primary-action { transition:none; }
}