:root{--blue:#1677f0;--blue2:#0d5fd1;--ink:#0b1020;--muted:#667085;--line:#e8edf5;--bg:#f6f8fc;--white:#fff;--green:#0f9f6e;--red:#d92d20}
*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
a{color:inherit}.shell{max-width:1180px;margin:auto;padding:0 24px}.top{background:#05070c;color:white}.nav{height:78px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:14px;text-decoration:none}.brand img{width:190px;max-height:56px;object-fit:contain}.brand-fallback{font-weight:900;letter-spacing:.5px;font-size:23px}.brand-fallback b{color:var(--blue)}.secure{font-size:13px;color:#b7c0d2}
.hero{background:radial-gradient(circle at 80% 20%,rgba(22,119,240,.25),transparent 34%),linear-gradient(135deg,#05070c,#111b32);color:white;padding:68px 0 94px}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}.eyebrow{color:#78b6ff;font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:12px}.hero h1{font-size:52px;line-height:1.02;margin:12px 0 18px;letter-spacing:-2px}.hero p{font-size:18px;line-height:1.7;color:#cbd5e6;max-width:680px}.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:28px}.trust span{padding:9px 13px;border:1px solid #263550;border-radius:999px;color:#dce7f7;font-size:13px}
.hero-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:28px;box-shadow:0 30px 70px rgba(0,0,0,.25)}.hero-card h3{margin-top:0}.hero-card .mini{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.12)}.hero-card .mini:last-child{border:0}
.pay-wrap{margin-top:-54px;padding-bottom:70px}.panel{background:white;border:1px solid var(--line);border-radius:24px;box-shadow:0 22px 60px rgba(13,31,62,.10);overflow:hidden}.panel-head{padding:28px 30px;border-bottom:1px solid var(--line)}.panel-head h2{margin:0 0 6px;font-size:28px}.panel-head p{margin:0;color:var(--muted)}
.pay-grid{display:grid;grid-template-columns:1fr 380px}.catalog{padding:28px 30px}.summary{padding:28px;background:#fbfcff;border-left:1px solid var(--line)}
.section-title{font-size:13px;text-transform:uppercase;letter-spacing:.11em;color:#64748b;font-weight:800;margin:22px 0 12px}.section-title:first-child{margin-top:0}
.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.option{border:1px solid #dce3ee;border-radius:14px;padding:14px;cursor:pointer;display:flex;gap:12px;align-items:flex-start;transition:.18s;background:#fff}.option:hover{border-color:#9dc6fb;box-shadow:0 5px 18px rgba(22,119,240,.08)}.option.active{border:2px solid var(--blue);padding:13px;background:#f5f9ff}.option input{margin-top:4px}.option strong{display:block;font-size:14px}.option small{display:block;color:var(--muted);margin-top:3px}
.field{margin:14px 0}.field label{display:block;font-size:13px;font-weight:700;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;padding:12px 13px;border:1px solid #d7deea;border-radius:10px;font:inherit;background:white;outline:none}.field input:focus,.field select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(22,119,240,.12)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.btn{border:0;border-radius:11px;padding:13px 17px;font-weight:800;font-size:14px;cursor:pointer;background:var(--blue);color:white;box-shadow:0 8px 18px rgba(22,119,240,.18)}.btn:hover{background:var(--blue2)}.btn.secondary{background:#eef3fa;color:#22304a;box-shadow:none}.btn.danger{background:#fff0ef;color:var(--red);box-shadow:none}.btn.full{width:100%;font-size:16px;padding:15px}
.total-row{display:flex;justify-content:space-between;gap:20px;padding:10px 0;color:#475467}.total-row.total{font-size:20px;color:var(--ink);font-weight:900;border-top:1px solid var(--line);margin-top:8px;padding-top:16px}.notice{font-size:12px;color:#667085;line-height:1.55;margin-top:14px}.coupon-row{display:flex;gap:8px}.coupon-row input{flex:1}.badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:#eaf7f2;color:#087a54;font-size:12px;font-weight:800}.error{padding:12px 14px;background:#fff1f0;border:1px solid #ffd2cf;color:#a6251d;border-radius:10px;margin:12px 0}.success{padding:12px 14px;background:#ecfdf5;border:1px solid #b7efd7;color:#087a54;border-radius:10px;margin:12px 0}
.footer{padding:34px 0;color:#7a8699;text-align:center;font-size:13px}
.admin-body{background:#f4f7fb}.admin-layout{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.sidebar{background:#070b13;color:white;padding:25px 18px;position:sticky;top:0;height:100vh}.sidebar .brand{margin:0 8px 28px}.sidebar .brand img{width:175px}.menu a{display:block;text-decoration:none;color:#aebbd0;padding:11px 13px;border-radius:9px;margin:4px 0;font-weight:650;font-size:14px}.menu a:hover,.menu a.active{background:#16243b;color:white}.admin-main{padding:34px;max-width:1350px;width:100%}.admin-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.admin-top h1{margin:0;font-size:30px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat,.admin-card{background:white;border:1px solid #e5eaf2;border-radius:16px;padding:20px;box-shadow:0 7px 20px rgba(15,23,42,.04)}.stat small{color:#718096}.stat strong{display:block;font-size:26px;margin-top:7px}.admin-card{margin-top:18px}.admin-card h3{margin-top:0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th,td{text-align:left;padding:12px;border-bottom:1px solid #edf1f6;white-space:nowrap}th{color:#667085;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.login{min-height:100vh;display:grid;place-items:center;padding:25px;background:radial-gradient(circle at 70% 20%,#183d78,#070b13 45%)}.login-card{width:min(440px,100%);background:white;border-radius:22px;padding:30px;box-shadow:0 30px 80px rgba(0,0,0,.35)}.login-card .brand-fallback{text-align:center;margin-bottom:20px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.tabs a{text-decoration:none;padding:9px 12px;border-radius:9px;background:#eef3f8;color:#475467;font-size:13px;font-weight:800}.tabs a.active{background:#0f6ee8;color:white}
@media(max-width:900px){.hero-grid,.pay-grid,.admin-layout{grid-template-columns:1fr}.hero h1{font-size:40px}.hero-card{display:none}.summary{border-left:0;border-top:1px solid var(--line)}.sidebar{position:relative;height:auto}.cards{grid-template-columns:1fr 1fr}.options{grid-template-columns:1fr}}
@media(max-width:560px){.shell{padding:0 15px}.hero{padding-top:45px}.hero h1{font-size:35px}.catalog,.summary,.panel-head{padding:20px}.row,.cards{grid-template-columns:1fr}.brand img{width:160px}}

/* ===== Mobilize 360 Payment Portal v2 ===== */
.portal-v2{background:#f7f9fc;color:#111827}
.portal-v2 .site-header{background:#07090d;border-bottom:1px solid rgba(255,255,255,.08);position:relative;z-index:5}
.portal-v2 .nav{height:84px}.portal-v2 .brand img{width:205px;max-height:58px}.header-right{display:flex;align-items:center;gap:9px;color:#c9d2df;font-size:13px;font-weight:650}.secure-dot{width:8px;height:8px;background:#2ed47a;border-radius:50%;box-shadow:0 0 0 4px rgba(46,212,122,.12)}
.payment-intro{background:linear-gradient(135deg,#07090d 0%,#0b1220 72%,#0b2448 100%);color:#fff;padding:54px 0 72px}.payment-intro .shell{display:flex;align-items:flex-end;justify-content:space-between;gap:35px}.intro-copy{max-width:700px}.intro-copy h1{font-size:46px;line-height:1.05;letter-spacing:-1.7px;margin:10px 0 13px}.intro-copy p{margin:0;color:#b9c4d3;font-size:17px;line-height:1.6}.trust-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.trust-row span{font-size:12px;font-weight:700;color:#dbe6f5;border:1px solid #25344b;background:rgba(255,255,255,.035);border-radius:999px;padding:8px 11px}
.checkout-shell{margin-top:-34px;padding-bottom:70px;position:relative;z-index:2}.checkout-layout{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:24px;align-items:start}.checkout-main{display:grid;gap:18px}.form-card,.order-card{background:#fff;border:1px solid #e6ebf2;border-radius:18px;box-shadow:0 8px 28px rgba(16,24,40,.055)}.form-card{padding:26px}.card-heading{display:flex;gap:14px;align-items:flex-start;margin-bottom:22px}.card-heading h2{font-size:20px;margin:0 0 4px;letter-spacing:-.25px}.card-heading p{margin:0;color:#7a8699;font-size:13px}.step-number{width:30px;height:30px;display:grid;place-items:center;flex:0 0 30px;border-radius:9px;background:#eaf3ff;color:#0874e8;font-weight:900;font-size:13px}
.pay-type-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.pay-type{appearance:none;border:1px solid #dfe5ee;background:#fff;border-radius:13px;padding:14px;text-align:left;cursor:pointer;transition:.16s;color:#182230}.pay-type:hover{border-color:#a8cdf9}.pay-type.active{border:2px solid #0874e8;padding:13px;background:#f5f9ff;box-shadow:0 0 0 3px rgba(8,116,232,.06)}.pay-type strong,.pay-type small{display:block}.pay-type strong{font-size:13px;margin:6px 0 2px}.pay-type small{font-size:11px;color:#7c8797;line-height:1.3}.type-icon{display:grid;width:29px;height:29px;place-items:center;background:#edf4fc;color:#0874e8;border-radius:8px;font-weight:900}.choice-panel{display:none;margin-top:20px}.choice-panel.active{display:block}.portal-v2 .field{margin:13px 0}.portal-v2 .field label,.package-label{font-size:12px;font-weight:800;color:#344054;margin-bottom:7px;display:block}.portal-v2 .field label em{font-style:normal;color:#0874e8}.portal-v2 .field input,.portal-v2 .field select{border:1px solid #d8e0ea;border-radius:10px;padding:12px 13px;background:#fff;font-size:14px;transition:.15s}.portal-v2 .field input:focus,.portal-v2 .field select:focus{border-color:#0874e8;box-shadow:0 0 0 3px rgba(8,116,232,.09)}.portal-v2 .field small{display:block;color:#7a8699;font-size:11px;margin-top:6px}
.package-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.package-option{border:1px solid #dfe5ed;background:#fff;border-radius:11px;padding:12px 8px;cursor:pointer;text-align:center;color:#344054}.package-option span,.package-option strong{display:block}.package-option span{font-size:11px;min-height:29px;display:flex;align-items:center;justify-content:center}.package-option strong{font-size:14px;margin-top:4px}.package-option:hover,.package-option.selected{border-color:#0874e8;background:#f4f9ff;color:#075fb9}.package-option.selected{box-shadow:inset 0 0 0 1px #0874e8}
.subscription-choice{border:1px solid #dfe5ed;border-radius:14px;padding:18px;display:flex;justify-content:space-between;align-items:center;cursor:pointer}.subscription-choice:hover,.subscription-choice.selected{border-color:#0874e8;background:#f6faff;box-shadow:inset 0 0 0 1px #0874e8}.subscription-choice h3{margin:8px 0 3px;font-size:17px}.subscription-choice p{margin:0;color:#7a8699;font-size:12px}.subscription-choice>strong{font-size:24px}.subscription-choice>strong span{font-size:12px;color:#7a8699}.custom-toggle{display:grid;grid-template-columns:1fr 1fr;background:#f1f4f8;border-radius:11px;padding:4px;gap:4px}.custom-mode{border:0;background:transparent;padding:10px;border-radius:8px;font-weight:750;color:#667085;cursor:pointer}.custom-mode.active{background:#fff;color:#0874e8;box-shadow:0 2px 7px rgba(16,24,40,.08)}.money-input{position:relative}.money-input span{position:absolute;left:14px;top:11px;font-weight:800;color:#667085}.money-input input{padding-left:29px!important;font-size:20px!important;font-weight:800}.address-row{display:grid;grid-template-columns:1.5fr .65fr .8fr;gap:12px}.portal-v2 .row{gap:12px}
.order-sidebar{position:sticky;top:18px}.order-card{padding:22px}.order-title{display:flex;justify-content:space-between;align-items:center;padding-bottom:17px;border-bottom:1px solid #edf0f4}.order-title h3{margin:0;font-size:17px}.stripe-pill{font-weight:900;font-style:italic;color:#635bff;font-size:15px}.selected-product{display:flex;gap:12px;align-items:center;padding:18px 0;border-bottom:1px solid #edf0f4}.selected-product.empty{opacity:.55}.selected-icon{width:42px;height:42px;display:grid;place-items:center;background:#0874e8;color:#fff;border-radius:11px;font-weight:950}.selected-product small,.selected-product strong,.selected-product span{display:block}.selected-product small{font-size:9px;letter-spacing:.09em;color:#98a2b3;font-weight:900}.selected-product strong{font-size:13px;margin:3px 0}.selected-product span{font-size:11px;color:#7a8699}.summary-lines{padding:13px 0;border-bottom:1px solid #edf0f4}.summary-lines>div{display:flex;justify-content:space-between;padding:5px 0;font-size:12px;color:#667085}.summary-lines strong{color:#344054}.coupon-box{padding:15px 0;border-bottom:1px solid #edf0f4}.coupon-box>label{font-size:11px;font-weight:800;color:#475467;display:block;margin-bottom:7px}.portal-v2 .coupon-row{gap:7px}.portal-v2 .coupon-row input{min-width:0;padding:9px 10px;border:1px solid #d8e0ea;border-radius:9px}.portal-v2 .coupon-row .btn{padding:9px 12px}.coupon-success{display:block;color:#087a54;font-size:11px;font-weight:750;margin-top:7px}.coupon-error{display:block;color:#b42318;font-size:11px;margin-top:7px}.grand-total{display:flex;justify-content:space-between;align-items:flex-start;padding:18px 0}.grand-total>span{font-size:14px;font-weight:800}.grand-total div{text-align:right}.grand-total strong{display:block;font-size:25px;letter-spacing:-.6px}.grand-total small{font-size:10px;color:#7a8699}.checkout-btn{border-radius:10px;background:#0874e8;box-shadow:0 8px 18px rgba(8,116,232,.18)}.checkout-btn span{float:right}.secure-note{display:flex;gap:9px;align-items:flex-start;background:#f8fafc;border-radius:10px;padding:11px;margin-top:12px}.secure-note p{margin:0;font-size:10px;color:#7a8699;line-height:1.45}.secure-note strong{display:block;color:#475467;font-size:11px}.top-error{max-width:780px;margin:0 0 15px}
.footer-v2{background:#07090d;color:#7f8b9d;padding:28px 0}.footer-v2 .shell{display:flex;align-items:center;gap:25px;font-size:11px}.footer-v2 .footer-brand img{width:130px;max-height:40px;object-fit:contain}.footer-v2 p{margin:0;flex:1}
@media(max-width:980px){.payment-intro .shell{display:block}.trust-row{justify-content:flex-start;margin-top:20px}.checkout-layout{grid-template-columns:1fr}.order-sidebar{position:static}.package-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.header-right{font-size:0}.payment-intro{padding:38px 0 58px}.intro-copy h1{font-size:34px}.intro-copy p{font-size:15px}.trust-row span{font-size:10px}.form-card{padding:19px}.pay-type-tabs{grid-template-columns:1fr}.pay-type{display:grid;grid-template-columns:34px 1fr;column-gap:8px;align-items:center}.pay-type .type-icon{grid-row:1/3}.pay-type strong{margin:0}.pay-type small{grid-column:2}.address-row,.portal-v2 .row{grid-template-columns:1fr}.footer-v2 .shell{flex-wrap:wrap}.footer-v2 p{flex-basis:100%;order:3}}

/* ===== v1.4 Dynamic branding + modern admin controls ===== */
:root{--brand-primary:#0874e8;--brand-accent:#0b2448;--brand-dark:#07090d;--brand-bg:#f7f9fc}
.portal-v2{background:var(--brand-bg)}
.portal-v2 .site-header,.footer-v2{background:var(--brand-dark)}
.payment-intro{background:linear-gradient(135deg,var(--brand-dark) 0%,#0b1220 60%,var(--brand-accent) 100%)}
.step-number,.type-icon{color:var(--brand-primary)}
.pay-type.active{border-color:var(--brand-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-primary) 8%,transparent)}
.portal-v2 .field input:focus,.portal-v2 .field select:focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-primary) 10%,transparent)}
.package-option:hover,.package-option.selected,.subscription-choice:hover,.subscription-choice.selected{border-color:var(--brand-primary)}
.package-option.selected{box-shadow:inset 0 0 0 1px var(--brand-primary);color:var(--brand-primary)}
.selected-icon,.checkout-btn{background:var(--brand-primary)}
.custom-mode.active{color:var(--brand-primary)}
.portal-v2 .btn:not(.secondary){background:var(--brand-primary)}
.admin-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:22px}.admin-section-head h3{margin:0 0 5px}.admin-section-head p{margin:0;color:#7a8699;font-size:13px}
.branding-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:30px}.modern-upload{border:1.5px dashed #cbd5e1;border-radius:14px;padding:16px;display:flex!important;align-items:center;gap:12px;cursor:pointer;background:#fafcff;transition:.18s}.modern-upload:hover{border-color:#0874e8;background:#f5f9ff}.modern-upload input{display:none}.upload-icon{width:38px;height:38px;border-radius:10px;background:#eaf3ff;display:grid;place-items:center;color:#0874e8;font-size:20px;font-weight:800}.modern-upload strong,.modern-upload small{display:block}.modern-upload strong{font-size:13px;color:#344054}.modern-upload small{font-size:11px;color:#98a2b3;margin-top:2px}
.color-settings{border:1px solid #e8edf4;border-radius:14px;overflow:hidden;margin-top:18px}.color-control{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:14px 15px;border-bottom:1px solid #edf1f6}.color-control:last-child{border-bottom:0}.color-copy label,.color-copy small{display:block}.color-copy label{font-size:13px;font-weight:800;color:#344054}.color-copy small{font-size:10px;color:#98a2b3;margin-top:2px}.modern-color{display:flex;align-items:center;gap:8px}.modern-color input[type=color]{appearance:none;-webkit-appearance:none;width:38px;height:38px;padding:0;border:0;background:none;cursor:pointer}.modern-color input[type=color]::-webkit-color-swatch-wrapper{padding:0}.modern-color input[type=color]::-webkit-color-swatch{border:2px solid white;border-radius:10px;box-shadow:0 0 0 1px #d7dee8,0 2px 5px rgba(0,0,0,.08)}.hex-input{width:92px!important;text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-size:12px!important;padding:9px!important}
.admin-actions{display:flex;gap:9px;margin-top:18px}.modern-primary,.modern-ghost{border-radius:10px!important;transition:.15s!important}.modern-primary:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(8,116,232,.18)!important}.modern-ghost{background:#f2f5f9!important;color:#475467!important;box-shadow:none!important}.modern-ghost:hover{background:#e8edf4!important}
.brand-preview-wrap>label{display:block;font-size:12px;font-weight:800;color:#344054;margin-bottom:8px}.brand-preview{--preview-primary:#0874e8;--preview-accent:#0b2448;--preview-dark:#07090d;--preview-bg:#f7f9fc;border:1px solid #dfe5ee;border-radius:16px;overflow:hidden;box-shadow:0 15px 35px rgba(16,24,40,.08);background:var(--preview-bg)}.preview-header{background:var(--preview-dark);height:64px;padding:11px 16px;display:flex;justify-content:space-between;align-items:center;color:#cbd5e1;font-size:9px}.preview-logo img{width:125px;max-height:42px;object-fit:contain}.preview-body{padding:24px;background:linear-gradient(150deg,var(--preview-dark),var(--preview-accent));color:white}.preview-body>small{color:#7abaff;font-size:8px;font-weight:900;letter-spacing:.12em}.preview-body h2{font-size:21px;margin:7px 0}.preview-body p{font-size:10px;color:#c5cfdd}.preview-choice{background:white;color:#344054;border-radius:10px;padding:11px 12px;display:flex;justify-content:space-between;margin:18px 0 10px;font-size:11px}.preview-body button{width:100%;border:0;border-radius:9px;background:var(--preview-primary);color:white;padding:11px;font-weight:800}
@media(max-width:1050px){.branding-grid{grid-template-columns:1fr}.brand-preview-wrap{max-width:560px}}
@media(max-width:600px){.color-control{align-items:flex-start;flex-direction:column}.modern-color{width:100%}.hex-input{flex:1;width:auto!important}.admin-actions{flex-direction:column}}