/* =========================================================================
   Impresiones3DEdosat — estilos de tienda (tema hijo X-T9)
   Identidad boutique de coleccionables aplicada sobre WooCommerce.
   ========================================================================= */
:root{
  --i3d-bg:#F2F0FA; --i3d-surface:#fff; --i3d-ink:#1C1830; --i3d-primary:#6C4CE0;
  --i3d-primary-700:#5638c4; --i3d-accent:#FF4D6D; --i3d-teal:#16C2A3; --i3d-sun:#FFC02E;
  --i3d-muted:#7D7693; --i3d-line:#E4DFF3; --i3d-bg2:#ECE8FA; --i3d-navy:#1B2A4A;
  --i3d-logo-blue:#2E9BE0;
  --i3d-r-md:16px; --i3d-r-lg:22px; --i3d-pill:999px;
  --i3d-sh1:0 2px 10px rgba(28,24,48,.06);
  --i3d-sh2:0 10px 30px rgba(28,24,48,.10);
  --i3d-sh3:0 22px 50px rgba(108,76,224,.18);
  --i3d-font-display:"Bricolage Grotesque",system-ui,sans-serif;
  --i3d-font-body:"Inter",system-ui,-apple-system,sans-serif;
}

body{ background:var(--i3d-bg); color:var(--i3d-ink); font-family:var(--i3d-font-body); }
h1,h2,h3,h4,.wp-block-heading{ font-family:var(--i3d-font-display); font-weight:800; letter-spacing:-.01em; }

/* ---- Botones generales y de WooCommerce ---- */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce #respond input#submit,
.wp-block-button__link, .wc-block-components-button{
  background:var(--i3d-primary)!important; color:#fff!important;
  border-radius:var(--i3d-pill)!important; font-family:var(--i3d-font-display);
  font-weight:700; border:0!important; padding:.7em 1.4em!important;
  box-shadow:0 8px 20px rgba(108,76,224,.28); transition:transform .18s,box-shadow .18s,background .18s;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce a.button.alt:hover,
.wp-block-button__link:hover, .wc-block-components-button:hover{
  background:var(--i3d-primary-700)!important; transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(108,76,224,.4);
}

/* =========================================================================
   Rejilla de catálogo + tarjeta con PEDESTAL
   ========================================================================= */
.woocommerce ul.products{ gap:26px!important; }
.woocommerce ul.products li.product{
  background:var(--i3d-surface); border:1px solid var(--i3d-line); border-radius:var(--i3d-r-lg);
  box-shadow:var(--i3d-sh1); padding:0!important; overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease; position:relative;
}
.woocommerce ul.products li.product:hover{ transform:translateY(-7px); box-shadow:var(--i3d-sh3); }

/* imagen sobre pedestal con foco radial */
.woocommerce ul.products li.product a img{
  margin:0!important; position:relative; z-index:1;
  filter:drop-shadow(0 14px 18px rgba(28,24,48,.22)); transition:transform .3s ease;
}
.woocommerce ul.products li.product > a:first-of-type{
  display:block; position:relative; padding:22px 22px 8px;
  background:radial-gradient(58% 52% at 50% 42%, rgba(46,155,224,.28), transparent 70%);
}
.woocommerce ul.products li.product:hover a img{ transform:scale(1.05) translateY(-2px); }

.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--i3d-font-display); font-weight:700; font-size:1.05rem!important;
  color:var(--i3d-ink); padding:6px 18px 2px!important;
}
.woocommerce ul.products li.product .price{
  color:var(--i3d-ink)!important; font-family:var(--i3d-font-display); font-weight:800; font-size:1.2rem!important;
  padding:0 18px!important; display:block;
}
.woocommerce ul.products li.product .price del{ color:var(--i3d-muted); font-weight:500; font-size:.85em; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; }
.woocommerce ul.products li.product .button{ margin:12px 18px 18px!important; display:block; text-align:center; }

/* =========================================================================
   HERO de la home (logo grande + titular con degradado)
   ========================================================================= */
