/*
Theme Name: MODMOTORS Store
Theme URI: https://example.com/
Author: MODMOTORS
Description: Premium WooCommerce-ready automotive accessories storefront for MODMOTORS.
Version: 1.0.0
Text Domain: modmotors
*/
:root{
 --mm-black:#050505;--mm-panel:#0d0d0f;--mm-panel2:#151518;--mm-red:#f20d18;
 --mm-white:#f7f7f7;--mm-muted:#a9a9af;--mm-line:#29292e;--mm-max:1240px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--mm-black);color:var(--mm-white);
font-family:Inter,Arial,sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}
.mm-wrap{width:min(var(--mm-max),calc(100% - 36px));margin:auto}.mm-top{background:var(--mm-red);color:white;
text-align:center;padding:7px 15px;font-weight:800;font-size:12px;letter-spacing:.08em}
.mm-header{position:sticky;top:0;z-index:99;background:rgba(5,5,5,.91);backdrop-filter:blur(18px);border-bottom:1px solid #202024}
.mm-nav{height:82px;display:flex;align-items:center;gap:30px}.mm-brand{display:flex;align-items:center;gap:12px;font-size:25px;font-weight:1000;font-style:italic}
.mm-brand img{width:62px;height:52px;object-fit:cover;object-position:50% 64%;border-radius:8px}.mm-brand b{color:var(--mm-red)}
.mm-menu{display:flex;gap:26px;margin-left:auto;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}
.mm-menu a:hover{color:var(--mm-red)}.mm-actions{display:flex;gap:10px}.mm-icon{border:1px solid var(--mm-line);border-radius:999px;padding:9px 13px}
.mm-hero{min-height:670px;display:grid;align-items:center;position:relative;overflow:hidden;background:
radial-gradient(circle at 75% 48%,rgba(242,13,24,.22),transparent 28%),linear-gradient(115deg,#050505 45%,#111 100%)}
.mm-hero:after{content:"";position:absolute;width:600px;height:600px;border:1px solid rgba(242,13,24,.23);border-radius:50%;right:-110px;top:40px;box-shadow:0 0 80px rgba(242,13,24,.13)}
.mm-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:45px;align-items:center;position:relative;z-index:2}
.mm-kicker{color:var(--mm-red);font-weight:900;letter-spacing:.2em;text-transform:uppercase;font-size:12px}.mm-hero h1{font-size:clamp(52px,7vw,94px);line-height:.92;margin:15px 0 20px;letter-spacing:-.055em}
.mm-hero h1 em{font-style:normal;color:var(--mm-red)}.mm-hero p{max-width:600px;color:#c5c5ca;font-size:18px}
.mm-btns{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}.mm-btn{display:inline-block;padding:14px 22px;border-radius:7px;font-weight:900;text-transform:uppercase;font-size:12px;letter-spacing:.07em;border:1px solid var(--mm-red);transition:.2s}
.mm-btn.primary{background:var(--mm-red)}.mm-btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(242,13,24,.2)}
.mm-hero-art{position:relative}.mm-hero-art img{filter:drop-shadow(0 25px 45px rgba(0,0,0,.55));border-radius:28px}
.mm-fit{margin-top:-45px;position:relative;z-index:4}.mm-fitbox{background:#101012;border:1px solid #2c2c30;border-radius:14px;padding:24px;box-shadow:0 18px 55px rgba(0,0,0,.35)}
.mm-fit-title{font-weight:900;margin-bottom:15px}.mm-fit-grid{display:grid;grid-template-columns:repeat(4,1fr) 150px;gap:10px}
.mm-fit select,.mm-fit input{width:100%;background:#080809;border:1px solid #303035;color:white;border-radius:7px;padding:14px}
.mm-section{padding:90px 0}.mm-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:32px}.mm-head h2{font-size:clamp(32px,4vw,52px);margin:0;letter-spacing:-.04em}
.mm-head p{color:var(--mm-muted);max-width:500px}.mm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.mm-card{background:var(--mm-panel);border:1px solid var(--mm-line);border-radius:12px;overflow:hidden;transition:.25s}.mm-card:hover{transform:translateY(-5px);border-color:#5b171c}
.mm-card-img{aspect-ratio:1.1;background:linear-gradient(145deg,#18181b,#09090a);display:flex;align-items:center;justify-content:center;font-size:56px;position:relative}
.mm-badge{position:absolute;left:12px;top:12px;background:var(--mm-red);padding:5px 8px;border-radius:4px;font-size:10px;font-weight:900}
.mm-card-body{padding:18px}.mm-card h3{margin:0 0 6px;font-size:16px}.mm-price{font-weight:900;font-size:18px}.mm-old{color:#777;text-decoration:line-through;font-size:13px;margin-left:6px}
.mm-cat{min-height:210px;padding:24px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(180deg,#17171a,#0a0a0b);border:1px solid var(--mm-line);border-radius:12px;position:relative;overflow:hidden}
.mm-cat:before{content:"";position:absolute;width:120px;height:120px;background:var(--mm-red);filter:blur(80px);opacity:.18;right:-20px;top:-20px}.mm-cat span{color:var(--mm-red);font-size:11px;font-weight:900}.mm-cat h3{font-size:23px;margin:4px 0}
.mm-banner{background:linear-gradient(110deg,#171719,#070708);border:1px solid #3a171a;border-radius:18px;padding:60px;position:relative;overflow:hidden}.mm-banner h2{font-size:50px;max-width:700px;margin:0 0 12px}.mm-banner h2 b{color:var(--mm-red)}
.mm-points{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--mm-line);border:1px solid var(--mm-line);border-radius:12px;overflow:hidden}.mm-point{background:#0c0c0e;padding:28px}.mm-point strong{display:block;margin-bottom:7px}.mm-point small{color:var(--mm-muted)}
footer{border-top:1px solid var(--mm-line);padding:55px 0 25px;background:#080809}.mm-footer{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}.mm-footer p,.mm-footer a{color:#999}.mm-footer a{display:block;margin:8px 0}.mm-copy{border-top:1px solid #202024;margin-top:35px;padding-top:22px;color:#666;font-size:12px}
.woocommerce ul.products li.product,.woocommerce div.product{color:var(--mm-white)}.woocommerce ul.products li.product .price,.woocommerce div.product p.price{color:var(--mm-red)!important}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{background:var(--mm-red)!important;color:white!important;border-radius:6px!important}
@media(max-width:900px){.mm-menu{display:none}.mm-hero-grid{grid-template-columns:1fr}.mm-hero{padding:80px 0 100px}.mm-hero-art{display:none}.mm-fit-grid{grid-template-columns:1fr 1fr}.mm-grid{grid-template-columns:1fr 1fr}.mm-points{grid-template-columns:1fr 1fr}.mm-footer{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.mm-grid,.mm-fit-grid,.mm-points,.mm-footer{grid-template-columns:1fr}.mm-actions .mm-icon:first-child{display:none}.mm-banner{padding:32px}.mm-banner h2{font-size:36px}.mm-nav{height:70px}.mm-brand{font-size:20px}}
