/* Framnova Studio pricing — transparent, conversion-focused, and visually
   consistent with the product workspace. */

:root {
  --studio-night: #0d110f;
  --studio-night-raised: #171e19;
  --studio-paper: #f7f4eb;
  --studio-signal: #dfff70;
  --studio-muted: #748078;
  --studio-line: rgba(16, 21, 18, 0.15);
}

body.page-pricing { background: var(--studio-paper); }
.page-pricing .site-header,
.page-pricing .site-header.is-scrolled { border-bottom-color: rgba(255,255,255,.1); background: rgba(13,17,15,.9); box-shadow: none; }
.page-pricing .brand { color: #fffdf6; }
.page-pricing .brand-symbol { color: var(--studio-signal); }
.page-pricing .nav-links a { color: rgba(255,253,246,.65); }
.page-pricing .nav-links a:hover, .page-pricing .nav-links a.is-active { color: #fffdf6; }
.page-pricing .nav-links a.is-active::after { background: var(--studio-signal); }
.page-pricing .nav-cta { border-color: rgba(223,255,112,.55); border-radius: 9px; color: #11170e; background: var(--studio-signal); }
.page-pricing .language-switch { color: rgba(255,253,246,.6); }
.page-pricing .language-button { color: inherit; }
.page-pricing .language-button.is-active { color: var(--studio-signal); }

.pricing-hero { overflow: hidden; padding-top: 162px; color: #fffdf6; background: radial-gradient(circle at 82% 25%, rgba(223,255,112,.14), transparent 17rem), var(--studio-night); }
.pricing-hero::before { opacity: .24; background-size: 48px 48px; }
.pricing-hero-copy h1 { max-width: 800px; color: #fffdf6; font-size: clamp(52px, 6.7vw, 98px); font-weight: 680; letter-spacing: -.08em; line-height: .89; }
.pricing-hero-copy h1 em { color: var(--studio-signal); font-family: var(--display); font-weight: 450; }
.pricing-hero-copy .subpage-lede { max-width: 570px; color: rgba(255,253,246,.68); font-size: 16px; line-height: 1.68; }
.pricing-hero .eyebrow { width: fit-content; padding: 8px 10px; border: 1px solid rgba(223,255,112,.28); border-radius: 5px; color: var(--studio-signal); background: rgba(223,255,112,.06); font-family: var(--mono); font-size: 9px; }
.eyebrow-signal { background: var(--studio-signal); box-shadow: 0 0 0 4px rgba(223,255,112,.1); }
.eyebrow-beta { border-color: rgba(223,255,112,.24); color: var(--studio-signal); }
.beta-pricing-note { border-color: rgba(255,255,255,.14); border-radius: 14px; background: rgba(255,255,255,.055); box-shadow: 12px 12px 0 rgba(223,255,112,.12); }
.beta-pricing-note::before { background: var(--studio-signal); }
.beta-pricing-note .note-index { color: var(--studio-signal); font-family: var(--mono); }
.beta-pricing-note strong { color: #fffdf6; }
.beta-pricing-note p { color: rgba(255,253,246,.62); }

.pricing-section { background: var(--studio-paper); }
.pricing-toolbar h2 { color: #131a15; font-size: clamp(36px, 4vw, 60px); font-weight: 690; letter-spacing: -.07em; line-height: .94; }
.pricing-toolbar .section-kicker { color: #57782a; font-family: var(--mono); }
.billing-toggle { border-color: var(--studio-line); border-radius: 10px; background: #fffdf7; }
.billing-toggle button { border-radius: 7px; color: #657067; }
.billing-toggle button.is-active { color: #11170e; background: var(--studio-signal); box-shadow: none; }
.billing-toggle small { color: #57782a; }
.billing-announcement { color: #68736b; }
.payment-trust { border-color: var(--studio-line); border-radius: 14px; background: #fffdf7; box-shadow: 12px 12px 0 rgba(16,21,18,.045); }
.payment-trust__mark { color: #14200e; background: var(--studio-signal); }
.payment-trust__eyebrow { color: #668638; font-family: var(--mono); }
.payment-trust strong { color: #172019; }
.payment-trust p, .payment-trust__notes { color: #6c766e; }
.payment-trust__notes span { border-color: var(--studio-line); background: #f1ede3; }
.plan-matrix-meta { border-color: var(--studio-line); color: #6e786f; font-family: var(--mono); }
.pricing-cards { gap: 14px; }
.pricing-card { min-height: 540px; border-color: var(--studio-line); border-radius: 16px; background: #fffdf7; box-shadow: none; }
.pricing-card:hover { border-color: rgba(85,120,42,.42); box-shadow: 10px 12px 0 rgba(16,21,18,.05); transform: translateY(-3px); }
.pricing-card-featured { border-color: #1b231c; color: #fffdf6; background: var(--studio-night-raised); box-shadow: 12px 12px 0 rgba(223,255,112,.28); }
.pricing-card-featured:hover { border-color: var(--studio-signal); background: var(--studio-night-raised); box-shadow: 14px 16px 0 rgba(223,255,112,.32); }
.pricing-card-business { background: #eee8dc; }
.pricing-card-business:hover { background: #f4f0e7; }
.plan-ribbon { color: #11170e; background: var(--studio-signal); font-family: var(--mono); }
.plan-number { color: #7a916d; font-family: var(--mono); }
.pricing-card-featured .plan-number { color: var(--studio-signal); }
.plan-number::after { background: currentColor; }
.plan-name, .plan-price { color: #151d17; }
.pricing-card-featured .plan-name, .pricing-card-featured .plan-price { color: #fffdf6; }
.plan-for, .plan-caption { color: #69736b; }
.pricing-card-featured .plan-for, .pricing-card-featured .plan-caption { color: rgba(255,253,246,.62); }
.plan-price > strong { font-size: 64px; letter-spacing: -.075em; }
.plan-price .currency, .plan-price .price-term { color: #78827a; }
.pricing-card-featured .plan-price .currency, .pricing-card-featured .plan-price .price-term { color: rgba(255,253,246,.56); }
.plan-button { border-color: var(--studio-line); border-radius: 9px; color: #20301a; background: #f0eddf; }
.plan-button:hover { border-color: #a7d83a; color: #15200f; background: #e7f9b0; }
.pricing-card-featured .button-primary { border-color: var(--studio-signal); color: #11170e; background: var(--studio-signal); }
.pricing-card-featured .checkout-options__creem { border-color: rgba(255,255,255,.18); color: #fffdf6; background: rgba(255,255,255,.06); }
.pricing-card-featured .checkout-options__creem:hover { border-color: var(--studio-signal); color: var(--studio-signal); background: rgba(223,255,112,.08); }
.plan-rule { background: var(--studio-line); }
.pricing-card-featured .plan-rule { background: rgba(255,255,255,.13); }
.included-label { color: #71806f; font-family: var(--mono); }
.pricing-card-featured .included-label { color: var(--studio-signal); }
.plan-features li { color: #3d493f; }
.plan-features i { color: #486e24; background: rgba(223,255,112,.32); }
.pricing-card-featured .plan-features li { color: rgba(255,253,246,.78); }
.pricing-card-featured .plan-features i { color: #17200f; background: var(--studio-signal); }

.pricing-privacy { background: #eae4d7; }
.pricing-privacy-panel { border-color: var(--studio-line); border-radius: 16px; background: #fffdf7; box-shadow: 12px 12px 0 rgba(16,21,18,.045); }
.pricing-privacy-panel h2 { color: #172019; letter-spacing: -.055em; }
.pricing-privacy-panel p { color: #68736b; }
.pricing-privacy-icon { color: #16200e; background: var(--studio-signal); }

@media (max-width: 680px) {
  .pricing-hero { padding-top: 128px; }
  .pricing-hero-copy h1 { font-size: clamp(45px, 14vw, 68px); }
  .beta-pricing-note, .pricing-card-featured { box-shadow: 7px 8px 0 rgba(223,255,112,.16); }
  .payment-trust, .pricing-privacy-panel { box-shadow: 7px 8px 0 rgba(16,21,18,.04); }
  .pricing-card { min-height: auto; }
}