/* ═══════════════════════════════════════════════════════════
   BidBegin v6 — SuperProcure-Quality Responsive Design
   Breakpoints: 360 / 480 / 640 / 768 / 900 / 1024 / 1280
═══════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root{
  --bg:#fff;--bg2:#F5F6FA;--bg3:#ECEEF5;--border:#DFE2EC;
  --primary:#1B3A6B;--bid:#2B5EA7;--accent:#0B9D6A;
  --warn:#E8870E;--danger:#D94452;
  --text:#1A2238;--text2:#4A5578;--text3:#8590A5;
  --grad:linear-gradient(135deg,#2B5EA7,#0B9D6A);
  --font:'Plus Jakarta Sans',system-ui,sans-serif;
  --sh:0 1px 6px rgba(27,58,107,.06);
  --sh-md:0 4px 20px rgba(27,58,107,.08);
  --sh-lg:0 8px 40px rgba(27,58,107,.10);
  --sh-xl:0 20px 60px rgba(27,58,107,.12);
  --r:8px;--r-lg:14px;--r-xl:20px;
  --nav-h:78px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-tap-highlight-color:transparent;scroll-padding-top:80px}
body{font-family:var(--font);color:var(--text);background:var(--bg);overflow-x:hidden;line-height:1.65;font-size:15px;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit;transition:.2s}
img{max-width:100%;display:block}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
@media(min-width:640px){.container{padding:0 28px}}
@media(min-width:1024px){.container{padding:0 40px}}

h1{font-size:clamp(1.75rem,5vw,3.2rem);font-weight:800;line-height:1.1;letter-spacing:-.03em;color:var(--primary)}
h2{font-size:clamp(1.4rem,3.5vw,2.2rem);font-weight:700;line-height:1.2;letter-spacing:-.02em;color:var(--primary)}
h3{font-size:clamp(1rem,2vw,1.15rem);font-weight:700;color:var(--text)}
h4{font-size:.95rem;font-weight:700;color:var(--text)}
p{font-size:.95rem;line-height:1.75;color:var(--text2)}

.g2,.g3,.g4,.g5{display:grid;gap:12px}
.g2{grid-template-columns:1fr}
.g3{grid-template-columns:1fr}
.g4{grid-template-columns:repeat(2,1fr)}
.g5{grid-template-columns:repeat(2,1fr)}
@media(min-width:480px){.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:640px){.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g5{grid-template-columns:repeat(5,1fr)}}
@media(min-width:768px){.g2,.g3,.g4,.g5{gap:20px}}
.flex-center{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.text-center{text-align:center}
.tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--bid);background:rgba(43,94,167,.07);padding:6px 16px;border-radius:20px;border:1px solid rgba(43,94,167,.12)}
.tag-green{color:var(--accent);background:rgba(11,157,106,.07);border-color:rgba(11,157,106,.15)}
.section-intro{max-width:580px;margin:0 auto 48px;text-align:center}
.section-intro p{margin-top:12px;font-size:1rem}
@media(min-width:768px){.section-intro{margin-bottom:60px}}
.highlight{color:var(--bid)}.hl-green{color:var(--accent)}
.grad-text{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:12px 26px;border-radius:var(--r);font-weight:600;font-size:.9rem;border:none;cursor:pointer;transition:.25s;font-family:var(--font);white-space:nowrap;min-height:46px}
.btn-primary{background:var(--bid);color:#fff;box-shadow:0 2px 12px rgba(43,94,167,.25)}
.btn-primary:hover{background:var(--primary);transform:translateY(-1px);box-shadow:0 4px 20px rgba(43,94,167,.3)}
.btn-accent{background:var(--accent);color:#fff}
.btn-accent:hover{filter:brightness(.9);transform:translateY(-1px)}
.btn-outline{background:transparent;color:var(--bid);border:1.5px solid var(--border)}
.btn-outline:hover{border-color:var(--bid);background:rgba(43,94,167,.04)}
.btn-white{background:#fff;color:var(--primary);font-weight:700;box-shadow:var(--sh-md)}
.btn-white:hover{transform:translateY(-1px);box-shadow:var(--sh-lg)}
.btn-ghost{background:transparent;color:rgba(255,255,255,.8);border:1.5px solid rgba(255,255,255,.25)}
.btn-ghost:hover{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.5)}
.btn-lg{padding:14px 32px;font-size:.95rem;border-radius:10px;min-height:52px}
.btn-sm{padding:8px 18px;font-size:.82rem;min-height:40px}
.btn-full{width:100%;justify-content:center}
@media(max-width:479px){.hero-actions .btn{width:100%}}

/* NAVBAR */
:root { --nav-h: 76px; }

.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid transparent;
  transition: border-color .25s, box-shadow .25s;
}
.navbar.scrolled {
  border-bottom-color: var(--bg3);
  box-shadow: 0 1px 20px rgba(0,0,0,.07);
}
.nav-inner {
  display: flex; align-items: center; justify-content: space-between;
  max-width: 1200px; margin: 0 auto; padding: 0 20px; height: var(--nav-h);
}
@media(min-width:640px){ .nav-inner { padding: 0 28px; } }
@media(min-width:1024px){ .nav-inner { padding: 0 40px; } }

/* Logo */
.nav-logo { display: flex; align-items: center; flex-shrink: 0; text-decoration: none; }
.nav-logo-img { height: 52px; width: auto; object-fit: contain; display: block; }
@media(min-width:768px){ .nav-logo-img { height: 60px; } }
@media(min-width:1024px){ .nav-logo-img { height: 68px; } }

/* Desktop links */
.nav-links-desktop { display: none; align-items: center; gap: 0; }
@media(min-width:900px){ .nav-links-desktop { display: flex; } }

.nav-item { position: relative; }
.nav-link {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 8px 13px; border-radius: 7px;
  font-size: .875rem; font-weight: 500; color: var(--text2);
  text-decoration: none; transition: color .15s, background .15s; white-space: nowrap;
}
.nav-link:hover, .nav-link:focus-visible { color: var(--bid); background: rgba(43,94,167,.05); outline: none; }
.nav-link.nav-active { color: var(--bid); font-weight: 600; }
.nav-chevron { width: 10px; height: 6px; flex-shrink: 0; transition: transform .22s; color: var(--text3); }
.nav-item.has-mega:hover .nav-chevron { transform: rotate(180deg); color: var(--bid); }

/* Desktop right actions */
.nav-actions-right { display: flex; align-items: center; gap: 8px; }
.nav-btn-login {
  display: none; padding: 8px 14px; border-radius: 7px;
  font-size: .875rem; font-weight: 600; color: var(--text2);
  text-decoration: none; transition: .15s; white-space: nowrap;
}
.nav-btn-login:hover { color: var(--bid); background: var(--bg2); }
@media(min-width:900px){ .nav-btn-login { display: block; } }

