/*
Theme Name: esloultimo
Theme URI: https://www.esloultimo.com/
Description: Tema hijo de Storefront para esloultimo.com — tienda de afiliacion Amazon. Design system Stitch: Hanken Grotesk + naranja #FF6600, minimalismo con bordes 1px.
Author: esloultimo
Template: storefront
Version: 2.0.0
*/

:root{
  --eslo-orange:#ff6600;
  --eslo-orange-dark:#a33e00;
  --eslo-ink:#1a1c1c;
  --eslo-muted:#5f5e5e;
  --eslo-tertiary:#8a8a8a;
  --eslo-bg:#ffffff;
  --eslo-bg-alt:#f3f3f3;
  --eslo-bg-soft:#f9f9f9;
  --eslo-line:#e5e5e5;
  --eslo-r-sm:4px;
  --eslo-r:8px;
  --eslo-r-lg:12px;
  --eslo-max:1280px;
  --eslo-shadow-hover:0 4px 20px rgba(0,0,0,.06);
}

/* ============ BASE ============ */
body,
.woocommerce, .woocommerce-page, button, input, select, textarea,
h1,h2,h3,h4,h5,h6, .site-title, .storefront-primary-navigation{
  font-family:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
}
body{ color:var(--eslo-ink); background:var(--eslo-bg); font-size:16px; line-height:1.55; }
a{ color:var(--eslo-orange-dark); }
a:hover{ color:var(--eslo-orange); }
h1,h2,h3,h4{ color:var(--eslo-ink); letter-spacing:-.01em; }
.eslo-wrap{ max-width:var(--eslo-max); margin:0 auto; padding:0 clamp(16px,5vw,64px); }
.material-symbols-outlined{ font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24; vertical-align:middle; }

