/* ============================================================
   Lyrvant Store — deep-blue + orange industrial theme
   Mirrors lyrvant.com; styles WooCommerce to match.
   ============================================================ */
:root {
  --navy-900:#061225; --navy-800:#0a1b35; --navy-700:#0d2a52; --navy-600:#123a6b;
  --blue-500:#2f6bff; --blue-400:#4f86ff;
  --orange:#ff6a13; --orange-d:#e85d0c;
  --ink:#16202e; --muted:#5b7bb0; --line:#e4ebf5;
  --bg:#f5f8fd; --bg-alt:#eef3fb; --white:#fff;
  --radius:14px; --shadow:0 10px 30px rgba(6,18,37,.08); --shadow-lg:0 18px 50px rgba(6,18,37,.14);
  --maxw:1200px;
  --font:"Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, "Noto Sans", sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; font-family:var(--font); color:var(--ink); background:var(--bg);
  line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
}
img { max-width:100%; display:block; }
a { color:var(--blue-500); text-decoration:none; }
a:hover { color:var(--orange); }
h1,h2,h3,h4 { line-height:1.2; color:var(--navy-900); margin:0 0 .5em; }
picture { display:block; max-width:100%; }
img { max-width:100%; height:auto; }
.product-card img, .pc-img img { width:100%; height:auto; display:block; }
.pc-img picture { width:100%; height:100%; }
h1 { font-size:clamp(28px,4vw,46px); } h2 { font-size:clamp(22px,3vw,34px); } h3 { font-size:20px; }
p { margin:0 0 1em; }
.muted { color:var(--muted); }
.container { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px; }
.section { padding:64px 0; } .section-alt { background:var(--bg-alt); }
.section-head { text-align:center; max-width:720px; margin:0 auto 40px; }
.section-head p { color:var(--muted); }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:8px; justify-content:center;
  padding:12px 22px; border-radius:999px; font-weight:600; font-size:15px;
  border:2px solid transparent; cursor:pointer; transition:.18s; white-space:nowrap; }
