@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;450;500;550;600;650;700;750&display=swap');
/* Pricing follows the supplied Dock reference while retaining Productopia's brand. */
.pricing-page{--sans:Inter,Arial,sans-serif;--display:Inter,Arial,sans-serif;background:#f7f7f5;color:#20242e}
.pricing-wrap{width:min(1128px,calc(100% - 80px));margin-inline:auto}
.pricing-page .header{width:min(1128px,calc(100% - 80px));height:82px;transition:width .25s,height .25s,top .25s,background .25s,padding .25s}
.pricing-page .header::before{display:none}.pricing-page .header .brand{font-size:22px;color:#20242e;letter-spacing:-.8px;gap:10px}
.pricing-page .header .brand-logo{width:29px;height:29px}.pricing-page .header>nav{gap:24px;color:#5b6a70;font-size:12px}
.pricing-page .header nav a[aria-current=page]{color:#293439;text-decoration:underline;text-decoration-color:#a1d2e8;text-underline-offset:6px}
.pricing-page .header.is-scrolled{top:10px;width:min(960px,calc(100% - 32px));height:62px;padding-inline:20px;border:1px solid #dee2e4aa;border-radius:999px;background:#fffffff0;backdrop-filter:blur(16px);box-shadow:0 8px 20px #252c3a0b}
.pricing-page .header.is-scrolled .brand{font-size:19px}.pricing-page .header.is-scrolled .brand-logo{width:26px;height:26px}
.pricing-hero{padding-top:141px;text-align:center}
.pricing-hero h1{font:650 clamp(42px,4.4vw,62px)/1 var(--display);letter-spacing:-2.7px;color:#20242e;text-shadow:none;max-width:800px;margin:0 auto 16px}
.pricing-hero>p{font-size:16px;line-height:1.6;color:#7c7f8a;margin:0 auto;max-width:520px}
.pricing-stack{margin-top:48px}

.pricing-plans{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;z-index:1;align-items:stretch}
.pricing-plan{display:flex;flex-direction:column;padding:24px;border:1px solid #dfdfe4;border-top-color:#fff;border-radius:24px;background:linear-gradient(145deg,#ffffffc9,#ffffff80);box-shadow:inset 0 1px 0 #fff,0 19px 35px #1b243314;backdrop-filter:blur(20px);min-width:0}
.pricing-plan.featured{border-color:#94d2ee;box-shadow:inset 0 1px 0 #fff,0 24px 45px #4f9ec225}
.plan-heading{display:flex;align-items:center;justify-content:space-between;min-height:28px;gap:10px;margin-bottom:11px}
.pricing-plan .plan-heading h2{font-size:14px;line-height:1.5;letter-spacing:0;color:#7e808a;font-weight:550;margin:0}
.plan-badge{display:inline-flex;align-items:center;gap:4px;font-size:10px;line-height:1.4;padding:7px 10px;border-radius:999px;background:#57afd7;color:#fff;white-space:nowrap}
.plan-price{margin:0}.plan-price>span{display:block;font:600 58px/1.05 var(--display);letter-spacing:-2.5px;color:#1f232e}
.plan-price>small{display:block;color:#888c97;font-size:12px;line-height:1.6;margin-top:5px}
.plan-description{font-size:13px;line-height:1.8;color:#6d727f;min-height:36px;margin:17px 0 16px}
.plan-features{list-style:none;padding:17px 0 0;margin:0 0 22px;border-top:1px solid #e1e5e7}
.plan-features li{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.6;color:#333845;margin-bottom:9px}
.plan-features li>span{display:grid;place-items:center;flex:0 0 19px;height:19px;background:#e8f4fa;border-radius:5px;color:#6ebadc;font-size:12px}
.pricing-plan .pricing-cta.waitlist-pill{margin-top:auto;width:100%;min-width:0;min-height:48px;padding:13px 16px;font-size:13px;border:1px solid #dfe3e5;background:#ffffffc9;color:#252a36;gap:9px;box-shadow:0 2px 6px #21323a03}
.pricing-plan .pricing-cta.waitlist-pill>.waitlist-cloud{width:19px;height:19px;flex-basis:19px;filter:brightness(.48)}
.pricing-plan .pricing-cta.waitlist-pill:hover{background:#f0f8fb;border-color:#cee3ed;transform:translateY(-1px)}
.pricing-plan.featured .pricing-cta.waitlist-pill{color:#fff;border-color:#7bc6e8;background:linear-gradient(180deg,#6dbcdf,#50a6cc);box-shadow:inset 0 1px 2px #ffffff52,0 7px 16px #50a6cc26}
.pricing-plan.featured .pricing-cta.waitlist-pill>.waitlist-cloud{filter:drop-shadow(0 1px 1px #21566d20)}
.pricing-plan.featured .pricing-cta.waitlist-pill:hover{background:#50a6cc}
.pricing-billing-note{margin:23px auto 0;text-align:center;font-size:11px;color:#9094a0;line-height:1.8}
.pricing-section-heading{text-align:center;margin-bottom:32px}
.pricing-section-heading h2{font:600 34px/1.2 var(--display);letter-spacing:-1.2px;color:#252a35;margin:0 0 10px}
.pricing-section-heading p{font-size:14px;line-height:1.8;color:#888d98;margin:0 auto;max-width:560px}
.pricing-proof{padding-block:105px 50px}
.pricing-quotes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.pricing-quote{grid-column:span 2;margin:0;padding:22px;background:#ffffffb3;border:1px solid #e6e6e9;border-radius:17px;min-width:0}
.pricing-quote:nth-last-child(-n+2){grid-column:span 3}
.pricing-quote blockquote{font:500 15px/1.75 var(--display);color:#667084;margin:0 0 19px;letter-spacing:-.2px;min-height:78px}
.pricing-quote figcaption{font-size:10px;color:#718096}.pricing-quote figcaption>span{display:block;color:#a1a8b3;font-size:8px;margin-top:4px}
.pricing-credits{padding-block:72px 100px}
.pricing-credit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.credit-card{padding:8px;border:1px solid #e4e4e8;background:#ffffff78;border-radius:20px;overflow:hidden}
.credit-card>img{width:100%;aspect-ratio:1.5;object-fit:cover;border-radius:13px}
.credit-card>div{padding:17px 10px 10px}.credit-card h3{font-size:13px;line-height:1.5;font-weight:600;color:#363b47;margin:0 0 5px;letter-spacing:-.1px}.credit-card p{font-size:12px;line-height:1.8;color:#9397a1;margin:0}
.pricing-included{padding-block:0 80px;overflow:hidden}
.included-carousel{display:flex;gap:16px;overflow-x:auto;padding-block:4px 18px;scrollbar-width:thin;scrollbar-color:#c4e0ec transparent;scroll-snap-type:x proximity}
.included-card{flex:0 0 calc((100% - 48px)/4);text-align:center;scroll-snap-align:start;min-width:0}
.included-card>img{width:100%;aspect-ratio:1.5;object-fit:cover;border:1px solid #e6e5e6;border-radius:17px;background:#fff}
.included-card h3{font-size:14px;line-height:1.5;letter-spacing:-.2px;color:#596273;font-weight:600;margin:14px 0 5px}
.included-card p{font-size:12px;color:#939aa6;line-height:1.8;margin:0 auto;max-width:230px}
.pricing-faq{width:min(680px,calc(100% - 80px));padding-block:0 125px}
.pricing-faq>h2{font:600 32px/1.2 var(--display);letter-spacing:-1px;margin:0 0 22px;color:#333947}
.pricing-faq-item{border-top:1px solid #dfe5e7}.pricing-faq-item:last-child{border-bottom:1px solid #dfe5e7}
.pricing-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:20px;list-style:none;cursor:pointer;padding:20px 2px;font-size:14px;line-height:1.7;font-weight:550;color:#485162}
.pricing-faq-item summary::-webkit-details-marker{display:none}.pricing-faq-item summary>span{color:#9c9da6;font-size:20px;font-weight:400;transition:transform .2s}.pricing-faq-item[open] summary>span{transform:rotate(45deg)}
.pricing-faq-item p{font-size:13px;color:#8a93a2;line-height:1.9;max-width:615px;margin:0 0 22px;padding-right:22px}
.pricing-faq-item summary:focus-visible{outline:2px solid #8bc1d9;outline-offset:3px;border-radius:4px}
.pricing-footer{padding:0 16px 24px}
.pricing-footer-deck{position:relative;display:grid;grid-template-columns:1.15fr .8fr .8fr 1.2fr;gap:14px;padding:24px;background:linear-gradient(125deg,#82cdee,#5ec0ec 50%,#5983f4);border-radius:32px;overflow:hidden;color:#fff}
.pricing-footer-deck::before{content:'Productopia';position:absolute;left:13px;bottom:-55px;color:#ffffff0b;font:750 170px/1 var(--display);letter-spacing:-10px;pointer-events:none}
.pricing-footer-deck>div,.pricing-footer-deck>nav{position:relative;z-index:1;min-width:0;border:1px solid #ffffff35;border-radius:22px;padding:23px;background:#ffffff14;backdrop-filter:blur(10px)}
.pricing-footer-deck .brand{color:#fff;font-size:23px;letter-spacing:-.9px;gap:9px}.pricing-footer-deck .brand-logo{filter:none;width:31px;height:31px}
.pricing-footer-brand>p{color:#e4f7ff;font-size:12px;line-height:1.8;margin:15px 0 0}
.pricing-footer-deck nav h2{display:inline-block;font:600 10px/1.5 var(--sans);letter-spacing:0;background:#f5fcff;color:#627e8b;border-radius:999px;padding:6px 12px;margin:0 0 18px}
.pricing-footer-deck nav a{display:block;color:#fff;font-size:12px;line-height:1.8;margin-bottom:9px}.pricing-footer-deck nav a:hover{color:#def5ff}
.pricing-footer-invite h2{font:600 20px/1.4 var(--display);letter-spacing:-.5px;color:#fff;margin:0 0 10px}
.pricing-footer-invite p{font-size:12px;line-height:1.8;color:#e4f7ff;margin:0 0 23px}
.pricing-footer-invite .waitlist-pill{background:#fff;color:#517b8e;min-width:0;width:100%;min-height:47px;padding:13px 16px;font-size:12px;gap:9px}.pricing-footer-invite .waitlist-cloud{filter:brightness(.65)}
.pricing-footer-invite .waitlist-pill:hover{background:#effaff;transform:translateY(-1px)}
.pricing-footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 10px 0;font-size:10px;color:#9ca2af}
.footer-pricing{font-size:10px;color:#627889}
@media(max-width:1100px){.pricing-page .header>nav{gap:17px;font-size:11px}.pricing-plan{padding:20px}.plan-price>span{font-size:52px}.plan-badge{font-size:8px;padding:6px 8px}.plan-features li{font-size:12px}.plan-description{font-size:12px}.pricing-footer-deck{grid-template-columns:1fr 1fr}.pricing-footer-deck::before{font-size:140px;bottom:-25px}.pricing-footer-brand{display:flex;flex-direction:column;justify-content:center}.pricing-footer-invite h2{font-size:22px}}
@media(max-width:800px){.pricing-wrap{width:calc(100% - 56px)}.pricing-page .header{width:calc(100% - 56px)}.pricing-page .header .brand{font-size:20px}.pricing-page .header>nav{gap:14px;font-size:10px}.pricing-page .header .nav-cta.waitlist-pill{padding:10px 12px;font-size:11px;gap:7px}.pricing-page .header .nav-cta.waitlist-pill>.waitlist-cloud{width:16px;height:16px;flex-basis:16px}.pricing-hero{padding-top:140px}.pricing-hero h1{font-size:53px}.pricing-hero>p{font-size:14px}.pricing-plan{padding:17px;border-radius:20px}.plan-heading{align-items:start;flex-direction:column;gap:7px;min-height:51px;margin-bottom:10px}.plan-badge{font-size:8px;padding:5px 7px}.plan-price>span{font-size:43px}.plan-price>small{font-size:10px}.plan-description{font-size:11px;min-height:60px;margin-bottom:17px}.plan-features{padding-top:16px;margin-bottom:20px}.plan-features li{font-size:10px;gap:7px;margin-bottom:10px}.plan-features li>span{flex-basis:16px;height:16px;font-size:10px}.pricing-plan .pricing-cta.waitlist-pill{min-height:43px;font-size:10px;padding:12px 9px;gap:6px}.pricing-plan .pricing-cta.waitlist-pill>.waitlist-cloud{width:16px;height:16px;flex-basis:16px}.pricing-section-heading h2{font-size:29px}.pricing-section-heading p{font-size:12px}.pricing-proof{padding-top:85px}.pricing-quote{padding:17px}.pricing-quote blockquote{font-size:13px}.pricing-credits{padding-block:60px 75px}.pricing-credit-grid{gap:12px}.credit-card>div{padding:12px 6px 7px}.credit-card h3{font-size:11px}.credit-card p{font-size:10px}.included-card{flex-basis:calc((100% - 32px)/3)}.included-card h3{font-size:12px}.included-card p{font-size:10px}.pricing-faq{width:min(680px,calc(100% - 80px));padding-bottom:100px}.pricing-footer-deck{padding:18px;gap:13px}.pricing-footer-deck>div,.pricing-footer-deck>nav{padding:23px}}
@media(max-width:560px){.pricing-wrap{width:calc(100% - 40px)}.pricing-page .header{width:calc(100% - 40px);height:82px}.pricing-page .header .brand{font-size:22px}.pricing-page .header .brand-logo{width:32px;height:32px}.pricing-page .header.is-scrolled{width:calc(100% - 24px);padding-inline:15px;border-radius:18px}.pricing-page .header>.mobile-menu:not([hidden]){top:calc(100% + 8px);border-radius:13px;background:#fffffff5}.pricing-hero{padding-top:132px}.pricing-hero h1{font-size:clamp(35px,10.4vw,48px);letter-spacing:-1.7px;margin-bottom:19px}.pricing-hero>p{font-size:12px;line-height:1.9;max-width:320px}.pricing-stack{margin-top:35px}.pricing-plans{grid-template-columns:1fr;gap:18px}.pricing-plan{padding:26px;border-radius:22px}.plan-heading{flex-direction:row;align-items:center;min-height:28px;margin-bottom:11px}.pricing-plan .plan-heading h2{font-size:14px}.plan-badge{font-size:10px;padding:7px 10px}.plan-price>span{font-size:59px}.plan-price>small{font-size:12px}.plan-description{min-height:0;font-size:12px;margin:18px 0 23px}.plan-features{margin-bottom:25px}.plan-features li{font-size:12px;margin-bottom:11px;gap:9px}.plan-features li>span{flex-basis:18px;height:18px;font-size:11px}.pricing-plan .pricing-cta.waitlist-pill{font-size:13px;min-height:49px;gap:9px}.pricing-plan .pricing-cta.waitlist-pill>.waitlist-cloud{width:20px;height:20px;flex-basis:20px}.pricing-billing-note{font-size:10px;max-width:290px}.pricing-proof{padding-block:75px 20px}.pricing-section-heading{margin-bottom:27px}.pricing-section-heading h2{font-size:27px;letter-spacing:-.9px;line-height:1.3}.pricing-section-heading p{font-size:11px;line-height:1.9}.pricing-quotes{grid-template-columns:1fr;gap:12px}.pricing-quote,.pricing-quote:nth-last-child(-n+2){grid-column:auto;padding:20px}.pricing-quote blockquote{min-height:0;font-size:14px;margin-bottom:16px}.pricing-credits{padding-block:55px 65px}.pricing-credit-grid{grid-template-columns:1fr;gap:16px}.credit-card{padding:8px}.credit-card>div{padding:16px 10px 12px}.credit-card h3{font-size:13px}.credit-card p{font-size:12px}.included-carousel{gap:13px}.included-card{flex-basis:72%;scroll-snap-align:center}.included-card h3{font-size:14px}.included-card p{font-size:12px}.pricing-included{padding-bottom:65px}.pricing-faq{width:calc(100% - 48px);padding-bottom:80px}.pricing-faq>h2{font-size:29px}.pricing-faq-item summary{font-size:12px;padding:19px 0}.pricing-faq-item p{font-size:11px;line-height:1.95}.pricing-footer{padding:0 10px 22px}.pricing-footer-deck{grid-template-columns:1fr 1fr;padding:13px;border-radius:25px;gap:10px}.pricing-footer-deck>div,.pricing-footer-deck>nav{padding:20px 17px;border-radius:17px}.pricing-footer-brand,.pricing-footer-invite{grid-column:1/-1}.pricing-footer-deck .brand{font-size:24px}.pricing-footer-brand>p{font-size:12px;margin-top:10px}.pricing-footer-deck nav a{font-size:11px}.pricing-footer-deck::before{font-size:86px;bottom:5px;left:14px;letter-spacing:-5px}.pricing-footer-invite .waitlist-pill{max-width:270px;min-height:48px}.pricing-footer-invite h2{font-size:22px}.pricing-footer-invite p{font-size:12px;margin-bottom:18px}.pricing-footer-bottom{font-size:9px;padding-top:18px}}
@media(prefers-reduced-motion:reduce){.pricing-page .header{transition:none}.pricing-plan .pricing-cta.waitlist-pill:hover,.pricing-footer-invite .waitlist-pill:hover{transform:none}}

/* Shared Productopia blue replaces the reference's purple treatment. */
.pricing-plan.featured{border-color:var(--brand);box-shadow:inset 0 1px 0 #fff,0 24px 45px #1fa3de25}
.plan-badge{background:var(--brand);color:var(--brand-ink)}
.plan-features li>span{background:var(--brand-soft);color:#0874a5}
.pricing-plan.featured .pricing-cta.waitlist-pill{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);box-shadow:inset 0 1px 2px #ffffff52,0 7px 16px #1fa3de26}
.pricing-plan.featured .pricing-cta.waitlist-pill:hover{background:var(--brand-hover)}
.pricing-footer-deck{background:linear-gradient(125deg,#0c5c82,#0e648b 50%,#106e98)}
.pricing-footer-invite .waitlist-pill{background:#fff;color:#0a567c}
.pricing-footer-invite .waitlist-pill:hover{background:var(--brand-soft);color:#0a567c}