/* ============ HEADER ============ */
.site-header{ background:#fff !important; border-bottom:1px solid var(--eslo-line); box-shadow:none; position:sticky; top:0; z-index:200; padding:0; }
.site-header .col-full{ max-width:var(--eslo-max); }
.site-branding{ margin:0; padding:14px 0; }
.site-header .site-title a, .site-header .site-title a:hover{ color:var(--eslo-orange-dark) !important; font-weight:800; font-size:24px; letter-spacing:-.02em; }
.site-header .site-description{ display:none; }
.storefront-primary-navigation, .main-navigation, .secondary-navigation{ background:#fff !important; }
.main-navigation ul.menu, .main-navigation ul{ background:#fff; }
.main-navigation ul li a{ color:var(--eslo-ink) !important; font-weight:600; font-size:14px; padding:.6em 1em; }
.main-navigation ul li a:hover, .main-navigation ul li.current-menu-item > a{ color:var(--eslo-orange) !important; }
.main-navigation ul li.current-menu-item > a{ box-shadow:inset 0 -2px 0 var(--eslo-orange); }
.site-header a, .site-header-cart .amount, .site-header .count{ color:var(--eslo-ink) !important; }
.site-header .widget_product_search input[type=search], .site-header input[type=search]{
  border-radius:var(--eslo-r-sm) !important; border:1px solid var(--eslo-line) !important; background:#fff; font-size:14px; padding:.55em .9em; }
.site-header .widget_product_search input[type=search]:focus{ box-shadow:0 0 0 2px rgba(255,102,0,.25); outline:none; }
.site-search .widget_product_search button{ display:none; }
.site-header-cart .cart-contents:hover{ background:var(--eslo-bg-alt); }
.storefront-handheld-footer-bar{ background:#fff; border-top:1px solid var(--eslo-line); }
.storefront-handheld-footer-bar a{ color:var(--eslo-ink) !important; }

/* ============ BOTONES ============ */
.button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt, .woocommerce button.button.alt,
.eslo-btn{
  background:var(--eslo-orange) !important; color:#fff !important; border:none !important;
  border-radius:var(--eslo-r-sm) !important; font-weight:700 !important; font-size:14px !important;
  letter-spacing:.01em; padding:.7em 1.4em !important; box-shadow:none !important; transition:.15s background,.15s transform; text-shadow:none !important;
}
.button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .eslo-btn:hover{
  background:var(--eslo-orange-dark) !important; color:#fff !important; transform:translateY(-1px); }
.eslo-btn--ghost{ background:#fff !important; color:var(--eslo-ink) !important; border:1px solid var(--eslo-line) !important; }
.eslo-btn--ghost:hover{ border-color:var(--eslo-ink) !important; background:#fff !important; }

/* ============ HERO BANNER ============ */
.eslo-hero-band{ padding:24px 0 0; }
.eslo-hero{
  position:relative; overflow:hidden; border-radius:var(--eslo-r-lg);
  background:linear-gradient(100deg,#0e3a3d 0%, #14484c 38%, #c24a12 78%, #ff6600 100%);
  min-height:340px; display:flex; align-items:center;
}
.eslo-hero__inner{ position:relative; z-index:2; padding:clamp(28px,5vw,56px); max-width:620px; }
.eslo-hero h1{ color:#fff; font-size:clamp(28px,4.4vw,46px); line-height:1.08; font-weight:800; letter-spacing:-.02em; margin:0 0 22px; }
.eslo-hero p{ color:rgba(255,255,255,.9); font-size:18px; margin:0 0 26px; max-width:480px; }
.eslo-hero .eslo-btn{ display:inline-flex; align-items:center; gap:8px; font-size:15px !important; padding:.85em 1.8em !important; border-radius:999px !important; }
.eslo-hero__art{ position:absolute; right:-20px; bottom:-30px; z-index:1; color:rgba(255,255,255,.14); font-size:340px; line-height:1; pointer-events:none; }
.eslo-hero__badge{ position:absolute; top:20px; right:26px; z-index:2; color:#ffd; font-weight:800; font-size:26px; letter-spacing:.04em; opacity:.85; }

/* ============ SECCIONES ============ */
.eslo-section{ padding:56px 0; }
.eslo-section__head{ text-align:center; margin-bottom:34px; }
.eslo-section__head h2{ font-size:clamp(20px,2.6vw,28px); font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin:0; }
.eslo-section__head p{ color:var(--eslo-muted); margin:8px 0 0; }
.eslo-ghostlink{ color:var(--eslo-orange); font-weight:700; font-size:14px; text-decoration:none; }
.eslo-ghostlink:hover{ color:var(--eslo-orange-dark); }

/* ============ CATEGORIAS ============ */
.eslo-cats{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:16px; }
.eslo-cat{
  display:flex; flex-direction:column; align-items:center; gap:10px; padding:26px 14px;
  background:var(--eslo-bg-soft); border:1px solid var(--eslo-line); border-radius:var(--eslo-r);
  text-decoration:none; color:var(--eslo-ink); transition:.16s border-color,.16s box-shadow,.16s transform;
}
.eslo-cat:hover{ border-color:var(--eslo-orange); box-shadow:var(--eslo-shadow-hover); transform:translateY(-2px); color:var(--eslo-ink); }
.eslo-cat .material-symbols-outlined{ font-size:34px; color:var(--eslo-ink); }
.eslo-cat:hover .material-symbols-outlined{ color:var(--eslo-orange); }
.eslo-cat__name{ font-size:14px; font-weight:600; text-align:center; }

/* ============ REJILLA DE PRODUCTOS (Featured + shop + related) ============ */
.eslo-products, .woocommerce ul.products{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:20px; margin:0 !important; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product, .eslo-card{
  width:auto !important; margin:0 !important; float:none !important; background:#fff; border:1px solid var(--eslo-line);
  border-radius:var(--eslo-r); padding:16px; text-align:left; box-shadow:none; transition:.16s box-shadow,.16s transform; position:relative;
}
.woocommerce ul.products li.product:hover, .eslo-card:hover{ box-shadow:var(--eslo-shadow-hover); transform:translateY(-2px); }
.woocommerce ul.products li.product a img, .eslo-card img{ border-radius:var(--eslo-r-sm); margin-bottom:12px; background:var(--eslo-bg-alt); }
.woocommerce ul.products li.product .woocommerce-loop-product__title, .eslo-card__title{
  font-size:15px !important; font-weight:700 !important; color:var(--eslo-ink); padding:0 0 6px !important; line-height:1.35; }
.woocommerce ul.products li.product .price, .eslo-card__price{ color:var(--eslo-orange-dark) !important; font-weight:800 !important; font-size:18px !important; }
.woocommerce ul.products li.product .price del{ color:var(--eslo-tertiary) !important; font-weight:400 !important; font-size:14px !important; }
.woocommerce ul.products li.product .button{ display:block; width:100%; text-align:center; margin-top:12px !important; }
.woocommerce ul.products li.product .eslo-cat-label, .eslo-card__cat{ font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--eslo-tertiary); }

/* Badges */
.woocommerce span.onsale{ background:var(--eslo-orange) !important; color:#fff !important; border-radius:var(--eslo-r-sm) !important; font-weight:700; font-size:12px; min-height:auto; min-width:auto; line-height:1; padding:6px 10px; top:12px; left:12px; right:auto; margin:0; }

/* ============ NEWSLETTER ============ */
.eslo-news{ background:linear-gradient(90deg,var(--eslo-orange) 0%, var(--eslo-orange-dark) 100%); border-radius:var(--eslo-r-lg); padding:clamp(26px,4vw,44px); text-align:center; color:#fff; }
.eslo-news h2{ color:#fff; font-size:clamp(20px,2.6vw,26px); font-weight:800; margin:0 0 8px; }
.eslo-news p{ color:rgba(255,255,255,.92); margin:0 0 22px; }
.eslo-news form{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.eslo-news input[type=email]{ border:none; border-radius:999px; padding:.8em 1.3em; font-size:15px; width:min(340px,80vw); }
.eslo-news button{ background:#fff !important; color:var(--eslo-orange-dark) !important; border-radius:999px !important; font-weight:800 !important; padding:.8em 1.6em !important; }
.eslo-news button:hover{ background:var(--eslo-ink) !important; color:#fff !important; }

/* ============ SINGLE PRODUCT (ficha) ============ */
.single-product .site-content{ padding-top:0; }
.single-product div.product .product_title{ font-size:clamp(26px,3.4vw,40px); font-weight:700; letter-spacing:-.02em; margin:0 0 14px; }
.single-product div.product p.price, .single-product div.product span.price{ color:var(--eslo-orange-dark) !important; font-weight:800 !important; font-size:26px !important; }
.single-product div.product p.price del{ color:var(--eslo-tertiary) !important; font-size:16px !important; font-weight:400 !important; }
.single-product div.product div.images{ }
.single-product div.product div.images img{ border-radius:var(--eslo-r); background:var(--eslo-bg-alt); }
.single-product div.product div.images .flex-control-thumbs li img{ border-radius:var(--eslo-r-sm); border:1px solid var(--eslo-line); }
.single-product .woocommerce-tabs ul.tabs{ padding:0; }
.single-product .woocommerce-tabs ul.tabs li{ background:transparent; border:none; border-bottom:2px solid transparent; border-radius:0; }
.single-product .woocommerce-tabs ul.tabs li.active{ border-bottom-color:var(--eslo-orange); background:transparent; }
.single-product .woocommerce-tabs ul.tabs li a{ color:var(--eslo-muted); font-weight:700; }
.single-product .woocommerce-tabs ul.tabs li.active a{ color:var(--eslo-orange); }
.woocommerce .woocommerce-breadcrumb{ color:var(--eslo-tertiary); font-size:13px; }
.woocommerce .woocommerce-breadcrumb a{ color:var(--eslo-muted); }
.single_add_to_cart_button.button{ padding:.9em 2em !important; font-size:15px !important; }

/* estado agotado */
.eslo-agotado{ display:inline-block; background:#fdecec; color:#b42318; border:1px solid #f6c9c6; padding:11px 18px; border-radius:var(--eslo-r); font-size:15px; font-weight:600; margin:6px 0 14px; }
.woocommerce span.button.eslo-agotado-btn, .eslo-agotado-btn{ background:#eceef2 !important; color:#8a91a1 !important; box-shadow:none !important; cursor:not-allowed; pointer-events:none; }

/* productos similares */
.related.products > h2, .related.products > h3{ font-size:clamp(20px,2.6vw,26px); font-weight:800; letter-spacing:-.01em; margin-bottom:22px; }
.related.products{ border-top:1px solid var(--eslo-line); margin-top:44px; padding-top:38px; }

/* ============ SIN SIDEBAR + FOOTER ============ */
#secondary{ display:none !important; }
.content-area{ width:100% !important; float:none !important; margin:0 auto !important; }
.woocommerce-page #primary, .page #primary, .blog #primary, .archive #primary{ width:100% !important; float:none !important; }
.site-footer{ background:var(--eslo-bg-alt) !important; color:var(--eslo-muted); border-top:1px solid var(--eslo-line); padding:48px 0 24px; }
.site-footer .col-full{ max-width:var(--eslo-max); }
.site-footer a{ color:var(--eslo-muted); }
.site-footer a:hover{ color:var(--eslo-orange); }
.site-info{ color:var(--eslo-tertiary); }

/* portada: quitar titulo, ancho completo */
.home .storefront-breadcrumb, .home .entry-header, .home.page .entry-title, .eslo-home .entry-header{ display:none; }
.eslo-home #primary, .eslo-home #content > .col-full{ max-width:100%; padding:0; }
.eslo-home .site-content{ padding-top:0; }

/* ============ RESPONSIVE ============ */
@media(max-width:768px){
  .eslo-hero{ min-height:280px; }
  .eslo-hero__art{ font-size:220px; right:-40px; }
  .eslo-section{ padding:44px 0; }
  .site-header .site-title a{ font-size:20px; }
}
@media(max-width:480px){
  .eslo-cats{ grid-template-columns:repeat(2,1fr); }
  .eslo-products, .woocommerce ul.products{ grid-template-columns:repeat(2,1fr) !important; gap:12px; }
  .woocommerce ul.products li.product{ padding:10px; }
}