/* Pricing page layout — tokens inherit from assets/css/tokens.css */

    body.hub-pricing main *{box-sizing:border-box}
    body.hub-pricing{scroll-behavior:smooth}
    body.hub-pricing{
      margin:0;
      color:var(--ink);
      background:#fff;
      line-height:1.55;
    }
    body.hub-pricing main a{color:inherit;text-decoration:none}
    body.hub-pricing main button,
body.hub-pricing main input{font:inherit}
    body.hub-pricing main .container{max-width:var(--max);margin:auto;padding:0 28px}
    body.hub-pricing main .section{padding:92px 0;scroll-margin-top:140px}
    body.hub-pricing main .soft{background:var(--surface)}
    body.hub-pricing main .dark{background:var(--navy);color:#fff}
    body.hub-pricing main .eyebrow{
      display:inline-flex;align-items:center;gap:9px;text-transform:uppercase;
      letter-spacing:.14em;font-size:12px;font-weight:900;color:var(--blue)
    }
    body.hub-pricing main .eyebrow:before{content:"";width:22px;height:2px;background:currentColor;border-radius:999px}
    body.hub-pricing main h1,
body.hub-pricing main h2,
body.hub-pricing main h3,
body.hub-pricing main h4{letter-spacing:-.035em}
    body.hub-pricing main .section-head{max-width:800px;margin-bottom:42px}
    body.hub-pricing main .section-head h2{font-size:var(--text-h2);line-height:var(--lh-h2);margin:12px 0 18px}
    body.hub-pricing main .section-head p{font-size:18px;color:var(--slate);margin:0}
    body.hub-pricing main .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:10px;
      min-height:48px;padding:0 19px;border-radius:13px;border:1px solid transparent;
      font-weight:900;font-size:14px;cursor:pointer;transition:.2s ease
    }
    body.hub-pricing main .btn:hover{box-shadow:0 10px 24px rgba(11,31,77,.16)}
    body.hub-pricing main .btn-blue{background:var(--blue);color:#fff}
    body.hub-pricing main .btn-primary{background:var(--champagne);color:var(--navy)}
    body.hub-pricing main .btn-light{background:#fff;color:var(--navy);border-color:var(--line)}
    body.hub-pricing main .btn-outline{border-color:var(--line);color:var(--navy);background:#fff}

    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

    
    body.hub-pricing main .hero{
      color:var(--navy);padding:92px 0 72px;
      background:var(--j2p-hero-bg)
    }
    body.hub-pricing main .hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:55px;align-items:center}
    body.hub-pricing main .hero.hero--text-only .hero-grid{grid-template-columns:1fr}
    body.hub-pricing main .hero .eyebrow{color:var(--blue)}
    body.hub-pricing main .hero h1{font-size:var(--j2p-hero-h1);line-height:var(--lh-h1);margin:0 0 22px;letter-spacing:-.04em;height:auto}
    body.hub-pricing main .hero h1 span{color:var(--blue)}
    body.hub-pricing main .hero p{font-size:var(--text-body-large);color:var(--slate);max-width:var(--j2p-hero-copy-max);margin:0}

    body.hub-pricing main .hero-card{
      background:#fff;border:1px solid var(--line);
      border-radius:26px;padding:26px;box-shadow:0 40px 100px rgba(11,31,77,.12)
    }
    body.hub-pricing main .hero-card small{display:block;color:var(--blue);font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:900}
    body.hub-pricing main .hero-card strong{display:block;color:var(--navy);font-size:var(--text-h3);margin:8px 0 5px}
    body.hub-pricing main .hero-card p{font-size:13px;color:var(--slate);max-width:none}
    body.hub-pricing main .hero-ladder{margin-top:20px;display:grid;gap:9px}
    body.hub-pricing main .hero-ladder div{
      display:flex;justify-content:space-between;gap:10px;align-items:center;
      padding:11px 13px;border-radius:12px;background:var(--surface);border:1px solid var(--line)
    }
    body.hub-pricing main .hero-ladder b{font-size:12px;color:var(--navy)}body.hub-pricing main .hero-ladder span{font-size:11px;color:var(--blue);font-weight:900}

    
    body.hub-pricing main .billing-wrap{display:flex;justify-content:center;margin:-28px auto 44px;position:relative;z-index:4}
    body.hub-pricing main .billing{
      display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);
      border-radius:16px;padding:6px;box-shadow:var(--shadow-soft)
    }
    body.hub-pricing main .billing button{
      border:0;background:transparent;color:var(--slate);font-weight:900;font-size:13px;
      border-radius:11px;padding:10px 15px;cursor:pointer
    }
    body.hub-pricing main .billing button.active{background:var(--navy);color:#fff}
    body.hub-pricing main .save{padding:6px 9px;border-radius:999px;background:#ECFDF5;color:#166534;font-size:10px;font-weight:950;margin-inline-start:4px}

    
    body.hub-pricing main .price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    body.hub-pricing main .price-card{
      border:1px solid var(--line);border-radius:22px;padding:26px;background:#fff;position:relative;
      box-shadow:0 8px 28px rgba(2,6,23,.04);display:flex;flex-direction:column
    }
    body.hub-pricing main .price-card.featured{border:2px solid var(--blue);box-shadow:0 20px 55px rgba(29,78,216,.13)}
    body.hub-pricing main .price-card.launch{border-color:var(--champagne);background:linear-gradient(180deg,#FFF9EF,#fff 36%)}
    body.hub-pricing main .card-badge{
      position:absolute;top:-13px;inset-inline-start:20px;padding:6px 10px;border-radius:999px;
      font-size:9px;letter-spacing:.08em;font-weight:950
    }
    body.hub-pricing main .card-badge.pop{background:var(--blue);color:#fff}
    body.hub-pricing main .card-badge.site{background:var(--champagne);color:var(--navy)}
    body.hub-pricing main .plan-name{font-size:12px;color:var(--blue);font-weight:950;letter-spacing:.08em;text-transform:uppercase}
    body.hub-pricing main .price-card h3{margin:8px 0 7px;font-size:27px;color:var(--navy)}
    body.hub-pricing main .plan-copy{color:var(--slate);font-size:13px;min-height:42px;margin-bottom:18px}
    body.hub-pricing main .price{display:flex;align-items:end;gap:7px;margin:7px 0 4px}
    body.hub-pricing main .price .amount{font-size:42px;line-height:1;font-weight:950;color:var(--navy);letter-spacing:-.055em}
    body.hub-pricing main .price .currency{font-size:12px;color:var(--slate);padding-bottom:4px;font-weight:800}
    body.hub-pricing main .annual-note{font-size:11px;color:var(--muted);min-height:18px}
    body.hub-pricing main .annual-note:empty{visibility:hidden}
    body.hub-pricing main .plan-divider{height:1px;background:var(--line);margin:21px 0}
    body.hub-pricing main .features{display:grid;gap:10px;margin-bottom:23px}
    body.hub-pricing main .feat{display:flex;gap:9px;color:#334155;font-size:12px}
    body.hub-pricing main .feat:before{content:"\e182";font-family:"Phosphor";width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#EEF4FF;color:var(--blue);font-weight:normal;flex:0 0 20px}
    body.hub-pricing main .price-card .btn{margin-top:auto}

    
    body.hub-pricing main .payment-commercial{
      margin-top:28px;border-radius:22px;padding:26px;background:linear-gradient(130deg,#08183A,#0D2D6C);color:#fff;
      display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center
    }
    body.hub-pricing main .payment-commercial h3{font-size:27px;margin:4px 0 7px}
    body.hub-pricing main .payment-commercial p{margin:0;color:rgba(255,255,255,.68);font-size:13px}
    body.hub-pricing main .payment-rate{text-align:right}
    body.hub-pricing main .payment-rate b{display:block;color:var(--champagne);font-size:33px;line-height:1}
    body.hub-pricing main .payment-rate span{font-size:10px;color:rgba(255,255,255,.55)}

    
    body.hub-pricing main .compare-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:22px}
    body.hub-pricing main .compare-head h2{font-size:var(--text-h2);line-height:var(--lh-h2);margin:10px 0 0;letter-spacing:var(--tracking-heading)}
    body.hub-pricing main .difference-toggle{
      display:flex;align-items:center;gap:10px;font-size:12px;color:var(--slate);font-weight:850;
      background:#fff;border:1px solid var(--line);border-radius:13px;padding:10px 12px;
      cursor:pointer;user-select:none
    }
    body.hub-pricing main .switch{position:relative;width:42px;height:23px;background:#CBD5E1;border-radius:999px;cursor:pointer;transition:.2s}
    body.hub-pricing main .switch:after{content:"";position:absolute;width:17px;height:17px;background:#fff;border-radius:50%;left:3px;top:3px;box-shadow:0 2px 7px rgba(0,0,0,.15);transition:.2s}
    body.hub-pricing main .switch.on{background:var(--blue)}body.hub-pricing main .switch.on:after{transform:translateX(19px)}
    body.hub-pricing main .compare-scroll{overflow:auto;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow-soft)}
    body.hub-pricing main table{border-collapse:separate;border-spacing:0;width:100%;min-width:1120px}
    body.hub-pricing main th,
body.hub-pricing main td{padding:14px 13px;border-bottom:1px solid #EDF2F7;text-align:center;font-size:12px}
    body.hub-pricing main th:first-child,
body.hub-pricing main td:first-child{text-align:start;position:sticky;inset-inline-start:0;background:#fff;z-index:2;min-width:245px}
    body.hub-pricing main thead th{position:sticky;top:0;background:#F8FAFC;color:var(--navy);font-size:11px;text-transform:uppercase;letter-spacing:.05em;z-index:3}
    body.hub-pricing main thead th:first-child{z-index:4;background:#F8FAFC}
    body.hub-pricing main .group-row td{
      text-align:left!important;background:#F8FAFC!important;color:var(--navy);font-weight:950;
      text-transform:uppercase;letter-spacing:.08em;font-size:10px
    }
    body.hub-pricing main .yes{color:var(--success);font-weight:950}body.hub-pricing main .no{color:#CBD5E1}body.hub-pricing main .limit{font-weight:850;color:#334155}
    body.hub-pricing main tr:last-child td{border-bottom:0}
    body.hub-pricing main tr.hidden-difference{display:none}

    
    body.hub-pricing main .quick-compare{
      margin-top:24px;padding:22px;border:1px solid var(--line);border-radius:18px;background:#fff
    }
    body.hub-pricing main .quick-compare h3{margin:0 0 15px;color:var(--navy);font-size:20px}
    body.hub-pricing main .quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
    body.hub-pricing main .quick-card{border:1px solid var(--line);border-radius:15px;padding:15px}
    body.hub-pricing main .quick-card b{display:block;color:var(--navy);font-size:15px}
    body.hub-pricing main .quick-card span{display:block;color:var(--slate);font-size:11px;margin-top:4px}

    
    body.hub-pricing main .addon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    body.hub-pricing main .addon{border:1px solid var(--line);border-radius:20px;padding:23px;background:#fff}
    body.hub-pricing main .addon h3{margin:0 0 8px;color:var(--navy);font-size:20px}
    body.hub-pricing main .addon p{margin:0;color:var(--slate);font-size:13px}
    body.hub-pricing main .addon strong{display:block;margin-top:16px;color:var(--blue);font-size:17px}

    
    body.hub-pricing main .faq{display:grid;gap:12px}
    body.hub-pricing main details{border:1px solid var(--line);border-radius:16px;padding:18px 20px;background:#fff}
    body.hub-pricing main summary{cursor:pointer;font-weight:900;color:var(--navy)}
    body.hub-pricing main details p{color:var(--slate);font-size:14px;margin:12px 0 0}

    
    body.hub-pricing main .final-cta{padding:82px 0;background:linear-gradient(110deg,#081638,#0B1F4D 55%,#163E8A);color:#fff}
    body.hub-pricing main .cta-row{display:flex;justify-content:space-between;align-items:center;gap:40px}
    body.hub-pricing main .cta-row h2{font-size:var(--text-h2);line-height:var(--lh-h2);letter-spacing:var(--tracking-heading);margin:0 0 14px}
    body.hub-pricing main .cta-row p{color:rgba(255,255,255,.7);max-width:650px;margin:0}
    body.hub-pricing main .cta-actions{display:flex;gap:10px;flex-shrink:0}

    
    
    
    
    
    
    
    

    @media(max-width:1050px){

      
      body.hub-pricing main .hero-grid{grid-template-columns:1fr}
      body.hub-pricing main .price-grid{grid-template-columns:repeat(2,1fr)}
      body.hub-pricing main .addon-grid{grid-template-columns:1fr 1fr}
      
    
}

    @media(max-width:720px){

      body.hub-pricing main .container{padding:0 20px}body.hub-pricing main .section{padding:72px 0}body.hub-pricing main .hero{padding-top:58px}
      body.hub-pricing main .hero h1{font-size:var(--j2p-hero-h1)}
      body.hub-pricing main .price-grid,
body.hub-pricing main .addon-grid,
body.hub-pricing main .quick-grid{grid-template-columns:1fr}
      body.hub-pricing main .payment-commercial{grid-template-columns:1fr}body.hub-pricing main .payment-rate{text-align:left}
      body.hub-pricing main .compare-head{display:block}body.hub-pricing main .difference-toggle{width:max-content;margin-top:16px}
      body.hub-pricing main .cta-row{display:block}body.hub-pricing main .cta-actions{margin-top:26px;flex-wrap:wrap}
      
      body.hub-pricing main .legal-inline{margin-top:10px;flex-wrap:wrap}
    
}