/*
Theme Name: Vinilos Rock
Template: flatsome
Version: 1.0.0
Text Domain: vinilosrock
*/

:root {
  --vr-black: #080808;
  --vr-charcoal: #121212;
  --vr-panel: #1a1a1a;
  --vr-red: #d71920;
  --vr-cream: #f4f0e8;
  --vr-muted: #aaa39a;
}

body { background: var(--vr-black); color: var(--vr-cream); }
#wrapper, #main { background: var(--vr-black); }
.header-main, .header-wrapper, .stuck .header-main { background: rgba(8,8,8,.97) !important; }
.header-main { border-bottom: 1px solid rgba(215,25,32,.45); }
.header-nav > li > a, .mobile-nav > li > a { color: #fff !important; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.header-nav > li > a:hover { color: var(--vr-red) !important; }
.nav-dark .nav>li>a { color: #fff; }
.button.primary, .button.checkout, .single_add_to_cart_button, .woocommerce-mini-cart__buttons .checkout {
  background: var(--vr-red) !important; border-color: var(--vr-red) !important; color: #fff !important;
  text-transform: uppercase; letter-spacing: .08em; font-weight: 800;
}
.button.primary:hover, .single_add_to_cart_button:hover { background: #ff252d !important; box-shadow: 0 0 22px rgba(215,25,32,.4); }
.vr-hero { position: relative; min-height: 74vh; display:flex; align-items:center; overflow:hidden;
  background: radial-gradient(circle at 72% 38%, rgba(215,25,32,.22), transparent 30%), linear-gradient(115deg,#050505 0%,#111 58%,#050505 100%); }
.vr-hero:before { content:""; position:absolute; inset:0; opacity:.22; background-image: repeating-linear-gradient(135deg,transparent 0 22px,rgba(255,255,255,.045) 22px 23px); }
.vr-hero-inner { position:relative; z-index:1; width:min(1180px,92%); margin:auto; padding:90px 0; }
.vr-kicker { color:var(--vr-red); text-transform:uppercase; letter-spacing:.28em; font-weight:800; font-size:.8rem; }
.vr-title { color:#fff; font-size:clamp(3.2rem,8vw,7.8rem); line-height:.84; letter-spacing:-.045em; text-transform:uppercase; margin:.18em 0; max-width:900px; text-shadow:0 4px 30px #000; }
.vr-title em { color:var(--vr-red); font-style:normal; }
.vr-lead { color:#d8d3cc; max-width:620px; font-size:1.15rem; margin:1.6rem 0 2rem; }
.vr-actions { display:flex; gap:12px; flex-wrap:wrap; }
.vr-btn { display:inline-block; padding:14px 25px; border:2px solid #fff; color:#fff!important; text-transform:uppercase; letter-spacing:.1em; font-weight:800; }
.vr-btn.red { background:var(--vr-red); border-color:var(--vr-red); }
.vr-btn:hover { background:#fff; color:#080808!important; }
.vr-section { padding:76px 4%; background:var(--vr-black); }
.vr-section.alt { background:var(--vr-charcoal); }
.vr-section h2 { color:#fff; text-align:center; font-size:clamp(2rem,4vw,3.5rem); text-transform:uppercase; margin:0 0 10px; }
.vr-section-head { color:var(--vr-muted); text-align:center; max-width:650px; margin:0 auto 38px; }
.vr-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:1180px; margin:auto; }
.vr-card { min-height:340px; padding:32px; display:flex; flex-direction:column; justify-content:flex-end; color:#fff!important; position:relative; overflow:hidden; border:1px solid #2b2b2b; background:linear-gradient(155deg,#242424,#0c0c0c); }
.vr-card:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 75% 15%,rgba(215,25,32,.35),transparent 36%); transition:.35s; }
.vr-card:hover:before { transform:scale(1.15); }
.vr-card > * { position:relative; z-index:1; }
.vr-card h3 { color:#fff; font-size:1.8rem; text-transform:uppercase; margin:0; }
.vr-card span { color:#ddd; text-transform:uppercase; letter-spacing:.12em; font-size:.75rem; }
.vr-benefits { max-width:1180px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#333; }
.vr-benefit { background:#111; padding:28px; text-align:center; }
.vr-benefit strong { color:#fff; display:block; text-transform:uppercase; letter-spacing:.08em; }
.vr-benefit small { color:var(--vr-muted); }
.product-small.box { background:#151515; border:1px solid #262626; }
.product-small .box-text { padding:18px; }
.product-title a, .woocommerce-loop-product__title, .price, .price span.amount { color:#fff !important; }
.badge-inner { background:var(--vr-red)!important; }
.woocommerce-breadcrumb, .woocommerce-result-count, .woocommerce-ordering select, .shop-page-title { color:#c9c4bd; }
.footer-wrapper { background:#070707; border-top:1px solid #282828; }

@media(max-width:849px){ .vr-grid{grid-template-columns:1fr;} .vr-benefits{grid-template-columns:1fr;} .vr-hero{min-height:65vh;} .vr-title{font-size:3.6rem;} }