.i3d-hero{ display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; margin:8px 0 10px; }
@media (max-width:900px){ .i3d-hero{ grid-template-columns:1fr; text-align:center; } }
.i3d-eyebrow{ font-family:var(--i3d-font-display); font-weight:700; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; color:var(--i3d-primary); }
.i3d-hero-title{ font-family:var(--i3d-font-display); font-weight:800; line-height:1.03; letter-spacing:-.02em; font-size:clamp(2.4rem,6vw,4rem); margin:.18em 0 .25em; color:var(--i3d-ink); }
.i3d-grad{ background:linear-gradient(100deg, var(--i3d-primary), var(--i3d-accent) 62%, var(--i3d-sun)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.i3d-hero-lead{ font-size:1.15rem; color:var(--i3d-muted); max-width:48ch; margin:0 auto 26px; }
@media (min-width:901px){ .i3d-hero-lead{ margin-left:0; } }
.i3d-hero-cta{ display:flex; gap:12px; flex-wrap:wrap; }
@media (max-width:900px){ .i3d-hero-cta{ justify-content:center; } }
.i3d-btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5em; font-family:var(--i3d-font-display); font-weight:700; font-size:1.02rem; padding:14px 26px; border-radius:var(--i3d-pill); text-decoration:none; transition:transform .18s,box-shadow .18s,background .18s; }
.i3d-btn-primary{ background:var(--i3d-primary); color:#fff!important; box-shadow:0 8px 20px rgba(108,76,224,.32); }
.i3d-btn-primary:hover{ background:var(--i3d-primary-700); transform:translateY(-2px); box-shadow:0 12px 26px rgba(108,76,224,.42); }
.i3d-btn-ghost{ background:#fff; color:var(--i3d-ink)!important; border:2px solid var(--i3d-line); }
.i3d-btn-ghost:hover{ border-color:var(--i3d-primary); color:var(--i3d-primary)!important; transform:translateY(-2px); }
.i3d-hero-badges{ display:flex; gap:18px; flex-wrap:wrap; margin-top:24px; }
@media (max-width:900px){ .i3d-hero-badges{ justify-content:center; } }
.i3d-hb{ display:inline-flex; align-items:center; gap:9px; font-size:.9rem; font-weight:600; color:var(--i3d-muted); }
.i3d-hb .d{ width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:#fff; box-shadow:var(--i3d-sh1); }
.i3d-hero-visual{ display:grid; place-items:center; position:relative; }
.i3d-hero-logo{ width:min(420px,82%); aspect-ratio:1; border-radius:50%; object-fit:cover; background:#fff; box-shadow:var(--i3d-sh3),0 0 0 10px rgba(255,255,255,.6); animation:i3dfloat 6s ease-in-out infinite; }
@keyframes i3dfloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }

/* tarjetas de CATEGORÍA (home) — limpias, sin placeholder */
.woocommerce ul.products li.product-category{ text-align:center; }
.woocommerce ul.products li.product-category > a{
  display:block!important; padding:30px 16px!important;
  background:radial-gradient(75% 90% at 50% 0%, rgba(108,76,224,.14), transparent 72%)!important;
}
.woocommerce ul.products li.product-category img{ display:none!important; }
.woocommerce ul.products li.product-category h2.woocommerce-loop-category__title{
  font-family:var(--i3d-font-display); font-weight:800; font-size:1.05rem!important;
  color:var(--i3d-ink); padding:0!important; margin:0;
}
.woocommerce ul.products li.product-category .count{
  display:inline-block; margin-top:8px; background:var(--i3d-bg2); color:var(--i3d-primary);
  border-radius:var(--i3d-pill); padding:2px 12px; font-size:.8rem; font-weight:700;
}

/* badge de oferta -> cinta coral */
.woocommerce span.onsale{
  background:var(--i3d-accent)!important; color:#fff!important; border-radius:var(--i3d-pill)!important;
  font-family:var(--i3d-font-display); font-weight:700; min-height:auto; min-width:auto;
  padding:5px 12px; top:12px; left:12px; right:auto; margin:0; line-height:1.2;
}

/* =========================================================================
   Ficha de producto
   ========================================================================= */
.woocommerce div.product div.images img{ border-radius:var(--i3d-r-lg); }
.woocommerce div.product .woocommerce-product-gallery{
  background:radial-gradient(60% 55% at 50% 42%, rgba(46,155,224,.20), transparent 70%);
  border-radius:var(--i3d-r-lg); padding:20px;
}
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--i3d-primary)!important; font-family:var(--i3d-font-display); font-weight:800; font-size:2rem!important;
}
.woocommerce div.product .product_title{ font-size:clamp(1.8rem,4vw,2.6rem); }

/* =========================================================================
   Botón "Pedir por WhatsApp"
   ========================================================================= */
.i3d-wa-btn{
  display:inline-flex!important; align-items:center; gap:.5em; margin-top:12px!important;
  background:#25D366!important; color:#07331c!important; border-radius:var(--i3d-pill)!important;
  font-family:var(--i3d-font-display); font-weight:700; padding:.7em 1.4em!important;
  text-decoration:none; box-shadow:0 8px 20px rgba(37,211,102,.32);
  transition:transform .18s,box-shadow .18s;
}
.i3d-wa-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(37,211,102,.42); color:#07331c!important; }

/* botón flotante */
.i3d-wa-float{
  position:fixed; right:20px; bottom:20px; z-index:9999;
  width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff;
  display:grid; place-items:center; box-shadow:0 10px 26px rgba(37,211,102,.45);
  transition:transform .18s; text-decoration:none;
}
.i3d-wa-float:hover{ transform:scale(1.08); color:#fff; }
.i3d-wa-float svg{ width:30px; height:30px; }

/* =========================================================================
   Cabecera / logo redondo + varios
   ========================================================================= */
.wp-block-site-logo img, .custom-logo{ border-radius:50%; box-shadow:var(--i3d-sh1); background:#fff; }
.woocommerce .woocommerce-message, .woocommerce-info{ border-top-color:var(--i3d-primary); }
a{ color:var(--i3d-primary); }

/* =========================================================================
   Visor 3D — Figuras personalizadas (shortcode [i3d_viewer])
   ========================================================================= */
.i3d-custom{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; margin:10px 0; }
@media (max-width:860px){ .i3d-custom{ grid-template-columns:1fr; } }
.i3d-muted{ color:var(--i3d-muted); }
.i3d-note{ font-size:.86rem; color:var(--i3d-muted); }
.steps{ display:grid; gap:14px; margin:6px 0 18px; }
.step{ display:flex; gap:14px; align-items:flex-start; }
.step .n{ flex:none; width:34px; height:34px; border-radius:50%; background:var(--i3d-primary); color:#fff; font-family:var(--i3d-font-display); font-weight:800; display:grid; place-items:center; }
.step .st{ font-weight:700; font-family:var(--i3d-font-display); }
.step .sd{ font-size:.9rem; color:rgba(28,24,48,.7); }
.viewer-card{ background:var(--i3d-surface); border:1px solid var(--i3d-line); border-radius:var(--i3d-r-lg); box-shadow:var(--i3d-sh2); overflow:hidden; }
.dropzone{ border:2.5px dashed var(--i3d-line); border-radius:var(--i3d-r-md); margin:18px; padding:30px 20px; text-align:center; transition:border-color .15s,background .15s; cursor:pointer; display:block; }
.dropzone:hover,.dropzone.dragover{ border-color:var(--i3d-primary); background:var(--i3d-bg2); }
.dropzone .dz-ico{ font-size:2.4rem; }
.dropzone .dz-t{ font-family:var(--i3d-font-display); font-weight:700; margin-top:6px; }
.dropzone .dz-s{ font-size:.85rem; color:var(--i3d-muted); }
.dropzone input[type=file]{ display:none; }
.viewer-stage{ position:relative; width:100%; aspect-ratio:4/3; background:radial-gradient(70% 70% at 50% 30%, #2a2540, #14101f); display:none; }
.viewer-stage.active{ display:block; }
.viewer-stage canvas{ display:block; width:100%!important; height:100%!important; }
.viewer-toolbar{ position:absolute; top:12px; right:12px; display:flex; gap:8px; z-index:2; }
.viewer-toolbar button{ width:40px; height:40px; border-radius:50%; border:0; background:rgba(255,255,255,.9); box-shadow:var(--i3d-sh1); display:grid; place-items:center; cursor:pointer; }
.viewer-hint{ position:absolute; bottom:12px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.85); font-size:.82rem; background:rgba(0,0,0,.35); padding:6px 14px; border-radius:var(--i3d-pill); z-index:2; }
.file-info{ margin:0 18px 18px; font-size:.88rem; color:rgba(28,24,48,.7); display:none; align-items:center; gap:10px; }
.file-info.show{ display:flex; }
.file-info .fname{ font-weight:700; color:var(--i3d-ink); }
.viewer-cta{ margin:0 18px 18px; }

/* Pie de página */
.i3d-footer a{ color:#cdd5e6; text-decoration:none; }
.i3d-footer a:hover{ color:#fff; }
.i3d-foot-list{ list-style:none!important; padding:0!important; margin:0; display:grid; gap:9px; font-size:.95rem; }
.i3d-footer .wp-block-site-title a{ color:#fff!important; font-family:var(--i3d-font-display); }

@media (prefers-reduced-motion: reduce){
  *{ animation:none!important; transition:none!important; }
}