
/* === AE Performance Supply — Global Stylesheet === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#0d0d0d;--paper:#f5f1ea;--steel:#c8c4bc;
  --dim:rgba(200,196,188,.45);--accent:#e05c2a;--gold:#c8a232;
  --radius:3px;
  --mono:'DM Mono',monospace;--sans:'DM Sans',sans-serif;--display:'Bebas Neue',sans-serif;
  --nav-h:58px;
}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--paper);font-family:var(--sans);font-weight:300;min-height:100vh;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
button{cursor:pointer;font-family:inherit}

/* ── NAV ── */
nav#site-nav{position:sticky;top:0;z-index:200;display:flex;align-items:center;gap:1rem;padding:0 clamp(1rem,3vw,2.5rem);height:var(--nav-h);background:rgba(13,13,13,.95);backdrop-filter:blur(16px);border-bottom:1px solid rgba(200,196,188,.1)}
.nav-logo{font-family:var(--display);font-size:1.5rem;letter-spacing:.12em;color:var(--paper);white-space:nowrap;flex-shrink:0}
.nav-logo span{color:var(--accent)}

/* Search */
.nav-search{flex:1;max-width:420px;position:relative;margin:0 1rem}
.nav-search input{width:100%;background:rgba(200,196,188,.07);border:1px solid rgba(200,196,188,.15);border-radius:var(--radius);padding:.45rem .9rem .45rem 2.2rem;font-family:var(--sans);font-size:.82rem;color:var(--paper);outline:none;transition:border-color .2s}
.nav-search input:focus{border-color:var(--accent)}
.nav-search .search-icon{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);width:14px;height:14px;opacity:.5;pointer-events:none}
.autocomplete-list{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#1a1a18;border:1px solid rgba(200,196,188,.15);border-radius:var(--radius);list-style:none;overflow:hidden;display:none;z-index:300}
.autocomplete-list.open{display:block}
.autocomplete-list li a{display:block;padding:.6rem .9rem;font-size:.82rem;color:var(--steel);transition:background .15s}
.autocomplete-list li a:hover,.autocomplete-list li a.active{background:rgba(224,92,42,.15);color:var(--paper)}

/* Nav links */
.nav-links{display:flex;gap:1.5rem;list-style:none;margin-left:auto;flex-shrink:0}
.nav-links a{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);transition:color .2s}
.nav-links a:hover{color:var(--paper)}
/* ── MEGA DROPDOWN ── */
.nav-dropdown{position:static}
.nav-dropdown-trigger{background:none;border:none;font-family:var(--sans);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);cursor:pointer;padding:0;transition:color .2s;display:flex;align-items:center;gap:.35rem}
.nav-dropdown-trigger:hover,.nav-dropdown.open .nav-dropdown-trigger{color:var(--paper)}
.mega-menu{position:fixed;top:var(--nav-h);left:0;right:0;background:#141412;border-bottom:1px solid rgba(200,196,188,.12);box-shadow:0 16px 48px rgba(0,0,0,.6);opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity .22s ease,transform .22s ease;z-index:399;max-height:calc(100vh - var(--nav-h));overflow-y:auto}
.nav-dropdown.open .mega-menu{opacity:1;pointer-events:all;transform:translateY(0)}
.mega-inner{max-width:1280px;margin:0 auto;padding:2rem clamp(1rem,4vw,3rem);display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem 2rem}
.mega-col ul{list-style:none;margin-top:.6rem;display:flex;flex-direction:column;gap:.1rem}
.mega-cat-heading{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);display:block;padding:.15rem 0;border-bottom:1px solid rgba(224,92,42,.2);margin-bottom:.4rem;transition:color .15s}
.mega-cat-heading:hover{color:var(--paper)}
.mega-col ul li a{font-size:.82rem;color:var(--steel);padding:.3rem .4rem;display:block;border-radius:2px;transition:background .13s,color .13s;white-space:nowrap}
.mega-col ul li a:hover{color:var(--paper);background:rgba(200,196,188,.06)}
/* ── MOBILE MENU ── */
.mobile-menu-btn{display:none}
.mobile-menu-btn button{background:none;border:none;color:var(--steel);font-size:1.3rem;padding:0 .25rem;cursor:pointer;line-height:1}
#site-nav{position:relative}
#mobile-menu{position:absolute;top:100%;left:0;right:0;background:#141412;border-bottom:1px solid rgba(200,196,188,.1);z-index:400;max-height:0;overflow-y:auto;overflow-x:hidden;transition:max-height .35s ease}
#mobile-menu.open{max-height:75vh}
#mobile-menu ul{list-style:none;padding:.5rem 0 1.5rem}
#mobile-menu li a{display:block;padding:.5rem 1.5rem;font-size:.83rem;color:var(--steel);transition:color .15s}
#mobile-menu li a:hover{color:var(--paper)}
.mob-section-label{font-family:var(--mono);font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);padding:.75rem 1.5rem .3rem;display:block}
.mob-cat-heading a{font-size:.78rem!important;color:var(--paper)!important;font-weight:500;padding:.5rem 1.5rem!important}
.mob-prod a{padding:.35rem 1.5rem .35rem 2.5rem!important;font-size:.78rem!important}
.mob-divider{height:1px;background:rgba(200,196,188,.08);margin:.5rem 1.5rem}
@media(max-width:768px){.mobile-menu-btn{display:list-item}.hide-mobile{display:none!important}}
.cart-link{position:relative}
.cart-badge{position:absolute;top:-6px;right:-8px;background:var(--accent);color:#fff;font-size:.6rem;font-family:var(--mono);min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 3px}

/* ── ANNOUNCEMENT BAND ── */
.band{background:var(--accent);padding:.4rem clamp(1rem,3vw,2.5rem);display:flex;align-items:center;gap:1rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.07em;flex-wrap:wrap}
.band strong{color:#fff}.band span{color:rgba(255,255,255,.75)}
.dot{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.5);flex-shrink:0}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.8rem;font-family:var(--sans);font-size:.82rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;border:none;border-radius:var(--radius);cursor:pointer;transition:all .2s}
.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:#c94e22}
.btn-outline{background:transparent;color:var(--paper);border:1px solid rgba(200,196,188,.35)}.btn-outline:hover{border-color:var(--paper)}
.btn-ghost{background:transparent;color:var(--steel);border:1px solid transparent}.btn-ghost:hover{color:var(--paper)}

