﻿/* ─── GRAPHIK SELF-HOSTED ─── */
@font-face{font-family:'Graphik';src:url('../font/Graphik/Graphik-Light-Web.woff2') format('woff2'),url('../font/Graphik/Graphik-Light-Web.woff') format('woff');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'Graphik';src:url('../font/Graphik/Graphik-Regular-Web.woff2') format('woff2'),url('../font/Graphik/Graphik-Regular-Web.woff') format('woff');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Graphik';src:url('../font/Graphik/Graphik-Medium-Web.woff2') format('woff2'),url('../font/Graphik/Graphik-Medium-Web.woff') format('woff');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Graphik';src:url('../font/Graphik/Graphik-Semibold-Web.woff2') format('woff2'),url('../font/Graphik/Graphik-Semibold-Web.woff') format('woff');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Graphik';src:url('../font/Graphik/Graphik-Bold-Web.woff2') format('woff2'),url('../font/Graphik/Graphik-Bold-Web.woff') format('woff');font-weight:700;font-style:normal;font-display:swap;}
:root{
  --p:#A100FF;--pl:#BF5AFF;--pd:#7300BF;--pa:rgba(161,0,255,.12);
  --bk:#080014;--bk2:#0f0020;--bk3:#1a0035;
  --ok:#00C07F;--warn:#FF8C00;--danger:#FF3B30;--info:#3B82F6;
  --t1:#0d0020;--t2:#3d2a5c;--t3:#7c6a9a;
  --font:'Graphik',Arial,Helvetica,sans-serif;
  --disp:'Graphik',Arial,Helvetica,sans-serif;
  --body:'Graphik',Arial,Helvetica,sans-serif;
  --r:12px;--rl:16px;--ease:cubic-bezier(.4,0,.2,1);
  --color-border-secondary:rgba(255,255,255,.12);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--font);background:var(--bk);color:#fff;overflow-x:hidden;}
.page{display:none !important;}
.page.active{display:block !important;}
/* Animated gradient mesh */
#bg-canvas{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.6;}
/* Gradient orbs */
body::before{content:'';position:fixed;top:-20%;left:-10%;width:60%;height:60%;pointer-events:none;z-index:0;animation:orbFloat 8s ease-in-out infinite;} /* background:radial-gradient(circle,rgba(161,0,255,.18) 0%,transparent 70%); */ 
body::after{content:'';position:fixed;bottom:-20%;right:-10%;width:50%;height:50%;background:radial-gradient(circle,rgba(161,0,255,.12) 0%,transparent 70%);pointer-events:none;z-index:0;animation:orbFloat 12s ease-in-out infinite reverse;}
@keyframes orbFloat{0%,100%{transform:translate(0,0);}33%{transform:translate(3%,2%);}66%{transform:translate(-2%,3%);}}


/* â”€â”€â”€ NAV â”€â”€â”€ */
.lnav{position:fixed;top:0;left:0;right:0;z-index:200;height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:linear-gradient(90deg,rgba(8,0,20,.92),rgba(18,0,40,.92));backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid rgba(161,0,255,.18);box-shadow:0 2px 24px rgba(0,0,0,.35);}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;}
.logo-mark{display:flex;align-items:center;justify-content:center;flex-shrink:0;} /* filter:drop-shadow(0 0 8px rgba(161,0,255,.5)); */
.logo-name{display:flex;flex-direction:column;gap:1px;}
.logo-name .ln-main{font-size:26px;font-weight:600;line-height:1;letter-spacing:-.8px;color:#fff;}
.logo-name .ln-main em{color:var(--pl);font-style:normal;}
.logo-name .ln-sub{font-size:10px;font-weight:500;color:rgba(255,255,255,.38);letter-spacing:.5px;}
.nav-center{display:none;}
.nav-greet{font-size:14px;color:rgba(255,255,255,.5);white-space:nowrap;}
.nav-greet strong{color:rgba(255,255,255,.9);font-weight:600;}
.nav-r{display:flex;align-items:center;gap:18px;}
.nav-ai-btn{display:flex;align-items:center;gap:7px;border:1px solid rgba(161,0,255,.35);border-radius:100px;padding:9px 22px;font-size:13px;font-weight:600;color:var(--pl);cursor:pointer;transition:all .25s;}
.nav-ai-btn:hover{background:var(--p);border-color:var(--p);color:#fff;}
.nav-ai-btn .d{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:blink 2s infinite;flex-shrink:0;}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:.3;}}
@keyframes spin{to{transform:rotate(360deg);}}
/* ── Chatbot disabled state (flip CHAT_DISABLED in shared.js to re-enable) ── */
.nav-ai-btn--disabled{opacity:.5 !important;cursor:not-allowed !important;}
.nav-ai-btn--disabled:hover{background:transparent !important;border-color:rgba(161,0,255,.35) !important;color:var(--pl) !important;}
.nav-ai-btn--disabled .d{background:#888 !important;animation:none !important;}
.ai-fab--disabled #fab-btn{opacity:.5;cursor:not-allowed !important;background:rgba(100,100,100,.5) !important;}
.ai-fab--disabled #fab-btn:hover{background:rgba(120,120,120,.6) !important;}
/* ── Chat unavailability popover ────────────────────────────── */
.chat-unavail-pop{position:fixed;z-index:10000;background:rgba(20,0,40,.97);border:1px solid rgba(161,0,255,.3);border-radius:12px;padding:12px 16px;font-size:13px;line-height:1.55;color:rgba(255,255,255,.85);max-width:220px;box-shadow:0 8px 24px rgba(0,0,0,.5);pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .18s,transform .18s;}
.chat-unavail-pop.visible{opacity:1;transform:translateY(0);}
body.light-mode .chat-unavail-pop{background:rgba(255,255,255,.97);color:#1a1a2e;border-color:rgba(161,0,255,.25);box-shadow:0 8px 24px rgba(0,0,0,.15);}
.nav-av{width:40px;height:40px;border-radius:50%;background: #A100FF;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:#fff;cursor:pointer;transition:all .2s;} /*background:linear-gradient(135deg,var(--p),var(--pd) */
.nav-av:hover{border-color:rgba(191,90,255,.6);}

/* â•â•â• LANDING â•â•â• */
#page-landing{min-height:100vh;background:var(--bk);}
.wrap{max-width:1300px;margin:0 auto;padding:0 48px;}
.hero{padding:116px 0 60px;display:grid;grid-template-columns:1fr 500px;gap:64px;align-items:center;position:relative;z-index:1;}
.htag{display:inline-flex;align-items:center;gap:8px;background:rgba(161,0,255,.1);border:1px solid rgba(161,0,255,.25);border-radius:100px;padding:6px 16px;margin-bottom:24px;}
.htag .d{width:6px;height:6px;border-radius:50%;background:var(--pl);animation:blink 2s infinite;flex-shrink:0;}
.htag span{font-size:11px;font-weight:500;color:var(--pl);letter-spacing:.5px;}
.hero-h1{font-size:clamp(44px,6vw,80px);font-weight:600;line-height:1.0;letter-spacing:-2.5px;margin-bottom:22px;animation:up .6s .05s both;}
.hero-h1 .line-acc{color:#a100ff;display:block; }
.hero-h1 .line-emp{color: #ffffff;display:block;} /* var(--pl) */ 
.hero-h1 .chev{font-style:normal;}
.hero-h1 .outline{color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.2);display:block;}
.hero-h1 .line-covered{display:block;color:#fff;} /* text-shadow:0 0 40px rgba(161,0,255,.7),0 0 80px rgba(161,0,255,.35); */
.hero-p{font-size:17px;line-height:1.7;color:rgba(255,255,255,.6);max-width:460px;margin-bottom:32px;animation:up .6s .18s both;font-weight:400;}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;animation:up .6s .3s both;}
@keyframes up{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.btn-p{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;font-size:15px;font-weight:600;padding:14px 30px;border:none;border-radius:100px;cursor:pointer;transition:all .2s;letter-spacing:-.2px;box-shadow:0 4px 20px rgba(245,158,11,.35);}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(245,158,11,.5);}
.btn-s{background:rgba(255,255,255,.06);color:rgba(255,255,255,.8);font-size:15px;font-weight:500;padding:14px 26px;border:1px solid rgba(255,255,255,.15);border-radius:100px;cursor:pointer;transition:all .2s;letter-spacing:-.2px;}
.btn-s:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3);color:#fff;}
.btn-migrate{display:none;}

.hero-card{background:rgba(255,255,255,.03);border:1px solid rgba(161,0,255,.15);border-radius:20px;padding:22px;animation:up .65s .48s both;position:relative;overflow:hidden;}
.hero-card::before{content:'';position:absolute;top:-50px;right:-50px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(161,0,255,.15),transparent 70%);}
.hc-lbl{font-size:9px;text-transform:uppercase;letter-spacing:2px;color:rgba(255,255,255,.22);margin-bottom:14px;font-weight:500;}
.hc-nums{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:16px;}
.hc-n{background:rgba(255,255,255,.04);border-radius:12px;padding:12px 14px;}
.hc-big{font-family:var(--font);font-size:26px;font-weight:600;color:var(--pl);line-height:1;}
.hc-big sup{font-size:12px;}
.hc-sm{font-size:9px;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.8px;margin-top:2px;}
.hc-div{height:1px;background:rgba(161,0,255,.09);margin-bottom:14px;}
.isp-r{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.04);}
.isp-r:last-child{border:none;}
.isp-l{display:flex;align-items:center;gap:7px;font-size:11px;color:rgba(255,255,255,.55);}
.isp-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.isp-spd{font-family:var(--font);font-size:12px;font-weight:600;color:var(--pl);}

/* â”€â”€â”€ MY REQUESTS â”€â”€â”€ */
.req-sec{padding:0 0 60px;position:relative;z-index:1;}
.sec-top{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px;}
.sec-ey{font-size:11px;font-weight:500;color:var(--pl);letter-spacing:.5px;margin-bottom:8px;}
.sec-h{font-size:clamp(26px,3.2vw,40px);font-weight:600;letter-spacing:-1.5px;line-height:1.1;}
.sec-h em{color:var(--pl);font-style:normal;}
.sec-actions{display:flex;gap:9px;}
.btn-new{display:flex;align-items:center;gap:7px;background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;font-size:13px;font-weight:600;padding:11px 22px;border:none;border-radius:100px;cursor:pointer;transition:all .2s;white-space:nowrap;} /* box-shadow:0 4px 16px rgba(161,0,255,.3); */
.btn-new:hover{transform:translateY(-1px);}
.btn-mig-sm{display:none;}

/* ACTIVE REQUEST CARD */
.arc{background:rgba(255,255,255,.04);border:1px solid rgba(161,0,255,.15);border-radius:20px;overflow:hidden;margin-bottom:20px;transition:all .25s;box-shadow:0 4px 32px rgba(161,0,255,.1);}
.arc:hover{border-color:rgba(161,0,255,.3);box-shadow:0 8px 48px rgba(161,0,255,.18);}
.arc-top{background:linear-gradient(135deg,rgba(161,0,255,.2) 0%,rgba(80,0,140,.3) 50%,rgba(8,0,20,.9) 100%);padding:22px 26px;border-bottom:1px solid rgba(161,0,255,.15);display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.srow{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.spill{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;font-size:11px;font-weight:500;border-radius:100px;}
.spill.proc{background:rgba(255,140,0,.15);border:1px solid rgba(255,140,0,.35);color:#f59e0b;}
.spill.proc .sd{background:#f59e0b;border-radius:50%;animation:blink 1.5s infinite;}
.spill.waiting{background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.35);color:#60a5fa;}
.spill.waiting .sd{background:#60a5fa;border-radius:50%;}
.spill.ok{background:rgba(0,192,127,.15);border:1px solid rgba(0,192,127,.35);color:#34d399;}
.spill.ok .sd{background:#34d399;border-radius:50%;}
.spill.cx{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.25);color:#f87171;}
.spill.cx .sd{background:#f87171;border-radius:50%;}
.sd{width:6px;height:6px;flex-shrink:0;}
.arc-ts{font-size:12px;color:rgba(255,255,255,.4);}
.arc-ref{font-size:20px;font-weight:600;margin-bottom:4px;letter-spacing:-0.5px;color:rgba(255,255,255,.92);}
.arc-plan{font-size:13px;color:rgba(255,255,255,.58);}
.arc-plan-secondary{font-size:12px;color:rgba(255,255,255,.45);margin-top:2px;}
.arc-val-muted{color:rgba(255,255,255,.28);}
body.light-mode .arc-val-muted{color:rgba(0,0,0,.3);}
.rv-plan-prov{color:#fff;}
.rv-plan-name{color:rgba(255,255,255,.78);}
.rv-plan-price-topup{color:rgba(255,255,255,.55);}
body.light-mode .rev-plan{background:linear-gradient(135deg,#f3e8ff 0%,#ede0ff 50%,#f8f2ff 100%);color:#1a0035;box-shadow:0 4px 24px rgba(161,0,255,.12);}
body.light-mode .rp-l small{color:#7c5aa8;}
body.light-mode .rv-plan-prov{color:#1a0035;}
body.light-mode .rv-plan-name{color:#5a3c82;}
body.light-mode .rv-plan-price-topup{color:#7c5aa8;}
body.light-mode .rv-plan-row{border-bottom-color:rgba(161,0,255,.12);}
.arc-meta{display:flex;flex-wrap:wrap;gap:20px;margin-top:14px;}
.arc-m{font-size:11px;color:rgba(255,255,255,.48);font-weight:500;}
.arc-m strong{display:block;font-size:13px;color:rgba(255,255,255,.88);font-weight:600;margin-top:2px;}
.eta-box{flex-shrink:0;text-align:right;}
.eta-lbl{font-size:10px;letter-spacing:.5px;color:rgba(255,255,255,.45);margin-bottom:4px;font-weight:500;}
.eta-date{font-size:26px;font-weight:600;color:#f59e0b;line-height:1;letter-spacing:-1px;}
.eta-sub{font-size:11px;color:rgba(255,255,255,.45);margin-top:3px;}
.eta-pill{display:inline-block;background:rgba(255,140,0,.12);border:1px solid rgba(255,140,0,.3);border-radius:100px;padding:3px 10px;font-size:11px;font-weight:500;color:#f59e0b;margin-top:6px;}
/* PROGRESS TRACKER â€” 6 STEPS */
.arc-track{padding:22px 26px 18px;background:rgba(255,255,255,.02);}
.track-lbl{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:rgba(255,255,255,.45);font-weight:500;margin-bottom:18px;}
.track{display:flex;align-items:flex-start;}
.ts{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;padding:0 6px;}
.ts:not(:last-child)::before{content:'';position:absolute;top:19px;left:50%;right:-50%;height:2px;background:var(--color-border-secondary,rgba(255,255,255,.12));z-index:0;}
.ts.done:not(:last-child)::before{background:linear-gradient(90deg,#00C07F,rgba(0,192,127,.3));}
.ts.active:not(:last-child)::before,.ts.waiting:not(:last-child)::before{background:linear-gradient(90deg,rgba(0,192,127,.4),var(--color-border-secondary,rgba(255,255,255,.12)));}
.ts-ic{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;position:relative;z-index:1;border:2px solid transparent;transition:all .3s;}
.ts.done .ts-ic{background:rgba(0,192,127,.18);border-color:#00C07F;color:#34d399;}
.ts.active .ts-ic{background:rgba(245,158,11,.32);border-color:#f59e0b;border-width:3px;color:#fbbf24;transform:scale(1.28);animation:gpulse-active 2s infinite;}
.ts.waiting .ts-ic{background:rgba(245,158,11,.18);border-color:#f59e0b;animation:gpulse-active 2s infinite;}
.ts.pending .ts-ic{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.15);}
/* .ts.pending .ts-ic{opacity:var(--ts-ic-opacity,1);} */
@keyframes gpulse-active{0%,100%{box-shadow:0 0 0 5px rgba(245,158,11,.22),0 0 22px rgba(245,158,11,.4);}50%{box-shadow:0 0 0 12px rgba(245,158,11,.08),0 0 40px rgba(245,158,11,.6);}}
.ts-chk{position:absolute;top:-2px;right:-2px;width:13px;height:13px;border-radius:50%;background:var(--ok);display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:500;color:#fff;border:2px solid #05000D;}
.ts-l{font-size:clamp(10px,.7vw,11px);font-weight:500;text-align:center;margin-top:8px;line-height:1.35;max-width:140px;text-wrap:balance;}
.ts.done .ts-l{color:var(--ok);}
.ts.active .ts-l{color:#f59e0b;font-weight:700;font-size:clamp(11px,.75vw,12px);}
.ts.waiting .ts-l{color:#f59e0b;}
.ts.pending .ts-l{color:#9ca3af;}
.ts-sub{font-size:clamp(10px,.62vw,10.5px);text-align:center;margin-top:2px;line-height:1.35;max-width:140px;text-wrap:balance;color:rgba(255,255,255,.22);}
.ts.pending .ts-sub{color:#b5acacbf;}
.ts.active .ts-sub{color:#f59e0b;}
.ts.done .ts-ic { background:linear-gradient(135deg,#00c07f,#00e09f); border-color:rgba(0,192,127,.5); box-shadow:0 0 0 6px rgba(0,192,127,.12); }
.ts.done .ts-l { color:#00c07f; }
.ts.done .ts-sub { color:rgba(0,192,127,.7); }
body.light-mode .ts.done .ts-l { color:#059669; }
body.light-mode .ts.done .ts-sub { color:rgba(5,150,105,.7); }
.ts.waiting .ts-sub{color:#f59e0b;}
/* CANCELLED (step 5 only) — request closed incomplete */
.ts.cancelled:not(:last-child)::before{background:linear-gradient(90deg,#ef4444,rgba(239,68,68,.3));}
.ts.cancelled .ts-ic{background:linear-gradient(135deg,#ef4444,#f87171);border-color:#ef4444;color:#fff;box-shadow:0 0 0 6px rgba(239,68,68,.16);animation:gpulse-cancelled 2s infinite;}
.ts.cancelled .ts-l{color:#ef4444;font-weight:700;}
.ts.cancelled .ts-sub{color:rgba(239,68,68,.7);}
@keyframes gpulse-cancelled{0%,100%{box-shadow:0 0 0 5px rgba(239,68,68,.22),0 0 22px rgba(239,68,68,.4);}50%{box-shadow:0 0 0 12px rgba(239,68,68,.08),0 0 40px rgba(239,68,68,.6);}}
body.light-mode .ts.cancelled .ts-l{color:#dc2626;}
body.light-mode .ts.cancelled .ts-sub{color:rgba(220,38,38,.7);}
/* SERVICENOW MINOR STEP */
.ts.ts-minor{flex:0 0 64px!important;width:64px!important;opacity:1;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:0;margin-top:0;align-self:flex-start;}
.ts.ts-minor .ts-ic{width:28px!important;height:28px!important;margin:0 auto 6px;}
.ts.ts-minor .ts-ic img{width:18px;height:18px;object-fit:contain;display:block;}
.ts.ts-minor .ts-l{font-size:10px!important;font-weight:600;text-align:center;}
.ts.ts-minor .ts-sub{font-size:9px!important;text-align:center;opacity:0.8;}
/* Step 1 group — Initial Survey + ServiceNow waypoint */
.track-group-1{flex:1;display:flex;align-items:flex-start;gap:0;position:relative;}
/* Outgoing connector from ts-minor to next major step (ts-minor is :last-child in group so base ::before doesn't apply) */
.track-group-1::before{content:'';position:absolute;top:19px;left:calc(100% - 32px);right:-80%;height:2px;background:var(--color-border-secondary,rgba(255,255,255,.12));z-index:0;}
.track-group-1:has(.ts-minor.done)::before{background:#4caf7d;}
.track-group-1:has(.ts-minor.active)::before,.track-group-1:has(.ts-minor.waiting)::before{background:var(--color-border-secondary,rgba(255,255,255,.12));}
/* Incoming connector (Initial Survey → SN): green when SN is active, waiting, or done */
.track-group-1:has(.ts-minor.active) .ts:not(:last-child)::before,
.track-group-1:has(.ts-minor.waiting) .ts:not(:last-child)::before,
.track-group-1:has(.ts-minor.done) .ts:not(:last-child)::before{background:#4caf7d;}
/* Outgoing connector via ::after (SN → Manager): green when done, gray otherwise */
.track-group-1::after{content:'';position:absolute;top:19px;left:calc(100% - 32px);right:-80%;height:2px;background:var(--color-border-secondary,rgba(255,255,255,.12));z-index:0;}
.track-group-1:has(.ts-minor.done)::after{background:#4caf7d;}
/* ServiceNow diamond step */
.ts.ts-minor .ts-ic--sn{width:24px!important;height:24px!important;border-radius:4px!important;transform:rotate(45deg)!important;border:2px solid #B4B2A9;background:var(--color-background-primary,#05000D);display:flex;align-items:center;justify-content:center;overflow:hidden;margin:7px auto 6px;flex-shrink:0;animation:none!important;}
.ts-ic--sn img{transform:rotate(-45deg);width:14px!important;height:14px!important;object-fit:contain;display:block;flex-shrink:0;}
.ts.ts-minor.active .ts-ic--sn,.ts.ts-minor.waiting .ts-ic--sn{border-color:#ff8c00;background:rgba(245,158,11,.18);animation:pulse-amber 1.8s ease-in-out infinite!important;}
.ts.ts-minor.done .ts-ic--sn{border-color:#4caf7d;background:rgba(0,192,127,.16);}
@keyframes pulse-amber{0%,100%{box-shadow:0 0 0 0 rgba(255,140,0,0.4);}50%{box-shadow:0 0 0 6px rgba(255,140,0,0);}}
/* RITM INPUT SECTION */
#arc-ritm-wrap{width:100%;margin:8px 0 0 0;padding:8px 10px;background:rgba(161,0,255,.08);border:1px solid rgba(161,0,255,.18);border-radius:8px;box-sizing:border-box;}
.arc-ritm-row{display:flex;flex-direction:column;gap:6px;}
.arc-ritm-hint{font-size:11px;color:var(--color-text-secondary,rgba(255,255,255,.6));display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin:0;line-height:1.4;}
.arc-ritm-hint a{color:var(--p,#A100FF);text-decoration:underline;font-weight:500;}
.arc-ritm-input-row{display:flex;gap:6px;align-items:center;}
.arc-ritm-input-row input{flex:1;padding:6px 8px;border:1px solid rgba(161,0,255,.25);border-radius:6px;font-size:11px;font-family:var(--font-mono,monospace);background:rgba(255,255,255,.06);color:var(--color-text-primary,#f3f4f6);min-width:0;}
.arc-ritm-input-row input:disabled{opacity:0.6;cursor:not-allowed;}
.arc-ritm-input-row button{padding:6px 10px;background:var(--p,#A100FF);color:#fff;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;flex-shrink:0;}
.arc-ritm-input-row button:disabled{opacity:0.5;cursor:not-allowed;}
.arc-ritm-error{color:var(--color-text-danger,#f87171);font-size:11px;margin:0;}
#arc-ritm-validated{font-size:11px;color:var(--color-text-success,#34d399);margin:0;}

/* ACTIVITY FEED */
.arc-feed{margin:0 26px 22px;border:1px solid rgba(161,0,255,.12);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.03);}
.feed-hdr{padding:10px 16px;font-size:10px;font-weight:500;color:rgba(255,255,255,.5);border-bottom:1px solid rgba(161,0,255,.12);letter-spacing:1px;text-transform:uppercase;background:rgba(161,0,255,.1);}
#arc-feed-body{max-height:288px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(161,0,255,.35) transparent;}
#arc-feed-body::-webkit-scrollbar{width:4px;}
#arc-feed-body::-webkit-scrollbar-track{background:transparent;}
#arc-feed-body::-webkit-scrollbar-thumb{background:rgba(161,0,255,.35);border-radius:4px;}
.fi{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(161,0,255,.08);position:relative;}
.fi:last-child{border:none;}
.fi.latest::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--p),var(--pl));border-radius:0 2px 2px 0;}
.fi-ic{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;margin-top:1px;}
.fi.latest .fi-ic{background:rgba(161,0,255,.12);}
.fi:not(.latest) .fi-ic{background:rgba(161,0,255,.06);}
.fi-body{flex:1;}
.fi-t{font-size:13px;font-weight:600;color:rgba(255,255,255,.88);margin-bottom:3px;}
.fi-d{font-size:12px;color:rgba(255,255,255,.5);line-height:1.55;}
.fi-time{font-size:11px;color:#9ca3af;flex-shrink:0;padding-top:2px;}
.fi-action{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;border:none;padding:8px 18px;border-radius:100px;font-size:12px;font-weight:600;cursor:pointer;margin-top:9px;transition:all .2s;} /* box-shadow:0 4px 14px rgba(161,0,255,.3); */
.fi-action:hover{transform:translateY(-1px);}

/* PAST CARDS */
.past-list{display:flex;flex-direction:column;gap:8px;}
.past-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px 20px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .22s;}
.past-card:hover{background:rgba(161,0,255,.08);border-color:rgba(161,0,255,.3);transform:translateY(-2px);box-shadow:0 8px 24px rgba(161,0,255,.12);}
.past-ic{width:40px;height:40px;border-radius:12px;background:rgba(161,0,255,.1);border:1px solid rgba(161,0,255,.2);display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;font-weight:600;color:var(--pl);}
.past-m{flex:1;min-width:0;}
.past-ref{font-size:14px;font-weight:600;margin-bottom:2px;letter-spacing:-.3px;}
.past-info{font-size:12px;color:rgba(255,255,255,.4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.past-r{text-align:right;flex-shrink:0;}
.badge{display:inline-block;font-size:10px;font-weight:500;padding:4px 10px;border-radius:100px;}
.badge.ok{background:rgba(0,192,127,.12);color:var(--ok);border:1px solid rgba(0,192,127,.25);}
.badge.cx{background:rgba(255,59,48,.1);color:var(--danger);border:1px solid rgba(255,59,48,.2);}
.badge.mig{background:rgba(255,140,0,.12);color:var(--warn);border:1px solid rgba(255,140,0,.25);}
.past-date{font-size:11px;color:rgba(255,255,255,.25);margin-top:4px;}
.past-arr{font-size:16px;color:rgba(255,255,255,.15);margin-left:8px;transition:color .2s;}
.past-card:hover .past-arr{color:var(--pl);}

/* HOW IT WORKS */
.info-sec{padding:60px 0;position:relative;z-index:1;}
.journey-sec .wrap{padding-bottom:8px;}

/* â”€â”€ CAROUSEL TIMELINE â”€â”€ */
.journey-sec{position:relative;z-index:1;} /* padding:64px 0 52px; */
.journey-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:40px;}
.journey-header-left .sec-ey{font-size:9px;font-weight:500;color:var(--pl);letter-spacing:2.5px;text-transform:uppercase;margin-bottom:6px;}
.journey-header-left h2{font-family:var(--font);font-size:clamp(22px,2.8vw,36px);font-weight:600;letter-spacing:-1px;color:#fff;}
.journey-header-left h2 em{color:var(--pl);font-style:normal;}
.journey-nav{display:flex;align-items:center;gap:10px;}
.jnav-btn{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.6);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;}
.jnav-btn:hover{background:rgba(161,0,255,.2);border-color:rgba(161,0,255,.4);color:#fff;}
.jnav-dots{display:flex;gap:6px;align-items:center;}
.jdot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.2);transition:all .25s;cursor:pointer;}
.jdot.active{background:var(--p);width:20px;border-radius:3px;}

/* CAROUSEL TRACK */
.carousel-wrap{overflow:hidden;position:relative;}
.carousel-track{display:flex;transition:transform .4s cubic-bezier(.4,0,.2,1);}
.carousel-slide{flex-shrink:0;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:20px;overflow:hidden;border:1px solid rgba(161,0,255,.18);box-shadow:0 8px 48px rgba(161,0,255,.1);}

/* LEFT â€” step info panel */
.cs-left{background:linear-gradient(145deg,rgba(161,0,255,.15),rgba(8,0,20,.9));padding:44px 48px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;}
.cs-left::before{content:'';position:absolute;top:-80px;right:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(161,0,255,.22),transparent 70%);}
.cs-step-num{font-size:80px;font-weight:600;line-height:1;margin-bottom:4px;background:linear-gradient(135deg,var(--pl),rgba(161,0,255,.35));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.cs-of{font-size:11px;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:2px;margin-bottom:24px;}
.cs-actor-pill{display:inline-flex;align-items:center;gap:6px;border-radius:100px;padding:5px 13px;font-size:11px;font-weight:500;letter-spacing:.3px;margin-bottom:14px;width:fit-content;}
.cs-actor-pill.done{background:rgba(0,192,127,.12);border:1px solid rgba(0,192,127,.28);color:var(--ok);}
.cs-actor-pill.active{background:rgba(0,153,255,.12);border:1px solid rgba(0,153,255,.3);color:var(--info);}
.cs-actor-pill.pending{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.4);}
.cs-actor-pill .ap-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.cs-actor-pill.done .ap-dot{background:var(--ok);}
.cs-actor-pill.active .ap-dot{background:var(--info);animation:blink 1.5s infinite;}
.cs-actor-pill.pending .ap-dot{background:rgba(255,255,255,.3);}
.cs-title{font-size:30px;font-weight:600;color:#fff;line-height:1.1;margin-bottom:14px;letter-spacing:-1px;}
.cs-desc{font-size:15px;color:rgba(255,255,255,.65);line-height:1.7;margin-bottom:24px;}
.cs-sla{display:inline-flex;align-items:center;gap:7px;border-radius:100px;padding:6px 16px;font-size:12px;font-weight:600;}
.cs-sla.done{background:rgba(0,192,127,.12);border:1px solid rgba(0,192,127,.25);color:var(--ok);}
.cs-sla.active{background:rgba(0,153,255,.1);border:1px solid rgba(0,153,255,.25);color:var(--info);}
.cs-sla.pending{background:rgba(161,0,255,.09);border:1px solid rgba(161,0,255,.18);color:var(--pl);}
.cs-done-check{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ok);font-weight:600;margin-top:10px;}

/* RIGHT â€” visual panel */
.cs-right{background:rgba(255,255,255,.03);display:flex;flex-direction:column;justify-content:space-between;padding:36px 38px;position:relative;overflow:hidden;border-left:1px solid rgba(161,0,255,.12);}
.cs-icon-big{font-size:64px;position:absolute;top:28px;right:28px;opacity:.18;}
.cs-detail-label{font-size:9px;text-transform:uppercase;letter-spacing:2px;color:rgba(255,255,255,.25);font-weight:500;margin-bottom:14px;}
.cs-detail-items{display:flex;flex-direction:column;gap:11px;flex:1;justify-content:center;}
.cs-item{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.04);transition:all .2s;}
.cs-item:hover{border-color:rgba(161,0,255,.2);background:rgba(161,0,255,.07);}
.cs-item.highlight{border-color:rgba(161,0,255,.25);background:rgba(161,0,255,.09);}
.cs-item-ic{font-size:20px;flex-shrink:0;margin-top:1px;}
.cs-item-title{font-size:14px;font-weight:600;color:rgba(255,255,255,.9);margin-bottom:3px;}
.cs-item-sub{font-size:12px;color:rgba(255,255,255,.45);line-height:1.45;}
/* mini progress dots at bottom of right panel */
.cs-mini-progress{display:flex;align-items:center;gap:0;padding-top:16px;border-top:1px solid rgba(255,255,255,.05);}
.cmp-step{display:flex;align-items:center;flex:1;}
.cmp-dot{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:500;flex-shrink:0;transition:all .3s;}
.cmp-dot.done{background:var(--ok);color:#fff;}
.cmp-dot.active{background:var(--info);color:#fff;box-shadow:0 0 0 3px rgba(0,153,255,.18);}
.cmp-dot.pending{background:rgba(255,255,255,.07);color:rgba(255,255,255,.25);}
.cmp-line{flex:1;height:1px;background:rgba(255,255,255,.07);}
.cmp-line.done{background:var(--ok);opacity:.4;}
.cmp-step-lbl{font-size:8px;text-align:center;margin-top:5px;color:rgba(255,255,255,.25);}
.cmp-step.done .cmp-step-lbl{color:rgba(0,192,127,.7);}
.cmp-step.active .cmp-step-lbl{color:rgba(0,153,255,.8);}
.cmp-outer{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;}
.cmp-outer:not(:last-child) .cmp-line{position:absolute;top:11px;left:50%;width:100%;}

/* PLAN LIST */
.plan-list{display:flex;flex-direction:column;gap:9px;margin-top:22px;}
.plan-row{background:rgba(255,255,255,.03);border:1px solid rgba(161,0,255,.13);border-radius:var(--rl);padding:16px 20px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:all .22s;position:relative;}
.plan-row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--p);border-radius:var(--rl) 0 0 var(--rl);opacity:0;transition:opacity .2s;}
.plan-row:hover{border-color:rgba(161,0,255,.35);background:rgba(161,0,255,.06);}
.plan-row:hover::before{opacity:1;}
.pr-spd{font-family:var(--font);font-size:26px;font-weight:600;color:var(--pl);line-height:1;flex-shrink:0;min-width:74px;}
.pr-spd small{font-size:12px;color:rgba(255,255,255,.3);font-weight:400;}
.pr-info{flex:1;}
.pr-name{font-size:13px;font-weight:600;margin-bottom:1px;}
.pr-prov{font-size:11px;color:rgba(255,255,255,.32);}
.pr-price{font-size:12px;color:rgba(255,255,255,.45);}
.pr-hot{position:absolute;top:8px;right:10px;background:var(--p);color:#fff;font-size:8px;font-weight:500;padding:2px 8px;border-radius:100px;text-transform:uppercase;}

/* â”€â”€ PLANS CAROUSEL IN HERO â”€â”€ */
.plans-carousel-wrap{background:rgba(255,255,255,.04);border:1px solid rgba(161,0,255,.2);border-radius:20px;padding:28px 24px;overflow:hidden;backdrop-filter:blur(12px);animation:up .6s .48s both;box-shadow:0 8px 40px rgba(161,0,255,.12),inset 0 1px 0 rgba(255,255,255,.07);min-height:340px;display:flex;flex-direction:column;justify-content:space-between;}
.isp-tabs{display:flex;gap:6px;background:rgba(255,255,255,.05);border-radius:100px;padding:4px;margin-bottom:18px;}
.isp-tab{flex:1;background:transparent;border:none;border-radius:100px;color:rgba(255,255,255,.45);font-size:12px;font-weight:600;padding:8px 10px;cursor:pointer;transition:all .2s;}
.isp-tab.active{background:var(--p);color:#fff;} /* box-shadow:0 2px 12px rgba(161,0,255,.4); */
.isp-tab:not(.active):hover{color:rgba(255,255,255,.75);background:rgba(255,255,255,.06);}
.isp-tab-dot{display:none;}
.isp-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.pc-mini{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px 12px;text-align:center;cursor:pointer;transition:all .22s;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;} /*height:185px; */ 
.pc-mini:hover{background:rgba(161,0,255,.12);border-color:rgba(161,0,255,.4);transform:translateY(-3px);box-shadow:0 8px 24px rgba(161,0,255,.2);}
.pc-mini.featured{border-color:rgba(161,0,255,.4);background:rgba(161,0,255,.1);}
.pcm-tier{font-size:11px;font-weight:600;padding:3px 10px;border-radius:100px;margin-bottom:8px;letter-spacing:.3px;}
.pcm-tier.tier-basic{background:var(--p);color:#fff;}
.pcm-tier.tier-speed,.pcm-tier.tier-max{background:rgba(161,0,255,.15);color:var(--pl);}
.pcm-plan{font-size:11px;font-weight:500;color:rgba(255,255,255,.45);margin-bottom:4px;}
.pcm-cost{font-size:15px;font-weight:700;margin-bottom:3px;}
.pcm-cost.topup { color:var(--pl, #BF5AFF); font-size:15px; font-weight:700; }
.pcm-cost.free { color:#34d399; font-size:15px; font-weight:700; }
.pcm-speed{font-size:36px;font-weight:800;color:#fff;line-height:1;margin-bottom:2px;letter-spacing:-1px;}
.pcm-speed span{font-size:12px;color:rgba(255,255,255,.4);font-weight:400;}
.pcm-price{font-size:12px;font-weight:600;color:var(--pl);margin-bottom:4px;}
.pcm-price span{font-size:10px;font-weight:400;color:rgba(255,255,255,.35);}
.pcm-tag{font-size:11px;color:rgba(255,255,255,.35);font-weight:500;}
.plans-footnote{font-size:clamp(12px,.72vw,13px);font-weight:600;line-height:1.4;color:rgba(255,255,255,.62);}
.plans-note{margin-top:10px;background:rgba(161,0,255,.07);border:1px solid rgba(161,0,255,.2);border-radius:10px;padding:10px 14px;font-size:11.5px;color:rgba(255,255,255,.6);display:flex;align-items:flex-start;gap:8px;text-align:left;line-height:1.5;}
.plans-note-ic{color:var(--pl);font-size:13px;flex-shrink:0;margin-top:1px;}

.page:not(#page-landing) .site-footer{display:none !important;}
footer a{color:rgba(161,0,255,.5);text-decoration:none;}
footer a:hover{color:var(--pl);}

/* MODAL TIMELINE */
.tl-step{display:flex;gap:14px;padding:12px 0;position:relative;}
.tl-step:not(:last-child)::after{content:'';position:absolute;left:15px;top:42px;bottom:0;width:2px;background:rgba(255,255,255,.08);}
.tl-dot{width:32px;height:32px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;border:2px solid transparent;z-index:1;}
.tl-dot.done{background:rgba(0,192,127,.15);border-color:#00C07F;}
.tl-dot.skipped{background:rgba(255,140,0,.12);border-color:#f59e0b;}
.tl-body{flex:1;padding-top:4px;}
.tl-title{font-size:13px;font-weight:600;color:rgba(255,255,255,.9);margin-bottom:2px;}
.tl-title.skipped-t{color:rgba(255,165,0,.8);}
.tl-desc{font-size:12px;color:rgba(255,255,255,.45);line-height:1.5;}
.tl-date{font-size:11px;color:rgba(255,255,255,.25);margin-top:3px;}
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:800;backdrop-filter:blur(16px);align-items:center;justify-content:center;}
.modal-bg.open{display:flex;}
.modal{background:rgba(15,0,32,.95);border:1px solid rgba(161,0,255,.25);border-radius:20px;width:460px;max-width:92vw;overflow:hidden;animation:mpop .25s var(--ease);box-shadow:0 20px 80px rgba(0,0,0,.6),0 0 0 1px rgba(161,0,255,.15);}
@keyframes mpop{from{opacity:0;transform:scale(.94) translateY(10px);}to{opacity:1;transform:scale(1) translateY(0);}}
.mh{background:linear-gradient(135deg,rgba(161,0,255,.15),transparent);padding:20px 24px;border-bottom:1px solid rgba(161,0,255,.12);display:flex;align-items:flex-start;justify-content:space-between;gap:10px;}
.mcls{background:rgba(255,255,255,.08);border:none;color:rgba(255,255,255,.5);width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .18s;}
.mcls:hover{background:rgba(255,255,255,.15);color:#fff;}
.mb{padding:20px 24px;}
.mdet-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
.mdet{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:13px 15px;}
.mdet-l{font-size:10px;font-weight:500;letter-spacing:.5px;color:rgba(255,255,255,.35);margin-bottom:4px;}
.mdet-v{font-size:14px;font-weight:600;}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• FORM PAGE â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */
#page-form{background:var(--bk2);min-height:100vh;}
.fnav{position:sticky;top:0;z-index:200;background:#000;border-bottom:1px solid rgba(255,255,255,.1);padding:0 40px;height:60px;display:flex;align-items:center;justify-content:space-between;}
.fnav-logo{display:flex;align-items:center;gap:10px;background:none;border:none;padding:0;cursor:pointer;text-align:left;}
.fnav-logo .ft{width:36px;height:36px;flex-shrink:0;display:flex;align-items:center;}
.fnav-logo .fn-text{display:flex;flex-direction:column;gap:0;}
.fnav-logo .fn-main{font-family:var(--font);font-size:17px;font-weight:600;color:#fff;line-height:1;letter-spacing:-.3px;}
.fnav-logo .fn-main em{color:var(--p);font-style:normal;}
.fnav-logo .fn-sub{font-family:var(--body);font-size:9px;font-weight:500;color:rgba(255,255,255,.35);letter-spacing:2px;text-transform:uppercase;margin-top:1px;}
.back-btn{display:flex;align-items:center;gap:6px;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:50px;padding:7px 16px;color:rgba(255,255,255,.7);font-family:var(--body);font-size:11px;font-weight:500;cursor:pointer;transition:all .18s;text-transform:uppercase;letter-spacing:1px;}
.back-btn:hover{border-color:#fff;color:#fff;}
.form-nav-bar{display:flex;align-items:center;gap:12px;}

/* PROGRESS â€” 3 STEPS */
.form-prog{background:#000;border-bottom:1px solid rgba(255,255,255,.06);padding:0 40px;position:sticky;top:60px;z-index:190;}
.fp-steps{display:flex;max-width:960px;margin:0 auto;}
.fstep{flex:1;display:flex;align-items:center;gap:8px;padding:13px 0;border-bottom:2px solid transparent;transition:border-color .22s;cursor:pointer;position:relative;}
.fstep:not(:last-child)::after{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:18px;background:rgba(255,255,255,.08);}
.fstep.active{border-bottom-color:var(--p);}
.fstep.done{border-bottom-color:var(--ok);}
.fs-num{width:22px;height:22px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-family:var(--font);font-size:11px;font-weight:500;color:rgba(255,255,255,.6);flex-shrink:0;transition:all .22s;}
.fstep.active .fs-num{background:var(--p);color:#fff;}
.fstep.done .fs-num{background:var(--ok);color:#fff;}
.fs-lbl{font-size:12px;font-weight:600;color:rgba(255,255,255,.55);}
.fs-lbl small{display:block;font-size:10px;font-weight:400;color:rgba(255,255,255,.35);margin-top:1px;}
.fstep.active .fs-lbl{color:rgba(255,255,255,.88);}
.fstep.done .fs-lbl{color:var(--ok);}

/* FORM BODY */
.form-body{max-width:960px;margin:0 auto;padding:32px 40px 100px;}
.fp{display:none;animation:fslide .28s var(--ease);}
.fp.active{display:block;}
@keyframes fslide{from{opacity:0;transform:translateX(14px);}to{opacity:1;transform:translateX(0);}}

.fhdr{margin-bottom:22px; margin-top: 15px;}
.fhdr-badge{display:inline-flex;align-items:center;gap:5px;background:rgba(161,0,255,.09);border:1px solid rgba(161,0,255,.18);border-radius:100px;padding:3px 11px;margin-bottom:9px;font-size:10px;font-weight:500;color:var(--pl);}
.fhdr h2{font-family:var(--font);font-size:24px;font-weight:600;color:rgba(255,255,255,.92);margin-bottom:4px;letter-spacing:-.6px;}
.fhdr h2 span{color:var(--p);}
.fhdr p{font-size:13px;color:rgba(255,255,255,.55);}

/* SIMPLE RADIO â€” clean two-option selector */
.simple-radio{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1.5px solid rgba(161,0,255,.2);border-radius:14px;cursor:pointer;transition:all .2s;background:rgba(161,0,255,.08);}
.simple-radio:hover{border-color:rgba(161,0,255,.4);background:rgba(161,0,255,.08);}
.simple-radio.sel{border-color:var(--p);background:rgba(161,0,255,.1);box-shadow:0 0 0 3px rgba(161,0,255,.12);}
.sr-dot{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.3);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.simple-radio.sel .sr-dot{border-color:var(--p);background:var(--p);}
.simple-radio.sel .sr-dot::after{content:'';width:6px;height:6px;border-radius:50%;background:#fff;}
.sr-title{font-size:15px;font-weight:600;color:rgba(255,255,255,.9);margin-bottom:3px;}
.sr-desc{font-size:13px;color:rgba(255,255,255,.5);line-height:1.4;}

/* MIGRATION EXTRA FIELDS */
.migration-fields{display:none;}
.migration-fields.show{display:block;}
.migrate-banner{display:flex;gap:12px;align-items:flex-start;background:rgba(255,140,0,.07);border:1px solid rgba(255,140,0,.2);border-radius:14px;padding:14px 18px;margin-bottom:18px;}
.mb-ic{font-size:16px;flex-shrink:0;}
.mb-text{font-size:13px;color:rgba(255,200,100,.85);line-height:1.5;}
.mb-text strong{font-weight:600;}
.migration-eligibility-note{display:flex;gap:9px;align-items:flex-start;background:rgba(255,140,0,.1);border:1px solid rgba(255,140,0,.28);border-left:3px solid var(--warn);border-radius:var(--r);padding:10px 14px;margin-top:14px;font-size:12px;color:rgba(255,214,153,.92);line-height:1.5;}
.migration-eligibility-note .warn-ic{font-size:14px;flex-shrink:0;line-height:1.2;margin-top:1px;}
.migration-eligibility-note ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;}
.migration-eligibility-note li{color:inherit;}
.migration-eligibility-note strong{color:#ffe7bf;}

/* PRE-FILLED */
.pre-field{display:flex;align-items:center;background:rgba(161,0,255,.04);border:1.5px solid rgba(161,0,255,.1);border-radius:10px;padding:10px 14px;gap:8px;min-height:42px;}
.pre-field .pf-val{font-size:15px;color:rgba(255,255,255,.85);flex:1;font-weight:500;}
.pre-field .pf-lock{font-size:12px;color:rgba(161,0,255,.4);}

/* AUTOFILL BANNER */
.af-banner{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,rgba(161,0,255,.08),rgba(161,0,255,.04));border:1px solid rgba(161,0,255,.2);border-radius:14px;padding:14px 18px;margin-bottom:18px;}
.af-banner p{font-size:13px;color:var(--pd);line-height:1.5;flex:1;}
.af-banner strong{font-weight:600;}
.af-banner button{background:var(--p);color:#fff;border:none;border-radius:100px;padding:7px 16px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:all .2s;box-shadow:0 2px 10px rgba(161,0,255,.25);}
.af-banner button:hover{background:var(--pd);}

/* TIP */
.tip{display:flex;gap:10px;align-items:flex-start;background:rgba(161,0,255,.06);border:1px solid rgba(161,0,255,.15);border-radius:12px;padding:12px 16px;font-size:13px;color:rgba(255,255,255,.82);margin-bottom:18px;line-height:1.5;}
body.light-mode .tip{color:var(--pd);}

.fcard{background:rgba(255,255,255,.05);border:1px solid rgba(161,0,255,.15);border-radius:20px;padding:24px 28px;margin-bottom:18px;box-shadow:0 2px 20px rgba(161,0,255,.06);transition:all .25s;}
.fcard:hover{border-color:rgba(161,0,255,.25);box-shadow:0 4px 32px rgba(161,0,255,.1);}
.fcard-title{font-size:11px;font-weight:500;color:var(--p);margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid rgba(161,0,255,.1);display:flex;align-items:center;gap:10px;letter-spacing:.3px;}
.fcard-ic{width:26px;height:26px;background:rgba(161,0,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--p);}
.fg2{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;}
.fg{display:flex;flex-direction:column;gap:6px;}
.fg.full{grid-column:1/-1;}
label.fl{font-size:11px;font-weight:500;color:rgba(255,255,255,.6);letter-spacing:.3px;}
label.fl .req{color:var(--p);}
input.fi,select.fi,textarea.fi{font-family:var(--font);font-size:15px;color:rgba(255,255,255,.88);background:rgba(161,0,255,.10);border:1.5px solid rgba(161,0,255,.2);border-radius:10px;padding:11px 14px;outline:none;width:100%;transition:all .2s;}
input.fi:last-child,select.fi:last-child,textarea.fi:last-child{border:1.5px solid rgba(161,0,255,.2);}
input.fi:focus,select.fi:focus,textarea.fi:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(161,0,255,.08);}
select.fi{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath fill='%23BF5AFF' d='M6 7L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:32px;cursor:pointer;}
select.fi option{background:#1a0035;color:#fff;}
select.form-select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23a855f7' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;cursor:pointer;}
select.form-select option{background:var(--bg,#1a1a2e);color:var(--text,#fff);}
input.fi::placeholder,textarea.fi::placeholder{color:rgba(255,255,255,.3);}
input.fi:-webkit-autofill,input.fi:-webkit-autofill:hover,input.fi:-webkit-autofill:focus,input.fi:-webkit-autofill:active{-webkit-box-shadow:0 0 0 1000px #150025 inset !important;-webkit-text-fill-color:rgba(255,255,255,.88) !important;caret-color:rgba(255,255,255,.88);}
body.light-mode input.fi:-webkit-autofill,body.light-mode input.fi:-webkit-autofill:hover,body.light-mode input.fi:-webkit-autofill:focus,body.light-mode input.fi:-webkit-autofill:active{-webkit-box-shadow:0 0 0 1000px #fff inset !important;-webkit-text-fill-color:#1a0035 !important;caret-color:#1a0035;}
textarea.fi{resize:vertical;min-height:72px;}
.ferr{font-size:12px;color:#dc2626;display:none;margin-top:3px;}
.fg.err input,.fg.err select,.fg.err textarea{border-color:#dc2626;box-shadow:0 0 0 3px rgba(220,38,38,.18);}
.fg.err .ferr{display:block;}
@keyframes fg-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.fg-shake{animation:fg-shake .5s ease;}
.fhint{font-size:11px;color:rgba(255,255,255,.4);}

/* ─── GOOGLE MAPS COORDINATES FIELD ─── */
.coords-wrap{display:flex;gap:8px;align-items:stretch;}
.coords-wrap input.fi{flex:1;min-width:0;}
.coords-gen-btn{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;border:none;border-radius:10px;padding:0 16px;font-family:var(--font);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;}
.coords-gen-btn:hover:not(:disabled){opacity:.85;transform:translateY(-1px);}
.coords-gen-btn:disabled{opacity:.5;cursor:not-allowed;}
.coords-ok-link{font-size:12px;color:#4caf7d;text-decoration:none;margin-top:2px;font-weight:500;}
.coords-ok-link:hover{text-decoration:underline;}
body.light-mode .coords-gen-btn{color:#fff;}
body.light-mode .coords-ok-link{color:#10a369;}

/* ─── COORDINATES MAP PREVIEW ─── */
.coords-map-preview{margin-top:10px;border-radius:12px;overflow:hidden;border:1px solid rgba(161,0,255,.2);box-shadow:0 4px 20px rgba(0,0,0,.35);}
.coords-map-preview iframe{display:block;}
body.light-mode .coords-map-preview{border-color:rgba(161,0,255,.25);box-shadow:0 4px 16px rgba(0,0,0,.12);}

/* ─── COORDINATES DISCLAIMER ─── */
.coords-disclaimer{display:flex;align-items:flex-start;gap:7px;font-size:12px;color:rgba(253,186,116,.9);line-height:1.5;padding:9px 12px;background:rgba(245,158,11,.07);border:1px solid rgba(245,158,11,.22);border-radius:9px;margin-top:5px;}
.coords-disclaimer-ic{font-size:14px;flex-shrink:0;margin-top:1px;}
.coords-disclaimer strong{color:rgba(253,186,116,1);font-weight:700;}
body.light-mode .coords-disclaimer{color:rgba(146,64,14,1);background:rgba(245,158,11,.09);border-color:rgba(245,158,11,.3);}
body.light-mode .coords-disclaimer strong{color:rgba(92,38,5,1);}

/* ─── COORDINATES HOW-TO TOOLTIP ─── */
.coords-how-wrap{position:relative;display:inline-flex;align-items:center;margin-left:6px;vertical-align:middle;}
.coords-how-ic{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;background:rgba(161,0,255,.18);border:1px solid rgba(161,0,255,.4);border-radius:50%;font-size:10px;font-weight:800;color:var(--p);cursor:help;line-height:1;transition:background .15s,border-color .15s;user-select:none;}
.coords-how-ic:hover,.coords-how-ic:focus{background:rgba(161,0,255,.32);border-color:rgba(161,0,255,.7);outline:none;}
.coords-how-tip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);background:rgba(10,0,24,.97);border:1px solid rgba(161,0,255,.3);border-radius:14px;padding:14px 16px;width:288px;z-index:600;pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;box-shadow:0 8px 36px rgba(0,0,0,.6);transform:translateX(-50%) translateY(4px);}
.coords-how-wrap:hover .coords-how-tip,.coords-how-ic:focus+.coords-how-tip{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);}
.coords-how-tip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:rgba(161,0,255,.3);}
.coords-how-tip::before{content:'';position:absolute;top:calc(100% + 1px);left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:rgba(10,0,24,.97);}
.coords-how-tip-title{display:block;font-size:11px;font-weight:700;color:var(--p);text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px;}
.coords-how-steps{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;}
.coords-how-steps li{font-size:12px;color:rgba(255,255,255,.75);line-height:1.5;}
.coords-how-steps strong{color:#fff;}
body.light-mode .coords-how-ic{background:rgba(161,0,255,.1);border-color:rgba(161,0,255,.3);}
body.light-mode .coords-how-ic:hover{background:rgba(161,0,255,.22);}
body.light-mode .coords-how-tip{background:#fff;border-color:rgba(161,0,255,.25);box-shadow:0 8px 36px rgba(0,0,0,.15);}
body.light-mode .coords-how-tip::before{border-top-color:#fff;}
body.light-mode .coords-how-steps li{color:rgba(0,0,0,.7);}
body.light-mode .coords-how-steps strong{color:#000;}

/* Address fields use standard .fg2 layout */

/* NAV TEXT BUTTONS */
.nav-txt-btn{background:transparent;border:none;color:rgba(255,255,255,.5);font-size:13px;font-weight:600;cursor:pointer;padding:6px 12px;border-radius:8px;transition:all .2s;font-family:var(--font);}
.nav-txt-btn:hover{color:#fff;background:rgba(255,255,255,.08);}
.nav-txt-btn.active{color:var(--pl);background:rgba(161,0,255,.12);border-radius:100px;}
body.light-mode .nav-txt-btn{color:rgba(13,0,32,.5);}
body.light-mode .nav-txt-btn:hover{color:var(--p);background:rgba(161,0,255,.08);}
body.light-mode .nav-txt-btn.active{color:var(--p);background:rgba(161,0,255,.1);border-radius:100px;}

/* FAQ PAGE */
.faq-cat{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:100px;padding:6px 16px;font-size:12px;font-weight:600;color:rgba(255,255,255,.5);cursor:pointer;transition:all .2s;font-family:var(--font);}
.faq-cat.active{background:var(--p);border-color:var(--p);color:#fff;}
.faq-cat:not(.active):hover{background:rgba(161,0,255,.12);color:rgba(255,255,255,.8);}
.faq-item{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;transition:all .2s;}
.faq-item:hover{border-color:rgba(161,0,255,.25);}
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;cursor:pointer;gap:16px;}
.faq-q-text{font-size:15px;font-weight:600;color:rgba(255,255,255,.9);line-height:1.4;}
.faq-toggle{width:24px;height:24px;border-radius:50%;background:rgba(161,0,255,.1);border:1px solid rgba(161,0,255,.2);color:var(--pl);font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s;}
.faq-item.open .faq-toggle{transform:rotate(45deg);}
.faq-a{display:none;padding:0 22px 18px;font-size:14px;color:rgba(255,255,255,.55);line-height:1.7;border-top:1px solid rgba(255,255,255,.06);}
.faq-item.open .faq-a{display:block;padding-top:16px;}
.faq-tag{display:inline-block;font-size:9px;font-weight:500;padding:2px 8px;border-radius:100px;text-transform:uppercase;letter-spacing:.5px;margin-right:8px;flex-shrink:0;}
.faq-tag.eligibility{background:rgba(59,130,246,.15);color:#93C5FD;}
.faq-tag.migration{background:rgba(255,140,0,.12);color:#FCD34D;}
.faq-tag.plans_cost{background:rgba(0,192,127,.12);color:#6EE7B7;}
.faq-tag.process{background:rgba(161,0,255,.12);color:var(--pl);}
.faq-tag.technical{background:rgba(239,68,68,.1);color:#FCA5A5;}
.faq-tag.telco_conditions{background:rgba(161,0,255,.14);color:var(--pl);}
.faq-tag.telco{background:rgba(161,0,255,.14);color:var(--pl);}
.faq-tag.hotlines{background:rgba(6,182,212,.12);color:#67E8F9;}
body.light-mode .faq-tag.eligibility{background:rgba(31,137,255,.12);color:#1f89ff;}
body.light-mode .faq-tag.migration{background:rgb(255 200 0/12%);color:#c99e10;}
body.light-mode .faq-tag.plans_cost{background:rgba(16,163,105,.12);color:#10a369;}
body.light-mode .faq-tag.process{background:rgba(161,12,255,.1);color:#a10cff;}
body.light-mode .faq-tag.technical{background:rgba(213,97,97,.1);color:#d56161;}
body.light-mode .faq-tag.telco_conditions{background:rgba(161,12,255,.1);color:#a10cff;}
body.light-mode .faq-tag.hotlines{background:rgba(10,94,105,.12);color:#0a5e69;}
body.light-mode .faq-item{background:#fff;border-color:rgba(161,0,255,.1);}
body.light-mode .faq-q-text{color:#0d0020;}
body.light-mode .faq-a{color:#3d2a5c;border-top-color:rgba(161,0,255,.08);}
body.light-mode .faq-cat{background:rgba(161,0,255,.06);border-color:rgba(161,0,255,.15);color:#5a3c82;}
body.light-mode .faq-cat.active{background:var(--p);color:#fff;border-color:var(--p);}
body.light-mode .faq-cat:not(.active):hover{background:rgba(161,0,255,.1);color:var(--p);}
body.light-mode .faq-toggle{background:rgba(161,0,255,.08);border-color:rgba(161,0,255,.2);color:var(--p);}
body.light-mode #page-faq .sec-h{color:#0d0020;}
body.light-mode #page-faq p{color:#3d2a5c;}
body.light-mode #page-faq .sec-ey{color:var(--p);}
body.light-mode #page-faq [style*="rgba(161,0,255,.08)"]{background:rgba(161,0,255,.06) !important;}
body.light-mode #page-faq [style*="Still have questions"] {color:#0d0020 !important;}
body.light-mode #page-faq [style*="font-size:22px"]{color:#1a0035;}

/* FEEDBACK PAGE */
.rating-btn{display:flex;flex-direction:column;align-items:center;gap:4px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:10px 14px;cursor:pointer;transition:all .2s;font-size:20px;flex:1;font-family:var(--font);}
.rating-btn span{font-size:10px;color:rgba(255,255,255,.4);font-weight:500;}
.rating-btn:hover{background:rgba(161,0,255,.1);border-color:rgba(161,0,255,.3);}
.rating-btn.sel{background:rgba(161,0,255,.15);border-color:var(--p);box-shadow:0 0 0 2px rgba(161,0,255,.2);}
.rating-btn.sel span{color:var(--pl);}

/* RFI COMPARISON TABLE */
.rfi-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:4px;}
.rfi-table thead tr{background:linear-gradient(135deg,var(--p),var(--pd));}
.rfi-table thead th{padding:11px 10px;color:#fff;font-weight:600;font-size:12px;text-align:left;letter-spacing:.3px;border:1px solid rgba(255,255,255,.15);}
.rfi-table thead th:first-child{text-align:left;border-radius:8px 0 0 0;}
.rfi-table thead th:last-child{border-radius:0 8px 0 0;}
.rfi-table tbody tr:nth-child(odd){background:transparent;}
.rfi-table tbody tr:nth-child(even){background:transparent;}
.rfi-table tbody tr:hover{background:rgba(161,0,255,.08);}
.rfi-table td{padding:11px 10px;text-align:left;border-left:none;border-right:none;border-top:none;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:middle;}
.rfi-label{text-align:left !important;font-weight:600;color:rgba(255,255,255,.85);font-size:13px;min-width:160px;}
.rfi-label small{display:block;font-size:10px;font-weight:400;color:rgba(255,255,255,.4);margin-top:2px;}
.rfi-check{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:rgba(0,192,127,.18);color:#34d399;font-size:16px;font-weight:600;}
.rfi-x{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:rgba(220,38,38,.15);color:#f87171;font-size:16px;font-weight:600;}
.rfi-warn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:rgba(255,140,0,.15);color:#fbbf24;font-size:14px;font-weight:600;}
.rfi-note{font-size:10px;color:rgba(255,255,255,.4);margin-top:4px;line-height:1.3;}
.rfi-yes{display:inline-flex;align-items:center;gap:4px;font-weight:600;}
.rfi-yes::before{content:'â—';font-size:8px;color:#34d399;}
.rfi-no{display:inline-flex;align-items:center;gap:4px;font-weight:600;}
.rfi-no::before{content:'â—';font-size:8px;color:#f87171;}
/* Light mode RFI table */
body.light-mode .rfi-table thead tr{background:rgba(161,0,255,.04) !important;}
body.light-mode .rfi-table thead th{color:rgba(0,0,0,.45) !important;border-color:transparent !important;border-bottom:1px solid rgba(161,0,255,.1) !important;}
body.light-mode .rfi-table tbody tr:nth-child(odd){background:#fff;}
body.light-mode .rfi-table tbody tr:nth-child(even){background:#fff;}
body.light-mode .rfi-table td{border-left:none;border-right:none;border-top:none;border-bottom:1px solid rgba(161,0,255,.07);}
body.light-mode .rfi-label{color:#1a0035;}
body.light-mode .rfi-label small{color:#7c5aa8;}
body.light-mode .rfi-note{color:#7c5aa8;}
.cond-sub-label{font-size:11px;color:rgba(255,255,255,.45);display:block;margin-top:2px;}
body.light-mode .cond-sub-label{color:#7c5aa8;}

/* FULFILLER NOTE */
.fulfiller-note{display:flex;gap:10px;align-items:flex-start;background:rgba(59,130,246,.06);border:1px solid rgba(59,130,246,.15);border-radius:12px;padding:12px 16px;font-size:13px;color:rgba(255,255,255,.55);line-height:1.5;margin-top:8px;}
.fulfiller-note strong{color:#93C5FD;}

/* â”€â”€â”€ LIGHT MODE OVERRIDES FOR REQUEST CARD â”€â”€â”€ */
body.light-mode .arc{background:#fff;}
body.light-mode .arc-top{background:linear-gradient(135deg,#f3e8ff 0%,#ede0ff 50%,#f8f2ff 100%);border-bottom-color:rgba(161,0,255,.12);}
body.light-mode .arc-ts{color:rgba(90,60,130,.5);}
body.light-mode .arc-ref{color:#1a0035;}
body.light-mode .arc-plan{color:#5a3c82;}
.arc-secondary-plan{color:rgba(255,255,255,.45);}
body.light-mode .arc-secondary-plan{color:#5a3c82;}
body.light-mode .arc-m{color:#7c5aa8;}
body.light-mode .arc-m strong{color:#1a0035;}
body.light-mode .arc-track{background:linear-gradient(180deg,#faf6ff,#fff);}
body.light-mode .track-lbl{color:#7c5aa8;}
body.light-mode .ts:not(:last-child)::before{background:#e8dff7;}
body.light-mode .ts.active:not(:last-child)::before,.ts.waiting:not(:last-child)::before{background:linear-gradient(90deg,rgba(0,192,127,.4),#e8dff7);}
body.light-mode .track-group-1::before{background:#e8dff7;}
body.light-mode .track-group-1:has(.ts-minor.done)::before{background:#4caf7d;}
body.light-mode .track-group-1:has(.ts-minor.active)::before,
body.light-mode .track-group-1:has(.ts-minor.waiting)::before{background:#e8dff7;}
body.light-mode .track-group-1:has(.ts-minor.active) .ts:not(:last-child)::before,
body.light-mode .track-group-1:has(.ts-minor.waiting) .ts:not(:last-child)::before,
body.light-mode .track-group-1:has(.ts-minor.done) .ts:not(:last-child)::before{background:#4caf7d;}
body.light-mode .track-group-1::after{background:#e8dff7;}
body.light-mode .track-group-1:has(.ts-minor.done)::after{background:#4caf7d;}
body.light-mode .ts.ts-minor .ts-ic--sn{background:#ffffff;}
body.light-mode .ts.ts-minor.active .ts-ic--sn,
body.light-mode .ts.ts-minor.waiting .ts-ic--sn{background:#fff8f0;}
body.light-mode .ts.ts-minor.done .ts-ic--sn{background:#f0faf5;}
body.light-mode .ts.done .ts-ic{background:#d1fae5;border-color:#00C07F;color:#059669;}
body.light-mode .ts.active .ts-ic{background:#fde68a;border-color:#f59e0b;color:#92400e;border-width:3px;transform:scale(1.28);}
body.light-mode .ts.waiting .ts-ic{background:#fef3c7;border-color:#f59e0b;}
body.light-mode .ts.pending .ts-ic{background:#f3f4f6;border-color:#d1d5db;}
body.light-mode .ts.active .ts-l{color:#d97706;}
body.light-mode .ts.active .ts-sub{color:rgba(180,83,9,.7);}
body.light-mode .ts.done .ts-l{color:#059669;}
body.light-mode .ts.done .ts-sub{color:rgba(5,150,105,.65);}
body.light-mode .ts.waiting .ts-l{color:#d97706;}
body.light-mode .ts.waiting .ts-sub{color:rgba(180,83,9,.7);}
body.light-mode .ts.pending .ts-l{color:#293345;}
body.light-mode .ts.pending .ts-sub{color:#353535;}
body.light-mode .ts-sub{color:rgba(80,40,120,.45);}
body.light-mode .arc-feed{background:#faf6ff;}
body.light-mode #arc-ritm-wrap{background:rgba(161,0,255,.06);border-color:rgba(161,0,255,.2);}
body.light-mode .arc-ritm-hint{color:#5a3c82;}
body.light-mode .arc-ritm-input-row input{background:#fff;border-color:rgba(161,0,255,.3);color:#1a0035;}
body.light-mode #arc-ritm-validated{color:#059669;}
body.light-mode .arc-ritm-error{color:#dc2626;}
body.light-mode .feed-hdr{background:#f3e8ff;color:#7c5aa8;}
body.light-mode .fi-t{color:#1a0035;}
body.light-mode .fi-d{color:#5a3c82;}

/* Light mode fixes for dashboard overlays */
body.light-mode #nav-user-menu{background:#fff !important;border-color:rgba(161,0,255,.22) !important;box-shadow:0 8px 24px rgba(42,22,78,.14) !important;}
body.light-mode #nav-menu-name{color:#1a0035 !important;}
body.light-mode #nav-menu-email{color:#6f5a93 !important;}
body.light-mode #nav-user-menu button{background:rgba(161,0,255,.08) !important;border-color:rgba(161,0,255,.24) !important;color:#5a3c82 !important;}
body.light-mode #nav-user-menu button:hover{background:rgba(161,0,255,.14) !important;color:#3d2170 !important;}

body.light-mode #edit-modal-bg .modal,
body.light-mode #cancel-modal-bg .modal{background:#fff;border-color:rgba(161,0,255,.22);box-shadow:0 20px 60px rgba(42,22,78,.18),0 0 0 1px rgba(161,0,255,.08);}
body.light-mode #ritm-warn-modal-bg .modal{background:#fff;border-color:rgba(161,0,255,.22);box-shadow:0 20px 60px rgba(42,22,78,.18),0 0 0 1px rgba(161,0,255,.08);}
body.light-mode #ritm-warn-modal-bg .mh{background:rgba(10,0,22,.98);}
body.light-mode #ritm-warn-modal-bg .mb p{color:#3d2a5c !important;}
body.light-mode #ritm-warn-modal-bg .mb strong{color:#1a0035 !important;}
body.light-mode #ritm-warn-modal-bg .fbtn-out{border-color:rgba(161,0,255,.3) !important;color:#3d2a5c !important;}
body.light-mode #edit-modal-bg .mh,
body.light-mode #cancel-modal-bg .mh{background:linear-gradient(135deg,#f3e8ff,rgba(255,255,255,.92)) !important;border-bottom-color:rgba(161,0,255,.15) !important;}
body.light-mode #edit-modal-bg .mcls,
body.light-mode #cancel-modal-bg .mcls,
body.light-mode #tc-modal-bg .mcls{background:rgba(161,0,255,.1);color:#5a3c82;}
body.light-mode #edit-modal-bg .mcls:hover,
body.light-mode #cancel-modal-bg .mcls:hover,
body.light-mode #tc-modal-bg .mcls:hover{background:rgba(161,0,255,.18);color:#2f125d;}
body.light-mode #edit-modal-bg [style*='color:#fff'],
body.light-mode #cancel-modal-bg [style*='color:#fff']{color:#1a0035 !important;}
body.light-mode #edit-modal-bg [style*='color:var(--pl)']{color:#1a0035 !important;}
body.light-mode #edit-modal-bg [style*='color:rgba(255,255,255,.6)'],
body.light-mode #cancel-modal-bg [style*='color:rgba(255,255,255,.6)']{color:#5a3c82 !important;}
body.light-mode #edit-modal-bg [style*='color:rgba(255,255,255,.4)'],
body.light-mode #cancel-modal-bg [style*='color:rgba(255,255,255,.4)']{color:#7c5aa8 !important;}
body.light-mode #edit-modal-bg .mdet-l{color:#6f5a93;}
body.light-mode #edit-modal-bg .mdet-v{color:#1a0035;}
body.light-mode #cancel-modal-bg .fbtn-out,
body.light-mode #edit-modal-bg .fbtn-out{background:#fff !important;border-color:rgba(161,0,255,.2) !important;color:#5a3c82 !important;}
/* edit modal read-only row */
body.light-mode .edit-ro-row{background:rgba(161,0,255,.04);border-color:rgba(161,0,255,.15);}
body.light-mode .edit-ro-label{color:#6f5a93;}
body.light-mode .edit-ro-value{color:#1a0035;}
/* edit modal telco slot cards */
body.light-mode .edit-slot-card{background:rgba(161,0,255,.03);border-color:rgba(161,0,255,.2);}
body.light-mode .edit-slot-card .esc-detail{color:#6f5a93;}
body.light-mode .edit-slot-empty{color:var(--p);border-color:rgba(161,0,255,.4);background:transparent;}
body.light-mode .edit-slot-change-btn{background:rgba(161,0,255,.08);color:#5a3c82;border-color:rgba(161,0,255,.3);}

/* â”€â”€â”€ LIGHT MODE OVERRIDES FOR FORM ELEMENTS â”€â”€â”€ */
body.light-mode #page-form{background:#e8edf6;}
body.light-mode .fhdr h2{color:#0d0020;}
body.light-mode .fhdr p{color:#3d2a5c;}
body.light-mode .simple-radio{background:#fff;border-color:#e0d5f0;}
body.light-mode .simple-radio:hover{background:rgba(161,0,255,.03);border-color:rgba(161,0,255,.35);}
body.light-mode .simple-radio.sel{background:rgba(161,0,255,.04);}
body.light-mode .sr-dot{border-color:#ccc;}
body.light-mode .sr-title{color:#1a0035;}
body.light-mode .sr-desc{color:var(--t3);}
body.light-mode .mb-text{color:#92400e;}
body.light-mode .migration-eligibility-note{background:#fff8ee;border:1px solid #ffd580;border-left:3px solid var(--warn);color:#7a4a00;}
body.light-mode .migration-eligibility-note strong{color:#5f3700;}
body.light-mode .pre-field .pf-val{color:#0d0020;}
body.light-mode .fcard{background:#fff;border-color:rgba(161,0,255,.1);}
body.light-mode label.fl{color:#555;}
body.light-mode input.fi,body.light-mode select.fi,body.light-mode textarea.fi{background:#fff;color:#1a0035;border-color:rgba(161,0,255,.55);}
body.light-mode input.fi:last-child,body.light-mode select.fi:last-child,body.light-mode textarea.fi:last-child{border:1.5px solid rgba(161,0,255,.55);}
body.light-mode select.fi{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath fill='%237c6a9a' d='M6 7L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;}
body.light-mode select.fi option{background:#fff;color:#1a0035;}
body.light-mode input.fi::placeholder,body.light-mode textarea.fi::placeholder{color:#aaa;}

/* ─── EDIT MODAL FIELD CLASSES ─── */
.edit-ro-row{background:rgba(255,255,255,.04);border:1px solid rgba(161,0,255,.12);border-radius:12px;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px;}
.edit-ro-label{font-size:12px;color:rgba(255,255,255,.45);}
.edit-ro-value{font-size:13px;font-weight:700;color:rgba(255,255,255,.9);}
.addr-sub+.addr-sub{margin-top:6px;}
.edit-slot-card{border:1px solid rgba(161,0,255,.22);border-radius:10px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;background:rgba(161,0,255,.05);}
.esc-isp{font-size:13px;font-weight:700;color:#4caf7d;}
.esc-detail{font-size:11px;color:rgba(255,255,255,.45);margin-top:2px;}
.edit-slot-empty{width:100%;border:1.5px dashed rgba(161,0,255,.35);border-radius:10px;padding:13px;background:transparent;color:var(--p);font-size:13px;font-family:var(--font);font-weight:600;cursor:pointer;transition:all .2s;text-align:center;}
.edit-slot-empty:hover{background:rgba(161,0,255,.07);}
.edit-slot-change-btn{font-size:11px;background:rgba(161,0,255,.12);border:1px solid rgba(161,0,255,.3);color:var(--pl);padding:7px 14px;border-radius:8px;cursor:pointer;white-space:nowrap;font-family:var(--font);font-weight:600;transition:all .2s;flex-shrink:0;}
.edit-slot-change-btn:hover{background:rgba(161,0,255,.22);}
body.light-mode .pc-opt{background:#fff;border-color:rgba(161,0,255,.1);}
body.light-mode .pc-spd small{color:var(--t3);}
body.light-mode .pc-prov{color:var(--t3);}
body.light-mode .pc-name{color:#000;}
body.light-mode .pc-feat{color:#444;}
body.light-mode .pc-price{color:#000;}
body.light-mode .pc-sub{color:#888;}
body.light-mode .pc-radio{border-color:#ccc;}
body.light-mode .pc-locked .pc-radio{background:#f0f0f0 !important;border-color:#ccc !important;}
body.light-mode .pc-unlock-hint{color:#bbb;}
body.light-mode .mgr-note{color:#1a5c3a;}
body.light-mode .rsec{background:#fff;border-color:rgba(161,0,255,.1);}
body.light-mode .rl{color:var(--t3);}
body.light-mode .rv{color:#1a0035;}
body.light-mode .ac-who{color:#1a5c3a;}
body.light-mode .ac-desc{color:#4a8a6a;}
body.light-mode .chk-g{background:#fff;border-color:rgba(161,0,255,.1);}
body.light-mode .chk-g:hover{background:rgba(161,0,255,.03);}
body.light-mode .chk-g label{color:#3d2a5c;}
body.light-mode .fbtn-ghost{color:var(--t3);}
body.light-mode .fbtn-out{background:#fff;color:#3d2a5c;border-color:rgba(161,0,255,.2);}
body.light-mode .fbtn-out:hover{color:var(--p);}
body.light-mode .spill.proc{background:rgba(255,140,0,.12);border-color:rgba(255,140,0,.3);color:#b45309;}
body.light-mode .spill.proc .sd{background:#b45309;}
body.light-mode .spill.waiting{background:rgba(59,130,246,.1);border-color:rgba(59,130,246,.3);color:#1d4ed8;}
body.light-mode .spill.waiting .sd{background:#1d4ed8;}
body.light-mode .eta-lbl{color:#7c5aa8;}
body.light-mode .eta-date{color:#b45309;}
body.light-mode .eta-sub{color:#7c5aa8;}
body.light-mode .eta-pill{color:#b45309;}
body.light-mode .fhint{color:var(--t3);}

/* Form dropdown/tooltip popovers — themed surface (flips with --bk3), not a hardcoded white */
.fdrop-menu{background:var(--bk3);border:1px solid rgba(161,0,255,.25);box-shadow:0 8px 24px rgba(0,0,0,.35);}
.fdrop-item{color:rgba(255,255,255,.85);}
.fdrop-item:hover{background:rgba(161,0,255,.15);}
body.light-mode .fdrop-menu{box-shadow:0 8px 24px rgba(0,0,0,.12);}
body.light-mode .fdrop-item{color:#1a0035;}
body.light-mode .fdrop-item:hover{background:rgba(161,0,255,.08);}
.ftip{background:var(--bk3);border:1px solid rgba(161,0,255,.25);color:rgba(255,255,255,.85);}
body.light-mode .ftip{color:#1a0035;box-shadow:0 4px 20px rgba(0,0,0,.12);}

body.light-mode{--bk:#ffffff;--bk2:#f8f5ff;--bk3:#f0eaff;--color-border-secondary:#e8dff7;}
body.light-mode #bg-canvas{opacity:.06;}
body.light-mode::before,body.light-mode::after{opacity:.06;}

/* Nav */
body.light-mode .lnav{background:linear-gradient(90deg,rgba(255,255,255,1),rgba(250,246,255,1)) !important;border-bottom:1px solid rgba(161,0,255,.15) !important;box-shadow:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
/* Form nav */
body.light-mode .fnav{background:linear-gradient(90deg,rgba(255,255,255,.97),rgba(250,246,255,.97));border-bottom:1px solid rgba(161,0,255,.15);box-shadow:0 2px 16px rgba(0,0,0,.08);}
body.light-mode .form-prog{background:rgba(255,255,255,.97);border-bottom:1px solid rgba(161,0,255,.12);}
body.light-mode .fs-num{background:rgba(161,0,255,.1);color:rgba(13,0,32,.45);}
body.light-mode .fstep.active .fs-num{background:var(--p);color:#fff;}
body.light-mode .fstep.done .fs-num{background:var(--ok);color:#fff;}
body.light-mode .fs-lbl{color:rgba(13,0,32,.45);}
body.light-mode .fs-lbl small{color:rgba(13,0,32,.3);}
body.light-mode .fstep.active .fs-lbl{color:#0d0020;}
body.light-mode .fstep.done .fs-lbl{color:var(--ok);}
body.light-mode .fstep:not(:last-child)::after{background:rgba(161,0,255,.12);}
body.light-mode .fnav-logo .fn-main{color:#0d0020;}
body.light-mode .fnav-logo .fn-sub{color:#7c5aa8;}
body.light-mode .back-btn{border-color:rgba(161,0,255,.35);color:var(--p);}
body.light-mode .back-btn:hover{background:rgba(161,0,255,.14);border-color:var(--p);color:var(--pd);}
body.light-mode .logo-name .ln-main{color:#0d0020;}
body.light-mode .logo-name .ln-main em{color:var(--p);}
body.light-mode .logo-name .ln-sub{color:#7c5aa8;}
body.light-mode .nav-greet{color:#5a3c82;}
body.light-mode .nav-greet strong{color:#0d0020;}
body.light-mode .nav-center .nav-greet{color:#5a3c82;}
body.light-mode .nav-av{background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;}

/* Hero text */
body.light-mode .htag{background:rgba(161,0,255,.08);border-color:rgba(161,0,255,.2);}
body.light-mode .htag span{color:var(--p);}
body.light-mode .hero-h1 .line-acc{color:var(--p);text-shadow:none;}
body.light-mode .hero-h1 .line-emp{color:#000}
body.light-mode .hero-h1 .outline{color:transparent;-webkit-text-stroke:1.5px rgba(13,0,32,.15);}
body.light-mode .hero-h1 .line-covered{color:#0d0020;text-shadow:none;}
body.light-mode .hero-p{color:#3d2a5c;}
body.light-mode .btn-s{color:#0d0020;border-color:rgba(0,0,0,.15);}
body.light-mode .btn-s:hover{background:rgba(0,0,0,.1);color:#000;border-color:rgba(0,0,0,.3);}

/* Plans carousel */
body.light-mode .plans-carousel-wrap{background:#fff;border-color:rgba(161,0,255,.15);box-shadow:none;}
body.light-mode .isp-tabs{background:rgba(161,0,255,.06);}
body.light-mode .isp-tab{color:#5a3c82;}
body.light-mode .isp-tab.active{color:#fff;}
body.light-mode .isp-tab:not(.active):hover{color:var(--p);background:rgba(161,0,255,.1);}
body.light-mode .pc-mini{background:#f8f5ff;border-color:rgba(161,0,255,.1);}
body.light-mode .plan-grayed .pcm-cost{color:rgba(0,0,0,.25) !important;}
body.light-mode .plan-recommended{background:rgba(161,0,255,.1) !important;border-color:rgba(161,0,255,.45) !important;}
body.light-mode .pcm-plan{color:#5a3c82;}
body.light-mode .pcm-speed{color:#0d0020;}
body.light-mode .pcm-speed span{color:#000000;}
body.light-mode .pcm-tag{color:#000;}
body.light-mode .pcm-tier.tier-speed,body.light-mode .pcm-tier.tier-max{background:rgba(161,0,255,.1);border-color:rgba(161,0,255,.25);color:var(--p);}
body.light-mode .plans-note{background:rgba(161,0,255,.06);border-color:rgba(161,0,255,.2);color:#5a3c82;}
body.light-mode .plans-note-ic{color:var(--p);}
body.light-mode .plans-footnote{color:#3d2a5c;}
body.light-mode .pcm-cost.free { color:#059669 !important; }
body.light-mode .pcm-cost.topup { color:var(--p, #A100FF) !important; }

/* Section headings */
body.light-mode .sec-ey{color:var(--p);}
body.light-mode .sec-h{color:#0d0020;}

/* Past request cards */
body.light-mode .past-card{background:#fff;border:1px solid rgba(161,0,255,.12);box-shadow:0 2px 8px rgba(0,0,0,.04);}
body.light-mode .past-card:hover{background:#f8f5ff;border-color:rgba(161,0,255,.3);}
body.light-mode .past-ref{color:#0d0020;}
body.light-mode .past-info{color:#5a3c82;}
body.light-mode .past-date{color:#7c5aa8;}
body.light-mode .past-arr{color:#bbb;}

/* Journey section */
body.light-mode .journey-header-left h2{color:#0d0020;}
body.light-mode .journey-header-left .sec-ey{color:var(--p);}
body.light-mode .jnav-btn{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.1);color:#333;}
body.light-mode .jdot{background:rgba(0,0,0,.15);}
body.light-mode .jdot.active{background:var(--p);}

/* Journey carousel in light mode */
body.light-mode .cs-left{background:linear-gradient(145deg,rgba(161,0,255,.12),rgba(161,0,255,.04));}
body.light-mode .cs-step-num{background:linear-gradient(135deg,var(--p),rgba(161,0,255,.5));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
body.light-mode .cs-of{color:rgba(13,0,32,.4);}
body.light-mode .cs-title{color:#0d0020;}
body.light-mode .cs-desc{color:#3d2a5c;}
body.light-mode .cs-right{background:rgba(255,255,255,.7);border-left:1px solid rgba(161,0,255,.12);}
body.light-mode .cs-item{background:rgba(255,255,255,.8);border-color:rgba(161,0,255,.1);}
body.light-mode .cs-item.highlight{background:rgba(161,0,255,.07);border-color:rgba(161,0,255,.2);}
body.light-mode .cs-item-title{color:#0d0020;}
body.light-mode .cs-item-sub{color:#5a3c82;}
body.light-mode .cs-detail-label{color:rgba(13,0,32,.35);}
body.light-mode .cs-sla.done{background:rgba(0,192,127,.1);border-color:rgba(0,192,127,.25);color:#059669;}
body.light-mode .cs-sla.active{background:rgba(59,130,246,.08);border-color:rgba(59,130,246,.2);color:#1d4ed8;}
body.light-mode .cs-sla.pending{background:rgba(161,0,255,.07);border-color:rgba(161,0,255,.15);color:var(--p);}
body.light-mode .cs-actor-pill.done{background:rgba(0,192,127,.1);border-color:rgba(0,192,127,.25);color:#059669;}
body.light-mode .cs-actor-pill.active{background:rgba(59,130,246,.08);border-color:rgba(59,130,246,.2);color:#1d4ed8;}
body.light-mode .cs-actor-pill.pending{background:rgba(161,0,255,.06);border-color:rgba(161,0,255,.15);color:#5a3c82;}
body.light-mode .cmp-dot.pending{background:rgba(0,0,0,.08);color:rgba(0,0,0,.35);}
body.light-mode .cmp-dot.done{background:var(--ok);color:#fff;}
body.light-mode .cmp-dot.active{background:var(--info);color:#fff;}
body.light-mode .cmp-line{background:rgba(0,0,0,.1);}
body.light-mode .cmp-line.done{background:var(--ok);opacity:.4;}
body.light-mode .cs-mini-progress{border-top:1px solid rgba(0,0,0,.07);}
/* semantic label colors */
.cmp-lbl-done{color:rgba(0,192,127,.75);}
.cmp-lbl-active{color:rgba(0,153,255,.85);}
.cmp-lbl-pending{color:rgba(255,255,255,.22);}
body.light-mode .cmp-lbl-done{color:rgba(5,150,105,.85);}
body.light-mode .cmp-lbl-active{color:rgba(29,78,216,.85);}
body.light-mode .cmp-lbl-pending{color:rgba(0,0,0,.3);}
body.light-mode .carousel-slide{border-color:rgba(161,0,255,.15);}
body.light-mode .jnav-btn{color:#333;}

/* Outcome boxes inside slide 3 in light mode */
body.light-mode #carousel-track [style*="rgba(0,192,127"]{background:rgba(0,192,127,.08) !important;border-color:rgba(0,192,127,.25) !important;color:#059669 !important;}
body.light-mode #carousel-track [style*="rgba(255,140,0"]{background:rgba(255,140,0,.08) !important;border-color:rgba(255,140,0,.25) !important;color:#b45309 !important;}

/* AI Chat panel light mode */
body.light-mode .cp-hdr{background:linear-gradient(135deg,#f3e8ff,#ede0ff);border-bottom-color:rgba(161,0,255,.18);}
body.light-mode .cp-info h4{color:#0d0020;}
body.light-mode .cp-info p{color:#7c5aa8;}
body.light-mode .cp-cls{background:rgba(0,0,0,.06);color:#5a3c82;}
body.light-mode .cp-cls:hover{background:rgba(0,0,0,.12);color:#0d0020;}
body.light-mode .cp-msgs{background:#faf6ff;}
body.light-mode .cm.ai .cm-bub{background:rgba(161,0,255,.07);border-color:rgba(161,0,255,.18);color:#1a0035;}
body.light-mode .cm.user .cm-av{background:rgba(161,0,255,.15);color:var(--p);}
body.light-mode .cp-sugs{background:#f0eaff;border-top-color:rgba(161,0,255,.15);}
body.light-mode .chip{background:rgba(161,0,255,.08);border-color:rgba(161,0,255,.2);color:#5a3c82;}
body.light-mode .chip:hover{background:rgba(161,0,255,.15);color:var(--p);border-color:rgba(161,0,255,.4);}
body.light-mode .cp-inp-r{background:#fff;border-top-color:rgba(161,0,255,.12);}
body.light-mode .cp-inp{background:#f8f5ff;border-color:rgba(161,0,255,.2);color:#0d0020;}
body.light-mode .cp-inp::placeholder{color:rgba(13,0,32,.4);}

/* Theme toggle */
/* FEEDBACK INPUTS */
.fb-input{font-family:var(--font);font-size:14px;background:rgba(255,255,255,.07);border:1.5px solid rgba(161,0,255,.2);border-radius:10px;padding:11px 14px;outline:none;width:100%;transition:all .2s;color:#fff;}
.fb-input:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(161,0,255,.12);}
.fb-input option{background:#1a0035;color:#fff;}
body.light-mode .fb-input{background:#fff;border-color:rgba(161,0,255,.2);color:#0d0020;}
body.light-mode .fb-input::placeholder{color:#999;}
body.light-mode .fb-input option{background:#fff;color:#0d0020;}
.fb-label{color:rgba(255,255,255,.65);}
body.light-mode .fb-label{color:#444;}
.fb-prefill{color:rgba(255,255,255,.8);}
body.light-mode .fb-prefill{color:#0d0020;}
.fb-success-title{color:#fff;}
.fb-success-copy{color:rgba(255,255,255,.5);}
.fb-success-refbox{background:rgba(255,255,255,.04);border:1px solid rgba(161,0,255,.2);}
.fb-success-ref-label{color:rgba(255,255,255,.4);}
body.light-mode .fb-success-title{color:#0d0020;}
body.light-mode .fb-success-copy{color:#3d2a5c;}
body.light-mode .fb-success-refbox{background:#ffffff;border-color:rgba(161,0,255,.2);}
body.light-mode .fb-success-ref-label{color:#5a3c82;}
body.light-mode #page-feedback .pre-field{background:#f8f5ff;border-color:rgba(161,0,255,.15);}
body.light-mode #page-feedback .fcard{background:#fff;border-color:rgba(161,0,255,.12);}
body.light-mode #page-feedback .fcard-title{color:var(--p) !important;}
body.light-mode .rating-btn{background:#f8f5ff;border-color:rgba(161,0,255,.15);}
body.light-mode .rating-btn span{color:#5a3c82;}
body.light-mode .rating-btn.sel{background:rgba(161,0,255,.08);border-color:var(--p);}
body.light-mode .faq-page-desc,body.light-mode .fb-page-desc{color:#3d2a5c !important;}
body.light-mode .faq-cta-title{color:#0d0020!important;}
body.light-mode #page-feedback .sec-h{color:#0d0020;}
body.light-mode #page-feedback .sec-ey{color:var(--p);}
body.light-mode #page-faq .sec-h{color:#0d0020;}
body.light-mode #page-faq .sec-ey{color:var(--p);}
/* FAQ still have questions box */
body.light-mode #page-faq .faq-cta-title{color:#0d0020!important;}
body.light-mode #page-faq .faq-page-desc{color:#3d2a5c!important;}

.theme-toggle{position:relative;width:52px;height:28px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:100px;cursor:pointer;transition:all .3s var(--ease);flex-shrink:0;}
.theme-toggle:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.3);}
.tt-icon{position:absolute;top:50%;transform:translateY(-50%);font-size:13px;line-height:1;transition:all .3s var(--ease);right:8px;left:auto;}
.tt-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.3);transition:all .3s var(--ease);}
body.light-mode .theme-toggle{background:rgba(161,0,255,.12);border-color:rgba(161,0,255,.25);}
body.light-mode .theme-toggle:hover{background:rgba(161,0,255,.18);}
body.light-mode .tt-icon{right:auto;left:8px;}
body.light-mode .tt-knob{left:calc(100% - 23px);background:#fff;box-shadow:0 1px 4px rgba(161,0,255,.3);}

/* PLAN COST BADGES */
.pc-tag{font-size:10px;color:rgba(161,0,255,.6);font-weight:500;margin-top:3px;letter-spacing:.3px;}
.pc-opt.sel .pc-tag{color:var(--p);}
.pc-cost{font-size:16px;font-weight:600;line-height:1;letter-spacing:-.5px;}
.pc-cost.free{color:#059669;}
.pc-cost.free span,.pc-cost.topup span{font-size:10px;font-weight:400;color:inherit;opacity:.7;}
.pc-cost.topup{color:#7c3aed;}
.pc-cost.locked{font-size:12px;color:#aaa;font-weight:600;}
.pc-cost-sub{font-size:10px;color:#999;margin-top:2px;}
.pc-opt.sel .pc-cost.free{color:#059669;}
.pc-opt.sel .pc-cost.topup{color:var(--p);}

/* LOCKED PLAN */
.pc-locked{opacity:.5;cursor:not-allowed !important;}
.pc-locked:hover{border-color:rgba(161,0,255,.1) !important;box-shadow:none !important;transform:none !important;}
.pc-locked .pc-radio{background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.2) !important;}
.pc-unlock-hint{font-size:10px;color:rgba(255,255,255,.35);margin-top:4px;text-align:right;font-style:italic;max-width:100px;line-height:1.3;}
.pc-opt{display:flex;align-items:center;gap:0;border:2px solid rgba(161,0,255,.15);border-radius:16px;overflow:hidden;cursor:pointer;transition:all .22s;background:rgba(255,255,255,.05);position:relative;box-shadow:0 2px 10px rgba(161,0,255,.05);}
.pc-opt:hover{border-color:rgba(161,0,255,.35);box-shadow:0 4px 20px rgba(161,0,255,.1);}
.pc-opt.sel{border-color:var(--p);background:linear-gradient(135deg,rgba(161,0,255,.06),rgba(161,0,255,.02));box-shadow:0 4px 24px rgba(161,0,255,.15);}
.pc-spd-bar{width:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 12px;border-right:1px solid rgba(161,0,255,.08);flex-shrink:0;background:rgba(161,0,255,.04);}
.pc-opt.sel .pc-spd-bar{background:rgba(161,0,255,.08);border-right-color:rgba(161,0,255,.15);}
.pc-spd{font-size:26px;font-weight:600;color:var(--p);line-height:1;letter-spacing:-1px;}
.pc-spd small{font-size:12px;color:rgba(255,255,255,.4);font-weight:400;}
.pc-body{flex:1;padding:14px 16px;}
.pc-prov{font-size:10px;font-weight:500;color:rgba(255,255,255,.45);letter-spacing:.5px;margin-bottom:2px;}
.pc-name{font-family:var(--font);font-size:14px;font-weight:600;color:rgba(255,255,255,.9);margin-bottom:4px;text-transform:uppercase;}
.pc-feats{display:flex;gap:10px;flex-wrap:wrap;}
.pc-feat{font-family:var(--body);font-size:10px;color:rgba(255,255,255,.5);display:flex;align-items:center;gap:4px;}
.pc-feat::before{content:'>';font-size:9px;color:var(--p);font-weight:500;font-family:var(--font);}
.pc-r{padding:13px 15px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:4px;flex-shrink:0;}
.pc-price{font-family:var(--body);font-size:13px;font-weight:600;color:rgba(255,255,255,.88);}
.pc-sub{font-family:var(--body);font-size:10px;color:rgba(255,255,255,.4);}
.pc-hot{background:var(--p);color:#fff;font-family:var(--body);font-size:8px;font-weight:500;padding:2px 8px;text-transform:uppercase;letter-spacing:.5px;}
.pc-radio{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .18s;margin-right:12px;}
.pc-opt.sel .pc-radio{border-color:var(--p);background:var(--p);}
.pc-opt.sel .pc-radio::after{content:'';width:5px;height:5px;background:#fff;}

/* MANAGER NOTE */
.mgr-note{background:rgba(0,192,127,.06);border:1px solid rgba(0,192,127,.2);border-radius:12px;padding:13px 16px;margin-top:14px;font-size:13px;color:rgba(0,192,127,.85);line-height:1.55;display:flex;gap:10px;align-items:flex-start;}

/* REVIEW */
.rev-plan{background:linear-gradient(135deg,#1a0035,#0a0018);border-radius:18px;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;color:#fff;box-shadow:0 4px 24px rgba(161,0,255,.2);}
.rv-plan-row{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid rgba(128,128,128,.15);flex-wrap:wrap;}
.rv-plan-row:last-child{border-bottom:none;}
.rp-l small{font-size:10px;color:rgba(255,255,255,.4);letter-spacing:.5px;}
.rp-l strong{font-size:20px;font-weight:600;display:block;margin-top:3px;letter-spacing:-.5px;}
.rp-r .rspd{font-size:44px;font-weight:600;color:var(--pl);line-height:1;letter-spacing:-2px;}
.rp-r .rspd small{font-size:14px;color:rgba(255,255,255,.35);font-weight:400;}
.rev-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;}
.rsec{background:rgba(255,255,255,.06);border:1px solid rgba(161,0,255,.15);border-radius:16px;padding:16px 18px;box-shadow:0 2px 12px rgba(161,0,255,.06);}
.rsec-t{font-size:13px;font-weight:600;color:var(--p);margin-bottom:10px;letter-spacing:.5px;text-transform:uppercase;}
.rr{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;border-bottom:1px solid rgba(161,0,255,.06);font-size:13px;}
.rr:last-child{border:none;}
.rl{color:rgba(255,255,255,.5);flex-shrink:0;white-space:nowrap;}
.rv{font-weight:600;color:rgba(255,255,255,.88);text-align:right;word-break:normal;overflow-wrap:break-word;}

/* APPROVAL CHAIN IN REVIEW */
.approval-chain{background:rgba(0,192,127,.05);border:1px solid rgba(0,192,127,.2);border-radius:16px;padding:16px 20px;margin-bottom:16px;display:flex;align-items:center;gap:0;}
.ac-step{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;}
.ac-step:not(:last-child)::after{content:'â€º';position:absolute;right:-7px;top:7px;font-size:18px;font-weight:600;color:rgba(0,192,127,.6);}
.ac-ic{font-size:18px;margin-bottom:4px;}
.ac-who{font-size:10px;font-weight:500;color:rgba(0,192,127,.85);}
.ac-desc{font-size:10px;color:rgba(0,192,127,.6);margin-top:2px;}

.chk-g{display:flex;gap:12px;align-items:flex-start;padding:13px 16px;border:1px solid rgba(161,0,255,.15);border-radius:12px;cursor:pointer;transition:all .2s;margin-bottom:10px;background:rgba(255,255,255,.04);}
.chk-g:hover{border-color:rgba(161,0,255,.35);background:rgba(161,0,255,.08);}
.chk-g input{width:16px;height:16px;margin-top:2px;accent-color:var(--p);cursor:pointer;flex-shrink:0;}
.chk-g label{font-size:13px;color:rgba(255,255,255,.65);cursor:pointer;line-height:1.55;}

/* BUTTONS */
.btn-row{display:flex;justify-content:space-between;align-items:center;margin-top:24px;}
.fbtn{background:linear-gradient(135deg,var(--p),var(--pd));color:#fff;font-size:14px;font-weight:600;padding:13px 28px;border:none;border-radius:100px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s;box-shadow:0 4px 20px rgba(161,0,255,.3);}
.fbtn:hover{transform:translateY(-1px);}
.fbtn-ghost{background:transparent;color:rgba(255,255,255,.5);font-size:14px;border:none;cursor:pointer;padding:13px 0;transition:color .2s;font-weight:500;}
.fbtn-ghost:hover{color:var(--p);}
.fbtn-out{background:rgba(255,255,255,.07);color:rgba(255,255,255,.7);font-size:14px;border:1.5px solid rgba(161,0,255,.25);border-radius:100px;padding:12px 22px;cursor:pointer;transition:all .2s;font-weight:500;}
.fbtn-out:hover{border-color:var(--p);color:var(--pl);}

/* SUCCESS */
#fp-succ{text-align:center;border-radius:16px;}
.succ-main-title{color:#fff;}
.succ-main-sub{color:rgba(255,255,255,.6);}
body.light-mode .succ-main-title{color:#1a0035;}
body.light-mode .succ-main-sub{color:rgba(13,0,32,.55);}
.succ-ring{width:72px;height:72px;background:var(--ok);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-family:var(--font);font-size:28px;font-weight:600;color:#fff;animation:popIn .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes popIn{from{transform:scale(0);opacity:0;}to{transform:scale(1);opacity:1;}}
.succ-ref{display:inline-flex;align-items:center;background:rgba(161,0,255,.07);border:1px solid rgba(161,0,255,.18);padding:10px 22px;font-family:var(--font);font-size:16px;font-weight:600;color:var(--p);letter-spacing:2px;margin:14px 0;text-transform:uppercase;border-radius:6px;}
.succ-next{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);padding:20px 22px;margin:20px 0;text-align:left;}
.succ-next-t{font-family:var(--body);font-size:9px;text-transform:uppercase;letter-spacing:2px;color:var(--ok);font-weight:500;margin-bottom:11px;}
.sn-row{display:flex;align-items:flex-start;gap:10px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.08);font-family:var(--body);font-size:12px;color:rgba(255,255,255,.65);line-height:1.4;}
.sn-row:last-child{border:none;}
.sn-num{width:18px;height:18px;background:var(--ok);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font);font-size:10px;font-weight:500;flex-shrink:0;margin-top:1px;}
/* SUCCESS - details grid */
.succ-details{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0;text-align:left;}
.succ-col{background:#fff;padding:16px 18px;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);}
.succ-col-hdr{font-family:var(--body);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--p);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(161,0,255,.12);}
.succ-field-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:5px 0;border-bottom:1px solid rgba(0,0,0,.06);font-family:var(--body);font-size:12px;}
.succ-field-row:last-child{border:none;}
.succ-rl{color:rgba(13,0,32,.45);flex-shrink:0;}
.succ-rv{color:#1a0035;font-weight:600;text-align:right;word-break:break-word;}
/* Telco row */
.succ-telco-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 4px;text-align:left;}
.succ-telco-slot{background:#fff;border-radius:12px;padding:14px 16px;box-shadow:0 2px 12px rgba(0,0,0,.06);display:flex;align-items:center;gap:12px;}
.succ-telco-slot::before{content:'\1F4C4';font-size:22px;}
.sc-slot-lbl{font-family:var(--body);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:rgba(13,0,32,.4);margin-bottom:2px;}
.sc-slot-isp{font-family:var(--font);font-size:14px;font-weight:700;color:#1a0035;margin-bottom:2px;}
.sc-slot-plan{font-family:var(--body);font-size:12px;color:var(--p);font-weight:600;}
/* What happens next - card grid */
.sn-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.sn-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:10px;padding:14px 16px;text-align:left;}
.sn-card-hdr{display:flex;align-items:center;gap:8px;margin-bottom:5px;}
.sn-card-ic{font-size:16px;}
.sn-card-title{font-family:var(--body);font-size:12px;font-weight:700;color:#1a0035;}
.sn-card-desc{font-family:var(--body);font-size:11px;color:rgba(13,0,32,.5);line-height:1.45;}
.sn-badge{font-family:var(--body);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:100px;flex-shrink:0;margin-left:auto;}
.sn-badge--pending{background:rgba(255,120,0,.12);color:#e06600;}
.sn-badge--waiting{background:rgba(100,150,255,.12);color:#4a7aff;}
.sn-badge--upcoming{background:rgba(0,0,0,.06);color:rgba(13,0,32,.4);}
/* Success screen disclaimer (under Primary/Secondary telco cards) */
.succ-disclaimer{display:flex;align-items:flex-start;gap:10px;background:#fffbeb;border:1px solid #fcd34d;border-radius:10px;padding:14px 16px;margin:12px 0 0;text-align:left;}
.succ-disclaimer-ic{font-size:15px;color:#d97706;flex-shrink:0;margin-top:1px;}
.succ-disclaimer p{font-family:var(--body);font-size:12px;color:#78350f;line-height:1.55;}
.succ-disclaimer strong{font-weight:600;color:#92400e;}
/* Your Next Step card */
.succ-nextstep-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);padding:20px 22px;margin:20px 0;text-align:left;}
.succ-nextstep-hdr{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;}
.succ-nextstep-ic{font-size:28px;}
.succ-nextstep-title{font-family:var(--font);font-size:16px;font-weight:700;color:#1a0035;margin-bottom:4px;}
.succ-nextstep-desc{font-family:var(--body);font-size:13px;color:rgba(13,0,32,.6);line-height:1.5;}
.succ-link{color:var(--p);font-weight:700;text-decoration:none;}
.succ-link:hover{text-decoration:underline;}
.succ-sn-fields{background:#F8FBFE;border:1px solid rgba(99,102,241,.12);border-radius:10px;padding:16px 18px;}
.succ-sn-fields-hdr{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.succ-sn-badge{background:var(--ok);color:#fff;font-family:var(--font);font-size:10px;font-weight:700;padding:3px 7px;border-radius:4px;}
.succ-sn-fields-title{font-family:var(--font);font-size:13px;font-weight:700;color:#1a0035;}
.succ-sn-legend{margin-left:auto;display:flex;gap:12px;font-family:var(--body);font-size:10px;}
.succ-sn-auto{color:var(--ok);font-weight:600;}
.succ-sn-manual{color:var(--p);font-weight:600;}
.succ-sn-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.succ-sn-item{display:flex;align-items:flex-start;gap:10px;font-family:var(--body);font-size:12px;padding:10px 12px;border-bottom:1px solid rgba(0,0,0,.06);}
.succ-sn-item--full{grid-column:1/-1;}
.succ-sn-item:last-child{border-bottom:none;}
.succ-sn-item div{display:flex;flex-direction:column;}
.succ-sn-label{color:#1a0035;font-weight:600;font-size:13px;}
.succ-sn-sub{color:rgba(13,0,32,.45);font-size:11px;margin-top:1px;}
.succ-sn-item strong{color:#1a0035;font-weight:600;font-size:13px;}
.succ-sn-item span{font-size:11px;}
.succ-sn-dot{width:20px;height:20px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;margin-top:2px;}
.succ-sn-dot.auto{background:rgba(76,175,125,.15);color:var(--ok);}
.succ-sn-dot.manual{background:rgba(161,0,255,.1);color:var(--p);}

/* SUCCESS — explicit dark mode surfaces */
body:not(.light-mode) .succ-next,
body:not(.light-mode) .succ-nextstep-card,
body:not(.light-mode) .succ-col,
body:not(.light-mode) .sn-card,
body:not(.light-mode) .succ-telco-slot{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(161,0,255,.14);
  box-shadow:0 2px 16px rgba(0,0,0,.35);
}
body:not(.light-mode) .succ-sn-fields{
  background:rgba(255,255,255,.04);
  border-color:rgba(161,0,255,.14);
}
body:not(.light-mode) .succ-nextstep-title,
body:not(.light-mode) .succ-sn-fields-title,
body:not(.light-mode) .succ-sn-label,
body:not(.light-mode) .succ-sn-item strong,
body:not(.light-mode) .succ-card-title,
body:not(.light-mode) .sc-slot-isp,
body:not(.light-mode) .succ-rv,
body:not(.light-mode) .sn-card-title{
  color:rgba(255,255,255,.9);
}
body:not(.light-mode) .succ-nextstep-desc,
body:not(.light-mode) .succ-sn-sub,
body:not(.light-mode) .succ-rl,
body:not(.light-mode) .sn-card-desc,
body:not(.light-mode) .sc-slot-lbl{
  color:rgba(255,255,255,.6);
}
body:not(.light-mode) .succ-field-row,
body:not(.light-mode) .succ-sn-item,
body:not(.light-mode) .sn-card{
  border-color:rgba(255,255,255,.08);
}
body:not(.light-mode) .sn-badge--upcoming{
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.55);
}
body:not(.light-mode) .succ-disclaimer{
  background:rgba(245,158,11,.12);
  border-color:rgba(245,158,11,.35);
}
body:not(.light-mode) .succ-disclaimer p{color:rgba(255,228,181,.9);}
body:not(.light-mode) .succ-disclaimer strong{color:#ffd89a;}

/* AI CHAT */
#ai-fab{position:fixed;bottom:22px;right:22px;z-index:300;display:flex;flex-direction:column;align-items:flex-end;gap:9px;}
.fab-hint{background:#000;border:1px solid rgba(161,0,255,.35);padding:7px 13px;font-family:var(--body);font-size:12px;color:rgba(255,255,255,.75);white-space:nowrap;animation:flt 3s ease-in-out infinite;}
@keyframes flt{0%,100%{transform:translateY(0);}50%{transform:translateY(-4px);}}
.fab{width:52px;height:52px;background:var(--p);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 22px rgba(161,0,255,.44);transition:all .22s;position:relative;}
.fab::after{content:'';position:absolute;inset:-5px;border:2px solid rgba(161,0,255,.2);animation:ripp 2.2s infinite;}
@keyframes ripp{0%{transform:scale(1);opacity:.5;}100%{transform:scale(1.5);opacity:0;}}
.fab:hover{background:var(--pd);}
#ai-panel{position:fixed;bottom:94px;right:22px;width:370px;max-height:520px;z-index:300;border-radius:var(--rl);overflow:hidden;display:none;flex-direction:column;box-shadow:0 18px 60px rgba(0,0,0,.7),0 0 0 1px rgba(161,0,255,.25);}
#ai-panel.open{display:flex;animation:pup .24s var(--ease);}
@keyframes pup{from{opacity:0;transform:translateY(14px) scale(.97);}to{opacity:1;transform:translateY(0) scale(1);}}
.cp-hdr{background:linear-gradient(135deg,#1a0035,#08001a);padding:14px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(161,0,255,.16);}
.cp-av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--pd));display:flex;align-items:center;justify-content:center;font-size:15px;border:2px solid rgba(161,0,255,.3);}
.cp-info h4{font-family:var(--font);font-size:13px;font-weight:600;margin-bottom:1px;}
.cp-info p{font-size:9px;color:rgba(255,255,255,.35);display:flex;align-items:center;gap:4px;}
.cp-info p::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--ok);}
.cp-cls{margin-left:auto;background:rgba(255,255,255,.07);border:none;color:rgba(255,255,255,.4);width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .18s;}
.cp-cls:hover{background:rgba(255,255,255,.14);color:#fff;}
.cp-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:rgba(5,0,13,.97);min-height:240px;max-height:330px;}
.cp-msgs::-webkit-scrollbar{width:3px;}
.cp-msgs::-webkit-scrollbar-thumb{background:rgba(161,0,255,.26);border-radius:2px;}
.cm{display:flex;gap:7px;align-items:flex-start;}
.cm.user{flex-direction:row-reverse;}
.cm-av{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:500;}
.cm.ai .cm-av{background:linear-gradient(135deg,var(--p),var(--pd));}
.cm.user .cm-av{background:rgba(255,255,255,.08);color:rgba(255,255,255,.5);}
.cm-bub{max-width:84%;padding:8px 12px;border-radius:10px;font-size:12px;line-height:1.55;}
.cm.ai .cm-bub{background:rgba(161,0,255,.1);border:1px solid rgba(161,0,255,.14);border-radius:3px 10px 10px 10px;color:rgba(255,255,255,.84);}
.cm.user .cm-bub{background:var(--p);border-radius:10px 3px 10px 10px;color:#fff;}
.typ{display:flex;gap:4px;padding:10px 14px;}
.typ span{width:5px;height:5px;border-radius:50%;background:rgba(161,0,255,.6);animation:tp 1.2s infinite;}
.typ span:nth-child(2){animation-delay:.2s;}
.typ span:nth-child(3){animation-delay:.4s;}
@keyframes tp{0%,100%{transform:translateY(0);opacity:.5;}50%{transform:translateY(-5px);opacity:1;}}
.cp-sugs{padding:8px 12px;display:flex;gap:6px;flex-wrap:wrap;background:rgba(8,0,20,.95);border-top:1px solid rgba(161,0,255,.1);}
.chip{background:rgba(161,0,255,.1);border:1px solid rgba(161,0,255,.2);border-radius:100px;padding:5px 12px;font-size:11px;color:rgba(255,255,255,.65);cursor:pointer;transition:all .2s;white-space:nowrap;}
.chip:hover{background:rgba(161,0,255,.22);color:#fff;border-color:rgba(161,0,255,.4);}
.cp-inp-r{background:rgba(8,0,20,.98);padding:12px 14px;display:flex;gap:8px;align-items:center;border-top:1px solid rgba(161,0,255,.12);}
.cp-inp{flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(161,0,255,.15);border-radius:100px;padding:9px 16px;font-size:13px;color:#fff;font-family:var(--font);outline:none;transition:all .2s;}
.cp-inp::placeholder{color:rgba(255,255,255,.28);}
.cp-inp:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(161,0,255,.12);}
.cp-snd{width:36px;height:36px;border-radius:50%;background:var(--p);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;flex-shrink:0;transition:all .2s;box-shadow:0 2px 10px rgba(161,0,255,.3);}
.cp-snd:hover{background:var(--pd);transform:scale(1.08);}
.cp-snd:disabled{background:rgba(161,0,255,.2);cursor:not-allowed;transform:none;box-shadow:none;}

@media(max-width:800px){
  .lnav,.fnav,.form-prog,.form-body,.wrap{padding-left:20px;padding-right:20px;}
  .fnav-logo .fn-main{font-size:14px;}
  .back-btn{font-size:10px;padding:6px 14px;letter-spacing:.5px;white-space:nowrap;}

  /* ── Nav: prevent overflow on tablet/mobile ── */
  .nav-r{gap:10px;}
  .nav-ai-btn{display:none;}
  .nav-greet{font-size:12px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

  /* ── Hero ── */
  .hero{grid-template-columns:1fr;padding-top:90px;gap:28px;}
  .hero-card,.hc-nums{display:none;}

  /* ── Plans carousel: 2-col grid + wrap tabs ── */
  .plans-carousel-wrap{min-height:auto;padding:20px 16px;}
  .isp-tabs{flex-wrap:wrap;gap:4px;}
  .isp-tab{flex:none;font-size:11px;padding:7px 8px;}
  .isp-plans{grid-template-columns:repeat(2,1fr);}

  /* ── How It Works journey carousel ── */
  .carousel-slide{grid-template-columns:1fr;}
  .cs-right{display:none;}
  .cs-left{padding:28px 24px;}
  .cs-step-num{font-size:48px;}
  .journey-sec .wrap{padding:0 20px;}

  /* ── How It Works status track: allow horizontal scroll ── */
  .arc-track{padding:18px 16px 14px;overflow-x:auto;}
  .track{width:max-content;min-width:100%;}
  .ts{min-width:58px;}
  .ts-ic{width:34px;height:34px;font-size:14px;}
  .ts-l{font-size:9px;max-width:58px;}
  .ts-sub{font-size:9px;max-width:58px;}

  /* ── Latest Updates feed ── */
  .arc-feed{margin-top:16px;}
  .req-sec{padding-bottom:24px;}

  /* ── ISP Decision Tree: stack each path row vertically ── */
  .idt-wrapper{padding:24px 16px 20px;}
  .idt-diagram{flex-direction:column;gap:16px;}
  /* Hide the source ISP box — the pill nav replaces it on mobile */
  .idt-source{display:none;}
  .idt-paths{padding-left:0;gap:16px;}
  .idt-paths::before{display:none;}
  /* Force vertical stacking: badge → dest-card (no arrow) */
  .idt-path-row{display:flex;flex-direction:column;align-items:stretch;gap:10px;}
  .idt-path-row::before,.idt-path-row::after{display:none;}
  .idt-badge{width:100%;max-width:100%;box-sizing:border-box;margin-top:0;text-align:left;}
  .idt-badge--migrate,.idt-badge--new{background:rgba(161,0,255,.08);}
  .idt-badge--migrate::before,.idt-badge--new::before{content:'→  ';}
  .idt-arrow-line{display:none;}
  .idt-dest-card{width:100%;box-sizing:border-box;}
  .idt-header-row{flex-direction:column;gap:16px;}
  /* ISP pill-style navigator */
  .idt-isp-nav{align-self:auto;width:100%;justify-content:center;gap:12px;}
  .idt-nav-label{flex:1;flex-direction:column;align-items:center;gap:4px;}
  .idt-nav-isp-name{display:block;background:var(--p);color:#fff;border-radius:100px;padding:10px 24px;font-size:16px;font-weight:800;letter-spacing:-.3px;text-align:center;width:100%;}
  /* Light mode: keep subtle badge fill */
  body.light-mode .idt-badge--migrate,body.light-mode .idt-badge--new{background:rgba(161,0,255,.06);}

  /* ── Form ── */
  .rev-cols{grid-template-columns:1fr;}
  .fg2{grid-template-columns:1fr;}
  .type-toggle{grid-template-columns:1fr;}
  .approval-chain{flex-wrap:wrap;gap:10px;}

  footer{flex-direction:column;gap:10px;text-align:center;}
  #ai-panel{width:calc(100vw - 28px);right:14px;}
}

/* ═══ EXTRA-SMALL MOBILE (≤480px) ═══ */
@media(max-width:480px){
  /* ── Nav: hide greeting to free up space ── */
  .nav-greet{display:none;}
  .nav-r{gap:8px;}
  .theme-toggle{display:none;}
  .lnav{padding:0 16px;}

  /* ── Hero ── */
  .hero{padding-top:80px;}
  .wrap{padding-left:16px;padding-right:16px;}

  /* ── Plans carousel: single column ── */
  .plans-carousel-wrap{padding:14px 12px;}
  .isp-tab{flex:1;font-size:10px;padding:6px 4px;}
  .isp-plans{grid-template-columns:1fr;}

  /* ── Arc top: stack action buttons below request info ── */
  .arc-top{flex-direction:column;align-items:flex-start;gap:12px;}

  /* ── IDT wrapper: tighter padding ── */
  .idt-wrapper{padding:16px 12px 14px;}

  /* ── Review: plan rows stack vertically ── */
  .rv-plan-row{flex-direction:column;align-items:flex-start;gap:3px;padding:10px 0;}
  .rv-plan-row span{min-width:0 !important;}

  /* ── What Happens Next: single column ── */
  .sn-cards{grid-template-columns:1fr;}
  .sn-card-hdr{flex-wrap:wrap;}
}

/* ─── ON-HOLD / WAITING STATUS PILLS ─── */
.spill.on-hold{background:rgba(180,83,9,.12);border:1px solid rgba(217,119,6,.3);color:#b45309;}
.spill.on-hold .sd{background:#b45309;border-radius:50%;animation:blink 1.5s infinite;}

/* â”€â”€â”€ ISP HOTLINE CARDS â”€â”€â”€ */
.hotline-card{padding:4px 0;}
.hotline-isp{font-size:14px;font-weight:700;color:var(--pl);margin-bottom:12px;letter-spacing:-0.2px;}
.hotline-rows{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;}
.hotline-row{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:rgba(161,0,255,.06);border:1px solid rgba(161,0,255,.12);border-radius:8px;}
.hotline-label{font-size:12px;color:rgba(255,255,255,.5);font-weight:500;}
.hotline-num{font-size:13px;font-weight:700;color:#fff;letter-spacing:0.3px;}
.hotline-hours{font-size:11px;color:rgba(255,255,255,.35);line-height:1.5;padding:0 2px;}
body.light-mode .hotline-row{background:rgba(161,0,255,.04);border-color:rgba(161,0,255,.1);}
body.light-mode .hotline-label{color:rgba(0,0,0,.45);}
body.light-mode .hotline-num{color:#0d0020;}
body.light-mode .hotline-hours{color:rgba(0,0,0,.4);}

/* â”€â”€â”€ ISP DECISION TREE â”€â”€â”€ */
.journey-desc {
  font-size: 14px;
  color: rgba(255,255,255,.5);
  margin-top: 8px;
  line-height: 1.6;
}
.idt-panel {
  display: none;
}
.idt-panel.active {
  display: block;
}
.idt-question {
  font-size: 15px;
  font-weight: 600;
  color: var(--pl, #BF5AFF);
  margin-bottom: 6px;
  font-style: italic;
}
.idt-title {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
  margin-bottom: 20px;
  letter-spacing: -.5px;
}
.idt-points {
  padding-left: 16px;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.idt-points li {
  font-size: 14px;
  color: rgba(255,255,255,.7);
  line-height: 1.6;
}
.idt-path-note {
  font-size: 13px;
  color: rgba(255,255,255,.55);
  line-height: 1.6;
  margin-bottom: 16px;
}
.idt-cta-btn {
  display: inline-flex;
  align-items: center;
  /* background: linear-gradient(135deg, var(--p, #A100FF), var(--pd, #7300BF)); */
  background: #A100FF;
  color: #fff;
  border: none;
  padding: 10px 22px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s;
  font-family: var(--font, 'Inter', sans-serif);
  /* box-shadow: 0 4px 14px rgba(161,0,255,.3); */
}
.idt-cta-btn:hover {
  transform: translateY(-1px);
  /* box-shadow: 0 6px 20px rgba(161,0,255,.45); */
}
.idt-cta-btn.idt-cta-disabled {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.3);
  cursor: not-allowed;
  box-shadow: none;
}
.idt-placeholder-note {
  font-size: 12px;
  color: rgba(255,140,0,.7);
  margin-bottom: 12px;
  line-height: 1.5;
}
.idt-coming-soon-chip {
  font-size: 8px;
  background: rgba(255,140,0,.15);
  border: 1px solid rgba(255,140,0,.3);
  color: #ff8c00;
  padding: 1px 6px;
  border-radius: 100px;
  margin-left: 4px;
  font-weight: 700;
  vertical-align: middle;
}

/* ISP navigator + header row */
.idt-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 28px;
}
.idt-header-left {
  flex: 1;
}
.idt-header-left h2 {
  font-family: var(--font);
  font-size: clamp(22px,2.8vw,36px);
  font-weight: 800;
  letter-spacing: -1px;
  color: #fff;
}
.idt-header-left h2 em {
  color: var(--pl, #BF5AFF);
  font-style: normal;
}
.idt-isp-nav {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  align-self: center;
}
.idt-isp-nav--source {
  display: grid;
  grid-template-columns: repeat(2, 32px);
  justify-content: center;
  gap: 8px 10px;
  width: 100%;
}
.idt-diagram--no-source .idt-path-row > .idt-isp-nav--source {
  position: absolute;
  top: calc(50% + 38px);
  left: calc((var(--idt-flow-col) - 74px) / 2);
  width: 74px;
  z-index: 2;
}
.idt-isp-nav--source .idt-nav-arrow {
  width: 32px;
  height: 32px;
  font-size: 15px;
}
.idt-isp-nav--source .idt-nav-arrow:first-child {
  grid-column: 1;
  grid-row: 1;
}
.idt-isp-nav--source .idt-nav-arrow:last-child {
  grid-column: 2;
  grid-row: 1;
}
.idt-isp-nav--source .idt-nav-label {
  grid-column: 1 / -1;
  grid-row: 2;
}
.idt-nav-arrow {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid var(--pl, #BF5AFF);
  color: var(--pl, #BF5AFF);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all .2s;
  font-family: var(--font, 'Inter', sans-serif);
}
.idt-nav-arrow:hover {
  background: var(--p, #A100FF);
  border-color: var(--p, #A100FF);
  color: #fff;
  /* box-shadow: 0 4px 16px rgba(161,0,255,.3); */
}
.idt-nav-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  text-align: center;
}
.idt-nav-isp-name {
  display: none;
  font-size: 18px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -.5px;
}
.idt-nav-counter {
  font-size: 10px;
  background: rgba(161,0,255,.12);
  border: 1px solid rgba(161,0,255,.2);
  color: var(--pl, #BF5AFF);
  padding: 2px 10px;
  border-radius: 100px;
  font-weight: 700;
  letter-spacing: .5px;
  margin-top: 2px;
}

/* Diagram layout */
.idt-diagram {
  --idt-flow-col: 180px;
  --idt-elbow-radius: 14px;
  --idt-badge-offset: 0px;
  --idt-line-to-badge-gap: 0px;
  --idt-branch-reach: calc(var(--idt-badge-offset) - var(--idt-line-to-badge-gap));
  --idt-spine-top: 30px;
  --idt-spine-bottom: 30px;
  --idt-line-strong: rgba(191,90,255,.72);
  --idt-line-soft: rgba(161,0,255,.38);
  --idt-line-solid: rgba(191,90,255,.62);
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: stretch;
}
.idt-diagram--no-source .idt-paths {
  width: 100%;
  padding-left: 0;
}
.idt-diagram--no-source .idt-paths::before {
  display: none;
}
.idt-diagram--no-source .idt-path-row::before {
  display: none;
}
.idt-diagram--no-source .idt-path-row::after {
  display: none;
}
.idt-source {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-shrink: 0;
  width: var(--idt-flow-col);
  position: relative;
  transform: translateY(var(--idt-source-offset-y, 0px));
}
.idt-source-box {
  position: relative;
  border: 1px solid transparent;
  background: linear-gradient(135deg, var(--p, #A100FF), var(--pd, #7300BF));
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  padding: 12px 14px;
  border-radius: 12px;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  box-shadow: 0 6px 20px rgba(161,0,255,.18);
}
.idt-source-box::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -24px;
  width: 24px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--idt-line-strong), var(--idt-line-soft));
  transform: translateY(-50%);
}
.idt-source-line {
  display: none;
}
.idt-paths {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
  min-width: 0;
  position: relative;
  padding-left: 28px;
}
.idt-paths::before {
  content: '';
  position: absolute;
  top: var(--idt-spine-top);
  bottom: var(--idt-spine-bottom);
  left: 0;
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--idt-line-strong), rgba(161,0,255,.18));
}
.idt-path-row {
  display: grid;
  grid-template-columns: var(--idt-flow-col) 48px minmax(0, 1fr);
  align-items: center;
  column-gap: 0;
  position: relative;
}
.idt-path-row::before {
  content: '';
  position: absolute;
  top: 50%;
  left: calc(-28px + var(--idt-elbow-radius));
  width: calc(28px + var(--idt-branch-reach) - var(--idt-elbow-radius));
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--idt-line-strong), rgba(161,0,255,.45));
  transform: translateY(-50%);
}
.idt-path-row::after {
  content: '';
  position: absolute;
  left: -28px;
  width: var(--idt-elbow-radius);
  height: var(--idt-elbow-radius);
  border-left: 2px solid var(--idt-line-solid);
  display: none;
  pointer-events: none;
}
.idt-path-row:first-child::after {
  top: 50%;
  border-top: 2px solid var(--idt-line-solid);
  border-top-left-radius: var(--idt-elbow-radius);
  display: block;
}
.idt-path-row:last-child::after {
  bottom: 50%;
  border-bottom: 2px solid var(--idt-line-solid);
  border-bottom-left-radius: var(--idt-elbow-radius);
  display: block;
}
.idt-diagram--no-source .idt-path-row:first-child::after,
.idt-diagram--no-source .idt-path-row:last-child::after {
  display: none;
}



.idt-diagram--single-path {
  align-items: center;
}
.idt-diagram--single-path .idt-source {
  margin-top: 0;
}
.idt-diagram--single-path .idt-source .idt-isp-nav--source {
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
  width: auto;
}
.idt-diagram--single-path .idt-paths {
  padding-left: 0;
}
.idt-diagram--single-path .idt-paths::before {
  display: none;
}
.idt-diagram--single-path .idt-path-row {
  align-items: center;
}
.idt-diagram--single-path .idt-path-row::before {
  display: none;
}
.idt-diagram--single-path .idt-path-row::after {
  display: none;
}
.idt-diagram--single-path .idt-path-row:first-child::after,
.idt-diagram--single-path .idt-path-row:last-child::after {
  display: none;
}

.idt-diagram--single-path {
  align-items: center;
}
.idt-diagram--single-path .idt-source {
  margin-top: 0;
}
.idt-diagram--single-path .idt-source .idt-isp-nav--source {
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
  width: auto;
}
.idt-diagram--single-path .idt-paths {
  padding-left: 0;
}
.idt-diagram--single-path .idt-paths::before {
  display: none;
}
.idt-diagram--single-path .idt-path-row {
  align-items: center;
}
.idt-diagram--single-path .idt-path-row::before {
  display: none;
}
.idt-diagram--single-path .idt-path-row::after {
  display: none;
}
.idt-diagram--single-path .idt-path-row:first-child::after,
.idt-diagram--single-path .idt-path-row:last-child::after {
  display: none;
}
.idt-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  justify-self: end;
  padding: 7px 14px;
  border-radius: 100px;
  font-size: 11px;
  font-weight: 800;
  /* letter-spacing: .5px; */
  text-transform: uppercase;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.25;
  text-align: center;
  margin-top: 0;
}
.idt-badge--migrate {
  background: transparent;
  border: 1px solid var(--pl, #BF5AFF);
  color: var(--pl, #BF5AFF);
}
.idt-badge--new {
  background: transparent;
  border: 1px solid var(--pl, #BF5AFF);
  color: var(--pl, #BF5AFF);
}
.idt-badge--secondary {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.6);
}
.idt-arrow-line {
  position: relative;
  justify-self: stretch;
  align-self: center;
  width: calc(100% - 5px);
  height: 2px;
  margin-right: 0;
  color: var(--pl, #BF5AFF);
  font-size: 0;
  margin-top: 0;
  background: linear-gradient(90deg, var(--idt-line-strong), var(--idt-line-soft));
  border-radius: 999px;
  z-index: 1;
}
.idt-arrow-line::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  width: 6px;
  height: 6px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  box-sizing: border-box;
  transform: translateY(-50%) rotate(45deg);
}
.idt-dest-card {
  flex: 1;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(161,0,255,.15);
  border-radius: 12px;
  padding: 18px 20px;
  min-width: 0;
}
.idt-dest-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--pl, #BF5AFF);
  margin-bottom: 12px;
}
.idt-dest-isps {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin-bottom: 14px;
}
.idt-dest-isp-name {
  font-weight: 600;
  color: var(--pl, #BF5AFF);
  font-size: 13px;
}
.idt-dest-isp-name::after {
  content: '\2022';
  margin-left: 12px;
  color: rgba(255,255,255,.2);
}
.idt-dest-isp-name:last-child::after {
  content: '';
  margin-left: 0;
}

/* Eastern placeholder plans card */
.plans-placeholder {
  grid-column: 1 / -1;
  text-align: center;
  padding: 32px 20px;
}
.pp-icon { font-size: 36px; margin-bottom: 12px; }
.pp-title {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}
.pp-msg {
  font-size: 13px;
  color: rgba(255,255,255,.5);
  line-height: 1.6;
  margin-bottom: 16px;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}
.pp-cta {
  display: inline-block;
  color: var(--pl, #BF5AFF);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid rgba(161,0,255,.3);
  padding: 8px 18px;
  border-radius: 100px;
  transition: all .2s;
}
.pp-cta:hover {
  background: rgba(161,0,255,.1);
  border-color: var(--p, #A100FF);
}

/* Light mode overrides */
body.light-mode .idt-header-left h2 { color: #0d0020; }
body.light-mode .idt-header-left h2 em { color: var(--p, #A100FF); }
body.light-mode .idt-question { color: var(--p, #A100FF); }
body.light-mode .idt-title { color: #0d0020; }
body.light-mode .journey-desc { color: rgba(0,0,0,.5); }
body.light-mode .idt-nav-arrow { border-color: var(--p, #A100FF); color: var(--p, #A100FF); }
body.light-mode .idt-nav-arrow:hover { background: var(--p, #A100FF); border-color: var(--p, #A100FF); color: #fff; }
body.light-mode .idt-nav-isp-name { color: #0d0020; }
body.light-mode .idt-nav-counter { background: rgba(161,0,255,.06); border-color: rgba(161,0,255,.2); color: var(--p, #A100FF); }
body.light-mode .idt-source-box { border-color: transparent; color: #fff; }
body.light-mode .idt-dest-card { background: #fff; border-color: rgba(161,0,255,.15); box-shadow: 0 2px 12px rgba(0,0,0,.05); }
body.light-mode .idt-dest-name { color: #A100FF; }
body.light-mode .idt-dest-isp-name { color: var(--p, #A100FF); }
body.light-mode .idt-dest-isp-name::after { color: rgba(0,0,0,.15); }
body.light-mode .idt-points li { color: #3d2a5c; }
body.light-mode .idt-path-note { color: #5a3c82; }
body.light-mode .idt-arrow-line { color: var(--p, #A100FF); }
body.light-mode .idt-badge--migrate { background: transparent; border-color: var(--p, #A100FF); color: var(--p, #A100FF); }
body.light-mode .idt-badge--new { border-color: var(--p, #A100FF); color: var(--p, #A100FF); }
body.light-mode .idt-badge--secondary { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.1); color: rgba(0,0,0,.5); }
body.light-mode .idt-cta-btn.idt-cta-disabled { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.08); color: rgba(0,0,0,.3); }
body.light-mode .idt-diagram { --idt-line-solid: rgba(161,0,255,.5); }
body.light-mode .pp-title { color: #0d0020; }
body.light-mode .pp-msg { color: #5a3c82; }

/* â”€â”€â”€ IDT WRAPPER â”€â”€â”€ */
.idt-wrapper {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(161,0,255,.15);
  border-radius: 20px;
  padding: 32px 32px 28px;
  width: 100%;
  box-sizing: border-box;
}
.idt-header-divider {
  height: 1px;
  background: rgba(255,255,255,.07);
  margin: 20px 0 28px;
}

/* Light mode overrides */
body.light-mode .idt-wrapper {
  background: #fff;
  border-color: rgba(161,0,255,.15);
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
}
body.light-mode .idt-header-divider {
  background: rgba(161,0,255,.1);
}
/* â”€â”€â”€ DATA PRIVACY MODAL â”€â”€â”€ */
.privacy-overlay{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.75);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:16px;}
.privacy-modal{background:var(--bk2,#0f0020);border:1px solid rgba(161,0,255,.25);border-radius:20px;width:100%;max-width:800px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(0,0,0,.6);overflow:hidden;}
.privacy-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;background:rgba(161,0,255,.06);border-bottom:none;flex-shrink:0;}
.privacy-logo{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:#fff;}
.privacy-badge{border:1px solid rgba(161,0,255,.3);color:#a100ff;font-size:10px;font-weight:700;padding:4px 12px;border-radius:100px;letter-spacing:.5px;text-transform:uppercase;}
.privacy-body{flex:1;overflow:hidden;display:flex;flex-direction:column;padding:20px 24px 0;}
.privacy-title{font-size:18px;font-weight:800;color:#fff;margin-bottom:8px;letter-spacing:-.3px;}
.privacy-subtitle{font-size:12px;color:rgba(255,255,255,.4);line-height:1.6;margin-bottom:16px;}
.privacy-scroll{flex:1;overflow-y:auto;padding-right:4px;padding-bottom:8px;}
.privacy-section{margin-bottom:16px;}


.privacy-scroll::-webkit-scrollbar{width:6px;}
.privacy-scroll::-webkit-scrollbar-thumb{background:rgba(161,0,255,.3);border-radius:2px;}

.privacy-section-title{font-size:12px;font-weight:700;color:#a100ff;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;}
.privacy-section p,.privacy-section li{font-size:13px;color:rgba(255,255,255,.65);line-height:1.65;text-indent:1.5em;text-align:justify;}
.privacy-section ul{padding-left:16px;margin-top:4px;}
.privacy-section ul li{margin-bottom:4px;}
.privacy-consent-box{background:rgba(161,0,255,.06);border:1px solid rgba(161,0,255,.18);border-radius:12px;padding:16px 18px;margin:8px 0 4px;}
.privacy-consent-title{font-size:11px;font-weight:700;color:#a100ff;letter-spacing:1px;margin-bottom:8px;}
.privacy-consent-text{font-size:12px;color:rgba(255,255,255,.6);line-height:1.6;}
.privacy-placeholder{background:rgba(255,140,0,.15);border:1px solid rgba(255,140,0,.3);border-radius:4px;padding:1px 6px;color:#ff8c00;font-style:italic;font-size:.95em;}
.privacy-link{color:#a100ff;text-decoration:none;}
.privacy-info-box{background:rgba(161,0,255,.1);border:1px solid rgba(161,0,255,.2);border-radius:10px;padding:14px 18px;margin:10px 0;font-size:12px;color:rgba(255,255,255,.75);line-height:1.7;font-weight:500;}
.privacy-access-list{list-style:none;padding-left:1.5em;margin:6px 0 10px;display:flex;flex-direction:column;gap:4px;}
.privacy-access-list li{font-size:13px;color:rgba(255,255,255,.65);line-height:1.65;text-align:justify;}
.privacy-retention-box{background:rgba(255,140,0,.08);border:1px solid rgba(255,140,0,.3);border-radius:10px;padding:14px 18px;margin:10px 0;font-size:13px;color:rgba(255,255,255,.7);line-height:1.7;}
.privacy-retention-box strong{color:#ffaa33;}
.privacy-section-divider{border:none;border-top:1px solid rgba(161,0,255,.1);margin:4px 0 16px;}
.privacy-link:hover{text-decoration:underline;}
.privacy-footer{padding:16px 24px;border-top:1px solid rgba(161,0,255,.15);background:rgba(0,0,0,.2);flex-shrink:0;}
.privacy-note{font-size:10px;color:rgba(255,140,0,.7);margin-bottom:12px;line-height:1.5;}
.privacy-actions{display:flex;gap:10px;justify-content:flex-end;}
.privacy-btn-disagree{background:transparent;border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.5);padding:10px 22px;border-radius:100px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;font-family:var(--font,'Inter',sans-serif);}
.privacy-btn-disagree:hover{border-color:rgba(255,59,48,.4);color:#ff3b30;}
.privacy-btn-agree{background:linear-gradient(135deg,var(--p,#A100FF),var(--pd,#7300BF));border:none;color:#fff;padding:10px 24px;border-radius:100px;font-size:13px;font-weight:700;cursor:pointer;transition:all .2s;font-family:var(--font,'Inter',sans-serif);} /* box-shadow:0 4px 16px rgba(161,0,255,.3);*/
.privacy-btn-agree:hover:not(:disabled){box-shadow:0 6px 24px rgba(161,0,255,.45);transform:translateY(-1px);}
.privacy-btn-agree:disabled{opacity:.35;cursor:not-allowed;box-shadow:none;transform:none;filter:grayscale(.3);}
.privacy-scroll-hint{font-size:11px;color:rgba(255,255,255,.35);text-align:center;margin-bottom:10px;transition:opacity .4s;}
.privacy-scroll-hint.done{opacity:0;pointer-events:none;}
body.light-mode .privacy-scroll-hint{color:rgba(0,0,0,.35);}
.privacy-blocked-screen{position:fixed;inset:0;z-index:999;background:var(--bk,#080014);display:none;align-items:center;justify-content:center;text-align:center;padding:24px;}
.privacy-blocked-inner{max-width:420px;}
.privacy-blocked-inner h2{font-size:24px;font-weight:800;color:#fff;margin-bottom:12px;}
.privacy-blocked-inner p{font-size:14px;color:rgba(255,255,255,.5);line-height:1.6;margin-bottom:8px;}
/* Footer */
.hc-footer{border-top:1px solid rgba(255,255,255,.06);padding:20px 48px;margin-top:48px;position:relative;z-index:1;}
.hc-footer-inner{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.hc-footer-copy{font-size:11px;color:rgba(255,255,255,.25);}
.hc-footer-links{display:flex;align-items:center;gap:8px;}
.hc-footer-link{font-size:11px;color:rgba(255,255,255,.35);background:none;border:none;cursor:pointer;text-decoration:none;font-family:var(--font,'Inter',sans-serif);transition:color .2s;padding:0;}
.hc-footer-link:hover{color:var(--pl,#BF5AFF);}
.hc-footer-sep{font-size:11px;color:rgba(255,255,255,.15);}
/* Light mode */
body.light-mode .privacy-modal{background:#fff;border-color:rgba(161,0,255,.2);}
body.light-mode .privacy-header{background:rgba(161,0,255,.05);border-bottom:none;}
body.light-mode .privacy-logo{color:#0d0020;}
body.light-mode .privacy-title{color:#0d0020;}
body.light-mode .privacy-subtitle{color:rgba(0,0,0,.4);}
body.light-mode .privacy-section p,body.light-mode .privacy-section li{color:#3d2a5c;}
body.light-mode .privacy-consent-box{background:rgba(161,0,255,.04);border-color:rgba(161,0,255,.15);}
body.light-mode .privacy-consent-text{color:rgba(0,0,0,.6);}
body.light-mode .privacy-btn-disagree{border-color:rgba(0,0,0,.15);color:rgba(0,0,0,.45);}
body.light-mode .privacy-footer{background:rgba(0,0,0,.02);border-color:rgba(161,0,255,.12);}
/* ─── PRIVACY AGREED BAR (view-only modal footer) ─── */
.privacy-agreed-bar{display:none;align-items:center;gap:8px;background:rgba(161,0,255,.12);border:1px solid rgba(161,0,255,.3);border-radius:8px;padding:10px 16px;margin-bottom:12px;font-size:12px;font-weight:600;color:var(--pl,#BF5AFF);line-height:1.4;}
.privacy-agreed-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:rgba(161,0,255,.25);color:var(--pl,#BF5AFF);font-size:11px;font-weight:900;flex-shrink:0;}
body.light-mode .privacy-agreed-bar{background:rgba(161,0,255,.08);border-color:rgba(161,0,255,.25);color:#7300BF;}
body.light-mode .privacy-agreed-icon{background:rgba(161,0,255,.15);color:#7300BF;}
body.light-mode .privacy-info-box{background: rgb(196 95 255 / 8%);border-color:rgba(161,0,255,.18);color:#7500C0;}
body.light-mode .privacy-access-item{background: rgb(196 95 255 / 8%);border-color:rgba(161,0,255,.15);border-left-color:rgba(161,0,255,.4);}
body.light-mode .privacy-retention-box{background:rgba(255,140,0,.05);border-color:rgba(255,140,0,.25);color:#4a3010;}
body.light-mode .privacy-retention-box strong{color:#b36800;}
body.light-mode .privacy-section-divider{border-color:rgba(161,0,255,.08);}
body.light-mode .hc-footer{border-color:rgba(0,0,0,.08);}
body.light-mode .hc-footer-copy{color:rgba(0,0,0,.3);}
body.light-mode .hc-footer-link{color:rgba(0,0,0,.4);}
body.light-mode .privacy-blocked-screen{background:#f8f5ff;}
body.light-mode .privacy-blocked-inner h2{color:#0d0020;}
body.light-mode .privacy-blocked-inner p{color:#5a3c82;}
body.light-mode .privacy-blocked-inner a.privacy-link{color:var(--p,#A100FF);}

/* ─── CAREER LEVEL PLAN GATING ─── */
/* Subsidy pill above ISP tabs */
.cl-subsidy-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(161,0,255,.12);border:1px solid rgba(161,0,255,.25);border-radius:100px;padding:5px 14px;font-size:11px;font-weight:600;color:var(--pl,#BF5AFF);letter-spacing:.3px;margin-bottom:12px;}
.cl-subsidy-pill:empty{display:none;}
.cl-subsidy-pill { color: rgba(255,255,255,.85) !important; }

/* Carousel card — unavailable overlay (kept for form plan-chooser rows) */
.plan-unavailable{opacity:.45;pointer-events:none !important;cursor:not-allowed;}
.plan-unavailable .pcm-cost{color:rgba(255,255,255,.3) !important;}
.plan-cl-badge{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);font-size:9px;font-weight:700;letter-spacing:.4px;color:rgba(255,255,255,.4);white-space:nowrap;text-transform:uppercase;}
.pc-mini{position:relative;}
/* Carousel card — grayed lower plans (below subsidy, fully clickable) */
.plan-grayed{opacity:.45;}
.plan-grayed .pcm-cost{color:rgba(255,255,255,.3) !important;}
/* Carousel card — recommended plan (dynamic, replaces static 'featured') */
.plan-recommended{border-color:rgba(161,0,255,.5) !important;background:rgba(161,0,255,.13) !important;} /* box-shadow:0 4px 20px rgba(161,0,255,.25);*/
.plan-recommended .pcm-tag{color:var(--pl) !important;font-weight:700 !important;}

/* Form plan row — career level gating */
.plan-row--unavailable{opacity:.45;pointer-events:none !important;}
.plan-row--unavailable .pc-radio{background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.15) !important;}
/* Form plan row — grayed lower plans (below subsidy, fully clickable) */
.plan-row--grayed{opacity:.45;}
.plan-row--grayed .pc-radio{background:rgba(255,255,255,.06) !important;border-color:rgba(255,255,255,.15) !important;}

/* Cost label variants used by applyCareerLevel* */
.plan-free-label{color:#059669 !important;}
.plan-topup-label{color:var(--p,#A100FF) !important;}
.plan-unavail-label{color:rgba(255,255,255,.35) !important;}

/* Light mode overrides */
body.light-mode .cl-subsidy-pill{ color: #5a1a8a !important; }
body.light-mode .plan-cl-badge{color:rgba(0,0,0,.3);}
body.light-mode .plan-free-label{color:#059669 !important;}
body.light-mode .plan-topup-label{color:var(--p,#A100FF) !important;}
body.light-mode .plan-unavail-label{color:rgba(0,0,0,.3) !important;}

/* ─── SALARY DEDUCTION TOOLTIP ─── */
#hc-tooltip{position:fixed;background:rgba(13,0,32,.92);color:rgba(255,255,255,.92);font-size:10px;font-weight:600;letter-spacing:.3px;padding:4px 9px;border-radius:6px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease;z-index:9999;transform:translateX(-50%);}
body.light-mode #hc-tooltip{background:rgba(20,0,40,.88);color:#fff;}

/* ─── CL LOADING / ERROR STATES ─── */
/* Plan carousel skeleton — pulsing placeholder while CL resolves */
.plans-loading{display:flex;align-items:center;justify-content:center;min-height:180px;border-radius:16px;background:rgba(161,0,255,.06);border:1px dashed rgba(161,0,255,.18);color:rgba(255,255,255,.45);font-size:13px;font-weight:600;letter-spacing:.3px;animation:plans-pulse 1.6s ease-in-out infinite;}
@keyframes plans-pulse{0%,100%{opacity:.55;}50%{opacity:1;}}

/* Inline CL unresolvable error in carousel */
.plans-cl-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:120px;gap:10px;border-radius:14px;background:rgba(255,140,0,.06);border:1px solid rgba(255,140,0,.2);color:rgba(255,255,255,.5);font-size:13px;text-align:center;padding:20px 24px;line-height:1.6;}
.plans-cl-retry{background:none;border:none;color:var(--pl);font-size:13px;font-weight:600;cursor:pointer;padding:0;font-family:var(--font);text-decoration:underline;text-underline-offset:2px;}
.plans-cl-retry:hover{opacity:.75;}
.plans-cl-retry:focus-visible{outline:2px solid var(--pl);outline-offset:2px;border-radius:2px;}

/* Form inline CL-loading notice */
.cl-loading-notice{display:flex;align-items:center;gap:10px;background:rgba(161,0,255,.08);border:1px solid rgba(161,0,255,.22);border-radius:12px;padding:12px 16px;font-size:13px;color:rgba(255,255,255,.7);margin-bottom:16px;}
.cl-loading-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(161,0,255,.3);border-top-color:var(--p);border-radius:50%;animation:cl-spin .7s linear infinite;flex-shrink:0;}
@keyframes cl-spin{to{transform:rotate(360deg);}}

/* Form inline CL unresolvable error */
.cl-form-error{background:rgba(255,140,0,.07);border:1px solid rgba(255,140,0,.22);border-radius:12px;padding:12px 16px;font-size:13px;color:rgba(255,255,255,.6);margin-bottom:16px;line-height:1.5;}

/* Light mode overrides */
body.light-mode .plans-loading{background:rgba(161,0,255,.05);border-color:rgba(161,0,255,.15);color:rgba(13,0,32,.45);}
body.light-mode .plans-cl-error{background:rgba(255,140,0,.05);border-color:rgba(255,140,0,.18);color:rgba(13,0,32,.5);}
body.light-mode .cl-loading-notice{background:rgba(161,0,255,.06);border-color:rgba(161,0,255,.18);color:rgba(13,0,32,.65);}
body.light-mode .cl-form-error{background:rgba(255,140,0,.05);border-color:rgba(255,140,0,.18);color:rgba(13,0,32,.55);}

/* ─── IDT RESPONSIVE ─── */
/* These rules are placed AFTER the base IDT CSS so they correctly win     */
/* the cascade — the earlier @media blocks at line ~948 were overridden by */
/* the base IDT class rules defined further down the file.                 */

@media(max-width:800px){
  /* wrapper & header */
  .idt-wrapper{padding:20px 16px 16px;}
  .idt-header-row{flex-direction:column;gap:12px;margin-bottom:20px;}
  .idt-header-divider{margin:12px 0 16px;}
  /* ISP nav: full-width pill with arrows at edges */
  .idt-isp-nav{align-self:auto;width:100%;justify-content:space-between;gap:8px;}
  .idt-nav-label{flex:1;flex-direction:column;align-items:center;gap:6px;}
  .idt-nav-isp-name{display:block;background:var(--p);color:#fff;border-radius:100px;padding:10px 20px;font-size:16px;font-weight:800;letter-spacing:-.3px;text-align:center;width:100%;}
  /* Diagram: vertical stack */
  .idt-diagram{flex-direction:column;gap:12px;}
  .idt-source{display:none;}
  .idt-paths{padding-left:0;gap:12px;}
  .idt-paths::before{display:none;}
  /* Path rows become bordered cards */
  .idt-path-row{display:flex;flex-direction:column;align-items:stretch;gap:0;background:rgba(255,255,255,.03);border:1px solid rgba(161,0,255,.2);border-radius:14px;overflow:hidden;grid-template-columns:unset;}
  .idt-path-row::before,.idt-path-row::after{display:none;}
  /* Badge becomes the card header strip */
  .idt-badge{width:100%;max-width:100%;box-sizing:border-box;margin-top:0;text-align:left;border-radius:0;border:none;border-bottom:1px solid rgba(161,0,255,.15);padding:12px 16px;justify-content:flex-start;justify-self:auto;gap:8px;}
  .idt-badge--migrate,.idt-badge--new{background:rgba(161,0,255,.08);}
  .idt-badge--migrate::before,.idt-badge--new::before{content:'→';}
  .idt-arrow-line{display:none;}
  /* Dest card: no individual border inside the card container */
  .idt-dest-card{width:100%;box-sizing:border-box;border:none;border-radius:0;background:transparent;padding:16px;flex:unset;}
  /* CTA button: full width on mobile */
  .idt-cta-btn{width:100%;justify-content:center;display:flex;}
  /* Light mode overrides */
  body.light-mode .idt-nav-isp-name{color:#fff;}
  body.light-mode .idt-path-row{background:#fff;border-color:rgba(161,0,255,.15);}
  body.light-mode .idt-badge--migrate,body.light-mode .idt-badge--new{background:rgba(161,0,255,.05);}
  body.light-mode .idt-dest-card{background:transparent;border:none;box-shadow:none;}
}

@media(max-width:480px){
  .idt-wrapper{padding:16px 12px 14px;}
  .idt-nav-isp-name{font-size:15px;padding:9px 16px;}
  .idt-nav-arrow{width:36px;height:36px;}
  .idt-title{font-size:17px;letter-spacing:-.3px;}
  .idt-question{font-size:13px;}
  .idt-badge{padding:10px 12px;font-size:10px;}
  .idt-dest-card{padding:14px 12px;}
  .idt-points li{font-size:13px;}
  .idt-dest-name{font-size:14px;}
  .idt-cta-btn{font-size:12px;padding:10px 18px;}
}

@media(max-width:360px){
  .idt-wrapper{padding:14px 10px 12px;}
  .idt-nav-isp-name{font-size:13px;padding:8px 12px;}
  .idt-nav-arrow{width:32px;height:32px;font-size:15px;}
  .idt-dest-card{padding:12px 10px;}
  .idt-badge{padding:9px 10px;font-size:9px;}
  .idt-points li{font-size:12px;}
}

/* ─── HAMBURGER / MOBILE NAV MENU ─── */
.nav-hamburger{
  display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;
  width:38px;height:38px;padding:0;background:transparent;
  border:1px solid rgba(161,0,255,.3);border-radius:10px;cursor:pointer;
  transition:background .2s,border-color .2s;flex-shrink:0;
}
.nav-hamburger:hover{background:rgba(161,0,255,.1);border-color:rgba(161,0,255,.5);}
.nav-hamburger span{
  display:block;width:18px;height:2px;background:rgba(255,255,255,.85);
  border-radius:2px;transition:transform .25s,opacity .25s;
}
.nav-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0);}
.nav-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
body.light-mode .nav-hamburger{border-color:rgba(161,0,255,.25);}
body.light-mode .nav-hamburger span{background:rgba(13,0,32,.7);}

.nav-mob-overlay{display:none;position:fixed;inset:0;background:transparent;z-index:9980;}
.nav-mob-overlay.open{display:block;}

.nav-mob-menu{
  position:fixed;top:76px;left:0;right:0;z-index:9990;
  display:flex;flex-direction:column;gap:10px;
  background:rgba(14,0,30,.97);
  padding:0 20px;
  max-height:0;overflow:hidden;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  transition:max-height .3s ease,padding .25s ease;
}
.nav-mob-menu.open{max-height:280px;padding:16px 20px 20px;}
body.light-mode .nav-mob-menu{background:rgba(255,255,255,.97);border-color:rgba(161,0,255,.15);}

.nmm-greet{
  font-size:13px;color:rgba(255,255,255,.6);
  padding-bottom:12px;border-bottom:1px solid rgba(161,0,255,.15);margin-bottom:4px;
}
.nmm-greet strong{color:#fff;}
body.light-mode .nmm-greet{color:rgba(13,0,32,.55);}
body.light-mode .nmm-greet strong{color:rgba(13,0,32,.88);}

/* ─── FULL-PAGE LOADING OVERLAY ─── */
.app-loader{
  position:fixed;inset:0;z-index:99999;
  display:flex;align-items:center;justify-content:center;
  background:#0a0016;
  transition:opacity .45s ease,visibility .45s ease;
}
body.light-mode .app-loader{background:#f5f0fa;}
.app-loader.hidden{opacity:0;visibility:hidden;pointer-events:none;}
.app-loader-inner{text-align:center;display:flex;flex-direction:column;align-items:center;}
.app-loader-spinner{
  width:36px;height:36px;
  border:3px solid rgba(161,0,255,.15);
  border-top-color:#a100ff;
  border-radius:50%;
  animation:loader-spin .7s linear infinite;
}
@keyframes loader-spin{to{transform:rotate(360deg)}}
.app-loader-text{
  margin-top:14px;font-family:var(--font);
  font-size:13px;font-weight:600;letter-spacing:.3px;
  color:rgba(255,255,255,.45);
}
body.light-mode .app-loader-text{color:rgba(13,0,32,.4);}

.nav-mob-menu .nav-txt-btn{
  width:100%;text-align:left;padding:10px 0;font-size:14px;
  border-bottom:1px solid rgba(161,0,255,.08);
}
.nav-mob-menu .nav-ai-btn{width:100%;justify-content:flex-start;border-radius:10px;}
.nav-mob-menu .theme-toggle{align-self:flex-start;display:flex;}

@media(max-width:800px){
  .nav-hamburger{display:flex;}
  .nav-greet,
  .nav-r > .nav-txt-btn,
  .nav-r > .nav-ai-btn,
  .nav-r > .theme-toggle{display:none;}
  .logo-mark img{width:32px;height:21px;border-radius:7px;}
  .logo-name .ln-main{font-size:15px;}
  .hero-btns{flex-direction:column;gap:10px;}
  .hero-btns .btn-p,
  .hero-btns .btn-s{width:100%;text-align:center;}
}

@media(max-width:480px){
  .nav-mob-menu{top:76px;padding:0 16px;}
  .nav-mob-menu.open{padding:14px 16px 18px;}
  .logo-mark img{width:28px;height:18px;}
  .logo-name .ln-main{font-size:13px;}
}
/* ─── NEW CONNECTION TELCO SLOTS ─── */
.nc-slot-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px;}
.nc-slot-card{background:rgba(255,255,255,.04);border:2px dashed rgba(161,0,255,.25);border-radius:16px;padding:20px;cursor:pointer;transition:all .25s;min-height:130px;display:flex;flex-direction:column;gap:8px;}
.nc-slot-card:hover{border-color:rgba(161,0,255,.5);background:rgba(161,0,255,.06);}
.nc-slot-card--selected{border:2px solid var(--p) !important;border-style:solid !important;background:rgba(161,0,255,.08);}
.nc-slot-badge{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,.4);}
.nc-slot-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:6px;text-align:center;}
.nc-slot-plus{font-size:28px;color:rgba(161,0,255,.5);font-weight:300;line-height:1;}
.nc-slot-cta{font-size:13px;color:rgba(255,255,255,.7);font-weight:600;}
.nc-slot-req{font-size:10px;color:rgba(255,255,255,.3);}
.nc-slot-filled{display:flex;flex-direction:column;gap:4px;flex:1;}
.nc-slot-isp-name{font-size:15px;font-weight:700;color:#fff;}
.nc-slot-detail{font-size:12px;color:rgba(255,255,255,.5);}
.nc-slot-lockin{font-size:11px;color:var(--p);opacity:.9;}
.nc-slot-cost{font-size:11px;color:rgba(245,158,11,.85);margin-top:3px;}
.nc-slot-edit-btn{margin-top:auto;background:transparent;border:1px solid rgba(161,0,255,.35);color:var(--p);border-radius:100px;padding:5px 14px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;align-self:flex-start;}
.nc-slot-edit-btn:hover{background:rgba(161,0,255,.1);}
@media(max-width:520px){.nc-slot-row{grid-template-columns:1fr;}}
/* ─── TELCO SELECTION MODAL ─── */
.tc-substep{margin-bottom:12px;border:1px solid rgba(161,0,255,.12);border-radius:14px;overflow:hidden;transition:opacity .2s;}
.tc-substep--locked{opacity:.4;pointer-events:none;}
.tc-substep-hdr{display:flex;align-items:center;gap:10px;padding:12px 16px;background:rgba(255,255,255,.03);}
.tc-substep--active .tc-substep-hdr{background:rgba(161,0,255,.07);}
.tc-substep-num{width:22px;height:22px;background:rgba(161,0,255,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--p);flex-shrink:0;}
.tc-substep--done .tc-substep-num{background:var(--p);color:#fff;}
.tc-substep-label{font-size:12px;font-weight:600;color:rgba(255,255,255,.7);}
.tc-substep--done .tc-substep-label{color:rgba(255,255,255,.45);}
.tc-substep-summary{font-size:12px;color:var(--p);font-weight:600;margin-left:4px;}
.tc-back-btn{margin-left:auto;font-size:11px;color:rgba(161,0,255,.8);background:transparent;border:none;cursor:pointer;padding:2px 8px;border-radius:100px;text-decoration:underline;}
.tc-back-btn:hover{color:var(--p);}
.tc-substep-body{padding:12px 16px;}
.tc-isp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.tc-isp-card{background:rgba(255,255,255,.05);border:2px solid rgba(161,0,255,.15);border-radius:12px;padding:14px 12px;text-align:center;cursor:pointer;transition:all .2s;}
.tc-isp-card:hover{border-color:rgba(161,0,255,.45);background:rgba(161,0,255,.08);}
.tc-isp-card--active{border-color:var(--p);background:rgba(161,0,255,.12);}
.tc-isp-card--disabled{opacity:.3;cursor:not-allowed;pointer-events:none;}
.tc-isp-name{font-size:13px;font-weight:700;color:#fff;}
.tc-lockin-pills{display:flex;flex-wrap:wrap;gap:10px;}
.tc-lockin-pill{background:rgba(255,255,255,.06);border:2px solid rgba(161,0,255,.18);border-radius:100px;padding:8px 18px;font-size:12px;font-weight:600;color:rgba(255,255,255,.75);cursor:pointer;transition:all .2s;white-space:nowrap;}
.tc-lockin-pill:hover{border-color:rgba(161,0,255,.45);background:rgba(161,0,255,.08);}
.tc-lockin-pill--active{border-color:var(--p);background:rgba(161,0,255,.12);color:#fff;}
.tc-eastern-note{font-size:12px;color:rgba(255,200,100,.75);padding:10px 14px;background:rgba(255,200,100,.05);border-radius:10px;border:1px solid rgba(255,200,100,.15);margin-top:6px;}
/* Light mode */
body.light-mode #tc-modal-bg .modal{background:#fff;border-color:rgba(161,0,255,.22);box-shadow:0 20px 60px rgba(42,22,78,.18);}
body.light-mode #tc-modal-bg .mh{background:linear-gradient(135deg,#f3e8ff,rgba(255,255,255,.92));border-bottom-color:rgba(161,0,255,.15);}
body.light-mode .nc-slot-card{background:rgba(161,0,255,.03);border-color:rgba(161,0,255,.2);}
body.light-mode .nc-slot-card--selected{background:rgba(161,0,255,.07);}
body.light-mode .nc-slot-isp-name{color:#1a0035;}
body.light-mode .nc-slot-detail{color:rgba(50,0,100,.55);}
body.light-mode .tc-substep{border-color:rgba(161,0,255,.15);}
body.light-mode .tc-substep-hdr{background:rgba(161,0,255,.04);}
body.light-mode .tc-substep--active .tc-substep-hdr{background:rgba(161,0,255,.08);}
body.light-mode .tc-isp-card{background:#f9f5ff;border-color:rgba(161,0,255,.15);}
body.light-mode .tc-isp-card--active{background:rgba(161,0,255,.1);border-color:var(--p);}
body.light-mode .tc-isp-name{color:#1a0035;}
body.light-mode .tc-substep-label{color:rgba(13,0,32,.6);}
body.light-mode .tc-lockin-pill{background:#f0e8ff;border-color:rgba(161,0,255,.2);color:#5a00a0;}
body.light-mode .tc-lockin-pill--active{background:rgba(161,0,255,.15);border-color:var(--p);color:#1a0035;}

/* ─── TELCO MODAL: additional light mode text fixes ─── */
body.light-mode #tc-modal-title{color:#1a0035 !important;}
body.light-mode #tc-modal-bg .mh>div>div:last-child{color:rgba(13,0,32,.45) !important;}
body.light-mode #tc-modal-slot-badge{color:var(--p) !important;}
body.light-mode .tc-substep--done .tc-substep-label{color:rgba(13,0,32,.4);}
body.light-mode .tc-substep--done .tc-substep-hdr{background:rgba(161,0,255,.03);}
body.light-mode .tc-back-btn{color:rgba(161,0,255,.75);}
body.light-mode .nc-slot-badge{color:rgba(13,0,32,.4);}
body.light-mode .nc-slot-cta{color:rgba(13,0,32,.7);}
body.light-mode .nc-slot-req{color:rgba(13,0,32,.3);}

/* ── Arc timeline done state (completed steps) ── */
.ts.done .ts-ic {
  background:linear-gradient(135deg,#00c07f,#00e09f);
  border-color:rgba(0,192,127,.5);
  box-shadow:0 0 0 6px rgba(0,192,127,.12);
}
.ts.done .ts-l { color:#00c07f; }
.ts.done .ts-sub { color:rgba(0,192,127,.7); }
body.light-mode .ts.done .ts-l { color:#059669; }
body.light-mode .ts.done .ts-sub { color:rgba(5,150,105,.7); }

/* ── Active request card — force white text in header (always-dark bg) ── */
.hc-arc-top-live { color:#fff !important; }
.hc-arc-top-live * { color:inherit; }
.hc-arc-top-live .status-pill { color:#f59e0b !important; }
body.light-mode .nc-slot-plus{color:rgba(161,0,255,.4);}

/* ─── NC INLINE TELCO SLOTS ─── */
.nc-inline-slot{padding:4px 0 10px;}
.nc-inline-hdr{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.nc-inline-divider{border:none;border-top:1px solid rgba(161,0,255,.12);margin:14px 0;}
.nc-isp-chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 2px;}
.nc-isp-chip{background:rgba(255,255,255,.05);border:2px solid rgba(161,0,255,.18);border-radius:100px;padding:8px 20px;font-size:13px;font-weight:600;color:rgba(255,255,255,.8);cursor:pointer;transition:all .2s;}
.nc-isp-chip:hover{border-color:rgba(161,0,255,.5);background:rgba(161,0,255,.1);color:#fff;}
.nc-isp-chip--disabled{opacity:.3;cursor:not-allowed;pointer-events:none;}
.nc-confirmed-tip{background:rgba(76,175,80,.08) !important;border-color:rgba(76,175,80,.25) !important;color:rgba(255,255,255,.8) !important;}
.nc-confirmed-tip strong{color:#4caf70;}
.nc-lockin-row{margin-top:14px;}
.nc-lockin-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:rgba(255,255,255,.4);margin-bottom:8px;}
/* Light mode overrides */
body.light-mode .nc-isp-chip{background:#f9f5ff;border-color:rgba(161,0,255,.2);color:#5a00a0;}
body.light-mode .nc-isp-chip:hover{background:rgba(161,0,255,.12);border-color:var(--p);color:#1a0035;}
body.light-mode .nc-confirmed-tip{background:rgba(76,175,80,.07) !important;border-color:rgba(76,175,80,.2) !important;color:rgba(13,0,32,.75) !important;}
body.light-mode .nc-confirmed-tip strong{color:#2e7d32;}
body.light-mode .nc-inline-divider{border-color:rgba(161,0,255,.1);}
body.light-mode .nc-lockin-label{color:rgba(13,0,32,.4);}

/* ─── SN Cheat Sheet — dashboard ─── */
.arc-sn-lbl{
  font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.4px;
  color:rgba(180,150,220,.6);
  margin-bottom:2px;
}
.arc-sn-val{
  font-size:13px;
  color:rgba(220,200,255,.85);
}
body.light-mode .arc-sn-lbl{
  color:rgba(128,128,128,.8);
}
body.light-mode .arc-sn-val{
  color:rgba(80,40,120,.9);
}

/* ─── Plans FAQ ─── */
.plans-toggle{display:flex;gap:6px;background:rgba(255,255,255,.05);border-radius:100px;padding:4px;margin-bottom:18px;width:fit-content;}
.plans-toggle .tog{background:transparent;border:none;border-radius:100px;color:rgba(255,255,255,.45);font-size:12px;font-weight:600;padding:8px 18px;cursor:pointer;transition:all .2s;}
.plans-toggle .tog.active{background:#fff;color:#7c3aed;}
.plans-toggle .tog:not(.active):hover{color:rgba(255,255,255,.75);background:rgba(255,255,255,.06);}
.plan-tier-label{display:inline-block;background:rgba(161,0,255,.12);color:var(--pl);border:1px solid rgba(161,0,255,.2);border-radius:20px;font-size:12px;font-weight:600;padding:4px 14px;margin-bottom:8px;margin-top:4px;}
.plan-table{width:100%;font-size:12px;border-collapse:collapse;}
.plan-table th{color:rgba(255,255,255,.4);font-weight:500;padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;white-space:nowrap;}
.plan-table td{padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.05);color:rgba(255,255,255,.75);}
.plan-table .waived{color:#059669 !important;font-weight:500;}
.isp-globe{display:inline-flex;align-items:center;font-size:11px;font-weight:600;background:rgba(14,165,233,.12);color:#38bdf8;border-radius:100px;padding:2px 10px;}
.isp-pldt{display:inline-flex;align-items:center;font-size:11px;font-weight:600;background:rgba(239,68,68,.12);color:#f87171;border-radius:100px;padding:2px 10px;}
.isp-converge{display:inline-flex;align-items:center;font-size:11px;font-weight:600;background:rgba(249,115,22,.12);color:#fb923c;border-radius:100px;padding:2px 10px;}
.isp-dito{display:inline-flex;align-items:center;font-size:11px;font-weight:600;background:rgba(220,38,38,.12);color:#fca5a5;border-radius:100px;padding:2px 10px;}
.isp-radius{display:inline-flex;align-items:center;font-size:11px;font-weight:600;background:rgba(100,116,139,.12);color:#94a3b8;border-radius:100px;padding:2px 10px;}
.isp-eastern{display:inline-flex;align-items:center;font-size:11px;font-weight:600;background:rgba(100,116,139,.12);color:#94a3b8;border-radius:100px;padding:2px 10px;}
.plans-note{display:flex;gap:9px;align-items:flex-start;background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.28);border-left:3px solid #7c3aed;border-radius:var(--r);padding:10px 14px;margin-top:14px;font-size:12px;color:rgba(220,200,255,.9);line-height:1.5;}
.plans-note-ic{font-size:14px;flex-shrink:0;line-height:1.2;margin-top:1px;}
body.light-mode .plans-toggle{background:rgba(0,0,0,.06);}
body.light-mode .plans-toggle .tog{color:rgba(0,0,0,.45);}
body.light-mode .plans-toggle .tog.active{background:#7c3aed;color:#fff;}
body.light-mode .plans-toggle .tog:not(.active):hover{color:rgba(0,0,0,.7);background:rgba(0,0,0,.04);}
body.light-mode .plan-tier-label{background:rgba(161,0,255,.08);color:#7c3aed;border-color:rgba(161,0,255,.15);}
body.light-mode .plan-table th{color:rgba(0,0,0,.4);border-bottom-color:rgba(0,0,0,.1);}
body.light-mode .plan-table td{color:rgba(0,0,0,.75);border-bottom-color:rgba(0,0,0,.06);}
body.light-mode .isp-globe{background:rgba(14,165,233,.1);color:#0284c7;}
body.light-mode .isp-pldt{background:rgba(239,68,68,.1);color:#dc2626;}
body.light-mode .isp-converge{background:rgba(249,115,22,.1);color:#ea580c;}
body.light-mode .isp-dito{background:rgba(220,38,38,.1);color:#b91c1c;}
body.light-mode .isp-radius{background:rgba(100,116,139,.1);color:#475569;}
body.light-mode .isp-eastern{background:rgba(100,116,139,.1);color:#475569;}
body.light-mode .plans-note{background:#f5f0ff;border:1px solid #ddd6fe;border-left:3px solid #7c3aed;color:#4c1d95;}

/* ── Privacy modal (footer trigger) ── */
.hc-privacy-overlay{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.75);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:24px;}
.hc-privacy-modal{background:#0f0020;border:1px solid rgba(161,0,255,.25);border-radius:20px;width:100%;max-width:800px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(0,0,0,.6);overflow:hidden;color:#fff;}
.hc-privacy-modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;background:rgba(161,0,255,.06);flex-shrink:0;}
.hc-privacy-modal-logo{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:#fff;}
.hc-privacy-modal-badge{border:1px solid rgba(161,0,255,.3);color:#a100ff;font-size:10px;font-weight:700;padding:4px 12px;border-radius:100px;letter-spacing:.5px;text-transform:uppercase;}
.hc-privacy-modal-body{flex:1;overflow-y:auto;padding:20px 24px;scrollbar-width:thin;scrollbar-color:rgba(161,0,255,.3) transparent;}
.hc-privacy-modal-body::-webkit-scrollbar{width:6px;}
.hc-privacy-modal-body::-webkit-scrollbar-thumb{background:rgba(161,0,255,.3);border-radius:3px;}
.hc-privacy-modal-body::-webkit-scrollbar-track{background:transparent;}
.hc-privacy-modal-title{font-size:18px;font-weight:800;color:#fff;margin-bottom:16px;letter-spacing:-.3px;}
.hc-privacy-modal-body p{font-size:13px;color:rgba(255,255,255,.65);line-height:1.75;margin-bottom:12px;text-indent:24px;text-align:justify;}
.hc-privacy-modal-body ul{padding-left:48px;margin-bottom:12px;}
.hc-privacy-modal-body ul li{font-size:13px;color:rgba(255,255,255,.65);line-height:1.75;}
.hc-privacy-modal-body a{color:#a100ff;text-decoration:underline;}
.hc-privacy-modal-footer{padding:16px 24px;border-top:1px solid rgba(161,0,255,.15);background:rgba(0,0,0,.2);display:flex;justify-content:flex-end;flex-shrink:0;}
.hc-privacy-modal-close{background:#A100FF;color:#fff;border:none;border-radius:12px;padding:10px 28px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s;}
.hc-privacy-modal-close:hover{background:#8800dd;}
/* Light mode overrides */
body.light-mode .hc-privacy-modal{background:#fff;color:#0d0020;}
body.light-mode .hc-privacy-modal-title{color:#0d0020;}
body.light-mode .hc-privacy-modal-body p{color:#3d2a5c;}
body.light-mode .hc-privacy-modal-body ul li{color:#3d2a5c;}
body.light-mode .hc-privacy-modal-logo{color:#0d0020;}
body.light-mode .hc-privacy-modal-footer{background:rgba(161,0,255,.04);border-top-color:rgba(161,0,255,.12);}
/* ── Subsidy pill ── */
.cl-subsidy-pill{color:rgba(255,255,255,.85) !important;}
body.light-mode .cl-subsidy-pill{color:#5a1a8a !important;}

/* ── Dashboard card light mode (matches 314) ── */
body.light-mode .hc-arc-card { background:#fff; }
body.light-mode .hc-arc-top:not(.hc-arc-top-live) { background:linear-gradient(135deg,#f3e8ff 0%,#ede0ff 50%,#f8f2ff 100%) !important; border-bottom-color:rgba(161,0,255,.12); }
body.light-mode .hc-arc-top .hc-arc-ref { color:#1a0035; }
body.light-mode .hc-arc-top .hc-arc-plan { color:#5a3c82; }
body.light-mode .hc-arc-top .hc-arc-meta-lbl { color:#7c5aa8; }
body.light-mode .hc-arc-top .hc-arc-meta-val { color:#1a0035; }
body.light-mode .arc-track { background:linear-gradient(180deg,#faf6ff,#fff); }
body.light-mode .track-lbl { color:#7c5aa8; }
body.light-mode .ts:not(:last-child)::before { background:#e8dff7; }
body.light-mode .ts.active:not(:last-child)::before { background:linear-gradient(90deg,rgba(0,192,127,.4),#e8dff7); }
body.light-mode .ts-sub { color:#9c8abf; }
body.light-mode .ts.pending .ts-l { color:#7c5aa8; }
body.light-mode .ts.pending .ts-sub { color:#9c8abf; }

body.light-mode .hc-arc-card { background:#fff !important; border-color:rgba(161,0,255,.2) !important; }
body.light-mode .hc-arc-top:not(.hc-arc-top-live) { background:linear-gradient(135deg,#f3e8ff 0%,#ede0ff 50%,#f8f2ff 100%) !important; border-bottom:1px solid rgba(161,0,255,.12) !important; }
body.light-mode .hc-arc-top .sd { background:#f59e0b !important; }
body.light-mode .arc-track { background:linear-gradient(180deg,#faf6ff,#fff) !important; }
body.light-mode .track-lbl { color:#7c5aa8 !important; }
body.light-mode .ts:not(:last-child)::before { background:#e8dff7 !important; }
body.light-mode .ts.active:not(:last-child)::before { background:linear-gradient(90deg,rgba(0,192,127,.4),#e8dff7) !important; }
body.light-mode .ts.pending .ts-l { color:#7c5aa8 !important; }
body.light-mode .ts.pending .ts-sub { color:#9c8abf !important; }
body.light-mode .hc-arc-top:not(.hc-arc-top-live) span, body.light-mode .hc-arc-top:not(.hc-arc-top-live) div { color:inherit; }
body.light-mode .hc-arc-empty-txt { color:rgba(13,0,32,.55) !important; }