/*
Theme Name: EveryGears
Theme URI: https://everygears.com
Description: EveryGears storefront — a Storefront child theme carrying the EveryGears brand system (Sora + Manrope, Signal Orange, boxed wordmark). Built for WooCommerce with 2000+ products on shared hosting.
Author: EveryGears
Author URI: https://everygears.com
Template: storefront
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: everygears
*/

/* ============================================================
   BRAND TOKENS
   ============================================================ */
:root{
  --eg-orange:#F5531D;
  --eg-orange-dark:#d8420f;
  --eg-ink:#17181A;
  --eg-graphite:#26272B;
  --eg-paper:#FFFFFF;
  --eg-bone:#F6F6F3;
  --eg-line:#E5E5E0;
  --eg-mid:#8B8B84;
  --eg-radius:14px;
}

/* ============================================================
   TYPE  — Sora (display)  ·  Manrope (body/data)
   ============================================================ */
body,
button, input, select, textarea,
.storefront-primary-navigation,
p, li, td, .woocommerce-Price-amount, .price, .widget{
  font-family:'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--eg-ink);
}
h1,h2,h3,h4,h5,h6,
.site-title, .page-title, .product_title,
ul.products li.product .woocommerce-loop-product__title,
.site-header-cart .widget_shopping_cart .buttons,
.button, a.button, button.button{
  font-family:'Sora', sans-serif;
  letter-spacing:-.01em;
}
body{ background:var(--eg-bone); line-height:1.6; }
.woocommerce-Price-amount, .price, .sku, .posted_in{
  font-family:'Manrope', sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.01em;
}

/* ============================================================
   LAYOUT
   ============================================================ */
.col-full{ max-width:1200px; }
a{ color:var(--eg-ink); }
a:hover{ color:var(--eg-orange); }

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  background:var(--eg-paper);
  border-bottom:1px solid var(--eg-line);
  padding-top:14px; padding-bottom:14px;
}
.site-branding .custom-logo-link img,
.site-branding .site-logo-link img{ max-height:44px; width:auto; }
.site-header .site-title a{ color:var(--eg-ink); }
.storefront-primary-navigation{ background:transparent; }
.main-navigation ul li a{ color:var(--eg-ink); font-weight:600; font-size:.95em; }
.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a{ color:var(--eg-orange); }
.main-navigation ul.menu > li.menu-item-has-children > a:after,
.main-navigation ul.nav-menu > li.menu-item-has-children > a:after{ color:var(--eg-mid); }
.site-header-cart .cart-contents{ color:var(--eg-ink); }
.site-header-cart .cart-contents:hover{ color:var(--eg-orange); }
.site-header-cart .count{ background:var(--eg-orange); color:#fff; }

/* Search field */
.widget_product_search input[type=search],
.woocommerce-product-search input[type=search],
input[type=search], input[type=text], input[type=email], input[type=tel], textarea, select{
  border:1px solid var(--eg-line); border-radius:999px; background:#fff;
  box-shadow:none; padding:.7em 1.1em;
}
input:focus, textarea:focus, select:focus{ border-color:var(--eg-ink); outline:2px solid rgba(245,83,29,.15); }

/* ============================================================
   BUTTONS  — orange primary, ink hover
   ============================================================ */
.button, a.button, button, input[type=submit],
.woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.added_to_cart{
  background:var(--eg-orange); color:#fff !important; border:none;
  border-radius:999px; font-weight:600; letter-spacing:0;
  padding:.72em 1.4em; transition:transform .16s, background .16s; box-shadow:none;
}
.button:hover, a.button:hover, button:hover, input[type=submit]:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover, .woocommerce input.button:hover,
.added_to_cart:hover{
  background:var(--eg-ink); color:#fff !important; transform:translateY(-2px);
}
.woocommerce .button.loading, .woocommerce a.added{ opacity:.85; }
/* secondary / outline buttons (e.g. "View cart") */
.woocommerce a.button.wc-forward.added_to_cart{ background:var(--eg-ink); }

/* ============================================================
   PRODUCT GRID  (shop + archives)
   ============================================================ */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background:var(--eg-paper);
  border:1px solid var(--eg-line);
  border-radius:var(--eg-radius);
  padding:14px; margin-bottom:2.5em;
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px -22px rgba(20,20,25,.28);
  border-color:#d8d8d2;
}
.woocommerce ul.products li.product a img{ border-radius:10px; margin-bottom:.8em; background:var(--eg-bone); }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:1.02em; font-weight:600; padding:0 4px; color:var(--eg-ink);
}
.woocommerce ul.products li.product .price{ color:var(--eg-ink); font-weight:700; padding:0 4px; }
.woocommerce ul.products li.product .price del{ color:var(--eg-mid); font-weight:400; }
.woocommerce ul.products li.product .price ins{ color:var(--eg-orange); text-decoration:none; }
.woocommerce ul.products li.product .button{ margin-top:.4em; }
.star-rating span{ color:var(--eg-orange); }

/* Sale flash */
.woocommerce span.onsale{
  background:var(--eg-orange); color:#fff; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:700; min-height:auto;
  min-width:auto; line-height:1; padding:.5em .9em; top:1em; left:1em;
}

/* ============================================================
   SINGLE PRODUCT
   ============================================================ */
.woocommerce div.product .product_title{ font-size:2em; letter-spacing:-.02em; }
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--eg-ink); font-weight:700; font-size:1.5em;
}
.woocommerce div.product p.price ins{ color:var(--eg-orange); }
.woocommerce .woocommerce-tabs ul.tabs li.active{ border-bottom-color:var(--eg-orange); }
.woocommerce .woocommerce-tabs ul.tabs li a{ color:var(--eg-ink); }
.woocommerce div.product form.cart .quantity .qty{ border-radius:999px; }

