/*! JoomlaX /subscription redesign v4 (Aditi Sharma). PREVIEW BUILD — not wired to the live page.
 * Scope: every rule is under .jxsub-v2 (wrapper per v4 SPEC.md); children use jxs- classes.
 * Sections: 1 tokens · 2 reset/base · 3 hero · 4 plan cards · 5 single-extension strip · 6 comparison · 7 trust · 8 FAQ · 9 callout · 10 responsive
 * Font: DM Sans is self-hosted by plg_system_jxspeed on joomlax.com (no Google Fonts call). */
/* 0. host fix: SP Page Builder renders the raw-HTML addon inside an inline-block .clearfix, which shrink-wraps the page. Only affects the element that contains .jxsub-v2. */
.sppb-addon-wrapper > .clearfix:has(> .sppb-addon > .sppb-addon-content > .jxsub-v2){display:block!important;width:100%!important}
.jxsub-v2{display:block!important;width:100%!important;max-width:none!important}
/* 1. tokens */
.jxsub-v2{--jxs-primary:#1819ED;--jxs-primary-hover:#0F10B8;--jxs-tint:#F3F4FD;--jxs-ink:#101828;--jxs-text:#252525;--jxs-text-2:#344054;--jxs-muted:#475467;--jxs-subtle:#717275;--jxs-border:#D0D5DD;--jxs-divider:#E4E7EC;--jxs-footer:#131419;--jxs-tbc-bg:#FFF4CC;--jxs-tbc-text:#7A5A00;--jxs-tbc-line:#B88A00;--jxs-r-sm:8px;--jxs-r-md:12px;--jxs-r-pill:999px;--jxs-container:1200px}
/* 2-10. components (order as in SPEC.md) */
.jxsub-v2,.jxsub-v2 *{box-sizing:border-box!important;margin:0;padding:0;border:0;background:none;box-shadow:none!important;text-shadow:none!important;background-image:none!important}
.jxsub-v2{font-family:"DM Sans",Arial,sans-serif!important;color:var(--jxs-text)!important;font-size:16px;line-height:1.5;background:#fff!important}
.jxsub-v2 a{text-decoration:none;color:inherit}
.jxsub-v2 .jxs-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.jxsub-v2 .jxs-hero{background:var(--jxs-tint)!important;padding:72px 0 64px;text-align:center}
.jxsub-v2 .jxs-eyebrow{display:inline-block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--jxs-primary);margin-bottom:16px}
.jxsub-v2 h1{font-size:48px;line-height:1.15;font-weight:700;color:var(--jxs-ink);letter-spacing:-.02em}
.jxsub-v2 .jxs-lead{font-size:18px;color:var(--jxs-muted);max-width:640px;margin:16px auto 0}
.jxsub-v2 .jxs-plans{padding:56px 0 24px}
.jxsub-v2 .jxs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.jxsub-v2 .jxs-card{border:1px solid var(--jxs-border);border-radius:12px;padding:28px 24px;display:flex;flex-direction:column;background:#fff!important;position:relative}
.jxsub-v2 .jxs-card.rec{border:2px solid var(--jxs-primary);padding:27px 23px}
.jxsub-v2 .jxs-badge{position:absolute;top:-13px;left:23px;background:var(--jxs-primary)!important;color:#fff;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 12px;border-radius:999px}
.jxsub-v2 .jxs-badge.empty{visibility:hidden}
.jxsub-v2 .jxs-card.life .jxs-badge{background:var(--jxs-ink)!important}
.jxsub-v2 .jxs-pname{font-size:20px;font-weight:700;color:var(--jxs-ink)}
.jxsub-v2 .jxs-term{min-height:42px;font-size:14px;color:var(--jxs-subtle);margin-top:2px}
.jxsub-v2 .jxs-price{display:flex;align-items:flex-start;margin:20px 0 4px;color:var(--jxs-ink)}
.jxsub-v2 .jxs-price sup{font-size:22px;font-weight:600;margin-top:8px}
.jxsub-v2 .jxs-price b{font-size:52px;font-weight:700;line-height:1;letter-spacing:-.02em}
.jxsub-v2 .jxs-per{white-space:nowrap;font-size:14px;color:var(--jxs-subtle);margin-bottom:24px}
.jxsub-v2 .jxs-btn{display:block;text-align:center;font-size:16px;font-weight:600;padding:13px 16px;border-radius:8px;border:2px solid var(--jxs-primary);color:var(--jxs-primary)!important;background:#fff!important}
.jxsub-v2 .jxs-btn:hover{background:var(--jxs-tint)!important}
.jxsub-v2 .jxs-btn.pri{background:var(--jxs-primary)!important;color:#fff!important}
.jxsub-v2 .jxs-btn.pri:hover{background:var(--jxs-primary-hover)!important;border-color:var(--jxs-primary-hover)}
.jxsub-v2 .jxs-mbg{font-size:13px;color:var(--jxs-subtle);text-align:center;margin-top:10px}
.jxsub-v2 .jxs-list{list-style:none;margin-top:24px;padding-top:20px;border-top:1px solid var(--jxs-divider);font-size:14px;color:var(--jxs-text-2)}
.jxsub-v2 .jxs-list li{display:flex;gap:10px;padding:5px 0}
.jxsub-v2 .jxs-list li:before{content:"";flex:0 0 16px;height:16px;margin-top:2px;border-radius:50%;background:var(--jxs-primary)!important;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3C/svg%3E")}
.jxsub-v2 .jxs-list li{position:relative}
.jxsub-v2 .jxs-list li:after{content:"";position:absolute;left:5px;top:9px;width:6px;height:3px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.jxsub-v2 h2{font-size:32px;font-weight:700;color:var(--jxs-ink);letter-spacing:-.01em;text-align:center}
.jxsub-v2 .jxs-sec{padding:64px 0}
.jxsub-v2 .jxs-table{width:100%;border-collapse:collapse;margin-top:32px;font-size:15px}
.jxsub-v2 .jxs-table th,.jxsub-v2 .jxs-table td{padding:14px 16px;border-bottom:1px solid var(--jxs-divider);text-align:center}
.jxsub-v2 .jxs-table th:first-child,.jxsub-v2 .jxs-table td:first-child{text-align:left;color:var(--jxs-text-2)}
.jxsub-v2 .jxs-table thead th{font-weight:700;color:var(--jxs-ink);background:var(--jxs-tint)!important}
.jxsub-v2 .jxs-table .rc{background:var(--jxs-tint)!important}
.jxsub-v2 .jxs-table thead th.rc{background:var(--jxs-primary)!important;color:#fff}
.jxsub-v2 .jxs-yes{color:var(--jxs-primary);font-weight:700}
.jxsub-v2 .jxs-trust{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.jxsub-v2 .jxs-tcard{border:1px solid var(--jxs-divider);border-radius:12px;padding:24px;background:#fff!important}
.jxsub-v2 .jxs-tcard h3{font-size:18px;font-weight:700;color:var(--jxs-ink);margin-bottom:8px}
.jxsub-v2 .jxs-tcard p{font-size:14px;color:var(--jxs-muted)}
.jxsub-v2 .jxs-tcard a{color:var(--jxs-primary);font-weight:600}
.jxsub-v2 .jxs-ico{width:40px;height:40px;border-radius:8px;background:var(--jxs-tint)!important;color:var(--jxs-primary);display:flex;align-items:center;justify-content:center;font-weight:700;margin-bottom:16px}
.jxsub-v2 .jxs-faq{max-width:800px;margin:32px auto 0}
.jxsub-v2 details{border-bottom:1px solid var(--jxs-divider);padding:20px 0}
.jxsub-v2 summary{list-style:none;cursor:pointer;font-size:17px;font-weight:600;color:var(--jxs-ink);display:flex;justify-content:space-between;gap:16px}
.jxsub-v2 summary::-webkit-details-marker{display:none}
.jxsub-v2 summary:after{content:"+";color:var(--jxs-primary);font-size:22px;line-height:1}
.jxsub-v2 details[open] summary:after{content:"\2212"}
.jxsub-v2 details p{margin-top:10px;color:var(--jxs-muted);font-size:15px}
.jxsub-v2 .jxs-alt{background:var(--jxs-tint)!important}
.jxsub-v2 .jxs-call{display:flex;align-items:center;justify-content:space-between;gap:24px}
.jxsub-v2 .jxs-call h3{font-size:24px;font-weight:700;color:var(--jxs-ink)}
.jxsub-v2 .jxs-call p{color:var(--jxs-muted);margin-top:4px}
@media(max-width:1100px){.jxsub-v2 .jxs-grid{grid-template-columns:repeat(2,1fr);row-gap:32px}}
@media(max-width:640px){
.jxsub-v2 .jxs-nav nav{display:none}
.jxsub-v2 .jxs-hero{padding:48px 0 40px}
.jxsub-v2 h1{font-size:34px}.jxsub-v2 .jxs-lead{font-size:16px}.jxsub-v2 h2{font-size:26px}
.jxsub-v2 .jxs-grid,.jxsub-v2 .jxs-trust{grid-template-columns:1fr;row-gap:28px}
.jxsub-v2 .jxs-sec{padding:40px 0}.jxsub-v2 .jxs-call{flex-direction:column;align-items:stretch}.jxsub-v2 summary{font-size:16px}.jxsub-v2 .jxs-list{margin-top:16px;padding-top:12px}.jxsub-v2 .jxs-card{padding:24px 20px}.jxsub-v2 .jxs-card.rec{padding:23px 19px}
.jxsub-v2 .jxs-cmp{overflow-x:auto}.jxsub-v2 .jxs-table{min-width:560px;font-size:14px}
.jxsub-v2 .jxs-table th,.jxsub-v2 .jxs-table td{padding:12px 10px}
}
.jxsub-v2 .jxs-list li{display:block!important;padding:5px 0 5px 26px!important}
.jxsub-v2 .jxs-list li:before{position:absolute;left:0;top:7px;width:16px;margin:0!important}
.jxsub-v2 .jxs-list li:after{top:12px!important}
.jxsub-v2 .jxs-tbc{display:inline-block;background:var(--jxs-tbc-bg)!important;color:var(--jxs-tbc-text)!important;border:1px dashed var(--jxs-tbc-line);border-radius:4px;font-size:12px;font-weight:600;padding:1px 6px;line-height:1.5;font-family:"DM Sans",Arial,sans-serif!important}
.jxsub-v2 .jxs-card.rec{background:var(--jxs-tint)!important}
.jxsub-v2 .jxs-single{margin-top:40px;border:1px solid var(--jxs-border);border-radius:12px;padding:24px;display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:16px;align-items:center}
.jxsub-v2 .jxs-single h3{font-size:18px;font-weight:700;color:var(--jxs-ink)}
.jxsub-v2 .jxs-single p{font-size:14px;color:var(--jxs-muted)}
.jxsub-v2 .jxs-sp{border:1px solid var(--jxs-divider);border-radius:8px;padding:12px;text-align:center}
.jxsub-v2 .jxs-sp b{display:block;font-size:22px;color:var(--jxs-ink)}
.jxsub-v2 .jxs-sp span{font-size:13px;color:var(--jxs-subtle)}
.jxsub-v2 .jxs-cart{max-width:1200px;margin:0 auto;padding:48px 24px;display:grid;grid-template-columns:1fr 360px;gap:32px;align-items:start}
.jxsub-v2 .jxs-line{border:1px solid var(--jxs-border);border-radius:12px;padding:20px;display:flex;justify-content:space-between;gap:16px;font-size:16px}
.jxsub-v2 .jxs-line b{color:var(--jxs-ink)}
.jxsub-v2 .jxs-ups{margin-top:20px;border:2px solid var(--jxs-primary);border-radius:12px;padding:24px;background:var(--jxs-tint)!important}
.jxsub-v2 .jxs-ups h3{font-size:22px;font-weight:700;color:var(--jxs-ink)}
.jxsub-v2 .jxs-ups p{color:var(--jxs-text-2);margin-top:8px;font-size:15px}
.jxsub-v2 .jxs-act{display:flex;gap:20px;align-items:center;margin-top:20px;flex-wrap:wrap}
.jxsub-v2 .jxs-ups .jxs-btn{display:inline-block}
.jxsub-v2 .jxs-no{color:var(--jxs-primary);font-weight:600;font-size:15px;text-decoration:underline}
.jxsub-v2 .jxs-sum{border:1px solid var(--jxs-border);border-radius:12px;padding:24px}
.jxsub-v2 .jxs-sum h3{font-size:18px;color:var(--jxs-ink);margin-bottom:12px}
.jxsub-v2 .jxs-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--jxs-divider);font-size:15px}
.jxsub-v2 .jxs-cart h1{font-size:32px;grid-column:1/-1}
@media(max-width:900px){.jxsub-v2 .jxs-single{grid-template-columns:1fr 1fr}.jxsub-v2 .jxs-single>div:first-child{grid-column:1/-1}.jxsub-v2 .jxs-cart{grid-template-columns:1fr;padding:32px 16px}.jxsub-v2 .jxs-cart h1{font-size:26px}.jxsub-v2 .jxs-ups .jxs-btn{display:block;width:100%}}
.jxsub-v2 .jxs-grid>.jxs-card{order:1}
.jxsub-v2 .jxs-grid>.jxs-card.rec{order:2}
.jxsub-v2 .jxs-grid>.jxs-card.life{order:3}
@media(max-width:1100px){.jxsub-v2 .jxs-grid>.jxs-card.rec{order:0}}
/* 4b. host fix: Helix styles <sup> (vertical-align/position); pin the price "$" to the mockup position */
.jxsub-v2 .jxs-price sup{position:static!important;vertical-align:baseline!important;top:auto!important;line-height:1!important;font-size:22px!important}