/* ── SECTION WRAP ── */
.section-wrap{max-width:1280px;margin:0 auto;padding:4rem clamp(1rem,4vw,3rem)}
.section-heading{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:.1em;margin-bottom:.5rem}
.section-sub{color:var(--steel);font-size:.85rem;margin-bottom:2rem}

/* ── PRODUCT CARD ── */
.product-card{background:#161614;border:1px solid rgba(200,196,188,.08);border-radius:4px;overflow:hidden;transition:border-color .2s,transform .2s;display:flex;flex-direction:column}
.product-card:hover{border-color:rgba(200,196,188,.25);transform:translateY(-2px)}
.product-card .card-img{aspect-ratio:1;background:#1e1e1c;display:flex;align-items:center;justify-content:center;overflow:hidden}
.product-card .card-img svg{width:65%;height:65%;opacity:.85}
.product-card .card-body{padding:1rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.card-cat{font-family:var(--mono);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.card-title{font-size:.9rem;font-weight:500;line-height:1.35}
.card-price{font-family:var(--mono);font-size:.95rem;color:var(--gold);margin-top:auto;padding-top:.5rem}
.card-btn{margin-top:.75rem;width:100%}

/* ── GRID ── */
.product-grid-2{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem}

/* ── TOAST ── */
.toast{position:fixed;bottom:2rem;right:2rem;background:#1e1e1c;border:1px solid rgba(200,196,188,.2);border-radius:4px;padding:.75rem 1.25rem;display:flex;align-items:center;gap:.75rem;font-size:.82rem;transform:translateY(120%);opacity:0;transition:transform .3s,opacity .3s;z-index:999}
.toast.show{transform:translateY(0);opacity:1}
.toast-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}

/* ── FORM ── */
.form-group{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.25rem}
.form-group label{font-size:.78rem;letter-spacing:.07em;text-transform:uppercase;color:var(--steel)}
.form-group input,.form-group select,.form-group textarea{background:rgba(200,196,188,.06);border:1px solid rgba(200,196,188,.18);border-radius:var(--radius);padding:.65rem .9rem;font-family:var(--sans);font-size:.88rem;color:var(--paper);outline:none;transition:border-color .2s;width:100%}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent)}
.form-group textarea{min-height:120px;resize:vertical}

/* ── TABLE ── */
.spec-table{width:100%;border-collapse:collapse;font-size:.84rem;margin:1.5rem 0}
.spec-table th,.spec-table td{padding:.6rem .9rem;border-bottom:1px solid rgba(200,196,188,.08);text-align:left}
.spec-table th{color:var(--steel);font-weight:400;width:42%;white-space:nowrap}
.spec-table td{font-family:var(--mono);font-size:.8rem}

/* ── FAQ ── */
.faq-item{border-bottom:1px solid rgba(200,196,188,.08)}
.faq-q{list-style:none;padding:1rem 0;cursor:pointer;font-size:.92rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq-q::marker,.faq-q::-webkit-details-marker{display:none}
.faq-a{padding-bottom:1rem;line-height:1.7;color:var(--steel);font-size:.88rem}
details[open] .faq-q{color:var(--accent)}

/* ── FOOTER ── */
footer{border-top:1px solid rgba(200,196,188,.08);padding:3rem clamp(1rem,4vw,3rem);text-align:center;color:var(--steel);font-size:.8rem;line-height:2;display:flex;flex-direction:column;align-items:center;gap:.5rem}
.footer-logo{font-family:var(--display);font-size:1.3rem;letter-spacing:.12em;color:var(--paper);margin-bottom:.5rem}
.footer-logo span{color:var(--accent)}
.footer-links{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center;margin-bottom:.5rem}
.footer-links a{color:var(--steel);font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;transition:color .2s}
.footer-links a:hover{color:var(--paper)}

/* ── BREADCRUMB ── */
.breadcrumb{display:flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;color:var(--steel);padding:1rem clamp(1rem,4vw,3rem);max-width:1280px;margin:0 auto}
.breadcrumb a{color:var(--steel);transition:color .2s}.breadcrumb a:hover{color:var(--paper)}
.breadcrumb span{color:var(--dim)}

/* ── CART DRAWER ── */
#cart-drawer{position:fixed;top:0;right:-420px;width:100%;max-width:420px;height:100vh;background:#141412;border-left:1px solid rgba(200,196,188,.1);z-index:500;transition:right .3s;display:flex;flex-direction:column;overflow:hidden}
#cart-drawer.open{right:0}
.cart-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid rgba(200,196,188,.08)}
.cart-header h2{font-family:var(--display);font-size:1.3rem;letter-spacing:.1em}
.cart-items{flex:1;overflow-y:auto;padding:1rem 1.5rem}
.cart-item{display:flex;gap:1rem;padding:.9rem 0;border-bottom:1px solid rgba(200,196,188,.06)}
.cart-item-info{flex:1;min-width:0}
.cart-item-name{font-size:.85rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-item-sku{font-family:var(--mono);font-size:.7rem;color:var(--steel)}
.cart-item-price{font-family:var(--mono);font-size:.9rem;color:var(--gold);flex-shrink:0}
.cart-item-remove{background:none;border:none;color:var(--dim);font-size:1rem;padding:0 .25rem;transition:color .15s}.cart-item-remove:hover{color:var(--accent)}
.cart-footer{padding:1.25rem 1.5rem;border-top:1px solid rgba(200,196,188,.08)}
.cart-total{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;font-size:.92rem}
.cart-total strong{font-family:var(--mono);font-size:1.1rem;color:var(--gold)}
#cart-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:499;opacity:0;pointer-events:none;transition:opacity .3s}
#cart-overlay.open{opacity:1;pointer-events:all}

/* ── INVENTORY BADGE ── */
.inv-badge{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;padding:.25rem .65rem;border-radius:2px;display:inline-flex;align-items:center;gap:.4rem}
.inv-badge.in-stock{background:rgba(80,200,120,.1);color:#50c878;border:1px solid rgba(80,200,120,.25)}
.inv-badge.low-stock{background:rgba(200,162,50,.1);color:var(--gold);border:1px solid rgba(200,162,50,.25)}
.inv-badge.out-of-stock{background:rgba(200,60,60,.1);color:#e05c5c;border:1px solid rgba(200,60,60,.25)}

@media(max-width:768px){
  .nav-search{max-width:none;flex:1}
  .nav-links .hide-mobile{display:none}
}
