/* ══════════════════════════════════════
   DESIGN TOKENS — LIGHT & DARK
══════════════════════════════════════ */
:root {
  --blue:#1565C0;--blue-mid:#1976D2;--blue-light:#2196F3;--blue-pale:#E3F2FD;--blue-deep:#0D47A1;
  --gold:#FFD54F;--gold-dark:#F9A825;--orange:#FF6F00;
  --radius:8px;--radius-lg:14px;--radius-xl:20px;
  --shadow:0 1px 4px rgba(0,0,0,.07),0 4px 16px rgba(0,0,0,.05);
  --shadow-lg:0 8px 32px rgba(0,0,0,.10);
  --transition:all .22s ease;
  font-family:'Plus Jakarta Sans',sans-serif;
}
[data-theme="light"] {
  --bg:#F8F9FA;--bg2:#FFFFFF;--bg3:#EEF1F6;
  --text:#1A1A2E;--text2:#5F6368;--text3:#9AA0A6;
  --border:#E8EAED;--border2:#D2D6DC;
  --nav-bg:#1565C0;--topbar-bg:#0D47A1;
  --card-bg:#FFFFFF;--surface:#F4F6FA;
  --input-bg:#FFFFFF;--input-border:#E8EAED;
}
[data-theme="dark"] {
  --bg:#0E1117;--bg2:#161B27;--bg3:#1C2333;
  --text:#E8ECF0;--text2:#9AA8BB;--text3:#5A6478;
  --border:#2A3245;--border2:#374057;
  --nav-bg:#111827;--topbar-bg:#0A0D14;
  --card-bg:#161B27;--surface:#1C2333;
  --input-bg:#1C2333;--input-border:#2A3245;
}