/* ============================================================
   NOTICES / MESSAGES  (brand voice, orange accent)
   ============================================================ */
.woocommerce-message, .woocommerce-info, .woocommerce-error{
  border-top-color:var(--eg-orange); background:var(--eg-paper); border-radius:8px;
}
.woocommerce-message::before, .woocommerce-info::before{ color:var(--eg-orange); }

/* ============================================================
   PAGINATION / SORTING
   ============================================================ */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{ color:var(--eg-ink); }
.woocommerce nav.woocommerce-pagination ul li span.current{ color:var(--eg-orange); font-weight:700; }
.woocommerce-ordering select, .woocommerce-result-count{ color:var(--eg-mid); }

/* ============================================================
   BREADCRUMB
   ============================================================ */
.woocommerce-breadcrumb{ color:var(--eg-mid); font-size:.85em; }
.woocommerce-breadcrumb a{ color:var(--eg-mid); }
.woocommerce-breadcrumb a:hover{ color:var(--eg-orange); }

/* ============================================================
   FOOTER  (ink)
   ============================================================ */
.site-footer{ background:var(--eg-ink); color:#c9c9c4; }
.site-footer a{ color:#e7e7e3; }
.site-footer a:hover{ color:var(--eg-orange); }
.site-footer .widget-title{ color:#fff; font-family:'Sora',sans-serif; }
.storefront-handheld-footer-bar{ background:var(--eg-ink); }
.storefront-handheld-footer-bar ul li > a, .storefront-handheld-footer-bar ul li > a:before{ color:#fff; }
.storefront-handheld-footer-bar ul li.cart .count{ background:var(--eg-orange); color:#fff; border-color:var(--eg-orange); }

/* ============================================================
   HOME PAGE  (front-page.php)
   ============================================================ */
.eg-hero{
  background:var(--eg-ink); color:#fff; border-radius:18px;
  padding:72px 56px; margin:0 0 56px; overflow:hidden; position:relative;
}
.eg-hero .eg-eyebrow{ color:var(--eg-orange); font-family:'Manrope',sans-serif; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; font-size:.72rem; margin-bottom:20px; }
.eg-hero h1{ font-family:'Sora',sans-serif; font-weight:700; font-size:clamp(34px,6vw,72px);
  line-height:.98; letter-spacing:-.03em; max-width:15ch; margin:0; color:#fff; }
.eg-hero h1 em{ font-style:normal; color:var(--eg-orange); }
.eg-hero p.eg-sub{ margin-top:22px; max-width:48ch; color:#b9b9b4; font-size:1.05rem; }
.eg-hero .eg-cta{ display:inline-flex; gap:8px; align-items:center; margin-top:28px;
  background:var(--eg-orange); color:#fff; font-weight:600; padding:14px 26px; border-radius:999px;
  font-family:'Sora',sans-serif; }
.eg-hero .eg-cta:hover{ background:#fff; color:var(--eg-ink); }

.eg-section-head{ display:flex; align-items:baseline; justify-content:space-between; margin:0 0 22px; gap:16px; flex-wrap:wrap; }
.eg-section-head h2{ font-family:'Sora',sans-serif; font-weight:700; font-size:clamp(24px,3vw,34px); letter-spacing:-.02em; margin:0; }
.eg-section-head a{ font-weight:600; color:var(--eg-orange); font-size:.95rem; }

.eg-cats{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0 0 56px; }
.eg-cat{ position:relative; display:block; border:1px solid var(--eg-line); border-radius:var(--eg-radius);
  overflow:hidden; background:var(--eg-paper); transition:transform .2s, box-shadow .2s; }
.eg-cat:hover{ transform:translateY(-4px); box-shadow:0 16px 34px -20px rgba(0,0,0,.25); }
.eg-cat .eg-cat-img{ aspect-ratio:1/1; background:var(--eg-bone); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.eg-cat .eg-cat-img img{ width:100%; height:100%; object-fit:cover; }
.eg-cat .eg-cat-name{ padding:14px 16px; font-family:'Sora',sans-serif; font-weight:600; display:flex; justify-content:space-between; align-items:center; }
.eg-cat .eg-cat-name span{ color:var(--eg-mid); font-weight:400; font-size:.85em; }

.eg-band{ background:var(--eg-orange); color:#fff; border-radius:18px; padding:48px 40px; margin:0 0 56px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.eg-band .eg-pill h4{ font-family:'Sora',sans-serif; font-weight:700; font-size:1.15rem; margin:0 0 6px; color:#fff; }
.eg-band .eg-pill p{ color:rgba(255,255,255,.9); font-size:.92rem; margin:0; }
.eg-band .eg-pill .eg-n{ font-family:'Manrope',sans-serif; font-weight:700; opacity:.7; font-size:.8rem; margin-bottom:8px; }

@media(max-width:900px){ .eg-cats{ grid-template-columns:repeat(2,1fr); } .eg-band{ grid-template-columns:1fr; } }
@media(max-width:600px){ .eg-hero{ padding:48px 26px; } .eg-cats{ grid-template-columns:1fr 1fr; } }

/* ============================================================
   COLLECTIONS PAGE  (template-collections.php)
   ============================================================ */
.eg-collections-intro{ margin:0 0 34px; }
.eg-collections-intro h1{ font-family:'Sora',sans-serif; font-weight:700; font-size:clamp(30px,5vw,52px); letter-spacing:-.03em; }
.eg-collections-intro p{ color:var(--eg-mid); max-width:56ch; margin-top:10px; }
.eg-collections-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media(max-width:900px){ .eg-collections-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ .eg-collections-grid{ grid-template-columns:1fr; } }