.pricing-page { color: var(--ink-text); background: var(--paper); }
.pricing-header { background: rgba(4, 10, 17, .88); backdrop-filter: blur(18px); }
.pricing-hero { position: relative; min-height: min(690px, 78svh); display: flex; overflow: hidden; isolation: isolate; color: var(--text); background: var(--ink); }
.pricing-hero-image, .pricing-hero-overlay { position: absolute; inset: 0; z-index: -2; }
.pricing-hero-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.pricing-hero-overlay { z-index: -1; background: linear-gradient(90deg, rgba(3, 8, 14, .97), rgba(3, 8, 14, .83) 38%, rgba(3, 8, 14, .3) 100%), linear-gradient(0deg, rgba(3, 8, 14, .55), transparent 55%); }
.pricing-hero-inner { min-height: inherit; display: flex; flex-direction: column; justify-content: flex-end; padding-top: 150px; padding-bottom: clamp(54px, 8vw, 100px); }
.pricing-hero-copy { max-width: 790px; }
.pricing-hero h1 { max-width: 760px; margin: 0; color: var(--text); font-family: var(--display); font-size: clamp(3rem, 7vw, 7.4rem); font-weight: 600; letter-spacing: -.07em; line-height: .92; }
.pricing-hero-copy > p:not(.eyebrow) { max-width: 540px; margin: 28px 0 0; color: rgba(246, 250, 248, .78); font-size: clamp(1rem, 1.5vw, 1.16rem); }
.pricing-hero-note { margin-top: 62px; color: rgba(246, 250, 248, .56); font-size: .7rem; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.pricing-section { padding: clamp(88px, 12vw, 150px) 0; }
.pricing-heading { display: grid; grid-template-columns: minmax(180px, .42fr) 1fr; gap: 40px; align-items: start; margin-bottom: 65px; }
.pricing-heading .eyebrow { margin-top: 10px; }
.pricing-heading h2 { max-width: 650px; margin: 0; color: var(--ink-text); font-family: var(--display); font-size: clamp(2.7rem, 5vw, 5.5rem); font-weight: 600; letter-spacing: -.06em; line-height: .95; }
.pricing-list { border-top: 1px solid var(--line-light); }
.pricing-row { display: grid; grid-template-columns: 54px minmax(260px, 1fr) minmax(140px, .35fr) auto; gap: clamp(20px, 4vw, 56px); align-items: center; padding: 31px 0; border-bottom: 1px solid var(--line-light); transition: padding .25s ease, background .25s ease; }
.pricing-row:hover { padding-inline: 20px; background: rgba(32, 196, 220, .08); }
.pricing-row-featured { background: rgba(20, 35, 45, .045); }
.pricing-number, .pricing-label { color: var(--cyan-dark); font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.pricing-number { align-self: start; padding-top: 7px; }
.pricing-info h3 { margin: 3px 0 0; color: var(--ink-text); font-family: var(--display); font-size: clamp(1.45rem, 2.35vw, 2.15rem); font-weight: 600; letter-spacing: -.045em; line-height: 1.05; }
.pricing-info > p:last-child { max-width: 505px; margin: 11px 0 0; color: var(--ink-muted); font-size: .88rem; line-height: 1.55; }
.pricing-cost { display: grid; gap: 3px; }
.pricing-cost strong { color: var(--ink-text); font-family: var(--display); font-size: clamp(2.25rem, 4vw, 3.8rem); font-weight: 600; letter-spacing: -.08em; line-height: .9; }
.pricing-cost span { color: var(--ink-muted); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.pricing-action { display: inline-flex; align-items: center; gap: 10px; width: fit-content; padding-bottom: 5px; border-bottom: 1px solid var(--ink-text); color: var(--ink-text); font-size: .79rem; font-weight: 700; white-space: nowrap; transition: color .2s ease, gap .2s ease, border-color .2s ease; }
.pricing-action:hover { gap: 16px; color: var(--cyan-dark); border-color: var(--cyan-dark); }
.pricing-cta { padding: clamp(72px, 9vw, 112px) 0; }
.pricing-cta-inner { display: flex; align-items: end; justify-content: space-between; gap: 34px; }
.pricing-cta h2 { max-width: 680px; margin: 0; color: var(--text); font-family: var(--display); font-size: clamp(2.5rem, 5vw, 5.5rem); font-weight: 600; letter-spacing: -.06em; line-height: .94; }
.pricing-cta .button { flex: 0 0 auto; }

@media (max-width: 980px) {
    .pricing-heading { grid-template-columns: 1fr; gap: 18px; }
    .pricing-heading .eyebrow { margin-top: 0; }
    .pricing-row { grid-template-columns: 42px minmax(0, 1fr) minmax(120px, .4fr); }
    .pricing-action { grid-column: 2 / -1; }
}

@media (max-width: 620px) {
    .pricing-hero { min-height: 640px; }
    .pricing-hero-inner { padding-top: 120px; padding-bottom: 54px; }
    .pricing-hero-image img { object-position: 64% center; }
    .pricing-hero-overlay { background: linear-gradient(90deg, rgba(3, 8, 14, .97), rgba(3, 8, 14, .78)), linear-gradient(0deg, rgba(3, 8, 14, .72), transparent 60%); }
    .pricing-hero h1 { font-size: clamp(3rem, 14vw, 4.7rem); }
    .pricing-hero-note { margin-top: 42px; line-height: 1.5; }
    .pricing-section { padding: 78px 0; }
    .pricing-heading { margin-bottom: 50px; }
    .pricing-heading h2 { font-size: clamp(2.7rem, 13vw, 4.1rem); }
    .pricing-row, .pricing-row:hover { grid-template-columns: 35px 1fr; gap: 13px; align-items: start; padding: 28px 0; }
    .pricing-row:hover { padding-inline: 10px; }
    .pricing-info h3 { font-size: 1.65rem; }
    .pricing-cost { grid-column: 2; display: flex; align-items: baseline; gap: 11px; margin-top: 10px; }
    .pricing-cost strong { font-size: 3.1rem; }
    .pricing-action { grid-column: 2; margin-top: 6px; }
    .pricing-cta-inner { display: grid; align-items: start; }
    .pricing-cta .button { width: 100%; }
}
