:root {
    --price-navy: #040b1d;
    --price-navy-2: #071630;
    --price-blue: #257ff0;
    --price-cyan: #3ce8ff;
    --price-muted: #96abc8;
    --price-line: rgba(128, 190, 255, .16);
}

.pricing-page { overflow: hidden; color: #fff; background: var(--price-navy); }
.pricing-shell { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.pricing-eyebrow { color: var(--price-cyan); font-size: .74rem; font-weight: 760; letter-spacing: .16em; line-height: 1.4; text-transform: uppercase; }
.pricing-eyebrow > span { display: inline-block; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background: var(--price-cyan); box-shadow: 0 0 0 6px rgba(60,232,255,.1), 0 0 22px var(--price-cyan); animation: priceDot 2.2s ease-in-out infinite; }
.pricing-heading { max-width: 730px; margin-bottom: 52px; }
.pricing-heading h2, .reassurance-copy h2 { margin-top: 14px; color: #0a2146; font-size: clamp(2.3rem, 4.5vw, 4.2rem); line-height: 1.03; letter-spacing: -.055em; }
.pricing-heading > p:last-child { max-width: 640px; margin-top: 19px; color: #627895; font-size: 1.03rem; line-height: 1.7; }

/* Hero */
.pricing-hero { position: relative; min-height: 700px; display: grid; align-items: center; isolation: isolate; background: radial-gradient(circle at 77% 40%, rgba(31,123,255,.24), transparent 31%), linear-gradient(145deg, #030817 10%, #07142d 58%, #081c3e); }
.pricing-grid-bg { position: absolute; inset: 0; z-index: -2; opacity: .23; background-image: linear-gradient(rgba(106,174,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(106,174,255,.1) 1px, transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 80%, transparent); }
.pricing-orb { position: absolute; z-index: -1; width: 500px; aspect-ratio: 1; border-radius: 50%; filter: blur(100px); opacity: .13; }
.pricing-orb-one { top: -260px; left: -170px; background: #21d8ff; }
.pricing-orb-two { right: -220px; bottom: -300px; background: #294fff; }
.pricing-hero-layout { display: grid; grid-template-columns: 1.12fr .88fr; align-items: center; gap: 75px; padding-block: 94px 115px; }
.pricing-hero-copy h1 { margin-top: 22px; font-size: clamp(3.4rem, 6.5vw, 6.5rem); font-weight: 790; line-height: .95; letter-spacing: -.068em; }
.pricing-hero-copy h1 em { color: transparent; background: linear-gradient(105deg, #fff, #75e9ff 45%, #4d8fff); background-clip: text; -webkit-background-clip: text; font-style: normal; }
.pricing-hero-copy > p:not(.pricing-eyebrow) { max-width: 620px; margin-top: 28px; color: #adbed7; font-size: clamp(1rem, 1.5vw, 1.18rem); line-height: 1.7; }
.pricing-hero-points { display: flex; flex-wrap: wrap; gap: 12px 23px; margin-top: 30px; color: #8199ba; font-size: .8rem; }
.pricing-hero-points span { display: flex; align-items: center; gap: 8px; }
.pricing-hero-points i { color: #36e0b0; }
.pricing-hero-visual { position: relative; min-height: 440px; display: grid; place-items: center; perspective: 1000px; }
.price-shield { position: relative; z-index: 3; display: grid; place-items: center; width: 184px; height: 215px; color: #edfdff; font-size: 4.8rem; filter: drop-shadow(0 0 35px rgba(49,210,255,.4)); animation: priceShield 4s ease-in-out infinite; }
.price-shield::before { content: ""; position: absolute; inset: 0; z-index: -1; border: 1px solid rgba(155,233,255,.65); background: linear-gradient(145deg, rgba(53,225,255,.88), rgba(33,97,238,.84)); clip-path: polygon(50% 0, 94% 17%, 89% 70%, 50% 100%, 11% 70%, 6% 17%); box-shadow: inset 0 0 45px rgba(255,255,255,.16); }
.price-signal { position: absolute; width: 270px; aspect-ratio: 1; border: 1px solid rgba(65,226,255,.27); border-radius: 50%; opacity: 0; animation: priceSignal 3s ease-out infinite; }
.signal-b { animation-delay: 1.4s; }
.floating-price { position: absolute; z-index: 4; border: 1px solid rgba(146,211,255,.23); border-radius: 17px; background: rgba(8,24,53,.78); box-shadow: 0 20px 55px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.08); backdrop-filter: blur(16px); animation: priceFloat 5s ease-in-out infinite; }
.floating-price-one { top: 48px; right: 2px; min-width: 150px; padding: 16px 19px; }
.floating-price-one small, .floating-price-one strong, .floating-price-one span { display: block; }
.floating-price-one small { color: #8299b9; font-size: .65rem; text-transform: uppercase; }
.floating-price-one strong { margin-top: 3px; color: #fff; font-size: 2rem; letter-spacing: -.05em; }
.floating-price-one span { color: var(--price-cyan); font-size: .7rem; }
.floating-price-two { bottom: 52px; left: 0; display: flex; align-items: center; gap: 12px; min-width: 188px; padding: 13px 16px; animation-delay: -2.4s; }
.floating-price-two > i { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; color: var(--price-cyan); background: rgba(58,216,255,.1); font-size: 1.2rem; }
.floating-price-two span { color: #8098b8; font-size: .65rem; line-height: 1.4; }
.floating-price-two strong { color: #fff; font-size: .78rem; }
.secure-line { position: absolute; width: 400px; height: 400px; border: 1px dashed rgba(96,190,255,.2); border-radius: 50%; animation: priceOrbit 18s linear infinite; }
.secure-line span { position: absolute; top: 50%; left: -5px; width: 10px; height: 10px; border-radius: 50%; background: var(--price-cyan); box-shadow: 0 0 15px var(--price-cyan); }
.pricing-scroll { position: absolute; bottom: 25px; left: 50%; display: flex; flex-direction: column; align-items: center; gap: 8px; transform: translateX(-50%); color: #7088aa; font-size: .62rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.pricing-scroll i { color: var(--price-cyan); animation: priceBounce 1.8s ease-in-out infinite; }

/* Plans */
.plans-section { padding: 120px 0; color: #0a2146; background: #f3f8ff; }
.plans-section .pricing-eyebrow { color: #1472df; }
.plan-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.plan-card { position: relative; display: flex; flex-direction: column; min-height: 625px; padding: 39px; border: 1px solid #dce8f7; border-radius: 29px; background: rgba(255,255,255,.92); box-shadow: 0 24px 65px rgba(25,66,121,.09); transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; }
.plan-card:hover { transform: translateY(-8px); border-color: #9dccff; box-shadow: 0 34px 75px rgba(22,88,172,.15); }
.plan-card-featured { border-color: #69b7ff; box-shadow: 0 30px 80px rgba(24,111,218,.18); }
.featured-badge { position: absolute; top: -14px; right: 31px; padding: 8px 13px; border-radius: 50px; color: #fff; background: linear-gradient(100deg, #1478e6, #27a9e8); box-shadow: 0 9px 22px rgba(24,118,222,.27); font-size: .68rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.plan-card-top { display: flex; align-items: center; justify-content: space-between; }
.plan-icon { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 17px; color: #1979e8; background: #eaf5ff; box-shadow: inset 0 0 0 1px #d7eaff; font-size: 1.35rem; }
.plan-type { color: #8295ad; font-size: .69rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.plan-card h3 { margin-top: 29px; color: #0a2146; font-size: 2rem; letter-spacing: -.045em; }
.plan-summary { min-height: 52px; margin-top: 10px; color: #687c97; line-height: 1.55; }
.plan-price { display: flex; align-items: baseline; gap: 8px; margin-top: 29px; }
.plan-price strong { color: #09214b; font-size: clamp(3rem, 5vw, 4.4rem); line-height: 1; letter-spacing: -.07em; }
.plan-price span { color: #6f839d; font-size: .9rem; }
.plan-price-quote strong { font-size: clamp(2.7rem, 4.6vw, 4rem); }
.annual-price { margin-top: 9px; color: #899bb1; font-size: .82rem; }
.annual-price span { margin-left: 5px; color: #1284a1; font-weight: 800; }
.plan-card ul { display: grid; gap: 14px; margin: 31px 0 34px; list-style: none; }
.plan-card li { display: flex; gap: 11px; color: #516985; font-size: .9rem; line-height: 1.45; }
.plan-card li i { margin-top: 3px; color: #21b887; font-size: .78rem; }
.plan-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 51px; margin-top: auto; padding: 0 22px; border-radius: 50px; font-size: .82rem; font-weight: 760; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.plan-button:hover { transform: translateY(-3px); }
.plan-button i { font-size: .7rem; }
.plan-button-secondary { border: 1px solid #b9d5f3; color: #176ece; background: #f8fbff; }
.plan-button-primary { color: #fff; background: linear-gradient(105deg, #146fdc, #258fe9); box-shadow: 0 14px 30px rgba(26,112,218,.24); }
.plan-button-primary:hover { box-shadow: 0 18px 38px rgba(26,112,218,.34); }

/* Certification */
.certification-section { position: relative; padding: 120px 0; background: linear-gradient(145deg, #050c1d, #091a38); }
.certification-glow { position: absolute; top: 25%; right: -230px; width: 520px; height: 520px; border-radius: 50%; background: #1c6ce8; filter: blur(150px); opacity: .15; }
.pricing-heading-light h2 { color: #fff; }
.pricing-heading-light > p:last-child { color: var(--price-muted); }
.plan-card-dark { border-color: var(--price-line); color: #fff; background: linear-gradient(145deg, rgba(16,42,82,.84), rgba(6,19,43,.9)); box-shadow: 0 28px 70px rgba(0,0,0,.22); }
.plan-card-dark:hover { border-color: rgba(61,222,255,.38); box-shadow: 0 35px 80px rgba(0,0,0,.3), 0 0 40px rgba(31,132,244,.1); }
.plan-card-dark .plan-icon { border: 1px solid rgba(60,220,255,.2); color: var(--price-cyan); background: rgba(42,178,244,.1); box-shadow: none; }
.plan-card-dark .plan-type, .plan-card-dark .annual-price { color: #8198b8; }
.plan-card-dark h3, .plan-card-dark .plan-price strong { color: #fff; }
.plan-card-dark .plan-summary, .plan-card-dark .plan-price span, .plan-card-dark li { color: #94a9c7; }
.plan-card-dark li i { color: var(--price-cyan); }
.plan-button-glass { border: 1px solid rgba(75,214,255,.3); color: #bff8ff; background: rgba(40,161,227,.09); }
.plan-button-glass:hover { border-color: rgba(75,214,255,.65); box-shadow: 0 14px 32px rgba(21,154,220,.13); }
.custom-plan { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; margin-top: 24px; padding: 35px 38px; overflow: hidden; border: 1px solid rgba(61,222,255,.25); border-radius: 27px; background: linear-gradient(105deg, rgba(21,76,149,.63), rgba(9,30,65,.85)); box-shadow: 0 28px 70px rgba(0,0,0,.2); }
.custom-plan::after { content: ""; position: absolute; top: -90px; right: 180px; width: 240px; height: 240px; border-radius: 50%; background: #2494ff; filter: blur(75px); opacity: .14; }
.custom-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 75px; height: 75px; border: 1px solid rgba(77,225,255,.25); border-radius: 22px; color: var(--price-cyan); background: rgba(42,181,237,.1); font-size: 1.7rem; }
.custom-copy { position: relative; z-index: 1; }
.custom-copy > span { color: var(--price-cyan); font-size: .67rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.custom-copy h3 { margin-top: 7px; color: #fff; font-size: 1.45rem; }
.custom-copy p { margin-top: 7px; color: #91a8c8; font-size: .88rem; line-height: 1.55; }
.custom-plan .plan-button { position: relative; z-index: 1; margin: 0; }

/* Reassurance and closing CTA */
.pricing-reassurance { padding: 110px 0; color: #0a2146; background: #f3f8ff; }
.reassurance-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: center; }
.reassurance-copy .pricing-eyebrow { color: #1472df; }
.reassurance-copy h2 { font-size: clamp(2.3rem, 4.2vw, 4rem); }
.reassurance-list { display: grid; gap: 16px; }
.reassurance-item { display: grid; grid-template-columns: 58px 1fr; align-items: center; gap: 19px; padding: 23px; border: 1px solid #dce9f7; border-radius: 20px; background: rgba(255,255,255,.84); box-shadow: 0 15px 45px rgba(27,69,125,.06); }
.reassurance-item > i { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 17px; color: #1676df; background: #e9f5ff; font-size: 1.35rem; }
.reassurance-item strong { color: #102a50; }
.reassurance-item p { margin-top: 6px; color: #6d819b; font-size: .86rem; line-height: 1.5; }
.pricing-download { position: relative; isolation: isolate; min-height: 650px; display: grid; place-items: center; padding: 110px 0; overflow: hidden; background: radial-gradient(circle at 50% 50%, #103575, #071630 47%, #030817); }
.pricing-download-content { text-align: center; }
.download-lock { position: relative; display: grid; place-items: center; width: 92px; height: 104px; margin: 0 auto 28px; color: var(--price-cyan); font-size: 2.4rem; filter: drop-shadow(0 0 25px rgba(53,225,255,.4)); }
.download-lock::before { content: ""; position: absolute; inset: 0; z-index: -1; border: 1px solid rgba(95,229,255,.38); background: linear-gradient(145deg, rgba(44,205,255,.18), rgba(26,74,192,.24)); clip-path: polygon(50% 0,94% 17%,89% 70%,50% 100%,11% 70%,6% 17%); }
.pricing-download h2 { margin-top: 15px; font-size: clamp(2.8rem, 6vw, 5.7rem); line-height: 1; letter-spacing: -.06em; }
.pricing-download h2 span { color: transparent; background: linear-gradient(105deg, #fff, #74ebff 45%, #518fff); background-clip: text; -webkit-background-clip: text; }
.pricing-download-content > p:not(.pricing-eyebrow) { max-width: 640px; margin: 24px auto 0; color: #a4b9d4; line-height: 1.7; }
.pricing-store-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 13px; margin-top: 32px; }
.pricing-store-links a { display: inline-flex; min-height: 56px; align-items: center; padding: 8px 14px; border: 1px solid rgba(160,218,255,.2); border-radius: 13px; background: #fff; box-shadow: 0 15px 35px rgba(0,0,0,.22); transition: transform .25s ease, box-shadow .25s ease; }
.pricing-store-links a:hover { transform: translateY(-4px); box-shadow: 0 19px 42px rgba(22,127,255,.24); }
.pricing-store-links img { width: auto; height: 39px; }

/* Motion shared with home.js */
.reveal-up { opacity: 0; transform: translateY(24px); animation: pricingReveal .8s cubic-bezier(.22,.8,.25,1) forwards; }
.reveal-scale { opacity: 0; transform: scale(.93); animation: pricingScale .9s cubic-bezier(.22,.8,.25,1) .25s forwards; }
.reveal-delay-1 { animation-delay: .14s; transition-delay: .09s !important; }
.reveal-delay-2 { animation-delay: .28s; transition-delay: .18s !important; }
.reveal-delay-3 { animation-delay: .42s; transition-delay: .27s !important; }
.reveal-on-scroll { opacity: 0; transform: translateY(34px); transition: opacity .72s ease, transform .72s cubic-bezier(.22,.8,.25,1); }
.reveal-on-scroll.is-visible { opacity: 1; transform: translateY(0); }
.pricing-hero-visual.is-paused, .pricing-hero-visual.is-paused * { animation-play-state: paused !important; }
@keyframes pricingReveal { to { opacity: 1; transform: translateY(0); } }
@keyframes pricingScale { to { opacity: 1; transform: scale(1); } }
@keyframes priceDot { 50% { transform: scale(.7); opacity: .6; } }
@keyframes priceShield { 50% { transform: translateY(-10px) scale(1.025); filter: drop-shadow(0 0 46px rgba(49,210,255,.56)); } }
@keyframes priceSignal { 0% { transform: scale(.45); opacity: .55; } 80%,100% { transform: scale(1.5); opacity: 0; } }
@keyframes priceFloat { 50% { transform: translateY(-9px); } }
@keyframes priceOrbit { to { transform: rotate(360deg); } }
@keyframes priceBounce { 50% { transform: translateY(6px); } }

@media (max-width: 900px) {
    .pricing-hero-layout { grid-template-columns: 1fr; padding-block: 80px 95px; text-align: center; }
    .pricing-hero-copy { display: flex; flex-direction: column; align-items: center; }
    .pricing-hero-points { justify-content: center; }
    .pricing-hero-visual { min-height: 390px; margin-top: -25px; transform: scale(.88); }
    .pricing-hero-visual.reveal-scale { animation: none; opacity: 1; }
    .reassurance-grid { grid-template-columns: 1fr; gap: 48px; }
}

@media (max-width: 680px) {
    .pricing-shell { width: min(100% - 28px, 530px); }
    .pricing-hero { min-height: auto; }
    .pricing-hero-layout { padding-top: 65px; }
    .pricing-hero-copy h1 { font-size: clamp(3rem, 14vw, 4.4rem); }
    .pricing-hero-points { flex-direction: column; align-items: center; gap: 9px; }
    .pricing-hero-visual { min-height: 350px; margin: -38px auto -28px; transform: scale(.72); }
    .floating-price-one { right: -28px; }
    .floating-price-two { left: -34px; }
    .pricing-scroll { display: none; }
    .plans-section, .certification-section, .pricing-reassurance { padding: 78px 0; }
    .pricing-heading { margin-bottom: 38px; }
    .pricing-heading h2, .reassurance-copy h2 { font-size: clamp(2.25rem, 11vw, 3.4rem); }
    .plan-grid { grid-template-columns: 1fr; }
    .plan-card { min-height: auto; padding: 29px 25px; border-radius: 23px; }
    .plan-summary { min-height: 0; }
    .plan-price strong { font-size: 3.5rem; }
    .custom-plan { grid-template-columns: 1fr; padding: 29px 25px; }
    .custom-plan .plan-button { justify-self: stretch; }
    .reassurance-grid { gap: 36px; }
    .reassurance-item { grid-template-columns: 50px 1fr; padding: 19px; }
    .reassurance-item > i { width: 50px; height: 50px; }
    .pricing-download { min-height: 600px; padding: 85px 0; }
    .pricing-download h2 { font-size: clamp(2.7rem, 13vw, 4.1rem); }
    .pricing-store-links a { flex: 1 1 145px; justify-content: center; }
    .pricing-store-links img { max-width: 100%; object-fit: contain; }
}

@media (prefers-reduced-motion: reduce) {
    .pricing-page *, .pricing-page *::before, .pricing-page *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .reveal-up, .reveal-scale, .reveal-on-scroll { opacity: 1 !important; transform: none !important; }
}

@media (max-width: 680px) and (prefers-reduced-motion: reduce) {
    .pricing-hero-visual.reveal-scale { transform: scale(.72) !important; }
}
