:root{
  --bg:#f4f7ff;
  --paper:#ffffff;
  --ink:#12142a;
  --muted:#747b9b;
  --line:#dfe5ff;
  --red:#3158ff;
  --red-dark:#7b2cff;
  --soft-red:#eef2ff;
  --shadow:0 18px 44px rgba(43,69,210,.12);
  --radius:14px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 12% 8%,rgba(49,88,255,.12),transparent 24%),radial-gradient(circle at 88% 24%,rgba(139,44,255,.11),transparent 25%),var(--bg);color:var(--ink);font-family:"Trebuchet MS","Segoe UI",Tahoma,sans-serif;direction:rtl;text-align:right;overflow-x:hidden}
body.lock{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.shell{width:min(1160px,calc(100% - 28px));margin-inline:auto}
.top-strip{height:34px;background:#111;color:#fff;font-size:.78rem}.strip-inner{height:100%;display:flex;align-items:center;justify-content:center;gap:34px;color:#d7d7d7}.topbar{position:sticky;top:0;z-index:60;height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:10px;padding:0 16px;border:1px solid var(--line);border-radius:0 0 18px 18px;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);box-shadow:0 12px 38px rgba(43,69,210,.1);transition:.24s var(--ease)}.topbar.scrolled{box-shadow:0 12px 34px rgba(20,24,30,.12)}
.brand{display:flex;align-items:center;gap:11px}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#206bff,#8b2cff);color:#fff;font-weight:1000;font-size:.8rem;box-shadow:0 10px 26px rgba(49,88,255,.32)}.brand strong{display:block;font-size:1.08rem}.brand small{display:block;color:var(--muted);font-size:.64rem;letter-spacing:.08em;direction:ltr}.main-nav{display:flex;align-items:center;gap:24px}.main-nav a{position:relative;color:#3d4248;font-size:.86rem;font-weight:900}.main-nav a:hover,.main-nav a.active{color:var(--red)}.main-nav a.active:after{content:"";position:absolute;right:0;left:0;bottom:-24px;height:3px;border-radius:9px;background:var(--red)}.nav-actions{display:flex;align-items:center;gap:10px;direction:ltr}.icon{position:relative;width:38px;height:38px;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer}.search:before{content:"";position:absolute;inset:10px 12px 12px 10px;border:2px solid #222;border-radius:50%}.search:after{content:"";position:absolute;right:9px;bottom:9px;width:8px;height:2px;background:#222;transform:rotate(45deg)}.user:before{content:"";position:absolute;top:8px;left:13px;width:8px;height:8px;border:2px solid #222;border-radius:50%}.user:after{content:"";position:absolute;left:10px;bottom:8px;width:14px;height:9px;border:2px solid #222;border-top:0;border-radius:0 0 14px 14px}.bag:before{content:"";position:absolute;left:9px;right:9px;bottom:8px;height:16px;border:2px solid #222;border-radius:5px}.bag:after{content:"";position:absolute;left:14px;top:7px;width:8px;height:7px;border:2px solid #222;border-bottom:0;border-radius:9px 9px 0 0}.bag span{position:absolute;right:-7px;top:-8px;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#3158ff,#8b2cff);color:#fff;font-size:.66rem;font-weight:1000}
.hero{position:relative;margin-top:20px;min-height:360px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:20px;padding:34px 42px;border-radius:18px;background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.35),transparent 25%),radial-gradient(circle at 82% 24%,rgba(84,244,255,.38),transparent 24%),linear-gradient(135deg,#214cff 0%,#6a2cff 48%,#a327ff 100%);overflow:hidden;box-shadow:var(--shadow)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 58%,rgba(255,255,255,.18) 58% 62%,transparent 62%),repeating-linear-gradient(90deg,rgba(255,255,255,.1) 0 1px,transparent 1px 70px)}
.hero:after{content:"";position:absolute;left:-80px;bottom:-120px;width:310px;height:310px;border-radius:50%;background:rgba(88,233,255,.22);filter:blur(8px)}.hero-copy,.hero-art{position:relative;z-index:2}.kicker{margin:0 0 10px;color:#fff;font-size:.8rem;font-weight:1000}.hero h1{margin:0;max-width:560px;color:#fff;font-size:clamp(2.1rem,4.6vw,4.8rem);line-height:1.02;letter-spacing:-.055em;text-wrap:balance}.hero p{max-width:520px;color:rgba(255,255,255,.86);line-height:1.9}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.btn,.add-cart{min-height:44px;padding:0 18px;border:0;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-weight:1000;cursor:pointer;transition:.22s var(--ease)}.primary{background:#111;color:#fff}.ghost{background:#fff;color:var(--red)}.btn:hover,.add-cart:hover{transform:translateY(-2px)}.hero-art{display:grid;place-items:center}.hero-art img{width:min(94%,470px);max-height:330px;object-fit:contain;filter:drop-shadow(0 30px 28px rgba(0,0,0,.22));animation:float 5s ease-in-out infinite}
.promo-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.promo-card{position:relative;min-height:150px;display:flex;flex-direction:column;justify-content:center;padding:24px;border-radius:12px;background:radial-gradient(circle at 18% 28%,rgba(91,238,255,.42),transparent 28%),linear-gradient(135deg,#1d63ff,#6d2cff);color:#fff;overflow:hidden;box-shadow:var(--shadow)}.promo-card:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 50%,rgba(255,255,255,.16) 51%,transparent 56%)}.promo-card.alt{background:radial-gradient(circle at 20% 25%,rgba(255,255,255,.18),transparent 24%),linear-gradient(135deg,#101331,#8d2cff)}.promo-card span{font-size:1.35rem;font-weight:1000}.promo-card b{margin-top:8px;font-size:.9rem}.promo-card img{position:absolute;left:18px;bottom:-8px;width:42%;max-height:150px;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(0,0,0,.24))}.promo-card.alt img{width:45%;height:100%;object-fit:cover;border-radius:16px 0 0 16px;opacity:.86}.brand-row{height:76px;margin-top:16px;display:grid;grid-template-columns:repeat(6,1fr);align-items:center;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow);overflow:hidden}.brand-row span{height:100%;display:grid;place-items:center;border-left:1px solid var(--line);color:#8b92b3;font-weight:1000;font-size:.78rem;direction:ltr}.brand-row span:last-child{border-left:0}
.category-section,.products,.faq{padding-top:42px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-title h2{position:relative;margin:0;font-size:1.15rem}.section-title h2:after{content:"";position:absolute;right:0;bottom:-10px;width:54px;height:3px;border-radius:99px;background:var(--red)}.section-title a{color:var(--muted);font-size:.82rem;font-weight:900}.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.category{display:grid;place-items:center;gap:10px;padding:12px 8px;border-radius:14px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px rgba(20,24,30,.05);transition:.22s var(--ease)}.category:hover{transform:translateY(-3px);border-color:#c9d2ff}.category span{width:92px;height:92px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#fff 43%,#e9edff 44%,#3158ff 68%,#7b2cff 100%);box-shadow:inset 0 0 0 7px #fff,0 12px 24px rgba(49,88,255,.18);overflow:hidden}.category img{width:84%;height:84%;object-fit:contain}.category:nth-child(4) img,.category:nth-child(5) img{width:100%;height:100%;object-fit:cover}.category b{font-size:.86rem}.boxed{border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#fff,#fbfcff);box-shadow:var(--shadow);overflow:hidden}.product-grid{display:grid;grid-template-columns:repeat(4,1fr)}.product-card{min-height:360px;padding:14px;border-left:1px solid var(--line);display:flex;flex-direction:column}.product-card:last-child{border-left:0}.product-media{height:160px;display:grid;place-items:center;border-radius:10px;background:radial-gradient(circle at 50% 38%,rgba(49,88,255,.16),transparent 45%),linear-gradient(180deg,#fff,#f7f9ff)}.product-media img{max-width:92%;max-height:150px;object-fit:contain;filter:drop-shadow(0 14px 15px rgba(0,0,0,.12))}.product-card small{margin-top:12px;color:#b3b6ba;font-size:.68rem;font-weight:1000;direction:ltr;text-align:right}.product-card h3{margin:8px 0 4px;font-size:1.05rem;direction:ltr;text-align:right}.product-card p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.7}.product-card b{display:block;margin:12px 0;color:var(--red);font-size:.94rem}.add-cart{width:100%;margin-top:auto;background:linear-gradient(135deg,#3158ff,#8b2cff);color:#fff;font-size:.82rem;box-shadow:0 12px 24px rgba(49,88,255,.24)}
.wide-banner{position:relative;min-height:210px;margin-top:42px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:16px;padding:26px 34px;border-radius:12px;background:radial-gradient(circle at 16% 42%,rgba(69,229,255,.38),transparent 24%),linear-gradient(135deg,#264cff,#8b2cff 62%,#11142f);color:#fff;overflow:hidden;box-shadow:var(--shadow)}.wide-banner:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 45%,rgba(255,255,255,.28),transparent 22%)}.wide-banner div,.wide-banner img{position:relative;z-index:2}.wide-banner span{font-weight:1000}.wide-banner h2{margin:8px 0;font-size:clamp(1.6rem,3vw,3rem);line-height:1.15}.wide-banner p{max-width:560px;line-height:1.8;color:rgba(255,255,255,.88)}.wide-banner img{justify-self:end;width:100%;max-height:220px;object-fit:cover;border-radius:12px;box-shadow:0 18px 34px rgba(0,0,0,.18)}.compact-grid{display:grid;grid-template-columns:repeat(3,1fr);padding:8px}.mini-product{display:flex;align-items:center;gap:12px;min-height:96px;padding:10px;border-radius:10px;border:1px solid transparent}.mini-product:hover{border-color:var(--line);background:#fafafa}.mini-product img{width:76px;height:76px;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#fff}.mini-product h3{margin:0 0 8px;font-size:.9rem}.mini-product b{color:var(--red);font-size:.82rem}.faq{padding-bottom:54px}.faq-list{display:grid}.faq-list details{border-bottom:1px solid var(--line);padding:16px 20px}.faq-list details:last-child{border-bottom:0}.faq-list summary{cursor:pointer;font-weight:900}.faq-list p{color:var(--muted);line-height:1.8}.footer{background:radial-gradient(circle at 85% 10%,rgba(139,44,255,.26),transparent 24%),linear-gradient(135deg,#0d1027,#151936);color:#fff;padding:42px 0;margin-top:10px}.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:30px}.footer h2,.footer h3{margin-top:0}.footer p{color:#bbb;line-height:1.9}.footer a{display:block;color:#ddd;margin:8px 0}.footer-call{color:#fff!important;font-weight:1000}.cart{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.25s var(--ease)}.cart.open{opacity:1;pointer-events:auto}.cart-panel{position:absolute;top:0;bottom:0;left:0;width:min(420px,92vw);padding:24px;background:#fff;box-shadow:0 24px 60px rgba(0,0,0,.22);transform:translateX(-105%);transition:.3s var(--ease)}.cart.open .cart-panel{transform:translateX(0)}.close-cart{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#fff;font-size:1.4rem;cursor:pointer}.cart-panel h2{margin:24px 0}.cart-items{display:grid;gap:10px;margin-bottom:18px}.cart-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid var(--line);border-radius:10px}.cart-item button{border:0;border-radius:8px;background:#111;color:#fff;padding:8px 10px;cursor:pointer}.toast{position:fixed;right:50%;bottom:22px;z-index:100;transform:translate(50%,18px);opacity:0;padding:12px 17px;border-radius:99px;background:#111;color:#fff;font-weight:1000;box-shadow:0 16px 44px rgba(0,0,0,.18);transition:.25s var(--ease)}.toast.show{opacity:1;transform:translate(50%,0)}.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s var(--ease),transform .65s var(--ease)}.reveal.visible{opacity:1;transform:translateY(0)}
@keyframes float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(1deg)}}
@media (max-width:960px){.main-nav{gap:13px}.hero,.wide-banner{grid-template-columns:1fr}.brand-row{grid-template-columns:repeat(3,1fr);height:auto}.brand-row span{min-height:58px}.category-grid{grid-template-columns:repeat(3,1fr)}.product-grid{grid-template-columns:repeat(2,1fr)}.product-card:nth-child(2n){border-left:0}.compact-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr}}
@media (max-width:680px){.shell{width:min(100% - 18px,1160px)}.strip-inner{gap:12px;justify-content:flex-start;overflow:auto;white-space:nowrap}.topbar{height:auto;padding:11px;margin-top:0;border-radius:0 0 14px 14px}.main-nav{display:none}.brand small,.nav-actions .user{display:none}.hero{margin-top:12px;padding:24px 18px;min-height:auto}.hero h1{font-size:clamp(2rem,10vw,3.3rem)}.promo-grid,.product-grid,.compact-grid{grid-template-columns:1fr}.promo-card img{opacity:.7}.category-grid{grid-template-columns:repeat(2,1fr);gap:10px}.category span{width:82px;height:82px}.product-card{border-left:0;border-bottom:1px solid var(--line)}.product-card:last-child{border-bottom:0}.wide-banner{padding:22px 18px}.wide-banner img{justify-self:stretch}.footer{padding:30px 0}.cart-panel{width:100%}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}

/* PHP compatibility layer: keeps the original visual design and styles new dynamic sections. */
.mobile-scrim{position:fixed;inset:0;z-index:88;background:rgba(0,0,0,.48);opacity:0;pointer-events:none;transition:.24s var(--ease)}
.menu-open .mobile-scrim{opacity:1;pointer-events:auto}
.menu-toggle{display:none;width:40px;height:40px;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer}
.menu-toggle span{display:block;width:20px;height:2px;margin:4px auto;border-radius:4px;background:#111}
.mobile-drawer{position:fixed;top:0;right:0;z-index:90;width:min(360px,88vw);height:100dvh;padding:18px;background:#fff;box-shadow:-24px 0 60px rgba(0,0,0,.22);transform:translateX(105%);transition:.28s var(--ease);display:grid;align-content:start;gap:14px;overflow:auto}
.mobile-drawer.open{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.drawer-head button{width:38px;height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:22px;cursor:pointer}
.drawer-search{display:grid;grid-template-columns:1fr auto;gap:8px}.drawer-search input,.drawer-search button{min-height:42px;border:1px solid var(--line);border-radius:10px;padding:0 12px}.drawer-search button{background:#111;color:#fff;font-weight:1000}
.drawer-links,.drawer-cats{display:grid;gap:8px}.drawer-links a,.drawer-cats a,.drawer-cats span{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:900}.drawer-links a.active{color:var(--red);border-color:var(--red)}
.brand-row{height:76px;margin-top:16px;display:grid;grid-template-columns:repeat(6,1fr);align-items:center;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow);overflow:hidden}
.brand-row span{height:100%;display:grid;place-items:center;border-left:1px solid var(--line);color:#8b92b3;font-weight:1000;font-size:.78rem;direction:ltr}.brand-row span:last-child{border-left:0}
.product-card form{margin-top:0}.product-actions{display:grid;gap:8px;margin-top:auto}.product-actions form{margin:0}.product-actions .btn,.product-actions button{width:100%;justify-content:center}
.status-badge{position:absolute;top:13px;right:13px;z-index:3;padding:5px 9px;border-radius:999px;background:linear-gradient(135deg,#15181d,#ff0000);color:#fff;font-size:.65rem;font-weight:1000}
.catalog{display:grid;grid-template-columns:260px 1fr;gap:16px;padding-top:42px}.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.filter-panel{display:grid;align-content:start;gap:14px;padding:18px;position:sticky;top:92px}.filter-panel form{display:grid;gap:14px}.filter-panel label,.clean-form label,.club-form label{display:grid;gap:8px;font-weight:900;font-size:.86rem}
.filter-panel input,.filter-panel select,.clean-form input,.clean-form select,.clean-form textarea,.club-form input,.club-form textarea{width:100%;min-height:44px;border:1px solid rgba(43,44,43,.14);border-radius:10px;padding:0 12px;background:#fff;color:#15181d}.clean-form textarea,.club-form textarea{min-height:100px;padding-top:10px}
.club-contact{display:grid;grid-template-columns:1fr minmax(320px,430px);gap:22px;align-items:stretch;margin-top:42px;padding:28px;border-radius:14px;color:#15181d;background:linear-gradient(180deg,#fff,#f4f6f8);border:1px solid rgba(43,44,43,.12);box-shadow:var(--shadow)}
.club-copy h2{margin:8px 0;font-size:clamp(1.5rem,3vw,2.4rem);line-height:1.25}.club-copy p{color:var(--muted);line-height:1.9}.club-stats{display:flex;flex-wrap:wrap;gap:10px}.club-stats b{padding:9px 12px;border-radius:999px;background:rgba(255,0,0,.09);color:var(--red)}
.dashboard-shell{display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px;align-items:start;padding-top:42px}.dashboard-main{min-width:0}.dashboard-side{position:sticky;top:92px;display:grid;gap:8px;padding:14px;border:1px solid rgba(43,44,43,.12);border-radius:14px;background:#fff;box-shadow:var(--shadow)}
.dashboard-user{display:grid;gap:6px;padding:12px;border-radius:12px;background:#f4f6f8}.avatar{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,#15181d,#ff0000);color:#fff;font-weight:1000;direction:ltr}
.dashboard-side button,.dashboard-side .side-link{min-height:42px;border:1px solid rgba(43,44,43,.12);border-radius:10px;background:#fff;padding:0 12px;text-align:right;font-weight:1000;cursor:pointer;display:flex;align-items:center}.dashboard-side button.active,.dashboard-side button:hover,.dashboard-side .side-link:hover{background:#15181d;color:#fff}
.dashboard-panel{display:none;padding:20px;border:1px solid rgba(43,44,43,.12);border-radius:14px;background:#fff;box-shadow:var(--shadow)}.dashboard-panel.active{display:block}
.metric-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.metric-grid article,.quick-grid a{padding:16px;border:1px solid rgba(43,44,43,.12);border-radius:14px;background:#fff}.metric-grid b{display:block;color:var(--red);font-size:1.8rem;direction:ltr}.metric-grid span{color:var(--muted);font-weight:900}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.admin-two-col{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);gap:14px}.admin-three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.admin-card{padding:20px;border:1px solid rgba(43,44,43,.12);border-radius:14px;background:#fff;box-shadow:var(--shadow)}
.admin-table-wrap{overflow:auto;border:1px solid rgba(43,44,43,.12);border-radius:14px;background:#fff}.admin-table{width:100%;min-width:860px;border-collapse:collapse}.admin-table th,.admin-table td{padding:13px 12px;border-bottom:1px solid rgba(43,44,43,.08);text-align:right}.admin-table th{color:var(--muted)}.admin-table small{display:block;color:var(--muted);margin-top:4px}.status-pill{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,0,0,.09);color:var(--red);font-weight:1000;font-size:.76rem}
.stack-list{display:grid;gap:10px}.admin-list-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px;border:1px solid rgba(43,44,43,.08);border-radius:12px;background:#fff}.admin-list-row span{display:block;color:var(--muted);line-height:1.7}.user-row{grid-template-columns:1fr 150px auto}.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.panel-action{border:1px solid rgba(43,44,43,.12);border-radius:9px;background:#fff;padding:9px 12px;color:#15181d;cursor:pointer;font-weight:900}.link-button{border:0;background:transparent;color:var(--red);font-weight:1000;cursor:pointer}
.auth-hero{display:grid;grid-template-columns:.95fr minmax(330px,460px);gap:20px;align-items:stretch;padding-top:42px}.auth-copy,.auth-glass{padding:28px;border-radius:16px;box-shadow:var(--shadow)}.auth-copy{color:#fff;background:linear-gradient(135deg,rgba(21,24,29,.94),rgba(43,44,43,.74),rgba(255,0,0,.72)),url("gear-protective-premium.png") center/cover no-repeat}.auth-glass{background:#fff;border:1px solid rgba(43,44,43,.12)}.auth-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}.auth-switch button{min-height:42px;border:1px solid rgba(43,44,43,.12);border-radius:10px;background:#fff;font-weight:1000;cursor:pointer}.auth-switch button.active{background:linear-gradient(135deg,#15181d,#ff0000);color:#fff;border-color:transparent}.auth-form{display:none}.auth-form.active{display:grid;gap:12px}
@media (max-width:960px){.brand-row{grid-template-columns:repeat(3,1fr);height:auto}.brand-row span{min-height:58px}.catalog,.dashboard-shell,.club-contact,.auth-hero,.admin-two-col,.admin-three-col{grid-template-columns:1fr}.filter-panel,.dashboard-side{position:static}.dashboard-side{grid-template-columns:repeat(2,1fr)}.dashboard-user{grid-column:1/-1}.catalog-grid{grid-template-columns:repeat(2,1fr)}.metric-grid,.quick-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.menu-toggle{display:block}.main-nav,.topbar .search-box,.nav-actions .login-link{display:none}.brand-row,.catalog-grid,.dashboard-side,.metric-grid,.quick-grid{grid-template-columns:1fr}.admin-list-row,.user-row{grid-template-columns:1fr}.mobile-drawer{width:100%}}

/* Premium layer: keeps the layout, upgrades the visual energy. */
body:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(115deg,transparent 0 44%,rgba(49,88,255,.07) 45%,transparent 46% 100%),repeating-linear-gradient(90deg,rgba(18,20,42,.035) 0 1px,transparent 1px 92px);mask-image:linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent)}
.top-strip{background:linear-gradient(90deg,#0b102f,#16246f,#5521b5,#0b102f);background-size:220% 100%;animation:barShift 9s ease-in-out infinite}.strip-inner span:before{content:"◆";margin-left:8px;color:#62e8ff;font-size:.65rem}.topbar{border-color:rgba(49,88,255,.18);background:rgba(255,255,255,.78)}.topbar:before{content:"";position:absolute;inset:0;border-radius:0 0 18px 18px;padding:1px;background:linear-gradient(90deg,rgba(49,88,255,.35),rgba(139,44,255,.35),rgba(80,231,255,.28));mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;pointer-events:none}.brand-mark{position:relative;overflow:hidden}.brand-mark:after{content:"";position:absolute;inset:-40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(120%) rotate(25deg);animation:shine 3.8s ease-in-out infinite}.main-nav a{transition:.22s var(--ease)}.main-nav a:hover{transform:translateY(-1px);text-shadow:0 0 18px rgba(49,88,255,.25)}
.hero{isolation:isolate;border:1px solid rgba(255,255,255,.38);box-shadow:0 30px 80px rgba(49,88,255,.2),inset 0 0 0 1px rgba(255,255,255,.18)}.hero h1{text-shadow:0 14px 34px rgba(0,0,0,.18)}.hero .kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.34);border-radius:999px;background:rgba(255,255,255,.12);backdrop-filter:blur(12px)}.hero .kicker:before{content:"";width:8px;height:8px;border-radius:50%;background:#62e8ff;box-shadow:0 0 18px #62e8ff}.hero-art:before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(100,235,255,.38),transparent 62%);filter:blur(2px);animation:pulseGlow 4s ease-in-out infinite}.hero-art img{position:relative;z-index:2}.hero-actions .primary{background:linear-gradient(135deg,#080d2b,#151b46);box-shadow:0 18px 34px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.18) inset}.hero-actions .ghost{box-shadow:0 14px 28px rgba(255,255,255,.12),0 0 0 1px rgba(255,255,255,.2) inset}
.promo-card{border:1px solid rgba(255,255,255,.38);box-shadow:0 24px 54px rgba(49,88,255,.18),inset 0 0 0 1px rgba(255,255,255,.16)}.promo-card span{font-size:1.55rem;text-shadow:0 10px 24px rgba(0,0,0,.18)}.promo-card b{display:inline-flex;width:max-content;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(10px)}.promo-card:hover img{transform:translateY(-5px) scale(1.04)}.promo-card img{transition:.32s var(--ease)}
.brand-row{border-color:rgba(49,88,255,.16);box-shadow:0 18px 46px rgba(43,69,210,.1)}.brand-row span{position:relative;overflow:hidden}.brand-row span:after{content:"";position:absolute;inset:auto 18% 16px 18%;height:2px;border-radius:9px;background:linear-gradient(90deg,transparent,#3158ff,#8b2cff,transparent);opacity:0;transition:.24s var(--ease)}.brand-row span:hover{color:#3158ff}.brand-row span:hover:after{opacity:1}
.section-title h2{font-size:1.28rem}.section-title h2:before{content:"";position:absolute;right:-12px;top:50%;width:6px;height:24px;border-radius:999px;background:linear-gradient(#3158ff,#8b2cff);transform:translateY(-50%)}.category{position:relative;overflow:hidden}.category:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(49,88,255,.13),transparent 45%);opacity:0;transition:.24s var(--ease)}.category:hover:before{opacity:1}.category:hover span{transform:translateY(-3px) rotate(-2deg);box-shadow:inset 0 0 0 7px #fff,0 18px 34px rgba(49,88,255,.26)}.category span{transition:.24s var(--ease)}
.product-card{position:relative;transition:.28s var(--ease)}.product-card:before{content:"جدید";position:absolute;top:13px;right:13px;z-index:3;padding:5px 9px;border-radius:999px;background:linear-gradient(135deg,#3158ff,#8b2cff);color:#fff;font-size:.65rem;font-weight:1000;box-shadow:0 10px 20px rgba(49,88,255,.24)}.product-card:nth-child(2):before{content:"پرفروش"}.product-card:nth-child(3):before{content:"خاص"}.product-card:nth-child(4):before{content:"باشگاه"}.product-card:hover{transform:translateY(-7px);box-shadow:0 24px 46px rgba(49,88,255,.14);z-index:4}.product-card:hover .product-media img{transform:scale(1.07) rotate(-2deg)}.product-media{position:relative;overflow:hidden}.product-media:before{content:"";position:absolute;width:110px;height:110px;border-radius:50%;background:rgba(139,44,255,.14);filter:blur(16px)}.product-media:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 35%,rgba(255,255,255,.55) 48%,transparent 62%);transform:translateX(120%);transition:.55s var(--ease)}.product-card:hover .product-media:after{transform:translateX(-120%)}.product-media img{transition:.32s var(--ease)}.add-cart{position:relative;overflow:hidden}.add-cart:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(110%);transition:.38s var(--ease)}.add-cart:hover:before{transform:translateX(-110%)}
.wide-banner{border:1px solid rgba(255,255,255,.28);box-shadow:0 28px 70px rgba(63,66,210,.22),inset 0 0 0 1px rgba(255,255,255,.14)}.wide-banner h2{text-shadow:0 12px 28px rgba(0,0,0,.2)}.wide-banner img{border:1px solid rgba(255,255,255,.3);filter:saturate(1.1) contrast(1.05)}.mini-product{transition:.24s var(--ease)}.mini-product:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(43,69,210,.08)}.mini-product img{background:radial-gradient(circle,rgba(49,88,255,.12),#fff 62%)}.faq-list details{transition:.24s var(--ease)}.faq-list details[open]{background:linear-gradient(90deg,rgba(49,88,255,.06),transparent)}.footer{position:relative;overflow:hidden}.footer:before{content:"";position:absolute;left:8%;top:-120px;width:260px;height:260px;border-radius:50%;background:rgba(73,217,255,.12);filter:blur(4px)}.footer-grid{position:relative;z-index:2}.cart-panel{background:linear-gradient(180deg,#fff,#f7f9ff)}
@keyframes barShift{0%,100%{background-position:0 0}50%{background-position:100% 0}}@keyframes shine{0%,60%{transform:translateX(120%) rotate(25deg)}78%,100%{transform:translateX(-120%) rotate(25deg)}}@keyframes pulseGlow{0%,100%{transform:scale(.92);opacity:.7}50%{transform:scale(1.08);opacity:1}}
@media (max-width:680px){.topbar:before{border-radius:0 0 14px 14px}.promo-card span{font-size:1.28rem}.product-card:hover{transform:none}.hero-art:before{width:230px;height:230px}.section-title h2:before{right:-9px}}

@font-face{font-family:"Graphik Arabic";src:local("Graphik Arabic Bold"),local("Graphik-Arabic-Bold"),url("font/IRANYekanX-Black.woff") format("woff2"),url("font/GraphikArabic-Bold.woff") format("woff"),url("font/GraphikArabic-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}

/* Graphik + motion pass */
body,button,input,textarea{font-family:"Graphik Arabic","Trebuchet MS","Segoe UI",Tahoma,sans-serif}.brand strong,.main-nav a,.hero h1,.section-title h2,.promo-card span,.wide-banner h2,.footer h2,.footer h3,.product-card h3,.category b{font-family:"Graphik Arabic","Trebuchet MS",Tahoma,sans-serif;font-weight:700}.hero h1,.wide-banner h2{letter-spacing:-.035em}.product-card h3,.brand small,.product-card small{letter-spacing:0}.topbar{animation:navDrop .7s var(--ease) both}.hero{animation:heroRise .9s var(--ease) both}.promo-grid,.brand-row,.category-section,.products,.wide-banner,.faq{animation:softEnter .9s var(--ease) both}.promo-grid{animation-delay:.08s}.brand-row{animation-delay:.14s}.category-section{animation-delay:.2s}.products{animation-delay:.26s}.wide-banner{animation-delay:.32s}.faq{animation-delay:.38s}
.hero-copy{animation:textSlide .9s var(--ease) .12s both}.hero-art img{animation:float 5s ease-in-out infinite,skateTilt 9s ease-in-out infinite}.hero:after{animation:blobMove 8s ease-in-out infinite}.hero-art:after{content:"";position:absolute;inset:auto 9% 13% 9%;height:22px;border-radius:50%;background:rgba(5,8,35,.28);filter:blur(16px);animation:shadowPulse 5s ease-in-out infinite}.btn,.add-cart,.icon{will-change:transform}.btn:active,.add-cart:active,.icon:active{transform:translateY(1px) scale(.98)}.category,.product-card,.mini-product,.promo-card{will-change:transform}.boxed{position:relative}.boxed:before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(49,88,255,.42),rgba(139,44,255,.42),transparent);pointer-events:none}.product-card:hover h3{color:#3158ff}.product-card:hover b{filter:drop-shadow(0 0 10px rgba(49,88,255,.18))}.section-title a{position:relative}.section-title a:after{content:"";position:absolute;right:0;bottom:-5px;width:0;height:2px;border-radius:999px;background:linear-gradient(90deg,#3158ff,#8b2cff);transition:.24s var(--ease)}.section-title a:hover:after{width:100%}.wide-banner:after{content:"";position:absolute;top:-70%;right:-25%;width:55%;height:230%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);transform:rotate(18deg);animation:bannerSweep 5.5s ease-in-out infinite}.footer a{transition:.2s var(--ease)}.footer a:hover{color:#77e7ff;transform:translateX(-3px)}
@keyframes navDrop{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@keyframes heroRise{from{opacity:0;transform:translateY(24px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes softEnter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes textSlide{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:translateX(0)}}@keyframes skateTilt{0%,100%{rotate:0deg}25%{rotate:-1.5deg}75%{rotate:1.5deg}}@keyframes blobMove{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(46px,-18px) scale(1.08)}}@keyframes shadowPulse{0%,100%{transform:scale(.86);opacity:.58}50%{transform:scale(1.08);opacity:.32}}@keyframes bannerSweep{0%,58%{transform:translateX(120%) rotate(18deg);opacity:0}68%{opacity:1}100%{transform:translateX(-220%) rotate(18deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.topbar,.hero,.promo-grid,.brand-row,.category-section,.products,.wide-banner,.faq,.hero-copy,.hero-art img,.hero:after,.hero-art:after,.wide-banner:after{animation:none!important}}

/* Reebok-inspired grey/red theme override */
:root{
  --bg:#f2f3f5;
  --paper:#ffffff;
  --ink:#17191d;
  --muted:#737780;
  --line:#e1e3e7;
  --red:#e30613;
  --red-dark:#9f000a;
  --soft-red:#fff1f2;
  --shadow:0 18px 44px rgba(20,24,30,.1);
}
body{background:radial-gradient(circle at 12% 8%,rgba(227,6,19,.06),transparent 24%),radial-gradient(circle at 88% 24%,rgba(20,24,30,.06),transparent 25%),linear-gradient(180deg,#f7f8fa,#eceff3)}
body:before{background:linear-gradient(115deg,transparent 0 44%,rgba(227,6,19,.045) 45%,transparent 46% 100%),repeating-linear-gradient(90deg,rgba(20,24,30,.035) 0 1px,transparent 1px 92px)}
.top-strip{background:linear-gradient(90deg,#111318,#2b2f37,#d90416,#111318);background-size:220% 100%}.strip-inner span:before{color:#ff3442}.topbar{border-color:rgba(20,24,30,.1);background:rgba(255,255,255,.86);box-shadow:0 12px 38px rgba(20,24,30,.08)}.topbar:before{background:linear-gradient(90deg,rgba(20,24,30,.18),rgba(227,6,19,.34),rgba(20,24,30,.14))}.brand-mark{background:linear-gradient(135deg,#191b21,#e30613);box-shadow:0 10px 26px rgba(227,6,19,.26)}.main-nav a:hover,.main-nav a.active{color:#e30613}.main-nav a.active:after{background:#e30613}.main-nav a:hover{text-shadow:0 0 18px rgba(227,6,19,.2)}.bag span{background:#e30613}.primary{background:#111318}.ghost{color:#e30613}.hero{background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.34),transparent 25%),radial-gradient(circle at 82% 24%,rgba(255,255,255,.18),transparent 24%),linear-gradient(135deg,#20242b 0%,#616772 45%,#e30613 100%);box-shadow:0 30px 80px rgba(20,24,30,.18),inset 0 0 0 1px rgba(255,255,255,.18)}.hero .kicker:before{background:#ff3442;box-shadow:0 0 18px #ff3442}.hero-art:before{background:radial-gradient(circle,rgba(227,6,19,.26),transparent 62%)}.hero-actions .primary{background:linear-gradient(135deg,#111318,#2d3139)}.promo-card{background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.2),transparent 28%),linear-gradient(135deg,#2a2f38,#e30613);box-shadow:0 24px 54px rgba(20,24,30,.13),inset 0 0 0 1px rgba(255,255,255,.16)}.promo-card.alt{background:radial-gradient(circle at 20% 25%,rgba(255,255,255,.16),transparent 24%),linear-gradient(135deg,#101216,#5c626d,#c90010)}.brand-row{border-color:rgba(20,24,30,.1);box-shadow:0 18px 46px rgba(20,24,30,.08)}.brand-row span{color:#8a8e96}.brand-row span:after{background:linear-gradient(90deg,transparent,#17191d,#e30613,transparent)}.brand-row span:hover{color:#e30613}.section-title h2:before,.section-title h2:after{background:linear-gradient(#17191d,#e30613)}.section-title a:after{background:linear-gradient(90deg,#17191d,#e30613)}.category:hover{border-color:#ffc9ce}.category:before{background:radial-gradient(circle at 50% 0,rgba(227,6,19,.1),transparent 45%)}.category span{background:radial-gradient(circle,#fff 43%,#f1f2f4 44%,#c9cdd4 61%,#e30613 100%);box-shadow:inset 0 0 0 7px #fff,0 12px 24px rgba(20,24,30,.12)}.category:hover span{box-shadow:inset 0 0 0 7px #fff,0 18px 34px rgba(227,6,19,.2)}.boxed{background:linear-gradient(180deg,#fff,#fafbfc)}.boxed:before{background:linear-gradient(90deg,transparent,rgba(20,24,30,.2),rgba(227,6,19,.38),transparent)}.product-media{background:radial-gradient(circle at 50% 38%,rgba(227,6,19,.11),transparent 45%),linear-gradient(180deg,#fff,#f4f5f7)}.product-media:before{background:rgba(20,24,30,.08)}.product-card:before,.add-cart{background:linear-gradient(135deg,#17191d,#e30613);color:#fff}.product-card:hover{box-shadow:0 24px 46px rgba(20,24,30,.12)}.product-card:hover h3{color:#e30613}.product-card:hover b{filter:drop-shadow(0 0 10px rgba(227,6,19,.16))}.product-card b,.mini-product b{color:#e30613}.wide-banner{background:radial-gradient(circle at 16% 42%,rgba(255,255,255,.2),transparent 24%),linear-gradient(135deg,#20242b,#777d87 52%,#e30613);box-shadow:0 28px 70px rgba(20,24,30,.18),inset 0 0 0 1px rgba(255,255,255,.14)}.mini-product img{background:radial-gradient(circle,rgba(227,6,19,.1),#fff 62%)}.faq-list details[open]{background:linear-gradient(90deg,rgba(227,6,19,.055),transparent)}.footer{background:radial-gradient(circle at 85% 10%,rgba(227,6,19,.18),transparent 24%),linear-gradient(135deg,#111318,#262a32);color:#fff}.footer:before{background:rgba(227,6,19,.1)}.footer a:hover{color:#ff4b57}.cart-panel{background:linear-gradient(180deg,#fff,#f5f6f8)}.toast{background:#111318}.add-cart:before{background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent)}

/* Stronger Reebok-style page background */
body{background:
  radial-gradient(circle at 8% 10%,rgba(227,6,19,.13),transparent 24%),
  radial-gradient(circle at 92% 18%,rgba(17,19,24,.12),transparent 28%),
  radial-gradient(circle at 54% 72%,rgba(227,6,19,.08),transparent 32%),
  linear-gradient(135deg,#ffffff 0%,#f0f2f5 38%,#e4e7ec 100%)}
body:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  linear-gradient(118deg,transparent 0 31%,rgba(227,6,19,.075) 31.2% 32.2%,transparent 32.4% 100%),
  linear-gradient(118deg,transparent 0 58%,rgba(17,19,24,.055) 58.2% 59.2%,transparent 59.4% 100%),
  repeating-linear-gradient(118deg,rgba(17,19,24,.045) 0 1px,transparent 1px 34px),
  repeating-linear-gradient(0deg,rgba(255,255,255,.55) 0 1px,transparent 1px 88px);mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),#000 18%,#000 82%,rgba(0,0,0,.72))}
body:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  conic-gradient(from 140deg at 18% 24%,transparent 0 28%,rgba(227,6,19,.08) 29% 34%,transparent 35% 100%),
  conic-gradient(from -40deg at 88% 76%,transparent 0 24%,rgba(17,19,24,.075) 25% 31%,transparent 32% 100%);filter:blur(.2px)}
.hero,.promo-card,.brand-row,.boxed,.wide-banner,.topbar{position:relative}.shell:not(.topbar){position:relative;z-index:1}

/* Fixed header on scroll */
.top-strip{position:fixed;top:0;left:0;right:0;z-index:80}.topbar{position:fixed;top:34px;left:50%;right:auto;width:min(1160px,calc(100% - 28px));margin-top:0;transform:translateX(-50%);z-index:81;border-radius:0 0 18px 18px}.topbar.scrolled{top:34px;background:rgba(255,255,255,.94);box-shadow:0 16px 42px rgba(20,24,30,.16)}main{padding-top:126px}.topbar:before{border-radius:0 0 18px 18px}@media (max-width:680px){.topbar{top:34px;width:calc(100% - 18px);border-radius:0 0 14px 14px}.topbar.scrolled{top:34px}main{padding-top:116px}.topbar:before{border-radius:0 0 14px 14px}}

/* Better frozen header: sticky without breaking layout */
.top-strip{position:relative;top:auto;left:auto;right:auto;z-index:70}.topbar{position:sticky;top:0;left:auto;right:auto;width:min(1160px,calc(100% - 28px));margin-top:10px;transform:none;z-index:81;border-radius:0 0 18px 18px}.topbar.scrolled{top:0;background:rgba(255,255,255,.94);box-shadow:0 16px 42px rgba(20,24,30,.16)}main{padding-top:0}@media (max-width:680px){.topbar{top:0;width:min(100% - 18px,1160px);margin-top:0;border-radius:0 0 14px 14px}.topbar.scrolled{top:0}main{padding-top:0}}

/* Client palette pass: hot red/orange with titanium pencil-grey surfaces */
:root{
  --bg:#eceff1;
  --paper:#ffffff;
  --ink:#15181d;
  --muted:#6f747b;
  --line:#d9dde1;
  --red:#ff0000;
  --red-dark:#b00000;
  --orange:#ff0000;
  --titanium:#2b2c2b;
  --titanium-soft:#4a4b4a;
  --soft-red:#fff0ea;
  --shadow:0 18px 44px rgba(22,25,29,.12);
}
body{
  background:
    radial-gradient(circle at 10% 8%,rgba(255,0,0,.18),transparent 25%),
    radial-gradient(circle at 88% 18%,rgba(43,44,43,.12),transparent 28%),
    linear-gradient(135deg,#f8f9fa 0%,#eef1f3 38%,#dfe4e8 100%);
}
body:before{
  background:
    linear-gradient(118deg,transparent 0 31%,rgba(255,0,0,.11) 31.2% 32.2%,transparent 32.4% 100%),
    linear-gradient(118deg,transparent 0 58%,rgba(43,44,43,.08) 58.2% 59.2%,transparent 59.4% 100%),
    repeating-linear-gradient(118deg,rgba(43,44,43,.045) 0 1px,transparent 1px 34px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.52) 0 1px,transparent 1px 88px);
}
body:after{
  background:
    conic-gradient(from 140deg at 18% 24%,transparent 0 28%,rgba(255,0,0,.12) 29% 34%,transparent 35% 100%),
    conic-gradient(from -40deg at 88% 76%,transparent 0 24%,rgba(43,44,43,.09) 25% 31%,transparent 32% 100%);
}
.top-strip{background:linear-gradient(90deg,#181918,#2b2c2b,#ff0000,#2b2c2b,#181918);background-size:240% 100%}
.strip-inner span:before{color:#ff0000}
.topbar{border-color:rgba(43,44,43,.16);background:rgba(255,255,255,.88);box-shadow:0 14px 40px rgba(22,25,29,.11)}
.topbar:before{background:linear-gradient(90deg,rgba(43,44,43,.28),rgba(255,0,0,.5),rgba(43,44,43,.22))}
.brand-mark,.bag span{background:linear-gradient(135deg,#2b2c2b 0%,#ff0000 100%);box-shadow:0 10px 26px rgba(255,0,0,.34)}
.main-nav a:hover,.main-nav a.active,.brand-row span:hover,.product-card:hover h3{color:var(--red)}
.main-nav a.active:after{background:linear-gradient(90deg,var(--red),var(--orange))}
.hero{
  min-height:430px;
  grid-template-columns:1fr;
  background:
    linear-gradient(90deg,rgba(24,25,24,.92) 0%,rgba(43,44,43,.78) 40%,rgba(255,0,0,.7) 100%),
    url("hero-skate-premium.png") center/cover no-repeat;
  box-shadow:0 32px 84px rgba(22,25,29,.22),inset 0 0 0 1px rgba(255,255,255,.16);
}
.hero:before{background:linear-gradient(110deg,transparent 0 55%,rgba(255,0,0,.3) 55% 60%,transparent 60%),repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px 74px)}
.hero:after{background:rgba(255,0,0,.32)}
.hero .kicker:before{background:#ff0000;box-shadow:0 0 18px #ff0000}
.hero-copy{max-width:660px;justify-self:start;text-align:right}
.hero-actions .primary,.primary{background:linear-gradient(135deg,#181918,#2b2c2b)}
.ghost{color:#ff0000;background:#fff0f1}
.promo-card{background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.22),transparent 28%),linear-gradient(135deg,#2b2c2b,#ff0000);box-shadow:0 24px 54px rgba(22,25,29,.14),inset 0 0 0 1px rgba(255,255,255,.16)}
.promo-card.alt{background:radial-gradient(circle at 20% 25%,rgba(255,255,255,.16),transparent 24%),linear-gradient(135deg,#181918,#2b2c2b 48%,#ff0000)}
.brand-row span:after,.section-title a:after,.boxed:before{background:linear-gradient(90deg,transparent,var(--titanium),var(--red),var(--orange),transparent)}
.section-title h2:before,.section-title h2:after{background:linear-gradient(var(--titanium),var(--red),var(--orange))}
.category:hover{border-color:#ffb18b}
.category:before{background:radial-gradient(circle at 50% 0,rgba(255,0,0,.16),transparent 45%)}
.category span{background:radial-gradient(circle,#fff 43%,#f1f3f5 44%,#b9bdb9 61%,#2b2c2b 76%,#ff0000 100%);box-shadow:inset 0 0 0 7px #fff,0 12px 24px rgba(43,44,43,.14)}
.category:hover span{box-shadow:inset 0 0 0 7px #fff,0 18px 34px rgba(255,0,0,.28)}
.product-media{background:radial-gradient(circle at 50% 38%,rgba(255,0,0,.16),transparent 45%),linear-gradient(180deg,#fff,#f3f5f6)}
.product-media:before{background:rgba(255,0,0,.13)}
.product-card:before,.add-cart{background:linear-gradient(135deg,#2b2c2b 0%,#ff0000 100%);box-shadow:0 10px 22px rgba(255,0,0,.28)}
.product-card:hover{box-shadow:0 24px 46px rgba(22,25,29,.13)}
.product-card:hover b{filter:drop-shadow(0 0 10px rgba(255,0,0,.22))}
.product-card b,.mini-product b{color:var(--red)}
.wide-banner{background:linear-gradient(90deg,rgba(24,25,24,.92),rgba(43,44,43,.72),rgba(255,0,0,.74)),url("hero-skate-premium.png") center/cover no-repeat;box-shadow:0 28px 70px rgba(22,25,29,.2),inset 0 0 0 1px rgba(255,255,255,.14)}
.wide-banner img{filter:saturate(1.18) contrast(1.08);border-color:rgba(255,255,255,.34)}
.mini-product img{background:radial-gradient(circle,rgba(255,0,0,.15),#fff 62%)}
.faq-list details[open]{background:linear-gradient(90deg,rgba(255,0,0,.09),transparent)}
.footer{background:radial-gradient(circle at 85% 10%,rgba(255,0,0,.22),transparent 24%),linear-gradient(135deg,#181918,#2b2c2b)}
.footer:before{background:rgba(255,0,0,.15)}
.footer a:hover{color:#ff0000}
.toast{background:#15181d}
@media (max-width:960px){.hero{grid-template-columns:1fr}}
@media (max-width:680px){.hero{min-height:auto;padding:22px 16px}}

/* Full-site premium pass */
.topbar{
  border-color:rgba(255,0,0,.18);
  box-shadow:0 18px 50px rgba(21,24,29,.14);
}
.main-nav{
  gap:18px;
}
.brand-mark{
  letter-spacing:.04em;
}
.hero{
  min-height:500px;
  padding:58px 54px;
  border:1px solid rgba(255,255,255,.28);
  align-items:end;
}
.hero:before{
  background:
    linear-gradient(90deg,rgba(0,0,0,.08),rgba(0,0,0,.42) 58%,rgba(0,0,0,.78)),
    linear-gradient(110deg,transparent 0 55%,rgba(255,0,0,.22) 55% 60%,transparent 60%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px 74px);
}
.hero-copy{
  padding:20px 0 8px;
}
.hero h1{
  max-width:640px;
  letter-spacing:0;
  line-height:1.16;
}
.hero p{
  max-width:590px;
  font-size:.98rem;
}
.hero-actions .btn{
  min-width:154px;
}
.hero-actions .ghost{
  border:1px solid rgba(255,255,255,.35);
}
.promo-grid{
  gap:18px;
}
.promo-card{
  min-height:190px;
  padding:28px;
  border-radius:14px;
  background:
    linear-gradient(90deg,rgba(19,21,24,.94),rgba(43,44,43,.62),rgba(255,0,0,.7)),
    radial-gradient(circle at 18% 28%,rgba(255,255,255,.22),transparent 28%);
}
.promo-card.alt{
  background:
    linear-gradient(90deg,rgba(19,21,24,.92),rgba(43,44,43,.62),rgba(255,0,0,.66)),
    url("hero-skate-premium.png") center/cover no-repeat;
}
.promo-card img{
  left:0;
  bottom:0;
  width:46%;
  height:100%;
  max-height:none;
  object-fit:cover;
  opacity:.9;
  mix-blend-mode:screen;
}
.brand-row{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(244,246,248,.88));
  backdrop-filter:blur(12px);
}
.category-grid{
  grid-template-columns:repeat(6,minmax(0,1fr));
}
.category{
  min-height:174px;
  align-content:center;
  border-color:rgba(43,44,43,.12);
  background:linear-gradient(180deg,#fff,#f5f6f7);
}
.category span{
  width:112px;
  height:112px;
  border-radius:18px;
  background:#15181d;
  box-shadow:0 18px 36px rgba(21,24,29,.16);
}
.category img,
.category:nth-child(4) img,
.category:nth-child(5) img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.boxed{
  border-color:rgba(43,44,43,.12);
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(14px);
}
.product-grid{
  gap:0;
}
.product-card{
  min-height:430px;
  padding:16px;
  background:linear-gradient(180deg,#fff,#f5f6f7);
}
.product-card:before{
  top:18px;
  right:18px;
}
.product-media{
  height:220px;
  border:1px solid rgba(43,44,43,.08);
  background:
    radial-gradient(circle at 50% 35%,rgba(255,0,0,.2),transparent 38%),
    linear-gradient(145deg,#111318,#3b3d40 55%,#f0f1f2);
}
.product-media img{
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:cover;
  filter:saturate(1.08) contrast(1.04);
}
.product-card h3{
  font-size:1.12rem;
}
.add-cart{
  min-height:48px;
  border-radius:9px;
}
.wide-banner{
  min-height:300px;
  padding:36px;
  border-radius:14px;
  background-position:center;
}
.wide-banner img{
  max-height:260px;
  object-fit:cover;
}
.compact-grid{
  gap:8px;
  padding:12px;
}
.mini-product{
  min-height:126px;
  background:#fff;
  border-color:rgba(43,44,43,.08);
}
.mini-product img{
  width:96px;
  height:96px;
  object-fit:cover;
  background:#15181d;
}
.faq-list details[open]{
  background:linear-gradient(90deg,rgba(255,0,0,.08),rgba(255,255,255,.5));
}
@media (max-width:960px){
  .category-grid{grid-template-columns:repeat(3,1fr)}
  .product-grid{gap:0}
}
@media (max-width:680px){
  .hero{min-height:420px;padding:28px 18px;background-position:62% center}
  .hero-copy{justify-self:stretch;max-width:100%;padding-top:42px}
  .promo-card{min-height:170px}
  .promo-card img{width:55%;opacity:.72}
  .category-grid{grid-template-columns:repeat(2,1fr)}
  .product-card{min-height:390px}
  .product-media{height:210px}
  .wide-banner{min-height:auto;padding:24px 18px}
}

.trust-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  margin-top:18px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.72);
  box-shadow:0 18px 46px rgba(22,25,29,.1);
  backdrop-filter:blur(14px);
}
.trust-strip div{
  position:relative;
  min-height:86px;
  padding:18px 68px 18px 18px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(242,244,246,.9));
}
.trust-strip div:before{
  content:"";
  position:absolute;
  right:18px;
  top:50%;
  width:38px;
  height:38px;
  border-radius:14px;
  background:
    var(--trust-icon),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.75),transparent 28%),
    linear-gradient(135deg,#15181d,#e30613);
  background-blend-mode:normal,screen,normal;
  box-shadow:0 12px 26px rgba(22,25,29,.16);
  transform:translateY(-50%);
}
.trust-strip div:nth-child(1){--trust-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-6 10-6 10 6 10 6-3.5 6-10 6S2 12 2 12Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center/21px 21px no-repeat}
.trust-strip div:nth-child(2){--trust-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h11v9H3zM14 10h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/svg%3E") center/22px 22px no-repeat}
.trust-strip div:nth-child(3){--trust-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z'/%3E%3Cpath d='m9 12 2 2 4-5'/%3E%3C/svg%3E") center/21px 21px no-repeat}
.trust-strip div:nth-child(4){--trust-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18v3h3l6.3-6.3a4 4 0 0 0 5.4-5.4l-3 3-3-3 3-3Z'/%3E%3C/svg%3E") center/21px 21px no-repeat}
.trust-strip strong,
.trust-strip span{
  display:block;
}
.trust-strip strong{
  color:#15181d;
  font-size:.92rem;
}
.trust-strip span{
  margin-top:7px;
  color:var(--muted);
  font-size:.78rem;
}
.guide-section,
.academy{
  padding-top:42px;
}
.guide-grid,
.academy-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.guide-card,
.academy-card{
  position:relative;
  min-height:190px;
  padding:22px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:14px;
  overflow:hidden;
  background:linear-gradient(145deg,#fff,#f4f6f7);
  box-shadow:0 18px 42px rgba(22,25,29,.09);
}
.guide-card:before,
.academy-card:before{
  content:"";
  position:absolute;
  inset:auto -20% -50% -20%;
  height:120px;
  background:radial-gradient(circle,rgba(255,0,0,.2),transparent 62%);
}
.guide-card span{
  display:inline-grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:10px;
  background:#15181d;
  color:#fff;
  font-weight:1000;
  direction:ltr;
}
.guide-card h3,
.academy-card h3{
  margin:18px 0 8px;
  font-size:1.08rem;
}
.guide-card p,
.academy-card p{
  margin:0;
  color:var(--muted);
  line-height:1.8;
  font-size:.86rem;
}
.academy-card{
  min-height:230px;
  color:#15181d;
}
.academy-card small{
  color:var(--red);
  font-weight:1000;
  letter-spacing:0;
}
.academy-card b{
  position:absolute;
  right:22px;
  bottom:20px;
  color:var(--red);
  font-size:.86rem;
}
.academy-card.featured{
  background:
    linear-gradient(135deg,rgba(21,24,29,.96),rgba(43,44,43,.9),rgba(255,0,0,.84)),
    url("hero-skate-premium.png") center/cover no-repeat;
  color:#fff;
}
.academy-card.featured p,
.academy-card.featured small,
.academy-card.featured b{
  color:rgba(255,255,255,.86);
}
.size-consult{
  position:relative;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
  align-items:center;
  min-height:260px;
  margin-top:42px;
  padding:32px;
  border-radius:14px;
  overflow:hidden;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(21,24,29,.94),rgba(43,44,43,.76),rgba(255,0,0,.72)),
    url("gear-protective-premium.png") center/cover no-repeat;
  box-shadow:0 28px 70px rgba(22,25,29,.2);
}
.size-consult:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(118deg,transparent 0 52%,rgba(255,255,255,.16) 52.3% 54%,transparent 54.3%);
  pointer-events:none;
}
.size-consult > *{
  position:relative;
  z-index:2;
}
.size-consult span{
  font-weight:1000;
}
.size-consult h2{
  max-width:650px;
  margin:8px 0;
  font-size:clamp(1.5rem,3vw,2.6rem);
  line-height:1.2;
}
.size-consult p{
  max-width:560px;
  color:rgba(255,255,255,.82);
  line-height:1.9;
}
.size-panel{
  display:grid;
  gap:10px;
  padding:18px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:12px;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(14px);
}
.size-panel b{
  font-size:1rem;
}
.size-panel span{
  padding:10px 12px;
  border-radius:9px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:.84rem;
}
.size-panel .btn{
  margin-top:4px;
}
@media (max-width:960px){
  .trust-strip{grid-template-columns:repeat(2,1fr)}
  .guide-grid,.academy-grid{grid-template-columns:1fr}
  .size-consult{grid-template-columns:1fr}
}
@media (max-width:680px){
  .trust-strip{grid-template-columns:1fr}
  .trust-strip div{min-height:72px}
  .guide-card,.academy-card{min-height:auto}
  .academy-card b{position:static;display:block;margin-top:18px}
  .size-consult{padding:24px 18px}
}

.account-area,
.admin-area{
  padding-top:42px;
}
.account-grid{
  display:grid;
  grid-template-columns:.75fr 1.35fr .9fr;
  gap:14px;
}
.profile-card,
.orders-card,
.account-side,
.admin-panel{
  border:1px solid rgba(43,44,43,.12);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(244,246,248,.92));
  box-shadow:0 18px 44px rgba(22,25,29,.1);
}
.profile-card{
  display:grid;
  align-content:center;
  justify-items:start;
  min-height:260px;
  padding:24px;
}
.avatar{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,#15181d,#ff0000);
  color:#fff;
  font-weight:1000;
  direction:ltr;
  box-shadow:0 14px 30px rgba(255,0,0,.26);
}
.profile-card h3,
.orders-card h3,
.account-side h3,
.admin-panel h3{
  margin:16px 0 8px;
}
.profile-card p{
  margin:0 0 18px;
  color:var(--muted);
}
.orders-card,
.account-side,
.admin-panel{
  padding:20px;
}
.panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.panel-head h3{
  margin:0;
}
.panel-action{
  border:1px solid rgba(43,44,43,.12);
  border-radius:9px;
  background:#fff;
  padding:9px 12px;
  color:#15181d;
  cursor:pointer;
  font-weight:900;
}
.order-list{
  display:grid;
  gap:10px;
}
.order-list article,
.stock-list span{
  display:grid;
  grid-template-columns:.75fr 1fr .9fr;
  gap:10px;
  align-items:center;
  padding:13px;
  border-radius:11px;
  background:#fff;
  border:1px solid rgba(43,44,43,.08);
}
.order-list b,
.stock-list b{
  direction:ltr;
  text-align:right;
}
.order-list span,
.account-side span{
  color:var(--muted);
  font-size:.86rem;
}
.order-list em,
.stock-list em{
  justify-self:end;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(255,0,0,.09);
  color:var(--red);
  font-style:normal;
  font-size:.76rem;
  font-weight:1000;
}
.account-side{
  display:grid;
  align-content:start;
  gap:12px;
}
.account-side span{
  display:block;
  padding:12px;
  border-radius:10px;
  background:#fff;
  border:1px solid rgba(43,44,43,.08);
}
.admin-metrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-bottom:14px;
}
.admin-metrics div{
  padding:18px;
  border-radius:14px;
  color:#fff;
  background:linear-gradient(135deg,#15181d,#2b2c2b 58%,#ff0000);
  box-shadow:0 18px 42px rgba(22,25,29,.14);
}
.admin-metrics strong,
.admin-metrics span{
  display:block;
}
.admin-metrics strong{
  font-size:1.9rem;
  direction:ltr;
}
.admin-metrics span{
  margin-top:6px;
  color:rgba(255,255,255,.78);
}
.admin-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:14px;
}
.admin-panel table{
  width:100%;
  border-collapse:collapse;
  overflow:hidden;
}
.admin-panel th,
.admin-panel td{
  padding:12px 10px;
  border-bottom:1px solid rgba(43,44,43,.08);
  text-align:right;
  font-size:.84rem;
}
.admin-panel th{
  color:var(--muted);
}
.admin-panel td:first-child{
  direction:ltr;
}
.stock-list{
  display:grid;
  gap:10px;
}
.stock-list span{
  grid-template-columns:1fr auto;
}
.auth-modal{
  position:fixed;
  inset:0;
  z-index:95;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(0,0,0,.58);
  opacity:0;
  pointer-events:none;
  transition:.24s var(--ease);
}
.auth-modal.open{
  opacity:1;
  pointer-events:auto;
}
.auth-card{
  position:relative;
  width:min(440px,100%);
  padding:24px;
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#f4f6f8);
  box-shadow:0 30px 90px rgba(0,0,0,.28);
}
.auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:18px;
  padding-left:52px;
}
.auth-tabs button{
  min-height:42px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  font-weight:1000;
}
.auth-tabs button.active{
  background:linear-gradient(135deg,#15181d,#ff0000);
  color:#fff;
  border-color:transparent;
}
.auth-form{
  display:none;
}
.auth-form.active{
  display:grid;
  gap:12px;
}
.auth-form h2{
  margin:0 0 8px;
}
.auth-form label{
  display:grid;
  gap:8px;
  color:#15181d;
  font-weight:900;
  font-size:.86rem;
}
.auth-form input{
  min-height:46px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:10px;
  padding:0 12px;
  background:#fff;
  direction:rtl;
}
.page-hero{
  position:relative;
  min-height:270px;
  display:grid;
  align-content:end;
  gap:8px;
  margin-top:20px;
  padding:42px;
  border-radius:18px;
  overflow:hidden;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(21,24,29,.96),rgba(43,44,43,.78),rgba(255,0,0,.68)),
    url("hero-skate-premium.png") center/cover no-repeat;
  box-shadow:0 30px 80px rgba(22,25,29,.2);
}
.page-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(118deg,transparent 0 54%,rgba(255,255,255,.16) 54.3% 56%,transparent 56.3%);
}
.page-hero > *{
  position:relative;
  z-index:2;
}
.page-hero span{
  font-weight:1000;
}
.page-hero h1{
  max-width:760px;
  margin:0;
  font-size:clamp(2rem,4vw,4rem);
  line-height:1.12;
}
.page-hero p{
  max-width:620px;
  margin:0;
  color:rgba(255,255,255,.84);
  line-height:1.9;
}
.auth-page{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:16px;
  align-items:stretch;
  padding-top:42px;
}
.inline-auth{
  width:auto;
}
.login-benefits{
  display:grid;
  align-content:center;
  gap:12px;
  padding:28px;
  border-radius:16px;
  color:#fff;
  background:
    linear-gradient(135deg,rgba(21,24,29,.94),rgba(43,44,43,.74),rgba(255,0,0,.72)),
    url("gear-protective-premium.png") center/cover no-repeat;
  box-shadow:0 24px 58px rgba(22,25,29,.18);
}
.login-benefits h2{
  margin:0 0 10px;
}
.login-benefits span,
.service-card{
  padding:13px 14px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:11px;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(12px);
}
.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.service-card{
  min-height:120px;
  display:grid;
  align-content:center;
  border-color:rgba(43,44,43,.12);
  background:linear-gradient(180deg,#fff,#f4f6f8);
  box-shadow:0 18px 42px rgba(22,25,29,.09);
}
.service-card b,
.service-card span{
  display:block;
}
.service-card span{
  margin-top:8px;
  color:var(--muted);
}
.topbar{
  display:grid;
  grid-template-columns:auto 1fr auto;
}
.brand{
  justify-self:start;
}
.main-nav{
  justify-self:center;
}
.nav-actions{
  justify-self:end;
  direction:rtl;
}
.search-box{
  position:relative;
  width:178px;
  height:38px;
  display:block;
}
.search-box:before{
  content:"";
  position:absolute;
  right:12px;
  top:50%;
  width:11px;
  height:11px;
  border:2px solid #222;
  border-radius:50%;
  transform:translateY(-55%);
  z-index:2;
}
.search-box:after{
  content:"";
  position:absolute;
  right:24px;
  top:24px;
  width:8px;
  height:2px;
  background:#222;
  transform:rotate(45deg);
  z-index:2;
}
.search-box input{
  width:100%;
  height:100%;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  padding:0 36px 0 12px;
  color:#15181d;
  outline:0;
}
.articles-preview{
  padding-top:42px;
}
.article-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.article-card,
.article-row,
.article-feature{
  border:1px solid rgba(43,44,43,.12);
  border-radius:14px;
  overflow:hidden;
  background:linear-gradient(180deg,#fff,#f4f6f8);
  box-shadow:0 18px 42px rgba(22,25,29,.1);
}
.article-card{
  display:grid;
}
.article-card img{
  width:100%;
  height:190px;
  object-fit:cover;
}
.article-card span,
.article-row span,
.article-feature span{
  display:inline-flex;
  width:max-content;
  margin:18px 18px 0;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,0,0,.1);
  color:var(--red);
  font-size:.76rem;
  font-weight:1000;
}
.article-card h3,
.article-card p{
  margin-inline:18px;
}
.article-card h3{
  margin-top:12px;
  margin-bottom:8px;
  font-size:1.04rem;
}
.article-card p{
  margin-top:0;
  margin-bottom:20px;
  color:var(--muted);
  line-height:1.8;
  font-size:.84rem;
}
.articles-page{
  padding-top:42px;
}
.article-feature{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:0;
  min-height:330px;
}
.article-feature img,
.article-row img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.article-feature div{
  padding:30px;
}
.article-feature span,
.article-row span{
  margin:0 0 12px;
}
.article-feature h2,
.article-row h2{
  margin:0 0 10px;
}
.article-feature p,
.article-row p{
  color:var(--muted);
  line-height:1.9;
}
.article-list{
  display:grid;
  gap:14px;
  margin-top:14px;
}
.article-row{
  display:grid;
  grid-template-columns:260px 1fr;
}
.article-row div{
  padding:24px;
}
.catalog{
  display:grid;
  grid-template-columns:260px 1fr;
  gap:16px;
  padding-top:42px;
}
.filter-panel,
.checkout-card,
.summary-card,
.detail-info,
.detail-gallery{
  border:1px solid rgba(43,44,43,.12);
  border-radius:14px;
  background:linear-gradient(180deg,#fff,#f4f6f8);
  box-shadow:0 18px 42px rgba(22,25,29,.1);
}
.filter-panel{
  display:grid;
  align-content:start;
  gap:14px;
  padding:18px;
  position:sticky;
  top:92px;
}
.filter-panel h2,
.checkout-card h2,
.summary-card h2{
  margin:0;
}
.filter-panel label,
.checkout-card label{
  display:grid;
  gap:8px;
  font-weight:900;
  font-size:.86rem;
}
.filter-panel select,
.checkout-card input,
.checkout-card textarea,
.checkout-card select{
  min-height:44px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:10px;
  padding:0 12px;
  background:#fff;
  color:#15181d;
}
.checkout-card textarea{
  min-height:110px;
  padding-top:12px;
  resize:vertical;
}
.catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.product-link{
  width:100%;
  margin-bottom:10px;
  border:1px solid rgba(255,0,0,.18);
}
.detail-layout{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:16px;
  padding-top:42px;
}
.detail-gallery{
  padding:14px;
}
.detail-gallery > img{
  width:100%;
  height:460px;
  object-fit:cover;
  border-radius:12px;
  background:#15181d;
}
.detail-gallery div{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:10px;
}
.detail-gallery div img{
  width:100%;
  height:104px;
  object-fit:cover;
  border-radius:10px;
}
.detail-info{
  padding:26px;
}
.detail-info small{
  color:var(--red);
  font-weight:1000;
}
.detail-info h1{
  margin:10px 0;
  font-size:clamp(2rem,4vw,3.4rem);
}
.detail-info p,
.spec-list{
  color:var(--muted);
  line-height:1.9;
}
.detail-price{
  display:block;
  margin:18px 0;
  color:var(--red);
  font-size:1.2rem;
}
.size-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:18px;
}
.size-chips span{
  padding:9px 12px;
  border-radius:9px;
  background:#fff;
  border:1px solid rgba(43,44,43,.12);
  font-weight:900;
}
.detail-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:18px;
}
.spec-list{
  margin:0;
  padding-right:18px;
}
.checkout-layout{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:16px;
  padding-top:42px;
}
.checkout-card,
.summary-card{
  padding:22px;
}
.checkout-card{
  display:grid;
  gap:14px;
}
.checkout-item{
  display:grid;
  grid-template-columns:92px 1fr auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:12px;
  background:#fff;
}
.checkout-item img{
  width:92px;
  height:76px;
  object-fit:cover;
  border-radius:10px;
}
.checkout-item span,
.summary-card span{
  color:var(--muted);
}
.summary-card{
  display:grid;
  align-content:start;
  gap:14px;
}
.summary-card b{
  padding-top:12px;
  border-top:1px solid rgba(43,44,43,.12);
  color:var(--red);
}
@media (max-width:960px){
  .account-grid,
  .admin-grid{
    grid-template-columns:1fr;
  }
  .admin-metrics{
    grid-template-columns:repeat(2,1fr);
  }
  .auth-page,
  .service-grid,
  .article-grid,
  .article-feature,
  .article-row,
  .catalog,
  .catalog-grid,
  .detail-layout,
  .checkout-layout{
    grid-template-columns:1fr;
  }
  .filter-panel{position:static}
  .article-row img{
    height:220px;
  }
  .search-box{
    width:140px;
  }
}
@media (max-width:680px){
  .topbar{
    grid-template-columns:1fr auto;
  }
  .nav-actions{
    gap:8px;
  }
  .search-box{
    display:none;
  }
  .page-hero{
    min-height:240px;
    padding:28px 18px;
  }
  .admin-metrics{
    grid-template-columns:1fr;
  }
  .order-list article{
    grid-template-columns:1fr;
  }
  .order-list em{
    justify-self:start;
  }
  .admin-panel{
    overflow:auto;
  }
}

/* Final layout fixes for the PHP storefront. */
.product-card:before{
  content:none!important;
  display:none!important;
}
.status-badge{
  box-shadow:0 10px 22px rgba(22,25,29,.18);
}
.product-card small,
.product-card h3{
  direction:rtl;
}
.club-form{
  display:grid;
  gap:12px;
  align-content:start;
}
.club-form button{
  width:100%;
}
.footer-trust{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  margin-bottom:28px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.1);
}
.footer-trust span{
  min-height:58px;
  display:grid;
  place-items:center;
  padding:12px;
  background:rgba(255,255,255,.06);
  text-align:center;
  font-weight:700;
}
.drawer-head button{
  display:grid;
  place-items:center;
  line-height:1;
}
@media (max-width:960px){
  .footer-trust{
    grid-template-columns:repeat(2,1fr);
  }
}
@media (max-width:680px){
  .club-contact{
    padding:22px 16px;
  }
  .club-form{
    grid-template-columns:1fr;
  }
  .drawer-search{
    grid-template-columns:1fr;
  }
  .footer-trust{
    grid-template-columns:1fr;
  }
}

/* Product detail purchase controls */
.product-purchase{
  display:grid;
  gap:14px;
  margin:22px 0;
  padding:18px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:16px;
  background:linear-gradient(145deg,#fff,#f5f6f7);
  box-shadow:0 18px 44px rgba(22,25,29,.09);
}
.purchase-options,
.purchase-row{
  display:grid;
  gap:10px;
}
.option-title,
.qty-box span,
.stock-note{
  color:#2b2c2b;
  font-size:.84rem;
  font-weight:700;
}
.size-options{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.size-option{
  cursor:pointer;
}
.size-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.size-option span{
  min-width:50px;
  min-height:42px;
  display:grid;
  place-items:center;
  padding:0 14px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:12px;
  background:#fff;
  color:#2b2c2b;
  font-weight:700;
  transition:.2s var(--ease);
}
.size-option input:checked + span{
  border-color:transparent;
  background:linear-gradient(135deg,#2b2c2b,#ff0000);
  color:#fff;
  box-shadow:0 12px 24px rgba(255,0,0,.2);
}
.purchase-row{
  grid-template-columns:minmax(130px,180px) 1fr;
  align-items:end;
}
.qty-box{
  display:grid;
  gap:8px;
}
.qty-box input{
  width:100%;
  min-height:46px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:12px;
  background:#fff;
  padding:0 14px;
  color:#15181d;
  font-weight:700;
  text-align:center;
}
.stock-note{
  min-height:46px;
  display:flex;
  align-items:center;
  padding:0 14px;
  border-radius:12px;
  background:rgba(255,0,0,.07);
  color:var(--red);
}

/* Club request card with a richer background */
.club-contact{
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(21,24,29,.95),rgba(43,44,43,.75),rgba(255,0,0,.62)),
    url("hero-skate-premium.png") center/cover no-repeat;
}
.club-contact:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(118deg,transparent 0 56%,rgba(255,255,255,.14) 56.3% 58%,transparent 58.3%);
  pointer-events:none;
}
.club-contact > *{
  position:relative;
  z-index:1;
}
.club-copy p{
  color:rgba(255,255,255,.82);
}
.club-stats b{
  background:rgba(255,255,255,.14);
  color:#fff;
}
.club-form{
  padding:18px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:14px;
  background:rgba(255,255,255,.13);
  box-shadow:0 22px 54px rgba(0,0,0,.18);
  backdrop-filter:blur(14px);
}
.club-form label{
  color:#fff;
}
.club-form input,
.club-form textarea{
  border-color:rgba(255,255,255,.26);
  background:rgba(255,255,255,.92);
}

/* Compact footer */
.footer{
  padding:24px 0 18px;
}
.footer-trust{
  margin-bottom:18px;
}
.footer-trust span{
  min-height:44px;
  padding:9px 10px;
  font-size:.82rem;
}
.footer-grid-wide{
  grid-template-columns:1.15fr repeat(3,.75fr);
  gap:18px;
}
.footer h2{
  font-size:1.12rem;
  margin-bottom:8px;
}
.footer h3{
  font-size:.94rem;
  margin-bottom:8px;
}
.footer p{
  margin:6px 0;
  font-size:.84rem;
  line-height:1.65;
}
.footer a{
  margin:6px 0;
  font-size:.84rem;
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.68);
  font-size:.8rem;
}

/* Form polish and small visual bug fixes */
input[type="checkbox"],
.clean-form input[type="checkbox"],
.filter-panel input[type="checkbox"],
.checkout-card input[type="checkbox"],
.club-form input[type="checkbox"]{
  width:18px;
  height:18px;
  min-height:18px;
  padding:0;
  margin:0;
  accent-color:#ff0000;
  flex:0 0 auto;
}
.inline-check{
  display:flex!important;
  grid-template-columns:none!important;
  align-items:center;
  justify-content:flex-start;
  gap:9px!important;
  min-height:42px;
  padding:10px 12px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:12px;
  background:#fff;
}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.form-grid .full{
  grid-column:1/-1;
}
.clean-form .btn,
.checkout-card .btn{
  width:max-content;
  min-width:150px;
}
.link-button{
  border:0;
  background:transparent;
  color:var(--red);
  font-weight:700;
  cursor:pointer;
}
.cart-row{
  display:grid;
  grid-template-columns:76px minmax(0,1fr) auto 86px auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:12px;
  background:#fff;
}
.cart-row img{
  width:76px;
  height:66px;
  object-fit:cover;
  border-radius:10px;
  background:#f4f6f8;
}
.cart-row input[type="number"]{
  width:86px;
  min-height:40px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:10px;
  text-align:center;
}
@media (max-width:960px){
  .footer-grid-wide{
    grid-template-columns:1fr 1fr;
  }
}
@media (max-width:680px){
  .purchase-row,
  .form-grid,
  .footer-grid-wide,
  .cart-row{
    grid-template-columns:1fr;
  }
  .clean-form .btn,
  .checkout-card .btn{
    width:100%;
  }
  .footer-bottom{
    flex-direction:column;
  }
}

/* Header and account/admin dashboard refinement */
.top-strip{
  background:linear-gradient(90deg,#15181d,#2b2c2b 38%,#e00000 70%,#15181d);
}
.strip-inner{
  min-width:0;
}
.topbar{
  height:76px;
  padding:0 18px;
  border:1px solid rgba(255,0,0,.14);
  border-radius:18px;
  background:rgba(255,255,255,.9);
  box-shadow:0 18px 54px rgba(22,25,29,.14);
}
.topbar:before{
  border-radius:18px;
}
.brand{
  min-width:max-content;
}
.brand-mark{
  width:46px;
  height:46px;
  border-radius:14px;
  background:
    linear-gradient(135deg,#15181d 0%,#2b2c2b 48%,#ff0000 100%);
}
.brand strong{
  font-size:1.05rem;
}
.brand small{
  margin-top:3px;
  color:#8a8e96;
  font-size:.6rem;
}
.main-nav{
  padding:6px;
  gap:4px;
  border:1px solid rgba(43,44,43,.08);
  border-radius:999px;
  background:#f4f6f8;
}
.main-nav a{
  min-height:34px;
  display:flex;
  align-items:center;
  padding:0 13px;
  border-radius:999px;
  color:#3f4247;
}
.main-nav a.active,
.main-nav a:hover{
  background:#fff;
  box-shadow:0 8px 20px rgba(22,25,29,.08);
}
.main-nav a.active:after{
  content:none;
}
.nav-actions{
  gap:8px;
}
.search-box{
  width:190px;
}
.search-box input{
  border-color:rgba(43,44,43,.1);
  background:#f8f9fa;
}
.login-link{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 12px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:11px;
  background:#fff;
  font-size:.8rem;
  font-weight:700;
}
.login-link.is-dark{
  background:#15181d;
  color:#fff;
}
.icon.bag{
  border-color:rgba(43,44,43,.1);
  box-shadow:0 8px 18px rgba(22,25,29,.06);
}
.dashboard-shell{
  grid-template-columns:248px minmax(0,1fr);
  gap:16px;
  padding-top:30px;
}
.dashboard-side{
  top:92px;
  gap:7px;
  padding:12px;
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#f5f6f7);
}
.dashboard-user{
  border:1px solid rgba(43,44,43,.08);
  background:#fff;
}
.dashboard-user small{
  color:var(--muted);
  line-height:1.6;
}
.dashboard-side button,
.dashboard-side .side-link{
  min-height:40px;
  border-radius:11px;
  font-size:.84rem;
}
.dashboard-side button.active,
.dashboard-side button:hover,
.dashboard-side .side-link:hover{
  background:linear-gradient(135deg,#15181d,#ff0000);
  color:#fff;
  border-color:transparent;
  box-shadow:0 12px 24px rgba(255,0,0,.16);
}
.dashboard-panel{
  padding:18px;
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#fafafa);
}
.dashboard-panel h2,
.panel-headline h2{
  margin-top:0;
}
.panel-headline p{
  margin-top:6px;
  color:var(--muted);
  line-height:1.8;
}
.metric-grid{
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
}
.metric-grid article{
  min-height:104px;
  border-radius:14px;
  background:linear-gradient(145deg,#fff,#f4f6f8);
}
.metric-grid b{
  margin-top:6px;
}
.quick-grid{
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
}
.quick-grid a{
  min-height:54px;
  display:flex;
  align-items:center;
  border-radius:13px;
  font-weight:700;
}
.admin-two-col,
.admin-three-col{
  align-items:start;
}
.admin-card{
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#fafafa);
}
.admin-card h3{
  margin-top:0;
}
.admin-table-wrap{
  border-radius:16px;
}
.admin-table th{
  white-space:nowrap;
  background:#f6f7f8;
}
.admin-table td{
  vertical-align:middle;
}
.inline-form select,
.admin-list-row select,
.clean-form select{
  min-height:40px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:10px;
  background:#fff;
  padding:0 10px;
}
.admin-list-row{
  border-radius:13px;
}
.admin-list-row b{
  display:block;
  line-height:1.6;
}
.user-row{
  grid-template-columns:minmax(0,1fr) 140px auto;
}
.mini-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  margin-right:6px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(255,0,0,.09);
  color:var(--red);
  font-size:.72rem;
  font-style:normal;
}
.clean-form{
  display:grid;
  gap:14px;
}
.clean-form h2,
.clean-form h3{
  margin-top:0;
}
.clean-form input,
.clean-form select,
.clean-form textarea{
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease);
}
.clean-form input:focus,
.clean-form select:focus,
.clean-form textarea:focus,
.search-box input:focus{
  border-color:rgba(255,0,0,.42);
  box-shadow:0 0 0 4px rgba(255,0,0,.08);
  outline:0;
}
.auth-hero{
  padding-top:30px;
}
.auth-copy,
.auth-glass{
  border-radius:18px;
}
.auth-notice{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:10px;
  align-items:start;
  margin-bottom:14px;
  padding:12px 14px;
  border:1px solid rgba(227,6,19,.18);
  border-radius:14px;
  background:linear-gradient(180deg,#fff6f6,#fff);
  color:#521518;
  box-shadow:0 12px 28px rgba(227,6,19,.08);
}
.auth-notice:before{
  content:"!";
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#e30613;
  color:#fff;
  font-weight:1000;
  direction:ltr;
}
.auth-notice b,
.auth-notice span{
  display:block;
}
.auth-notice span{
  margin-top:4px;
  color:#7a4447;
  font-size:.84rem;
  line-height:1.7;
}
@media (max-width:1060px){
  .main-nav a{
    padding:0 9px;
    font-size:.8rem;
  }
  .search-box{
    width:150px;
  }
}
@media (max-width:960px){
  .topbar{
    grid-template-columns:auto auto;
  }
  .main-nav{
    display:none;
  }
  .menu-toggle{
    display:block;
  }
  .dashboard-shell{
    grid-template-columns:1fr;
  }
  .dashboard-side{
    position:static;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .dashboard-user{
    grid-column:1/-1;
  }
  .admin-three-col{
    grid-template-columns:1fr;
  }
}
@media (max-width:680px){
  .top-strip{
    height:auto;
    min-height:32px;
  }
  .topbar{
    height:auto;
    grid-template-columns:1fr auto;
    padding:10px;
    border-radius:0 0 16px 16px;
  }
  .brand-mark{
    width:40px;
    height:40px;
  }
  .brand strong{
    font-size:.95rem;
  }
  .nav-actions .icon.bag{
    display:block;
  }
  .dashboard-side,
  .user-row{
    grid-template-columns:1fr;
  }
  .dashboard-panel{
    padding:14px;
  }
  .admin-table{
    min-width:760px;
  }
}

.chat-widget{
  position:fixed;
  left:22px;
  bottom:22px;
  z-index:95;
  direction:rtl;
}
.chat-fab{
  min-height:52px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 16px;
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg,#15181d,#e30613);
  color:#fff;
  box-shadow:0 18px 44px rgba(22,25,29,.22);
  cursor:pointer;
  font-weight:1000;
}
.chat-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#3cff83;
  box-shadow:0 0 0 6px rgba(60,255,131,.16);
}
.chat-panel{
  position:absolute;
  left:0;
  bottom:66px;
  width:min(370px,calc(100vw - 28px));
  overflow:hidden;
  border:1px solid rgba(43,44,43,.12);
  border-radius:20px;
  background:#fff;
  box-shadow:0 28px 80px rgba(22,25,29,.26);
  opacity:0;
  pointer-events:none;
  transform:translateY(12px);
  transition:.24s var(--ease);
}
.chat-widget.open .chat-panel{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
.chat-panel header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:16px;
  background:linear-gradient(135deg,#15181d,#5c626d 58%,#e30613);
  color:#fff;
}
.chat-panel header span{
  display:block;
  margin-top:5px;
  color:rgba(255,255,255,.78);
  font-size:.78rem;
  line-height:1.6;
}
.chat-panel header button{
  width:32px;
  height:32px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:10px;
  background:rgba(255,255,255,.12);
  color:#fff;
  cursor:pointer;
  font-size:20px;
}
.chat-messages{
  height:270px;
  display:grid;
  align-content:start;
  gap:10px;
  padding:14px;
  overflow:auto;
  background:#f6f7f9;
}
.chat-message{
  max-width:88%;
  padding:10px 12px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 20px rgba(22,25,29,.08);
}
.chat-message.is-admin{
  justify-self:start;
  background:#15181d;
  color:#fff;
}
.chat-message.is-customer{
  justify-self:end;
}
.chat-message b,
.chat-message time{
  display:block;
  font-size:.72rem;
  color:inherit;
  opacity:.72;
}
.chat-message p{
  margin:5px 0;
  line-height:1.7;
  white-space:pre-wrap;
}
.chat-empty,
.chat-loading{
  padding:14px;
  border:1px dashed rgba(43,44,43,.18);
  border-radius:14px;
  color:var(--muted);
  text-align:center;
}
.chat-form{
  display:grid;
  gap:8px;
  padding:12px;
}
.chat-form input,
.chat-form select,
.chat-form textarea{
  width:100%;
  min-height:42px;
  border:1px solid rgba(43,44,43,.14);
  border-radius:10px;
  padding:0 11px;
  background:#fff;
}
.chat-form textarea{
  min-height:76px;
  padding-top:10px;
  resize:vertical;
}
@media (max-width:680px){
  .chat-widget{
    left:10px;
    right:10px;
    bottom:10px;
  }
  .chat-fab{
    margin-right:auto;
  }
  .chat-panel{
    left:0;
    width:100%;
  }
  .trust-strip div{
    padding-right:64px;
  }
}

/* Real category photo system */
.category-showcase{
  display:grid;
  gap:22px;
}
.category-band{
  position:relative;
  overflow:hidden;
  padding:22px;
  border:1px solid rgba(43,44,43,.11);
  border-radius:22px;
  background:
    linear-gradient(120deg,rgba(255,255,255,.98),rgba(246,247,248,.94)),
    radial-gradient(circle at 6% 0,rgba(255,0,0,.13),transparent 36%);
  box-shadow:0 24px 62px rgba(22,25,29,.11);
}
.category-band:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(118deg,transparent 0 58%,rgba(255,0,0,.055) 58.3% 61%,transparent 61.3%),
    repeating-linear-gradient(90deg,rgba(43,44,43,.035) 0 1px,transparent 1px 72px);
  pointer-events:none;
}
.category-band:after{
  content:"";
  position:absolute;
  top:-90px;
  left:-70px;
  width:230px;
  height:230px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,0,0,.16),transparent 64%);
  pointer-events:none;
}
.category-band > *{
  position:relative;
  z-index:1;
}
.category-band-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
  padding-bottom:14px;
  border-bottom:1px solid rgba(43,44,43,.09);
}
.category-band-head span{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:1.18rem;
  font-weight:700;
}
.category-band-head span:before{
  content:"";
  width:12px;
  height:28px;
  border-radius:999px;
  background:linear-gradient(180deg,#15181d,#ff0000);
  box-shadow:0 10px 22px rgba(255,0,0,.18);
}
.category-band-head b{
  padding:7px 11px;
  border-radius:999px;
  background:linear-gradient(135deg,#15181d,#2b2c2b);
  color:#fff;
  font-size:.76rem;
}
.category-grid-dense{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.category-tile{
  position:relative;
  min-height:226px;
  padding:10px;
  border:1px solid rgba(43,44,43,.09);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#f8f9fa);
  box-shadow:0 14px 34px rgba(22,25,29,.07);
  isolation:isolate;
}
.category-tile span{
  width:100%;
  height:162px;
  border-radius:15px;
  background:#111318;
  box-shadow:none;
  overflow:hidden;
}
.category-tile img,
.category-tile:nth-child(4) img,
.category-tile:nth-child(5) img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .28s var(--ease),filter .28s var(--ease);
}
.category-tile b{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  line-height:1.55;
  padding:8px 6px 2px;
  color:#202225;
  font-size:.9rem;
}
.category-tile:after{
  content:"مشاهده محصولات";
  position:absolute;
  right:18px;
  left:18px;
  bottom:15px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(21,24,29,.92);
  color:#fff;
  font-size:.72rem;
  font-weight:700;
  opacity:0;
  transform:translateY(8px);
  transition:.22s var(--ease);
}
.category-tile:hover{
  transform:translateY(-5px);
  border-color:rgba(255,0,0,.2);
  box-shadow:0 24px 54px rgba(22,25,29,.14);
}
.category-tile:hover img{
  transform:scale(1.06);
  filter:saturate(1.08) contrast(1.04);
}
.category-tile:hover:after{
  opacity:1;
  transform:translateY(0);
}
.tone-red{
  border-color:rgba(255,0,0,.14);
}
.tone-dark{
  background:
    linear-gradient(120deg,rgba(255,255,255,.98),rgba(244,245,245,.94)),
    radial-gradient(circle at 6% 0,rgba(43,44,43,.12),transparent 36%);
}
.tone-steel{
  background:
    linear-gradient(120deg,rgba(255,255,255,.98),rgba(238,241,244,.95)),
    radial-gradient(circle at 6% 0,rgba(138,142,150,.18),transparent 36%);
}
.tone-ash{
  background:
    linear-gradient(120deg,rgba(255,255,255,.98),rgba(242,243,243,.95)),
    radial-gradient(circle at 6% 0,rgba(90,96,103,.16),transparent 36%);
}
@media (max-width:960px){
  .category-grid-dense{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width:680px){
  .category-band{
    padding:14px;
    border-radius:18px;
  }
  .category-grid-dense{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .category-tile{
    min-height:172px;
    border-radius:15px;
  }
  .category-tile span{
    height:112px;
    border-radius:12px;
  }
  .category-tile b{
    min-height:44px;
    font-size:.78rem;
  }
  .category-tile:after{
    display:none;
  }
  .category-band-head{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
}

/* Header products mega menu */
.main-nav{
  position:relative;
}
.nav-item{
  position:relative;
  display:flex;
  align-items:center;
}
.has-mega:after{
  content:"";
  position:absolute;
  top:100%;
  right:50%;
  z-index:119;
  width:min(940px,calc(100vw - 36px));
  height:24px;
  transform:translateX(50%);
}
.nav-products{
  gap:8px;
}
.nav-burger{
  width:18px;
  display:grid;
  gap:3px;
}
.nav-burger i{
  display:block;
  height:2px;
  border-radius:999px;
  background:currentColor;
}
.nav-burger i:nth-child(2){
  width:13px;
}
.mega-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:50%;
  z-index:120;
  width:min(940px,calc(100vw - 36px));
  padding:18px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:20px;
  background:rgba(255,255,255,.96);
  box-shadow:0 28px 80px rgba(22,25,29,.2);
  backdrop-filter:blur(18px);
  opacity:0;
  visibility:hidden;
  transform:translate(50%,10px);
  pointer-events:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s var(--ease);
}
.mega-menu:before{
  content:"";
  position:absolute;
  top:-7px;
  right:50%;
  width:16px;
  height:16px;
  border-top:1px solid rgba(43,44,43,.12);
  border-right:1px solid rgba(43,44,43,.12);
  background:rgba(255,255,255,.96);
  transform:translateX(50%) rotate(-45deg);
}
.has-mega:hover .mega-menu,
.has-mega:focus-within .mega-menu{
  opacity:1;
  visibility:visible;
  transform:translate(50%,0);
  pointer-events:auto;
}
.mega-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
  padding:12px 14px;
  border-radius:14px;
  background:linear-gradient(135deg,#15181d,#2b2c2b 64%,#ff0000);
  color:#fff;
}
.mega-head strong{
  font-size:1rem;
}
.mega-head a{
  min-height:auto;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:.78rem;
}
.mega-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.mega-group{
  min-width:0;
  padding:13px;
  border:1px solid rgba(43,44,43,.09);
  border-radius:15px;
  background:linear-gradient(180deg,#fff,#f6f7f8);
}
.mega-group h3{
  margin:0 0 10px;
  padding-bottom:9px;
  border-bottom:1px solid rgba(43,44,43,.08);
  color:#15181d;
  font-size:.9rem;
}
.mega-group a{
  min-height:32px;
  display:flex;
  align-items:center;
  padding:0 9px;
  border-radius:9px;
  color:#555b64;
  font-size:.78rem;
  line-height:1.5;
}
.mega-group a:hover{
  background:rgba(255,0,0,.08);
  color:var(--red);
  box-shadow:none;
}
@media (max-width:960px){
  .mega-menu{
    display:none;
  }
}

/* Main category section: only top-level groups on homepage */
.main-category-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.main-category-card{
  position:relative;
  min-height:330px;
  display:grid;
  grid-template-rows:1fr auto;
  overflow:hidden;
  border:1px solid rgba(43,44,43,.12);
  border-radius:22px;
  background:#15181d;
  box-shadow:0 24px 62px rgba(22,25,29,.13);
  isolation:isolate;
  transition:.26s var(--ease);
}
.main-category-card:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg,transparent 18%,rgba(0,0,0,.16) 48%,rgba(0,0,0,.82)),
    radial-gradient(circle at 12% 8%,rgba(255,0,0,.3),transparent 36%);
  pointer-events:none;
}
.main-category-card:after{
  content:"";
  position:absolute;
  inset:14px;
  z-index:2;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  pointer-events:none;
}
.main-category-media{
  position:relative;
  min-height:230px;
}
.main-category-media img{
  position:absolute;
  width:58%;
  height:64%;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  box-shadow:0 18px 40px rgba(0,0,0,.28);
  transition:.3s var(--ease);
}
.main-category-media img:nth-child(1){
  top:24px;
  right:20px;
  z-index:3;
}
.main-category-media img:nth-child(2){
  top:62px;
  left:18px;
  z-index:2;
  transform:rotate(-4deg);
}
.main-category-media img:nth-child(3){
  right:64px;
  bottom:4px;
  z-index:1;
  transform:rotate(5deg);
  opacity:.9;
}
.main-category-copy{
  position:relative;
  z-index:3;
  display:grid;
  gap:7px;
  padding:0 24px 24px;
  color:#fff;
}
.main-category-copy span{
  font-size:1.35rem;
  font-weight:700;
}
.main-category-copy b{
  color:rgba(255,255,255,.78);
  font-size:.86rem;
}
.main-category-copy small{
  width:max-content;
  margin-top:6px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:.76rem;
  font-weight:700;
}
.main-category-card:hover{
  transform:translateY(-7px);
  box-shadow:0 34px 84px rgba(22,25,29,.2);
}
.main-category-card:hover .main-category-media img:nth-child(1){
  transform:translateY(-5px) scale(1.04);
}
.main-category-card:hover .main-category-media img:nth-child(2){
  transform:translateY(-3px) rotate(-7deg) scale(1.03);
}
.main-category-card:hover .main-category-media img:nth-child(3){
  transform:translateY(-4px) rotate(8deg) scale(1.03);
}
.main-category-card.tone-dark:before{
  background:linear-gradient(180deg,transparent 18%,rgba(0,0,0,.22) 48%,rgba(0,0,0,.86)),radial-gradient(circle at 12% 8%,rgba(43,44,43,.42),transparent 36%);
}
.main-category-card.tone-steel:before{
  background:linear-gradient(180deg,transparent 18%,rgba(0,0,0,.18) 48%,rgba(0,0,0,.84)),radial-gradient(circle at 12% 8%,rgba(138,142,150,.42),transparent 36%);
}
.main-category-card.tone-ash:before{
  background:linear-gradient(180deg,transparent 18%,rgba(0,0,0,.2) 48%,rgba(0,0,0,.84)),radial-gradient(circle at 12% 8%,rgba(90,96,103,.42),transparent 36%);
}
@media (max-width:960px){
  .main-category-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:680px){
  .main-category-grid{
    grid-template-columns:1fr;
    gap:12px;
  }
  .main-category-card{
    min-height:270px;
  }
  .main-category-media{
    min-height:180px;
  }
  .main-category-copy span{
    font-size:1.12rem;
  }
}

/* Search dropdown polish */
.search-box{
  z-index:130;
  position:relative;
  overflow:visible;
}
.topbar{
  overflow:visible;
}
.drawer-search{
  position:relative;
  overflow:visible;
}
.search-suggestions{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:150;
  width:min(390px,calc(100vw - 24px));
  max-height:min(520px,70vh);
  overflow:auto;
  padding:10px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:18px;
  background:rgba(255,255,255,.98);
  box-shadow:0 24px 70px rgba(22,25,29,.2);
  backdrop-filter:blur(16px);
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  pointer-events:none;
  transition:.18s var(--ease);
}
.search-suggestions.open{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}
.search-suggestions-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:6px 6px 10px;
}
.search-suggestions-head b{
  font-size:.86rem;
}
.search-suggestions-head a{
  color:var(--red);
  font-size:.76rem;
  font-weight:700;
}
.search-result{
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  min-height:74px;
  padding:8px;
  border-radius:14px;
  color:#15181d;
  transition:.18s var(--ease);
}
.search-result:hover{
  background:#f4f6f8;
}
.search-result img{
  width:58px;
  height:58px;
  object-fit:contain;
  border-radius:12px;
  background:linear-gradient(180deg,#fff,#eef0f2);
  padding:5px;
}
.search-result span{
  min-width:0;
  display:grid;
  gap:4px;
}
.search-result span b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.84rem;
}
.search-result span small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:.72rem;
}
.search-result em{
  color:var(--red);
  font-style:normal;
  font-size:.72rem;
  font-weight:700;
  white-space:nowrap;
}
.search-empty{
  padding:18px;
  color:var(--muted);
  text-align:center;
  font-size:.84rem;
}

/* More capable admin dashboard */
.admin-dashboard .page-hero,
.admin-dashboard{
  --admin-surface:#f7f8fa;
}
.admin-toolbar{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:12px;
  margin:0 0 14px;
  padding:14px;
  border:1px solid rgba(43,44,43,.08);
  border-radius:18px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(246,247,249,.92)),
    radial-gradient(circle at 0 0,rgba(255,0,0,.08),transparent 36%);
  box-shadow:0 16px 34px rgba(22,25,29,.07);
}
.admin-toolbar label{
  position:relative;
  min-width:min(380px,100%);
  display:grid;
  gap:7px;
  color:#2b2c2b;
  font-size:.8rem;
  font-weight:700;
}
.admin-toolbar label:before{
  content:"⌕";
  position:absolute;
  right:13px;
  bottom:11px;
  z-index:1;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#15181d;
  color:#fff;
  font-size:.82rem;
  line-height:1;
}
.admin-toolbar input{
  width:100%;
  min-height:48px;
  border:1px solid rgba(43,44,43,.11);
  border-radius:15px;
  background:#fff;
  padding:0 46px 0 14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 24px rgba(22,25,29,.04);
}
.admin-toolbar input:focus{
  border-color:rgba(255,0,0,.42);
  box-shadow:0 0 0 4px rgba(255,0,0,.08);
  outline:0;
}
.admin-dashboard .dashboard-panel{
  border:1px solid rgba(43,44,43,.08);
  border-radius:24px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,250,250,.96)),
    radial-gradient(circle at 0 0,rgba(255,0,0,.08),transparent 32%);
  box-shadow:0 26px 64px rgba(22,25,29,.08);
}
.admin-dashboard .panel-headline{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.admin-dashboard .panel-headline h2{
  position:relative;
  padding-right:14px;
}
.admin-dashboard .panel-headline h2:before{
  content:"";
  position:absolute;
  right:0;
  top:.25em;
  width:5px;
  height:1.25em;
  border-radius:999px;
  background:linear-gradient(180deg,#15181d,#ff0000);
}
.admin-dashboard .metric-grid article{
  position:relative;
  overflow:hidden;
  border:0;
  background:
    radial-gradient(circle at 6% 0,rgba(255,255,255,.16),transparent 36%),
    linear-gradient(135deg,#17191d,#30343c 52%,#e30613);
  color:#fff;
  box-shadow:0 20px 46px rgba(22,25,29,.16);
}
.admin-dashboard .metric-grid article span,
.admin-dashboard .metric-grid article small{
  color:rgba(255,255,255,.72);
}
.admin-dashboard .metric-grid article b{
  color:#fff;
}
.admin-dashboard .metric-grid article:after{
  content:"";
  position:absolute;
  left:-36px;
  top:-36px;
  width:96px;
  height:96px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
}
.admin-dashboard .quick-grid a,
.admin-dashboard .panel-action{
  transition:.18s var(--ease);
}
.admin-dashboard .quick-grid a:hover,
.admin-dashboard .panel-action:hover{
  border-color:rgba(255,0,0,.22);
  color:var(--red);
  transform:translateY(-1px);
}
.admin-dashboard .admin-card{
  box-shadow:0 14px 34px rgba(22,25,29,.07);
}
.admin-dashboard .clean-form.admin-card,
.admin-dashboard .compact-form.admin-card{
  border:1px solid rgba(43,44,43,.08);
  border-radius:20px;
  background:linear-gradient(180deg,#fff,#f8f9fb);
}
.admin-dashboard .clean-form label{
  color:#343840;
  font-size:.78rem;
  font-weight:800;
}
.admin-dashboard .clean-form input,
.admin-dashboard .clean-form select,
.admin-dashboard .clean-form textarea,
.admin-dashboard .admin-table select,
.admin-dashboard .admin-list-row select{
  width:100%;
  min-height:44px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:13px;
  background:#fff;
  padding:0 12px;
  color:#15181d;
  box-shadow:0 8px 18px rgba(22,25,29,.04);
}
.admin-dashboard .clean-form textarea{
  min-height:104px;
  padding-block:10px;
}
.admin-dashboard .clean-form input:focus,
.admin-dashboard .clean-form select:focus,
.admin-dashboard .clean-form textarea:focus,
.admin-dashboard .admin-table select:focus,
.admin-dashboard .admin-list-row select:focus{
  border-color:rgba(227,6,19,.42);
  box-shadow:0 0 0 4px rgba(227,6,19,.08);
  outline:0;
}
.admin-dashboard .admin-table-wrap{
  border-radius:20px;
  border:1px solid rgba(43,44,43,.08);
  box-shadow:0 18px 42px rgba(22,25,29,.06);
}
.admin-dashboard .admin-table thead th{
  background:#15181d;
  color:#fff;
}
.admin-dashboard .admin-table tbody tr:hover{
  background:#fff7f8;
}
.admin-dashboard .inline-check{
  min-height:44px;
  align-items:center;
  border:1px solid rgba(43,44,43,.09);
  border-radius:14px;
  background:#fff;
  padding:10px 12px;
}
.admin-dashboard .inline-check input{
  width:18px;
  height:18px;
  min-height:18px;
  box-shadow:none;
}
.admin-dashboard .dashboard-side{
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 18% 0,rgba(255,0,0,.22),transparent 28%),
    linear-gradient(180deg,#15181d,#242832);
  box-shadow:0 26px 60px rgba(22,25,29,.18);
}
.admin-dashboard .dashboard-user,
.admin-dashboard .dashboard-side button{
  border-color:rgba(255,255,255,.1);
  background:rgba(255,255,255,.06);
  color:#fff;
}
.admin-dashboard .dashboard-side button:hover,
.admin-dashboard .dashboard-side button.active{
  background:#fff;
  color:#15181d;
}
.admin-dashboard .dashboard-user small,
.admin-dashboard .dashboard-user p{
  color:rgba(255,255,255,.7);
}
.admin-dashboard .avatar{
  background:linear-gradient(135deg,#fff,#e9edf2);
  color:#e30613;
  box-shadow:0 14px 30px rgba(0,0,0,.2);
}
.admin-dashboard .admin-list-row{
  transition:.18s var(--ease);
}
.admin-dashboard .admin-list-row:hover{
  border-color:rgba(255,0,0,.18);
  box-shadow:0 12px 26px rgba(22,25,29,.07);
}

/* Responsive image hardening */
img{
  max-width:100%;
}
.product-media,
.detail-gallery > img,
.article-card img,
.article-row img,
.article-feature img,
.promo-card,
.main-category-media,
.category-tile span,
.checkout-item img,
.cart-row img{
  overflow:hidden;
}
.product-media img,
.detail-gallery > img,
.detail-gallery div img,
.article-card img,
.article-row img,
.article-feature img,
.checkout-item img,
.cart-row img,
.main-category-media img{
  display:block;
}
@media (max-width:680px){
  .search-suggestions{
    position:fixed;
    top:78px;
    right:9px;
    left:9px;
    width:auto;
    max-height:62vh;
  }
.drawer-search .search-suggestions{
    position:absolute;
    top:calc(100% + 8px);
    right:0;
    left:0;
    width:auto;
    max-height:54vh;
  }
  .search-result{
    grid-template-columns:52px minmax(0,1fr);
  }
  .search-result em{
    grid-column:2;
    justify-self:start;
  }
  .admin-toolbar,
  .admin-dashboard .panel-headline{
    flex-direction:column;
    align-items:stretch;
  }
  .admin-toolbar label,
  .admin-toolbar .panel-action{
    width:100%;
  }
  .product-media{
    height:auto;
    aspect-ratio:1 / .82;
    padding:12px;
    border-radius:16px;
  }
  .product-media img{
    width:100%;
    height:100%;
    max-width:100%;
    max-height:100%;
    object-fit:contain!important;
  }
  .detail-gallery > img{
    height:clamp(260px,78vw,380px);
    object-fit:contain;
    padding:12px;
    background:linear-gradient(180deg,#fff,#f3f5f6);
  }
  .detail-gallery div img{
    height:86px;
  }
  .article-card img,
  .article-row img,
  .article-feature img{
    height:clamp(180px,54vw,260px);
    object-fit:cover;
  }
  .promo-card{
    min-height:190px;
  }
  .promo-card img{
    width:58%;
    height:100%;
    object-fit:cover;
  }
}

/* Order detail page */
.order-detail{
  display:grid;
  gap:16px;
  padding:42px 0 54px;
}
.order-hero-card{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:190px;
  padding:28px;
  border-radius:24px;
  background:
    radial-gradient(circle at 8% 16%,rgba(255,255,255,.18),transparent 30%),
    linear-gradient(135deg,#15181d,#343943 56%,#e30613);
  color:#fff;
  box-shadow:0 28px 70px rgba(22,25,29,.18);
}
.order-hero-card:after{
  content:"";
  position:absolute;
  left:-70px;
  bottom:-90px;
  width:230px;
  height:230px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
}
.order-hero-card > *{
  position:relative;
  z-index:1;
}
.order-hero-card .eyebrow{
  display:inline-flex;
  margin-bottom:10px;
  padding:7px 11px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.1);
  color:rgba(255,255,255,.86);
  font-size:.76rem;
  font-weight:900;
}
.order-hero-card h1{
  margin:0;
  direction:ltr;
  text-align:right;
  font-size:clamp(2rem,4vw,4rem);
  letter-spacing:0;
}
.order-hero-card p{
  margin:10px 0 0;
  color:rgba(255,255,255,.78);
}
.order-hero-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.order-pill{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  padding:0 15px;
  border-radius:999px;
  background:#fff;
  color:#15181d;
  font-size:.84rem;
  font-weight:1000;
}
.order-pill.is-success,
.order-status-grid .is-success{
  color:#0b8f53;
}
.order-pill.is-danger,
.order-status-grid .is-danger{
  color:#c91d2e;
}
.order-pill.is-waiting,
.order-status-grid .is-waiting{
  color:#b06a00;
}
.order-status-grid,
.order-info-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.order-status-grid article,
.order-panel{
  border:1px solid rgba(43,44,43,.09);
  border-radius:20px;
  background:linear-gradient(180deg,#fff,#f7f8fa);
  box-shadow:0 18px 42px rgba(22,25,29,.07);
}
.order-status-grid article{
  min-height:108px;
  display:grid;
  align-content:center;
  gap:8px;
  padding:18px;
}
.order-status-grid small,
.order-total-row span,
.order-mini-info span,
.order-panel p span{
  color:var(--muted);
  font-size:.78rem;
  font-weight:900;
}
.order-status-grid b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#15181d;
  font-size:.95rem;
}
.order-detail-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:16px;
  align-items:start;
}
.order-panel{
  padding:22px;
}
.order-panel h2{
  margin:0 0 14px;
  font-size:1.05rem;
}
.order-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.order-panel-head h2{
  margin:0;
}
.order-panel-head span{
  color:var(--red);
  font-weight:1000;
}
.order-items{
  display:grid;
  gap:10px;
}
.order-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:14px;
  border:1px solid rgba(43,44,43,.08);
  border-radius:16px;
  background:#fff;
}
.order-item b,
.order-item span{
  display:block;
}
.order-item b{
  margin-bottom:6px;
  color:#15181d;
}
.order-item span{
  color:var(--muted);
  font-size:.82rem;
}
.order-item strong{
  color:var(--red);
  white-space:nowrap;
}
.order-summary-panel{
  position:sticky;
  top:92px;
  display:grid;
  gap:12px;
}
.order-total-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(43,44,43,.08);
}
.order-total-row b{
  white-space:nowrap;
}
.order-total-row.is-final{
  margin-top:4px;
  padding:15px;
  border:0;
  border-radius:16px;
  background:#15181d;
  color:#fff;
}
.order-total-row.is-final span,
.order-total-row.is-final b{
  color:#fff;
}
.order-mini-info{
  display:grid;
  gap:6px;
  padding:14px;
  border-radius:16px;
  background:#fff;
}
.order-info-grid{
  grid-template-columns:1fr 1.4fr;
}
.order-panel p{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin:10px 0;
}
.order-panel p strong{
  color:#15181d;
  text-align:left;
}
.order-address{
  display:block!important;
  color:#343840;
  line-height:1.9;
}
.order-payment-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  padding:16px;
  border:1px solid rgba(255,0,0,.12);
  border-radius:18px;
  background:#fff7f8;
}
@media (max-width:960px){
  .order-status-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .order-detail-grid,
  .order-info-grid{
    grid-template-columns:1fr;
  }
  .order-summary-panel{
    position:static;
  }
}
@media (max-width:680px){
  .order-detail{
    padding-top:24px;
  }
  .order-hero-card{
    align-items:flex-start;
    flex-direction:column;
    padding:22px;
    border-radius:20px;
  }
  .order-status-grid{
    grid-template-columns:1fr;
  }
  .order-item{
    grid-template-columns:1fr;
  }
  .order-item strong{
    justify-self:start;
  }
  .order-panel{
    padding:18px;
  }
  .order-panel p{
    display:grid;
    justify-content:stretch;
  }
}

/* Dashboard visual icons */
.dashboard-side button,
.dashboard-side .side-link{
  gap:10px;
}
.dash-icon,
.metric-card:before,
.quick-link:before,
.dashboard-panel h2:before,
.admin-list-row:before{
  --icon-bg:linear-gradient(135deg,#15181d,#e30613);
  --glass-tint:rgba(227,6,19,.24);
  --glyph:linear-gradient(rgba(255,255,255,.94) 0 0) center/12px 12px no-repeat;
  position:relative;
  flex:0 0 auto;
  width:30px;
  height:30px;
  display:inline-grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.34);
  border-radius:12px;
  background:
    var(--glyph),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.72),transparent 26%),
    linear-gradient(135deg,rgba(255,255,255,.34),var(--glass-tint)),
    var(--icon-bg);
  background-blend-mode:normal,screen,normal,normal;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.64),
    inset 0 -10px 22px rgba(255,255,255,.08),
    0 12px 28px rgba(22,25,29,.18);
  backdrop-filter:blur(12px) saturate(1.35);
  -webkit-backdrop-filter:blur(12px) saturate(1.35);
}
.dash-icon:before,
.metric-card:before,
.quick-link:before,
.dashboard-panel h2:before,
.admin-list-row:before{
  content:"";
}
.dash-icon:before{
  display:none;
}
.dash-icon:after{
  display:none;
}
.dashboard-side button.active .dash-icon,
.dashboard-side button:hover .dash-icon,
.dashboard-side .side-link:hover .dash-icon{
  border-color:rgba(255,255,255,.58);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    inset 0 -12px 28px rgba(255,255,255,.12),
    0 16px 34px rgba(227,6,19,.24);
}
.avatar-glow{
  position:relative;
  isolation:isolate;
}
.avatar-glow:before{
  content:"";
  position:absolute;
  inset:-7px;
  z-index:-1;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(227,6,19,.28),rgba(21,24,29,.18));
  filter:blur(2px);
}
.metric-card,
.quick-link{
  position:relative;
  overflow:hidden;
}
.metric-card{
  min-height:128px;
  padding-top:54px!important;
}
.metric-card:before{
  position:absolute;
  top:16px;
  right:16px;
  width:34px;
  height:34px;
  border-radius:14px;
}
.metric-card:after,
.quick-link:after{
  content:"";
  position:absolute;
  inset:auto auto -34px -34px;
  width:92px;
  height:92px;
  border-radius:50%;
  background:rgba(227,6,19,.07);
  pointer-events:none;
}
.quick-link{
  min-height:76px;
  display:flex!important;
  align-items:center;
  gap:12px;
  padding-right:14px!important;
}
.quick-link:before{
  width:34px;
  height:34px;
  border-radius:14px;
}
.dashboard-panel h2,
.panel-headline h2{
  display:flex;
  align-items:center;
  gap:10px;
}
.dashboard-panel h2:before{
  width:32px;
  height:32px;
  border-radius:13px;
}
.panel-headline h2:before{
  flex:0 0 auto;
}
.admin-list-row{
  position:relative;
  padding-right:58px;
}
.admin-list-row:before{
  position:absolute;
  right:14px;
  top:50%;
  width:30px;
  height:30px;
  transform:translateY(-50%);
  opacity:.92;
  border-radius:12px;
}
.icon-orders,
[data-dashboard-panel="orders"] h2:before{
  --icon-bg:linear-gradient(135deg,#15181d,#e30613);
  --glass-tint:rgba(227,6,19,.26);
  --glyph:
    linear-gradient(#fff 0 0) center 9px/14px 2px no-repeat,
    linear-gradient(#fff 0 0) center 15px/14px 2px no-repeat,
    linear-gradient(#fff 0 0) center 21px/9px 2px no-repeat,
    linear-gradient(transparent 25%,#fff 25% 75%,transparent 75%) center/18px 22px no-repeat;
}
.icon-products,
[data-dashboard-panel="products"] h2:before{
  --icon-bg:linear-gradient(135deg,#1b1f27,#ef7a18);
  --glass-tint:rgba(239,122,24,.28);
  --glyph:
    linear-gradient(135deg,transparent 49%,#fff 50% 56%,transparent 57%) center/18px 18px no-repeat,
    linear-gradient(45deg,transparent 49%,#fff 50% 56%,transparent 57%) center/18px 18px no-repeat,
    linear-gradient(#fff 0 0) center bottom 8px/18px 10px no-repeat;
}
.icon-profile,
[data-dashboard-panel="profile"] h2:before,
.icon-users,
[data-dashboard-panel="users"] h2:before{
  --icon-bg:linear-gradient(135deg,#18222e,#3074ff);
  --glass-tint:rgba(48,116,255,.28);
  --glyph:
    radial-gradient(circle at 50% 35%,#fff 0 5px,transparent 5.5px),
    radial-gradient(ellipse at 50% 82%,#fff 0 10px,transparent 10.5px);
}
.icon-address,
[data-dashboard-panel="addresses"] h2:before{
  --icon-bg:linear-gradient(135deg,#14352b,#11a06d);
  --glass-tint:rgba(17,160,109,.28);
  --glyph:
    radial-gradient(circle at 50% 39%,transparent 0 3px,#fff 3.5px 8px,transparent 8.5px),
    linear-gradient(45deg,#fff 0 50%,transparent 50%) center 20px/12px 12px no-repeat;
}
.icon-heart,
[data-dashboard-panel="wishlist"] h2:before{
  --icon-bg:linear-gradient(135deg,#371524,#f02f78);
  --glass-tint:rgba(240,47,120,.28);
  --glyph:
    radial-gradient(circle at 38% 39%,#fff 0 6px,transparent 6.5px),
    radial-gradient(circle at 62% 39%,#fff 0 6px,transparent 6.5px),
    linear-gradient(45deg,#fff 0 50%,transparent 50%) center 16px/15px 15px no-repeat;
}
.icon-club,
[data-dashboard-panel="club"] h2:before{
  --icon-bg:linear-gradient(135deg,#241b36,#8d46ff);
  --glass-tint:rgba(141,70,255,.28);
  --glyph:
    linear-gradient(#fff 0 0) center 11px/18px 3px no-repeat,
    linear-gradient(#fff 0 0) center 17px/18px 3px no-repeat,
    radial-gradient(circle at 20% 50%,#fff 0 3px,transparent 3.5px),
    radial-gradient(circle at 80% 50%,#fff 0 3px,transparent 3.5px);
}
.icon-security,
[data-dashboard-panel="security"] h2:before,
.icon-settings,
[data-dashboard-panel="settings"] h2:before{
  --icon-bg:linear-gradient(135deg,#1e252d,#64707d);
  --glass-tint:rgba(100,112,125,.28);
  --glyph:
    linear-gradient(#fff 0 0) center 10px/18px 2px no-repeat,
    linear-gradient(#fff 0 0) center 16px/18px 2px no-repeat,
    linear-gradient(#fff 0 0) center 22px/18px 2px no-repeat,
    radial-gradient(circle at 38% 10px,#fff 0 3px,transparent 3.5px),
    radial-gradient(circle at 64% 16px,#fff 0 3px,transparent 3.5px),
    radial-gradient(circle at 48% 22px,#fff 0 3px,transparent 3.5px);
}
.icon-articles,
[data-dashboard-panel="articles"] h2:before{
  --icon-bg:linear-gradient(135deg,#222015,#d3a018);
  --glass-tint:rgba(211,160,24,.28);
  --glyph:
    linear-gradient(#fff 0 0) 10px 8px/12px 2px no-repeat,
    linear-gradient(#fff 0 0) 10px 14px/15px 2px no-repeat,
    linear-gradient(#fff 0 0) 10px 20px/11px 2px no-repeat,
    linear-gradient(90deg,#fff 0 2px,transparent 2px 4px,#fff 4px 6px,transparent 6px) center/18px 22px no-repeat;
}
.icon-logs,
[data-dashboard-panel="logs"] h2:before{
  --icon-bg:linear-gradient(135deg,#1d2230,#0aa6b8);
  --glass-tint:rgba(10,166,184,.28);
  --glyph:
    radial-gradient(circle at 50% 50%,#fff 0 3px,transparent 3.5px),
    radial-gradient(circle at 50% 50%,transparent 0 8px,#fff 8.5px 10px,transparent 10.5px),
    linear-gradient(#fff 0 0) center/3px 20px no-repeat;
}
.icon-report,
.icon-revenue{
  --icon-bg:linear-gradient(135deg,#14251d,#00a66a);
  --glass-tint:rgba(0,166,106,.28);
  --glyph:
    linear-gradient(#fff 0 0) 8px 19px/4px 7px no-repeat,
    linear-gradient(#fff 0 0) 15px 14px/4px 12px no-repeat,
    linear-gradient(#fff 0 0) 22px 9px/4px 17px no-repeat;
}
.icon-alert{
  --icon-bg:linear-gradient(135deg,#321b14,#ff4b24);
  --glass-tint:rgba(255,75,36,.28);
  --glyph:
    linear-gradient(#fff 0 0) center 8px/4px 13px no-repeat,
    radial-gradient(circle at 50% 23px,#fff 0 2.5px,transparent 3px);
}
.icon-backup,
.icon-export,
.icon-store,
.icon-admin,
.icon-overview,
.icon-size,
.icon-policy{
  --icon-bg:linear-gradient(135deg,#15181d,#8a8f99);
  --glass-tint:rgba(138,143,153,.3);
}
.icon-overview{
  --glyph:
    linear-gradient(#fff 0 0) 9px 9px/6px 6px no-repeat,
    linear-gradient(#fff 0 0) 19px 9px/6px 6px no-repeat,
    linear-gradient(#fff 0 0) 9px 19px/6px 6px no-repeat,
    linear-gradient(#fff 0 0) 19px 19px/6px 6px no-repeat;
}
.icon-size{
  --glyph:
    linear-gradient(#fff 0 0) center 12px/18px 3px no-repeat,
    linear-gradient(#fff 0 0) 9px 17px/2px 6px no-repeat,
    linear-gradient(#fff 0 0) 16px 17px/2px 6px no-repeat,
    linear-gradient(#fff 0 0) 23px 17px/2px 6px no-repeat;
}
.icon-policy{
  --glyph:
    linear-gradient(#fff 0 0) center 9px/14px 2px no-repeat,
    linear-gradient(#fff 0 0) center 15px/14px 2px no-repeat,
    linear-gradient(#fff 0 0) center 21px/10px 2px no-repeat,
    radial-gradient(circle at 23px 23px,#fff 0 4px,transparent 4.5px);
}
.icon-backup{
  --glyph:
    radial-gradient(ellipse at 50% 33%,#fff 0 12px,transparent 12.5px),
    linear-gradient(#fff 0 0) center 13px/22px 13px no-repeat,
    linear-gradient(#15181d 0 0) center 17px/11px 2px no-repeat;
}
.icon-export{
  --glyph:
    linear-gradient(#fff 0 0) center 18px/18px 3px no-repeat,
    linear-gradient(#fff 0 0) center 10px/3px 14px no-repeat,
    linear-gradient(45deg,transparent 0 42%,#fff 43% 58%,transparent 59%) 14px 8px/10px 10px no-repeat,
    linear-gradient(-45deg,transparent 0 42%,#fff 43% 58%,transparent 59%) 10px 8px/10px 10px no-repeat;
}
.icon-store{
  --glyph:
    linear-gradient(#fff 0 0) center 20px/18px 9px no-repeat,
    repeating-linear-gradient(90deg,#fff 0 4px,transparent 4px 7px) center 9px/20px 8px no-repeat;
}
.icon-admin{
  --glyph:
    radial-gradient(circle at 50% 34%,#fff 0 5px,transparent 5.5px),
    radial-gradient(ellipse at 50% 80%,#fff 0 9px,transparent 9.5px),
    linear-gradient(#fff 0 0) 20px 8px/5px 5px no-repeat;
}

/* Sharper SVG glyphs inside the glass icons */
.icon-overview{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center/18px 18px no-repeat;
}
.icon-orders,
[data-dashboard-panel="orders"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3h10a2 2 0 0 1 2 2v16l-3-2-2 2-2-2-2 2-2-2-3 2V5a2 2 0 0 1 2-2Z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-products,
[data-dashboard-panel="products"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7 9-4 9 4-9 4-9-4Z'/%3E%3Cpath d='M3 7v10l9 4 9-4V7'/%3E%3Cpath d='M12 11v10'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-profile,
[data-dashboard-panel="profile"] h2:before,
.icon-users,
[data-dashboard-panel="users"] h2:before,
.icon-admin{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-address,
[data-dashboard-panel="addresses"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 11-8 11S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-heart,
[data-dashboard-panel="wishlist"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 5.8a5.1 5.1 0 0 0-7.2 0L12 7.4l-1.6-1.6a5.1 5.1 0 0 0-7.2 7.2L12 21l8.8-8a5.1 5.1 0 0 0 0-7.2Z'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-club,
[data-dashboard-panel="club"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 18h11.5a3.5 3.5 0 0 0 0-7H12'/%3E%3Cpath d='M8 6l4 5-4 5'/%3E%3Cpath d='M4 6h4M4 16h4'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-security,
[data-dashboard-panel="security"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z'/%3E%3Cpath d='m9 12 2 2 4-5'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-settings,
[data-dashboard-panel="settings"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h10M18 7h2M4 17h2M10 17h10'/%3E%3Ccircle cx='16' cy='7' r='2'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-articles,
[data-dashboard-panel="articles"] h2:before,
.icon-policy{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3h7l5 5v13H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Z'/%3E%3Cpath d='M14 3v6h6M8 13h8M8 17h6'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-logs,
[data-dashboard-panel="logs"] h2:before{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 1 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.icon-report,
.icon-revenue{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19V5M4 19h16'/%3E%3Cpath d='m7 15 4-4 3 3 5-7'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-alert{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 10 18H2L12 3Z'/%3E%3Cpath d='M12 9v5M12 17h.01'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-backup{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='8' ry='3'/%3E%3Cpath d='M4 5v6c0 1.7 3.6 3 8 3s8-1.3 8-3V5M4 11v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-export{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M7 8l5-5 5 5'/%3E%3Cpath d='M5 15v4h14v-4'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-store{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h16l-2-6H6l-2 6Z'/%3E%3Cpath d='M5 10v10h14V10M9 20v-6h6v6'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.icon-size{
  --glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 17 17 4l3 3L7 20H4v-3Z'/%3E%3Cpath d='m14 7 3 3M11 10l2 2M8 13l3 3'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.admin-dashboard .dashboard-side button.active .dash-icon,
.admin-dashboard .dashboard-side button:hover .dash-icon,
.admin-dashboard .dashboard-side .side-link:hover .dash-icon{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.64),
    inset 0 -12px 28px rgba(255,255,255,.1),
    0 16px 34px rgba(0,0,0,.26);
}
.admin-dashboard .metric-card:before,
.admin-dashboard .quick-link:before,
.admin-dashboard .dashboard-panel h2:before,
.admin-dashboard .admin-list-row:before{
  box-shadow:0 12px 26px rgba(0,0,0,.2);
}
.admin-dashboard .panel-headline h2{
  padding-right:0;
}
.admin-dashboard .panel-headline h2:before{
  position:relative;
  right:auto;
  top:auto;
  width:32px;
  height:32px;
  border-radius:13px;
  background:
    var(--glyph),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.72),transparent 26%),
    linear-gradient(135deg,rgba(255,255,255,.34),var(--glass-tint,rgba(227,6,19,.24))),
    var(--icon-bg,linear-gradient(135deg,#15181d,#e30613));
  background-blend-mode:normal,screen,normal,normal;
}
@media (max-width:680px){
  .quick-link{
    min-height:64px;
  }
  .admin-list-row{
    padding-right:54px;
  }
}

/* Site-wide themed icon pass */
.dash-icon,
.metric-card:before,
.quick-link:before,
.dashboard-panel h2:before,
.admin-list-row:before{
  --icon-bg:linear-gradient(135deg,#15181d 0%,#2b2c2b 48%,#e30613 100%);
  --glass-tint:rgba(227,6,19,.22);
}
.icon-products,
[data-dashboard-panel="products"] h2:before,
.icon-alert{
  --icon-bg:linear-gradient(135deg,#17191d 0%,#e30613 62%,#ff6a00 100%);
  --glass-tint:rgba(255,80,18,.24);
}
.icon-profile,
[data-dashboard-panel="profile"] h2:before,
.icon-users,
[data-dashboard-panel="users"] h2:before,
.icon-address,
[data-dashboard-panel="addresses"] h2:before,
.icon-security,
[data-dashboard-panel="security"] h2:before,
.icon-settings,
[data-dashboard-panel="settings"] h2:before{
  --icon-bg:linear-gradient(135deg,#111318 0%,#3f454e 56%,#e30613 100%);
  --glass-tint:rgba(255,255,255,.18);
}
.icon-heart,
[data-dashboard-panel="wishlist"] h2:before,
.icon-club,
[data-dashboard-panel="club"] h2:before,
.icon-articles,
[data-dashboard-panel="articles"] h2:before,
.icon-logs,
[data-dashboard-panel="logs"] h2:before,
.icon-report,
.icon-revenue,
.icon-backup,
.icon-export,
.icon-store,
.icon-admin,
.icon-overview,
.icon-size,
.icon-policy{
  --icon-bg:linear-gradient(135deg,#15181d 0%,#5c626d 58%,#e30613 100%);
  --glass-tint:rgba(227,6,19,.18);
}
.section-title h2{
  display:flex;
  align-items:center;
  gap:10px;
  padding-right:0;
}
.section-title h2:before{
  position:relative;
  right:auto!important;
  top:auto!important;
  width:34px!important;
  height:34px!important;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.36);
  border-radius:14px!important;
  background:
    var(--section-glyph,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center/19px 19px no-repeat),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.72),transparent 26%),
    linear-gradient(135deg,rgba(255,255,255,.32),rgba(227,6,19,.2)),
    linear-gradient(135deg,#15181d,#5c626d 58%,#e30613);
  background-blend-mode:normal,screen,normal,normal;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.64),0 12px 26px rgba(22,25,29,.13);
  transform:none!important;
  backdrop-filter:blur(12px) saturate(1.28);
  -webkit-backdrop-filter:blur(12px) saturate(1.28);
}
.category-section .section-title h2{
  --section-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7 9-4 9 4-9 4-9-4Z'/%3E%3Cpath d='M3 7v10l9 4 9-4V7'/%3E%3Cpath d='M12 11v10'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.products .section-title h2{
  --section-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2h12l1 7H5l1-7Z'/%3E%3Cpath d='M5 9v11h14V9M9 20v-6h6v6'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.club-contact + .category-section .section-title h2,
.club-contact .section-title h2{
  --section-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 18h11.5a3.5 3.5 0 0 0 0-7H12'/%3E%3Cpath d='M8 6l4 5-4 5'/%3E%3Cpath d='M4 6h4M4 16h4'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.filter-panel h2,
.checkout-card h2,
.summary-card h2,
.order-panel h2{
  display:flex;
  align-items:center;
  gap:10px;
}
.filter-panel h2:before,
.checkout-card h2:before,
.summary-card h2:before,
.order-panel h2:before{
  content:"";
  width:32px;
  height:32px;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.36);
  border-radius:13px;
  background:
    var(--panel-glyph),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.72),transparent 26%),
    linear-gradient(135deg,rgba(255,255,255,.32),rgba(227,6,19,.2)),
    linear-gradient(135deg,#15181d,#5c626d 58%,#e30613);
  background-blend-mode:normal,screen,normal,normal;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.64),0 12px 26px rgba(22,25,29,.13);
}
.filter-panel h2{
  --panel-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h10M18 7h2M4 17h2M10 17h10'/%3E%3Ccircle cx='16' cy='7' r='2'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.checkout-card h2{
  --panel-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3h10a2 2 0 0 1 2 2v16l-3-2-2 2-2-2-2 2-2-2-3 2V5a2 2 0 0 1 2-2Z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.summary-card h2,
.order-summary-panel h2{
  --panel-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19V5M4 19h16'/%3E%3Cpath d='m7 15 4-4 3 3 5-7'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.order-panel h2{
  --panel-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7 9-4 9 4-9 4-9-4Z'/%3E%3Cpath d='M3 7v10l9 4 9-4V7'/%3E%3Cpath d='M12 11v10'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.order-status-grid article{
  position:relative;
  padding-right:62px;
}
.order-status-grid article:before{
  content:"";
  position:absolute;
  right:18px;
  top:50%;
  width:32px;
  height:32px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:13px;
  background:
    var(--order-status-glyph),
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.72),transparent 26%),
    linear-gradient(135deg,rgba(255,255,255,.32),rgba(227,6,19,.2)),
    linear-gradient(135deg,#15181d,#5c626d 58%,#e30613);
  background-blend-mode:normal,screen,normal,normal;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.64),0 12px 26px rgba(22,25,29,.13);
  transform:translateY(-50%);
}
.order-status-grid article:nth-child(1){
  --order-status-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3v3M17 3v3M4 8h16M6 5h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2Z'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
.order-status-grid article:nth-child(2){
  --order-status-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 10h18M7 15h4'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.order-status-grid article:nth-child(3){
  --order-status-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h11v9H3zM14 10h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='18' cy='18' r='2'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}
.order-status-grid article:nth-child(4){
  --order-status-glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 11-8 11S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center/19px 19px no-repeat;
}
@media (max-width:680px){
  .section-title{
    align-items:flex-start;
  }
  .order-status-grid article{
    padding-right:58px;
  }
}

/* Editorial/static pages */
.story-hero{
  position:relative;
  min-height:360px;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);
  gap:28px;
  align-items:center;
  margin-top:28px;
  padding:34px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.28);
  border-radius:28px;
  background:
    radial-gradient(circle at 12% 12%,rgba(255,255,255,.24),transparent 28%),
    linear-gradient(135deg,#15181d 0%,#5c626d 55%,#e30613 100%);
  color:#fff;
  box-shadow:0 30px 80px rgba(22,25,29,.18),inset 0 0 0 1px rgba(255,255,255,.16);
}
.story-hero:after{
  content:"";
  position:absolute;
  left:-120px;
  bottom:-120px;
  width:300px;
  height:300px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
}
.story-hero > *{
  position:relative;
  z-index:1;
}
.story-hero .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:rgba(255,255,255,.9);
  font-size:.78rem;
  font-weight:900;
  backdrop-filter:blur(12px);
}
.story-hero h1{
  max-width:720px;
  margin:0;
  font-size:clamp(2.1rem,4.8vw,4.9rem);
  line-height:1.05;
}
.story-hero p{
  max-width:650px;
  color:rgba(255,255,255,.84);
  line-height:1.95;
}
.story-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}
.story-visual,
.policy-visual,
.trust-seal,
.agency-map,
.article-orbit{
  min-height:260px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:24px;
  background:rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 20px 50px rgba(0,0,0,.16);
  backdrop-filter:blur(16px) saturate(1.25);
}
.story-visual img{
  width:min(92%,390px);
  max-height:290px;
  object-fit:contain;
  filter:drop-shadow(0 32px 34px rgba(0,0,0,.28));
}
.story-grid,
.policy-timeline,
.warranty-grid,
.agency-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  padding-top:28px;
}
.story-card,
.timeline-card,
.rule-card,
.warranty-card,
.agency-card,
.process-band,
.warranty-note{
  border:1px solid rgba(43,44,43,.1);
  border-radius:22px;
  background:linear-gradient(180deg,#fff,#f7f8fa);
  box-shadow:0 20px 48px rgba(22,25,29,.08);
}
.story-card,
.timeline-card,
.rule-card,
.warranty-card,
.agency-card{
  padding:22px;
}
.story-icon{
  width:42px;
  height:42px;
  display:inline-grid;
  place-items:center;
  margin-bottom:14px;
}
.story-card h2,
.timeline-card h2,
.rule-card h2,
.warranty-card h2,
.agency-card h2{
  margin:0 0 10px;
  font-size:1.08rem;
}
.story-card p,
.timeline-card p,
.rule-card li,
.warranty-card p,
.agency-card p,
.warranty-note p{
  color:var(--muted);
  line-height:1.9;
}
.process-band{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:22px;
  align-items:center;
  margin-top:28px;
  margin-bottom:50px;
  padding:28px;
}
.process-band h2,
.warranty-note h2{
  margin:8px 0 0;
  font-size:clamp(1.5rem,3vw,2.7rem);
}
.process-steps{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.process-steps article{
  padding:18px;
  border-radius:18px;
  background:#fff;
}
.process-steps b,
.timeline-card span{
  display:inline-grid;
  place-items:center;
  width:42px;
  height:42px;
  margin-bottom:12px;
  border-radius:14px;
  background:linear-gradient(135deg,#15181d,#e30613);
  color:#fff;
  direction:ltr;
}
.process-steps span{
  display:block;
  font-weight:1000;
}
.process-steps p{
  color:var(--muted);
  line-height:1.8;
}
.logistic-mark{
  width:150px;
  height:150px;
  display:grid;
  place-items:center;
  border-radius:38px;
  background:linear-gradient(135deg,#fff,#f1f2f4);
  color:#e30613;
  font-size:2.8rem;
  font-weight:1000;
  direction:ltr;
  box-shadow:0 26px 60px rgba(0,0,0,.2);
}
.rule-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  padding-top:16px;
  padding-bottom:54px;
}
.rule-card ul{
  margin:0;
  padding-right:18px;
}
.trust-seal{
  width:min(100%,360px);
  justify-self:center;
  align-content:center;
  gap:8px;
  text-align:center;
}
.trust-seal span{
  width:78px;
  height:78px;
  display:grid;
  place-items:center;
  margin:auto;
  border-radius:50%;
  background:#fff;
  color:#e30613;
  font-weight:1000;
}
.trust-seal b{
  font-size:4rem;
  direction:ltr;
}
.trust-seal small{
  color:rgba(255,255,255,.78);
  direction:ltr;
}
.warranty-note{
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:20px;
  margin-top:18px;
  margin-bottom:54px;
  padding:28px;
}
.agency-map,
.article-orbit{
  position:relative;
  grid-template-columns:repeat(2,90px);
  gap:16px;
}
.agency-map span,
.article-orbit span{
  width:90px;
  height:90px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.24);
  border-radius:26px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-weight:1000;
  direction:ltr;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
}
.agency-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  padding-bottom:54px;
}
.agency-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.agency-head small{
  color:var(--red);
  font-weight:1000;
}
.agency-card > a{
  display:inline-flex;
  margin:4px 0 14px;
  color:var(--red);
  font-weight:1000;
  direction:ltr;
}
.agency-services{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.agency-services span{
  padding:8px 10px;
  border-radius:999px;
  background:rgba(227,6,19,.08);
  color:#3d4248;
  font-size:.78rem;
  font-weight:900;
}
.editorial-articles{
  display:grid;
  gap:18px;
  padding-bottom:54px;
}
.editorial-feature,
.editorial-row{
  overflow:hidden;
  border:1px solid rgba(43,44,43,.1);
  border-radius:24px;
  background:linear-gradient(180deg,#fff,#f7f8fa);
  box-shadow:0 20px 48px rgba(22,25,29,.08);
}
.editorial-feature{
  min-height:390px;
}
.editorial-row{
  grid-template-columns:280px 1fr;
}
.article-tag{
  display:inline-flex;
  width:max-content;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(227,6,19,.08);
  color:var(--red);
  font-size:.78rem;
  font-weight:1000;
}
.article-read{
  display:inline-flex;
  margin-top:12px;
  color:var(--red);
  font-weight:1000;
}
.article-detail{
  padding-top:34px;
  padding-bottom:20px;
}
.article-detail-head{
  max-width:840px;
  margin-inline:auto;
  text-align:center;
}
.article-detail-head .article-tag{
  margin:0 auto 14px;
}
.article-detail-head h1{
  margin:0;
  font-size:clamp(2rem,4vw,4.2rem);
  line-height:1.18;
}
.article-detail-head p{
  color:var(--muted);
  line-height:1.9;
  font-size:1.02rem;
}
.article-detail-image{
  width:100%;
  max-height:460px;
  object-fit:cover;
  margin-top:24px;
  border-radius:24px;
  box-shadow:0 24px 62px rgba(22,25,29,.14);
}
.article-detail-body{
  max-width:820px;
  margin:24px auto 0;
  padding:26px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:22px;
  background:#fff;
  box-shadow:0 18px 46px rgba(22,25,29,.08);
}
.article-detail-body p{
  margin:0 0 18px;
  color:#343941;
  line-height:2.15;
  font-size:1rem;
}
.article-detail-body p:last-child{
  margin-bottom:0;
}
.article-showcase{
  padding-top:30px;
}
.article-detail-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(320px,.98fr);
  gap:22px;
  align-items:stretch;
  min-height:520px;
  overflow:hidden;
  padding:28px;
  border-radius:30px;
  background:
    radial-gradient(circle at 18% 14%,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(135deg,#101217 0%,#2b2c2b 48%,#e30613 100%);
  color:#fff;
  box-shadow:0 34px 90px rgba(22,25,29,.22);
}
.article-detail-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.12) 58% 62%,transparent 62%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 84px);
  pointer-events:none;
}
.article-hero-copy,
.article-hero-media{
  position:relative;
  z-index:1;
}
.article-hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  gap:14px;
}
.article-back{
  display:inline-flex;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-weight:1000;
  font-size:.78rem;
}
.article-detail-hero .article-tag{
  margin:0;
  background:#fff;
  color:#e30613;
}
.article-detail-hero h1{
  max-width:760px;
  margin:0;
  font-size:clamp(2.3rem,5.4vw,5.5rem);
  line-height:1.04;
}
.article-detail-hero p{
  max-width:620px;
  margin:0;
  color:rgba(255,255,255,.84);
  line-height:2;
  font-size:1.02rem;
}
.article-meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:10px;
}
.article-meta-row span{
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.1);
  color:#fff;
  font-size:.8rem;
  font-weight:1000;
}
.article-hero-media{
  min-height:420px;
  margin:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:26px;
  overflow:hidden;
  background:rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 26px 70px rgba(0,0,0,.22);
}
.article-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scale(1.02);
}
.article-reading-layout{
  display:grid;
  grid-template-columns:300px minmax(0,1fr);
  gap:20px;
  align-items:start;
  margin-top:22px;
}
.article-side-note{
  position:sticky;
  top:98px;
  display:grid;
  gap:10px;
  padding:20px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:22px;
  background:linear-gradient(180deg,#fff,#f7f8fa);
  box-shadow:0 18px 46px rgba(22,25,29,.08);
}
.article-side-note b{
  font-size:1.05rem;
}
.article-side-note span{
  width:max-content;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(227,6,19,.08);
  color:#e30613;
  font-size:.76rem;
  font-weight:1000;
}
.article-side-note p{
  margin:0;
  color:var(--muted);
  line-height:1.9;
}
.article-showcase .article-detail-body{
  max-width:none;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.article-body-block{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:18px;
  margin-bottom:14px;
  padding:24px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:22px;
  background:#fff;
  box-shadow:0 18px 46px rgba(22,25,29,.08);
}
.article-body-block > span{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(135deg,#15181d,#e30613);
  color:#fff;
  font-weight:1000;
  direction:ltr;
}
.article-body-block p{
  margin:0;
  color:#303640;
  line-height:2.15;
}
.article-showcase .article-detail-hero{
  grid-template-columns:minmax(0,1fr) minmax(300px,430px);
  min-height:620px;
  padding:34px;
  border-radius:34px;
  background:#0f1117;
  isolation:isolate;
}
.article-hero-bg{
  position:absolute;
  inset:0;
  z-index:0;
}
.article-hero-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.28;
  filter:saturate(1.08) contrast(1.08);
  transform:scale(1.05);
}
.article-showcase .article-detail-hero:before{
  z-index:1;
  background:
    linear-gradient(90deg,rgba(12,13,18,.98) 0%,rgba(12,13,18,.84) 42%,rgba(12,13,18,.36) 100%),
    radial-gradient(circle at 76% 18%,rgba(227,6,19,.46),transparent 28%),
    linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.1) 58% 61%,transparent 61%);
}
.article-showcase .article-detail-hero:after{
  content:"";
  position:absolute;
  inset:18px;
  z-index:1;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  pointer-events:none;
}
.article-showcase .article-hero-copy{
  z-index:2;
  max-width:760px;
  padding:16px 0;
}
.article-showcase .article-back{
  backdrop-filter:blur(14px);
}
.article-showcase .article-detail-hero h1{
  font-size:clamp(2.6rem,5.8vw,6.2rem);
  text-shadow:0 18px 44px rgba(0,0,0,.32);
}
.article-showcase .article-detail-hero p{
  font-size:1.08rem;
}
.article-showcase .article-meta-row span{
  display:grid;
  gap:3px;
  min-width:122px;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(16px);
}
.article-showcase .article-meta-row small{
  color:rgba(255,255,255,.64);
  font-size:.68rem;
  font-weight:900;
}
.article-showcase .article-hero-media{
  z-index:2;
  align-self:center;
  min-height:480px;
  border-radius:30px;
  transform:rotate(-2deg);
}
.article-showcase .article-hero-media:before{
  content:"";
  position:absolute;
  inset:14px;
  z-index:2;
  border:1px solid rgba(255,255,255,.24);
  border-radius:22px;
  pointer-events:none;
}
.article-showcase .article-hero-media img{
  filter:saturate(1.08) contrast(1.06);
}
.article-hero-media figcaption{
  position:absolute;
  right:20px;
  bottom:20px;
  z-index:3;
  padding:9px 12px;
  border-radius:999px;
  background:rgba(15,17,23,.72);
  color:#fff;
  font-size:.72rem;
  font-weight:1000;
  direction:ltr;
  backdrop-filter:blur(14px);
}
.article-takeaways{
  display:grid;
  grid-template-columns:1.05fr repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:-48px;
  position:relative;
  z-index:3;
}
.article-takeaways > div,
.article-takeaways article{
  min-height:132px;
  padding:18px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:22px;
  background:rgba(255,255,255,.92);
  box-shadow:0 22px 54px rgba(22,25,29,.14);
  backdrop-filter:blur(16px);
}
.article-takeaways > div{
  color:#fff;
  background:linear-gradient(135deg,#15181d,#e30613);
}
.article-takeaways span{
  font-size:.76rem;
  font-weight:1000;
  color:rgba(255,255,255,.72);
}
.article-takeaways h2{
  margin:8px 0 0;
  font-size:1.2rem;
  line-height:1.5;
}
.article-takeaways article b{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  margin-bottom:10px;
  border-radius:14px;
  background:#15181d;
  color:#fff;
  direction:ltr;
}
.article-takeaways article p{
  margin:0;
  color:#3d4248;
  line-height:1.8;
  font-size:.88rem;
}
.article-side-chips{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.article-side-chips em{
  padding:7px 9px;
  border-radius:999px;
  background:#f1f2f4;
  color:#3d4248;
  font-style:normal;
  font-size:.72rem;
  font-weight:1000;
}
.article-showcase .article-reading-layout{
  grid-template-columns:320px minmax(0,1fr);
  margin-top:26px;
}
.article-showcase .article-side-note{
  border-radius:26px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,247,249,.94));
}
.article-showcase .article-body-block{
  position:relative;
  overflow:hidden;
  grid-template-columns:74px 1fr;
  padding:28px;
  border-radius:26px;
}
.article-showcase .article-body-block:before{
  content:"";
  position:absolute;
  right:-60px;
  bottom:-90px;
  width:180px;
  height:180px;
  border-radius:50%;
  background:rgba(227,6,19,.06);
}
.article-showcase .article-body-block > span{
  width:56px;
  height:56px;
  border-radius:19px;
  box-shadow:0 16px 34px rgba(227,6,19,.18);
}
.article-showcase .article-body-block p{
  position:relative;
  z-index:1;
  font-size:1.04rem;
}
.article-final-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-top:16px;
  padding:26px;
  border-radius:28px;
  background:
    radial-gradient(circle at 8% 12%,rgba(255,255,255,.16),transparent 26%),
    linear-gradient(135deg,#15181d,#2b2c2b 48%,#e30613);
  color:#fff;
  box-shadow:0 24px 60px rgba(22,25,29,.16);
}
.article-final-cta span{
  color:rgba(255,255,255,.72);
  font-weight:1000;
}
.article-final-cta h2{
  max-width:680px;
  margin:8px 0 0;
  font-size:clamp(1.4rem,2.5vw,2.2rem);
  line-height:1.45;
}
.article-final-cta .btn{
  flex:0 0 auto;
  background:#fff;
  color:#15181d;
}
.seo-helper-text{
  margin-top:12px!important;
  padding:12px 14px;
  border:1px solid rgba(43,44,43,.1);
  border-radius:14px;
  background:#f7f8fa;
  color:#5b626d!important;
  font-size:.9rem;
  line-height:1.9;
}
.articles-index-hero{
  min-height:430px;
  background:
    linear-gradient(90deg,rgba(15,17,23,.94),rgba(43,44,43,.76),rgba(227,6,19,.74)),
    url("skating.webp") center/cover no-repeat;
}
.articles-index-grid{
  gap:16px;
}
.articles-index-grid .editorial-feature,
.articles-index-grid .editorial-row{
  position:relative;
  border-radius:28px;
  background:#fff;
  transition:.26s var(--ease);
}
.articles-index-grid .editorial-feature:hover,
.articles-index-grid .editorial-row:hover{
  transform:translateY(-5px);
  box-shadow:0 30px 72px rgba(22,25,29,.16);
}
.articles-index-grid .editorial-feature{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  min-height:440px;
  background:linear-gradient(135deg,#15181d,#2b2c2b 48%,#e30613);
  color:#fff;
}
.articles-index-grid .editorial-feature img{
  height:100%;
  object-fit:cover;
  opacity:.94;
}
.articles-index-grid .editorial-feature > div,
.articles-index-grid .editorial-row > div{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:28px;
}
.articles-index-grid small{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin-bottom:14px;
  border-radius:17px;
  background:#15181d;
  color:#fff;
  font-weight:1000;
  direction:ltr;
}
.articles-index-grid .editorial-feature small{
  background:#fff;
  color:#e30613;
}
.articles-index-grid .editorial-feature .article-tag{
  background:rgba(255,255,255,.14);
  color:#fff;
}
.articles-index-grid .editorial-feature p{
  color:rgba(255,255,255,.82);
}
.articles-index-grid .editorial-row{
  display:grid;
  grid-template-columns:320px 1fr;
}
.articles-index-grid .editorial-row img{
  height:100%;
  min-height:260px;
  object-fit:cover;
}
.articles-index-grid h2{
  margin:12px 0 8px;
  font-size:clamp(1.35rem,2.4vw,2.4rem);
  line-height:1.35;
}
.articles-index-grid p{
  color:var(--muted);
  line-height:1.9;
}
@media (max-width:960px){
  .story-hero,
  .process-band,
  .warranty-note{
    grid-template-columns:1fr;
  }
  .story-grid,
  .policy-timeline,
  .warranty-grid,
  .process-steps,
  .agency-grid,
  .rule-grid{
    grid-template-columns:1fr;
  }
  .editorial-row{
    grid-template-columns:1fr;
  }
  .articles-index-grid .editorial-feature,
  .articles-index-grid .editorial-row{
    grid-template-columns:1fr;
  }
  .article-detail-hero,
  .article-reading-layout,
  .article-showcase .article-reading-layout,
  .article-takeaways{
    grid-template-columns:1fr;
  }
  .article-side-note{
    position:static;
  }
  .article-takeaways{
    margin-top:14px;
  }
  .article-showcase .article-hero-media{
    transform:none;
  }
  .article-final-cta{
    display:grid;
  }
  .editorial-row img{
    height:230px;
  }
}
@media (max-width:680px){
  .story-hero{
    margin-top:18px;
    padding:22px;
    border-radius:22px;
  }
  .story-visual,
  .policy-visual,
  .trust-seal,
  .agency-map,
  .article-orbit{
    min-height:220px;
  }
  .agency-map,
  .article-orbit{
    grid-template-columns:repeat(2,74px);
  }
  .agency-map span,
  .article-orbit span{
    width:74px;
    height:74px;
    border-radius:20px;
  }
  .article-detail-hero{
    min-height:auto;
    padding:20px;
    border-radius:22px;
  }
  .article-hero-media{
    min-height:260px;
    border-radius:20px;
  }
  .article-body-block{
    grid-template-columns:1fr;
    padding:20px;
  }
  .article-showcase .article-detail-hero{
    min-height:auto;
    padding:20px;
  }
  .article-showcase .article-detail-hero:after{
    inset:10px;
    border-radius:18px;
  }
  .article-showcase .article-detail-hero h1{
    font-size:clamp(2.1rem,10vw,3.6rem);
  }
  .article-showcase .article-hero-media{
    min-height:300px;
  }
  .article-showcase .article-body-block{
    grid-template-columns:1fr;
  }
}

/* Homepage hero color lock */
.hero{
  background:
    linear-gradient(90deg,rgba(24,25,24,.92) 0%,rgba(43,44,43,.78) 40%,rgba(255,0,0,.72) 100%),
    url("hero-skate-premium.png") center/cover no-repeat;
}
.hero:before{
  background:
    linear-gradient(90deg,rgba(0,0,0,.08),rgba(0,0,0,.42) 58%,rgba(0,0,0,.78)),
    linear-gradient(110deg,transparent 0 55%,rgba(255,0,0,.24) 55% 60%,transparent 60%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px 74px);
}
.hero:after{
  background:rgba(255,0,0,.32);
}

/* Premium footer redesign */
.footer{
  position:relative;
  margin-top:54px;
  padding:0 0 28px;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 18%,rgba(227,6,19,.28),transparent 28%),
    radial-gradient(circle at 88% 28%,rgba(255,255,255,.1),transparent 24%),
    linear-gradient(135deg,#0d0f14 0%,#1b1e25 48%,#35070b 100%)!important;
  color:#fff;
}
.footer:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(115deg,transparent 0 44%,rgba(255,255,255,.07) 44.4% 45.2%,transparent 45.6% 100%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 86px);
  pointer-events:none;
}
.footer:after{
  content:"365";
  position:absolute;
  left:6%;
  bottom:-48px;
  color:rgba(255,255,255,.045);
  font-size:11rem;
  font-weight:1000;
  direction:ltr;
  line-height:1;
}
.footer-cta,
.footer-trust,
.footer-grid-wide,
.footer-bottom{
  position:relative;
  z-index:2;
}
.footer-cta{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  transform:translateY(-28px);
  margin-bottom:-8px;
  padding:28px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:28px;
  background:
    radial-gradient(circle at 8% 18%,rgba(255,255,255,.16),transparent 24%),
    linear-gradient(135deg,#191c23,#e30613);
  box-shadow:0 28px 80px rgba(22,25,29,.24),inset 0 1px 0 rgba(255,255,255,.22);
}
.footer-cta span{
  display:inline-flex;
  width:max-content;
  margin-bottom:10px;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  color:rgba(255,255,255,.82);
  font-size:.78rem;
  font-weight:1000;
}
.footer-cta h2{
  max-width:780px;
  margin:0;
  font-size:clamp(1.6rem,3vw,3.2rem);
  line-height:1.25;
}
.footer-cta p{
  max-width:680px;
  margin:10px 0 0;
  color:rgba(255,255,255,.78);
}
.footer-cta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.footer-cta-actions .primary{
  background:#fff;
  color:#15181d;
}
.footer-cta-actions .ghost{
  color:#fff;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.18);
}
.footer-trust{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:10px;
}
.footer-trust span{
  min-height:74px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.075);
  color:#fff;
  backdrop-filter:blur(14px);
}
.footer-trust b{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:12px;
  background:#fff;
  color:#e30613;
  direction:ltr;
}
.footer-grid-wide{
  display:grid;
  grid-template-columns:minmax(300px,1.45fr) repeat(3,minmax(160px,.72fr));
  gap:16px;
  margin-top:18px;
  padding:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter:blur(16px);
}
.footer-brand-block,
.footer-links-col{
  padding:18px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;
  background:rgba(255,255,255,.055);
}
.footer-logo{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.footer-logo span{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,#fff,#f1f2f4);
  color:#e30613;
  font-weight:1000;
  direction:ltr;
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}
.footer-logo strong{
  font-size:1.35rem;
}
.footer-brand-block p{
  margin:0;
  color:rgba(255,255,255,.72);
  line-height:1.95;
}
.footer-contact-cards{
  display:grid;
  gap:9px;
  margin-top:14px;
}
.footer-contact-cards a,
.footer-contact-cards span{
  display:flex!important;
  align-items:center;
  min-height:42px;
  margin:0!important;
  padding:9px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.08);
  color:#fff!important;
  font-weight:900;
}
.footer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.footer-tags span{
  padding:7px 10px;
  border-radius:999px;
  background:rgba(227,6,19,.22);
  color:#fff;
  font-size:.72rem;
  font-weight:1000;
  direction:ltr;
}
.footer-links-col h3{
  position:relative;
  margin:0 0 14px;
  padding-bottom:12px;
}
.footer-links-col h3:after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:44px;
  height:3px;
  border-radius:999px;
  background:#e30613;
}
.footer-links-col a{
  position:relative;
  display:flex!important;
  align-items:center;
  min-height:34px;
  margin:6px 0!important;
  padding:6px 16px 6px 8px;
  color:rgba(255,255,255,.74)!important;
  border-radius:12px;
}
.footer-links-col a:before{
  content:"";
  position:absolute;
  right:0;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#e30613;
  opacity:.7;
}
.footer-links-col a:hover{
  color:#fff!important;
  background:rgba(255,255,255,.08);
  transform:translateX(-4px);
}
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.68);
}
.footer-bottom span:last-child{
  direction:ltr;
  font-weight:1000;
  letter-spacing:.04em;
}
@media (max-width:960px){
  .footer-cta,
  .footer-grid-wide{
    grid-template-columns:1fr;
  }
  .footer-cta-actions{
    justify-content:flex-start;
  }
  .footer-trust{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:680px){
  .footer{
    margin-top:42px;
    padding-bottom:22px;
  }
  .footer-cta{
    transform:translateY(-18px);
    padding:20px;
    border-radius:22px;
  }
  .footer-trust{
    grid-template-columns:1fr;
  }
  .footer-grid-wide{
    padding:10px;
    border-radius:22px;
  }
  .footer-brand-block,
  .footer-links-col{
    padding:16px;
  }
  .footer-bottom{
    display:grid;
  }
}

/* Imported product catalog imagery */
.detail-gallery > img,
.detail-gallery div img,
.product-media img,
.mini-product img,
.checkout-item img{
  object-position:center;
}
.detail-gallery > img,
.product-media img{
  background:linear-gradient(145deg,#111318,#3b3d40 52%,#f0f1f2);
}
.detail-gallery div:empty{
  display:none;
}

/* Use clean imported product photos without cropping. */
.product-media{
  background:#101115!important;
  height:auto!important;
  aspect-ratio:1 / 1;
  padding:0!important;
}
.product-media img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:cover!important;
  padding:0;
  filter:saturate(1.04) contrast(1.02)!important;
  transform:none!important;
  border-radius:inherit;
}
.detail-gallery > img{
  object-fit:contain!important;
  padding:0;
  background:#101115!important;
}
.detail-gallery div img{
  object-fit:contain!important;
  padding:6px;
  background:#fff;
}

/* Restored product listing UX */
.catalog-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:18px;
  padding:16px 18px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:16px;
  background:rgba(255,255,255,.86);
  box-shadow:0 16px 38px rgba(22,25,29,.08);
}
.catalog-toolbar div{
  display:grid;
  gap:4px;
}
.catalog-toolbar strong{
  color:#15181d;
  font-size:1rem;
}
.catalog-toolbar span{
  color:var(--muted);
  font-size:.84rem;
}
.filter-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.catalog-grid .empty-state{
  grid-column:1/-1;
}
.pagination{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin-top:24px;
}
.pagination a{
  min-width:42px;
  min-height:42px;
  display:inline-grid;
  place-items:center;
  padding:0 12px;
  border:1px solid rgba(43,44,43,.12);
  border-radius:12px;
  background:#fff;
  color:#15181d;
  font-weight:1000;
  box-shadow:0 10px 24px rgba(22,25,29,.06);
}
.pagination a.active,
.pagination a:hover{
  border-color:transparent;
  background:linear-gradient(135deg,#2b2c2b,#ff0000);
  color:#fff;
}
.product-card{
  min-height:420px;
}
.product-card p{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product-media{
  border-color:rgba(43,44,43,.08)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.85);
}
.product-image{
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
  border-radius:18px;
  display:block;
  background:#111;
}
.detail-gallery > .product-image{
  object-fit:contain;
}
@media (max-width:680px){
  .catalog-toolbar{
    display:grid;
  }
  .filter-row{
    grid-template-columns:1fr;
  }
}

/* Modern product cards and detail gallery */
.catalog-grid,
.product-grid{
  gap:18px;
}
.product-card{
  min-height:0!important;
  padding:12px!important;
  border:1px solid rgba(22,25,29,.08)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8f9fb 62%,#eef0f3 100%)!important;
  box-shadow:0 20px 46px rgba(22,25,29,.1)!important;
  overflow:hidden;
}
.product-card:before{
  display:none!important;
}
.product-card:hover{
  transform:translateY(-7px)!important;
  border-color:rgba(255,0,0,.2)!important;
  box-shadow:0 30px 70px rgba(22,25,29,.18)!important;
}
.product-card .status-badge{
  top:20px;
  right:20px;
  z-index:5;
  background:rgba(15,17,20,.82);
  color:#fff;
  backdrop-filter:blur(10px);
}
.product-card small{
  min-height:18px;
  margin-top:14px!important;
  color:#8d929a!important;
  font-size:.7rem!important;
}
.product-card h3{
  min-height:46px;
  margin:7px 0 8px!important;
  color:#17191d;
  font-size:1.03rem!important;
  line-height:1.55;
}
.product-card p{
  display:none!important;
}
.product-card b{
  margin:0 0 14px!important;
  color:#e30613!important;
  font-size:1.08rem!important;
}
.product-card del{
  margin-top:-8px;
  margin-bottom:12px;
  color:#9da2aa;
  font-size:.78rem;
}
.product-media{
  width:100%;
  aspect-ratio:1 / 1;
  border-radius:16px!important;
  background:
    radial-gradient(circle at 50% 35%,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(145deg,#111318,#262a30 58%,#e30613 160%)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 14px 30px rgba(22,25,29,.12)!important;
}
.product-media:before,
.product-media:after{
  display:none!important;
}
.product-media a{
  width:100%;
  height:100%;
  display:block;
}
.product-media img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:16px!important;
  filter:saturate(1.03) contrast(1.03)!important;
  transition:transform .35s var(--ease),filter .35s var(--ease)!important;
}
.product-card:hover .product-media img{
  transform:scale(1.045)!important;
  filter:saturate(1.08) contrast(1.05)!important;
}
.product-actions{
  grid-template-columns:1fr;
  gap:9px!important;
}
.product-actions .btn,
.product-actions .add-cart{
  min-height:42px;
  border-radius:12px;
}
.product-actions .btn{
  background:#fff;
}
.product-actions .add-cart{
  box-shadow:0 12px 26px rgba(227,6,19,.24)!important;
}

.product-detail-modern{
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:24px;
  align-items:start;
  padding-top:34px;
}
.product-detail-modern .detail-gallery,
.product-detail-modern .detail-info{
  border:1px solid rgba(22,25,29,.08);
  border-radius:22px;
  background:linear-gradient(180deg,#fff,#fafbfc);
  box-shadow:0 22px 60px rgba(22,25,29,.09);
}
.product-detail-modern .detail-gallery{
  padding:12px;
}
.product-slider-main{
  position:relative;
  aspect-ratio:1 / 1;
  overflow:hidden;
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 38%,rgba(227,6,19,.09),transparent 36%),
    linear-gradient(145deg,#fbfcfd,#eceff3);
}
.product-slide{
  position:absolute;
  inset:0;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center;
  padding:0;
  border-radius:0!important;
  background:transparent!important;
  opacity:0;
  transform:scale(1.015);
  transition:opacity .45s var(--ease),transform .45s var(--ease);
}
.product-slide.active{
  opacity:1;
  transform:scale(1);
}
.product-slider-thumbs{
  display:flex!important;
  gap:8px!important;
  margin-top:10px!important;
  overflow-x:auto;
  padding-bottom:2px;
  scrollbar-width:thin;
}
.product-slider-thumbs button{
  flex:0 0 78px;
  width:78px;
  height:78px;
  padding:0;
  border:1px solid rgba(22,25,29,.1);
  border-radius:12px;
  background:#f5f6f8;
  cursor:pointer;
  overflow:hidden;
  opacity:.62;
  transition:.2s var(--ease);
}
.product-slider-thumbs button.active,
.product-slider-thumbs button:hover{
  opacity:1;
  border-color:rgba(227,6,19,.55);
  box-shadow:0 10px 24px rgba(227,6,19,.12);
}
.product-slider-thumbs img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:0!important;
}
.product-detail-modern .detail-info{
  padding:28px;
  position:sticky;
  top:92px;
}
.product-detail-modern .detail-info small{
  display:inline-flex;
  padding:7px 11px;
  border-radius:999px;
  background:#f0f2f5;
  color:#40444b;
}
.product-detail-modern .detail-info h1{
  margin:14px 0 12px;
  font-size:clamp(1.7rem,3vw,2.7rem);
  line-height:1.35;
}
.detail-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:16px;
}
.detail-meta span{
  padding:8px 12px;
  border:1px solid rgba(22,25,29,.08);
  border-radius:999px;
  color:#626873;
  background:#fff;
  font-size:.82rem;
  font-weight:800;
}
.product-detail-modern .detail-price{
  margin:10px 0 16px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(22,25,29,.08);
  font-size:1.45rem;
}
.product-detail-modern .product-purchase{
  margin:0 0 18px;
  border-radius:18px;
  background:linear-gradient(180deg,#f7f8fa,#fff);
  box-shadow:none;
}
.product-detail-modern .spec-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:0;
  margin:0;
  list-style:none;
}
.product-detail-modern .spec-list li{
  padding:10px 12px;
  border-radius:12px;
  background:#f7f8fa;
  color:#4e545d;
  line-height:1.7;
  font-size:.82rem;
}
.product-content-modern{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:18px;
  padding-top:18px;
}
.product-description-panel,
.product-spec-panel{
  border:1px solid rgba(22,25,29,.08);
  border-radius:22px;
  background:#fff;
  box-shadow:0 18px 48px rgba(22,25,29,.08);
}
.product-description-panel{
  padding:28px;
}
.product-spec-panel{
  padding:22px;
}
.product-description-panel > span,
.product-spec-panel > span{
  display:inline-flex;
  margin-bottom:10px;
  color:#e30613;
  font-size:.82rem;
  font-weight:1000;
}
.product-description-panel h2{
  margin:0 0 14px;
  color:#17191d;
  font-size:1.35rem;
  line-height:1.5;
}
.product-description-panel p{
  margin:0;
  color:#555b64;
  line-height:2.05;
}
.product-spec-panel .spec-list{
  display:grid;
  gap:8px;
  padding:0;
  margin:0;
  list-style:none;
}
.product-spec-panel .spec-list li{
  padding:11px 12px;
  border-radius:12px;
  background:linear-gradient(180deg,#f7f8fa,#fff);
  color:#4e545d;
  line-height:1.75;
  font-size:.84rem;
}
@media (max-width:960px){
  .product-detail-modern,
  .product-content-modern{
    grid-template-columns:1fr;
  }
  .product-detail-modern .detail-info{
    position:static;
  }
}
@media (max-width:680px){
  .catalog-grid,
  .product-grid{
    gap:12px;
  }
  .product-card{
    border-radius:15px!important;
  }
  .product-card h3{
    min-height:0;
  }
  .product-detail-modern{
    padding-top:18px;
    gap:14px;
  }
  .product-detail-modern .detail-info{
    padding:18px;
  }
  .product-slider-thumbs{
    padding-bottom:6px;
  }
  .product-slider-thumbs button{
    flex-basis:68px;
    width:68px;
    height:68px;
  }
  .product-detail-modern .spec-list,
  .detail-actions,
  .purchase-row{
    grid-template-columns:1fr;
  }
  .product-description-panel,
  .product-spec-panel{
    border-radius:18px;
  }
  .product-description-panel,
  .product-spec-panel{
    padding:18px;
  }
}

/* White site theme with dark custom banners - 20260710 */
:root{
  --bg:#f5f6f8;
  --paper:#ffffff;
  --ink:#15181d;
  --muted:#6e747c;
  --line:#e2e5e9;
  --red:#e30613;
  --red-dark:#97000a;
  --shadow:0 18px 44px rgba(20,24,30,.10);
  --radius:14px;
}
html,body{overflow-x:hidden}
body{
  background:
    radial-gradient(circle at 8% 7%,rgba(227,6,19,.08),transparent 24%),
    radial-gradient(circle at 92% 18%,rgba(21,24,29,.055),transparent 26%),
    linear-gradient(180deg,#ffffff 0%,#f4f6f8 42%,#eef1f4 100%)!important;
  color:var(--ink)!important;
}
body:before,body:after{opacity:.32!important;z-index:-2!important}
.top-strip{background:linear-gradient(90deg,#111318,#2b2f37,#e30613,#111318)!important;color:#fff}
.topbar{
  color:var(--ink)!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(20,24,30,.10)!important;
  box-shadow:0 14px 38px rgba(20,24,30,.10)!important;
}
.brand strong,.main-nav a,.login-link{color:var(--ink)!important}.brand small{color:var(--muted)!important}.main-nav a:hover,.main-nav a.active{color:var(--red)!important}.main-nav a.active:after{background:var(--red)!important}.icon,.search-box input{background:#fff!important;border-color:var(--line)!important;color:var(--ink)!important}.search-box input::placeholder{color:#9aa0a8}.brand-mark,.bag span{background:linear-gradient(135deg,#15181d,#e30613)!important}
.shell{max-width:1160px}.skate-cinema-hero{
  min-height:560px!important;
  display:grid!important;
  grid-template-columns:minmax(0,.95fr) minmax(360px,1.05fr)!important;
  align-items:center!important;
  gap:28px!important;
  margin-top:24px!important;
  padding:46px 48px!important;
  border-radius:22px!important;
  color:#fff!important;
  overflow:hidden!important;
  isolation:isolate;
  background:
    linear-gradient(90deg,rgba(4,5,6,.96) 0%,rgba(12,13,14,.72) 42%,rgba(92,0,0,.50) 100%),
    url("generated/skate365-hero-banner.png") left center/cover no-repeat!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 30px 82px rgba(20,24,30,.25)!important;
}
.skate-cinema-hero:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  background:
    linear-gradient(112deg,transparent 0 52%,rgba(227,6,19,.30) 52.2% 54.2%,transparent 54.4% 100%),
    radial-gradient(circle at 18% 88%,rgba(227,6,19,.32),transparent 28%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,transparent 1px 74px)!important;
}
.skate-cinema-hero:after{display:none!important}.cinema-product{display:none!important}.cinema-logo{
  position:absolute;top:42px;left:44px;z-index:2;direction:ltr;text-align:left;transform:skewX(-8deg);filter:drop-shadow(0 12px 20px rgba(0,0,0,.38));
}
.cinema-logo span{display:block;color:#fff;font-size:2.15rem;font-weight:1000;line-height:.8;text-shadow:0 2px 0 #555}.cinema-logo strong{display:block;color:#e30613;font-size:4.8rem;font-weight:1000;line-height:.75;text-shadow:0 4px 0 #5b0000}.hero-copy{grid-column:2!important;position:relative;z-index:3;max-width:640px!important;justify-self:end!important;text-align:right!important}.hero .kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#fff!important}.hero .kicker:before{content:"";width:8px;height:8px;border-radius:50%;background:#e30613;box-shadow:0 0 16px #e30613}.hero h1{color:#fff!important;font-size:clamp(2.35rem,4.5vw,4.9rem)!important;line-height:1.22!important;letter-spacing:0!important;text-shadow:0 12px 28px rgba(0,0,0,.35)}.hero p{color:rgba(255,255,255,.86)!important;line-height:2!important}.hero-actions{margin-top:22px}.hero-actions .btn{min-height:52px;border-radius:12px!important;padding:0 22px}.hero-actions .primary,.primary{background:linear-gradient(135deg,#e30613,#95000a)!important;color:#fff!important;box-shadow:0 14px 28px rgba(227,6,19,.24)}.hero-actions .ghost,.ghost{background:#fff!important;color:#15181d!important;border:1px solid rgba(255,255,255,.28)}
.cinema-feature-row{display:flex;flex-wrap:wrap;gap:0;margin-top:24px;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(10px)}.cinema-feature-row span{min-height:54px;display:flex;align-items:center;padding:0 18px;color:#fff;font-weight:1000;white-space:nowrap}.cinema-feature-row span+span{border-right:1px solid rgba(255,255,255,.15)}.cinema-feature-row span:before{content:"";width:24px;height:24px;margin-left:9px;border-radius:8px;border:2px solid #ff1e2a;box-shadow:0 0 14px rgba(227,6,19,.36)}
.skate-banner-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important;margin-top:20px!important}.skate-banner-grid .promo-card{min-height:240px!important;border-radius:18px!important;padding:28px!important;color:#fff!important;background:#111!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 22px 58px rgba(20,24,30,.18)!important;overflow:hidden!important}.skate-banner-grid .promo-card:before{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(90deg,rgba(6,7,8,.94) 0%,rgba(18,20,21,.58) 48%,rgba(227,6,19,.40) 100%)!important;z-index:1!important}.skate-banner-grid .promo-card:after{content:"";position:absolute;inset:auto 0 0 0;height:44%;background:linear-gradient(180deg,transparent,rgba(0,0,0,.48));z-index:1}.skate-banner-grid .promo-card img{display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;opacity:1!important;filter:saturate(1.08) contrast(1.08)!important;z-index:0!important;border-radius:0!important;mix-blend-mode:normal!important}.skate-banner-grid .promo-card span,.skate-banner-grid .promo-card b{position:relative;z-index:2;max-width:55%;color:#fff!important;text-shadow:0 8px 22px rgba(0,0,0,.35)}.skate-banner-grid .promo-card span{font-size:1.72rem!important;line-height:1.35!important}.skate-banner-grid .promo-card b{font-size:.95rem!important;line-height:1.8!important;color:rgba(255,255,255,.84)!important}
.brand-row,.boxed,.trust-strip,.club-contact,.academy-card,.main-category-card,.article-card,.category,.admin-card,.dashboard-panel,.filter-panel{background:var(--paper)!important;color:var(--ink)!important;border-color:var(--line)!important;box-shadow:var(--shadow)!important}.trust-strip strong,.club-copy h2,.academy-card h3,.main-category-copy span,.article-card h3,.section-title h2,.product-card h3{color:var(--ink)!important}.trust-strip span,.club-copy p,.academy-card p,.article-card p,.section-title a{color:var(--muted)!important}.section-title h2:after{background:var(--red)!important}.product-card{background:#fff!important;color:var(--ink)!important;border-color:var(--line)!important;box-shadow:none!important}.product-media{background:radial-gradient(circle at 50% 38%,rgba(227,6,19,.12),transparent 44%),linear-gradient(180deg,#fff,#f5f6f8)!important}.product-card:hover{box-shadow:0 22px 48px rgba(20,24,30,.12)!important}.product-card b,.mini-product b{color:var(--red)!important}.add-cart{background:linear-gradient(135deg,#15181d,#e30613)!important;color:#fff!important}
.club-contact{position:relative!important;overflow:hidden!important;grid-template-columns:minmax(0,1fr) minmax(320px,430px)!important;border-radius:20px!important;padding:30px!important;background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,.90)),url("generated/skate365-consult-banner.png") left center/58% auto no-repeat!important}.club-contact:before{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 48%,rgba(255,255,255,.35) 100%)!important;z-index:0!important}.club-contact>*{position:relative;z-index:1}.club-form{padding:20px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.92);box-shadow:0 18px 44px rgba(20,24,30,.10)}.club-form input,.club-form textarea{background:#fff!important;border-color:var(--line)!important;border-radius:12px!important}.club-stats b{background:rgba(227,6,19,.08)!important;color:var(--red)!important;border:1px solid rgba(227,6,19,.12)}
.main-category-grid,.academy-grid,.article-grid,.product-grid{min-width:0}.main-category-card{overflow:hidden}.main-category-card,.academy-card,.article-card,.product-card{border-radius:16px!important}.footer{background:radial-gradient(circle at 85% 8%,rgba(227,6,19,.22),transparent 24%),linear-gradient(135deg,#111318,#24272d)!important}
@media (max-width:1100px){.skate-cinema-hero{grid-template-columns:1fr!important;padding:38px 30px!important;background-position:center!important}.hero-copy{grid-column:1!important;justify-self:stretch!important;max-width:680px!important}.cinema-logo{left:30px;top:28px;opacity:.72}.skate-banner-grid .promo-card span,.skate-banner-grid .promo-card b{max-width:68%}}
@media (max-width:960px){.skate-cinema-hero{min-height:520px!important}.promo-grid,.skate-banner-grid{grid-template-columns:1fr!important}.club-contact{grid-template-columns:1fr!important;background-size:cover!important;background-position:center!important}.club-contact:before{background:rgba(255,255,255,.90)!important}.trust-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}.product-grid,.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.main-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:680px){.shell{width:min(100% - 18px,1160px)!important}.topbar{width:min(100% - 18px,1160px)!important}.skate-cinema-hero{min-height:auto!important;padding:24px 16px!important;border-radius:16px!important;background-position:center!important}.cinema-logo{position:relative;top:auto;left:auto;margin-bottom:14px;transform:skewX(-8deg) scale(.78);transform-origin:right center}.cinema-logo span{font-size:1.6rem}.cinema-logo strong{font-size:3.6rem}.hero h1{font-size:clamp(2rem,9vw,3.15rem)!important}.hero p{font-size:.92rem!important;line-height:1.9!important}.hero-actions{display:grid!important;grid-template-columns:1fr!important}.hero-actions .btn{width:100%;min-height:50px}.cinema-feature-row{display:grid!important}.cinema-feature-row span+span{border-right:0;border-top:1px solid rgba(255,255,255,.14)}.skate-banner-grid .promo-card{min-height:220px!important;padding:22px!important}.skate-banner-grid .promo-card span,.skate-banner-grid .promo-card b{max-width:78%}.skate-banner-grid .promo-card span{font-size:1.35rem!important}.trust-strip,.product-grid,.catalog-grid,.main-category-grid,.academy-grid,.article-grid{grid-template-columns:1fr!important}.brand-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}.club-contact{padding:22px 16px!important}.product-card{min-height:auto!important}.product-media{height:190px!important}}

/* Client requested polish: logo header, red/black category covers, modern loader, club banner. */
.brand-mark{
  width:52px!important;
  height:52px!important;
  padding:5px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#ffffff,#f3f4f6)!important;
  border:1px solid rgba(21,24,29,.1)!important;
  box-shadow:0 12px 30px rgba(21,24,29,.14)!important;
  overflow:hidden!important;
}
.brand-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.site-loader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 38%,rgba(227,6,19,.2),transparent 28%),
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.08),transparent 24%),
    linear-gradient(135deg,#08090b 0%,#191b20 48%,#410006 100%);
  transition:opacity .55s var(--ease),visibility .55s var(--ease),transform .55s var(--ease);
}
.site-loader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:scale(1.03);
}
.loader-panel{
  position:relative;
  width:min(300px,78vw);
  min-height:260px;
  display:grid;
  place-items:center;
  gap:18px;
  padding:34px 30px 28px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.045));
  box-shadow:0 34px 90px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.06);
  overflow:hidden;
  backdrop-filter:blur(18px);
}
.loader-panel:before{
  content:"";
  position:absolute;
  inset:-55% -25%;
  background:conic-gradient(from 0deg,transparent,rgba(227,6,19,.18),rgba(255,255,255,.18),transparent 42%);
  animation:loaderSweep 2.4s linear infinite;
}
.loader-ring{
  position:absolute;
  width:132px;
  height:132px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.12);
  border-top-color:#e30613;
  border-left-color:rgba(227,6,19,.75);
  animation:loaderSpin 1s linear infinite;
  box-shadow:0 0 38px rgba(227,6,19,.28);
}
.loader-panel img{
  position:relative;
  z-index:2;
  width:96px;
  height:96px;
  object-fit:contain;
  border-radius:22px;
  background:#fff;
  padding:8px;
  box-shadow:0 18px 36px rgba(0,0,0,.32);
}
.loader-track{
  position:relative;
  z-index:2;
  width:100%;
  height:5px;
  border-radius:99px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.loader-track span{
  display:block;
  width:42%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,transparent,#fff,#e30613);
  animation:loaderTrack 1.15s var(--ease) infinite;
}
.loader-wheels{
  position:relative;
  z-index:2;
  display:flex;
  gap:11px;
}
.loader-wheels i{
  width:12px;
  height:12px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 18px rgba(227,6,19,.7);
  animation:loaderDot .9s ease-in-out infinite;
}
.loader-wheels i:nth-child(2){animation-delay:.12s;background:#e30613}
.loader-wheels i:nth-child(3){animation-delay:.24s}
@keyframes loaderSpin{to{transform:rotate(360deg)}}
@keyframes loaderSweep{to{transform:rotate(360deg)}}
@keyframes loaderTrack{0%{transform:translateX(140%)}100%{transform:translateX(-260%)}}
@keyframes loaderDot{0%,100%{transform:translateY(0);opacity:.55}50%{transform:translateY(-8px);opacity:1}}
.skate-banner-grid .promo-card:first-child{
  align-items:flex-end!important;
  text-align:right!important;
}
.skate-banner-grid .promo-card:first-child:before{
  background:linear-gradient(270deg,rgba(5,6,7,.95) 0%,rgba(18,20,21,.72) 43%,rgba(227,6,19,.34) 100%)!important;
}
.skate-banner-grid .promo-card:first-child span,
.skate-banner-grid .promo-card:first-child b{
  max-width:62%!important;
  margin-right:0!important;
  margin-left:auto!important;
  text-align:right!important;
}
.main-category-card{
  background:#07080a!important;
  border-color:rgba(227,6,19,.28)!important;
  box-shadow:0 28px 70px rgba(8,9,11,.22)!important;
}
.main-category-card:before,
.main-category-card.tone-dark:before,
.main-category-card.tone-steel:before,
.main-category-card.tone-ash:before{
  background:
    linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.42) 44%,rgba(0,0,0,.92) 100%),
    radial-gradient(circle at 16% 10%,rgba(255,255,255,.14),transparent 28%),
    linear-gradient(135deg,#050506 0%,#181a1f 50%,#e30613 100%)!important;
}
.main-category-card:after{
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:inset 0 0 0 1px rgba(227,6,19,.18)!important;
}
.main-category-media{
  background:linear-gradient(135deg,#060708,#1b1e24 52%,#9b000a)!important;
}
.main-category-media img{
  border-color:rgba(255,255,255,.12)!important;
  background:#111318!important;
  filter:saturate(1.12) contrast(1.08) drop-shadow(0 18px 22px rgba(0,0,0,.34))!important;
}
.main-category-copy span,
.main-category-copy b,
.main-category-copy small{
  color:#fff!important;
}
.main-category-copy small{
  background:linear-gradient(135deg,#e30613,#8f0008)!important;
  box-shadow:0 12px 26px rgba(227,6,19,.28)!important;
}
.club-contact{
  min-height:420px!important;
  align-items:end!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.86) 44%,rgba(255,255,255,.14) 100%),
    url("generated/skate365-academy-banner.png") left center/58% 100% no-repeat!important;
}
.club-contact:before{
  background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.9) 42%,rgba(255,255,255,.22) 100%)!important;
}
.club-contact:after{
  content:"";
  position:absolute;
  left:24px;
  top:24px;
  bottom:24px;
  width:min(42%,430px);
  border:1px solid rgba(255,255,255,.22);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(227,6,19,.18));
  pointer-events:none;
  z-index:0;
}
@media (max-width:960px){
  .club-contact{
    min-height:auto!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.92)),
      url("generated/skate365-academy-banner.png") center/cover no-repeat!important;
  }
  .club-contact:after{display:none}
}
@media (max-width:680px){
  .brand-mark{width:46px!important;height:46px!important;border-radius:14px!important}
  .skate-banner-grid .promo-card:first-child span,
  .skate-banner-grid .promo-card:first-child b{max-width:82%!important}
  .site-loader .loader-panel{min-height:230px;border-radius:22px}
}

/* Loader, hero alignment and academy registration banner - 20260712 */
.skate-cinema-hero .hero-copy{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-end!important;
  justify-items:end!important;
}
.skate-cinema-hero .hero-copy>*,
.skate-cinema-hero .hero-copy h1,
.skate-cinema-hero .hero-copy p{margin-right:0!important;margin-left:auto!important;text-align:right!important}
.skate-cinema-hero .hero-actions{justify-content:flex-start!important;direction:rtl!important}
.skate-cinema-hero .cinema-feature-row{direction:rtl!important;justify-content:flex-start!important;align-self:flex-start!important}

.site-loader{overflow:hidden;perspective:900px}
.site-loader:before{
  content:"";position:absolute;inset:0;opacity:.28;
  background:repeating-linear-gradient(118deg,transparent 0 56px,rgba(255,255,255,.08) 57px 58px,transparent 59px 112px);
  transform:translateX(0);animation:loaderRoad 1.5s linear infinite;
}
.site-loader:after{
  content:"";position:absolute;left:-10%;right:-10%;bottom:8%;height:2px;
  background:linear-gradient(90deg,transparent,#e30613 22%,#fff 50%,#e30613 78%,transparent);
  box-shadow:0 0 22px #e30613,0 -44px 80px rgba(227,6,19,.28);
}
.loader-speed-lines{position:absolute;inset:0;pointer-events:none}
.loader-speed-lines i{position:absolute;right:-35%;width:38%;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75));animation:loaderSpeed 1.15s linear infinite}
.loader-speed-lines i:nth-child(1){top:23%;animation-delay:-.2s}.loader-speed-lines i:nth-child(2){top:42%;width:52%;animation-delay:-.8s}.loader-speed-lines i:nth-child(3){top:67%;width:30%;animation-delay:-.45s}.loader-speed-lines i:nth-child(4){top:79%;width:44%;animation-delay:-1s}
.loader-panel{
  width:min(360px,86vw)!important;min-height:340px!important;gap:12px!important;padding:30px 34px 26px!important;
  border-radius:24px!important;transform:rotateX(3deg);animation:loaderPanelIn .65s cubic-bezier(.2,.8,.2,1) both;
}
.loader-panel:after{content:"";position:absolute;inset:1px;border-radius:23px;border:1px solid rgba(227,6,19,.22);pointer-events:none}
.loader-stage{position:relative;z-index:2;width:190px;height:190px;display:grid;place-items:center}
.loader-stage img{width:104px!important;height:104px!important;border-radius:26px!important;animation:loaderLogoPulse 1.6s ease-in-out infinite!important}
.loader-orbit{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.16)}
.loader-orbit-one{inset:10px;border-top:3px solid #e30613;border-right:3px solid transparent;animation:loaderSpin 1.15s linear infinite}
.loader-orbit-two{inset:28px;border-bottom:2px solid #fff;border-left:2px solid transparent;animation:loaderSpinReverse 1.8s linear infinite}
.loader-skate{position:absolute;z-index:4;left:4px;bottom:19px;width:62px;height:24px;border:3px solid #fff;border-top:0;border-radius:4px 4px 12px 12px;transform:rotate(-8deg);filter:drop-shadow(0 0 10px rgba(227,6,19,.8));animation:loaderSkate 1.6s ease-in-out infinite}
.loader-skate:before{content:"";position:absolute;left:5px;bottom:15px;width:34px;height:29px;border:3px solid #e30613;border-bottom:0;border-radius:14px 22px 0 4px;transform:skewX(-10deg)}
.loader-skate i{position:absolute;bottom:-10px;width:8px;height:8px;border-radius:50%;background:#e30613;box-shadow:0 0 8px #e30613;animation:loaderWheel .35s linear infinite}
.loader-skate i:nth-child(1){left:3px}.loader-skate i:nth-child(2){left:18px}.loader-skate i:nth-child(3){left:34px}.loader-skate i:nth-child(4){left:49px}
.loader-panel strong{position:relative;z-index:2;color:#fff;font-size:1.2rem;letter-spacing:2px;direction:ltr}
.loader-panel small{position:relative;z-index:2;color:rgba(255,255,255,.55);font-size:.66rem;letter-spacing:3px;direction:ltr}
.loader-track{height:6px!important;border:1px solid rgba(255,255,255,.12)}
.loader-track span{width:55%!important;background:linear-gradient(90deg,transparent,#e30613 38%,#fff 70%,transparent)!important;box-shadow:0 0 14px rgba(227,6,19,.8)}
.site-loader.is-hidden .loader-panel{transform:translateY(-24px) rotateX(10deg) scale(.92);opacity:0;transition:.45s ease}
@keyframes loaderRoad{to{background-position:224px 0}}
@keyframes loaderSpeed{0%{transform:translateX(0);opacity:0}20%{opacity:1}100%{transform:translateX(-380%);opacity:0}}
@keyframes loaderSpinReverse{to{transform:rotate(-360deg)}}
@keyframes loaderLogoPulse{0%,100%{transform:scale(.96);box-shadow:0 18px 36px rgba(0,0,0,.32)}50%{transform:scale(1.03);box-shadow:0 18px 48px rgba(227,6,19,.38)}}
@keyframes loaderSkate{0%,100%{transform:translate(-4px,2px) rotate(-8deg)}50%{transform:translate(8px,-5px) rotate(-3deg)}}
@keyframes loaderWheel{to{transform:rotate(360deg)}}
@keyframes loaderPanelIn{from{opacity:0;transform:translateY(30px) rotateX(12deg) scale(.92)}to{opacity:1;transform:rotateX(3deg)}}

.club-contact{
  direction:ltr!important;grid-template-columns:minmax(0,1fr) minmax(330px,430px)!important;min-height:500px!important;
  padding:34px!important;background:
    linear-gradient(90deg,rgba(6,7,9,.18) 0%,rgba(8,9,11,.52) 47%,rgba(255,255,255,.93) 66%,rgba(255,255,255,.98) 100%),
    url("generated/skate365-academy-registration-v2.png") center/cover no-repeat!important;
  border:1px solid rgba(227,6,19,.24)!important;box-shadow:0 30px 76px rgba(16,18,22,.22)!important;
}
.club-contact:before{background:linear-gradient(135deg,rgba(227,6,19,.16),transparent 42%,rgba(255,255,255,.12))!important}
.club-contact:after{left:18px!important;top:18px!important;bottom:18px!important;width:48%!important;background:linear-gradient(180deg,transparent,rgba(0,0,0,.42))!important;border-color:rgba(255,255,255,.15)!important}
.club-contact .club-copy{direction:rtl;align-self:end;padding:26px;max-width:560px;color:#fff;text-shadow:0 4px 18px rgba(0,0,0,.55)}
.club-contact .club-copy>span,.club-contact .club-copy h2,.club-contact .club-copy p{color:#fff!important}
.club-contact .club-copy>span{display:inline-flex;padding:7px 12px;border-radius:9px;background:#e30613;font-weight:900}
.club-contact .club-copy p{color:rgba(255,255,255,.86)!important}
.club-contact .club-stats b{background:rgba(8,9,11,.68)!important;color:#fff!important;border-color:rgba(255,255,255,.18)!important;backdrop-filter:blur(8px)}
.club-contact .club-form{direction:rtl;align-self:center;background:rgba(255,255,255,.94)!important;backdrop-filter:blur(16px);border-color:rgba(255,255,255,.72)!important;box-shadow:0 24px 64px rgba(0,0,0,.25)!important}
@media (max-width:960px){
  .club-contact{direction:rtl!important;grid-template-columns:1fr!important;background:linear-gradient(180deg,rgba(6,7,9,.42),rgba(255,255,255,.94) 58%),url("generated/skate365-academy-registration-v2.png") 24% center/cover no-repeat!important}
  .club-contact .club-copy{padding:18px 8px;max-width:680px}.club-contact:after{display:none!important}
}
@media (max-width:680px){
  .loader-panel{min-height:310px!important;padding:24px!important}.loader-stage{width:168px;height:168px}.loader-stage img{width:92px!important;height:92px!important}
  .club-contact{padding:18px!important;background:linear-gradient(180deg,rgba(5,6,8,.36),rgba(255,255,255,.97) 52%),url("generated/skate365-academy-registration-v2.png") 30% top/auto 58% no-repeat!important}.club-contact .club-copy{padding:12px 2px 38px}.club-contact .club-copy h2{font-size:1.45rem!important}
}
@media (prefers-reduced-motion:reduce){.site-loader *,.site-loader:before{animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* Exact promo alignment and dedicated club visual - 20260712 v3 */
.skate-banner-grid .promo-card:first-child{
  direction:rtl!important;
  align-items:flex-start!important;
  justify-content:center!important;
  text-align:right!important;
}
.skate-banner-grid .promo-card:first-child span,
.skate-banner-grid .promo-card:first-child b{
  display:block!important;
  align-self:flex-start!important;
  width:min(62%,360px)!important;
  max-width:none!important;
  margin-right:0!important;
  margin-left:0!important;
  text-align:right!important;
}
.skate-banner-grid .promo-card:first-child b{width:auto!important;max-width:62%!important}

.club-contact{
  direction:ltr!important;
  grid-template-columns:minmax(0,1.45fr) minmax(340px,.72fr)!important;
  min-height:520px!important;
  gap:18px!important;
  padding:18px!important;
  background:#101216!important;
  border:1px solid rgba(227,6,19,.32)!important;
}
.club-contact:before,.club-contact:after{display:none!important}
.club-visual{
  position:relative;min-width:0;min-height:484px;overflow:hidden;border-radius:15px;
  background:#08090b;isolation:isolate;
}
.club-visual:after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(4,5,6,.04) 20%,rgba(4,5,6,.28) 53%,rgba(4,5,6,.96) 100%);
  pointer-events:none;
}
.club-visual>img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:39% center;
  display:block;filter:saturate(1.08) contrast(1.06);transition:transform .7s var(--ease);
}
.club-contact:hover .club-visual>img{transform:scale(1.025)}
.club-contact .club-copy{
  position:absolute!important;right:0;left:0;bottom:0;z-index:2!important;
  direction:rtl!important;max-width:none!important;padding:34px!important;color:#fff!important;
}
.club-contact .club-copy h2{max-width:720px;color:#fff!important;font-size:clamp(1.55rem,2.2vw,2.25rem)!important;line-height:1.45!important}
.club-contact .club-copy p{max-width:760px;margin-top:10px;color:rgba(255,255,255,.78)!important;line-height:1.85!important}
.club-contact .club-form{
  direction:rtl!important;align-self:stretch!important;display:flex!important;flex-direction:column!important;justify-content:center!important;
  padding:26px!important;border-radius:15px!important;background:#fff!important;box-shadow:none!important;
}
.club-contact .club-form:before{content:"ثبت‌نام باشگاه";display:block;margin-bottom:18px;color:#15181d;font-size:1.35rem;font-weight:1000;text-align:right}
@media (max-width:960px){
  .club-contact{direction:rtl!important;grid-template-columns:1fr!important;min-height:auto!important}
  .club-visual{min-height:500px}.club-contact .club-form{min-height:auto!important}
}
@media (max-width:680px){
  .skate-banner-grid .promo-card:first-child span{width:84%!important}.skate-banner-grid .promo-card:first-child b{max-width:84%!important}
  .club-contact{padding:10px!important;gap:10px!important}.club-visual{min-height:530px}.club-visual>img{object-position:35% center}.club-contact .club-copy{padding:20px!important}.club-contact .club-copy p{font-size:.84rem!important}.club-contact .club-stats{gap:6px!important}.club-contact .club-stats b{font-size:.7rem!important}.club-contact .club-form{padding:20px!important}
}

/* Final club readability and physical right hero placement - 20260712 v4 */
.skate-cinema-hero .hero-copy{
  grid-column:1!important;
  grid-row:1!important;
  justify-self:end!important;
  align-self:center!important;
  width:100%!important;
  direction:rtl!important;
  text-align:right!important;
}
.skate-cinema-hero .hero-copy>*{align-self:flex-start!important;text-align:right!important}
.skate-cinema-hero .hero-actions,
.skate-cinema-hero .cinema-feature-row{align-self:flex-start!important;justify-content:flex-start!important}

.club-visual{
  display:grid!important;
  grid-template-rows:minmax(285px,1fr) auto!important;
  min-height:484px!important;
  background:#fff!important;
}
.club-visual:after{display:none!important}
.club-visual>img{
  position:relative!important;
  inset:auto!important;
  grid-row:1!important;
  width:100%!important;
  height:100%!important;
  min-height:285px!important;
  object-fit:cover!important;
  object-position:38% center!important;
}
.club-contact .club-copy{
  position:relative!important;
  right:auto!important;
  left:auto!important;
  bottom:auto!important;
  grid-row:2!important;
  padding:24px 26px!important;
  background:#fff!important;
  color:#15181d!important;
  text-shadow:none!important;
}
.club-contact .club-copy>span{
  color:#fff!important;
  background:#e30613!important;
  text-shadow:none!important;
}
.club-contact .club-copy h2{color:#15181d!important;text-shadow:none!important}
.club-contact .club-copy p{color:#626870!important;text-shadow:none!important}
.club-contact .club-stats b{
  color:#15181d!important;
  background:#f2f3f5!important;
  border-color:#e0e3e7!important;
  text-shadow:none!important;
}
.club-contact .club-form,
.club-contact .club-form label,
.club-contact .club-form input,
.club-contact .club-form textarea{color:#15181d!important;text-shadow:none!important}
@media (max-width:1100px){
  .skate-cinema-hero .hero-copy{grid-column:1!important;grid-row:auto!important;justify-self:end!important}
}
@media (max-width:680px){
  .club-visual{grid-template-rows:270px auto!important;min-height:auto!important}
  .club-visual>img{min-height:270px!important;object-position:32% center!important}
  .club-contact .club-copy{padding:20px!important}
}

/* IRANYekanX and premium academy registration - 20260712 v5 */
@font-face{
  font-family:"IRANYekanX";
  src:url("../font/IRANYekanX-Medium.woff") format("woff");
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"IRANYekanX";
  src:url("../font/IRANYekanX-Black.woff") format("woff");
  font-weight:800 1000;
  font-style:normal;
  font-display:swap;
}
html,body,button,input,select,textarea{font-family:"IRANYekanX",Tahoma,sans-serif!important}
.brand strong,.main-nav a,.hero h1,.section-title h2,.promo-card span,.wide-banner h2,.footer h2,.footer h3,.product-card h3,.category b{font-family:"IRANYekanX",Tahoma,sans-serif!important}

.club-contact{
  position:relative!important;
  grid-template-columns:minmax(0,1.42fr) minmax(370px,.76fr)!important;
  gap:0!important;
  padding:8px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:linear-gradient(135deg,#07080a 0%,#17191e 58%,#520007 100%)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:0 34px 90px rgba(10,11,14,.28),0 0 0 7px rgba(227,6,19,.035)!important;
}
.club-contact:before{
  display:block!important;content:""!important;position:absolute!important;inset:0!important;z-index:0!important;
  background:linear-gradient(115deg,transparent 0 63%,rgba(227,6,19,.2) 63.2% 64%,transparent 64.2%),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 64px)!important;
  pointer-events:none;
}
.club-contact>*{position:relative;z-index:1}
.club-visual{
  grid-template-rows:minmax(315px,1fr) auto!important;
  min-height:570px!important;
  border-radius:18px 5px 5px 18px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)!important;
}
.club-visual>img{min-height:315px!important;object-position:36% center!important}
.club-visual:before{
  content:"ACADEMY 365";position:absolute;top:22px;left:22px;z-index:2;direction:ltr;
  padding:8px 12px;border:1px solid rgba(255,255,255,.28);border-radius:8px;
  background:rgba(7,8,10,.64);color:#fff;font-size:.68rem;font-weight:900;letter-spacing:2px;backdrop-filter:blur(10px);
}
.club-contact .club-copy{
  padding:25px 30px 28px!important;
  border-top:4px solid #e30613!important;
  background:linear-gradient(180deg,#fff,#f4f5f7)!important;
}
.club-contact .club-copy>span{padding:7px 11px!important;border-radius:7px!important;font-size:.76rem!important}
.club-contact .club-copy h2{margin:12px 0 8px!important;font-size:clamp(1.45rem,1.9vw,2rem)!important;line-height:1.48!important}
.club-contact .club-copy p{margin:0!important;font-size:.87rem!important;line-height:1.9!important}
.club-contact .club-stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px!important;margin-top:17px!important}
.club-contact .club-stats b{
  min-height:48px;display:flex;align-items:center;justify-content:center;padding:8px!important;border-radius:8px!important;
  color:#202329!important;background:#fff!important;border:1px solid #e0e3e7!important;font-size:.72rem!important;text-align:center!important;
}
.club-contact .club-stats b:before{content:"";width:7px;height:7px;margin-left:7px;flex:0 0 auto;border-radius:50%;background:#e30613;box-shadow:0 0 0 4px rgba(227,6,19,.1)}
.club-contact .club-form{
  align-self:stretch!important;justify-content:center!important;margin:18px 18px 18px 10px!important;padding:28px!important;
  border:1px solid rgba(255,255,255,.16)!important;border-radius:18px!important;
  background:rgba(255,255,255,.965)!important;box-shadow:0 24px 64px rgba(0,0,0,.32)!important;
}
.club-contact .club-form:before{display:none!important}
.club-form-head{display:flex;align-items:center;gap:13px;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid #e1e4e8}
.club-form-head>span{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:linear-gradient(135deg,#15181d,#e30613);color:#fff;font-size:1rem;font-weight:1000;direction:ltr;box-shadow:0 12px 24px rgba(227,6,19,.22)}
.club-form-head div{display:grid;gap:2px}.club-form-head small{color:#858b93;font-size:.68rem}.club-form-head strong{color:#15181d;font-size:1.15rem;font-weight:1000}
.club-contact .club-form label{gap:7px!important;margin-bottom:13px!important;color:#30343a!important;font-size:.78rem!important;font-weight:800!important}
.club-contact .club-form input,.club-contact .club-form textarea{
  border:1px solid #d9dde2!important;border-radius:9px!important;background:#f7f8f9!important;color:#15181d!important;
  outline:0!important;box-shadow:none!important;transition:border-color .2s,box-shadow .2s,background .2s!important;
}
.club-contact .club-form input{min-height:48px!important}.club-contact .club-form textarea{min-height:112px!important;resize:vertical!important}
.club-contact .club-form input:focus,.club-contact .club-form textarea:focus{background:#fff!important;border-color:#e30613!important;box-shadow:0 0 0 4px rgba(227,6,19,.09)!important}
.club-contact .club-form .btn{width:100%!important;min-height:52px!important;margin-top:3px!important;border-radius:9px!important;font-weight:1000!important;box-shadow:0 14px 28px rgba(227,6,19,.24)!important}
.club-form-note{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:13px;color:#7b8189;font-size:.66rem;text-align:center}
.club-form-note i{width:7px;height:7px;border-radius:50%;background:#20a85a;box-shadow:0 0 0 4px rgba(32,168,90,.1)}
@media (max-width:960px){
  .club-contact{grid-template-columns:1fr!important;padding:8px!important}.club-visual{min-height:auto!important;border-radius:18px 18px 5px 5px!important}.club-contact .club-form{margin:10px 0 0!important}
}
@media (max-width:680px){
  .club-contact{border-radius:18px!important}.club-visual{grid-template-rows:250px auto!important}.club-visual>img{min-height:250px!important}.club-visual:before{top:14px;left:14px}.club-contact .club-copy{padding:20px!important}.club-contact .club-stats{grid-template-columns:1fr!important}.club-contact .club-stats b{justify-content:flex-start!important}.club-contact .club-form{padding:20px!important;border-radius:14px!important}.club-form-head strong{font-size:1rem}.club-form-head>span{width:44px;height:44px}
}

/* Clean product-first homepage hero - 20260712 v6 */
.skate-cinema-hero{
  min-height:520px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  direction:rtl!important;
  margin-top:22px!important;
  padding:52px 54px!important;
  border-radius:20px!important;
  isolation:isolate!important;
  background:
    linear-gradient(90deg,rgba(5,6,8,.04) 0%,rgba(5,6,8,.16) 38%,rgba(5,6,8,.76) 66%,rgba(5,6,8,.97) 100%),
    url("generated/skate365-hero-banner.png") center/cover no-repeat!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:0 28px 72px rgba(12,14,17,.24)!important;
  overflow:hidden!important;
}
.skate-cinema-hero:before{
  content:""!important;display:block!important;position:absolute!important;inset:0!important;z-index:-1!important;
  background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 28%,rgba(0,0,0,.18))!important;
  pointer-events:none!important;
}
.skate-cinema-hero:after{display:none!important}
.skate-cinema-hero .cinema-logo,.skate-cinema-hero .cinema-product{display:none!important}
.skate-cinema-hero .hero-copy{
  position:relative!important;
  grid-column:auto!important;grid-row:auto!important;
  width:min(58%,610px)!important;
  max-width:610px!important;
  margin:0!important;
  padding:0!important;
  justify-self:auto!important;
  align-self:center!important;
  direction:rtl!important;
  text-align:right!important;
}
.skate-cinema-hero .hero-copy>*{margin-right:0!important;margin-left:0!important;text-align:right!important}
.skate-cinema-hero .hero .kicker,.skate-cinema-hero .kicker{
  width:max-content!important;display:inline-flex!important;margin-bottom:15px!important;padding:7px 12px!important;
  border-radius:7px!important;background:#e30613!important;border:0!important;color:#fff!important;font-size:.72rem!important;
  box-shadow:0 10px 24px rgba(227,6,19,.25)!important;
}
.skate-cinema-hero h1{
  max-width:600px!important;margin:0!important;
  color:#fff!important;font-size:clamp(2.15rem,3.35vw,3.7rem)!important;line-height:1.32!important;letter-spacing:0!important;
  text-shadow:0 10px 28px rgba(0,0,0,.38)!important;text-wrap:balance!important;
}
.skate-cinema-hero .hero-copy>p:not(.kicker){
  max-width:570px!important;margin:15px 0 0!important;color:rgba(255,255,255,.76)!important;
  font-size:.92rem!important;line-height:2!important;
}
.skate-cinema-hero .hero-actions{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;
  margin-top:22px!important;direction:rtl!important;
}
.skate-cinema-hero .hero-actions .btn{min-height:48px!important;padding:0 20px!important;border-radius:9px!important;font-size:.82rem!important}
.skate-cinema-hero .hero-actions .primary{background:#e30613!important;box-shadow:0 13px 28px rgba(227,6,19,.27)!important}
.skate-cinema-hero .hero-actions .ghost{background:rgba(255,255,255,.08)!important;color:#fff!important;border:1px solid rgba(255,255,255,.3)!important;backdrop-filter:blur(10px)!important}
.skate-cinema-hero .hero-actions .ghost:hover{background:#fff!important;color:#15181d!important}
.skate-cinema-hero .cinema-feature-row{
  width:max-content!important;max-width:100%!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;
  gap:0!important;margin-top:22px!important;border-radius:9px!important;background:rgba(8,9,11,.58)!important;
  border:1px solid rgba(255,255,255,.13)!important;backdrop-filter:blur(10px)!important;overflow:hidden!important;
}
.skate-cinema-hero .cinema-feature-row span{min-height:43px!important;padding:0 13px!important;color:rgba(255,255,255,.82)!important;font-size:.72rem!important;font-weight:700!important}
.skate-cinema-hero .cinema-feature-row span:before{width:6px!important;height:6px!important;margin-left:7px!important;border:0!important;border-radius:50%!important;background:#e30613!important;box-shadow:0 0 0 4px rgba(227,6,19,.12)!important}
.skate-cinema-hero .cinema-feature-row span+span{border-right:1px solid rgba(255,255,255,.12)!important}
@media (max-width:960px){
  .skate-cinema-hero{min-height:500px!important;padding:40px 32px!important;background-position:42% center!important}.skate-cinema-hero .hero-copy{width:min(72%,600px)!important}
}
@media (max-width:680px){
  .skate-cinema-hero{min-height:610px!important;align-items:flex-end!important;padding:24px 18px!important;border-radius:15px!important;background:linear-gradient(180deg,rgba(5,6,8,.04) 0%,rgba(5,6,8,.2) 34%,rgba(5,6,8,.95) 61%,#050608 100%),url("generated/skate365-hero-banner.png") 28% top/auto 58% no-repeat!important}.skate-cinema-hero .hero-copy{width:100%!important;max-width:none!important}.skate-cinema-hero h1{font-size:clamp(1.85rem,8.2vw,2.6rem)!important;line-height:1.35!important}.skate-cinema-hero .hero-copy>p:not(.kicker){font-size:.82rem!important;line-height:1.85!important}.skate-cinema-hero .hero-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}.skate-cinema-hero .hero-actions .btn{width:100%!important}.skate-cinema-hero .cinema-feature-row{width:100%!important;display:grid!important;grid-template-columns:1fr!important}.skate-cinema-hero .cinema-feature-row span+span{border-right:0!important;border-top:1px solid rgba(255,255,255,.1)!important}
}

/* Clean academy registration section - 20260712 v7 */
.club-contact{
  direction:ltr!important;
  grid-template-columns:minmax(0,1.35fr) minmax(360px,.72fr)!important;
  gap:0!important;
  min-height:560px!important;
  margin-top:52px!important;
  padding:0!important;
  border-radius:20px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dfe2e6!important;
  box-shadow:0 26px 68px rgba(17,19,23,.14)!important;
}
.club-contact:before,.club-contact:after{display:none!important}
.club-visual{
  display:grid!important;
  grid-template-rows:minmax(320px,1fr) auto!important;
  min-height:560px!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.club-visual:before{
  content:"باشگاه اسکیت 365"!important;
  top:20px!important;right:20px!important;left:auto!important;
  padding:8px 12px!important;border:0!important;border-radius:7px!important;
  background:#e30613!important;color:#fff!important;font-size:.72rem!important;letter-spacing:0!important;direction:rtl!important;
  box-shadow:0 12px 26px rgba(227,6,19,.24)!important;
}
.club-visual>img{
  grid-row:1!important;
  min-height:320px!important;
  object-position:35% center!important;
  filter:saturate(1.04) contrast(1.03)!important;
}
.club-contact:hover .club-visual>img{transform:scale(1.015)!important}
.club-contact .club-copy{
  grid-row:2!important;
  padding:25px 30px 28px!important;
  border:0!important;
  border-top:1px solid #e4e7ea!important;
  background:#fff!important;
}
.club-contact .club-copy>span{display:none!important}
.club-contact .club-copy h2{
  margin:0!important;
  max-width:760px!important;
  color:#171a1f!important;
  font-size:clamp(1.45rem,2vw,2.05rem)!important;
  line-height:1.5!important;
}
.club-contact .club-copy p{
  margin:10px 0 0!important;
  max-width:780px!important;
  color:#6b7179!important;
  font-size:.84rem!important;
  line-height:1.95!important;
}
.club-contact .club-stats{
  display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin-top:17px!important;
}
.club-contact .club-stats b{
  width:auto!important;min-height:38px!important;justify-content:flex-start!important;
  padding:7px 11px!important;border-radius:7px!important;
  color:#34383e!important;background:#f4f5f6!important;border:1px solid #e3e5e8!important;font-size:.7rem!important;
}
.club-contact .club-stats b:before{width:6px!important;height:6px!important;margin-left:7px!important;box-shadow:none!important}
.club-contact .club-form{
  direction:rtl!important;
  align-self:stretch!important;
  justify-content:center!important;
  margin:0!important;
  padding:36px 30px!important;
  border:0!important;
  border-right:1px solid #e1e4e7!important;
  border-radius:0!important;
  background:linear-gradient(180deg,#f8f9fa,#f1f3f5)!important;
  box-shadow:none!important;
}
.club-form-head{margin-bottom:24px!important;padding-bottom:19px!important;border-color:#dce0e4!important}
.club-form-head>span{
  width:46px!important;height:46px!important;border-radius:9px!important;
  background:#171a1f!important;box-shadow:none!important;
}
.club-form-head small{color:#888e96!important}.club-form-head strong{font-size:1.1rem!important;color:#171a1f!important}
.club-contact .club-form label{margin-bottom:13px!important;color:#3f444a!important}
.club-contact .club-form input,.club-contact .club-form textarea{
  background:#fff!important;border-color:#d7dbe0!important;border-radius:8px!important;
}
.club-contact .club-form textarea{min-height:105px!important}
.club-contact .club-form .btn{
  min-height:50px!important;border-radius:8px!important;background:#e30613!important;
  box-shadow:0 12px 24px rgba(227,6,19,.2)!important;
}
.club-form-note{color:#777d85!important}
@media (max-width:960px){
  .club-contact{grid-template-columns:1fr!important;min-height:auto!important}.club-visual{min-height:auto!important}.club-contact .club-form{border-right:0!important;border-top:1px solid #e1e4e7!important;padding:28px!important}
}
@media (max-width:680px){
  .club-contact{margin-top:36px!important;border-radius:15px!important}.club-visual{grid-template-rows:250px auto!important}.club-visual>img{min-height:250px!important;object-position:31% center!important}.club-visual:before{top:14px!important;right:14px!important}.club-contact .club-copy{padding:21px 18px 23px!important}.club-contact .club-copy h2{font-size:1.38rem!important}.club-contact .club-copy p{font-size:.8rem!important}.club-contact .club-stats{display:grid!important;grid-template-columns:1fr!important}.club-contact .club-form{padding:23px 18px!important}
}

/* Full-width academy banner with split registration content - 20260712 v8 */
.club-contact{
  direction:ltr!important;
  display:grid!important;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)!important;
  grid-template-rows:340px auto!important;
  gap:0!important;
  min-height:0!important;
  margin-top:54px!important;
  padding:0!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dfe2e6!important;
  box-shadow:0 26px 70px rgba(17,19,23,.13)!important;
}
.club-contact:before,.club-contact:after{display:none!important}
.club-visual{display:contents!important}
.club-visual:before,.club-visual:after{display:none!important}
.club-visual>img{
  position:relative!important;
  inset:auto!important;
  grid-column:1/-1!important;
  grid-row:1!important;
  width:100%!important;
  height:340px!important;
  min-height:0!important;
  object-fit:cover!important;
  object-position:43% 46%!important;
  transform:none!important;
  filter:saturate(1.08) contrast(1.05)!important;
  border:0!important;
}
.club-contact:hover .club-visual>img{transform:none!important}
.club-contact .club-copy{
  position:relative!important;
  grid-column:2!important;
  grid-row:2!important;
  direction:rtl!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-width:0!important;
  padding:38px 40px!important;
  border:0!important;
  background:#fff!important;
  color:#171a1f!important;
}
.club-contact .club-copy:before{
  content:"SKATE 365 ACADEMY";display:block;width:max-content;margin-bottom:12px;padding:6px 9px;
  border-radius:6px;background:#171a1f;color:#fff;font-size:.62rem;font-weight:900;letter-spacing:1.5px;direction:ltr;
}
.club-contact .club-copy>span{display:block!important;color:#e30613!important;background:none!important;padding:0!important;font-size:.72rem!important}
.club-contact .club-copy h2{margin:8px 0 0!important;color:#171a1f!important;font-size:clamp(1.45rem,2.15vw,2.2rem)!important;line-height:1.5!important}
.club-contact .club-copy p{margin:12px 0 0!important;color:#6c727a!important;font-size:.86rem!important;line-height:2!important}
.club-contact .club-stats{display:flex!important;flex-wrap:wrap!important;gap:7px!important;margin-top:20px!important}
.club-contact .club-stats b{width:auto!important;min-height:36px!important;padding:6px 10px!important;border-radius:6px!important;background:#f3f4f5!important;color:#34383e!important;border:1px solid #e2e5e8!important;font-size:.68rem!important}
.club-contact .club-form{
  position:relative!important;
  grid-column:1!important;
  grid-row:2!important;
  direction:rtl!important;
  align-self:stretch!important;
  justify-content:center!important;
  margin:0!important;
  padding:34px!important;
  border:0!important;
  border-left:0!important;
  border-right:1px solid #e1e4e7!important;
  border-radius:0!important;
  background:#f4f5f6!important;
  box-shadow:none!important;
}
.club-contact .club-form:after{
  content:"";position:absolute;top:0;right:34px;left:34px;height:3px;border-radius:0 0 4px 4px;background:#e30613;
}
.club-form-head{margin-bottom:20px!important;padding-bottom:17px!important}
.club-form-head>span{background:#e30613!important;color:#fff!important}
.club-contact .club-form input,.club-contact .club-form textarea{background:#fff!important}
.club-contact .club-form .btn{background:#171a1f!important;box-shadow:none!important;transition:background .2s,transform .2s!important}
.club-contact .club-form .btn:hover{background:#e30613!important}
@media (max-width:960px){
  .club-contact{grid-template-columns:1fr!important;grid-template-rows:300px auto auto!important}.club-visual>img{grid-column:1!important;grid-row:1!important;height:300px!important;object-position:38% center!important}.club-contact .club-copy{grid-column:1!important;grid-row:2!important;padding:30px!important}.club-contact .club-form{grid-column:1!important;grid-row:3!important;border-right:0!important;border-top:1px solid #e1e4e7!important;padding:30px!important}
}
@media (max-width:680px){
  .club-contact{grid-template-rows:230px auto auto!important;margin-top:38px!important;border-radius:14px!important}.club-visual>img{height:230px!important;object-position:34% center!important}.club-contact .club-copy{padding:24px 19px!important}.club-contact .club-copy h2{font-size:1.4rem!important}.club-contact .club-copy p{font-size:.8rem!important}.club-contact .club-stats{display:grid!important;grid-template-columns:1fr!important}.club-contact .club-form{padding:26px 19px!important}.club-contact .club-form:after{right:19px;left:19px}
}

/* Skate academy poster layout - 20260712 v9 */
.club-contact{
  direction:ltr!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.28fr) minmax(390px,.92fr)!important;
  grid-template-rows:auto 1fr!important;
  gap:0!important;
  min-height:650px!important;
  margin-top:56px!important;
  padding:0!important;
  border-radius:20px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dadddf!important;
  box-shadow:0 30px 80px rgba(13,15,18,.16)!important;
}
.club-contact:before,.club-contact:after{display:none!important}
.club-visual{display:contents!important}
.club-visual:before,.club-visual:after{display:none!important}
.club-visual>img{
  position:relative!important;inset:auto!important;
  grid-column:1!important;grid-row:1/3!important;
  width:100%!important;height:100%!important;min-height:650px!important;
  object-fit:cover!important;object-position:41% center!important;
  filter:saturate(1.08) contrast(1.06)!important;transform:none!important;
  border:0!important;
}
.club-contact:hover .club-visual>img{transform:none!important}
.club-contact .club-copy{
  position:relative!important;
  grid-column:2!important;grid-row:1!important;
  direction:rtl!important;
  display:block!important;
  padding:34px 36px 24px!important;
  border:0!important;border-right:5px solid #e30613!important;
  background:#fff!important;color:#171a1f!important;
}
.club-contact .club-copy:before{
  content:"باشگاه تخصصی اسکیت"!important;display:inline-flex!important;width:auto!important;
  margin:0 0 13px!important;padding:6px 10px!important;border-radius:6px!important;
  background:#171a1f!important;color:#fff!important;font-size:.68rem!important;font-weight:900!important;
  letter-spacing:0!important;direction:rtl!important;
}
.club-contact .club-copy>span{display:none!important}
.club-contact .club-copy h2{
  margin:0!important;color:#171a1f!important;
  font-size:clamp(1.55rem,2.05vw,2.15rem)!important;line-height:1.48!important;
}
.club-contact .club-copy p{
  margin:10px 0 0!important;color:#6a7078!important;
  font-size:.8rem!important;line-height:1.9!important;
  display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical!important;overflow:hidden!important;
}
.club-contact .club-stats{display:flex!important;flex-wrap:wrap!important;gap:7px!important;margin-top:15px!important}
.club-contact .club-stats b{
  width:auto!important;min-height:34px!important;padding:6px 9px!important;border-radius:6px!important;
  background:#f2f3f5!important;color:#35393f!important;border:1px solid #e1e4e7!important;font-size:.65rem!important;
}
.club-contact .club-stats b:before{width:5px!important;height:5px!important;margin-left:6px!important;background:#e30613!important;box-shadow:none!important}
.club-contact .club-form{
  position:relative!important;
  grid-column:2!important;grid-row:2!important;
  direction:rtl!important;align-self:stretch!important;justify-content:flex-start!important;
  margin:0!important;padding:22px 36px 32px!important;
  border:0!important;border-right:5px solid #e30613!important;border-radius:0!important;
  background:#fff!important;box-shadow:none!important;
}
.club-contact .club-form:after{display:none!important}
.club-form-head{margin:0 0 18px!important;padding:14px 0!important;border-top:1px solid #e3e5e8!important;border-bottom:1px solid #e3e5e8!important}
.club-form-head>span{
  width:42px!important;height:42px!important;border-radius:50%!important;
  background:#e30613!important;color:#fff!important;font-size:.8rem!important;box-shadow:0 0 0 6px rgba(227,6,19,.08)!important;
}
.club-form-head small{font-size:.62rem!important;color:#8a9098!important}.club-form-head strong{font-size:1rem!important;color:#171a1f!important}
.club-contact .club-form label{gap:6px!important;margin-bottom:10px!important;font-size:.72rem!important;color:#42474e!important}
.club-contact .club-form input,.club-contact .club-form textarea{
  min-height:44px!important;border:1px solid #dadee3!important;border-radius:7px!important;
  background:#f7f8f9!important;color:#171a1f!important;
}
.club-contact .club-form textarea{min-height:86px!important}
.club-contact .club-form input:focus,.club-contact .club-form textarea:focus{background:#fff!important;border-color:#e30613!important;box-shadow:0 0 0 3px rgba(227,6,19,.08)!important}
.club-contact .club-form .btn{
  min-height:48px!important;margin-top:2px!important;border-radius:7px!important;
  background:linear-gradient(135deg,#171a1f,#30343a)!important;color:#fff!important;box-shadow:none!important;
}
.club-contact .club-form .btn:hover{background:#e30613!important}
.club-form-note{margin-top:10px!important;font-size:.62rem!important;color:#7a8088!important}
@media (max-width:960px){
  .club-contact{grid-template-columns:1fr!important;grid-template-rows:330px auto auto!important;min-height:0!important}.club-visual>img{grid-column:1!important;grid-row:1!important;height:330px!important;min-height:0!important;object-position:39% center!important}.club-contact .club-copy{grid-column:1!important;grid-row:2!important;border-right:0!important;border-top:5px solid #e30613!important;padding:28px 30px 20px!important}.club-contact .club-form{grid-column:1!important;grid-row:3!important;border-right:0!important;padding:20px 30px 30px!important}
}
@media (max-width:680px){
  .club-contact{grid-template-rows:245px auto auto!important;margin-top:40px!important;border-radius:15px!important}.club-visual>img{height:245px!important;object-position:36% center!important}.club-contact .club-copy{padding:23px 19px 18px!important}.club-contact .club-copy h2{font-size:1.42rem!important}.club-contact .club-copy p{-webkit-line-clamp:4!important;font-size:.78rem!important}.club-contact .club-stats{display:grid!important;grid-template-columns:1fr!important}.club-contact .club-form{padding:18px 19px 25px!important}
}

/* Stable mobile navigation - production */
body.menu-open{overflow:hidden!important;touch-action:none}
.mobile-scrim{z-index:998!important;background:rgba(8,9,11,.62)!important;backdrop-filter:blur(3px)}
.mobile-drawer{
  z-index:999!important;top:0!important;right:0!important;left:auto!important;
  width:min(390px,100%)!important;max-width:100%!important;
  height:100vh!important;height:100dvh!important;
  padding:18px!important;padding-bottom:max(22px,env(safe-area-inset-bottom))!important;
  display:flex!important;flex-direction:column!important;gap:13px!important;
  overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain!important;
  background:#fff!important;transform:translate3d(105%,0,0)!important;
  visibility:hidden!important;pointer-events:none!important;
  transition:transform .28s var(--ease),visibility 0s linear .28s!important;
}
.mobile-drawer.open{transform:translate3d(0,0,0)!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s!important}
.drawer-head{position:sticky;top:-18px;z-index:3;margin:-18px -18px 0;padding:18px;background:#fff;border-bottom:1px solid var(--line)}
.drawer-head strong{font-size:1rem;color:#15181d}.drawer-head button{flex:0 0 auto}
.drawer-search{flex:0 0 auto}.drawer-links,.drawer-cats{flex:0 0 auto}
.drawer-links a,.drawer-cats a{border-radius:9px!important}.drawer-cats>span{padding:9px 2px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#777d85!important;font-size:.72rem!important}
@media (max-width:960px){
  .topbar{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important}.main-nav,.topbar .search-box,.nav-actions .login-link{display:none!important}.menu-toggle{display:block!important;flex:0 0 auto}.nav-actions{gap:8px!important}.brand{min-width:0!important}.brand strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand small{display:none!important}
}
@media (max-width:420px){.mobile-drawer{width:100%!important}.topbar{padding:9px 10px!important}.brand-mark{width:42px!important;height:42px!important}.nav-actions .icon{width:38px!important;height:38px!important}}

/* Homepage mobile experience - hero, categories and newest products */
@media (max-width:680px){
  .skate-cinema-hero{
    min-height:560px!important;height:auto!important;
    align-items:flex-end!important;margin-top:12px!important;padding:22px 18px!important;
    background:
      linear-gradient(180deg,rgba(5,6,8,.02) 0%,rgba(5,6,8,.12) 32%,rgba(5,6,8,.92) 57%,#050608 100%),
      url("generated/skate365-hero-banner.png") 30% top/auto 55% no-repeat!important;
  }
  .skate-cinema-hero .hero-copy{width:100%!important;padding-top:235px!important}
  .skate-cinema-hero .kicker{margin-bottom:10px!important;padding:6px 10px!important;font-size:.66rem!important}
  .skate-cinema-hero h1{font-size:1.78rem!important;line-height:1.42!important;text-wrap:pretty!important}
  .skate-cinema-hero .hero-copy>p:not(.kicker){
    display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;
    margin-top:9px!important;font-size:.78rem!important;line-height:1.8!important;
  }
  .skate-cinema-hero .hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;margin-top:15px!important}
  .skate-cinema-hero .hero-actions .btn{min-height:46px!important;font-size:.76rem!important}
  .skate-cinema-hero .cinema-feature-row{
    width:100%!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
    margin-top:12px!important;border-radius:8px!important;
  }
  .skate-cinema-hero .cinema-feature-row span{
    min-width:0!important;min-height:44px!important;justify-content:center!important;padding:5px!important;
    font-size:.6rem!important;white-space:normal!important;text-align:center!important;line-height:1.45!important;
  }
  .skate-cinema-hero .cinema-feature-row span:before{display:none!important}
  .skate-cinema-hero .cinema-feature-row span+span{border-top:0!important;border-right:1px solid rgba(255,255,255,.1)!important}

  .category-section,.products{margin-top:34px!important}
  .category-section .section-title,.products .section-title{align-items:center!important;gap:10px!important;margin-bottom:14px!important}
  .category-section .section-title h2,.products .section-title h2{font-size:1.18rem!important;line-height:1.55!important}
  .category-section .section-title a,.products .section-title a{flex:0 0 auto;font-size:.68rem!important;white-space:nowrap}
  .main-category-grid{
    width:calc(100% + 18px)!important;display:grid!important;grid-auto-flow:column!important;
    grid-template-columns:none!important;grid-auto-columns:min(78vw,292px)!important;
    gap:11px!important;margin-left:-9px!important;padding:2px 0 18px 9px!important;
    overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;overscroll-behavior-inline:contain!important;
    scrollbar-width:none!important;
  }
  .main-category-grid::-webkit-scrollbar,.products .product-grid::-webkit-scrollbar{display:none}
  .main-category-card{
    min-height:286px!important;grid-template-rows:178px auto!important;border-radius:14px!important;
    scroll-snap-align:start!important;box-shadow:0 16px 38px rgba(8,9,11,.16)!important;
  }
  .main-category-card:after{inset:8px!important;border-radius:10px!important}
  .main-category-media{min-height:178px!important}
  .main-category-media img{width:53%!important;height:63%!important;border-radius:11px!important}
  .main-category-media img:nth-child(1){top:15px!important;right:14px!important}.main-category-media img:nth-child(2){top:42px!important;left:13px!important}.main-category-media img:nth-child(3){right:55px!important;bottom:0!important}
  .main-category-copy{gap:4px!important;padding:5px 18px 18px!important}.main-category-copy span{font-size:1.08rem!important}.main-category-copy b{font-size:.72rem!important}.main-category-copy small{margin-top:4px!important;padding:6px 9px!important;border-radius:7px!important;font-size:.65rem!important}

  .products .product-grid{
    width:calc(100% + 18px)!important;display:grid!important;grid-auto-flow:column!important;
    grid-template-columns:none!important;grid-auto-columns:min(76vw,284px)!important;
    gap:11px!important;margin-left:-9px!important;padding:2px 0 18px 9px!important;
    overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;overscroll-behavior-inline:contain!important;
    background:transparent!important;border:0!important;box-shadow:none!important;scrollbar-width:none!important;
  }
  .products .product-card{scroll-snap-align:start!important;padding:10px!important;border-radius:14px!important;box-shadow:0 14px 34px rgba(20,24,30,.1)!important}
  .products .product-media{height:auto!important;aspect-ratio:1.08/1!important;border-radius:11px!important}.products .product-media img{border-radius:11px!important}
  .products .product-card small{margin-top:10px!important}.products .product-card h3{min-height:0!important;font-size:.92rem!important}.products .product-card b{font-size:.96rem!important;margin-bottom:9px!important}
  .products .product-actions{gap:7px!important}.products .product-actions .btn,.products .product-actions .add-cart{min-height:40px!important;border-radius:8px!important;font-size:.72rem!important}
}

/* Signature cinematic hero - 20260712 v11 */
.skate-cinema-hero{
  min-height:570px!important;
  padding:58px 58px!important;
  border-radius:24px!important;
  background:
    linear-gradient(90deg,rgba(3,4,5,.02) 0%,rgba(3,4,5,.13) 39%,rgba(3,4,5,.76) 65%,rgba(3,4,5,.98) 100%),
    url("generated/skate365-hero-banner.png") center/cover no-repeat!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 34px 90px rgba(8,9,12,.3),0 0 0 7px rgba(227,6,19,.035)!important;
}
.skate-cinema-hero:before{
  display:block!important;content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;
  background:
    linear-gradient(113deg,transparent 0 57%,rgba(227,6,19,.34) 57.15% 57.7%,transparent 57.85%),
    radial-gradient(circle at 73% 50%,rgba(227,6,19,.16),transparent 32%),
    repeating-linear-gradient(90deg,transparent 0 78px,rgba(255,255,255,.028) 79px 80px)!important;
  pointer-events:none!important;
}
.skate-cinema-hero:after{
  display:block!important;content:""!important;position:absolute!important;inset:12px!important;z-index:4!important;
  border:1px solid rgba(255,255,255,.12)!important;border-radius:16px!important;pointer-events:none!important;
  box-shadow:inset 4px 0 0 rgba(227,6,19,.85)!important;
}
.skate-cinema-hero .hero-copy{
  width:min(56%,620px)!important;max-width:620px!important;
  padding:6px 24px 6px 0!important;
  border-right:3px solid #e30613!important;
}
.skate-cinema-hero .hero-copy:before{
  content:"PERFORMANCE / SAFETY / STYLE";display:block;margin-bottom:13px;
  color:rgba(255,255,255,.48);font-size:.6rem;font-weight:900;letter-spacing:2px;direction:ltr;text-align:right;
}
.skate-cinema-hero .kicker{
  position:relative!important;margin-bottom:13px!important;padding:6px 11px!important;
  background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:none!important;backdrop-filter:blur(10px)!important;
}
.skate-cinema-hero .kicker:before{width:6px!important;height:6px!important;background:#e30613!important;box-shadow:0 0 12px #e30613!important}
.skate-cinema-hero h1{
  font-size:clamp(2.4rem,3.75vw,4rem)!important;line-height:1.3!important;
  text-shadow:0 14px 34px rgba(0,0,0,.48)!important;
}
.skate-cinema-hero .hero-copy>p:not(.kicker){max-width:555px!important;color:rgba(255,255,255,.72)!important;font-size:.9rem!important}
.skate-cinema-hero .hero-actions .primary{gap:10px!important;background:#e30613!important;box-shadow:0 15px 32px rgba(227,6,19,.3)!important}
.skate-cinema-hero .hero-actions .primary:after{content:"←";display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.16);font-size:.85rem;transition:transform .2s}
.skate-cinema-hero .hero-actions .primary:hover:after{transform:translateX(-3px)}
.skate-cinema-hero .hero-actions .ghost{background:rgba(8,9,11,.46)!important;border-color:rgba(255,255,255,.22)!important}
.skate-cinema-hero .cinema-feature-row{
  border:0!important;border-top:1px solid rgba(255,255,255,.15)!important;border-radius:0!important;
  background:transparent!important;backdrop-filter:none!important;
}
.skate-cinema-hero .cinema-feature-row span{min-height:42px!important;padding:0 12px!important;font-size:.68rem!important;color:rgba(255,255,255,.72)!important}
.skate-cinema-hero .cinema-feature-row span:first-child{padding-right:0!important}
.skate-cinema-hero .cinema-feature-row span+span{border-color:rgba(255,255,255,.12)!important}
@media (max-width:960px){
  .skate-cinema-hero{min-height:540px!important;padding:42px 34px!important}.skate-cinema-hero .hero-copy{width:min(72%,620px)!important}
}
@media (max-width:680px){
  .skate-cinema-hero{
    min-height:570px!important;padding:20px 17px!important;border-radius:17px!important;
    background:linear-gradient(180deg,rgba(5,6,8,.01) 0%,rgba(5,6,8,.12) 31%,rgba(5,6,8,.93) 56%,#050608 100%),url("generated/skate365-hero-banner.png") 30% top/auto 55% no-repeat!important;
    box-shadow:0 20px 50px rgba(8,9,12,.22)!important;
  }
  .skate-cinema-hero:before{background:linear-gradient(113deg,transparent 0 63%,rgba(227,6,19,.22) 63.2% 64%,transparent 64.2%)!important}
  .skate-cinema-hero:after{inset:7px!important;border-radius:11px!important;box-shadow:inset 3px 0 0 rgba(227,6,19,.85)!important}
  .skate-cinema-hero .hero-copy{width:100%!important;padding:230px 0 0!important;border-right:0!important}
  .skate-cinema-hero .hero-copy:before{display:none!important}
  .skate-cinema-hero h1{font-size:1.82rem!important;line-height:1.4!important}
  .skate-cinema-hero .hero-actions .primary:after{width:20px;height:20px}
  .skate-cinema-hero .cinema-feature-row{border:1px solid rgba(255,255,255,.12)!important;border-radius:8px!important;background:rgba(8,9,11,.42)!important}
  .skate-cinema-hero .cinema-feature-row span:first-child{padding-right:5px!important}
}

/* Store filters - desktop sidebar and mobile sheet */
.catalog-toolbar-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:8px}
.filter-toggle{display:none!important;background:#171a1f!important;color:#fff!important;border:0!important;gap:8px}
.filter-toggle b{min-width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:#e30613;color:#fff;font-size:.68rem}
.active-filters{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.active-filters span{display:inline-flex;align-items:center;min-height:34px;padding:5px 10px;border:1px solid rgba(227,6,19,.16);border-radius:7px;background:rgba(227,6,19,.06);color:#9d0711;font-size:.7rem;font-weight:800}
.filter-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.filter-panel-head h2{margin:0!important}
.filter-panel-head button{display:none;width:38px;height:38px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#171a1f;font-size:1.3rem;cursor:pointer}
.filter-scrim{display:none}
.filter-panel form>button[type="submit"]{position:relative;overflow:hidden}
.filter-panel input:focus,.filter-panel select:focus{outline:0;border-color:#e30613!important;box-shadow:0 0 0 3px rgba(227,6,19,.08)}
@media (min-width:961px){.filter-panel[aria-hidden="true"]{visibility:visible!important}}
@media (max-width:960px){
  body.filters-open{overflow:hidden!important;touch-action:none}
  .filter-toggle{display:inline-flex!important}
  .filter-scrim{display:block;position:fixed;inset:0;z-index:1000;background:rgba(8,9,11,.6);opacity:0;visibility:hidden;pointer-events:none;backdrop-filter:blur(3px);transition:opacity .24s,visibility 0s linear .24s}
  .filters-open .filter-scrim{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
  .filter-panel{
    position:fixed!important;top:0!important;right:0!important;z-index:1001!important;
    width:min(410px,100%)!important;height:100vh!important;height:100dvh!important;
    padding:20px!important;border:0!important;border-radius:0!important;
    overflow-y:auto!important;overscroll-behavior:contain!important;
    background:#fff!important;box-shadow:-24px 0 70px rgba(0,0,0,.25)!important;
    transform:translate3d(105%,0,0)!important;visibility:hidden!important;pointer-events:none!important;
    transition:transform .28s var(--ease),visibility 0s linear .28s!important;
  }
  .filter-panel.open{transform:translate3d(0,0,0)!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s!important}
  .filter-panel-head{position:sticky;top:-20px;z-index:3;margin:-20px -20px 8px;padding:18px 20px;background:#fff;border-bottom:1px solid var(--line)}
  .filter-panel-head button{display:grid;place-items:center}
  .filter-panel form{padding-bottom:max(18px,env(safe-area-inset-bottom))}
}
@media (max-width:680px){
  .catalog-toolbar{align-items:center!important;gap:10px!important}.catalog-toolbar>div:first-child span{display:none}.catalog-toolbar-actions{margin-right:auto}.catalog-toolbar-actions .ghost{min-height:40px!important;padding:0 10px!important;font-size:.66rem!important}.filter-toggle{min-height:40px!important;padding:0 12px!important;border-radius:8px!important;font-size:.7rem!important}
  .active-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px;scrollbar-width:none}.active-filters::-webkit-scrollbar{display:none}.active-filters span{flex:0 0 auto}
  .filter-row{grid-template-columns:1fr!important}
}

/* Filter drawer on every viewport */
.catalog{grid-template-columns:1fr!important;padding-top:24px!important}
.filter-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important}
body.filters-open{overflow:hidden!important;touch-action:none}
.filter-scrim{
  display:block!important;position:fixed!important;inset:0!important;z-index:1000!important;
  background:rgba(8,9,11,.62)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  backdrop-filter:blur(4px)!important;transition:opacity .24s,visibility 0s linear .24s!important;
}
.filters-open .filter-scrim{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s!important}
.filter-panel{
  position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;z-index:1001!important;
  width:min(430px,100%)!important;height:100vh!important;height:100dvh!important;
  padding:22px!important;border:0!important;border-radius:0!important;
  overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain!important;
  background:#fff!important;box-shadow:-28px 0 80px rgba(0,0,0,.28)!important;
  opacity:1!important;transform:translate3d(105%,0,0)!important;visibility:hidden!important;pointer-events:none!important;
  transition:transform .3s var(--ease),visibility 0s linear .3s!important;
}
.filter-panel.open{transform:translate3d(0,0,0)!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s!important}
.filter-panel:focus{outline:0!important}
.filter-panel-head{position:sticky!important;top:-22px!important;z-index:4!important;margin:-22px -22px 10px!important;padding:20px 22px!important;background:#fff!important;border-bottom:1px solid var(--line)!important}
.filter-panel-head button{display:grid!important;place-items:center!important}
.filter-panel form{padding-bottom:max(20px,env(safe-area-inset-bottom))!important}
.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media (max-width:1100px){.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:780px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:520px){.catalog-grid{grid-template-columns:1fr!important}.filter-panel{width:100%!important}.catalog-toolbar{flex-wrap:wrap!important}.catalog-toolbar-actions{width:100%!important;justify-content:stretch!important}.catalog-toolbar-actions .filter-toggle{flex:1!important}}

/* Clear and secure logout controls */
.logout-form{display:flex!important;margin:0!important}
.logout-button{
  min-height:40px;padding:0 15px;border:1px solid #b9000b;border-radius:9px;
  background:#e30613!important;color:#fff!important;font-family:"IRANYekanX",Tahoma,sans-serif!important;
  font-size:.76rem;font-weight:900;cursor:pointer;box-shadow:0 8px 18px rgba(227,6,19,.2);
  transition:background .2s,transform .2s,box-shadow .2s;
}
.logout-button:hover{background:#b9000b!important;transform:translateY(-1px);box-shadow:0 11px 23px rgba(185,0,11,.28)}
.logout-button:focus-visible{outline:3px solid rgba(227,6,19,.22);outline-offset:2px}
.drawer-logout{margin:0;padding-top:3px}
.drawer-logout button{
  width:100%;min-height:46px;border:1px solid rgba(227,6,19,.22);border-radius:9px;
  background:rgba(227,6,19,.07);color:#bd000b;font-family:"IRANYekanX",Tahoma,sans-serif;font-weight:900;cursor:pointer;
}
@media (max-width:960px){.nav-actions .logout-form{display:none!important}}

/* Definitive filter drawer state reset */
.filter-panel{
  display:block!important;align-content:normal!important;gap:0!important;top:0!important;
  border-color:transparent!important;border-radius:0!important;
}
.filter-panel form{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;width:100%!important}
body:not(.filters-open) .filter-panel[aria-hidden="true"]{
  visibility:hidden!important;pointer-events:none!important;transform:translate3d(105%,0,0)!important;
}
body.filters-open .filter-panel[aria-hidden="false"]{
  visibility:visible!important;pointer-events:auto!important;transform:translate3d(0,0,0)!important;
}
.filter-panel label{min-width:0!important;margin:0!important}
.filter-panel input,.filter-panel select{max-width:100%!important;box-sizing:border-box!important}

.dashboard-panel.active.reveal{
  opacity:1!important;
  transform:none!important;
}

.product-color-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(96px,1fr));
  gap:10px;
}
.product-color-option{
  min-height:48px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:9px 11px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  cursor:pointer;
  transition:.18s var(--ease);
}
.product-color-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.color-swatch{
  width:22px;
  height:22px;
  flex:0 0 22px;
  border-radius:999px;
  border:1px solid rgba(20,24,30,.16);
  background:var(--swatch,linear-gradient(135deg,#15181d,#e30613));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}
.product-color-option b{
  min-width:0;
  color:var(--ink);
  font-size:.84rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.product-color-option:has(input:checked){
  border-color:rgba(227,6,19,.55);
  box-shadow:0 0 0 3px rgba(227,6,19,.08);
}
.filter-panel .filter-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
@media (max-width:520px){.filter-panel .filter-row{grid-template-columns:1fr!important}}

/* Hard overflow guard for the filter drawer */
.filter-panel{
  right:0!important;left:auto!important;
  width:min(400px,100vw)!important;max-width:100vw!important;min-width:0!important;
  padding:0!important;overflow-x:hidden!important;overflow-y:auto!important;
  contain:layout paint!important;
}
.filter-panel-head{
  top:0!important;width:100%!important;max-width:100%!important;
  margin:0!important;padding:18px 20px!important;box-sizing:border-box!important;
}
.filter-panel-head h2{min-width:0!important;max-width:calc(100% - 50px)!important;font-size:1.05rem!important}
.filter-panel>form{
  width:100%!important;max-width:100%!important;min-width:0!important;
  padding:18px 20px max(24px,env(safe-area-inset-bottom))!important;margin:0!important;
  box-sizing:border-box!important;overflow:hidden!important;
}
.filter-panel>form>*,.filter-panel label,.filter-panel .filter-row,.filter-panel .filter-row label{
  width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;
}
.filter-panel .filter-row{grid-template-columns:1fr!important}
.filter-panel input,.filter-panel select,.filter-panel button{
  width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;
}
.filter-panel select{display:block!important;white-space:nowrap!important;text-overflow:ellipsis!important;overflow:hidden!important}
.filter-panel-head button{width:38px!important;min-width:38px!important;max-width:38px!important}
@media (max-width:420px){.filter-panel{width:100vw!important}.filter-panel-head{padding:16px!important}.filter-panel>form{padding:16px 16px max(22px,env(safe-area-inset-bottom))!important}}

/* Filter portal must sit above every header stacking context */
body>.filter-scrim{z-index:11998!important}
body>.filter-panel{z-index:11999!important;isolation:isolate!important}
body>.filter-panel .filter-panel-head{padding-top:max(18px,env(safe-area-inset-top))!important}

/* Android/mobile guard for the red-black top strip */
@media (max-width:680px){
  .top-strip{
    height:34px!important;
    min-height:34px!important;
    overflow:hidden!important;
  }
  .strip-inner{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:34px!important;
    padding:0 12px!important;
    box-sizing:border-box!important;
    justify-content:center!important;
    gap:0!important;
    overflow:hidden!important;
    white-space:nowrap!important;
  }
  .strip-inner span{
    display:none!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    line-height:34px!important;
    font-size:.72rem!important;
  }
  .strip-inner span:first-child{
    display:block!important;
  }
}

/* Mobile product detail hardening */
@media (max-width:760px){
  .product-detail-modern,
  .product-content-modern{
    width:min(100% - 18px,1160px)!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
    padding-top:14px!important;
    overflow:hidden!important;
  }
  .product-detail-modern > *,
  .product-content-modern > *,
  .detail-gallery,
  .detail-info,
  .product-purchase,
  .purchase-options,
  .purchase-row,
  .detail-actions{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  .product-detail-modern .detail-gallery{
    order:1;
    padding:8px!important;
    border-radius:16px!important;
  }
  .product-detail-modern .detail-info{
    order:2;
    position:static!important;
    padding:16px!important;
    border-radius:16px!important;
  }
  .product-slider-main{
    width:100%!important;
    aspect-ratio:1 / 1!important;
    max-height:78vh!important;
    border-radius:14px!important;
  }
  .product-slide{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
  }
  .product-slider-thumbs{
    width:100%!important;
    max-width:100%!important;
    gap:7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .product-slider-thumbs::-webkit-scrollbar{
    display:none;
  }
  .product-slider-thumbs button{
    flex:0 0 62px!important;
    width:62px!important;
    height:62px!important;
    border-radius:10px!important;
  }
  .product-detail-modern .detail-info h1{
    font-size:1.35rem!important;
    line-height:1.55!important;
    overflow-wrap:anywhere!important;
  }
  .detail-meta,
  .size-options{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .size-option{
    flex:1 1 calc(25% - 8px)!important;
    min-width:58px!important;
  }
  .size-option span{
    width:100%!important;
    min-width:0!important;
    padding-inline:8px!important;
    box-sizing:border-box!important;
  }
  .product-color-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .product-color-option{
    min-width:0!important;
    width:100%!important;
    border-radius:10px!important;
  }
  .purchase-row,
  .detail-actions,
  .product-detail-modern .spec-list{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .qty-box,
  .qty-box input,
  .detail-actions .add-cart,
  .detail-actions .btn{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  .detail-actions .add-cart,
  .detail-actions .btn{
    min-height:48px!important;
    white-space:normal!important;
    text-align:center!important;
  }
  .product-description-panel,
  .product-spec-panel{
    padding:16px!important;
    border-radius:16px!important;
  }
  .product-description-panel h2{
    font-size:1.08rem!important;
    line-height:1.7!important;
  }
  .product-description-panel p,
  .product-spec-panel .spec-list li{
    overflow-wrap:anywhere!important;
  }
}

@media (max-width:380px){
  .product-color-grid{
    grid-template-columns:1fr!important;
  }
  .size-option{
    flex-basis:calc(33.333% - 8px)!important;
  }
}
