/*
Theme Name: Zyla Digital
Theme URI: https://zyladigital.com
Author: Zyla Digital
Author URI: https://zyladigital.com
Description: Theme institucional para Zyla Digital (agencia de Desarrollo Web, SEO, Ads y Automatización). Header moderno estilo Nexora adaptado a la identidad neon de Zyla, home con servicios y planes, y footer corporativo multi-columna. 100% responsive.
Version: 1.0
Requires PHP: 7.4
Text Domain: zyla-digital
*/

/* =========================================================
   TOKENS
========================================================= */
:root{
  --bg:#000000;
  --bg-alt:#050508;
  --bg-alt-2:#0a0a0e;
  --text:#f0f0f0;
  --muted:#b3b3bd;
  --muted-2:#8a8a95;
  --neon-green:#00e09e;
  --neon-blue:#00a8ff;
  --neon-purple:#b967ff;
  --card-bg:#0b0b0f;
  --border-soft:rgba(255,255,255,.08);
  --border-neon:1px solid var(--neon-green);
  --radius:16px;
  --radius-lg:24px;
  --transition:all .25s cubic-bezier(.2,.9,.4,1.1);
  --header-h:76px;
}

/* =========================================================
   RESET / BASE
========================================================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; cursor:pointer; }
input,select,textarea{ font-family:inherit; }

#particles-canvas{
  position:fixed; inset:0; width:100%; height:100%;
  z-index:-2; pointer-events:none;
}

.container{ max-width:1240px; margin:0 auto; padding:0 1.5rem; }

.gradient-text{
  background:linear-gradient(90deg,#fff,var(--neon-green));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

.section{ max-width:1240px; margin:5.5rem auto; padding:0 1.5rem; }
.section-head{ text-align:center; max-width:680px; margin:0 auto 3rem; }
.section-tag{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.75rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--neon-green); border:var(--border-neon); background:rgba(0,224,158,.08);
  padding:.35rem 1rem; border-radius:40px; margin-bottom:1.1rem;
}
.section h2{
  font-size:clamp(1.7rem,3.6vw,2.5rem);
  margin:0 0 .6rem;
  position:relative;
  font-weight:800;
}
.section h2::after{
  content:''; position:absolute; bottom:-14px; left:50%; transform:translateX(-50%);
  width:70px; height:3px; background:var(--neon-green); border-radius:2px;
}
.section-head p{ color:var(--muted); margin-top:1.6rem; font-size:1.05rem; }

/* =========================================================
   BUTTONS
========================================================= */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  border-radius:50px; font-weight:700; font-size:.92rem; padding:.85rem 1.9rem;
  transition:var(--transition); border:1px solid transparent; white-space:nowrap;
}
.btn-solid{
  background:rgba(0,224,158,.14); border:1px solid var(--neon-green); color:#fff;
}
.btn-solid:hover{ background:var(--neon-green); color:#000; box-shadow:0 0 18px rgba(0,224,158,.5); transform:translateY(-2px); }
.btn-outline{
  background:transparent; border:1px solid var(--neon-green); color:var(--neon-green);
}
.btn-outline:hover{ background:var(--neon-green); color:#000; box-shadow:0 0 15px rgba(0,224,158,.45); }
.btn-ghost-pill{
  background:rgba(0,224,158,.12); border:1px solid var(--neon-green); border-radius:40px;
  padding:.45rem 1.15rem; font-size:.85rem; font-weight:600; color:#fff;
}
.btn-ghost-pill:hover{ background:var(--neon-green); color:#000; }
.btn-block{ width:100%; }

/* =========================================================
   HEADER
========================================================= */
.zyla-topbar{
  background:rgba(0,0,0,.94); border-bottom:1px solid rgba(0,224,158,.18);
  font-size:.74rem; color:var(--muted-2);
}
.zyla-topbar .container{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:.4rem; padding-bottom:.4rem; flex-wrap:wrap; }
.zyla-topbar .tb-left,.zyla-topbar .tb-right{ display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; }
.zyla-topbar i{ color:var(--neon-green); margin-right:.35rem; }
.zyla-topbar a:hover{ color:#fff; }

.zyla-header{
  position:sticky; top:0; left:0; width:100%; z-index:1000;
  background:rgba(0,0,0,.85); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(0,224,158,.3);
  transition:var(--transition);
}
.zyla-header.scrolled{ background:rgba(0,0,0,.96); border-bottom-color:rgba(0,224,158,.6); box-shadow:0 4px 24px rgba(0,0,0,.5); }

.zyla-header .nav-row{
  display:flex; align-items:center; justify-content:space-between; gap:1.25rem;
  padding:1.05rem 0; transition:var(--transition);
}
.zyla-header.scrolled .nav-row{ padding:.55rem 0; }

.zyla-logo{ display:flex; align-items:center; gap:.6rem; font-size:1.55rem; font-weight:800; letter-spacing:-.3px; transition:var(--transition); }
.zyla-header.scrolled .zyla-logo{ font-size:1.3rem; }
.zyla-logo img{ height:34px; width:auto; }
.zyla-logo span{ background:linear-gradient(135deg,#fff,var(--neon-green)); -webkit-background-clip:text; background-clip:text; color:transparent; }

.zyla-nav{ display:flex; align-items:center; gap:2rem; }
.zyla-nav a{
  color:#ddd; font-weight:500; font-size:.95rem; transition:var(--transition); position:relative;
}
.zyla-nav a:hover,.zyla-nav a.current-menu-item,.zyla-nav a.active{
  color:var(--neon-green); text-shadow:0 0 8px rgba(0,224,158,.4);
}

.zyla-header-actions{ display:flex; align-items:center; gap:.7rem; }
.zyla-icon-btn{
  width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  color:var(--muted); border:1px solid var(--border-soft); background:transparent; transition:var(--transition);
}
.zyla-icon-btn:hover{ color:#fff; border-color:rgba(255,255,255,.3); }
.zyla-burger{ display:none; }

/* Mobile menu */
.zyla-mobile-menu{
  position:fixed; inset:0; z-index:1200; background:rgba(0,0,0,.97); backdrop-filter:blur(20px);
  opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease;
  display:flex; flex-direction:column; padding:1.4rem 1.6rem;
}
.zyla-mobile-menu.open{ opacity:1; visibility:visible; }
.zyla-mobile-menu .mm-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:2.4rem; }
.zyla-mobile-menu nav{ display:flex; flex-direction:column; gap:1.6rem; }
.zyla-mobile-menu nav a{ font-size:1.7rem; font-weight:700; color:var(--muted); }
.zyla-mobile-menu nav a:hover{ color:#fff; }
.zyla-mobile-menu .mm-cta{ margin-top:auto; display:flex; gap:.8rem; padding-top:2rem; }

/* =========================================================
   HERO
========================================================= */
.hero{
  min-height:78vh; display:flex; align-items:center; justify-content:center; text-align:center;
  padding:3rem 1.5rem; position:relative; overflow:hidden;
}
.hero-content{ max-width:820px; z-index:2; position:relative; }
.hero h1{
  font-size:clamp(2.1rem,5.6vw,3.4rem); font-weight:800; margin-bottom:1rem;
  background:linear-gradient(90deg,#fff,var(--neon-green)); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero p{ font-size:clamp(1rem,1.6vw,1.2rem); color:#ccc; max-width:640px; margin:0 auto 1.6rem; }
.badge-group{ display:flex; justify-content:center; gap:.9rem; flex-wrap:wrap; margin:1.2rem 0 1.8rem; }
.badge{
  background:rgba(0,224,158,.08); border:var(--border-neon); padding:.4rem 1.1rem; border-radius:40px;
  font-weight:600; color:var(--neon-green); display:inline-flex; align-items:center; gap:.45rem; font-size:.82rem;
}
.hero-ctas{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-top:.6rem; }

/* =========================================================
   SERVICES
========================================================= */
.cards-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.8rem; }
.service-card{
  background:var(--card-bg); border-radius:var(--radius-lg); padding:2rem 1.7rem; text-align:center;
  border:1px solid var(--border-soft); transition:var(--transition);
}
.service-card:hover{ transform:translateY(-6px); border-color:var(--neon-green); box-shadow:0 16px 32px rgba(0,0,0,.4); }
.service-icon{
  width:56px; height:56px; border-radius:16px; margin:0 auto 1.1rem; display:flex; align-items:center; justify-content:center;
  background:rgba(0,224,158,.1); color:var(--neon-green); font-size:1.5rem;
}
.service-card h3{ font-size:1.25rem; margin-bottom:.6rem; font-weight:700; }
.service-card p{ font-size:.92rem; color:var(--muted); }

/* =========================================================
   PLANS / PRICING
========================================================= */
.plans-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.8rem; }
.plan-card{
  background:var(--card-bg); border-radius:var(--radius-lg); padding:2.1rem; text-align:center; position:relative;
  overflow:hidden; border:1px solid rgba(255,255,255,.07); transition:var(--transition); display:flex; flex-direction:column;
}
.plan-card:hover{ transform:translateY(-5px); border-color:var(--neon-green); }
.plan-card.featured{ border-color:var(--neon-green); box-shadow:0 0 0 1px rgba(0,224,158,.35), 0 20px 40px rgba(0,224,158,.08); }
.plan-ribbon{
  position:absolute; top:14px; right:-34px; transform:rotate(45deg); background:var(--neon-green); color:#000;
  font-size:.68rem; font-weight:800; padding:.3rem 2.6rem; letter-spacing:.05em; text-transform:uppercase;
}
.plan-card h3{ font-size:1.4rem; color:var(--neon-green); margin-bottom:.7rem; font-weight:800; }
.plan-price{ font-size:1.9rem; font-weight:800; margin:.6rem 0 1.2rem; }
.plan-price .original{ text-decoration:line-through; color:#777; font-size:1.05rem; font-weight:600; display:block; margin-bottom:.1rem; }
.plan-price .offer{ color:var(--neon-green); }
.plan-features{ text-align:left; margin:0 0 1.6rem; flex:1; }
.plan-features li{ position:relative; padding-left:1.5rem; margin:.65rem 0; font-size:.92rem; color:#ddd; }
.plan-features li::before{ content:'✓'; position:absolute; left:0; color:var(--neon-green); font-weight:800; }

.plans-intro{ text-align:center; max-width:640px; margin:0 auto 2.6rem; color:var(--muted); }

/* =========================================================
   PARTNERS (Google / Meta Ads)
========================================================= */
.partners-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2rem; }
.partner-card{
  background:var(--card-bg); border-radius:var(--radius-lg); padding:2.2rem; text-align:center;
  border:1px solid var(--border-soft); border-top:4px solid var(--neon-green); transition:var(--transition);
}
.partner-card:hover{ transform:translateY(-8px); box-shadow:0 16px 34px rgba(0,0,0,.45); }
.partner-card.google{ border-top-color:var(--neon-blue); }
.partner-card.meta{ border-top-color:var(--neon-purple); }
.partner-icon{ font-size:2.6rem; margin-bottom:1rem; }
.partner-card.google .partner-icon,.partner-card.google h3{ color:var(--neon-blue); }
.partner-card.meta .partner-icon,.partner-card.meta h3{ color:var(--neon-purple); }
.partner-card h3{ font-size:1.4rem; margin-bottom:.8rem; font-weight:800; }
.partner-card p{ color:var(--muted); margin-bottom:1.2rem; }
.partner-features{ text-align:left; margin:0 0 1.4rem; }
.partner-features li{ position:relative; padding-left:1.4rem; margin:.5rem 0; font-size:.9rem; color:#ddd; }
.partner-features li::before{ content:'✓'; position:absolute; left:0; color:var(--neon-green); font-weight:800; }

/* =========================================================
   CONTACT
========================================================= */
.contact-wrap{ display:grid; grid-template-columns:1fr 1.25fr; gap:2.5rem; align-items:flex-start; }
.contact-info{ background:var(--card-bg); border-radius:var(--radius-lg); padding:2.2rem; border:1px solid var(--border-soft); }
.contact-info h3{ font-size:1.3rem; margin-bottom:1rem; font-weight:800; }
.contact-info p{ color:var(--muted); margin-bottom:1.6rem; }
.contact-info .ci-row{ display:flex; align-items:center; gap:.8rem; margin-bottom:1.1rem; font-size:.95rem; }
.contact-info .ci-row i{ color:var(--neon-green); width:20px; text-align:center; }
.contact-section{
  background:rgba(10,10,15,.7); border-radius:var(--radius-lg); padding:2.2rem; backdrop-filter:blur(4px);
  border:1px solid rgba(0,224,158,.2);
}
.form-row{ display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:0; }
.form-row .form-group{ flex:1; min-width:180px; }
.form-group{ margin-bottom:1.2rem; }
label{ font-weight:500; display:block; margin-bottom:.4rem; font-size:.85rem; color:#ccc; }
input,select,textarea{
  width:100%; padding:.8rem 1rem; background:#111217; border:1px solid #2a2a35; border-radius:14px;
  color:#fff; font-size:.9rem; transition:var(--transition);
}
input:focus,select:focus,textarea:focus{ outline:none; border-color:var(--neon-green); box-shadow:0 0 0 2px rgba(0,224,158,.2); }
textarea{ resize:vertical; min-height:100px; }
.form-message{ margin-top:1rem; text-align:center; font-weight:500; font-size:.85rem; min-height:1.2em; }

/* CTA band before footer */
.cta-band{
  background:linear-gradient(120deg,rgba(0,224,158,.1),rgba(185,103,255,.08));
  border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft);
  padding:3.4rem 1.5rem; text-align:center;
}
.cta-band h2{ font-size:clamp(1.5rem,3vw,2.1rem); margin-bottom:1.3rem; font-weight:800; }
.cta-band .hero-ctas{ margin-top:0; }

/* =========================================================
   FOOTER
========================================================= */
.zyla-footer{ background:var(--bg-alt); border-top:1px solid var(--border-soft); }
.footer-top{ padding:4.5rem 0 3rem; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1fr; gap:2.5rem; }
.footer-brand .zyla-logo{ font-size:1.7rem; margin-bottom:.9rem; }
.footer-brand p{ color:var(--muted); font-size:.9rem; line-height:1.7; max-width:320px; }
.footer-social{ display:flex; gap:.7rem; margin-top:1.4rem; }
.footer-social a{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--border-soft); color:var(--muted-2);
  display:flex; align-items:center; justify-content:center; transition:var(--transition); font-size:.85rem;
}
.footer-social a:hover{ color:#000; background:var(--neon-green); border-color:var(--neon-green); }
.footer-col h4{
  font-size:.74rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2); margin-bottom:1.3rem;
}
.footer-col ul li{ margin-bottom:.8rem; }
.footer-col ul li a{ font-size:.9rem; color:var(--muted); transition:var(--transition); }
.footer-col ul li a:hover{ color:var(--neon-green); }
.footer-bottom{ border-top:1px solid var(--border-soft); padding:1.5rem 0; }
.footer-bottom .container{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.footer-bottom p{ font-size:.78rem; color:var(--muted-2); margin:0; }
.footer-badges{ display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.footer-badges span{
  font-size:.66rem; font-weight:700; letter-spacing:.03em; color:var(--muted-2);
  border:1px solid var(--border-soft); border-radius:6px; padding:.3rem .6rem; background:rgba(255,255,255,.03);
}

/* WhatsApp floating */
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.7rem;
  box-shadow:0 6px 20px rgba(0,0,0,.35); z-index:999; animation:zyla-float 3s ease-in-out infinite;
}
.whatsapp-float:hover{ transform:scale(1.06); background:#20b859; }
@keyframes zyla-float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-8px);} }

/* Generic page/single content */
.zyla-page-content{ max-width:820px; margin:0 auto; padding:5rem 1.5rem; }
.zyla-page-content h1{ font-size:clamp(1.9rem,4vw,2.6rem); margin-bottom:2rem; font-weight:800; }
.zyla-page-content p{ color:var(--muted); margin-bottom:1.2rem; line-height:1.8; }
.zyla-404{ text-align:center; padding:7rem 1.5rem; }
.zyla-404 .code{ font-size:6rem; font-weight:800; background:linear-gradient(90deg,#fff,var(--neon-green)); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* =========================================================
   WOOCOMMERCE
========================================================= */

/* Contenedor general de páginas de tienda (shop, cart, checkout, my-account) */
.zyla-shop-wrap{ max-width:1240px; }

/* ---------- Mini-carrito (header) ---------- */
.zyla-cart-trigger{ position:relative; }
.zyla-icon-btn{ position:relative; }
.cart-count{
  position:absolute; top:-6px; right:-6px; width:18px; height:18px; border-radius:50%;
  background:var(--neon-green); color:#000; font-size:.62rem; font-weight:800;
  display:flex; align-items:center; justify-content:center;
}
.zyla-mini-cart{
  position:absolute; top:calc(100% + 12px); right:0; width:340px;
  background:rgba(11,11,15,.98); backdrop-filter:blur(20px); border:1px solid var(--border-soft);
  border-radius:var(--radius); padding:1.3rem; opacity:0; visibility:hidden; transform:translateY(8px);
  transition:var(--transition); box-shadow:0 30px 60px rgba(0,0,0,.6); z-index:1100;
}
.zyla-cart-trigger:hover .zyla-mini-cart{ opacity:1; visibility:visible; transform:translateY(0); }
.zyla-mini-cart .woocommerce-mini-cart{ list-style:none; margin:0 0 1rem; padding:0; max-height:280px; overflow-y:auto; }
.zyla-mini-cart .woocommerce-mini-cart-item{
  display:flex; align-items:center; gap:.7rem; padding:.7rem 0; border-bottom:1px solid var(--border-soft);
  position:relative; font-size:.85rem;
}
.zyla-mini-cart .woocommerce-mini-cart-item img{ width:46px; height:46px; object-fit:cover; border-radius:8px; }
.zyla-mini-cart .woocommerce-mini-cart-item a.remove{
  position:absolute; top:.7rem; right:0; color:#888; font-size:1rem; line-height:1;
}
.zyla-mini-cart .woocommerce-mini-cart-item a.remove:hover{ color:#ff6b6b; }
.zyla-mini-cart .total{ font-weight:700; padding:.8rem 0; border-top:1px solid var(--border-soft); margin-bottom:1rem; }
.zyla-mini-cart .woocommerce-mini-cart__buttons{ display:flex; gap:.6rem; }
.zyla-mini-cart .woocommerce-mini-cart__buttons a{ flex:1; text-align:center; }
.zyla-mini-cart .woocommerce-mini-cart__empty-message{ color:var(--muted); font-size:.85rem; text-align:center; padding:1rem 0; }

/* ---------- Badges de producto ---------- */
.zyla-badge-featured{
  position:absolute; top:14px; left:14px; z-index:5; background:rgba(0,224,158,.16); color:var(--neon-green);
  border:1px solid var(--neon-green); font-size:.62rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  padding:.28rem .75rem; border-radius:40px;
}
span.onsale{
  position:absolute; top:14px; right:14px; z-index:5; background:rgba(185,103,255,.16) !important; color:var(--neon-purple) !important;
  border:1px solid var(--neon-purple); font-size:.62rem !important; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  padding:.28rem .75rem !important; border-radius:40px !important; min-height:0; min-width:0; line-height:normal;
}

/* ---------- Grilla de productos (tienda / relacionados / upsells) ---------- */
ul.products{
  display:grid !important; grid-template-columns:repeat(2,1fr); gap:1.2rem; list-style:none; padding:0; margin:0 0 2rem;
}
@media (min-width:768px){ ul.products{ grid-template-columns:repeat(4,1fr); gap:1.6rem; } }
ul.products li.product{
  background:var(--card-bg); border:1px solid var(--border-soft); border-radius:var(--radius);
  overflow:hidden; transition:var(--transition); padding:0 !important; margin:0 !important; position:relative;
}
ul.products li.product:hover{ border-color:var(--neon-green); transform:translateY(-4px); }
ul.products li.product img{ width:100%; aspect-ratio:1/1; object-fit:cover; }
ul.products li.product .woocommerce-loop-product__title{ font-size:.92rem; font-weight:600; padding:1rem 1rem 0; color:#fff; }
ul.products li.product .price{ font-size:.92rem; font-weight:700; padding:.4rem 1rem 1rem; margin:0; display:block; color:var(--neon-green); }
ul.products li.product .price del{ color:#777; font-weight:400; font-size:.82rem; margin-right:.4rem; }
ul.products li.product .button{
  display:block; margin:0 1rem 1rem; text-align:center; background:rgba(0,224,158,.12); border:1px solid var(--neon-green);
  color:#fff; border-radius:40px; padding:.6rem 1rem; font-size:.82rem; font-weight:700; transition:var(--transition);
}
ul.products li.product .button:hover{ background:var(--neon-green); color:#000; }
ul.products li.product .added_to_cart{ display:block; margin:0 1rem 1rem; text-align:center; font-size:.78rem; color:var(--neon-green); }

/* ---------- Encabezado de tienda / orden ---------- */
.woocommerce-products-header__title{ font-size:2rem; font-weight:800; margin-bottom:.5rem; }
.woocommerce-result-count{ font-size:.85rem; color:var(--muted); }
.woocommerce-ordering select{
  background:#111217; border:1px solid #2a2a35; color:#fff; border-radius:10px; padding:.6rem .9rem; font-family:inherit; font-size:.85rem;
}
nav.woocommerce-pagination ul{ display:flex; gap:.5rem; list-style:none; padding:0; justify-content:center; margin-top:2rem; }
nav.woocommerce-pagination ul li{ margin:0; }
nav.woocommerce-pagination ul li a, nav.woocommerce-pagination ul li span{
  display:flex; align-items:center; justify-content:center; width:38px; height:38px;
  border-radius:8px; border:1px solid var(--border-soft); color:var(--muted); font-size:.85rem;
}
nav.woocommerce-pagination ul li span.current{ background:var(--neon-green); color:#000; font-weight:700; border-color:var(--neon-green); }

/* ---------- Producto individual ---------- */
.single-product div.product{
  display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:flex-start; margin-bottom:4rem;
}
.single-product div.product > *{ min-width:0; }
.single-product div.product > .woocommerce-tabs,
.single-product div.product > .related.products,
.single-product div.product > .upsells.products{ grid-column:1/-1; }
@media (max-width:900px){ .single-product div.product{ grid-template-columns:1fr; gap:2rem; } }

.woocommerce-product-gallery{ position:relative; width:100%; }
.woocommerce-product-gallery__wrapper{ width:100%; border-radius:var(--radius-lg); overflow:hidden; background:var(--card-bg); border:1px solid var(--border-soft); }
.woocommerce-product-gallery__image img{ display:block; width:100% !important; height:auto !important; aspect-ratio:1/1; object-fit:cover; }
.flex-control-thumbs{ display:grid !important; grid-template-columns:repeat(4,1fr); gap:.7rem; margin-top:.9rem !important; padding:0; list-style:none; }
.flex-control-thumbs li img{ border-radius:10px; aspect-ratio:1/1; object-fit:cover; border:2px solid transparent; opacity:.6; transition:var(--transition); cursor:pointer; }
.flex-control-thumbs li img.flex-active, .flex-control-thumbs li img:hover{ opacity:1; border-color:var(--neon-green); }

.product_title{ font-size:2rem; font-weight:800; margin:0 0 .7rem; line-height:1.2; }
.woocommerce-product-rating{ display:flex; align-items:center; gap:.6rem; margin-bottom:1.2rem; }
.star-rating{ color:rgba(255,255,255,.15); font-size:.85rem; }
.star-rating span{ color:#fbbf24; }
.woocommerce-review-link{ font-size:.78rem; color:var(--muted-2); }
p.price, .price{ font-size:1.8rem; font-weight:800; color:var(--neon-green); margin-bottom:1.6rem; display:block; }
p.price del{ color:#777; font-weight:400; font-size:1.1rem; margin-right:.5rem; }
p.price ins{ text-decoration:none; }
.woocommerce-product-details__short-description{ color:var(--muted); font-size:.95rem; line-height:1.7; margin-bottom:1.6rem; }
.woocommerce-product-details__short-description ul{ list-style:none; padding:0; }
.woocommerce-product-details__short-description ul li{ position:relative; padding-left:1.5rem; margin:.5rem 0; }
.woocommerce-product-details__short-description ul li::before{ content:'✓'; position:absolute; left:0; color:var(--neon-green); font-weight:800; }

table.variations{ width:100%; border:none; margin-bottom:1.2rem; }
table.variations tbody, table.variations tr, table.variations td, table.variations th{ display:block; border:none; padding:0; }
table.variations tr{ margin-bottom:1rem; }
table.variations label{ display:block; font-size:.85rem; font-weight:600; margin-bottom:.5rem; }
table.variations select{
  width:100%; background:#111217; border:1px solid #2a2a35; color:#fff; border-radius:10px; padding:.75rem 1rem; font-size:.85rem; font-family:inherit;
}
.reset_variations{ display:inline-block; margin-top:.5rem; font-size:.75rem; color:var(--muted-2); }
.woocommerce-variation-price .price{ font-size:1.3rem; margin-bottom:.5rem; }
.woocommerce-variation-availability{ font-size:.8rem; color:var(--muted); margin-bottom:1rem; }

.quantity{ display:inline-flex; margin-right:.8rem; }
.quantity input.qty{
  width:64px; height:48px; background:transparent; border:1px solid #2a2a35; border-radius:10px;
  color:#fff; text-align:center; font-size:.9rem; font-family:inherit;
}
.single_add_to_cart_button{
  background:rgba(0,224,158,.14) !important; border:1px solid var(--neon-green) !important; color:#fff !important;
  font-weight:700 !important; font-size:.92rem !important; padding:.9rem 2rem !important; border-radius:50px !important;
  cursor:pointer; transition:var(--transition); height:48px;
}
.single_add_to_cart_button:hover{ background:var(--neon-green) !important; color:#000 !important; box-shadow:0 0 18px rgba(0,224,158,.5); }
.single_add_to_cart_button.disabled{ background:rgba(255,255,255,.06) !important; border-color:var(--border-soft) !important; color:var(--muted-2) !important; cursor:not-allowed; }
p.stock{ font-size:.78rem; color:var(--muted); margin:.9rem 0 0; }
p.stock.out-of-stock{ color:#ff6b6b; }
.product_meta{ font-size:.78rem; color:var(--muted-2); margin-top:1.4rem; padding-top:1.4rem; border-top:1px solid var(--border-soft); }
.product_meta a{ color:var(--muted); }
.product_meta a:hover{ color:var(--neon-green); }
.product_meta > span{ display:block; margin-bottom:.3rem; }

/* Acordeón "Cómo seguimos después de la compra" */
.zyla-accordion{ border:1px solid var(--border-soft); border-radius:var(--radius); overflow:hidden; margin-top:1.6rem; }
.zyla-accordion-item{ border-bottom:1px solid var(--border-soft); }
.zyla-accordion-item:last-child{ border-bottom:none; }
.zyla-accordion-btn{ width:100%; display:flex; align-items:center; justify-content:space-between; background:transparent; border:none; color:#fff; font-family:inherit; font-size:.88rem; font-weight:600; padding:1rem; cursor:pointer; text-align:left; }
.zyla-accordion-btn:hover{ background:rgba(255,255,255,.02); }
.zyla-accordion-btn i{ color:var(--muted-2); transition:transform .2s; }
.zyla-accordion-panel{ padding:0 1rem 1rem; font-size:.85rem; color:var(--muted); line-height:1.7; }
.zyla-accordion-panel.hidden{ display:none; }

/* Tabs nativas (descripción / valoraciones) */
.woocommerce-tabs{ margin-top:3.5rem; }
.woocommerce-tabs ul.tabs{ display:flex; gap:2rem; list-style:none; padding:0; margin:0 0 2rem; border-bottom:1px solid var(--border-soft); flex-wrap:wrap; }
.woocommerce-tabs ul.tabs li{ margin:0; padding:0; }
.woocommerce-tabs ul.tabs li a{ display:inline-block; padding-bottom:1rem; font-size:.88rem; font-weight:600; color:var(--muted); border-bottom:2px solid transparent; }
.woocommerce-tabs ul.tabs li.active a{ color:var(--neon-green); border-bottom-color:var(--neon-green); }
.woocommerce-tabs .panel{ color:var(--muted); font-size:.92rem; line-height:1.8; }
.woocommerce-tabs .panel h2{ font-size:1.15rem; font-weight:700; color:#fff; margin-bottom:1rem; }

/* Reseñas */
#reviews .comment{ background:var(--card-bg); border:1px solid var(--border-soft); border-radius:var(--radius); padding:1.2rem; margin-bottom:1rem; }
#reviews .star-rating{ float:none; margin-bottom:.5rem; }
#reviews #respond input, #reviews #respond textarea{ background:#111217; border:1px solid #2a2a35; border-radius:10px; color:#fff; padding:.7rem .9rem; font-family:inherit; }
#reviews #respond #submit{ background:rgba(0,224,158,.14); border:1px solid var(--neon-green); color:#fff; font-weight:700; padding:.8rem 1.8rem; border-radius:50px; cursor:pointer; }
#reviews #respond #submit:hover{ background:var(--neon-green); color:#000; }

/* ---------- Carrito ---------- */
.woocommerce-cart table.cart, .woocommerce-checkout table.shop_table{
  width:100%; border-collapse:collapse; margin-bottom:1.6rem;
}
.woocommerce-cart table.cart th, .woocommerce-cart table.cart td,
.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td{
  border-bottom:1px solid var(--border-soft); padding:1rem .5rem; font-size:.88rem; color:#ddd; text-align:left;
}
.woocommerce-cart table.cart img{ width:64px; border-radius:10px; }
.woocommerce-cart .product-remove a{ color:#ff6b6b; font-size:1.1rem; }
.woocommerce-cart td.actions .button, .cart-collaterals .checkout-button{
  background:rgba(0,224,158,.14); border:1px solid var(--neon-green); color:#fff; font-weight:700;
  padding:.8rem 1.6rem; border-radius:50px; transition:var(--transition);
}
.woocommerce-cart td.actions .button:hover, .cart-collaterals .checkout-button:hover{ background:var(--neon-green); color:#000; }
.cart-collaterals .cart_totals{ background:var(--card-bg); border:1px solid var(--border-soft); border-radius:var(--radius-lg); padding:1.6rem; max-width:420px; margin-left:auto; }
.cart_totals h2{ font-size:1.2rem; font-weight:800; margin-bottom:1rem; }
.cart_totals table{ width:100%; }
.cart_totals table td, .cart_totals table th{ padding:.7rem 0; border-bottom:1px solid var(--border-soft); font-size:.88rem; }
.cart_totals .order-total .amount{ color:var(--neon-green); font-weight:800; font-size:1.15rem; }

/* ---------- Checkout ---------- */
.woocommerce-checkout input[type="text"], .woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"], .woocommerce-checkout input[type="password"],
.woocommerce-checkout textarea, .woocommerce-checkout select{
  background:#111217; border:1px solid #2a2a35; color:#fff; border-radius:10px; padding:.8rem 1rem; font-family:inherit; width:100%;
}
.woocommerce-checkout label{ font-size:.85rem; color:#ccc; margin-bottom:.35rem; }
.woocommerce-checkout #order_review{ background:var(--card-bg); border:1px solid var(--border-soft); border-radius:var(--radius-lg); padding:1.6rem; }
#place_order, .checkout-button{
  background:rgba(0,224,158,.14) !important; border:1px solid var(--neon-green) !important; color:#fff !important; font-weight:700 !important;
  padding:1rem 1.8rem !important; border-radius:50px !important; transition:var(--transition); width:100%;
}
#place_order:hover, .checkout-button:hover{ background:var(--neon-green) !important; color:#000 !important; }
.woocommerce-checkout .woocommerce-additional-fields{ margin-top:1.6rem; }

/* ---------- Mi cuenta ---------- */
.woocommerce-MyAccount-navigation ul{ list-style:none; padding:0; display:flex; flex-direction:column; gap:.5rem; }
.woocommerce-MyAccount-navigation a{ display:block; padding:.7rem 1rem; border-radius:10px; color:var(--muted); font-size:.88rem; }
.woocommerce-MyAccount-navigation a:hover, .woocommerce-MyAccount-navigation .is-active a{ background:rgba(0,224,158,.1); color:var(--neon-green); }
.woocommerce-MyAccount-content{ background:var(--card-bg); border:1px solid var(--border-soft); border-radius:var(--radius-lg); padding:1.8rem; margin-top:1.5rem; }

/* ---------- Notices ---------- */
.woocommerce-message, .woocommerce-error, .woocommerce-info{
  list-style:none; background:var(--card-bg); border:1px solid var(--border-soft);
  border-radius:12px; padding:1rem 1.4rem; font-size:.88rem; margin-bottom:1.6rem; color:#fff;
  display:flex; align-items:center; gap:.6rem; flex-wrap:wrap;
}
.woocommerce-message{ border-color:rgba(0,224,158,.4); }
.woocommerce-message .button, .woocommerce-error .button{
  background:rgba(0,224,158,.14); border:1px solid var(--neon-green); color:#fff; padding:.5rem 1.1rem; border-radius:40px; font-size:.8rem; font-weight:700;
}
.woocommerce-error{ border-color:rgba(255,107,107,.4); color:#ff8f8f; }
.woocommerce-info{ border-color:rgba(0,168,255,.4); }

/* ---------- Toast (agregado al carrito) ---------- */
.zyla-toast{
  position:fixed; bottom:24px; right:24px; z-index:1300; background:rgba(11,11,15,.96); backdrop-filter:blur(16px);
  border:1px solid var(--border-soft); border-radius:12px; padding:.9rem 1.4rem; display:flex; align-items:center; gap:.7rem;
  transform:translateY(140%); transition:transform .3s cubic-bezier(.175,.885,.32,1.275); box-shadow:0 20px 40px rgba(0,0,0,.5); font-size:.85rem;
}
.zyla-toast.show{ transform:translateY(0); }

/* ---------- Responsive WooCommerce ---------- */
@media (max-width:900px){
  .zyla-mini-cart{ width:300px; }
}
@media (max-width:680px){
  .single-product div.product{ gap:1.6rem; }
  .product_title{ font-size:1.5rem; }
  p.price, .price{ font-size:1.4rem; }
  .cart_totals{ margin-left:0; max-width:100%; }
  .woocommerce-cart table.cart{ display:block; overflow-x:auto; }
}

/* =========================================================
   RESPONSIVE (general)
========================================================= */
@media (max-width:1024px){
  .footer-grid{ grid-template-columns:1fr 1fr 1fr; }
  .footer-brand{ grid-column:1/-1; }
  .contact-wrap{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  .zyla-nav{ display:none; }
  .zyla-burger{ display:inline-flex; }
}
@media (max-width:680px){
  .zyla-topbar .tb-right .tb-currency{ display:none; }
  .hero{ min-height:64vh; padding:2.4rem 1.2rem; }
  .section{ margin:3.6rem auto; }
  .form-row{ flex-direction:column; gap:0; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .footer-top{ padding:3.4rem 0 2.2rem; }
  .footer-bottom .container{ flex-direction:column; text-align:center; }
}
@media (max-width:480px){
  .footer-grid{ grid-template-columns:1fr; }
  .badge-group{ gap:.6rem; }
  .badge{ font-size:.72rem; padding:.32rem .85rem; }
}