.btn-primary { background:var(--orange); color:#fff; }
.btn-primary:hover { background:var(--orange-d); color:#fff; }
.btn-outline { background:transparent; border-color:var(--blue-500); color:var(--blue-500); }
.btn-outline:hover { background:var(--blue-500); color:#fff; }
.btn.full { width:100%; }

/* Header */
.site-header { position:sticky; top:0; z-index:50; background:rgba(6,18,37,.96);
  border-bottom:1px solid rgba(255,255,255,.06); }
.nav-wrap { display:flex; align-items:center; gap:18px; height:68px; }
.brand { display:flex; align-items:center; gap:10px; color:#fff; font-weight:700; }
.brand-name { font-size:20px; letter-spacing:.5px; }
.brand-logo { border-radius:8px; }
.main-nav { flex:1; }
.nav-list { list-style:none; display:flex; gap:4px; margin:0; padding:0; }
.nav-list a { display:block; padding:8px 14px; color:#cdd9ec; border-radius:8px; font-weight:500; }
.nav-list a:hover, .nav-list a.active { color:#fff; background:rgba(255,255,255,.08); }
.nav-right { display:flex; align-items:center; gap:14px; }
.back-link { color:#cdd9ec; font-weight:600; font-size:14px; padding:8px 12px; border-radius:8px; }
.back-link:hover { color:#fff; background:rgba(255,255,255,.08); }
.cart-link { position:relative; display:inline-flex; align-items:center; gap:6px; color:#fff;
  background:var(--orange); padding:8px 14px; border-radius:999px; font-weight:600; }
.cart-link:hover { background:var(--orange-d); color:#fff; }
.cart-count { background:rgba(255,255,255,.25); border-radius:999px; padding:0 8px; font-size:13px; }
.nav-toggle { display:none; background:none; border:0; color:#fff; font-size:22px; cursor:pointer; }

/* Hero */
.hero { position:relative; background:linear-gradient(135deg,var(--navy-800),var(--navy-600)); color:#fff;
  padding:72px 0; }
.hero-eyebrow { text-transform:uppercase; letter-spacing:2px; font-size:13px; color:var(--orange);
  font-weight:700; margin:0 0 12px; }
.hero-title { color:#fff; font-size:clamp(30px,5vw,54px); max-width:820px; }
.hero-sub { font-size:18px; color:#e7eefb; max-width:640px; }
.hero-actions { display:flex; gap:14px; margin-top:22px; flex-wrap:wrap; }

/* Product grid + cards (home + WC archive) */
.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.product-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; box-shadow:var(--shadow); transition:.2s; list-style:none; }
.product-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:#cfe0f7; }
.pc-img { display:flex; align-items:center; justify-content:center; aspect-ratio:1/1;
  background:var(--bg-alt); overflow:hidden; }
.pc-img img, .pc-img-el { width:100%; height:100%; object-fit:cover; }
.pc-body { padding:16px 18px 20px; }
.pc-cat { display:inline-block; font-size:12px; font-weight:700; color:var(--orange);
  background:rgba(255,106,19,.1); padding:3px 10px; border-radius:999px; margin-bottom:8px; }
.pc-title { font-size:16px; margin:0 0 8px; line-height:1.35; }
.pc-title a { color:var(--navy-900); }
.pc-price { color:var(--navy-700); font-weight:700; margin:0 0 14px; font-size:17px; }
.add-to-cart-btn { width:100%; }
.pc-actions { margin-top:auto; }

/* Category tiles */
.cat-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.cat-tile { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:24px;
  text-align:center; box-shadow:var(--shadow); transition:.2s; color:var(--ink); }
.cat-tile:hover { transform:translateY(-4px); border-color:var(--orange); color:var(--orange); }
.cat-ico { display:inline-flex; width:56px; height:56px; border-radius:14px;
  background:linear-gradient(135deg,var(--navy-700),var(--blue-500)); color:#fff;
  align-items:center; justify-content:center; font-size:26px; margin-bottom:14px; }
.cat-tile h3 { margin:0 0 6px; font-size:17px; }
.cat-count { color:var(--muted); font-size:13px; }

/* CTA band */
.cta-band { background:linear-gradient(135deg,var(--navy-800),var(--navy-600)); color:#fff; padding:54px 0; }
.cta-inner { display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.cta-band h2 { color:#fff; margin:0 0 6px; }
.cta-band p { color:#cdd9ec; margin:0; }
.cta-actions { display:flex; gap:14px; flex-wrap:wrap; }

/* Footer */
.site-footer { background:var(--navy-900); color:#cdd9ec; padding:54px 0 24px; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px; }
.footer-col .brand { color:#fff; margin-bottom:14px; }
.footer-col h4 { color:#fff; margin:0 0 14px; font-size:16px; }
.footer-links { list-style:none; padding:0; margin:0; }
.footer-links li { margin-bottom:8px; }
.footer-links a { color:#cdd9ec; }
.footer-links a:hover { color:var(--orange); }
.footer-about { color:#b9c7e0; margin:12px 0; font-size:14px; }
.footer-back { display:inline-block; margin-top:6px; }
.footer-bottom { display:flex; justify-content:space-between; gap:16px; border-top:1px solid rgba(255,255,255,.08);
  margin-top:34px; padding-top:18px; font-size:14px; flex-wrap:wrap; color:#9fb0d0; }

/* ============================================================
   WooCommerce overrides
   ============================================================ */
.woocommerce { max-width:var(--maxw); margin:0 auto; padding:0 20px; }
.woocommerce .woocommerce-breadcrumb { color:var(--muted); padding:18px 0 0; font-size:14px; }
.woocommerce .woocommerce-breadcrumb a { color:var(--blue-500); }
.woocommerce-result-count, .woocommerce-ordering { color:var(--muted); }
.woocommerce nav.woocommerce-pagination ul { border:0; }
.woocommerce nav.woocommerce-pagination ul li { border:0; }
.woocommerce nav.woocommerce-pagination ul li span,
.woocommerce nav.woocommerce-pagination ul li a { background:#fff; border:1px solid var(--line);
  border-radius:10px; padding:8px 14px; color:var(--navy-700); }
.woocommerce nav.woocommerce-pagination ul li span.current { background:var(--orange); color:#fff; border-color:var(--orange); }

/* Archive product loop */
.woocommerce ul.products { display:grid; grid-template-columns:repeat(4,1fr); gap:22px;
  margin:0; padding:0; list-style:none; }
.woocommerce ul.products li.product { margin:0; }
.woocommerce ul.products li.product .pc-img { position:relative; }
.woocommerce ul.products li.product .onsale { position:absolute; top:12px; left:12px; margin:0;
  background:var(--orange); color:#fff; border-radius:999px; padding:3px 12px; font-weight:700; font-size:12px; }
.woocommerce ul.products li.product .price { color:var(--navy-700); font-weight:700; font-size:17px; display:block; margin:0 0 14px; }
.woocommerce ul.products li.product .price del { color:var(--muted); font-weight:400; }
.woocommerce ul.products li.product .price ins { color:var(--orange); text-decoration:none; }

/* Universal WC buttons -> orange pills */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.added_to_cart {
  background:var(--orange); color:#fff; border:2px solid var(--orange); border-radius:999px;
  font-weight:600; padding:12px 22px; font-size:15px; transition:.18s; line-height:1.2; }
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #respond input#submit:hover { background:var(--orange-d); border-color:var(--orange-d); color:#fff; }
.woocommerce a.added_to_cart { background:transparent; color:var(--blue-500); border-color:var(--blue-500); }
.woocommerce a.added_to_cart:hover { background:var(--blue-500); color:#fff; }
.woocommerce a.button.alt { background:var(--orange); border-color:var(--orange); }
.woocommerce a.button.alt:hover { background:var(--orange-d); border-color:var(--orange-d); }

/* Single product */
.woocommerce div.product { display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start;
  margin-top:10px; }
.woocommerce div.product .woocommerce-product-gallery { border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden; background:#fff; padding:14px; }
.woocommerce div.product .summary { background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:28px; box-shadow:var(--shadow); }
.woocommerce div.product .summary .product_title { font-size:30px; margin:0 0 12px; color:var(--navy-900); }
.woocommerce div.product .summary .price { color:var(--navy-700); font-weight:800; font-size:26px; margin:10px 0 18px; }
.woocommerce div.product .summary .price ins { color:var(--orange); text-decoration:none; }
.woocommerce div.product .summary .price del { color:var(--muted); font-weight:400; font-size:18px; }
.woocommerce div.product form.cart { margin:18px 0; }
.woocommerce div.product .summary .woocommerce-product-details__short-description { color:var(--ink); }
.woocommerce div.product .woocommerce-tabs ul.tabs { display:flex; gap:6px; list-style:none; padding:0; margin:24px 0 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { background:var(--bg-alt); border:1px solid var(--line);
  border-radius:10px 10px 0 0; padding:10px 16px; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background:#fff; border-bottom-color:#fff; }
.woocommerce div.product .woocommerce-tabs .panel { background:#fff; border:1px solid var(--line);
  border-top:0; border-radius:0 0 12px 12px; padding:22px; }

/* Cart / checkout inputs */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea,
.woocommerce form .form-row select, .woocommerce .select2-container--default .select2-selection {
  padding:11px 13px; border:1px solid var(--line); border-radius:10px; font:inherit; width:100%; }
.woocommerce form .form-row input.input-text:focus, .woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus { outline:2px solid var(--blue-400); border-color:var(--blue-400); }
.woocommerce table.shop_table { border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  background:#fff; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding:14px 16px; border-bottom:1px solid var(--line); }
.woocommerce table.cart img { width:64px; border-radius:10px; }
.woocommerce-cart table.cart td.actions .coupon .input-text { border-radius:10px; padding:11px 13px; }
.woocommerce .cart-collaterals .cart_totals, .woocommerce .cart-collaterals .cart_totals table { background:#fff; }
.woocommerce-checkout #payment, .woocommerce-checkout #order_review { background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); padding:22px; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom:1px solid var(--line); padding-bottom:14px; }

/* Notices */
.woocommerce .woocommerce-message, .woocommerce .woocommerce-info, .woocommerce .woocommerce-error {
  border-radius:12px; padding:14px 16px; margin:18px 0; border:1px solid var(--line); background:#fff; }
.woocommerce .woocommerce-message { border-left:4px solid var(--orange); }
.woocommerce .woocommerce-error { border-left:4px solid #e23b3b; }
.woocommerce .woocommerce-info { border-left:4px solid var(--blue-500); }

/* Generic page */
.page-title { font-size:clamp(24px,3vw,36px); }
.page-content { color:var(--ink); }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:1080px){
  .product-grid, .woocommerce ul.products { grid-template-columns:repeat(3,1fr); }
  .cat-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:960px){
  .woocommerce div.product { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .nav-toggle { display:block; }
  .nav-list { display:none; position:absolute; top:68px; left:0; right:0; background:var(--navy-900);
    flex-direction:column; padding:12px 20px; border-top:1px solid rgba(255,255,255,.08); }
  .nav-list.open { display:flex; }
  .nav-right { gap:10px; }
}
@media (max-width:680px){
  .product-grid, .woocommerce ul.products, .cat-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr; }
  .hero { padding:44px 0; }
  /* The long "back to main site" link overflows the phone header; the footer already has it. */
  .back-link { display:none; }
  .product-grid, .cat-grid { gap:14px; }
  .section { padding:40px 0; }
}