/* ══ RESET ══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);line-height:1.6;font-size:15px;transition:background .3s,color .3s;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
img{max-width:100%}
button,input,select,textarea{font-family:inherit}
:focus-visible{outline:2px solid var(--blue-light);outline-offset:2px;border-radius:6px}

/* ══ TOPBAR ══ */
.topbar{background:var(--topbar-bg);color:rgba(255,255,255,.78);font-size:12.5px;padding:7px 0;transition:background .3s}
.topbar-in{max-width:1240px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px}
.topbar a{color:rgba(255,255,255,.65);margin:0 10px;transition:color .2s}
.topbar a:hover{color:#fff}

/* ══ NAV ══ */
nav{background:var(--nav-bg);position:sticky;top:0;z-index:200;box-shadow:0 2px 12px rgba(0,0,0,.2);transition:background .3s}
.nav-in{max-width:1240px;margin:0 auto;padding:0 24px;display:flex;align-items:center;height:64px;gap:0}

.logo-wrap{display:flex;align-items:center;gap:12px;margin-right:36px;flex-shrink:0;cursor:pointer}
.logo-icon{width:46px;height:46px;flex-shrink:0}
.logo-text-group{display:flex;flex-direction:column;line-height:1}
.logo-name{font-size:24px;font-weight:800;color:#fff;letter-spacing:-0.5px}
.logo-tag{font-size:9.5px;font-weight:500;color:rgba(255,255,255,.6);letter-spacing:3px;text-transform:uppercase;margin-top:1px}

.nav-links{display:flex;align-items:center;gap:2px;flex:1}
.nav-links a{color:rgba(255,255,255,.82);font-size:13.5px;font-weight:500;padding:8px 13px;border-radius:6px;transition:var(--transition);white-space:nowrap;cursor:pointer}
.nav-links a:hover,.nav-links a.act{background:rgba(255,255,255,.14);color:#fff}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:10px;position:relative}

/* Theme Toggle */
.theme-toggle{width:40px;height:22px;border-radius:11px;border:none;cursor:pointer;position:relative;transition:background .3s;flex-shrink:0;background:rgba(255,255,255,.2)}
.theme-toggle .knob{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .25s;font-size:10px;display:flex;align-items:center;justify-content:center}
[data-theme="dark"] .theme-toggle .knob{transform:translateX(18px)}
.btn-nav-outline{border:1.5px solid rgba(255,255,255,.55);color:#fff;padding:7px 16px;border-radius:var(--radius);font-size:13px;font-weight:600;background:transparent;cursor:pointer;transition:var(--transition)}
.btn-nav-outline:hover{background:rgba(255,255,255,.14);border-color:#fff}
.btn-nav-accent{background:var(--orange);color:#fff;padding:8px 18px;border-radius:var(--radius);font-size:13px;font-weight:700;border:none;cursor:pointer;transition:var(--transition)}
.btn-nav-accent:hover{background:#E65100;transform:translateY(-1px)}

/* User menu */
.user-menu{position:relative}
.user-chip{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#fff;padding:5px 12px 5px 5px;border-radius:24px;cursor:pointer;transition:var(--transition);font-size:13px;font-weight:600}
.user-chip:hover{background:rgba(255,255,255,.2)}
.user-avatar{width:26px;height:26px;border-radius:50%;background:var(--gold);color:var(--blue-deep);display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:11.5px}
.user-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-caret{opacity:.7;font-size:11px}
.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);min-width:200px;padding:6px;display:flex;flex-direction:column;z-index:210}
.user-dropdown[hidden]{display:none}
.user-dropdown{min-width:224px}
/* transparent hover-bridge across the gap so moving chip→menu doesn't close it */
.user-dropdown::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.user-dropdown button,.user-dropdown a{background:transparent;border:none;color:var(--text);text-align:left;padding:10px 12px;font-size:13.5px;border-radius:var(--radius);cursor:pointer;transition:background .15s;text-decoration:none;display:flex;align-items:center;gap:8px}
.user-dropdown button:hover,.user-dropdown a:hover{background:var(--surface)}
/* PCBWay-style profile menu */
.pd-signout{color:#ef4444 !important;font-weight:700}
.pd-divider{height:1px;background:var(--border);margin:6px 4px}
.pd-badge{margin-left:auto;display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:11px;font-weight:700}

/* Hamburger */
.hamburger{display:none;width:38px;height:38px;border:none;background:rgba(255,255,255,.1);border-radius:8px;cursor:pointer;position:relative;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:0}
.hamburger span{display:block;width:18px;height:2px;background:#fff;border-radius:2px;transition:transform .25s,opacity .25s}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobile-drawer{display:none;flex-direction:column;background:var(--nav-bg);border-top:1px solid rgba(255,255,255,.12);padding:14px 24px 18px;gap:2px}
.mobile-drawer[hidden]{display:none!important}
.mobile-drawer a{color:rgba(255,255,255,.85);padding:10px 8px;font-size:14px;border-radius:6px;font-weight:500}
.mobile-drawer a:hover{background:rgba(255,255,255,.1)}
.mobile-drawer-actions{display:flex;flex-direction:column;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1)}
.mobile-drawer-actions button{width:100%}

/* ══ ANNOUNCE ══ */
.announce{background:var(--gold);color:#7B4500;text-align:center;padding:9px 24px;font-size:13px;font-weight:600}
.announce a{color:#1565C0;text-decoration:underline}

/* ══ HERO ══ */
.hero{background:#0A0E1A;color:#fff;padding:0;overflow:hidden;position:relative}
.hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E")}
.hero-in{max-width:1240px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1fr 410px;gap:48px;align-items:start;position:relative}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:6px 16px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px}
.hero h1{font-size:46px;font-weight:800;line-height:1.12;margin-bottom:16px;letter-spacing:-1px}
.hero h1 span{color:var(--gold)}
.hero-sub{font-size:16px;color:rgba(255,255,255,.82);max-width:500px;margin-bottom:28px;line-height:1.75}
.hero-stats{display:flex;gap:36px;margin-bottom:32px;flex-wrap:wrap}
.hstat strong{display:block;font-size:28px;font-weight:800;color:var(--gold);line-height:1}
.hstat span{font-size:11.5px;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:1px;margin-top:3px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;padding-bottom:48px}
.btn-hero{background:var(--gold);color:#0D47A1;padding:14px 30px;border-radius:var(--radius);font-size:15px;font-weight:800;border:none;cursor:pointer;transition:var(--transition)}
.btn-hero:hover{background:var(--gold-dark);transform:translateY(-2px)}
.btn-hero-o{border:2px solid rgba(255,255,255,.5);color:#fff;padding:13px 26px;border-radius:var(--radius);font-size:15px;font-weight:600;background:transparent;cursor:pointer;transition:var(--transition)}
.btn-hero-o:hover{border-color:#fff;background:rgba(255,255,255,.1)}

/* ══ QUOTE CARD ══ */
.qcard{background:var(--card-bg);border-radius:var(--radius-xl);padding:28px;box-shadow:var(--shadow-lg);color:var(--text);position:relative;z-index:2;margin-bottom:-32px;transition:background .3s,box-shadow .3s}
.qcard h3{font-size:17px;font-weight:700;color:var(--blue);margin-bottom:6px}
.qcard .qsub{font-size:12px;color:var(--text3);margin-bottom:20px}
.qlabel{display:block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--text2);margin-bottom:6px}
.qrow{margin-bottom:13px}
.qrow select,.qrow input{width:100%;border:1.5px solid var(--input-border);border-radius:var(--radius);padding:10px 13px;font-size:14px;background:var(--input-bg);color:var(--text);outline:none;transition:border-color .2s;-webkit-appearance:none}
.qrow select:focus,.qrow input:focus{border-color:var(--blue-light)}
.qgrid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:13px}
.price-box{background:var(--blue);border-radius:var(--radius);padding:14px 16px;margin:16px 0;display:flex;justify-content:space-between;align-items:center}
.price-box .plabel{font-size:11px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:1px}
.price-box .psub{font-size:11px;color:rgba(255,255,255,.45);margin-top:2px}
.price-box .pval{font-size:28px;font-weight:800;color:#fff;line-height:1}
.price-box .pcurr{font-size:14px;color:rgba(255,255,255,.7)}
.btn-getquote{width:100%;background:var(--blue);color:#fff;border:none;border-radius:var(--radius);padding:13px;font-size:14.5px;font-weight:700;cursor:pointer;transition:var(--transition)}
.btn-getquote:hover{background:var(--blue-deep)}
.btn-getquote.loading,.btn-submit.loading{opacity:.7;cursor:wait;pointer-events:none}
.qnote{text-align:center;font-size:11.5px;color:var(--text3);margin-top:9px}
.quote-result{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-top:12px;font-size:13px;color:var(--text2);display:none}
.quote-result.show{display:block}
.quote-id{font-family:'DM Mono',monospace;font-size:12.5px;color:var(--blue);font-weight:600}
.quote-result-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.btn-small{background:var(--blue);color:#fff;border:none;border-radius:var(--radius);padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;transition:var(--transition)}
.btn-small:hover{background:var(--blue-deep)}
.btn-small.ghost{background:transparent;color:var(--blue);border:1.5px solid var(--blue)}
.btn-small.ghost:hover{background:var(--blue-pale);color:var(--blue-deep)}
[data-theme="dark"] .btn-small.ghost:hover{background:rgba(33,150,243,.12)}

/* ══ HERO FULL-BLEED PROMO SLIDER (whole hero slides; compact quote card floats on top) ══ */
.hero-slider{position:absolute;inset:0;overflow:hidden;z-index:1}
.hero-slider-track{position:absolute;inset:0}
.promo-slide{
  position:absolute;inset:0;
  background-image:linear-gradient(90deg, rgba(8,12,22,.9) 0%, rgba(8,12,22,.65) 40%, rgba(8,12,22,.4) 70%, rgba(8,12,22,.55) 100%), var(--bg);
  background-size:cover;background-position:center;
  display:flex;align-items:center;
  opacity:0;visibility:hidden;
  transform:scale(1.06);
  transition:opacity .8s ease, transform 7s ease, visibility .8s;
}
.promo-slide.is-active{opacity:1;visibility:visible;transform:scale(1)}
.promo-inner{max-width:1240px;margin:0 auto;padding:0 24px;width:100%}
.promo-eyebrow{
  display:inline-flex;align-items:center;background:var(--orange);color:#fff;
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:2px;
  padding:6px 15px;border-radius:20px;margin-bottom:18px;
  transform:translateY(12px);opacity:0;transition:all .6s ease .2s;
}
.promo-title{
  font-size:46px;font-weight:800;color:#fff;letter-spacing:-1.2px;line-height:1.1;
  max-width:480px;margin-bottom:14px;
  transform:translateY(16px);opacity:0;transition:all .6s ease .35s;
}
.promo-price{color:var(--gold)}
.promo-sub{
  font-size:16px;color:rgba(255,255,255,.85);max-width:440px;margin-bottom:26px;line-height:1.6;
  transform:translateY(16px);opacity:0;transition:all .6s ease .5s;
}
.promo-cta{
  background:var(--gold);color:var(--blue-deep);border:none;
  padding:14px 30px;border-radius:var(--radius);font-size:15px;font-weight:800;
  cursor:pointer;
  transform:translateY(16px);opacity:0;
  transition:transform .6s ease .65s, opacity .6s ease .65s, background .2s;
}
.promo-cta:hover{background:var(--gold-dark)}
.promo-slide.is-active .promo-eyebrow,
.promo-slide.is-active .promo-title,
.promo-slide.is-active .promo-sub,
.promo-slide.is-active .promo-cta{transform:translateY(0);opacity:1}

.promo-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);
  color:#fff;font-size:24px;line-height:1;cursor:pointer;z-index:5;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s;
}
.promo-arrow:hover{background:rgba(255,255,255,.3)}
.promo-prev{left:24px}
.promo-next{right:24px}
.promo-dots{
  position:absolute;bottom:20px;left:50%;transform:translateX(-50%);
  display:flex;gap:9px;z-index:5;
}
.promo-dot{
  width:9px;height:9px;border-radius:50%;border:none;cursor:pointer;padding:0;
  background:rgba(255,255,255,.4);transition:all .25s;
}
.promo-dot.on{background:var(--gold);width:26px;border-radius:5px}

/* Compact quote card overlaid on the slider (right side) */
.hero-content{
  position:relative;z-index:4;
  max-width:1240px;margin:0 auto;padding:6px 24px;
  min-height:0;
  display:flex;align-items:center;justify-content:flex-end;
}
.qcard.qcard-mini{
  width:336px;max-width:100%;padding:18px;margin-bottom:0;border-radius:var(--radius-lg);
}
.qcard-mini h3{font-size:15px;margin-bottom:3px}
.qcard-mini .qsub{font-size:10.5px;margin-bottom:14px}
.qcard-mini .qlabel{font-size:9.5px;margin-bottom:5px;letter-spacing:.8px}
.qcard-mini .qrow{margin-bottom:10px}
.qcard-mini .qgrid2{gap:11px;margin-bottom:10px}
.qcard-mini .qrow select,.qcard-mini .qrow input{padding:9px 11px;font-size:13px;border-radius:var(--radius)}
.qcard-mini .price-box{padding:11px 14px;margin:12px 0}
.qcard-mini .price-box .plabel{font-size:10px}
.qcard-mini .price-box .psub{font-size:10px}
.qcard-mini .price-box .pval{font-size:26px}
.qcard-mini .btn-getquote{padding:13px;font-size:14px}
.qcard-mini .qnote{font-size:11px;margin-top:10px}
.qcard-mini .quote-result{padding:12px;margin-top:10px;font-size:12.5px}

@media(max-width:960px){
  .hero{display:flex;flex-direction:column}
  .hero-slider{position:relative;height:340px;order:0}
  .hero-content{order:1;min-height:auto;padding:24px;justify-content:center;background:var(--blue-deep)}
  .qcard.qcard-mini{width:100%;max-width:460px}
  .promo-title{font-size:34px}
}
@media(max-width:720px){
  .hero-slider{height:300px}
  .promo-title{font-size:27px}
  .promo-sub{font-size:13.5px}
  .promo-arrow{width:36px;height:36px;font-size:21px}
  .promo-prev{left:10px}.promo-next{right:10px}
}
@media(max-width:420px){
  .hero-slider{height:270px}
  .promo-title{font-size:22px}
}

/* ══ ALL-IN-ONE SOLUTIONS (capabilities) ══ */
.aio{display:grid;grid-template-columns:210px 1fr 320px;gap:36px;align-items:center}
.aio-list{display:flex;flex-direction:column;gap:2px}
.aio-item{
  text-align:left;background:transparent;border:none;cursor:pointer;font-family:inherit;
  padding:13px 16px;border-radius:var(--radius);font-size:14px;font-weight:600;
  color:var(--text2);border-left:3px solid transparent;transition:var(--transition);
}
.aio-item:hover{background:var(--surface);color:var(--text)}
.aio-item.on{background:var(--blue-pale);color:var(--blue);border-left-color:var(--blue)}
[data-theme="dark"] .aio-item.on{background:rgba(33,150,243,.14);color:#90CAF9}
.aio-visual{
  background:transparent;border:none;border-radius:0;
  overflow:visible;display:flex;align-items:center;justify-content:center;
  min-height:460px;padding:0;
}
.aio-visual img{
  max-width:100%;max-height:460px;width:auto;height:auto;object-fit:contain;display:block;
  filter:drop-shadow(0 28px 38px rgba(15,30,60,.20));
  animation:aioFloat 5.5s ease-in-out infinite;
  transition:opacity .35s ease;
}
@keyframes aioFloat{
  0%,100%{transform:translateY(0) rotate(-.6deg)}
  50%{transform:translateY(-16px) rotate(.6deg)}
}
@media(prefers-reduced-motion:reduce){.aio-visual img{animation:none}}
.aio-detail{
  background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-xl);
  padding:24px;display:flex;flex-direction:column;
}
.aio-detail h3{font-size:19px;font-weight:800;color:var(--text);margin-bottom:16px}
.aio-specs{list-style:none;display:flex;flex-direction:column;gap:11px;flex:1}
.aio-specs li{font-size:13.5px;color:var(--text2);display:flex;gap:9px;align-items:flex-start;line-height:1.4}
.aio-specs li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--blue);margin-top:6px;flex-shrink:0}
.aio-foot{margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}
.aio-price{display:flex;flex-direction:column;margin-bottom:14px}
.aio-price>span:first-child{font-size:18px;font-weight:800;color:var(--orange)}
.aio-meta{font-size:12.5px;color:var(--text3);margin-top:2px}
.aio-quote{width:100%}
@media(max-width:1000px){
  .aio{grid-template-columns:200px 1fr;grid-template-areas:"list visual" "detail detail"}
  .aio-list{grid-area:list}.aio-visual{grid-area:visual}.aio-detail{grid-area:detail}
}
@media(max-width:680px){
  .aio{grid-template-columns:1fr;grid-template-areas:"list" "visual" "detail"}
  .aio-list{flex-direction:row;flex-wrap:wrap;gap:6px}
  .aio-item{border-left:none;border:1px solid var(--border);padding:8px 12px;font-size:12.5px}
  .aio-item.on{border-color:var(--blue)}
  .aio-visual{min-height:200px}
}

/* ══ HOW TO PLACE AN ORDER — step strip (compact) ══ */
#services{padding:40px 0}
#services .sec-head{margin-bottom:26px}
.anchor-offset{display:block;position:relative;top:-80px;visibility:hidden}
.order-steps{display:flex;align-items:flex-start;justify-content:space-between;gap:0;flex-wrap:wrap}
.ostep{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;flex:0 0 auto;width:152px}
.ostep-ico{
  width:48px;height:48px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1.5px solid var(--border2);color:var(--text2);background:var(--card-bg);
  transition:var(--transition);
}
.ostep-ico svg{width:22px;height:22px}
.ostep:hover .ostep-ico{border-color:var(--blue);color:var(--blue);box-shadow:var(--shadow)}
.ostep-label{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}
.ostep-desc{font-size:11.5px;color:var(--text3);line-height:1.45;margin-top:-2px}
.ostep-line{flex:1 1 auto;height:1.5px;background:var(--border);margin-top:23px;min-width:8px}
@media(max-width:860px){
  .order-steps{justify-content:center;gap:24px 16px}
  .ostep-line{display:none}
  .ostep{width:140px}
}

/* ══ SOLUTIONS / "WHAT WE DO" STRIP ══ */
.solutions{background:var(--bg);padding:40px 0;transition:background .3s}
.sol-head{display:flex;align-items:baseline;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.sol-tag{
  background:var(--blue-pale);color:var(--blue);font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:1.5px;padding:5px 14px;border-radius:20px;
}
[data-theme="dark"] .sol-tag{background:rgba(33,150,243,.15);color:#90CAF9}
.sol-title{font-size:22px;font-weight:800;color:var(--text);letter-spacing:-.3px}
.sol-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.sol-card{
  display:flex;flex-direction:column;text-align:left;padding:0;cursor:pointer;
  background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);
  overflow:hidden;transition:var(--transition);font-family:inherit;
}
.sol-card:hover{border-color:var(--blue-light);box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.sol-img{height:130px;background-size:cover;background-position:center}
.sol-body{padding:14px 16px 16px}
.sol-name{font-size:15px;font-weight:700;color:var(--text);margin-bottom:5px}
.sol-price{font-size:13px;color:var(--text2)}
.sol-price strong{color:var(--orange);font-size:15px;font-weight:800}
.sol-meta{font-size:12px;color:var(--text3);margin-top:3px}
@media(max-width:1100px){.sol-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.sol-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.sol-grid{grid-template-columns:1fr}}

/* ══ SECTION ══ */
.section{padding:64px 0;background:var(--bg);transition:background .3s}
.section.section-alt{background:var(--bg2)}
.si{max-width:1240px;margin:0 auto;padding:0 24px}
.sec-tag{display:inline-block;background:var(--blue-pale);color:var(--blue);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;padding:5px 14px;border-radius:20px;margin-bottom:12px}
[data-theme="dark"] .sec-tag{background:rgba(33,150,243,.15);color:#90CAF9}
.sec-h2{font-size:34px;font-weight:800;letter-spacing:-.5px;margin-bottom:10px;color:var(--text)}
.sec-p{font-size:15px;color:var(--text2);max-width:540px;line-height:1.75}
.sec-head{margin-bottom:44px}

/* ══ SERVICES ══ */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px}
.svc-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:24px 20px;cursor:pointer;transition:var(--transition);position:relative;overflow:hidden}
.svc-card:hover{border-color:var(--blue-light);box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.svc-card.feat{border-color:var(--blue-light);background:var(--blue-pale)}
[data-theme="dark"] .svc-card.feat{background:rgba(33,150,243,.1);border-color:#1976D2}
.svc-ico{font-size:26px;margin-bottom:12px}
.svc-card h4{font-size:15px;font-weight:700;margin-bottom:6px;color:var(--text)}
.svc-card p{font-size:13px;color:var(--text2);line-height:1.55}
.svc-badge{position:absolute;top:12px;right:12px;background:var(--orange);color:#fff;font-size:9px;font-weight:700;padding:3px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.5px}

/* ══ WHY ══ */
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.why-card{background:var(--card-bg);border-radius:var(--radius-lg);padding:26px;border:1px solid var(--border);transition:background .3s,border .3s}
.why-ico{font-size:28px;margin-bottom:12px}
.why-card h4{font-size:15px;font-weight:700;margin-bottom:8px;color:var(--text)}
.why-card p{font-size:13.5px;color:var(--text2);line-height:1.65}
.check-list{list-style:none;margin-top:12px}
.check-list li{font-size:13px;color:var(--text2);padding:4px 0;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border)}
.check-list li:last-child{border:none}
.check-list li::before{content:'✓';color:#2E7D32;font-weight:700;flex-shrink:0}

/* ══ CAPABILITIES ══ */
.cap-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.board-visual{background:var(--surface);border-radius:var(--radius-xl);padding:40px;text-align:center;border:1px solid var(--border)}
.board-art{width:200px;height:200px;margin:0 auto 28px;background:#1B5E20;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:70px;box-shadow:0 12px 40px rgba(27,94,32,.3)}
.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.spec-tile{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:14px;text-align:left;transition:background .3s}
.spec-tile .sv{font-size:22px;font-weight:800;color:var(--blue);line-height:1}
.spec-tile .sk{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:1.5px;margin-top:3px}
.cap-table{width:100%;border-collapse:collapse;font-size:13.5px;margin-top:24px}
.cap-table tr{border-bottom:1px solid var(--border)}
.cap-table tr:last-child{border:none}
.cap-table td{padding:12px 0;color:var(--text2)}
.cap-table td:last-child{font-weight:600;color:var(--text);text-align:right}

/* ══ PROCESS ══ */
.proc-section{background:var(--blue-deep);padding:64px 0;color:#fff}
.proc-section .sec-tag{background:rgba(255,255,255,.15);color:var(--gold)}
.proc-section .sec-h2{color:#fff}
.proc-section .sec-p{color:rgba(255,255,255,.7)}
.proc-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;margin-top:44px}
.proc-steps::before{content:'';position:absolute;top:35px;left:10%;right:10%;height:1px;background:rgba(255,255,255,.15)}
.pstep{text-align:center;padding:0 12px;position:relative;z-index:1}
.psdot{width:70px;height:70px;border-radius:50%;border:2px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:26px;background:rgba(255,255,255,.07);position:relative}
.psdot::after{content:attr(data-n);position:absolute;bottom:-5px;right:-5px;width:22px;height:22px;background:var(--orange);border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;color:#fff}
.pstep h4{font-size:14px;font-weight:700;margin-bottom:6px}
.pstep p{font-size:12px;color:rgba(255,255,255,.6);line-height:1.6}

/* ══ PRICING ══ */
.price-toggle{display:flex;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;font-size:13px;width:fit-content;margin-bottom:32px}
.ptbtn{padding:8px 20px;cursor:pointer;background:transparent;border:none;color:var(--text2);transition:all .2s}
.ptbtn.on{background:var(--blue);color:#fff}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcard{background:var(--card-bg);border:2px solid var(--border);border-radius:var(--radius-xl);padding:28px;transition:var(--transition);display:flex;flex-direction:column}
.pcard:hover{box-shadow:var(--shadow-lg)}
.pcard.feat{border-color:var(--blue);background:var(--blue);color:#fff}
.pcard .pe{font-size:11px;text-transform:uppercase;letter-spacing:3px;color:var(--text3);margin-bottom:7px}
.pcard.feat .pe{color:rgba(255,255,255,.5)}
.pcard .pn{font-size:24px;font-weight:800;color:var(--text);margin-bottom:6px}
.pcard.feat .pn{color:#fff}
.pcard .pd{font-size:13px;color:var(--text2);margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--border);line-height:1.6}
.pcard.feat .pd{color:rgba(255,255,255,.65);border-color:rgba(255,255,255,.2)}
.pamt{display:flex;align-items:baseline;gap:3px;margin-bottom:22px}
.pamt .cu{font-size:18px;font-weight:600;color:var(--text2)}
.pamt .am{font-size:46px;font-weight:800;color:var(--text);line-height:1}
.pamt .pr{font-size:12px;color:var(--text3)}
.pamt-custom{font-size:28px!important;color:var(--text)}
.pcard.feat .cu,.pcard.feat .am{color:#fff}
.pcard.feat .pr{color:rgba(255,255,255,.45)}
.pfeats{list-style:none;margin-bottom:24px;flex:1}
.pfeats li{display:flex;align-items:center;gap:10px;font-size:13.5px;padding:8px 0;border-bottom:1px solid var(--border);color:var(--text)}
.pcard.feat .pfeats li{border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.88)}
.pfeats li:last-child{border:none}
.fi-y{color:#2E7D32}
.fi-n{color:var(--border)}
.pcard.feat .fi-y{color:#90EAB8}
.btn-plan{width:100%;padding:12px;border-radius:var(--radius);font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;border:2px solid var(--blue);color:var(--blue);background:transparent;transition:var(--transition)}
.btn-plan:hover{background:var(--blue);color:#fff}
.btn-plan.inv{background:#fff;color:var(--blue);border-color:#fff}
.btn-plan.inv:hover{background:var(--blue-pale)}

/* ══ SELL YOUR PCB (marketplace) ══ */
.sell-top{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;margin-bottom:48px}
.sell-intro .sec-p{margin-bottom:26px}
.sell-cta{display:inline-flex;align-items:center;gap:8px}
.sell-gallery{
  display:grid;grid-template-columns:1.1fr 1fr;grid-template-rows:1fr 1fr;gap:14px;
  height:340px;overflow:hidden;
}
.sell-gallery img{
  width:100%;height:100%;min-height:0;object-fit:cover;border-radius:var(--radius-lg);
  border:1px solid var(--border);box-shadow:var(--shadow);display:block;
}
.sell-gallery .sg-a{grid-row:1 / 3}
.sell-gallery .sg-b{grid-row:1 / 2}
.sell-gallery .sg-c{grid-row:2 / 3}
.sell-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sell-step{
  background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:26px 24px;display:flex;gap:16px;align-items:flex-start;transition:var(--transition);
}
.sell-step:hover{border-color:var(--blue-light);box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.ss-num{
  flex-shrink:0;width:40px;height:40px;border-radius:50%;
  background:var(--blue);color:#fff;font-weight:800;font-size:17px;
  display:flex;align-items:center;justify-content:center;
}
.ss-body h4{font-size:16px;font-weight:700;color:var(--text);margin-bottom:7px}
.ss-body p{font-size:13.5px;color:var(--text2);line-height:1.65}
@media(max-width:900px){
  .sell-top{grid-template-columns:1fr;gap:32px}
  .sell-gallery{height:280px}
  .sell-steps{grid-template-columns:1fr}
}
@media(max-width:520px){
  .sell-gallery{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:130px 130px}
  .sell-gallery .sg-a{grid-row:1 / 3}
  .sell-cta{width:100%;justify-content:center}
}

/* ══ STATS ══ */
.stats-strip{background:var(--blue);padding:44px 0;color:#fff}
.stats-row{display:grid;grid-template-columns:repeat(5,1fr);gap:0;text-align:center}
.stat-item{padding:0 16px;border-right:1px solid rgba(255,255,255,.12)}
.stat-item:last-child{border:none}
.stat-item strong{display:block;font-size:38px;font-weight:800;color:var(--gold);line-height:1}
.stat-item span{font-size:12px;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:1.5px;margin-top:6px;display:block}

/* ══ TESTIMONIALS ══ */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.tcard{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;transition:background .3s;display:flex;flex-direction:column}
.tstars{color:#F9A825;font-size:15px;letter-spacing:2px;margin-bottom:12px}
.ttext{font-size:14px;color:var(--text);line-height:1.65;margin-bottom:18px;font-style:italic}
.tauthor{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--border);margin-top:auto}
.tavatar{width:40px;height:40px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:13px;flex-shrink:0;overflow:hidden}
.tavatar img{width:100%;height:100%;object-fit:cover;display:block}
.tname{font-weight:700;font-size:14px;color:var(--text)}
.trole{font-size:12px;color:var(--text3)}

/* ══ CONTACT ══ */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.contact-info h3{font-size:22px;font-weight:700;margin-bottom:16px;color:var(--text)}
.contact-info p{font-size:14px;color:var(--text2);line-height:1.75;margin-bottom:24px}
.cinfo-item{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
.cinfo-icon{width:40px;height:40px;background:var(--blue-pale);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
[data-theme="dark"] .cinfo-icon{background:rgba(33,150,243,.15)}
.cinfo-label{font-size:12px;color:var(--text3);text-transform:uppercase;letter-spacing:1px;margin-bottom:3px}
.cinfo-val{font-size:14px;font-weight:600;color:var(--text)}
.contact-form{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-xl);padding:32px;transition:background .3s}
.form-row{margin-bottom:16px}
.form-row label{display:block;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--text2);margin-bottom:7px}
.form-row input,.form-row select,.form-row textarea{width:100%;border:1.5px solid var(--input-border);border-radius:var(--radius);padding:11px 14px;font-size:14px;background:var(--input-bg);color:var(--text);outline:none;transition:border-color .2s;font-family:inherit;resize:vertical}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--blue-light)}
.form-row input[aria-invalid="true"],.form-row textarea[aria-invalid="true"]{border-color:#C62828}
.form-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.btn-submit{width:100%;background:var(--blue);color:#fff;border:none;border-radius:var(--radius);padding:14px;font-size:15px;font-weight:700;cursor:pointer;transition:var(--transition);margin-top:6px}
.btn-submit:hover{background:var(--blue-deep)}
.form-msg{margin-top:14px;padding:12px 16px;border-radius:var(--radius);font-size:13.5px;display:none}
.form-msg.success{background:#E8F5E9;color:#2E7D32;border:1px solid #C8E6C9;display:block}
.form-msg.error{background:#FFEBEE;color:#C62828;border:1px solid #FFCDD2;display:block}
[data-theme="dark"] .form-msg.success{background:rgba(46,125,50,.2);border-color:rgba(46,125,50,.4)}
[data-theme="dark"] .form-msg.error{background:rgba(198,40,40,.2);border-color:rgba(198,40,40,.4)}

/* ══ ORDER TRACKER ══ */
.tracker-section{background:var(--surface);padding:64px 0;transition:background .3s}
.tracker-box{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-xl);padding:32px;max-width:600px;transition:background .3s}
.tracker-form{display:flex;gap:12px;margin-bottom:0}
.tracker-form input{flex:1;border:1.5px solid var(--input-border);border-radius:var(--radius);padding:11px 16px;font-size:14px;background:var(--input-bg);color:var(--text);outline:none}
.tracker-form input:focus{border-color:var(--blue-light)}
.btn-track{background:var(--blue);color:#fff;border:none;border-radius:var(--radius);padding:11px 22px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;transition:var(--transition)}
.btn-track:hover{background:var(--blue-deep)}
.track-result{margin-top:22px;display:none}
.track-result.show{display:block}
.track-head{font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px}
.track-sub{font-size:13px;color:var(--text2);margin-bottom:16px}
.track-sub #track-status{font-weight:600;color:var(--blue)}
.track-timeline{margin-top:16px}
.tl-item{display:flex;gap:16px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--border)}
.tl-item:last-child{border:none}
.tl-dot{width:20px;height:20px;border-radius:50%;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;font-size:11px}
.tl-dot.done{background:#2E7D32;color:#fff}
.tl-dot.pending{background:var(--border);color:var(--text3)}
.tl-stage{font-size:14px;font-weight:600;color:var(--text)}
.tl-time{font-size:12px;color:var(--text3);margin-top:2px}

/* ══ WHY REMLINS (icon grid, PCBWay-style) ══ */
.why2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 32px}
.why2-card{text-align:center;display:flex;flex-direction:column;align-items:center}
.why2-ico{
  width:110px;height:110px;border-radius:50%;margin-bottom:18px;
  display:flex;align-items:center;justify-content:center;
  background:var(--blue-pale);transition:var(--transition);
}
[data-theme="dark"] .why2-ico{background:rgba(33,150,243,.12)}
.why2-ico img{width:72px;height:72px;object-fit:contain}
.why2-card:hover .why2-ico{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.why2-card h4{font-size:17px;font-weight:700;color:var(--text);margin-bottom:10px}
.why2-card p{font-size:13.5px;color:var(--text2);line-height:1.7;max-width:330px}
@media(max-width:860px){.why2-grid{grid-template-columns:1fr 1fr;gap:32px 24px}}
@media(max-width:520px){.why2-grid{grid-template-columns:1fr}}

/* ══ CERTS ══ */
.certs-section{padding:44px 0}
.certs-in{text-align:center}
.certs-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:var(--text3);margin-bottom:22px}
.cert-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.cert-chip{border:1px solid var(--border);background:var(--card-bg);border-radius:var(--radius);padding:10px 20px;font-size:12px;font-weight:600;color:var(--text2);letter-spacing:.3px;transition:var(--transition);cursor:pointer}
.cert-chip:hover{border-color:var(--blue);color:var(--blue)}

/* ══ CTA ══ */
.cta-section{background:linear-gradient(120deg,var(--blue-deep),var(--blue-mid));padding:64px 0;text-align:center;color:#fff}
.cta-section h2{font-size:36px;font-weight:800;margin-bottom:12px;letter-spacing:-.5px}
.cta-section p{font-size:16px;color:rgba(255,255,255,.8);max-width:500px;margin:0 auto 32px;line-height:1.75}
.cta-btns{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}

/* ══ FOOTER ══ */
footer{background:#0A0E1A;color:#9AA0A6;padding:60px 0 24px}
.footer-in{max-width:1240px;margin:0 auto;padding:0 24px}
.footer-top{display:grid;grid-template-columns:280px repeat(4,1fr);gap:40px;margin-bottom:44px}
.footer-logo{display:flex;align-items:center;gap:10px}
.footer-brand-name{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.5px}
.footer-brand p{font-size:13px;color:#5A5A6A;line-height:1.75;max-width:220px;margin-top:10px}
.fcerts{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
.fct{border:1px solid #2A2A3A;border-radius:4px;padding:4px 10px;font-size:10px;letter-spacing:1px;color:#3A3A4A}
.fcol h5{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:2.5px;color:#4A4A5A;margin-bottom:16px}
.fcol ul{list-style:none}
.fcol ul li{margin-bottom:9px}
.fcol ul li a{font-size:13px;color:#4A4A5A;transition:color .2s}
.fcol ul li a:hover{color:#fff}
/* Footer meta strip — payments, delivery, certs, socials (like PCBWay layout) */
.footer-meta{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:32px;
  padding:32px 0 28px;
  border-top:1px solid #1A1A2A;
  margin-top:8px;
}
.fmeta-col h5{
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:2.2px;
  color:#9AA0A6;margin-bottom:14px;
}
.fmeta-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fbadge{
  display:inline-flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid rgba(255,255,255,.12);
  border-radius:6px;
  height:32px;min-width:42px;padding:0 10px;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:11px;font-weight:800;letter-spacing:.4px;
  white-space:nowrap;
}
/* Branded badges — colored logo centered inside a white pill */
.fbadge.fbrand{padding:0 10px}
.fbadge.fbrand img{
  height:18px;width:auto;max-width:70px;object-fit:contain;display:block;
}

/* Certification seals — taller, since they're round/square marks not wordmarks */
.fbadge.fcert{height:46px;padding:5px 8px}
.fbadge.fcert img{
  height:34px;width:auto;max-width:80px;object-fit:contain;display:block;
}

/* Text badges — colored type on a white pill */
.fbadge.ftext{color:#1A1A2E}
.fbadge.ftext[data-brand="upi"]        {color:#1A5DAB}
.fbadge.ftext[data-brand="netbanking"] {color:#0E2A47}
.fbadge.ftext[data-brand="delhivery"]  {color:#E11531}
.fbadge.ftext[data-brand="bluedart"]   {color:#1B3A8A}
.fbadge.ftext[data-brand="maruti"]     {color:#7B1F1B}
.fbadge.ftext[data-brand="nlpost"]     {color:#FF6B00}
.fbadge.ftext[data-brand="iso"]        {color:#1565C0}
.fbadge.ftext[data-brand="reach"]      {color:#003399}
.fbadge.ftext[data-brand="ce"]         {color:#0E1117}
.fbadge.ftext[data-brand="ul"]         {color:#C8102E}
.fbadge.ftext[data-brand="rohs"]       {color:#2E7D32}
.fbadge.ftext[data-brand="iatf"]       {color:#0D2E5C}
.fbadge.ftext[data-brand="gogreen"]    {color:#1A1A2E;background:#F9A825}

/* Social icons */
.fsocials{gap:10px;align-items:center}
.fsocial{
  width:34px;height:34px;border-radius:8px;
  background:#1A1A2A;color:#9AA0A6;
  display:inline-flex;align-items:center;justify-content:center;
  transition:all .2s;
}
.fsocial svg{width:16px;height:16px}
.fsocial:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}

.fbot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px;padding-top:18px;border-top:1px solid #1A1A2A}
.fbot-links{display:flex;gap:20px}
.fbot-links a{color:#3A3A4A;transition:color .2s}
.fbot-links a:hover{color:#fff}

/* ══ TOASTS ══ */
.toast-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.toast{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;font-size:14px;color:var(--text);box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:10px;animation:slideIn .3s ease;max-width:340px;pointer-events:auto}
.toast.success{border-left:3px solid #2E7D32}
.toast.error{border-left:3px solid #C62828}
.toast.info{border-left:3px solid var(--blue-light)}
@keyframes slideIn{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}

/* ══ MODAL ══ */
.modal-root{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:20px}
.modal-root[hidden]{display:none!important}
.modal-backdrop{position:absolute;inset:0;background:rgba(8,12,22,.55);backdrop-filter:blur(3px);animation:fadeIn .2s ease}
.modal{position:relative;background:var(--card-bg);color:var(--text);border-radius:var(--radius-xl);width:100%;max-width:520px;max-height:90vh;overflow-y:auto;padding:32px;box-shadow:0 24px 80px rgba(0,0,0,.4);animation:popIn .25s ease}
.modal.modal-wide{max-width:780px}
.modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border:none;background:transparent;color:var(--text3);font-size:24px;cursor:pointer;border-radius:50%;transition:background .15s,color .15s;line-height:1}
.modal-close:hover{background:var(--surface);color:var(--text)}
.modal-title{font-size:22px;font-weight:800;color:var(--text);margin-bottom:6px;letter-spacing:-.3px}
.modal-sub{font-size:13.5px;color:var(--text2);margin-bottom:22px}
.modal-form .form-row{margin-bottom:14px}
.modal-foot{text-align:center;font-size:13px;color:var(--text2);margin-top:18px}
.modal-foot a{color:var(--blue);font-weight:600}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

/* ══ DROPZONE ══ */
.dropzone{border:2px dashed var(--border2);border-radius:var(--radius-lg);padding:24px;background:var(--surface);transition:border-color .2s,background .2s;cursor:pointer;margin-bottom:14px}
.dropzone.drag{border-color:var(--blue);background:var(--blue-pale)}
[data-theme="dark"] .dropzone.drag{background:rgba(33,150,243,.1)}
.dz-inner{text-align:center;pointer-events:none}
.dz-icon{font-size:38px;margin-bottom:8px}
.dz-title{font-size:14px;font-weight:600;color:var(--text)}
.dz-browse{color:var(--blue);text-decoration:underline;cursor:pointer}
.dz-sub{font-size:12px;color:var(--text3);margin-top:4px}
.dz-list{list-style:none;margin-top:14px;display:flex;flex-direction:column;gap:6px}
.dz-list:empty{display:none}
.dz-list li{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:8px 12px;font-size:12.5px;color:var(--text);display:flex;justify-content:space-between;gap:10px;align-items:center}
.dz-list .dz-size{color:var(--text3);font-size:11.5px}
.dz-list .dz-remove{background:none;border:none;color:var(--text3);font-size:18px;cursor:pointer;line-height:1;padding:0 4px}
.dz-list .dz-remove:hover{color:#C62828}

/* ══ DASHBOARD ══ */
.dash-tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:18px;flex-wrap:wrap}
.dash-tab{background:transparent;border:none;padding:10px 14px;font-size:13.5px;font-weight:600;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.dash-tab.on{color:var(--blue);border-bottom-color:var(--blue)}
.dash-panel{min-height:120px}
.dash-loading,.dash-empty{padding:30px 12px;text-align:center;color:var(--text3);font-size:13.5px}
.dash-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:10px}
.dash-card .dc-row1{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.dash-card .dc-id{font-family:'DM Mono',monospace;font-size:13px;font-weight:600;color:var(--blue)}
.dash-card .dc-status{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;padding:3px 10px;border-radius:20px;background:var(--blue-pale);color:var(--blue)}
[data-theme="dark"] .dash-card .dc-status{background:rgba(33,150,243,.15);color:#90CAF9}
.dash-card .dc-row2{font-size:12.5px;color:var(--text3);margin-top:4px;display:flex;gap:14px;flex-wrap:wrap}
.dash-card .dc-row3{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.dash-card select{padding:6px 10px;border-radius:6px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);font-size:12px}

.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:18px}
.admin-stats .as-tile{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px}
.admin-stats .as-num{font-size:22px;font-weight:800;color:var(--text)}
.admin-stats .as-lbl{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--text3);margin-top:2px}

/* ══ RESPONSIVE ══ */
@media(max-width:1024px){
  .nav-links{display:none}
  .hamburger{display:flex}
  .nav-in{height:60px}
}
@media(max-width:960px){
  .hero-in,.cap-grid,.contact-grid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr;gap:30px}
  .footer-meta{grid-template-columns:1fr 1fr;gap:24px}
  .proc-steps{grid-template-columns:repeat(3,1fr);gap:20px 0}
  .proc-steps::before{display:none}
  .stats-row{grid-template-columns:repeat(3,1fr)}
  .stat-item:nth-child(3){border-right:none}
  .stat-item:nth-child(n+4){border-top:1px solid rgba(255,255,255,.12);padding-top:24px}
  .pgrid{grid-template-columns:1fr 1fr}
  .qcard{margin-top:8px}
}
@media(max-width:720px){
  .footer-meta{grid-template-columns:1fr;gap:22px}
  .topbar-in{font-size:11.5px;flex-direction:column;align-items:center;text-align:center}
  .topbar-in>div:last-child{display:none}
  .hero h1{font-size:32px}
  .sec-h2{font-size:26px}
  .cta-section h2{font-size:26px}
  .hero-stats{gap:24px}
  .pgrid,.tgrid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr}
  .proc-steps{grid-template-columns:1fr 1fr;gap:24px 0}
  .stats-row{grid-template-columns:1fr 1fr}
  .stat-item:nth-child(2){border-right:none}
  .stat-item:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12);padding-top:24px}
  .stat-item:nth-child(3){border-right:1px solid rgba(255,255,255,.12)}
  .stat-item:nth-child(odd):last-child{border-right:none}
  .hero-in{padding-bottom:32px}
  .qcard{margin-bottom:0;padding:22px}
  .form-grid2{grid-template-columns:1fr}
  .tracker-form{flex-direction:column}
  .btn-track{width:100%}
  .nav-right .btn-nav-accent,.nav-right .btn-nav-outline{display:none}
  .logo-tag{display:none}
  .modal{padding:24px 20px}
  .modal-title{font-size:18px}
  .contact-form{padding:22px}
  .si{padding:0 18px}
  .section,.tracker-section,.proc-section,.cta-section,.stats-strip{padding:44px 0}
}
@media(max-width:420px){
  .hero h1{font-size:26px}
  .hero-cta button{width:100%}
  .cta-btns button{width:100%}
}

/* Discounted "deal" price: ₹now  MRP ₹mrp  (N% OFF) */
.rm-mrp{font-size:.62em;color:var(--muted,#9aa0a6);font-weight:600;margin-left:8px;white-space:nowrap}
.rm-mrp s{opacity:.85}
.rm-off{font-size:.62em;color:#f59e0b;font-weight:800;margin-left:4px;white-space:nowrap}

.tstar-off{color:var(--text3,#9AA0A6);opacity:.5}

/* ── Mobile: wide tables scroll instead of overflowing ── */
@media(max-width:760px){
  .admin-table,.es-logs table,.ac-table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
}