.pricing-page{--pattern-hero:url(../assets/patterns/one-and-many-dark.svg);--pattern-tint:url(../assets/patterns/sparkle-field-dark.svg)}
:root[data-theme="light"] .pricing-page{--pattern-hero:url(../assets/patterns/one-and-many-paper.svg);--pattern-tint:url(../assets/patterns/sparkle-field-paper.svg)}

.pricing-page #main > .section:nth-of-type(even){background:var(--pattern-tint) var(--tint);--surface:var(--tint-surface)}

.pricing-hero{padding:72px 0 64px}
.pricing-hero::before{content:"";position:absolute;right:calc(50% - 740px);top:-90px;width:460px;height:460px;background:var(--pattern-hero) center/contain no-repeat;pointer-events:none}
.pricing-hero .wrap{position:relative}
.pricing-hero .hero-top{margin-bottom:48px}
.pricing-hero .hero-top h1{max-width:20ch}
.pricing-hero .fixed-note{margin-bottom:0}

.pricing-hero .ratio{max-width:886px}
.pricing-hero .ratio-row{grid-template-columns:216px minmax(0,1fr)}
.pricing-hero .ratio figcaption{margin-left:230px}

.typical-figure{--surface:var(--aik-black);--text:var(--aik-off-white);--muted:var(--aik-grey);--line:var(--aik-line);--accent-text:var(--aik-gold);color-scheme:dark;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px 32px;margin:0 0 16px;padding:22px 28px;background:var(--surface) url(../assets/patterns/leg-lines-dark.svg);color:var(--text);border:1px solid var(--line);border-radius:var(--aik-radius-card)}
.typical-figure-amount{margin:0;font-family:var(--aik-font-heading);font-weight:600;font-size:30px;line-height:1.15;color:var(--accent-text);white-space:nowrap}
.typical-figure-note{margin:0;font-size:16px;color:var(--muted);max-width:60ch;border-left:1px solid var(--line);padding-left:31px}
.typical-list{list-style:none;margin:0;padding:0}
.typical-card{gap:12px}

.typical-for{color:var(--muted)}
.typical-has{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.typical-has li{position:relative;padding-left:18px;font-size:15px;line-height:1.45}
.typical-has li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:2px;background:var(--accent)}
.typical-card .typical-lines dd{font-size:14px;line-height:1.5;color:var(--muted)}
.typical-lines{margin:auto 0 0;padding:14px 0 0;border-top:1px dashed var(--line);display:grid;gap:10px}
.typical-lines > div{display:grid;gap:3px}
.typical-lines dt{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.typical-lines dd{margin:0;font-size:15px}
#typical .todo{display:inline-block;border:1px dashed var(--accent);border-radius:6px;padding:1px 8px}
.typical-hosting{margin-top:16px;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--aik-radius-card);padding:18px 20px}
.typical-hosting h3{font-size:18px}
.typical-hosting p{margin:0;font-size:15px}
.typical-note{margin:16px 0 0;font-size:14px;color:var(--muted);max-width:70ch}

