
/* ================================================================
   ADVANCESTORE.CO.UK — NEONCART ELECTRONIC OVERRIDE
   Primary: #0063d1 | Dark: #003d82 | WA: #25d366
   Font: Rubik (Google Fonts)
================================================================ */

/* --- GOOGLE FONT --- */
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700;800&display=swap');

/* --- CSS VARS --- */
:root {
  --primary: #0063d1;
  --primary-dark: #003d82;
  --primary-light: #e8f0fc;
  --heading: #282828;
  --text: #878787;
  --subtext: #555;
  --bg: #f8f8f8;
  --white: #ffffff;
  --border: #e8e8e8;
  --wa: #25d366;
  --wa-dark: #1da851;
  --price: #0063d1;
  --line: #ececec;
}

/* --- BASE RESET --- */
*, *::before, *::after { box-sizing: border-box; }
body { font-family: 'Rubik', sans-serif; color: var(--text); background: var(--bg); }
a { text-decoration: none; }
img { max-width: 100%; display: block; }

/* --- SKIP NAV --- */
.skip-nav { position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden }
.skip-nav:focus { left:8px;top:8px;width:auto;height:auto;padding:8px 16px;background:var(--primary);color:#fff;border-radius:4px;z-index:9999 }

/* ================================================================
   HEADER OVERRIDES
================================================================ */
.as_header_wrap { font-family: 'Rubik', sans-serif; }

/* Top bar */
.as_topbar {
  background: var(--primary-dark);
  padding: 7px 0;
  font-size: 12px;
  color: rgba(255,255,255,.75);
}
.as_topbar .container { display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap }
.as_topbar_notice { display:flex;align-items:center;gap:6px }
.as_topbar_notice i { color: var(--wa); }
.as_topbar_links { display:flex;gap:16px }
.as_topbar_links a { color:rgba(255,255,255,.6);font-size:12px;transition:color .2s }
.as_topbar_links a:hover { color:#fff }

/* Main header row */
.as_header_main {
  background: var(--white);
  border-bottom: 1px solid var(--border);
  padding: 12px 0;
  position: sticky;
  top: 0;
  z-index: 800;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.as_header_inner { display:flex;align-items:center;gap:16px;max-width:1320px;margin:0 auto;padding:0 16px }
.as_logo { font-size:24px;font-weight:800;color:var(--heading);letter-spacing:-.02em;white-space:nowrap;flex-shrink:0 }
.as_logo span { color:var(--primary) }
.as_logo img { height:40px;width:auto }

/* Search bar */
.as_search { flex:1;max-width:480px;display:flex;border:2px solid var(--border);border-radius:5px;overflow:hidden;transition:border-color .2s }
.as_search:focus-within { border-color:var(--primary) }
.as_search input { flex:1;border:none;outline:none;padding:9px 14px;font-size:13px;font-family:'Rubik',sans-serif;background:#f9fafb }
.as_search input::placeholder { color:#bbb }
.as_search button { background:var(--primary);border:none;padding:0 16px;cursor:pointer;transition:background .2s }
.as_search button:hover { background:var(--primary-dark) }
.as_search button i { color:#fff;font-size:14px }
.as_header_icons { display:flex;align-items:center;gap:18px;margin-left:auto;flex-shrink:0 }
.as_header_icons a { color:var(--subtext);font-size:22px;transition:color .2s }
.as_header_icons .wa_link { color:var(--wa) }
.as_header_icons .wa_link:hover { color:var(--wa-dark) }
.as_hamburger { display:none;background:none;border:none;cursor:pointer;color:var(--heading);font-size:24px;padding:4px }

/* Nav bar */
.as_navbar {
  background: var(--primary);
  position: relative;
  z-index: 700;
}
.as_navbar_inner { display:flex;align-items:stretch;max-width:1320px;margin:0 auto;padding:0 16px }

/* All categories button + dropdown */
.as_allcats_wrap { position:relative;z-index:9000;flex-shrink:0 }
.as_allcats_btn {
  display:flex;align-items:center;gap:8px;
  background:var(--primary-dark);color:#fff;
  font-size:13px;font-weight:600;font-family:'Rubik',sans-serif;
  padding:11px 18px;border:none;cursor:pointer;
  white-space:nowrap;height:100%;transition:background .2s
}
.as_allcats_btn:hover { background:#002d5e }
.as_allcats_dropdown {
  position:fixed;top:auto;left:auto;width:280px;
  background:var(--white);
  border-top:3px solid var(--primary);
  border:1px solid var(--border);
  border-radius:0 0 6px 6px;
  z-index:9999;
  box-shadow:0 12px 40px rgba(0,0,0,.15);
  display:none;padding:6px 0;
}
.as_allcats_dropdown a {
  display:flex;align-items:center;gap:10px;
  padding:9px 16px;font-size:13px;color:var(--subtext);
  transition:background .15s,color .15s;border-bottom:1px solid #f5f5f5
}
.as_allcats_dropdown a:last-child { border-bottom:none }
.as_allcats_dropdown a:hover { background:#f0f7ff;color:var(--primary) }
.as_allcats_dropdown a i { width:18px;color:var(--primary);font-size:13px }
.as_cat_count { margin-left:auto;font-size:10px;background:var(--bg);padding:1px 7px;border-radius:10px;color:#aaa }

/* Nav menu */
.as_nav_menu { display:flex;align-items:stretch;flex:1;list-style:none;margin:0;padding:0 }
.as_nav_menu > li { position:relative }
.as_nav_menu > li > a {
  display:flex;align-items:center;height:100%;
  padding:11px 14px;font-size:13px;font-weight:500;
  color:rgba(255,255,255,.85);white-space:nowrap;
  transition:color .2s,background .2s
}
.as_nav_menu > li > a:hover,
.as_nav_menu > li > a.active { color:#fff;background:rgba(255,255,255,.1) }

/* More dropdown */
.as_nav_more { position:relative;z-index:9000 }
.as_nav_more > a { cursor:pointer }
.as_nav_more_dropdown {
  position:absolute;top:100%;right:0;min-width:230px;
  background:var(--white);border:1px solid var(--border);
  border-top:3px solid var(--primary);border-radius:0 0 6px 6px;
  z-index:9999;box-shadow:0 12px 40px rgba(0,0,0,.15);
  display:none;padding:6px 0
}
.as_nav_more:hover .as_nav_more_dropdown a { display:block;padding:9px 16px;font-size:13px;color:var(--subtext);border-bottom:1px solid #f5f5f5 }
.as_nav_more_dropdown a:hover { background:#f0f7ff;color:var(--primary) }

/* WA CTA in nav */
.as_nav_wa {
  display:flex;align-items:center;gap:7px;
  padding:8px 16px;margin:6px 0 6px auto;
  background:var(--wa);color:#fff;
  font-size:12px;font-weight:700;font-family:'Rubik',sans-serif;
  border-radius:4px;transition:background .2s;white-space:nowrap;flex-shrink:0
}
.as_nav_wa:hover { background:var(--wa-dark);color:#fff }
.as_nav_wa i { font-size:15px }

/* ================================================================
   MOBILE DRAWER
================================================================ */
.as_overlay { position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1000;display:none }
.as_overlay.open { display:block }
.as_drawer {
  position:fixed;top:0;left:-300px;width:300px;height:100%;
  background:var(--white);z-index:1100;overflow-y:auto;
  transition:left .3s ease;box-shadow:4px 0 20px rgba(0,0,0,.15)
}
.as_drawer.open { left:0 }
.as_drawer_head { background:var(--primary);padding:16px;display:flex;align-items:center;justify-content:space-between }
.as_drawer_head .as_logo { color:#fff;font-size:20px }
.as_drawer_close { background:none;border:none;color:#fff;font-size:22px;cursor:pointer }
.as_drawer_nav a { display:block;padding:12px 20px;font-size:13px;color:var(--heading);border-bottom:1px solid var(--line);transition:color .2s }
.as_drawer_nav a:hover { color:var(--primary);background:#f0f7ff }

/* ================================================================
   HERO / SLIDER SECTION
================================================================ */
.as_hero_section {
  background:var(--bg);
  padding: 20px 0;
}
.as_hero_inner { display:grid;grid-template-columns:240px 1fr;gap:20px;max-width:1320px;margin:0 auto;padding:0 16px;align-items:start }

/* Left sidebar departments */
.as_dept_sidebar { background:var(--white);border:1px solid var(--border);border-radius:6px;overflow:hidden }
.as_dept_head {
  background:var(--primary);color:#fff;
  padding:13px 16px;font-size:13px;font-weight:700;
  display:flex;align-items:center;gap:8px;
  font-family:'Rubik',sans-serif
}
.as_dept_list { list-style:none;margin:0;padding:0 }
.as_dept_list li a {
  display:flex;align-items:center;gap:10px;
  padding:9px 16px;font-size:12.5px;color:var(--subtext);
  border-bottom:1px solid #f5f5f5;transition:background .15s,color .15s
}
.as_dept_list li a:hover { background:#f0f7ff;color:var(--primary) }
.as_dept_list li a i { width:16px;color:var(--primary);font-size:12px }

/* Hero slider */
.as_hero_slider_wrap { position:relative;border-radius:8px;overflow:hidden }
.as_hero_slide {
  background:linear-gradient(135deg,#ddeeff,#c5e0ff);
  min-height:340px;display:flex;align-items:center;
  padding:40px 48px;position:relative
}
.as_hero_slide .slide_content { flex:1;max-width:460px }
.as_hero_slide .slide_eyebrow {
  display:inline-block;background:var(--primary);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:4px 12px;border-radius:3px;margin-bottom:14px
}
.as_hero_slide h2 {
  font-size:38px;font-weight:800;color:var(--heading);line-height:1.1;
  margin-bottom:12px;letter-spacing:-.02em
}
.as_hero_slide h2 span { color:var(--primary) }
.as_hero_slide p { font-size:14px;color:var(--subtext);line-height:1.7;margin-bottom:22px }
.as_hero_slide .slide_img { position:absolute;right:40px;bottom:0;max-height:300px;max-width:320px }
.as_slide_btns { display:flex;gap:10px;flex-wrap:wrap }

/* Trust strip */
.as_trust_strip { background:var(--white);border-top:3px solid var(--primary);border-bottom:1px solid var(--border);padding:0 }
.as_trust_strip .container { display:grid;grid-template-columns:repeat(4,1fr);max-width:1320px;margin:0 auto;padding:0 16px }
.as_trust_item { display:flex;align-items:center;gap:12px;padding:14px 16px;border-right:1px solid var(--border) }
.as_trust_item:last-child { border-right:none }
.as_trust_icon { width:40px;height:40px;background:var(--primary-light);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0 }
.as_trust_icon i { color:var(--primary);font-size:18px }
.as_trust_icon.wa_icon { background:#e8faf0 }
.as_trust_icon.wa_icon i { color:var(--wa) }
.as_trust_text p { font-size:12.5px;font-weight:700;color:var(--heading);margin:0 0 2px }
.as_trust_text span { font-size:11px;color:var(--text) }

/* ================================================================
   SECTION HEADERS
================================================================ */
.as_section_head { margin-bottom:24px }
.as_section_title {
  font-size:20px;font-weight:700;color:var(--heading);
  padding-bottom:10px;border-bottom:2px solid var(--border);
  display:flex;align-items:center;gap:10px;margin-bottom:0
}
.as_section_title::after {
  content:'';display:block;height:2px;width:60px;
  background:var(--primary);margin-top:-2px;
  /* This creates the underline accent via ::before on the border */
}
.as_section_subtitle { font-size:13px;color:var(--text);margin-top:6px }
.as_section_line { position:relative;height:2px;background:var(--border);margin-bottom:20px }
.as_section_line::before { content:'';position:absolute;left:0;top:0;height:2px;width:60px;background:var(--primary) }
.as_view_all { font-size:12px;font-weight:600;color:var(--primary);margin-left:auto }
.as_view_all:hover { color:var(--primary-dark) }

/* ================================================================
   PRODUCT CARDS
================================================================ */
.as_products_grid { display:grid;grid-template-columns:repeat(4,1fr);gap:16px }
.as_product_card {
  background:var(--white);border:1px solid var(--border);border-radius:6px;
  overflow:hidden;transition:border-color .2s,box-shadow .2s;position:relative;
  display:flex;flex-direction:column;
}
.as_product_card:hover { border-color:var(--primary);box-shadow:0 4px 20px rgba(0,99,209,.1) }
.as_product_badge {
  position:absolute;top:10px;left:10px;z-index:1;
  background:var(--primary);color:#fff;font-size:10px;font-weight:700;
  padding:2px 8px;border-radius:3px
}
.as_product_badge.hot { background:#e85c00 }
.as_product_img {
  display:block;width:100%;padding-top:100%;
  position:relative;background:#f5f8ff;
  border-bottom:1px solid var(--border);overflow:hidden;flex-shrink:0;
}
.as_product_img img {
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;padding:12px;
}
.as_product_body {
  padding:12px;
  display:flex;
  flex-direction:column;
  flex:1; /* fill remaining card height */
}
.as_product_brand {
  font-size:10px;font-weight:700;color:var(--primary);
  letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:4px;display:block
}
.as_product_brand:hover { color:var(--primary-dark) }
.as_product_name {
  font-size:13px;font-weight:500;color:var(--heading);
  line-height:1.4;margin-bottom:8px;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:36px;flex-shrink:0;
}
.as_product_name:hover { color:var(--primary) }
.as_price_row { display:flex;align-items:center;gap:8px;margin-bottom:10px }
.as_price { font-size:15px;font-weight:700;color:var(--price) }
.as_price_orig { font-size:12px;color:#bbb;text-decoration:line-through }
.as_wa_btn {
  display:flex;align-items:center;justify-content:center;gap:6px;
  background:var(--wa);color:#fff;font-size:12px;font-weight:700;
  padding:8px 10px;border-radius:4px;cursor:pointer;
  transition:background .2s;width:100%;border:none;font-family:'Rubik',sans-serif
}
.as_wa_btn:hover { background:var(--wa-dark) }
.as_wa_btn i { font-size:14px }

/* ================================================================
   CATEGORY PAGE — LAYOUT
================================================================ */
.as_shop_layout { display:grid;grid-template-columns:240px 1fr;gap:24px;padding-top:24px }

/* Sidebar */
.as_shop_sidebar {}
.as_sidebar_box { background:var(--white);border:1px solid var(--border);border-radius:6px;margin-bottom:16px;overflow:hidden }
.as_sidebar_head { background:var(--primary);color:#fff;padding:11px 16px;font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px }
.as_sidebar_body { padding:12px 16px }
.as_filter_list { list-style:none;margin:0;padding:0 }
.as_filter_list li { padding:4px 0;font-size:13px;color:var(--subtext) }
.as_filter_list label { display:flex;align-items:center;gap:8px;cursor:pointer }
.as_filter_list input[type=checkbox] { accent-color:var(--primary);width:13px;height:13px }
.as_filter_count { margin-left:auto;font-size:10px;color:#bbb }

/* Shop toolbar */
.as_shop_toolbar {
  display:flex;align-items:center;justify-content:space-between;
  background:var(--white);border:1px solid var(--border);border-radius:6px;
  padding:10px 16px;margin-bottom:16px;gap:12px;flex-wrap:wrap
}
.as_toolbar_count { font-size:13px;color:var(--subtext) }
.as_toolbar_count strong { color:var(--heading) }
.as_sort_select {
  font-size:13px;border:1px solid var(--border);border-radius:4px;
  padding:6px 10px;color:var(--heading);font-family:'Rubik',sans-serif;
  outline:none;cursor:pointer;background:var(--white)
}
.as_sort_select:focus { border-color:var(--primary) }

/* Shop grid */
.as_shop_grid { display:grid;grid-template-columns:repeat(3,1fr);gap:14px }

/* Brand filter chips */
.as_brand_chips { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px }
.as_brand_chip {
  font-size:11px;font-weight:700;color:var(--primary);
  background:var(--primary-light);border:1px solid #c5d9f5;
  border-radius:4px;padding:4px 10px;cursor:pointer;transition:all .15s
}
.as_brand_chip:hover,.as_brand_chip.active { background:var(--primary);color:#fff;border-color:var(--primary) }

/* Category hero */
.as_cat_hero { background:var(--white);border-bottom:1px solid var(--border);padding:24px 0 0 }
.as_cat_hero_inner { max-width:1320px;margin:0 auto;padding:0 16px }
.as_cat_hero h1 { font-size:22px;font-weight:700;color:var(--heading);margin-bottom:8px }
.as_cat_intro { font-size:13px;color:var(--subtext);line-height:1.7;max-width:680px;margin-bottom:14px }

/* ================================================================
   BRAND PAGE
================================================================ */
.as_brand_hero {
  background:linear-gradient(135deg,#ddeeff,#c5e0ff);
  border-bottom:1px solid var(--border);padding:32px 0
}
.as_brand_hero_inner { display:grid;grid-template-columns:1fr 320px;gap:32px;align-items:center;max-width:1320px;margin:0 auto;padding:0 16px }
.as_brand_eyebrow { font-size:11px;font-weight:700;color:var(--primary);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px }
.as_brand_hero h1 { font-size:26px;font-weight:800;color:var(--heading);margin-bottom:6px }
.as_brand_tagline { font-size:14px;color:var(--primary);font-weight:600;margin-bottom:10px }
.as_brand_intro { font-size:13px;color:var(--subtext);line-height:1.7 }
.as_brand_stat_box { background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.9);border-radius:10px;padding:28px;text-align:center;backdrop-filter:blur(4px) }
.as_brand_stat_num { font-size:42px;font-weight:800;color:var(--primary);line-height:1 }
.as_brand_stat_label { font-size:14px;color:var(--subtext);margin-top:4px }

/* ================================================================
   PRODUCT DETAIL PAGE
================================================================ */
.as_pd_breadcrumb { background:var(--white);border-bottom:1px solid var(--border);padding:10px 0 }
.as_pd_section { padding:32px 0 }
.as_pd_grid { display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;max-width:1320px;margin:0 auto;padding:0 16px }

/* Gallery */
.as_pd_gallery { position:sticky;top:90px }
.as_pd_main_img {
  border:1px solid var(--border);border-radius:8px;
  aspect-ratio:1;overflow:hidden;background:#f5f8ff;
  display:flex;align-items:center;justify-content:center;margin-bottom:10px
}
.as_pd_main_img img { width:100%;height:100%;object-fit:contain;padding:20px }
.as_pd_thumbs { display:flex;gap:8px;flex-wrap:wrap }
.as_pd_thumb {
  width:66px;height:66px;border:2px solid var(--border);border-radius:6px;
  cursor:pointer;overflow:hidden;background:#f5f8ff;
  display:flex;align-items:center;justify-content:center;
  transition:border-color .2s;padding:0;background:none
}
.as_pd_thumb:hover,.as_pd_thumb.active { border-color:var(--primary) }
.as_pd_thumb img { width:100%;height:100%;object-fit:contain;padding:6px }

/* Product info */
.as_pd_info {}
.as_pd_brand_link { font-size:11px;font-weight:700;color:var(--primary);letter-spacing:.1em;text-transform:uppercase;display:inline-block;margin-bottom:10px }
.as_pd_title { font-size:22px;font-weight:700;color:var(--heading);line-height:1.25;margin-bottom:10px }
.as_pd_instock { display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#2e7d32;background:#e8f5e9;padding:3px 10px;border-radius:3px;margin-bottom:12px }
.as_pd_instock::before { content:'';width:7px;height:7px;background:#4caf50;border-radius:50%;display:inline-block }
.as_pd_price_block { margin-bottom:14px }
.as_pd_price { font-size:28px;font-weight:800;color:var(--price);display:inline-block }
.as_pd_free_del { display:inline-flex;align-items:center;gap:5px;font-size:11px;color:#2e7d32;background:#e8f5e9;border:1px solid #a5d6a7;border-radius:3px;padding:4px 10px;margin-top:8px }
.as_pd_divider { border:none;border-top:1px solid var(--line);margin:14px 0 }
.as_pd_bullets { list-style:none;margin:0 0 16px;padding:0 }
.as_pd_bullets li { display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--subtext);padding:4px 0;line-height:1.5 }
.as_pd_bullets li i { color:var(--primary);margin-top:3px;flex-shrink:0 }

/* Variant selector */
.as_variant_wrap { margin-bottom:16px }
.as_variant_label { font-size:12px;font-weight:600;color:var(--subtext);margin-bottom:8px;display:block }
.as_variant_btns { display:flex;gap:6px;flex-wrap:wrap }
.as_variant_btn {
  padding:6px 14px;border:1.5px solid var(--border);border-radius:4px;
  font-size:12px;font-weight:500;color:var(--heading);
  cursor:pointer;background:#fff;font-family:'Rubik',sans-serif;transition:all .15s
}
.as_variant_btn:hover,.as_variant_btn.selected { border-color:var(--primary);background:var(--primary);color:#fff }

/* Colour siblings */
.as_siblings_wrap { margin-bottom:16px }
.as_siblings_label { font-size:12px;font-weight:600;color:var(--subtext);margin-bottom:7px;display:block }
.as_siblings_chips { display:flex;gap:6px;flex-wrap:wrap }
.as_sibling_chip {
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border:1.5px solid var(--border);border-radius:4px;
  font-size:11px;color:var(--heading);background:#fff;
  cursor:pointer;transition:all .15s
}
.as_sibling_chip:hover { border-color:var(--primary);color:var(--primary) }
.as_sibling_chip.current { border-color:var(--primary);background:var(--primary);color:#fff;pointer-events:none }
.as_swatch { width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex-shrink:0 }

/* WA buttons */
.as_wa_order_btn {
  display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--wa);color:#fff;font-size:14px;font-weight:700;
  padding:14px 24px;border-radius:6px;cursor:pointer;
  transition:background .2s;width:100%;margin-bottom:10px;
  border:none;font-family:'Rubik',sans-serif
}
.as_wa_order_btn:hover { background:var(--wa-dark) }
.as_wa_ask_btn {
  display:flex;align-items:center;justify-content:center;gap:6px;
  color:var(--wa);border:2px solid var(--wa);background:transparent;
  font-size:13px;font-weight:600;padding:10px 16px;border-radius:6px;
  cursor:pointer;transition:all .2s;width:100%;margin-bottom:16px;
  font-family:'Rubik',sans-serif
}
.as_wa_ask_btn:hover { background:var(--wa);color:#fff }
.as_wa_order_btn i,.as_wa_ask_btn i { font-size:17px }

/* Trust row under buttons */
.as_pd_trust_row { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px }
.as_pd_trust_item { background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px 8px;text-align:center }
.as_pd_trust_item i { font-size:20px;margin-bottom:4px;display:block }
.as_pd_trust_item.green i { color:var(--wa) }
.as_pd_trust_item.blue i { color:var(--primary) }
.as_pd_trust_item span { font-size:11px;color:var(--subtext);display:block;line-height:1.3 }
.as_pd_meta { font-size:11px;color:var(--text);line-height:1.5;margin-top:8px }
.as_pd_meta a { color:var(--primary) }

/* Product tabs */
.as_pd_tabs_section { padding-bottom:32px;max-width:1320px;margin:0 auto;padding-left:16px;padding-right:16px }
.as_pd_tabs { display:flex;border-bottom:2px solid var(--line) }
.as_pd_tab {
  padding:12px 20px;font-size:13px;font-weight:600;color:var(--text);
  cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;
  transition:color .2s,border-color .2s;background:none;border-left:none;border-right:none;border-top:none;
  font-family:'Rubik',sans-serif
}
.as_pd_tab.active { color:var(--primary);border-bottom-color:var(--primary) }
.as_pd_tab_content { padding:20px 0;display:none }
.as_pd_tab_content.active { display:block }
.as_pd_desc { font-size:13px;color:var(--subtext);line-height:1.8 }
.as_pd_desc p { margin-bottom:12px }
.as_pd_desc a { color:var(--primary) }

/* FAQ */
.as_faq_item { border:1px solid var(--border);border-radius:5px;margin-bottom:8px;overflow:hidden }
.as_faq_q {
  padding:13px 16px;font-size:13px;font-weight:600;color:var(--heading);
  cursor:pointer;display:flex;justify-content:space-between;align-items:center;
  background:var(--white);width:100%;border:none;font-family:'Rubik',sans-serif;text-align:left
}
.as_faq_q i { color:var(--primary);transition:transform .2s }
.as_faq_q.open i { transform:rotate(180deg) }
.as_faq_a { padding:0 16px 13px;font-size:13px;color:var(--subtext);line-height:1.7;display:none }
.as_faq_a.open { display:block }

/* Related products */
.as_related_section { padding-bottom:32px;max-width:1320px;margin:0 auto;padding-left:16px;padding-right:16px }
.as_related_title { font-size:18px;font-weight:700;color:var(--heading);margin-bottom:16px;padding-bottom:10px;border-bottom:2px solid var(--primary) }
.as_related_grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px }

/* ================================================================
   BREADCRUMB
================================================================ */
.as_breadcrumb_wrap { background:var(--white);border-bottom:1px solid var(--border);padding:10px 0 }
.as_breadcrumb { display:flex;align-items:center;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0;max-width:1320px;margin-left:auto;margin-right:auto;padding:0 16px }
.as_breadcrumb li { display:flex;align-items:center;gap:4px;font-size:12px;color:var(--text) }
.as_breadcrumb li a { color:var(--subtext) }
.as_breadcrumb li a:hover { color:var(--primary) }
.as_breadcrumb li.active { color:var(--heading);font-weight:500 }
.as_breadcrumb li:not(:last-child)::after { content:'/';color:var(--border);margin-left:4px }

/* ================================================================
   BRAND STRIP
================================================================ */
.as_brand_strip { background:var(--white);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:20px 0 }
.as_brand_strip_label { font-size:11px;font-weight:700;color:var(--text);letter-spacing:.1em;text-transform:uppercase;text-align:center;margin-bottom:14px }
.as_brand_pills { display:flex;gap:8px;flex-wrap:wrap;justify-content:center }
.as_brand_pill {
  background:var(--white);border:1.5px solid var(--border);border-radius:4px;
  padding:6px 16px;font-size:12px;font-weight:700;color:var(--heading);
  transition:all .2s
}
.as_brand_pill:hover { border-color:var(--primary);color:var(--primary) }

/* ================================================================
   NEWSLETTER
================================================================ */
.as_newsletter { background:var(--primary);padding:36px 0 }
.as_newsletter_inner { text-align:center;max-width:480px;margin:0 auto }
.as_newsletter h2 { font-size:20px;color:#fff;margin-bottom:6px }
.as_newsletter p { font-size:13px;color:rgba(255,255,255,.8);margin-bottom:18px }
.as_newsletter_form { display:flex;border-radius:5px;overflow:hidden }
.as_newsletter_form input { flex:1;padding:10px 16px;border:none;outline:none;font-size:13px;font-family:'Rubik',sans-serif }
.as_newsletter_form button { background:var(--primary-dark);color:#fff;border:none;padding:10px 20px;font-size:12px;font-weight:700;cursor:pointer;transition:background .2s;font-family:'Rubik',sans-serif }
.as_newsletter_form button:hover { background:#001f3f }

/* ================================================================
   FOOTER
================================================================ */
.as_footer { background:#1a1a2e;padding:40px 0 0 }
.as_footer_grid { display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:32px;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.08);max-width:1320px;margin:0 auto;padding-left:16px;padding-right:16px }
.as_footer_logo { font-size:22px;font-weight:800;color:#fff;margin-bottom:12px;letter-spacing:-.01em }
.as_footer_logo span { color:var(--primary) }
.as_footer_about { font-size:12px;color:rgba(255,255,255,.45);line-height:1.7;margin-bottom:14px }
.as_footer_contact { font-size:12px;color:rgba(255,255,255,.45);margin-bottom:6px;display:flex;align-items:center;gap:7px }
.as_footer_contact i { color:var(--primary);font-size:13px }
.as_footer_col h4 { font-size:12px;font-weight:700;color:#fff;letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px }
.as_footer_links a { display:block;font-size:12px;color:rgba(255,255,255,.45);margin-bottom:8px;transition:color .2s }
.as_footer_links a:hover { color:var(--primary) }
.as_footer_bottom { padding:14px 0;max-width:1320px;margin:0 auto;padding-left:16px;padding-right:16px }
.as_footer_bottom_inner { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px }
.as_footer_copy { font-size:11px;color:rgba(255,255,255,.3) }
.as_footer_bottom_links { display:flex;gap:14px }
.as_footer_bottom_links a { font-size:11px;color:rgba(255,255,255,.3) }
.as_footer_bottom_links a:hover { color:var(--primary) }

/* ================================================================
   STATIC PAGES
================================================================ */
.as_page_hero { background:var(--white);border-bottom:1px solid var(--border);padding:32px 0;text-align:center }
.as_page_hero h1 { font-size:28px;font-weight:700;color:var(--heading);margin-bottom:6px }
.as_page_hero p { font-size:14px;color:var(--text) }
.as_static_content { max-width:780px;margin:0 auto;padding:36px 16px }
.as_static_content h2 { font-size:18px;color:var(--heading);margin:24px 0 10px;font-weight:700 }
.as_static_content h3 { font-size:15px;color:var(--heading);margin:18px 0 8px;font-weight:600 }
.as_static_content p { font-size:13px;color:var(--subtext);line-height:1.8;margin-bottom:12px }
.as_static_content ul,.as_static_content ol { padding-left:20px;margin-bottom:12px }
.as_static_content li { font-size:13px;color:var(--subtext);line-height:1.7;margin-bottom:4px }
.as_static_content a { color:var(--primary) }

/* About values */
.as_values_grid { display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0 }
.as_value_card { background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:24px;text-align:center }
.as_value_card i { font-size:32px;color:var(--primary);margin-bottom:12px;display:block }
.as_value_card h3 { font-size:14px;color:var(--heading);margin-bottom:8px;font-weight:700 }
.as_value_card p { font-size:12px;color:var(--subtext);line-height:1.6 }

/* Contact */
.as_contact_grid { display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:32px 0 }
.as_contact_item { display:flex;align-items:flex-start;gap:14px;padding:16px;background:var(--bg);border-radius:8px;border:1px solid var(--line);margin-bottom:16px }
.as_contact_item i { font-size:24px;color:var(--primary);flex-shrink:0;margin-top:2px }
.as_contact_item h4 { font-size:13px;font-weight:700;color:var(--heading);margin-bottom:4px }
.as_contact_item p { font-size:12px;color:var(--subtext);line-height:1.6;margin:0 }
.as_contact_wa_box { background:var(--wa);border-radius:10px;padding:32px;text-align:center }
.as_contact_wa_box i { font-size:48px;color:#fff;display:block;margin-bottom:14px }
.as_contact_wa_box h3 { font-size:20px;color:#fff;margin-bottom:8px }
.as_contact_wa_box p { font-size:13px;color:rgba(255,255,255,.85);margin-bottom:18px }
.as_contact_wa_box .wa_open_btn { display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--wa);font-size:14px;font-weight:700;padding:12px 24px;border-radius:6px }

/* 404 */
.as_404_section { text-align:center;padding:80px 20px }
.as_404_num { font-size:120px;font-weight:800;color:var(--primary);line-height:1;margin-bottom:8px }
.as_404_title { font-size:26px;color:var(--heading);margin-bottom:12px }
.as_404_text { font-size:14px;color:var(--text);margin-bottom:28px }

/* ================================================================
   FLOATING WA BUTTON
================================================================ */
.as_wa_float {
  position:fixed;bottom:24px;right:24px;
  background:var(--wa);color:#fff;
  width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  z-index:500;box-shadow:0 4px 16px rgba(37,211,102,.5);
  transition:transform .2s;cursor:pointer
}
.as_wa_float:hover { transform:scale(1.1) }
.as_wa_float i { font-size:26px }

/* ================================================================
   SEARCH MODAL
================================================================ */
.as_search_modal { position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1200;display:none;align-items:flex-start;justify-content:center;padding-top:80px }
.as_search_modal.open { display:flex }
.as_search_modal_inner { background:#fff;border-radius:8px;padding:24px;width:100%;max-width:580px;position:relative }
.as_search_modal_close { position:absolute;top:12px;right:12px;background:none;border:none;cursor:pointer;color:var(--text);font-size:20px }
.as_search_modal_input { width:100%;border:2px solid var(--primary);border-radius:6px;padding:11px 16px;font-size:14px;outline:none;margin-bottom:14px;font-family:'Rubik',sans-serif }
.as_search_results { list-style:none;max-height:320px;overflow-y:auto;margin:0;padding:0 }
.as_search_results li a { display:flex;align-items:center;gap:10px;padding:8px;border-radius:4px;font-size:13px;color:var(--heading) }
.as_search_results li a:hover { background:var(--bg) }
.as_search_results li a span { color:var(--text);font-size:11px }

/* ================================================================
   BTNS
================================================================ */
.as_btn {
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 22px;font-size:13px;font-weight:600;
  border-radius:5px;transition:all .2s;cursor:pointer;border:none;
  font-family:'Rubik',sans-serif
}
.as_btn_primary { background:var(--primary);color:#fff }
.as_btn_primary:hover { background:var(--primary-dark);color:#fff }
.as_btn_outline { background:transparent;border:2px solid var(--primary);color:var(--primary) }
.as_btn_outline:hover { background:var(--primary);color:#fff }
.as_btn_wa { background:var(--wa);color:#fff }
.as_btn_wa:hover { background:var(--wa-dark);color:#fff }

/* ================================================================
   CONTAINER
================================================================ */
.as_container { max-width:1320px;margin:0 auto;padding:0 16px }
section.as_section { padding:36px 0 }

/* ================================================================
   RESPONSIVE
================================================================ */
@media(max-width:1100px) {
  .as_hero_inner { grid-template-columns:200px 1fr }
  .as_products_grid { grid-template-columns:repeat(3,1fr) }
  .as_related_grid { grid-template-columns:repeat(3,1fr) }
  .as_footer_grid { grid-template-columns:1fr 1fr }
  .as_pd_grid { gap:28px }
  .as_brand_hero_inner { grid-template-columns:1fr }
}
@media(max-width:900px) {
  .as_hero_inner { grid-template-columns:1fr }
  .as_dept_sidebar { display:none }
  .as_shop_layout { grid-template-columns:1fr }
  .as_shop_sidebar { display:none }
  .as_products_grid { grid-template-columns:repeat(2,1fr) }
  .as_shop_grid { grid-template-columns:repeat(2,1fr) }
  .as_related_grid { grid-template-columns:repeat(2,1fr) }
  .as_pd_grid { grid-template-columns:1fr }
  .as_pd_gallery { position:static }
  .as_contact_grid { grid-template-columns:1fr }
  .as_values_grid { grid-template-columns:1fr }
}
@media(max-width:768px) {
  .as_search { display:none }
  .as_hamburger { display:block }
  .as_navbar { display:none }
  .as_trust_strip .container { grid-template-columns:1fr 1fr }
  .as_trust_item { border:none;border-bottom:1px solid var(--border) }
  .as_footer_grid { grid-template-columns:1fr }
  .as_hero_slide { padding:28px 20px }
  .as_hero_slide h2 { font-size:26px }
}
@media(max-width:480px) {
  .as_products_grid { grid-template-columns:1fr 1fr }
  .as_shop_grid { grid-template-columns:1fr 1fr }
  .as_related_grid { grid-template-columns:1fr 1fr }
  .as_footer_bottom_inner { flex-direction:column;text-align:center }
}

/* ===== OVERFLOW / HORIZONTAL SCROLL FIX — v2 ===== */
/* Level 1: page-level hard stop */
html, body { overflow-x:hidden !important; max-width:100vw }
* { box-sizing:border-box }

/* Level 2: navbar hard clip — the WA button NEVER causes scroll */
.as_navbar { overflow:visible }
.as_navbar_inner { overflow:visible; flex-wrap:nowrap; min-width:0 }

/* Level 3: WA button in nav — shrinkable, clips text if needed */
.as_nav_wa {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex-shrink:1 !important;       /* ALLOW shrinking — overrides flex-shrink:0 */
  min-width:0;
  max-width:180px;
  font-size:11.5px;
  padding:7px 10px
}

/* Level 4: nav menu items tighter padding so WA btn has room */
.as_nav_menu > li > a { padding:11px 10px; font-size:12px; white-space:nowrap }
.as_allcats_btn { padding:11px 14px; font-size:12px }

/* Level 5: product card WA button — never overflows card */
.as_wa_btn {
  width:100%; min-width:0; box-sizing:border-box;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-size:11.5px; padding:8px 6px
}
.as_product_card { overflow:hidden; min-width:0; max-width:100% }
.as_products_grid, .as_shop_grid { overflow:hidden }

/* Level 6: hero */
.as_hero_inner { max-width:100%; overflow:hidden }
.as_hero_slider_wrap { min-width:0; overflow:hidden }
.as_container, .container { max-width:100%; box-sizing:border-box }

/* ===== HERO SLIDER (SLICK) ===== */
.as_hero_slick { overflow:hidden }
.as_hero_slide { min-height:340px; position:relative; overflow:hidden }
.as_hero_slide .slide_content { 
  position:relative;z-index:2;
  max-width:440px;padding:40px 48px;
  background:rgba(255,255,255,.75);
  border-radius:8px;
  backdrop-filter:blur(2px)
}
.as_slick_prev, .as_slick_next {
  position:absolute;top:50%;transform:translateY(-50%);z-index:10;
  background:rgba(255,255,255,.85);border:1px solid var(--border);
  border-radius:50%;width:38px;height:38px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;color:var(--heading);transition:all .2s
}
.as_slick_prev { left:12px }
.as_slick_next { right:12px }
.as_slick_prev:hover,.as_slick_next:hover { background:var(--primary);color:#fff;border-color:var(--primary) }
.as_hero_slick .slick-dots { bottom:14px }
.as_hero_slick .slick-dots li button:before { color:var(--primary);font-size:10px }

/* ===== LOGO IMAGE ===== */
.as_logo img { height:44px;width:auto;display:block }

/* ===== CATEGORY BANNER ===== */
.as_cat_banner_img { border-bottom:3px solid var(--primary) }
.as_cat_banner_img img { transition:transform .3s }
.as_cat_banner_img:hover img { transform:scale(1.02) }

/* ===== BRAND LOGO ===== */

/* ===== DROPDOWN OPEN CLASS (JS click toggle) ===== */
.as_allcats_wrap.open .as_allcats_dropdown { display:block }
.as_nav_more.open .as_nav_more_dropdown { display:block }
/* hover removed — using JS click + position:fixed */
/* nav-more hover removed — using JS click */

/* ===== DEPT SIDEBAR HEIGHT MATCHES HERO SLIDER ===== */
.as_hero_inner { align-items:stretch }
.as_dept_sidebar { 
  display:flex; flex-direction:column;
  height:100%; overflow:hidden
}
.as_dept_list { 
  flex:1; overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin; scrollbar-color:var(--border) transparent
}
/* Remove bottom whitespace — stretch list items to fill */
.as_dept_list li a { padding:7px 16px }
.as_hero_slider_wrap { display:flex; flex-direction:column }
.as_hero_slick,.as_hero_slick .slick-list,.as_hero_slick .slick-track { height:100%!important }
.as_hero_slide { height:100%!important; min-height:360px }


/* ===== STORE LOCATIONS SECTION ===== */
.as_stores_section { background:var(--bg) }
.as_stores_grid { display:grid; grid-template-columns:1fr 1.2fr; gap:28px; align-items:start }
.as_stores_list { display:flex; flex-direction:column; gap:8px }
.as_store_card {
  display:flex; align-items:center; gap:14px;
  background:var(--white); border:1px solid var(--border); border-radius:8px;
  padding:14px 16px; text-decoration:none; color:inherit;
  transition:border-color .2s, box-shadow .2s; cursor:pointer
}
.as_store_card:hover { border-color:var(--primary); box-shadow:0 3px 12px rgba(0,99,209,.1); color:inherit }
.as_store_card_icon { 
  width:38px; height:38px; background:var(--primary-light); border-radius:50%;
  display:flex; align-items:center; justify-content:center; flex-shrink:0
}
.as_store_card_icon i { color:var(--primary); font-size:16px }
.as_store_card_info { flex:1 }
.as_store_card_info strong { display:block; font-size:13px; font-weight:700; color:var(--heading); margin-bottom:2px }
.as_store_card_info span { font-size:11px; color:var(--text) }
.as_store_card_arrow { color:var(--border); font-size:12px; flex-shrink:0 }
.as_store_card:hover .as_store_card_arrow { color:var(--primary) }
@media(max-width:900px) {
  .as_stores_grid { grid-template-columns:1fr }
}


/* ===== FOOTER MAP STRIP ===== */
.as_footer_map_strip { 
  border-top:1px solid rgba(255,255,255,.08); 
  padding:20px 0; 
  max-width:1320px; margin:0 auto; padding-left:16px; padding-right:16px 
}
.as_footer_map_inner { display:flex; align-items:center; gap:20px; flex-wrap:wrap }
.as_footer_map_iframe { border-radius:6px; overflow:hidden; flex-shrink:0 }
.as_footer_store_links { display:flex; flex-wrap:wrap; gap:8px }
.as_footer_store_link {
  font-size:11px; color:rgba(255,255,255,.5); 
  display:inline-flex; align-items:center; gap:4px;
  padding:4px 10px; background:rgba(255,255,255,.06); border-radius:4px;
  transition:color .2s
}
.as_footer_store_link:hover { color:var(--primary) }

/* ===== CATEGORY DESCRIPTION SECTION (bottom of page) ===== */
.as_cat_desc_section { border-top:1px solid var(--line); padding-top:24px }
.as_cat_long_content p { font-size:14px; line-height:1.8; color:var(--subtext); margin-bottom:14px }
.as_cat_long_content h2 { font-size:16px; font-weight:700; color:var(--heading); margin:20px 0 10px }
.as_cat_long_content ul, .as_cat_long_content ol { padding-left:20px; margin-bottom:14px }
.as_cat_long_content li { font-size:14px; line-height:1.7; color:var(--subtext); margin-bottom:5px }
.as_cat_long_content strong { color:var(--heading); font-weight:600 }
.as_cat_long_content a { color:var(--primary) }
.as_cat_long_content a:hover { text-decoration:underline }

/* Related category links */
.as_cat_related { 
  background:var(--primary-light); 
  border:1px solid #c5d9f5; 
  border-radius:6px; 
  padding:12px 16px; 
  font-size:13px; 
  margin-top:20px 
}
.as_cat_related a { color:var(--primary); font-weight:600 }
.as_cat_related a:hover { text-decoration:underline }

/* ===== NAVBAR OVERFLOW FIX (no overflow:hidden on navbar — dropdown must escape) ===== */
/* Use max-width cap on the inner container instead */
.as_navbar_inner {
  max-width: 1320px;
  width: 100%;
}
/* WA button shrinks before causing overflow */
.as_nav_wa {
  flex-shrink: 1 !important;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  padding: 7px 8px;
}
/* Page-level overflow stop */
html, body { overflow-x: hidden !important }


/* ── Product card equal height fixes ── */
.as_price_row { margin-bottom:8px; flex-shrink:0 }
.as_wa_btn { margin-top:auto } /* pushes to bottom of flex column */

/* Related/shop grid equal-height rows */
.as_products_grid,
.as_shop_grid,
.as_related_grid {
  align-items: stretch; /* all cards in a row same height */
}
.as_products_grid > *,
.as_shop_grid > *,
.as_related_grid > * {
  display: flex;
  flex-direction: column;
}
