/*
Theme Name: Vybe Pulse
Theme URI: https://vybeaccessories.com/
Author: Vybe Accessories
Description: The official custom WooCommerce theme for Vybe Accessories — audio, gaming and mobile accessories, built around a bold, energetic brand identity. Fully editable homepage banners, hero slider, layout spacing, and section text — no third-party theme credit.
Version: 8.7.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: vybe-pulse
*/

:root{
  --ink:#0B0B12;
  --brand-dark:#1B0E33;
  --ink-800:#15151F;
  --paper:#FFFFFF;
  --paper-100:#F6F6F9;
  --grad-a:#FF3D81;
  --grad-b:#7C3AED;
  --grad-c:#22D3EE;
  --muted:#6B6E79;
  --slate-500:#8A8F98;
  --line:#E7E7EE;
  --line-dark:rgba(255,255,255,0.10);
  --success:#16A34A;
  --radius:16px;
  --display:'Sora',sans-serif;
  --body:'Manrope',sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-size:var(--body-text-size, 15px);
  margin:0;font-family:var(--body);color:var(--ink);
  background:
    radial-gradient(550px 360px at 15% 0%, rgba(217,95,20,0.75), transparent 68%),
    radial-gradient(550px 360px at 85% 0%, rgba(190,30,90,0.6), transparent 68%),
    var(--paper);
  background-repeat:no-repeat;
  line-height:1.6;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:var(--display);color:var(--ink);margin:0 0 .5em 0;letter-spacing:-0.01em;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;height:auto;display:block;}
.container{max-width:var(--container-width, 1080px);margin:0 auto;padding:0 24px;}
.section{padding:var(--section-padding, 72px) 0;}
.section-title{font-size:var(--section-title-size, 24px);margin-bottom:28px;}
.empty-section-note{
  color:var(--slate-500);font-size:14px;padding:24px;border:1px dashed var(--line);
  border-radius:var(--radius);text-align:center;background:var(--paper-100);
}
.empty-section-note code{background:var(--paper);padding:2px 6px;border-radius:4px;font-family:var(--mono, monospace);}
.grad-text{
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b) 55%,var(--grad-c));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 28px;border-radius:100px;font-weight:700;font-size:15px;
  cursor:pointer;border:1px solid transparent;font-family:var(--body);
  transition:transform .15s ease, opacity .15s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b));
  color:#fff;
}
.btn-primary:hover{opacity:.92;}

/* ===== HEADER ===== */
/* ===== ANNOUNCEMENT BAR (scrolling marquee) ===== */
.announcement-bar{
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b));
  color:#fff;overflow:hidden;white-space:nowrap;padding:8px 0;
}
.announcement-track{
  display:inline-flex;
  animation:vybe-marquee 22s linear infinite;
}
.announcement-track span{
  font-size:12px;font-weight:600;letter-spacing:0.01em;
  padding:0 32px;flex-shrink:0;
}
@keyframes vybe-marquee{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}
@media (prefers-reduced-motion: reduce){
  .announcement-track{animation:none;}
}