.ledger{list-style:none;margin:0;padding:0;border-top:1px solid var(--text)}
.ledger > li{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:40px;padding:30px 0;border-bottom:1px solid var(--line);scroll-margin-top:90px}
.ledger-key{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.ledger-n{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.ledger-key h3{font-size:20px}
.ledger-term{margin:4px 0 0;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);padding-top:8px;border-top:2px solid var(--accent)}
.ledger-body{min-width:0}
.ledger-body > p{max-width:64ch}

.receipt{margin-top:22px;max-width:560px;background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:var(--aik-radius-card);padding:20px 22px 18px}
.receipt-head{margin:0 0 12px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.receipt-lines{margin:0;padding:0}
.receipt-lines > div{display:flex;align-items:baseline;gap:10px;padding:6px 0;font-size:15px;line-height:1.4}
.receipt-lines dt{flex:1 1 auto;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;min-width:0}
.receipt-lines dt::after{content:"";flex:1 0 24px;align-self:flex-end;margin-bottom:5px;border-bottom:1px dotted var(--muted);opacity:.7}
.receipt-lines dd{margin:0;flex:none;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.receipt-totals{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.receipt-totals dd{color:var(--text);font-weight:600}
.receipt-due{margin-top:4px;padding-top:10px !important;border-top:1px solid var(--accent)}
.receipt-due dt,.receipt-due dd{font-weight:600;color:var(--accent-text)}
.receipt-foot{margin:14px 0 0;padding-top:12px;border-top:1px dashed var(--line);font-size:13px;color:var(--muted)}

.cr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,250px);gap:0 28px;margin:22px 0 12px}
.cr-label{display:block;margin:0;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cr-examples .cr-label{padding-bottom:10px;border-bottom:1px solid var(--line)}
.cr-examples ul{list-style:none;margin:0;padding:0}
.cr-examples li{position:relative;padding:11px 0 11px 24px;border-bottom:1px solid var(--line);font-size:16px;line-height:1.45}

.cr-examples li::before,.cr-examples li::after{content:"";position:absolute;left:0;top:22px;width:10px;height:2px;background:var(--accent)}
.cr-examples li::after{transform:rotate(90deg)}
.cr-price{display:flex;flex-direction:column;justify-content:center;gap:4px;margin:0;padding:20px 24px;background:var(--pattern-tint) var(--tint);border:1px solid var(--line);border-radius:var(--aik-radius-card)}
.cr-price .cr-label{margin-bottom:8px}
.cr-price b{font-family:var(--aik-font-heading);font-weight:600;font-size:30px;line-height:1.15;color:var(--accent-text)}
.cr-when{font-size:16px;line-height:1.4}
.cr-note{font-size:13px;color:var(--muted);margin:0 0 14px}
.cr-bug{margin:0;font-weight:500}

.meter-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.meter-head h3{margin:0}
.meter-currency{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line);border-radius:999px}
.meter-currency button{min-width:38px;height:30px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:15px;font-weight:500;line-height:1;cursor:pointer}
.meter-currency button:hover{color:var(--text)}
.meter-currency button[aria-pressed="true"]{background:var(--text);color:var(--surface);font-weight:600}

.meter-out .meter-note span,.meter-out small span{display:inline;margin:0;font-size:inherit;letter-spacing:0;text-transform:none;color:inherit}

.cost-grid td.n{white-space:nowrap}

.cost-grid > div{min-width:0}
.cost-table-scroll{overflow-x:auto}

.cost-bars{margin:20px 0 0;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--aik-radius-card)}
.cost-bar-row{display:grid;grid-template-columns:190px minmax(0,1fr) minmax(112px,auto);gap:14px;align-items:center;margin-bottom:8px}
.cost-bar-name{font-size:14px;color:var(--muted)}
.cost-bar{display:flex;gap:3px;height:26px;min-width:0}
.cost-bar i{display:block;flex:var(--part) 1 0;min-width:0;border-radius:4px}
.cost-bar-row strong{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.cb-builds{background:var(--text)}
.cb-rest{background:var(--muted)}
.cb-outside{border:1px solid var(--muted)}
.cb-ours{background:var(--accent)}
.cb-saved{border:1px dashed var(--line)}
.cost-bars figcaption{margin-top:12px;font-size:13px;line-height:1.5;color:var(--muted)}
.cost-bars figcaption p{margin:8px 0 0;font-size:14px}
.cost-bars figcaption strong{color:var(--text)}
.cost-key{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 20px}
.cost-key i{display:inline-block;width:10px;height:10px;margin-right:7px;border-radius:2px;vertical-align:-1px;box-sizing:border-box}
@media (max-width:720px){
  .cost-bars{padding:14px}
  .cost-bar-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;margin-bottom:12px}
  .cost-bar{grid-column:1 / -1;order:3}
  .cost-grid table{font-size:14px}
  .cost-grid th,.cost-grid td{padding-left:5px;padding-right:5px}
  .cost-grid th{font-size:10.5px;letter-spacing:.06em}
  .cost-grid tr.total td.n{white-space:normal}
}

.refusals{list-style:none;margin:0;padding:0}
.refusals li{position:relative;padding:8px 0 8px 22px;border-bottom:1px dashed var(--line)}
.refusals li:last-child{border-bottom:0}
.refusals li::before{content:"";position:absolute;left:0;top:19px;width:10px;height:2px;background:var(--muted)}

.compare{margin:0 0 28px;font-size:15px}
.compare thead th{padding-top:0}
.compare tbody th{font-family:var(--aik-font-heading);font-weight:600;font-size:15px;letter-spacing:0;text-transform:none;color:var(--text);width:22%}
.compare td{width:39%}
.compare td:nth-child(2){color:var(--muted)}
.compare td:last-child{border-left:2px solid var(--accent);padding-left:16px}
.compare thead th:last-child{color:var(--accent-text);padding-left:16px}
.saving-note{margin-bottom:36px}

.not-shrink{margin-top:40px}
.not-shrink h3{margin-bottom:0}
.not-shrink .four-lines{margin-top:16px}

.pricing-cta .hero-actions{margin-top:24px}
.pricing-cta h2{margin-bottom:12px}

@media (max-width:960px){
  .pricing-hero::before{width:380px;height:380px;right:-140px;top:-90px}
  .ledger > li{grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:28px}
  .cr{grid-template-columns:minmax(0,1fr);gap:14px 0}
  .cr-price{flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;gap:4px 12px;padding:14px 18px}
  .cr-price .cr-label{flex-basis:100%;margin-bottom:2px}
  .cr-price b{font-size:24px}
}
@media (max-width:720px){
  .pricing-hero{padding:44px 0 48px}
  .pricing-hero::before{width:300px;height:300px;right:-150px;top:-110px}
  .ledger > li{grid-template-columns:minmax(0,1fr);gap:14px;padding:24px 0}
  .ledger-key{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
  .ledger-term{flex-basis:100%;border-top:0;padding-top:0;margin:0;display:flex;align-items:center;gap:8px}
  .ledger-term::before{content:"";width:16px;height:2px;background:var(--accent)}
  .receipt{padding:16px 14px 14px}
  .receipt-lines > div{font-size:14px}

  .compare thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .compare,.compare tbody,.compare tr,.compare th,.compare td,.compare tbody th{display:block;width:auto}
  .compare tr{padding:14px 0;border-bottom:1px solid var(--line)}
  .compare tbody th,.compare td{border-bottom:0;padding:4px 0}
  .compare td:last-child{padding-left:12px;margin-top:6px}
  .compare td::before{content:attr(data-label);display:block;font-family:var(--aik-font-body);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
  .compare td:last-child::before{color:var(--accent-text)}
}
@media (max-width:720px){
  .typical-figure{grid-template-columns:minmax(0,1fr);padding:18px}
  .typical-figure-amount{font-size:26px}
  .typical-figure-note{border-left:0;padding-left:0}
  .pricing-hero .ratio-row{grid-template-columns:1fr}
  .pricing-hero .ratio figcaption{margin-left:0}
}