.nav-btn-demo {
  display: none; align-items: center; padding: 9px 20px; border-radius: 8px;
  font-size: .875rem; font-weight: 700; color: #fff;
  background: var(--bid); text-decoration: none;
  box-shadow: 0 2px 10px rgba(43,94,167,.3); transition: .2s; white-space: nowrap;
}
.nav-btn-demo:hover { background: var(--primary); transform: translateY(-1px); }
@media(min-width:900px){ .nav-btn-demo { display: inline-flex; } }

/* Hamburger */
.nav-hamburger {
  display: flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 42px; height: 42px; padding: 9px;
  background: none; border: 1.5px solid var(--bg3); border-radius: 8px;
  cursor: pointer; transition: border-color .15s;
}
.nav-hamburger span {
  display: block; height: 2px; background: var(--text);
  border-radius: 2px; transition: transform .28s ease, opacity .2s ease;
}
.nav-hamburger:hover { border-color: var(--bid); }
.nav-hamburger.active span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav-hamburger.active span:nth-child(2){ opacity: 0; transform: scaleX(0); }
.nav-hamburger.active span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
@media(min-width:900px){ .nav-hamburger { display: none; } }

/* ── MEGA MENU ── */
.mega-menu {
  display: none; position: absolute; top: 100%; left: 0; right: 0;
  background: #fff;
  border-top: 3px solid var(--bid);
  box-shadow: 0 12px 40px rgba(0,0,0,.1);
  z-index: 1001;
}
.mega-menu.open { display: block; animation: megaIn .18s ease; }
@keyframes megaIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
.mega-inner {
  display: flex; max-width: 1200px; margin: 0 auto;
  padding: 28px 40px; gap: 0;
}
.mega-col { flex: 1; padding: 0 24px 0 0; border-right: 1px solid var(--bg3); }
.mega-col:first-child { padding-left: 0; }
.mega-col:last-child { border-right: none; padding-right: 0; padding-left: 24px; }
.mega-highlight-col {
  flex: 0 0 230px; padding: 20px 20px 20px 20px !important;
  background: var(--bg2); border-radius: 12px;
  border-right: none; margin-left: 16px;
}
.mega-col-title {
  font-size: 11px; font-weight: 700; letter-spacing: 1.2px;
  text-transform: uppercase; color: var(--text3);
  margin: 0 0 14px; padding: 0;
}
.mega-link {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 9px 10px; border-radius: 9px; margin: 0 -10px;
  text-decoration: none; color: var(--text); transition: background .12s;
}
.mega-link:hover { background: rgba(43,94,167,.06); }
.mega-icon { font-size: 1.2rem; width: 22px; text-align: center; flex-shrink: 0; margin-top: 1px; }
.mega-link-title { font-size: .9rem; font-weight: 600; color: var(--text); line-height: 1.3; }
.mega-link-desc { font-size: .78rem; color: var(--text3); margin-top: 2px; line-height: 1.4; }
.mega-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 16px; }
.mega-stat { background: #fff; border-radius: 8px; padding: 10px 8px; text-align: center; border: 1px solid var(--border); }
.mega-stat-num { display: block; font-size: 1.1rem; font-weight: 800; color: var(--bid); }
.mega-stat-label { display: block; font-size: 10.5px; color: var(--text3); margin-top: 2px; }
.mega-cta-btn {
  display: block; text-align: center; padding: 11px 16px;
  background: var(--bid); color: #fff; border-radius: 8px;
  font-size: .875rem; font-weight: 700; text-decoration: none;
  transition: background .15s; margin-top: 4px;
}
.mega-cta-btn:hover { background: var(--primary); }
.mega-client-list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.mega-client {
  background: #fff; border: 1px solid var(--border); border-radius: 5px;
  padding: 3px 10px; font-size: 11px; font-weight: 600; color: var(--text2);
}
.mega-backdrop {
  display: none; position: fixed; inset: 0; top: var(--nav-h);
  background: rgba(0,0,0,.2); z-index: 999;
}
.mega-backdrop.open { display: block; }

/* ── MOBILE DRAWER — lives on <body> so backdrop-filter doesn't clip it ── */
.mob-overlay {
  position: fixed; inset: 0; z-index: 1049;
  background: rgba(0,0,0,.55);
  opacity: 0; visibility: hidden;
  transition: opacity .28s ease, visibility .28s ease;
}
.mob-overlay.open { opacity: 1; visibility: visible; }

.mob-drawer {
  position: fixed; top: 0; left: 0; bottom: 0;
  width: min(340px, 88vw);
  background: #fff; z-index: 1050;
  display: flex; flex-direction: column;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  transform: translateX(-100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
  box-shadow: 4px 0 28px rgba(0,0,0,.18);
}
.mob-drawer.open { transform: translateX(0); }
@media(min-width:900px){ .mob-drawer, .mob-overlay { display: none !important; } }

.mob-drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid var(--bg3);
  background: var(--bg2); flex-shrink: 0; position: sticky; top: 0; z-index: 1;
}
.mob-drawer-logo { height: 46px; width: auto; }
.mob-drawer-close {
  width: 38px; height: 38px; border-radius: 8px;
  border: 1.5px solid var(--border); background: #fff;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--text); transition: .15s;
}
.mob-drawer-close:hover { border-color: var(--bid); color: var(--bid); }

.mob-drawer-actions {
  padding: 14px 16px; display: flex; flex-direction: column;
  gap: 10px; border-bottom: 2px solid var(--bg3); flex-shrink: 0; background: var(--bg2);
}
.mob-btn-login {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 16px; border-radius: 10px;
  font-size: .9rem; font-weight: 700;
  border: 2px solid var(--bid); color: var(--bid);
  background: #fff; text-decoration: none; transition: .15s;
}
.mob-btn-login:hover { background: rgba(43,94,167,.05); }
.mob-btn-demo {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 16px; border-radius: 10px;
  font-size: .9rem; font-weight: 700;
  background: var(--bid); color: #fff;
  text-decoration: none; transition: .15s;
}
.mob-btn-demo:hover { background: var(--primary); }

.mob-drawer-nav { flex: 1; overflow-y: auto; }

/* Accordion */
.mob-acc-item { border-bottom: 1px solid var(--bg3); }
.mob-acc-trigger {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  padding: 15px 18px; font-size: .95rem; font-weight: 600; color: var(--text);
  background: none; border: none; cursor: pointer; text-align: left;
}
.mob-acc-trigger:hover { background: var(--bg2); color: var(--bid); }
.mob-acc-trigger.open { color: var(--bid); background: rgba(43,94,167,.04); }
.mob-acc-arrow { width: 10px; height: 6px; flex-shrink: 0; color: var(--text3); transition: transform .25s; }
.mob-acc-trigger.open .mob-acc-arrow { transform: rotate(180deg); color: var(--bid); }
.mob-acc-panel { background: var(--bg2); }
.mob-acc-panel[hidden] { display: none; }

.mob-sub-link {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 18px 12px 28px;
  font-size: .9rem; color: var(--text2);
  text-decoration: none; transition: .12s;
  border-bottom: 1px solid rgba(0,0,0,.04);
}
.mob-sub-link:last-child { border-bottom: none; }
.mob-sub-link:hover, .mob-sub-link:active { color: var(--bid); background: rgba(43,94,167,.05); }
.mob-sub-link.nav-active { color: var(--bid); font-weight: 600; }
.mob-sub-icon { font-size: 1.05rem; width: 20px; text-align: center; flex-shrink: 0; }

.mob-nav-link {
  display: block; padding: 15px 18px;
  font-size: .95rem; font-weight: 500; color: var(--text);
  text-decoration: none; border-bottom: 1px solid var(--bg3); transition: .12s;
}
.mob-nav-link:hover { color: var(--bid); background: var(--bg2); }
.mob-nav-link.nav-active { color: var(--bid); font-weight: 700; }

.mob-drawer-footer {
  padding: 16px 18px; border-top: 2px solid var(--bg3);
  background: var(--bg2); display: flex; flex-direction: column;
  gap: 10px; flex-shrink: 0;
}
.mob-footer-link {
  font-size: .875rem; font-weight: 500; color: var(--text2);
  text-decoration: none; display: flex; align-items: center; gap: 8px;
}
.mob-footer-link:hover { color: var(--bid); }
.mob-wa { color: #25D366 !important; }

/* ── MOBILE BOTTOM NAV ── */
.bottom-nav {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: #fff; border-top: 1px solid var(--bg3);
  z-index: 900; display: flex; justify-content: space-around; align-items: center;
  padding: 4px 0 calc(4px + env(safe-area-inset-bottom));
  box-shadow: 0 -2px 14px rgba(0,0,0,.06);
}
.bnav-item {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 6px 8px; font-size: 10.5px; font-weight: 600; color: var(--text3);
  text-decoration: none; transition: .12s; border-radius: 10px; min-width: 50px;
}
.bnav-item svg { width: 22px; height: 22px; stroke: var(--text3); fill: none; stroke-width: 1.8; }
.bnav-item:active { background: var(--bg2); transform: scale(.92); }
.bnav-item.active { color: var(--bid); }
.bnav-item.active svg { stroke: var(--bid); }
@media(min-width:900px){ .bottom-nav { display: none; } }

/* Body spacing */
body { padding-top: var(--nav-h); }
@media(max-width:899px){ body { padding-bottom: 62px; } }

/* ANNOUNCEMENT BAR */
.announce-bar{background:var(--primary);color:#fff;text-align:center;padding:8px 20px;font-size:12.5px;font-weight:500;letter-spacing:.3px}
.announce-bar a{color:rgba(255,255,255,.8);text-decoration:underline;text-underline-offset:2px}
.announce-bar a:hover{color:#fff}
@media(max-width:639px){.announce-bar{font-size:11.5px;padding:7px 16px}}

/* HERO */
.hero{position:relative;overflow:hidden;padding:44px 0 64px;background:linear-gradient(160deg,#F4F6FB 0%,#EBF1FA 45%,#E6F5EE 100%)}
@media(min-width:768px){.hero{padding:64px 0 88px;min-height:88vh;display:flex;align-items:center}}
.hero::before{content:'';position:absolute;top:-20%;right:-10%;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(43,94,167,.06),transparent 65%);pointer-events:none}
.hero::after{content:'';position:absolute;bottom:-10%;left:-5%;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(11,157,106,.05),transparent 65%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1fr;gap:40px;align-items:center;position:relative;z-index:1}
@media(min-width:768px){.hero-grid{grid-template-columns:1fr 1fr;gap:48px}}
@media(min-width:1024px){.hero-grid{grid-template-columns:1.1fr .9fr;gap:64px}}
.hero-badge{margin-bottom:18px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
@media(min-width:768px){.hero-badge{justify-content:flex-start}}
.hero-announce{display:inline-flex;align-items:center;gap:6px;background:rgba(232,135,14,.1);color:var(--warn);border:1px solid rgba(232,135,14,.2);padding:5px 14px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase}
.hero h1{margin-bottom:18px;text-align:center}
@media(min-width:768px){.hero h1{text-align:left}}
.hero-desc{font-size:1.05rem;color:var(--text2);margin-bottom:28px;text-align:center;line-height:1.75}
@media(min-width:768px){.hero-desc{text-align:left;margin-left:0;max-width:480px}}
@media(max-width:767px){.hero-desc{margin:0 auto 28px}}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:32px;justify-content:center}
@media(min-width:768px){.hero-actions{justify-content:flex-start}}
@media(max-width:479px){.hero-actions{flex-direction:column;align-items:stretch}}
.hero-rating{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text3);justify-content:center;flex-wrap:wrap}
@media(min-width:768px){.hero-rating{justify-content:flex-start}}
.hero-stars{color:#F5A623;letter-spacing:1px;font-size:15px}
.hero-rating strong{color:var(--text);font-weight:700}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.hero-stat{text-align:center}
.hero-stat .num{font-size:1.6rem;font-weight:800;color:var(--primary);line-height:1}
@media(min-width:768px){.hero-stat .num{font-size:2rem}}
.hero-stat .label{font-size:11.5px;color:var(--text3);margin-top:5px;font-weight:500}
.hero-visual{max-width:500px;margin:0 auto;position:relative;z-index:1}
@media(min-width:768px){.hero-visual{max-width:none;margin:0}}

/* CLIENT STRIP */
.client-strip{padding:32px 0;background:#fff;border-top:1px solid var(--bg3);border-bottom:1px solid var(--bg3)}
.client-strip-label{text-align:center;font-size:12px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:var(--text3);margin-bottom:20px}
.client-logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 16px;padding:0 20px}
@media(min-width:640px){.client-logos{gap:12px 28px}}
.client-logo{background:var(--bg2);border:1px solid var(--bg3);border-radius:8px;padding:8px 18px;font-size:12px;font-weight:700;color:var(--text3);letter-spacing:.5px;text-transform:uppercase;white-space:nowrap;transition:.2s}
.client-logo:hover{background:var(--bg);border-color:rgba(43,94,167,.25);color:var(--bid)}

/* TICKER */
.ticker{overflow:hidden;white-space:nowrap;padding:12px 0}
.ticker-inner{display:inline-flex;gap:48px;animation:ticker 35s linear infinite}
@keyframes ticker{to{transform:translateX(-50%)}}
.ticker-inner span{font-size:12.5px;font-weight:700;color:var(--text3);opacity:.35;letter-spacing:1px;text-transform:uppercase}

/* SECTIONS */
section{padding:56px 0}
@media(min-width:768px){section{padding:80px 0}}
@media(min-width:1024px){section{padding:96px 0}}
.section-gray{background:var(--bg2)}
.section-dark{background:var(--primary)}

/* FEATURE CARDS */
.feature-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:480px){.feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.feature-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}}
.feature-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:20px;transition:.3s;display:flex;gap:14px;align-items:flex-start}
@media(min-width:768px){.feature-card{padding:26px}}
.feature-card:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:rgba(43,94,167,.15)}
.feature-icon{font-size:1.4rem;flex-shrink:0;width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(43,94,167,.07)}
.feature-card h3{font-size:.98rem;margin-bottom:5px}
.feature-card p{font-size:.875rem;margin:0}

/* MODULE CARDS */
.module-cards{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:640px){.module-cards{grid-template-columns:repeat(3,1fr)}}
@media(min-width:768px){.module-cards{gap:24px}}
.module-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);padding:24px;text-align:center;transition:.3s}
@media(min-width:768px){.module-card{padding:32px}}
.module-card:hover{transform:translateY(-4px);box-shadow:var(--sh-xl);border-color:rgba(43,94,167,.2)}
.module-card .mod-icon{font-size:2.4rem;margin-bottom:12px;display:block}
.module-card h3{margin-bottom:8px}
.module-card p{font-size:.875rem;margin-bottom:16px}
.module-card .features-list{text-align:left;font-size:.84rem;color:var(--text2);list-style:none;margin-bottom:20px;border:1px solid var(--bg3);border-radius:var(--r);overflow:hidden}
.module-card .features-list li{padding:8px 12px;border-bottom:1px solid var(--bg3);display:flex;align-items:center;gap:8px}
.module-card .features-list li:last-child{border-bottom:none}
.module-card .features-list li::before{content:'';display:inline-block;width:15px;height:15px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B9D6A' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") no-repeat center/contain;flex-shrink:0}

/* INDUSTRY TABS */
.industry-tabs{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;margin-bottom:28px;scrollbar-width:none}
.industry-tabs::-webkit-scrollbar{display:none}
.industry-tab{flex-shrink:0;padding:9px 18px;border-radius:30px;font-size:.85rem;font-weight:600;color:var(--text2);background:var(--bg2);border:1px solid var(--border);cursor:pointer;transition:.2s;white-space:nowrap}
.industry-tab:hover{border-color:var(--bid);color:var(--bid)}
.industry-tab.active{background:var(--bid);color:#fff;border-color:var(--bid)}
.industry-panel{display:none}
.industry-panel.active{display:grid;grid-template-columns:1fr;gap:24px;animation:fadeIn .3s ease}
@media(min-width:768px){.industry-panel.active{grid-template-columns:1fr 1fr;align-items:start;gap:40px}}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.industry-content h3{font-size:1.25rem;margin-bottom:12px}
.industry-content p{margin-bottom:20px}
.industry-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}
@media(min-width:480px){.industry-metrics{grid-template-columns:repeat(4,1fr)}}
.metric-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 10px;text-align:center;box-shadow:var(--sh)}
.metric-num{font-size:1.4rem;font-weight:800;color:var(--bid);display:block;line-height:1}
.metric-label{font-size:11px;color:var(--text3);margin-top:4px;font-weight:500;line-height:1.3}
.industry-clients{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.industry-client-badge{background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:5px 14px;font-size:12px;font-weight:600;color:var(--text2)}

/* PRODUCT TABS */
.product-tabs{display:flex;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-bottom:2px solid var(--bg3);margin-bottom:36px}
.product-tabs::-webkit-scrollbar{display:none}
.product-tab{flex-shrink:0;padding:12px 20px;font-size:.875rem;font-weight:600;color:var(--text3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:.2s;white-space:nowrap;display:flex;align-items:center;gap:8px}
.product-tab:hover{color:var(--bid)}
.product-tab.active{color:var(--bid);border-bottom-color:var(--bid)}
.product-panel{display:none}
.product-panel.active{display:grid;grid-template-columns:1fr;gap:28px;animation:fadeIn .3s ease}
@media(min-width:768px){.product-panel.active{grid-template-columns:.9fr 1.1fr;align-items:center;gap:56px}}
.product-info h3{font-size:1.3rem;margin-bottom:12px}
.product-info p{margin-bottom:20px}
.product-feature-list{list-style:none;margin-bottom:24px}
.product-feature-list li{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid var(--bg3);font-size:.9rem;color:var(--text2)}
.product-feature-list li:last-child{border-bottom:none}
.product-feature-list .check{color:var(--accent);font-size:1.1rem;flex-shrink:0;margin-top:0}
.product-visual{background:var(--bg2);border:1px solid var(--bg3);border-radius:var(--r-xl);padding:24px;position:relative;overflow:hidden}

/* STATS BAR */
.stats-bar{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:32px 0}
@media(min-width:640px){.stats-bar{grid-template-columns:repeat(4,1fr)}}
@media(min-width:768px){.stats-bar{gap:0}}
.stat-item{text-align:center;padding:20px 12px;border-radius:var(--r-lg);background:var(--bg2)}
@media(min-width:768px){.stat-item{background:transparent;padding:8px;border-right:1px solid var(--bg3)}}
@media(min-width:768px){.stat-item:last-child{border-right:none}}
.stat-item .stat-num{font-size:1.9rem;font-weight:800;color:var(--bid);line-height:1}
@media(min-width:768px){.stat-item .stat-num{font-size:2.3rem}}
.stat-item .stat-label{font-size:12.5px;color:var(--text3);margin-top:6px;font-weight:500}

/* TRUST BADGES */
.trust-badges{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 24px;margin-top:28px}
.trust-badge{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:12px 20px;transition:.2s;box-shadow:var(--sh)}
.trust-badge:hover{box-shadow:var(--sh-md);border-color:rgba(43,94,167,.2)}
.trust-badge-icon{font-size:1.5rem;flex-shrink:0}
.trust-badge-text{font-size:12px;line-height:1.3}
.trust-badge-text strong{display:block;font-size:.875rem;color:var(--text)}
.trust-badge-text span{color:var(--text3)}
.rating-row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:28px}
.rating-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 24px;text-align:center;min-width:130px;box-shadow:var(--sh)}
.rating-stars{color:#F5A623;font-size:1.1rem;letter-spacing:2px}
.rating-num{font-size:1.5rem;font-weight:800;color:var(--text);display:block;margin:4px 0 2px}
.rating-platform{font-size:11.5px;color:var(--text3);font-weight:600}

/* STEPS */
.steps-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:640px){.steps-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.steps-grid{grid-template-columns:repeat(4,1fr);gap:0}}
.step-card{text-align:center;padding:28px 20px;position:relative}
@media(min-width:768px){
  .step-card:not(:last-child)::after{content:'→';position:absolute;right:-10px;top:48px;font-size:1.2rem;color:var(--text3);font-weight:700;z-index:1}
}
.step-num{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.3rem;font-weight:800;color:#fff;background:var(--grad);box-shadow:0 4px 16px rgba(43,94,167,.25)}
.step-card h4{margin-bottom:8px;font-size:1rem}
.step-card p{font-size:.875rem}

/* CTA */
.cta-section{text-align:center;padding:64px 20px;background:var(--primary);color:#fff;position:relative;overflow:hidden}
@media(min-width:768px){.cta-section{padding:96px 32px}}
.cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 60% 40%,rgba(43,94,167,.4),transparent 60%);pointer-events:none}
.cta-section h2{color:#fff;margin-bottom:12px;position:relative}
.cta-section p{color:rgba(255,255,255,.7);margin-bottom:28px;max-width:480px;margin-left:auto;margin-right:auto;font-size:.98rem;position:relative}
.cta-section .flex-center{position:relative}

/* FOOTER */
.footer{background:var(--primary);color:rgba(255,255,255,.6);padding:56px 0 20px}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 20px;margin-bottom:40px}
@media(min-width:768px){.footer-grid{grid-template-columns:2fr repeat(3,1fr);gap:36px}}
.footer-brand{grid-column:1/-1}
@media(min-width:768px){.footer-brand{grid-column:auto}}
.footer-logo-img{height:60px;width:auto;margin-bottom:16px;display:block;background:#fff;padding:8px 14px;border-radius:10px}
.footer-brand p{font-size:13.5px;color:rgba(255,255,255,.4);margin-top:6px;max-width:260px;line-height:1.7}
.footer-contact-links{margin-top:14px;display:flex;flex-direction:column;gap:6px}
.footer-contact-links a{color:rgba(255,255,255,.5);font-size:13px;display:flex;align-items:center;gap:7px;transition:.2s}
.footer-contact-links a:hover{color:#6BA3E0}
.footer-social{display:flex;gap:10px;margin-top:16px}
.footer-social a{width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:.95rem;transition:.2s;color:rgba(255,255,255,.7)}
.footer-social a:hover{background:rgba(255,255,255,.15);color:#fff}
.footer-col h4{color:#fff;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:14px;font-weight:700}
.footer-col a{display:block;font-size:13.5px;color:rgba(255,255,255,.45);padding:4px 0;transition:.2s}
.footer-col a:hover{color:#6BA3E0}
.footer-bottom{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:20px;border-top:1px solid rgba(255,255,255,.07);font-size:12.5px;color:rgba(255,255,255,.25);text-align:center}
@media(min-width:768px){.footer-bottom{flex-direction:row;justify-content:space-between}}
.footer-bottom a{color:rgba(255,255,255,.3);margin-left:16px;transition:.2s}
.footer-bottom a:hover{color:#6BA3E0}

/* PAGE HEADER */
.page-header{padding:calc(var(--nav-h) + 40px) 20px 44px;text-align:center;background:linear-gradient(160deg,#F4F6FB 0%,#EBF1FA 55%,#E6F5EE 100%)}
@media(min-width:768px){.page-header{padding:calc(var(--nav-h) + 52px) 32px 60px}}
.page-header .tag{margin-bottom:12px}
.page-header h1{margin-bottom:12px}
.page-header p{max-width:540px;margin:0 auto;font-size:1.05rem}

/* SPLIT */
.split-section{display:grid;grid-template-columns:1fr;gap:36px;align-items:center}
@media(min-width:768px){.split-section{grid-template-columns:1fr 1fr;gap:60px}}
@media(min-width:1024px){.split-section{gap:80px}}

/* ICON BOX */
.icon-box{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0}
.icon-box.blue{background:rgba(43,94,167,.08)}
.icon-box.green{background:rgba(11,157,106,.08)}
.icon-box.amber{background:rgba(232,135,14,.08)}

/* PRICING */
.pricing-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;background:#fff;font-size:14px;box-shadow:var(--sh)}
.pricing-table thead{background:var(--bg2)}
.pricing-table th{padding:16px 20px;font-size:12px;font-weight:700;color:var(--text2);text-align:left;letter-spacing:.5px;text-transform:uppercase;border-bottom:1px solid var(--border)}
.pricing-table th:not(:first-child){text-align:center;min-width:140px}
.pricing-table td{padding:12px 20px;color:var(--text2);border-bottom:1px solid var(--bg3)}
.pricing-table td:not(:first-child){text-align:center}
.pricing-table tr:last-child td{border-bottom:none}
.pricing-table .tick{color:var(--accent);font-weight:700;font-size:16px}
.pricing-table .dash{color:var(--text3)}
@media(max-width:767px){.pricing-table{display:none}.pricing-mobile-cards{display:block}}
@media(min-width:768px){.pricing-mobile-cards{display:none}}

/* BLOG */
.blog-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:480px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.blog-grid{grid-template-columns:repeat(3,1fr);gap:24px}}
.blog-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:.3s;display:flex;flex-direction:column}
.blog-card:hover{transform:translateY(-3px);box-shadow:var(--sh-lg)}
.blog-card .body{padding:16px;flex:1}
.blog-card .meta{font-size:11.5px;color:var(--text3);margin-bottom:6px;font-weight:600}
.blog-card h3{font-size:.95rem;margin-bottom:8px;line-height:1.4}
.blog-card p{font-size:.84rem;margin:0}

/* FORM */
.form-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:480px){.form-grid{grid-template-columns:1fr 1fr;gap:14px}}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--text2);margin-bottom:5px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 14px;background:#fff;border:1px solid var(--border);border-radius:var(--r);color:var(--text);font-family:var(--font);font-size:15px;transition:.2s;-webkit-appearance:none}
@media(max-width:767px){.form-group input,.form-group select,.form-group textarea{font-size:16px}}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--bid);box-shadow:0 0 0 3px rgba(43,94,167,.07)}
.form-group.full{grid-column:1/-1}

/* FAQ */
details{border:1px solid var(--border);border-radius:var(--r-lg);background:#fff;margin-bottom:8px;overflow:hidden}
details summary{padding:16px 20px;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-size:.95rem}
details summary::-webkit-details-marker{display:none}
details summary::after{content:'+';font-size:1.4rem;color:var(--bid);font-weight:300;transition:.2s;line-height:1}
details[open] summary::after{transform:rotate(45deg);color:var(--bid)}
details[open]{border-color:rgba(43,94,167,.2)}
details p{padding:0 20px 16px;font-size:.9rem}

/* IG CARD */
.ig-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);padding:18px;position:relative;overflow:hidden;box-shadow:var(--sh-xl)}
@media(min-width:768px){.ig-card{padding:22px}}
.ig-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--bg3);margin-bottom:14px}
.ig-brand{font-size:14px;font-weight:800;color:var(--text)}.ig-brand b{color:var(--bid)}
.ig-live{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--accent)}
.ig-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:pulse-dot 1.5s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}
.ig-badge-platform{font-size:10px;font-weight:600;color:#fff;background:var(--bid);padding:2px 8px;border-radius:4px;margin-left:4px;vertical-align:middle}
.ig-flow-label{display:flex;align-items:flex-start;gap:8px;margin:10px 0}
.ig-num{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;flex-shrink:0;margin-top:1px}
.ig-num-blue{background:var(--bid)}.ig-num-green{background:var(--accent)}.ig-num-amber{background:var(--warn)}
.ig-flow-text{font-size:12.5px;font-weight:700;color:var(--text)}
.ig-flow-sub{font-size:10.5px;color:var(--text3);margin-top:1px}
.ig-company-row{display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--bg3);border-radius:8px;padding:9px 12px;font-size:12px}
.ig-company-info{font-weight:700;color:var(--text)}
.ig-company-info small{font-weight:400;color:var(--text3);display:block;margin-top:1px}
.ig-arrow-down{text-align:center;color:var(--text3);font-size:14px;margin:7px 0}
.ig-mods{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.ig-mod{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:8px 6px;text-align:center;cursor:pointer;transition:.2s}
.ig-mod:hover,.ig-mod-active{border-color:var(--bid);background:rgba(43,94,167,.04)}
.ig-mod-icon{font-size:1.3rem;display:block;margin-bottom:3px}
.ig-mod-name{font-size:10.5px;font-weight:700;color:var(--text)}
.ig-mod-tag{font-size:9.5px;color:var(--text3);margin:2px 0}
.ig-mod-pills{display:flex;gap:3px;justify-content:center;flex-wrap:wrap;margin-top:3px}
.ig-mod-pills span{background:rgba(43,94,167,.08);color:var(--bid);font-size:8.5px;font-weight:700;padding:1px 5px;border-radius:3px}
.ig-timer{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text3);margin:8px 0}
.ig-timer-bar{flex:1;height:5px;background:var(--bg3);border-radius:3px;overflow:hidden}
.ig-timer-fill{height:100%;background:var(--grad);border-radius:3px;width:32%;transition:width .5s}
.ig-timer-text{font-weight:700;color:var(--text);min-width:30px}
.ig-bids{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.ig-bid-row{display:flex;align-items:center;gap:7px;background:var(--bg2);border:1px solid var(--bg3);border-radius:6px;padding:7px 10px;font-size:11px}
.ig-bid-l1{border-color:rgba(11,157,106,.3);background:rgba(11,157,106,.04)}
.ig-rank{font-size:10px;font-weight:800;background:var(--bg3);color:var(--text3);padding:2px 6px;border-radius:4px;flex-shrink:0}
.ig-rank-1{background:var(--accent);color:#fff}
.ig-bidder{flex:1;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ig-amount{font-weight:800;color:var(--text);white-space:nowrap}
.ig-pct{background:rgba(11,157,106,.1);color:var(--accent);padding:2px 6px;border-radius:4px;font-size:10px;font-weight:700;white-space:nowrap}
.ig-time-ago{color:var(--text3);font-size:10px;white-space:nowrap}
.ig-outcomes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0}
.ig-out{text-align:center;background:var(--bg2);border:1px solid var(--bg3);border-radius:8px;padding:8px 5px}
.ig-out-ico{font-size:1.2rem;display:block;margin-bottom:3px}
.ig-out-title{font-size:10px;font-weight:700;color:var(--text)}
.ig-out-desc{font-size:9px;color:var(--text3);margin-top:2px}
.ig-results{display:flex;align-items:stretch;background:var(--primary);border-radius:10px;overflow:hidden;margin-top:10px}
.ig-res{flex:1;text-align:center;padding:10px 5px}
.ig-res-num{font-size:16px;font-weight:800;color:#fff;display:block}
.ig-res-label{font-size:9.5px;color:rgba(255,255,255,.6);margin-top:2px;display:block}
.ig-res-div{width:1px;background:rgba(255,255,255,.1)}
.ig-notif{position:absolute;bottom:70px;left:14px;right:14px;background:var(--primary);color:#fff;font-size:11.5px;font-weight:600;border-radius:8px;padding:9px 14px;transition:.3s;opacity:0;transform:translateY(5px);z-index:10;pointer-events:none;box-shadow:var(--sh-lg)}
.ig-notif.show{opacity:1;transform:translateY(0)}
.ig-notif.hide{opacity:0;transform:translateY(-5px)}
.ig-anim{opacity:0;transform:translateX(-10px);animation:ig-in .4s ease forwards}
.ig-anim-pop{opacity:0;transform:scale(.88);animation:ig-pop .35s cubic-bezier(.34,1.56,.64,1) forwards}
@keyframes ig-in{to{opacity:1;transform:translateX(0)}}
@keyframes ig-pop{to{opacity:1;transform:scale(1)}}

/* 3D ELEMENTS */
.ig3d{perspective:900px}
.ig3d-flip{perspective:600px;height:120px;cursor:pointer}
@media(min-width:640px){.ig3d-flip{height:140px}}
.ig3d-flip-inner{position:relative;width:100%;height:100%;transition:.5s;transform-style:preserve-3d}
.ig3d-flip:hover .ig3d-flip-inner,.ig3d-flip:active .ig3d-flip-inner{transform:rotateY(180deg)}
.ig3d-flip-front,.ig3d-flip-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:var(--r-lg);border:1px solid var(--border);padding:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.ig3d-flip-front{background:#fff}.ig3d-flip-back{background:var(--bg2);transform:rotateY(180deg);font-size:12px;line-height:1.5}
.ig3d-flow{display:flex;align-items:center;gap:0;overflow-x:auto;padding:6px 0;-webkit-overflow-scrolling:touch}
.ig3d-flow-step{flex-shrink:0;background:#fff;border:1px solid var(--border);border-radius:8px;padding:9px 12px;text-align:center;position:relative;transform:rotateY(-2deg);transition:.25s;min-width:72px}
.ig3d-flow-step:hover,.ig3d-flow-step:active{transform:rotateY(0) scale(1.04);box-shadow:var(--sh-md);z-index:2}
.ig3d-flow-step .step-ico{font-size:17px;margin-bottom:3px;display:block}
.ig3d-flow-step .step-name{font-weight:700;color:var(--text);font-size:11px}
.ig3d-flow-arrow{flex-shrink:0;color:var(--bid);font-size:12px;padding:0 3px;opacity:.4}
.ig3d-orbit{position:relative;width:140px;height:140px;margin:0 auto}
@media(min-width:640px){.ig3d-orbit{width:170px;height:170px}}
.ig3d-orbit-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:var(--bid);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:11px;z-index:3;box-shadow:0 4px 16px rgba(43,94,167,.25)}
.ig3d-orbit-item{position:absolute;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:var(--sh)}
.ig3d-stat{background:#fff;border:1px solid var(--border);border-radius:10px;padding:16px;text-align:center;transform-style:preserve-3d;transition:.3s;box-shadow:0 2px 8px rgba(0,0,0,.03)}
.ig3d-stat:hover,.ig3d-stat:active{transform:translateY(-3px) rotateX(2deg);box-shadow:0 10px 24px rgba(0,0,0,.07)}
.ig3d-stat-num{font-size:22px;font-weight:800;display:block}
.ig3d-stat-label{font-size:11px;color:var(--text3);font-weight:500;margin-top:3px}
.ig3d-stat-icon{font-size:21px;margin-bottom:5px;display:block}
.ig3d-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:16px;box-shadow:var(--sh);transform-style:preserve-3d;transition:.3s}
.ig3d-card:hover{transform:rotateY(-2deg) rotateX(1deg) translateZ(8px);box-shadow:8px 8px 24px rgba(27,58,107,.08)}
.ig3d-bars{display:flex;align-items:flex-end;gap:8px;height:90px;padding:8px 0}
.ig3d-bar{flex:1;border-radius:4px 4px 0 0;position:relative;transform-origin:bottom;animation:bar-grow .7s cubic-bezier(.34,1.56,.64,1) forwards;opacity:0;transform:scaleY(0);min-width:0}
.ig3d-bar::after{content:'';position:absolute;top:0;right:-3px;width:3px;height:100%;background:rgba(0,0,0,.06);border-radius:0 3px 3px 0;transform:skewY(-3deg)}
.ig3d-bar-label{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--text3);white-space:nowrap;font-weight:600}
.ig3d-bar-val{position:absolute;top:-17px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:700;color:var(--text);white-space:nowrap}
@keyframes bar-grow{to{opacity:1;transform:scaleY(1)}}
.ig3d-timeline{position:relative;padding-left:20px}
.ig3d-timeline::before{content:'';position:absolute;left:8px;top:0;bottom:0;width:2px;background:var(--bg3)}
.ig3d-tl-item{position:relative;padding:5px 0 5px 14px;opacity:0;transform:translateX(-14px);animation:tl-in .4s ease forwards}
.ig3d-tl-item::before{content:'';position:absolute;left:-16px;top:9px;width:9px;height:9px;border-radius:50%;background:var(--bid);border:2px solid #fff;box-shadow:0 0 0 2px var(--bid);z-index:1}
.ig3d-tl-item.green::before{background:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.ig3d-tl-item.amber::before{background:var(--warn);box-shadow:0 0 0 2px var(--warn)}
@keyframes tl-in{to{opacity:1;transform:translateX(0)}}
.ig3d-tl-item:nth-child(1){animation-delay:.1s}.ig3d-tl-item:nth-child(2){animation-delay:.25s}
.ig3d-tl-item:nth-child(3){animation-delay:.4s}.ig3d-tl-item:nth-child(4){animation-delay:.55s}
.ig3d-tl-item div:first-child{font-size:13px;font-weight:700}.ig3d-tl-item div:last-child{font-size:11px;color:var(--text3)}
.ig3d-donut{width:76px;height:76px;border-radius:50%;position:relative;margin:0 auto;transform:rotateX(12deg);box-shadow:0 6px 18px rgba(0,0,0,.07)}
.ig3d-donut::after{content:'';position:absolute;inset:19px;border-radius:50%;background:#fff}
.ig3d-donut-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:var(--text);z-index:2}
.ig3d-glow-border{position:relative;border-radius:var(--r-lg);padding:16px;background:#fff;overflow:hidden}
.ig3d-glow-border::before{content:'';position:absolute;inset:-2px;background:linear-gradient(45deg,var(--bid),var(--accent),var(--warn),var(--bid));background-size:300% 300%;animation:grad-spin 3s ease infinite;border-radius:inherit;z-index:-1}
@keyframes grad-spin{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}
.ig3d-pulse{position:relative}
.ig3d-pulse::after{content:'';position:absolute;inset:-3px;border-radius:inherit;border:2px solid var(--bid);opacity:0;animation:ripple-anim 2s ease-out infinite}
@keyframes ripple-anim{0%{opacity:.3;transform:scale(1)}100%{opacity:0;transform:scale(1.06)}}
.ig3d-layers{position:relative;height:150px;perspective:600px;margin:8px 0}
.ig3d-layer{position:absolute;left:6%;right:6%;border-radius:8px;padding:9px 16px;font-size:12px;font-weight:600;border:1px solid var(--border);box-shadow:0 2px 10px rgba(0,0,0,.04);transition:.3s;cursor:pointer}
.ig3d-layer:hover,.ig3d-layer:active{transform:translateZ(18px) scale(1.01)!important}

/* CITY GRID */
.city-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:480px){.city-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:640px){.city-grid{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1024px){.city-grid{grid-template-columns:repeat(6,1fr)}}
.city-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:14px;text-align:center;transition:.2s;font-size:.875rem;font-weight:600;color:var(--text2)}
.city-card:hover{border-color:var(--bid);color:var(--bid);background:rgba(43,94,167,.03);transform:translateY(-2px);box-shadow:var(--sh)}

/* ANIMATIONS */
.fade-up{opacity:0;transform:translateY(20px);transition:all .55s cubic-bezier(.16,1,.3,1)}
.fade-up.visible{opacity:1;transform:translateY(0)}
.stagger>*{opacity:0;transform:translateY(14px);transition:all .45s cubic-bezier(.16,1,.3,1)}
.stagger.visible>*{opacity:1;transform:translateY(0)}
.stagger.visible>*:nth-child(1){transition-delay:.05s}
.stagger.visible>*:nth-child(2){transition-delay:.1s}
.stagger.visible>*:nth-child(3){transition-delay:.15s}
.stagger.visible>*:nth-child(4){transition-delay:.2s}
.stagger.visible>*:nth-child(5){transition-delay:.25s}
.stagger.visible>*:nth-child(6){transition-delay:.3s}
.float{animation:float 4.5s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ACCESSIBILITY */
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:2px solid var(--bid);outline-offset:3px;border-radius:4px}
@media(prefers-reduced-motion:reduce){
  .ticker-inner,.float,.ig3d-glow-border::before,.ig3d-pulse::after{animation:none}
  .fade-up,.stagger>*{transition:none!important;opacity:1;transform:none}
  .ig-anim,.ig-anim-pop,.ig3d-tl-item{animation:none;opacity:1;transform:none}
}

/* MISC */
.mt-sm{margin-top:10px}.mb-sm{margin-bottom:10px}
.mt-md{margin-top:20px}.mb-md{margin-bottom:20px}
.text-xs{font-size:11px}.text-sm{font-size:13px}
.divider{height:1px;background:var(--bg3);margin:32px 0}
@media(min-width:768px){.divider{margin:48px 0}}
.pg-ig-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--bg3);margin-bottom:10px;font-size:12px;font-weight:700;color:var(--text3);letter-spacing:.5px;text-transform:uppercase}
.pg-ig-live{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--accent);text-transform:none;letter-spacing:0}
.ig-notif-bar{position:absolute;bottom:0;left:0;right:0;background:var(--accent);color:#fff;font-size:12px;font-weight:600;text-align:center;padding:5px 10px;transform:translateY(100%);animation:notif-slide 6s ease 2s infinite}
@keyframes notif-slide{0%{transform:translateY(100%)}5%{transform:translateY(0)}18%{transform:translateY(0)}23%{transform:translateY(100%)}100%{transform:translateY(100%)}}
.ig-auction{background:var(--bg2);border:1px solid var(--bg3);border-radius:8px;padding:10px;margin-bottom:6px}
.ig-auction-title{font-size:11px;color:var(--text3);margin-bottom:4px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px}
.ig-auction-price{font-size:20px;font-weight:800;color:var(--text)}
.ig-auction-meta{display:flex;gap:5px;margin-top:4px;font-size:11px;color:var(--text3);flex-wrap:wrap}
.ig-auction-meta span{background:#fff;border:1px solid var(--bg3);padding:1px 6px;border-radius:3px}
.ig-progress{height:3px;background:var(--bg3);border-radius:2px;overflow:hidden;margin:5px 0}
.ig-progress-fill{height:100%;border-radius:2px;transition:width .7s}
.ig-progress-fill-blue{background:var(--grad)}.ig-progress-fill-green{background:linear-gradient(90deg,var(--accent),#3dc49a)}
.ig-container{background:var(--bg2);border:1px solid var(--bg3);border-radius:6px;padding:6px;text-align:center}
.ig-container-type{font-weight:700;color:var(--text);font-size:12px}.ig-container-detail{color:var(--text3);font-size:10px;margin-top:1px}

/* ═══ MOBILE MENU COMPONENTS ═══ */


/* Mobile dropdown expansion */
@media(max-width:899px){
  .dropdown.open>.dropdown-menu{display:block!important}
  .nav-links .dropdown-menu{position:static!important;opacity:1!important;visibility:visible!important;transform:none!important;box-shadow:none!important;border:none!important;border-radius:0!important;background:var(--bg2);padding:4px 0;margin:0}
  .nav-links .dropdown-menu a{padding:11px 28px;border-bottom:1px solid rgba(0,0,0,.04);font-size:.9rem}
  .nav-links .dropdown-menu a:hover{background:var(--bg3)}
}

/* ═══ MISSING UTILITY CLASSES — v6 PATCH ═══ */

/* --warning fix: alias for --warn */
:root { --warning: #E8870E; }

/* Animation delay helpers (d1–d6) */
.ig-anim.d1,.ig-anim-pop.d1{animation-delay:.1s}
.ig-anim.d2,.ig-anim-pop.d2{animation-delay:.25s}
.ig-anim.d3,.ig-anim-pop.d3{animation-delay:.4s}
.ig-anim.d4,.ig-anim-pop.d4{animation-delay:.55s}
.ig-anim.d5,.ig-anim-pop.d5{animation-delay:.7s}
.ig-anim.d6,.ig-anim-pop.d6{animation-delay:.85s}

/* Checklist */
.check-list{list-style:none;margin:20px 0;display:flex;flex-direction:column;gap:8px}
.check-list li{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:var(--text2);line-height:1.5}
.check-list li::before{content:'';display:inline-block;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B9D6A' stroke-width='2.5' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E") no-repeat center/contain;flex-shrink:0;margin-top:1px}

/* Data rows (about, for-transporters) */
.ig-data-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--bg3);font-size:.875rem}
.ig-data-row:last-child{border-bottom:none}
.ig-data-label{color:var(--text3);font-weight:500;font-size:.82rem;text-transform:uppercase;letter-spacing:.4px}
.ig-data-value{font-weight:700;color:var(--text)}
.ig-data-value.green{color:var(--accent)}
.ig-data-value.blue{color:var(--bid)}
.ig-data-value.amber{color:var(--warn)}

/* g-center, g-center-sm */
.g-center{max-width:560px;margin-left:auto;margin-right:auto}
.g-center-sm{max-width:440px;margin-left:auto;margin-right:auto}

/* Blog card thumbnail */
.blog-card .thumb{height:80px;display:flex;align-items:center;justify-content:center;font-size:2.5rem;border-radius:var(--r-lg) var(--r-lg) 0 0;padding:16px}
@media(min-width:768px){.blog-card .thumb{height:100px}}

/* pg-ig (platform interactive graphic wrapper) */
.pg-ig{background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);padding:18px;box-shadow:var(--sh-lg);overflow:hidden;position:relative}
@media(min-width:768px){.pg-ig{padding:22px}}

/* Announce bar — on all pages */
.announce-bar{background:var(--primary);color:#fff;text-align:center;padding:9px 20px;font-size:12.5px;font-weight:500;letter-spacing:.3px;position:relative;z-index:999}
.announce-bar a{color:rgba(255,255,255,.8);text-decoration:underline;text-underline-offset:2px}
.announce-bar a:hover{color:#fff}
@media(max-width:639px){.announce-bar{font-size:11px;padding:7px 14px}}

/* Section padding fix when announce-bar present */
body.has-announce-bar .hero{padding-top:calc(var(--nav-h) + 36px + 36px)}
@media(min-width:768px){body.has-announce-bar .hero{padding-top:calc(var(--nav-h) + 60px + 36px)}}