
:root{
  --bg:#08090e;--bg2:#0d0f16;--panel:#12141d;--panel2:#181b25;--text:#f7f7fb;
  --muted:#a5aab8;--line:rgba(255,255,255,.09);--accent:#8b5cf6;--accent2:#2dd4bf;
  --danger:#ef4444;--success:#22c55e;--radius:18px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}
.container{width:min(1200px,calc(100% - 40px));margin:auto}.topbar{font-size:12px;text-align:center;padding:9px 18px;background:#11131a;border-bottom:1px solid var(--line);color:#d7d9e3}
.header{height:78px;display:flex;align-items:center;gap:24px;padding:0 5vw;position:sticky;top:0;z-index:30;background:rgba(8,9,14,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-family:"Space Grotesk";font-weight:700;letter-spacing:.06em;white-space:nowrap}.brand-mark{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 0 28px rgba(139,92,246,.35)}.brand b{color:#a78bfa}
.nav{display:flex;gap:20px;margin:auto;font-size:13px;color:#c8cad4}.nav a:hover,.nav a.active{color:#fff}.actions{display:flex;gap:8px}.icon-btn{border:1px solid var(--line);background:var(--panel);color:#fff;border-radius:12px;padding:9px 12px}.cart-count{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:6px;border-radius:999px;background:var(--accent);font-size:11px}.menu{display:none;background:none;border:0;color:white;font-size:24px}
.hero{min-height:620px;padding:95px 8vw 80px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:48px;background:radial-gradient(circle at 20% 20%,rgba(139,92,246,.18),transparent 31%),radial-gradient(circle at 85% 55%,rgba(45,212,191,.12),transparent 28%);overflow:hidden}
.eyebrow{font-size:11px;letter-spacing:.22em;font-weight:800;color:#a78bfa;text-transform:uppercase}.hero h1,.page-hero h1{font-family:"Space Grotesk";font-size:clamp(48px,6vw,82px);line-height:.98;letter-spacing:-.045em;margin:15px 0 22px}.hero p,.page-hero p{color:var(--muted);font-size:18px;line-height:1.7;max-width:650px}.hero-actions,.button-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;justify-content:center;align-items:center;padding:14px 20px;border-radius:13px;font-weight:700;font-size:14px;border:1px solid transparent}.btn-primary{background:linear-gradient(135deg,#7c3aed,#8b5cf6);color:white}.btn-secondary{background:rgba(255,255,255,.03);border-color:var(--line);color:white}.btn-full{width:100%}
.hero-art{height:430px;position:relative;display:grid;place-items:center}.card-shape{position:absolute;width:250px;height:350px;border-radius:24px;border:1px solid rgba(255,255,255,.16);box-shadow:0 40px 70px rgba(0,0,0,.35)}.card-a{background:linear-gradient(145deg,#6142bd,#1d2742);transform:translate(-70px,18px) rotate(-12deg)}.card-b{background:linear-gradient(145deg,#126b63,#1d2941);transform:translate(70px,18px) rotate(12deg)}.card-main{background:linear-gradient(155deg,#221c39,#10131b);transform:translateY(-10px);z-index:2;display:flex;align-items:end;padding:25px;font-family:"Space Grotesk";font-size:22px}
.section{padding:85px 0}.section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}.section-title h2{font-family:"Space Grotesk";font-size:clamp(32px,4vw,50px);letter-spacing:-.03em;margin:7px 0 0}.muted{color:var(--muted)}
.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.category{min-height:240px;border:1px solid var(--line);border-radius:22px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;background:var(--panel);transition:.25s}.category:hover{transform:translateY(-5px);border-color:rgba(167,139,250,.45)}.category .icon{font-size:38px}.category h3{font-family:"Space Grotesk";font-size:27px;margin:5px 0}.category p{font-size:13px;line-height:1.5;color:var(--muted);margin:0}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}.product-visual{height:280px;position:relative;display:grid;place-items:center}.badge{position:absolute;left:14px;top:14px;border-radius:999px;padding:7px 9px;background:rgba(8,9,13,.78);font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.mock-object{width:145px;height:205px;border-radius:14px;border:4px solid rgba(255,255,255,.55);box-shadow:0 24px 45px rgba(0,0,0,.35);display:grid;place-items:end start;padding:14px;font-family:"Space Grotesk";font-weight:700;transform:rotate(-3deg)}.product-copy{padding:17px;display:flex;flex-direction:column;gap:8px;flex:1}.product-copy small{color:#969bab}.product-copy h3{font-family:"Space Grotesk";font-size:17px;margin:0}.price-row{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px}.price{font-weight:800}.compare{text-decoration:line-through;color:#777d8d;font-size:12px;margin-left:6px}.add{border:1px solid var(--line);background:#1a1d27;color:white;border-radius:10px;padding:8px 12px}.add:hover{background:#252938}
.art-purple{background:linear-gradient(145deg,#3c1d60,#1d2d46)}.art-orange{background:linear-gradient(145deg,#6f2b13,#452222)}.art-teal{background:linear-gradient(145deg,#153d39,#172b40)}.art-pink{background:linear-gradient(145deg,#5c2146,#36213f)}.art-violet{background:linear-gradient(145deg,#3a2660,#23294a)}.art-blue{background:linear-gradient(145deg,#18354a,#242841)}.art-silver{background:linear-gradient(145deg,#48505f,#232833)}.art-green{background:linear-gradient(145deg,#1f4b3c,#22323f)}.art-cyan{background:linear-gradient(145deg,#174958,#213245)}.art-gold{background:linear-gradient(145deg,#66521d,#3b2e21)}.art-indigo{background:linear-gradient(145deg,#273d79,#252744)}.art-red{background:linear-gradient(145deg,#5e2428,#2f2638)}
.page-hero{padding:75px 0 45px}.page-hero h1{font-size:clamp(44px,5vw,68px)}.page-hero p{font-size:16px}
.shop-layout{display:grid;grid-template-columns:240px 1fr;gap:28px;padding-bottom:90px}.filters{border:1px solid var(--line);border-radius:18px;padding:20px;background:var(--panel);align-self:start;position:sticky;top:100px}.filters h3{font-family:"Space Grotesk";margin-top:0}.filter-group{margin:18px 0}.filter-group label{display:block;font-size:12px;color:var(--muted);margin-bottom:7px}.filter-group select,.filter-group input{width:100%;background:#0b0d12;color:#fff;border:1px solid var(--line);border-radius:10px;padding:11px}
.shop-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.search-input{flex:1;max-width:420px;background:#0b0d12;color:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.product-page{display:grid;grid-template-columns:1fr 1fr;gap:55px;padding:65px 0 90px}.product-large{min-height:570px;border-radius:26px;display:grid;place-items:center;position:relative}.product-large .mock-object{width:240px;height:340px;font-size:23px}.product-detail h1{font-family:"Space Grotesk";font-size:clamp(36px,4vw,56px);line-height:1.05;margin:10px 0 15px}.product-detail .detail-price{font-size:26px;font-weight:800;margin:18px 0}.stock{font-size:13px}.in-stock{color:#7dd3a7}.low-stock{color:#fbbf24}.detail-description{color:var(--muted);line-height:1.75}.detail-list{padding-left:20px;color:#c8ccd7;line-height:1.8}.qty-row{display:flex;gap:10px;margin:20px 0}.qty-row input{width:80px;background:#0b0d12;color:#fff;border:1px solid var(--line);border-radius:10px;padding:12px}
.cart-wrap{padding:60px 0 95px}.cart-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:28px}.cart-items,.summary{border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:22px}.cart-item{display:grid;grid-template-columns:90px 1fr auto;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}.cart-thumb{width:90px;height:110px;border-radius:12px}.cart-item h3{font-family:"Space Grotesk";font-size:16px;margin:0 0 5px}.cart-item small{color:var(--muted)}.cart-item input{width:64px;background:#0b0d12;color:white;border:1px solid var(--line);border-radius:9px;padding:8px}.remove{background:none;border:0;color:#fca5a5;padding:0}.summary h3{font-family:"Space Grotesk";margin-top:0}.sum-row{display:flex;justify-content:space-between;padding:10px 0;color:#c9ccd6}.sum-row.total{border-top:1px solid var(--line);margin-top:10px;padding-top:18px;color:white;font-size:20px;font-weight:800}
.checkout-grid{display:grid;grid-template-columns:1fr .7fr;gap:30px;padding:55px 0 90px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:24px}.panel h2,.panel h3{font-family:"Space Grotesk";margin-top:0}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{margin-bottom:14px}.field label{display:block;color:var(--muted);font-size:12px;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;background:#0b0d12;color:white;border:1px solid var(--line);border-radius:10px;padding:12px}.field.full{grid-column:1/-1}.notice{border:1px solid rgba(139,92,246,.35);background:rgba(139,92,246,.09);border-radius:12px;padding:14px;color:#d7d0ff;font-size:13px;line-height:1.55}
.success{padding:100px 0;text-align:center}.success-icon{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:rgba(34,197,94,.15);color:#86efac;font-size:32px;margin:0 auto 20px}.success h1{font-family:"Space Grotesk";font-size:48px}.success p{color:var(--muted)}
footer{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding:60px 8vw;background:#07080c;border-top:1px solid var(--line)}footer h4{font-size:13px;margin-top:0}footer p,footer a{font-size:12px;color:#979cab}footer>div:not(:first-child){display:flex;flex-direction:column;gap:10px}
.toast{position:fixed;right:22px;bottom:22px;background:#fff;color:#111;padding:12px 16px;border-radius:12px;font-size:13px;font-weight:700;transform:translateY(80px);opacity:0;transition:.25s;z-index:50}.toast.show{transform:translateY(0);opacity:1}
.empty{padding:50px 20px;text-align:center;border:1px dashed var(--line);border-radius:18px;color:var(--muted)}
@media(max-width:1050px){.nav{display:none}.menu{display:block;margin-left:auto}.header.open .nav{display:flex;position:absolute;top:78px;left:0;right:0;background:#0d0f16;border-bottom:1px solid var(--line);padding:20px 5vw;flex-direction:column;align-items:flex-start}.hero{grid-template-columns:1fr}.category-grid,.product-grid{grid-template-columns:repeat(2,1fr)}.shop-layout{grid-template-columns:1fr}.filters{position:static}.product-page,.cart-grid,.checkout-grid{grid-template-columns:1fr}}
@media(max-width:680px){.container{width:min(100% - 28px,1200px)}.header{padding:0 14px}.actions .icon-btn:first-child{display:none}.hero{padding:65px 18px}.hero-art{height:360px;transform:scale(.85)}.category-grid,.product-grid,.field-grid{grid-template-columns:1fr}.section{padding:65px 0}.page-hero{padding-top:55px}.product-large{min-height:420px}.product-large .mock-object{width:190px;height:270px}.cart-item{grid-template-columns:70px 1fr}.cart-thumb{width:70px;height:90px}.cart-item>div:last-child{grid-column:2}.shop-toolbar{align-items:stretch;flex-direction:column}.search-input{max-width:none}footer{grid-template-columns:1fr 1fr;padding:45px 20px}footer>div:first-child{grid-column:1/-1}}
