:root{
  --bg:#080808;--panel:#121212;--panel2:#181818;--line:#292929;
  --text:#f7f7f7;--muted:#b8b8b8;--purple:#8a2be2;--purple2:#a855f7;
  --green:#22c55e;--orange:#f59e0b;--red:#ef4444;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
.container{width:min(1120px,calc(100% - 32px));margin:auto}
.announcement-bar{background:linear-gradient(90deg,#6d28d9,#9333ea);padding:9px 16px;text-align:center;font-size:.84rem;font-weight:700;letter-spacing:.03em}
.site-header{position:sticky;top:0;z-index:50;background:rgba(8,8,8,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-container{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{text-decoration:none;font-size:1.45rem;font-weight:900;letter-spacing:.02em}
.logo span{color:var(--purple2)}
.nav-links{display:flex;align-items:center;gap:22px;list-style:none;padding:0;margin:0}
.nav-links a{text-decoration:none;color:#e8e8e8;font-size:.94rem}
.nav-links a:hover,.nav-links a.active{color:var(--purple2)}
.menu-toggle{display:none;border:1px solid var(--line);background:var(--panel);color:white;border-radius:10px;padding:8px 12px}
.hero{padding:88px 0 68px;background:
radial-gradient(circle at 80% 25%,rgba(138,43,226,.24),transparent 33%),
linear-gradient(180deg,#0a0a0a,#080808)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.eyebrow{color:var(--purple2);font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}
h1,h2,h3{line-height:1.15}
h1{font-size:clamp(2.4rem,6vw,4.6rem);margin:.25em 0}
h2{font-size:clamp(1.8rem,4vw,2.8rem);margin:0 0 16px}
.lead{font-size:1.1rem;color:var(--muted);max-width:720px}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border-radius:10px;text-decoration:none;font-weight:800;border:1px solid transparent;cursor:pointer}
.btn-primary{background:linear-gradient(135deg,var(--purple),var(--purple2));color:white}
.btn-secondary{background:transparent;border-color:#3a3a3a;color:white}
.hero-card{background:linear-gradient(145deg,#161616,#24112f);border:1px solid #44215a;border-radius:24px;padding:28px;box-shadow:0 30px 90px rgba(74,20,140,.25)}
.hero-card img{border-radius:18px}
.section{padding:72px 0}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.muted{color:var(--muted)}
.grid{display:grid;gap:24px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.card{background:linear-gradient(180deg,var(--panel),#0f0f0f);border:1px solid var(--line);border-radius:18px;padding:24px}
.card h3{margin-top:0}
.product-controls{display:grid;grid-template-columns:1fr auto;gap:16px;margin:24px 0}
.search-input{width:100%;background:var(--panel2);border:1px solid #343434;color:white;border-radius:12px;padding:14px 16px;font-size:1rem}
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.filter-btn{background:#171717;color:#eee;border:1px solid #333;padding:9px 15px;border-radius:999px;cursor:pointer}
.filter-btn.active,.filter-btn:hover{background:var(--purple);border-color:var(--purple)}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.product-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.25s}
.product-card:hover{transform:translateY(-5px);border-color:#5f2a7e;box-shadow:0 18px 50px rgba(88,28,135,.18)}
.product-card img{aspect-ratio:4/3;width:100%;object-fit:cover;background:#161616}
.product-card-body{padding:20px}
.product-card h3{margin:0 0 8px}
.product-meta{color:var(--muted);font-size:.92rem;margin-bottom:18px}
.badge{position:absolute;top:14px;right:14px;color:white;border-radius:999px;padding:6px 10px;font-size:.72rem;font-weight:800;background:var(--green)}
.badge.low{background:var(--orange)}
.badge.out{background:var(--red)}
.page-hero{padding:58px 0 30px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 75% 0,rgba(138,43,226,.18),transparent 30%)}
.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start}
.product-image{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--panel)}
.product-panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px}
label{display:block;font-weight:700;margin-bottom:8px}
select,input,textarea{font:inherit}
select,form input,form textarea{width:100%;background:#171717;border:1px solid #363636;color:white;border-radius:10px;padding:13px 14px}
form{display:grid;gap:16px;max-width:760px}
.notice{border-left:4px solid var(--purple);background:#171219;padding:18px 20px;border-radius:10px;color:#ddd}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.faq details+details{margin-top:12px}
.faq summary{cursor:pointer;font-weight:800}
.site-footer{margin-top:72px;border-top:1px solid var(--line);background:#060606}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;padding:50px 0}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li+li{margin-top:8px}
.footer-links a{text-decoration:none;color:var(--muted)}
.footer-bottom{border-top:1px solid var(--line);padding:18px 0;color:#8f8f8f;font-size:.86rem;text-align:center}
.admin-table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line)}
.admin-table th,.admin-table td{padding:12px;border-bottom:1px solid var(--line);text-align:left}
.small{font-size:.86rem}
@media(max-width:900px){
  .hero-grid,.content-grid{grid-template-columns:1fr}
  .grid-3,.product-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .menu-toggle{display:block}
  .nav-links{display:none;position:absolute;left:16px;right:16px;top:78px;background:#101010;border:1px solid var(--line);border-radius:14px;padding:16px;flex-direction:column;align-items:flex-start}
  .nav-links.open{display:flex}
  .grid-3,.product-grid,.footer-grid{grid-template-columns:1fr}
  .product-controls{grid-template-columns:1fr}
  .section{padding:52px 0}
}

.upgraded-hero{padding-top:68px}
.hero-art{padding:10px;overflow:hidden}
.hero-art img{width:100%;height:100%;min-height:360px;object-fit:cover;object-position:center}
.compact-section{padding-top:34px;padding-bottom:34px}
.product-card img{object-fit:cover;object-position:center top}
@media(max-width:720px){.hero-art img{min-height:240px}.upgraded-hero{padding-top:48px}}

/* JAB Innovations final polish */
:focus-visible{outline:3px solid rgba(168,85,247,.85);outline-offset:3px}
body{background:radial-gradient(circle at 50% -10%,rgba(138,43,226,.08),transparent 30%),var(--bg)}
.site-header{box-shadow:0 10px 35px rgba(0,0,0,.32)}
.logo{white-space:nowrap}
.nav-links a{position:relative;padding:8px 0}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:2px;background:linear-gradient(90deg,var(--purple),var(--purple2));transition:right .2s ease}
.nav-links a:hover::after,.nav-links a.active::after{right:0}
.hero{min-height:calc(100svh - 115px);display:flex;align-items:center}
.hero-grid{gap:42px}
.hero h1{max-width:760px;text-wrap:balance;letter-spacing:-.035em}
.hero-card{position:relative;border-color:rgba(168,85,247,.38)}
.hero-art img{aspect-ratio:16/8;min-height:0!important;border-radius:16px;object-fit:contain!important;background:#080808}
.card,.product-card,.product-panel,.product-image{box-shadow:0 15px 45px rgba(0,0,0,.18)}
.card{transition:transform .2s ease,border-color .2s ease}
.card:hover{transform:translateY(-3px);border-color:#493056}
.product-grid{align-items:stretch}
.product-card{display:flex;flex-direction:column}
.product-card img{aspect-ratio:4/5;object-fit:cover;object-position:center top;background:#0d0d0d}
.product-card-body{display:flex;flex:1;flex-direction:column}
.product-card-body .btn{margin-top:auto;width:100%}
.btn{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary:hover{box-shadow:0 12px 28px rgba(138,43,226,.34)}
.footer-links a:hover{color:var(--purple2)}
.search-input:focus,select:focus,form input:focus,form textarea:focus{border-color:var(--purple2);box-shadow:0 0 0 3px rgba(168,85,247,.12);outline:none}
@media(max-width:900px){.hero{min-height:auto}.hero-grid{gap:30px}}
@media(max-width:720px){
.announcement-bar{font-size:.72rem;padding:8px 10px}.nav-container{min-height:66px}.logo{font-size:1.18rem}
.nav-links{top:72px;padding:10px;box-shadow:0 22px 65px rgba(0,0,0,.55)}
.nav-links a{display:block;width:100%;padding:11px 8px}
.hero{padding:52px 0 42px}.hero h1{font-size:clamp(2.25rem,13vw,3.5rem)}
.hero-card{padding:7px;border-radius:18px}.hero-art img{aspect-ratio:16/9}
.actions{display:grid;grid-template-columns:1fr;gap:10px}.actions .btn{width:100%}
.section-head{align-items:flex-start;flex-direction:column}.section-head .btn{width:100%}
.product-grid{gap:18px}.product-card-body{padding:18px}.product-card img{aspect-ratio:1/1.15}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.admin-table input{background:#111;color:#fff;border:1px solid #444;border-radius:8px;padding:8px;width:100px}