.site-header{
  position:sticky;top:0;z-index:60;background:rgba(27,14,51,0.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-dark);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  height:72px;min-height:72px;max-height:72px;box-sizing:border-box;padding:0 24px;
}
.logo-text{font-family:var(--display);font-weight:800;font-size:20px;color:#fff;line-height:1;}
.logo-img{height:32px;width:auto;display:block;max-height:32px;}
.main-nav .nav-menu{list-style:none;display:flex;gap:28px;margin:0;padding:0;align-items:center;}
.main-nav .nav-menu a{color:#E4E4EC;font-size:14.5px;font-weight:600;line-height:1;white-space:nowrap;}
.main-nav .nav-menu a:hover,.main-nav .nav-menu .current-menu-item a{color:#fff;}
.header-actions{display:flex;align-items:center;gap:16px;}
.icon-link{color:#fff;position:relative;display:inline-flex;}
.cart-link .cart-count{
  position:absolute;top:-8px;right:-10px;background:var(--grad-a);color:#fff;
  font-size:10.5px;font-weight:700;border-radius:50%;width:17px;height:17px;
  display:flex;align-items:center;justify-content:center;
}
.nav-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:6px;}
.nav-toggle span{width:22px;height:2px;background:#fff;display:block;}
@media(max-width:860px){
  .main-nav{
    display:none;position:absolute;top:100%;left:0;right:0;background:var(--ink);
    padding:20px 24px;border-bottom:1px solid var(--line-dark);
  }
  .main-nav.open{display:block;}
  .main-nav .nav-menu{flex-direction:column;gap:16px;}
  .nav-toggle{display:flex;}
}

/* ===== SHARED HERO TEXT STYLES (used by hero slider and deal countdown) ===== */
.eyebrow{
  font-size:12.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--grad-c);
  font-weight:700;display:block;margin-bottom:18px;
}
.hero-sub{color:#C6C7D3;font-size:17px;margin:18px 0 32px 0;}

/* ===== HERO BANNER (rounded, with margin on all sides) ===== */
.hero-banner{
  position:relative;min-height:var(--hero-height, 400px);
  background-color:var(--brand-dark);background-size:cover;background-position:center;background-repeat:no-repeat;
  display:flex;align-items:center;overflow:hidden;
  margin:20px 24px;border-radius:20px;
}
@media(max-width:600px){
  .hero-banner{
    min-height:calc(var(--hero-height, 400px) * 0.75);
    margin:14px 14px;border-radius:16px;
  }
}
.hero-banner-overlay{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg, rgba(11,11,18,0.65) 0%, rgba(11,11,18,0.35) 55%, rgba(11,11,18,0.05) 100%);
}
.hero-banner-content{position:relative;z-index:2;color:#fff;text-align:left;max-width:var(--hero-content-width, 560px);padding:0 40px;}
.hero-banner-content h1{font-size:var(--hero-heading-size, 44px);line-height:1.1;color:#fff;}

/* ===== BLOG FALLBACK ===== */
.blog-grid{display:flex;flex-wrap:wrap;gap:var(--grid-gap, 24px);}
.blog-card{flex:0 1 calc(33.333% - var(--grid-gap, 24px) * 2 / 3);max-width:calc(33.333% - var(--grid-gap, 24px) * 2 / 3);min-width:220px;box-sizing:border-box;}
@media(max-width:900px){.blog-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr;}}
.blog-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.blog-card-thumb img{aspect-ratio:4/3;object-fit:cover;}
.blog-card h2{font-size:16px;padding:16px 16px 0 16px;}
.blog-card h2 a:hover{color:var(--grad-b);}
.entry-summary{padding:8px 16px 18px 16px;color:var(--muted);font-size:14px;}
.page-content{max-width:760px;margin:0 auto;}
.post-meta{color:var(--muted);font-size:13px;}

/* ===== FOOTER ===== */
.site-footer{background:var(--ink);color:#B9BAC6;padding-top:60px;}
.footer-inner{max-width:1400px;margin:0 auto;padding:0 32px;box-sizing:border-box;}
.footer-logo-img{height:36px;width:auto;display:block;margin-bottom:12px;}
.footer-grid{display:flex;flex-wrap:wrap;gap:32px;padding-bottom:36px;}
.footer-brand{flex:1 1 32%;min-width:220px;box-sizing:border-box;}
.footer-grid > .footer-col{flex:1 1 18%;min-width:140px;box-sizing:border-box;}
.footer-newsletter{flex:1 1 26%;min-width:220px;box-sizing:border-box;}
@media(max-width:900px){
  .footer-brand,.footer-newsletter{flex:1 1 calc(50% - 16px);}
  .footer-grid > .footer-col{flex:1 1 calc(50% - 16px);}
}
@media(max-width:560px){
  .footer-grid{
    display:flex;flex-wrap:wrap;gap:28px 20px;
  }
  .footer-brand{flex:1 1 100%;width:100%;order:1;}
  .footer-grid > .footer-col:nth-child(2){flex:1 1 calc(50% - 10px);width:calc(50% - 10px);order:2;}
  .footer-grid > .footer-col:nth-child(3){flex:1 1 calc(50% - 10px);width:calc(50% - 10px);order:3;}
  .footer-newsletter{flex:1 1 100%;width:100%;order:4;}
}
.footer-tagline{color:#8C8E9C;font-size:13px;margin-top:8px;line-height:1.65;}
.footer-col h5{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:14px;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:14px;}
.footer-col ul a:hover{color:#fff;}
.social-icons{display:flex;gap:10px;}
.social-icon{
  width:34px;height:34px;border-radius:50%;background:var(--ink-800);
  display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;
}
.social-icon:hover{background:var(--grad-b);}

.newsletter-copy{font-size:13px;color:#8C8E9C;margin-bottom:14px;line-height:1.5;}
.footer-newsletter-form{display:flex;gap:8px;margin-bottom:16px;}
.footer-newsletter-form input{
  flex:1;background:var(--ink-800);border:1px solid var(--line-dark);border-radius:8px;
  padding:10px 12px;color:#fff;font-size:13px;font-family:var(--body);
}
.footer-newsletter-form button{
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b));color:#fff;border:none;
  border-radius:8px;padding:10px 18px;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap;
}
.whatsapp-cta-footer{display:flex;align-items:center;gap:9px;}
.whatsapp-icon-circle{
  width:30px;height:30px;border-radius:50%;background:#25D366;color:#fff;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.whatsapp-cta-footer a{font-size:12.5px;color:#B9BAC6;}
.whatsapp-cta-footer a:hover{color:#fff;}

.footer-social-payment-row{
  border-top:1px solid var(--line-dark);margin-top:26px;padding:18px 24px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
}
.payment-icons{display:flex;gap:8px;flex-wrap:wrap;}
.pay-badge{
  font-size:10.5px;font-weight:700;color:#fff;background:var(--ink-800);
  border-left:3px solid var(--slate-500);padding:6px 12px;border-radius:5px;letter-spacing:0.02em;
}
.pay-visa{border-left-color:#1A1F71;}
.pay-mc{border-left-color:#EB001B;}
.pay-jc{border-left-color:#ED1C24;}
.pay-ep{border-left-color:#0DA84E;}

.footer-bottom{
  border-top:1px solid var(--line-dark);padding:16px 0;
  display:flex;justify-content:center;text-align:center;
}
.footer-bottom span{font-size:12.5px;color:#7A7C88;}

/* ================================================
   WOOCOMMERCE — default markup styling
   ================================================ */
.woocommerce ul.products{
  display:flex !important;flex-wrap:wrap !important;gap:var(--grid-gap, 22px) !important;
  list-style:none !important;margin:0 !important;padding:0 !important;
  justify-content:flex-start !important;
}
.woocommerce ul.products li.product{
  flex-grow:0 !important;
  flex-shrink:1 !important;
  flex-basis:calc(25% - var(--grid-gap, 22px) * 3 / 4) !important;
  min-width:200px !important;
  max-width:calc(25% - var(--grid-gap, 22px) * 3 / 4) !important;
  box-sizing:border-box !important;
  width:auto !important;float:none !important;margin:0 !important;clear:none !important;
  position:static !important;display:block !important;
}
.woocommerce ul.products li.product > a{
  display:block !important;float:none !important;width:100% !important;position:static !important;
}
@media(max-width:900px){
  .woocommerce ul.products li.product{
    flex-basis:calc(50% - var(--grid-gap, 22px) / 2) !important;
    max-width:calc(50% - var(--grid-gap, 22px) / 2) !important;
    min-width:160px !important;
  }
}
.woocommerce ul.products li.product{
  display:flex !important;flex-direction:column !important;
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  background:var(--paper);transition:box-shadow .2s ease;
}
.woocommerce ul.products li.product:hover{box-shadow:0 14px 30px -14px rgba(0,0,0,0.18);}
.woocommerce ul.products li.product img{aspect-ratio:1/1;object-fit:cover;width:100% !important;height:auto !important;max-width:none !important;}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--body);font-size:14.5px;font-weight:600;color:var(--ink);
  padding:14px 14px 0 14px;line-height:1.4;
}
.woocommerce ul.products li.product .price{
  padding:8px 14px 16px 14px;font-weight:700;color:var(--ink);font-size:14.5px;
}
.woocommerce ul.products li.product .price del{color:var(--muted);font-weight:400;margin-right:6px;}
.woocommerce ul.products li.product .price ins{text-decoration:none;color:var(--grad-a);}
.woocommerce ul.products li.product .button{
  display:block !important;
  width:auto !important;
  box-sizing:border-box !important;
  margin:auto 14px 16px 14px !important;
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b)) !important;
  color:#fff !important;
  text-align:center;
  padding:10px 18px !important;
  border-radius:100px !important;
  font-size:13px;font-weight:700;
  border:none !important;
}
.woocommerce ul.products li.product .button:hover{opacity:.9;background:linear-gradient(90deg,var(--grad-a),var(--grad-b)) !important;}
.woocommerce ul.products li.product .star-rating{margin:6px 14px 0 14px;}
.woocommerce ul.products li.product .onsale{
  position:absolute !important;top:8px;left:8px;right:auto !important;
  background:var(--grad-a);color:#fff;font-size:10px;font-weight:700;
  padding:3px 9px;border-radius:100px;z-index:2;box-shadow:0 2px 6px rgba(0,0,0,0.25);
}
.woocommerce ul.products li.product{position:relative !important;}

/* product categories shortcode grid (legacy shortcode fallback, kept for safety) */
.woocommerce ul.products li.product-category{
  text-align:center;padding:26px 14px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);
  display:flex !important;flex-direction:column;align-items:center;justify-content:center;
}
.woocommerce ul.products li.product-category a{width:100%;}
.woocommerce ul.products li.product-category img{
  width:56px !important;height:56px !important;object-fit:contain;margin:0 auto;
}
.woocommerce ul.products li.product-category mark{background:none;color:inherit;}
.woocommerce ul.products li.product-category h2,
.woocommerce ul.products li.product-category h3{
  font-size:14.5px;margin:10px 0 4px 0;line-height:1.35;word-wrap:break-word;
}
.woocommerce ul.products li.product-category .count{
  color:var(--muted);font-size:12.5px;
}

/* ================================================
   CUSTOM CATEGORY CATALOG GRID (Shop by Category)
   Fully custom-built, independent of WooCommerce's own markup/CSS
   ================================================ */
/* single product */
.woocommerce div.product{max-width:1000px;margin:0 auto;}
.woocommerce div.product .summary{padding:0 0 0 20px;}
@media(max-width:768px){
  .woocommerce div.product .summary{padding:24px 0 0 0;}
  .woocommerce div.product .images{width:100%;float:none;}
  .woocommerce div.product .summary{width:100%;float:none;}
}
.woocommerce div.product p.price{font-size:22px;font-weight:800;color:var(--ink);}
.woocommerce div.product .single_add_to_cart_button{
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b));color:#fff;
  border-radius:100px;padding:14px 30px;font-weight:700;border:none;
}
.woocommerce-tabs ul.tabs{list-style:none;display:flex;gap:24px;padding:0;border-bottom:1px solid var(--line);margin-bottom:20px;}
.woocommerce-tabs ul.tabs li a{padding-bottom:12px;display:inline-block;font-weight:600;}

/* cart / checkout */
.woocommerce table.shop_table{width:100%;border-collapse:collapse;margin:20px 0;}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{padding:14px;border-bottom:1px solid var(--line);text-align:left;}
.woocommerce-cart .cart_totals{border:1px solid var(--line);border-radius:var(--radius);padding:24px;}
.woocommerce #payment #place_order,
.woocommerce a.checkout-button{
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b));color:#fff;
  border-radius:100px;padding:14px 26px;font-weight:700;border:none;display:inline-block;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:9px;font-family:var(--body);
}
.woocommerce-breadcrumb{color:var(--muted);font-size:13px;margin-bottom:20px;}
.woocommerce-pagination ul.page-numbers{list-style:none;display:flex;gap:8px;padding:0;margin-top:30px;}
.woocommerce-pagination a,.woocommerce-pagination span{
  padding:8px 14px;border:1px solid var(--line);border-radius:8px;font-size:13px;
}

/* ================================================
   BANNER PLACEHOLDERS (shown until image uploaded in Customizer)
   ================================================ */
.banner-placeholder{
  width:100%;height:100%;min-height:220px;
  background:linear-gradient(135deg, var(--paper-100), var(--line));
  display:flex;align-items:center;justify-content:center;text-align:center;
  border-radius:12px;color:var(--slate-500);font-size:13px;padding:20px;
  border:2px dashed var(--slate-500);
}
.banner-img{width:100%;height:100%;object-fit:cover;border-radius:12px;}

/* category banners row */
.cat-banners-grid{display:flex;flex-wrap:wrap;gap:var(--grid-gap, 20px);}
.cat-banner-card{flex:0 1 calc(33.333% - var(--grid-gap, 20px) * 2 / 3);max-width:calc(33.333% - var(--grid-gap, 20px) * 2 / 3);min-width:240px;box-sizing:border-box;}
@media(max-width:900px){.cat-banner-card{flex:0 1 100%;max-width:100%;}}
.cat-banner-card{position:relative;display:block;border-radius:12px;overflow:hidden;height:var(--cat-banner-height, 280px);}
.cat-banner-card .banner-placeholder,.cat-banner-card .banner-img{height:var(--cat-banner-height, 280px);}
.cat-banner-title{
  position:absolute;bottom:18px;left:18px;background:rgba(255,255,255,0.94);
  color:var(--ink);padding:8px 16px;border-radius:100px;font-weight:700;font-size:13.5px;
}

/* category banners — now 4 across */
.cat-banners-grid-4 .cat-banner-card{flex:0 1 calc(25% - var(--grid-gap, 20px) * 3 / 4);max-width:calc(25% - var(--grid-gap, 20px) * 3 / 4);min-width:220px;}
@media(max-width:900px){.cat-banners-grid-4 .cat-banner-card{flex:0 1 calc(50% - var(--grid-gap, 20px) / 2);max-width:calc(50% - var(--grid-gap, 20px) / 2);}}
/* Custom width override from Customizer (only applies once a value > 0 is set; otherwise the responsive width above stays in effect) */
.cat-banners-grid-4 .cat-banner-card{max-width:var(--cat-banner-width, calc(25% - var(--grid-gap, 20px) * 3 / 4));}

/* New Arrivals: 4 products (2x2) + side promo image */
.new-arrivals-grid{display:flex;flex-wrap:wrap;gap:24px;align-items:stretch;}
.new-arrivals-products{flex:1 1 58%;min-width:280px;box-sizing:border-box;}

.new-arrivals-banner{
  flex:1 1 38%;min-width:240px;box-sizing:border-box;position:relative;display:block;
  border-radius:16px;overflow:hidden;min-height:var(--newarrivals-height, 280px);
  max-width:var(--newarrivals-width, none);
}
.new-arrivals-banner .banner-placeholder,.new-arrivals-banner .banner-img{height:100%;min-height:var(--newarrivals-height, 280px);}
.new-arrivals-banner-text{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;
  padding:24px;background:linear-gradient(180deg, transparent 40%, rgba(11,11,18,0.85));
}
.new-arrivals-banner-text h3{color:#fff;font-size:clamp(18px,2vw,24px);margin-bottom:14px;line-height:1.25;}
@media(max-width:700px){.new-arrivals-products,.new-arrivals-banner{flex:1 1 100%;}}

/* Why Shop With Us — compact 3D-style elevated card, sits above the footer on every page */
.why-shop-strip{background:transparent;padding:24px 0;margin-top:40px;}
.site-main.woocommerce-page{padding:32px 0 20px 0;}
.why-shop-grid{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:32px;
  max-width:900px;margin:0 auto;height:72px;min-height:72px;box-sizing:border-box;
  background:linear-gradient(145deg, var(--ink-800, #161F35), var(--ink, #0B0B12));
  border-radius:16px;border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 10px 30px -10px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.06);
  padding:0 28px;
}
.why-item{display:flex;align-items:center;gap:9px;flex:0 1 auto;white-space:nowrap;}
.why-icon{
  font-size:15px;width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg, rgba(255,61,129,0.22), rgba(124,58,237,0.22));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:0 2px 6px rgba(0,0,0,0.3);
}
.why-text{color:#fff;font-size:13px;font-weight:600;}
@media(max-width:600px){
  .why-shop-grid{
    gap:10px;justify-content:space-between;height:auto;min-height:64px;padding:10px 16px;
    max-width:calc(100% - 32px);
  }
  .why-item{gap:6px;}
  .why-icon{width:26px;height:26px;font-size:12px;}
  .why-text{font-size:10.5px;}
}

/* ================================================
   SIDE PRODUCTS — positioned OUTSIDE the centered container
   so the main content's width/position never changes,
   sticky within the content area (stops before footer)
   ================================================ */
.content-with-side-products{position:relative;}
.side-products{display:none;}
@media(min-width:1450px){
  .side-products{
    display:block;
    position:absolute;
    top:0;
    width:160px;
  }
  .side-products-left{
    left:calc(((100% - var(--container-width, 1080px)) / 2 - 160px) / 2);
  }
  .side-products-right{
    right:calc(((100% - var(--container-width, 1080px)) / 2 - 160px) / 2);
  }
  .side-products .vybe-pgrid{
    position:sticky;top:150px;
  }
}


/* ================================================
   TAGLINE STRIP — fills the gap between hero and Shop by Category
   Compact by design, does not add extra page height
   ================================================ */
.tagline-strip{
  position:relative;overflow:visible;background:var(--paper-50);
  padding:28px 24px;
  display:flex;align-items:center;justify-content:center;
  text-align:center;
}
.tagline-strip-inner{
  position:relative;z-index:2;max-width:900px;width:100%;margin:0 auto;
  background:linear-gradient(120deg,var(--grad-a),var(--grad-b) 60%,var(--grad-c));
  clip-path:polygon(2.5% 0%, 97.5% 0%, 100% 50%, 97.5% 100%, 2.5% 100%, 0% 50%);
  padding:32px 70px;
  box-shadow:0 16px 34px -14px rgba(124,58,237,0.4);
}
.tagline-eyebrow{
  display:block;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;
  color:rgba(255,255,255,0.85);font-weight:700;margin-bottom:9px;
}
.tagline-heading{
  font-size:clamp(20px,3vw,30px);font-weight:800;line-height:1.3;color:#fff;
  margin-bottom:7px;
}
.tagline-gradient{
  color:#FCD34D;
}
.tagline-sub{font-size:14px;color:rgba(255,255,255,0.8);margin:0;}
@media(max-width:600px){
  .tagline-strip{padding:20px 14px;}
  .tagline-strip-inner{padding:26px 34px;clip-path:polygon(4% 0%, 96% 0%, 100% 50%, 96% 100%, 4% 100%, 0% 50%);}
}

/* ================================================
   CUSTOM PRODUCT CARDS — fully independent of WooCommerce's
   own markup/CSS. Used for Trending Now, New Arrivals, Side Products.
   ================================================ */
.section-title-row{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
  margin-bottom:28px;
}
.section-title-row .section-title{margin-bottom:0;}
.view-all-link{
  font-size:13px;font-weight:700;color:var(--grad-b);white-space:nowrap;
}
.view-all-link:hover{color:var(--grad-a);}

.vybe-pgrid{
  display:flex;flex-wrap:wrap;gap:var(--grid-gap, 22px);
}
.vybe-pcard{
  display:flex;flex-direction:column;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;transition:box-shadow .2s ease;
  box-sizing:border-box;
}
.vybe-pcard:hover{box-shadow:0 14px 30px -14px rgba(0,0,0,0.18);}

.vybe-pgrid-cols-4 .vybe-pcard{
  flex:0 0 calc(25% - var(--grid-gap, 22px) * 3 / 4);
  max-width:calc(25% - var(--grid-gap, 22px) * 3 / 4);
}
.vybe-pgrid-cols-3 .vybe-pcard{
  flex:0 0 calc(33.333% - var(--grid-gap, 22px) * 2 / 3);
  max-width:calc(33.333% - var(--grid-gap, 22px) * 2 / 3);
}
.vybe-pgrid-cols-2 .vybe-pcard{
  flex:0 0 calc(50% - var(--grid-gap, 22px) / 2);
  max-width:calc(50% - var(--grid-gap, 22px) / 2);
}
.vybe-pgrid-cols-1 .vybe-pcard{
  flex:0 0 100%;max-width:100%;
}
@media(max-width:900px){
  .vybe-pgrid-cols-4 .vybe-pcard,
  .vybe-pgrid-cols-3 .vybe-pcard,
  .vybe-pgrid-cols-2 .vybe-pcard{
    flex:0 0 calc(50% - var(--grid-gap, 22px) / 2);
    max-width:calc(50% - var(--grid-gap, 22px) / 2);
  }
}
@media(max-width:480px){
  .vybe-pgrid-cols-4 .vybe-pcard,
  .vybe-pgrid-cols-3 .vybe-pcard,
  .vybe-pgrid-cols-2 .vybe-pcard{
    flex:0 0 100%;max-width:100%;
  }
}

.vybe-pcard-link{display:block;color:inherit;}
.vybe-pcard-img-wrap{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;background:var(--paper-100);}
.vybe-pcard-img{width:100%;height:100%;object-fit:cover;display:block;}
.vybe-pcard-sale{
  position:absolute;top:8px;left:8px;z-index:2;
  background:var(--grad-a);color:#fff;font-size:10px;font-weight:700;
  padding:3px 9px;border-radius:100px;box-shadow:0 2px 6px rgba(0,0,0,0.25);
}
.vybe-pcard-body{padding:14px 14px 10px 14px;}
.vybe-pcard-title{
  font-family:var(--body);font-size:14px;font-weight:600;color:var(--ink);
  line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:2.8em;
}
.vybe-pcard-price{margin-top:8px;font-size:14px;font-weight:700;color:var(--ink);}
.vybe-pcard-price del{color:var(--muted);font-weight:400;margin-right:6px;text-decoration:line-through;}
.vybe-pcard-price ins{text-decoration:none;color:var(--grad-a);}
.vybe-pcard-btn{
  display:block !important;margin:auto 14px 14px 14px !important;text-align:center !important;
  background:linear-gradient(90deg,var(--grad-a),var(--grad-b)) !important;
  color:#fff !important;padding:10px 18px !important;border-radius:100px !important;
  font-size:13px !important;font-weight:700 !important;
  border:none !important;box-shadow:none !important;text-decoration:none !important;
  width:auto !important;line-height:normal !important;
}
.vybe-pcard-btn:hover{opacity:.9;background:linear-gradient(90deg,var(--grad-a),var(--grad-b)) !important;color:#fff !important;}

/* Shop/category page: "Showing X results" + sorting dropdown row */
.woocommerce-result-count{
  font-size:13.5px;color:var(--muted);
  display:inline-block;
  margin:8px 0 28px 0 !important;
}
.woocommerce-ordering{
  display:inline-block;
  margin:8px 0 28px 0 !important;
  float:right;
}
.woocommerce-ordering select{
  border:1px solid var(--line);border-radius:100px;
  padding:9px 36px 9px 16px;font-size:13px;color:var(--ink);
  background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%236B6E79'/%3E%3C/svg%3E") no-repeat right 14px center;
  appearance:none;-webkit-appearance:none;
  cursor:pointer;
}
.woocommerce-ordering select:focus{outline:none;border-color:var(--grad-b);}
/* clear the float so products start on a fresh line below */
ul.products, .vybe-pgrid{clear:both;}
.vybe-pcard .added_to_cart,
a.added_to_cart.wc-forward{
  display:flex !important;align-items:center;justify-content:center;gap:6px;
  margin:8px 14px 14px 14px !important;
  background:var(--paper-100) !important;color:var(--ink) !important;
  border:1px solid var(--line);border-radius:100px;
  padding:9px 16px !important;font-size:12px;font-weight:600;
  text-decoration:none !important;
}
.vybe-pcard .added_to_cart:hover,
a.added_to_cart.wc-forward:hover{background:var(--line-light, #E7E7EE) !important;}
.vybe-pcard .added_to_cart::before{content:"🛒";font-size:12px;}
.vybe-pcard .added_to_cart::after{content:"→";color:var(--muted);}

/* Side products — compact single-column card style */
.side-products .vybe-pgrid{gap:14px;}
.side-products .vybe-pcard-body{padding:10px 10px 8px 10px;}
.side-products .vybe-pcard-title{font-size:12px;min-height:2.6em;}
.side-products .vybe-pcard-price{font-size:12px;margin-top:4px;}
.side-products .vybe-pcard-btn{font-size:11px;padding:7px 12px;margin:auto 10px 10px 10px;}
.side-products .added_to_cart{font-size:10px !important;padding:6px 10px !important;margin:6px 10px 10px 10px !important;}

/* Safety net: hide any default WordPress/WooCommerce sidebar widgets that might
   otherwise appear unstyled on Shop/category pages, keeping them full-width */
.widget-area,
#secondary,
.sidebar,
aside.widget-area{
  display:none !important;
}