:root{
    --metal-light:#d8d9db;
    --metal-mid:#9a9ea3;
    --metal-dark:#4a4d52;
    --charcoal:#1b1c1e;
    --rust:#4f6b3a;
    --accent:#c9a227;
    --cream:#f2efe9;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html,body{
    background:var(--charcoal);
    color:var(--cream);
    font-family:"Helvetica Neue",Arial,sans-serif;
    overflow-x:hidden;
  }
  header{
    position:fixed;
    top:0;left:0;right:0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px 6vw;
    z-index:50;
    background:linear-gradient(180deg, rgba(10,10,11,0.42) 0%, rgba(10,10,11,0) 100%);
  }
  header .logo{
    display:flex;
    align-items:center;
    gap:10px;
  }
  header .logo-img{
    height:80px;
    width:auto;
    display:block;
    border-radius:9px;
    box-shadow:0 8px 22px rgba(0,0,0,0.5);
  }
  header .logo-word{
    font-weight:800;
    letter-spacing:0.06em;
    text-transform:uppercase;
    font-size:13px;
    color:var(--cream);
    text-shadow:0 1px 4px rgba(0,0,0,0.6);
  }
  header .tag{
    font-size:11px;
    letter-spacing:0.15em;
    text-transform:uppercase;
    color:var(--metal-light);
    text-shadow:0 1px 4px rgba(0,0,0,0.6);
  }
  .header-right{
    display:flex;
    align-items:center;
    gap:14px;
  }
  .header-catalog-btn{
    display:flex;
    align-items:center;
    gap:6px;
    background:var(--accent);
    color:var(--charcoal);
    text-decoration:none;
    font-weight:800;
    font-size:11px;
    letter-spacing:0.03em;
    padding:9px 14px;
    border-radius:100px;
    box-shadow:0 6px 16px -4px rgba(201,162,39,0.5);
    transition:transform .2s ease, box-shadow .2s ease;
    white-space:nowrap;
    flex-shrink:0;
  }
  .header-catalog-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 20px -4px rgba(201,162,39,0.7);
  }
  .header-catalog-btn svg{ width:15px;height:15px; flex-shrink:0; }
  @media (max-width:520px){
    .header-catalog-btn{ padding:9px; border-radius:50%; }
    .header-catalog-label{ display:none; }
  }
  /* === Franja de envíos internacionales === */
  .intl-banner{
    background:linear-gradient(180deg, #202124 0%, var(--charcoal) 100%);
    padding:64px 6vw;
    text-align:center;
    border-top:1px solid rgba(201,162,39,0.25);
    border-bottom:1px solid rgba(242,239,233,0.08);
  }
  .intl-banner-inner{
    max-width:620px;
    margin:0 auto;
  }
  .intl-flags{
    font-size:1.8rem;
    margin-bottom:16px;
    letter-spacing:0.05em;
  }
  .intl-banner h2{
    font-size:1.7rem;
    font-weight:800;
    margin-bottom:12px;
    color:var(--cream);
    letter-spacing:-0.01em;
  }
  .intl-banner p{
    font-size:0.98rem;
    line-height:1.55;
    color:var(--metal-light);
    margin-bottom:28px;
  }
  .intl-banner p strong{
    color:var(--accent);
  }
  .intl-wa{
    display:inline-flex;
    align-items:center;
    gap:9px;
    background:#25D366;
    color:#071b0e;
    text-decoration:none;
    font-weight:800;
    border-radius:100px;
    padding:14px 24px;
    font-size:.95rem;
    box-shadow:0 12px 30px -10px rgba(37,211,102,.55);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .intl-wa:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -10px rgba(37,211,102,.7); }
  .intl-wa svg{ width:18px;height:18px; fill:currentColor; flex-shrink:0; }
  @media (max-width:600px){
    .intl-banner{ padding:48px 6vw; }
    .intl-flags{ font-size:1.5rem; }
    .intl-banner h2{ font-size:1.4rem; }
    .intl-banner p{ font-size:.9rem; }
  }
  .hero{
    height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:0 6vw;
    position:relative;
  }
  .hero-video{
    overflow:hidden;
  }
  .hero-media{
    position:absolute;
    inset:0;
    z-index:0;
  }
  .hero-video-bg{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    z-index:0;
  }
  .hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(27,28,30,0.35) 0%, rgba(27,28,30,0.55) 55%, rgba(27,28,30,0.9) 100%);
    z-index:1;
  }
  .hero-content{
    position:relative;
    z-index:2;
  }
  .hero .eyebrow{
    display:inline-block;
    font-size:11px;
    font-weight:800;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--charcoal);
    background:linear-gradient(100deg, var(--accent), #f4c56a);
    padding:6px 13px;
    border-radius:5px;
    margin-bottom:18px;
    box-shadow:0 6px 16px -4px rgba(232,162,58,0.5);
  }
  .hero h1{
    font-size:clamp(2.6rem,7vw,5.6rem);
    font-weight:800;
    line-height:0.95;
    letter-spacing:-0.02em;
    max-width:14ch;
  }
  .hero p{
    margin-top:24px;
    max-width:38ch;
    color:var(--metal-light);
    font-size:1.05rem;
    line-height:1.5;
  }
  .scroll-hint{
    position:absolute;
    bottom:74px;left:6vw;
    font-size:11px;
    letter-spacing:0.15em;
    text-transform:uppercase;
    color:var(--metal-light);
    display:flex;
    align-items:center;
    gap:10px;
    z-index:2;
  }

  /* === Franja de categorías, scroll infinito === */
  .marquee{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    z-index:2;
    overflow:hidden;
    background:rgba(10,10,11,0.55);
    backdrop-filter:blur(3px);
    border-top:1px solid rgba(242,239,233,0.12);
    padding:14px 0;
  }
  .marquee-track{
    display:flex;
    align-items:center;
    width:max-content;
    animation:marquee-scroll 22s linear infinite;
  }
  .marquee-track span{
    font-size:13px;
    font-weight:700;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--cream);
    white-space:nowrap;
    padding:0 18px;
  }
  .marquee-track .dot{
    color:var(--accent);
    font-weight:800;
    padding:0;
  }
  @keyframes marquee-scroll{
    0%{ transform:translateX(0); }
    100%{ transform:translateX(-50%); }
  }
  @media (max-width:600px){
    .marquee{ padding:10px 0; }
    .marquee-track span{ font-size:11px; padding:0 12px; }
    .marquee-track{ animation-duration:16s; }
  }
  .scroll-hint::before{
    content:"";
    width:1px;height:36px;
    background:var(--metal-mid);
    display:block;
    animation:scrolldown 1.8s ease-in-out infinite;
  }
  @keyframes scrolldown{
    0%{transform:scaleY(0);transform-origin:top;}
    50%{transform:scaleY(1);transform-origin:top;}
    50.01%{transform-origin:bottom;}
    100%{transform:scaleY(0);transform-origin:bottom;}
  }

  /* === Specs mosaic (debajo del hero) === */
  .specs-mosaic{
    padding:90px 6vw 40px;
    max-width:1180px;
    margin:0 auto;
  }
  .specs-mosaic-head{
    margin-bottom:40px;
  }
  .specs-mosaic-head .num{
    font-size:12px;
    letter-spacing:0.2em;
    color:var(--rust);
    text-transform:uppercase;
    margin-bottom:16px;
  }
  .specs-mosaic-head h2{
    font-size:clamp(1.8rem,3.4vw,2.6rem);
    font-weight:800;
    max-width:18ch;
  }
  .specs-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
    gap:22px;
  }
  .spec-card{
    border-radius:10px;
    overflow:hidden;
    background:#232426;
    box-shadow:0 20px 40px -24px rgba(0,0,0,0.65);
    transition:transform .3s ease, box-shadow .3s ease;
  }
  .spec-card:hover{
    transform:translateY(-4px);
    box-shadow:0 28px 50px -22px rgba(0,0,0,0.75);
  }
  .spec-card .spec-img{
    aspect-ratio:4/5;
    overflow:hidden;
  }
  .spec-card .spec-img img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
  }
  .spec-card .spec-caption{
    padding:14px 16px;
    font-size:12px;
    letter-spacing:0.03em;
    color:var(--metal-light);
    border-top:1px solid rgba(242,239,233,0.08);
  }
  @media (max-width:520px){
    .specs-grid{ grid-template-columns:repeat(2, 1fr); gap:14px; }
    .spec-card .spec-caption{ font-size:11px; padding:10px 12px; }
  }

  /* === Tarjeta de video (miniatura, carga solo al tocar play) === */
  .video-card{
    margin-top:22px;
    border-radius:10px;
    overflow:hidden;
    background:#232426;
    box-shadow:0 20px 40px -24px rgba(0,0,0,0.65);
    cursor:pointer;
  }
  .video-thumb{
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
  }
  .video-thumb img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
  }
  .video-thumb video{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
  }
  .play-btn{
    position:absolute;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    width:64px;height:64px;
    border-radius:50%;
    background:rgba(232,162,58,0.92);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 10px 26px -6px rgba(0,0,0,0.6);
    transition:transform .2s ease;
  }
  .video-card:hover .play-btn{ transform:translate(-50%,-50%) scale(1.08); }
  .play-btn svg{ width:26px; height:26px; fill:var(--charcoal); margin-left:3px; }
  .video-card-label{
    padding:14px 16px;
    font-size:13px;
    font-weight:600;
    color:var(--metal-light);
    border-top:1px solid rgba(242,239,233,0.08);
  }
  @media (max-width:520px){
    .play-btn{ width:50px; height:50px; }
    .play-btn svg{ width:20px; height:20px; }
    .video-card-label{ font-size:11.5px; padding:10px 12px; }
  }

  /* === Pinned scroll reveal (cantina + specs) === */
  .pin-reveal{
    position:relative;
    height:280vh;
  }
  .pin-reveal-inner{
    position:sticky;
    top:0;
    height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .pin-ghost-text{
    position:absolute;
    top:50%;left:50%;
    transform:translate(-50%,-50%);
    font-size:clamp(4rem, 16vw, 13rem);
    font-weight:800;
    letter-spacing:-0.03em;
    color:transparent;
    -webkit-text-stroke:1px rgba(242,239,233,0.10);
    white-space:nowrap;
    z-index:0;
    user-select:none;
  }
  .pin-eyebrow{
    position:absolute;
    top:14%;left:50%;
    transform:translateX(-50%);
    font-size:12px;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--rust);
    z-index:3;
  }
  .pin-product{
    position:relative;
    z-index:2;
    width:min(30vw, 300px);
    aspect-ratio:4/5;
    border-radius:14px;
    overflow:hidden;
    background:#141516;
    box-shadow:0 40px 80px -30px rgba(0,0,0,0.7);
  }
  .pin-product img{
    width:100%;height:100%;
    object-fit:contain;
    display:block;
  }
  .pin-callout{
    position:absolute;
    z-index:3;
    display:flex;
    align-items:center;
    gap:12px;
    background:rgba(35,36,38,0.9);
    border:1px solid rgba(242,239,233,0.12);
    border-radius:100px;
    padding:8px 18px 8px 8px;
    opacity:0;
    backdrop-filter:blur(6px);
  }
  .pin-callout .thumb{
    width:44px;height:44px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
  }
  .pin-callout .thumb img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
  }
  .pin-callout .label{
    font-size:12.5px;
    color:var(--cream);
    font-weight:600;
    white-space:nowrap;
  }
  .pin-c1{ top:16%; left:12%; }
  .pin-c2{ top:20%; right:10%; }
  .pin-c3{ bottom:22%; left:8%; }
  .pin-c4{ bottom:18%; right:12%; }
  @media (max-width:760px){
    .pin-product{ width:44vw; }
    .pin-callout{ padding:6px 14px 6px 6px; }
    .pin-callout .thumb{ width:36px;height:36px; }
    .pin-callout .label{ font-size:10.5px; }
    .pin-c1{ top:10%; left:4%; }
    .pin-c2{ top:14%; right:2%; }
    .pin-c3{ bottom:14%; left:2%; }
    .pin-c4{ bottom:10%; right:4%; }
  }

  .panels{
    position:relative;
  }
  .panel{
    min-height:88vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px 6vw;
    position:relative;
  }
  .panel-inner{
    display:grid;
    grid-template-columns:minmax(240px, 380px) 1fr;
    gap:48px;
    align-items:center;
    width:100%;
    max-width:1180px;
    margin:0 auto;
  }
  .panel:nth-child(even) .panel-inner{
    direction:rtl;
  }
  .panel:nth-child(even) .panel-inner > *{
    direction:ltr;
  }
  .img-wrap{
    aspect-ratio:4/5;
    border-radius:6px;
    overflow:hidden;
    position:relative;
    background:#141516;
    box-shadow:0 30px 60px -20px rgba(0,0,0,0.6);
  }
  .img-wrap img{
    width:100%;height:100%;
    object-fit:contain;
    display:block;
    will-change:transform, opacity;
  }
  /* === Carrusel de fotos por producto (scroll lateral) === */
  .carousel{
    aspect-ratio:4/5;
    border-radius:6px;
    overflow-x:auto;
    overflow-y:hidden;
    display:flex;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    background:#141516;
    box-shadow:0 30px 60px -20px rgba(0,0,0,0.6);
  }
  .carousel::-webkit-scrollbar{ display:none; }
  .carousel img{
    flex:0 0 100%;
    width:100%;
    height:100%;
    object-fit:contain;
    scroll-snap-align:start;
    display:block;
  }
  .carousel-dots{
    display:flex;
    gap:6px;
    justify-content:center;
    margin-top:10px;
  }
  .carousel-dots span{
    width:5px;height:5px;
    border-radius:50%;
    background:rgba(242,239,233,0.3);
    transition:background .2s ease, transform .2s ease;
  }
  .carousel-dots span.active{
    background:var(--rust);
    transform:scale(1.4);
  }
  .carousel-wrap{
    position:relative;
  }
  .carousel-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:38px;height:38px;
    border-radius:50%;
    background:rgba(27,28,30,0.55);
    border:1px solid rgba(242,239,233,0.25);
    backdrop-filter:blur(4px);
    color:var(--cream);
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:5;
    transition:background .2s ease;
    user-select:none;
  }
  .carousel-arrow:hover{ background:rgba(181,80,46,0.8); }
  .carousel-arrow.prev{ left:12px; }
  .carousel-arrow.next{ right:12px; }
  .carousel-arrow svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; }
  @media (max-width:800px){
    .carousel-arrow{ width:32px; height:32px; }
  }
  .panel-text .num{
    display:inline-block;
    font-size:11px;
    font-weight:800;
    letter-spacing:0.08em;
    color:var(--charcoal);
    background:linear-gradient(100deg, var(--accent), #f4c56a);
    text-transform:uppercase;
    padding:7px 14px;
    border-radius:5px;
    margin-bottom:18px;
    box-shadow:0 6px 16px -4px rgba(232,162,58,0.5);
  }
  .panel-text h2{
    font-size:clamp(1.8rem,3.4vw,2.8rem);
    font-weight:800;
    line-height:1.05;
    margin-bottom:18px;
  }
  .panel-text p{
    color:var(--metal-light);
    line-height:1.6;
    font-size:1rem;
    max-width:36ch;
  }
  .specs{
    margin-top:26px;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }
  .specs span{
    font-size:12px;
    letter-spacing:0.04em;
    padding:8px 14px;
    border:1px solid rgba(242,239,233,0.2);
    border-radius:100px;
    color:var(--metal-light);
  }
  .price{
    margin-top:28px;
    font-size:1.8rem;
    font-weight:800;
    color:var(--cream);
  }
  .price small{
    display:block;
    font-size:11px;
    font-weight:400;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--metal-mid);
    margin-top:4px;
  }

  .benefits{
    padding:100px 6vw 60px;
    max-width:1180px;
    margin:0 auto;
  }
  .benefits-head{
    margin-bottom:48px;
  }
  .benefits-head .num{
    font-size:12px;
    letter-spacing:0.2em;
    color:var(--rust);
    text-transform:uppercase;
    margin-bottom:16px;
  }
  .benefits-head h2{
    font-size:clamp(1.8rem,3.4vw,2.6rem);
    font-weight:800;
    max-width:16ch;
  }
  .benefits-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:2px;
    background:rgba(242,239,233,0.12);
    border:1px solid rgba(242,239,233,0.12);
    border-radius:8px;
    overflow:hidden;
  }
  .benefit-card{
    background:var(--charcoal);
    padding:36px 26px;
    display:flex;
    flex-direction:column;
    gap:18px;
    transition:background .25s ease;
  }
  .benefit-card:hover{
    background:#232426;
  }
  .benefit-card .icon{
    width:40px;height:40px;
    color:var(--rust);
  }
  .benefit-card .icon svg{
    width:100%;height:100%;
    stroke:currentColor;
    fill:none;
    stroke-width:1.4;
  }
  .benefit-card h3{
    font-size:1rem;
    font-weight:700;
    letter-spacing:-0.01em;
  }
  .benefit-card p{
    font-size:0.85rem;
    color:var(--metal-mid);
    line-height:1.5;
  }
  @media (max-width:900px){
    .benefits-grid{ grid-template-columns:repeat(2, 1fr); }
  }
  @media (max-width:520px){
    .benefits-grid{ grid-template-columns:1fr; }
  }

  footer{
    padding:120px 6vw 80px;
    text-align:center;
  }
  footer h3{
    font-size:clamp(1.6rem,4vw,2.4rem);
    font-weight:800;
    margin-bottom:20px;
  }
  .wa-btn{
    display:inline-block;
    background:var(--rust);
    color:var(--cream);
    text-decoration:none;
    padding:16px 34px;
    border-radius:100px;
    font-weight:700;
    font-size:0.95rem;
    letter-spacing:0.02em;
    transition:transform .25s ease;
  }
  .wa-btn:hover{ transform:scale(1.04); }

  .wa-float{
    position:fixed;
    bottom:22px;
    right:22px;
    width:58px;
    height:58px;
    border-radius:50%;
    background:#25D366;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 8px 24px -4px rgba(0,0,0,0.5);
    z-index:150;
    animation:wa-pulse 2.4s ease-in-out infinite;
  }
  .wa-float svg{
    width:30px;
    height:30px;
    fill:#ffffff;
  }
  .wa-float:hover{
    transform:scale(1.06);
  }
  @keyframes wa-pulse{
    0%, 100%{ box-shadow:0 8px 24px -4px rgba(0,0,0,0.5), 0 0 0 0 rgba(37,211,102,0.5); }
    50%{ box-shadow:0 8px 24px -4px rgba(0,0,0,0.5), 0 0 0 10px rgba(37,211,102,0); }
  }
  @media (max-width:600px){
    .wa-float{ width:52px; height:52px; bottom:16px; right:16px; }
    .wa-float svg{ width:26px; height:26px; }
  }

  @media (max-width:800px){
    .panel-inner{
      grid-template-columns:1fr;
      gap:18px;
      align-items:stretch;
    }
    .panel:nth-child(even) .panel-inner{ direction:ltr; }
    .img-wrap, .carousel-wrap, .carousel{ aspect-ratio:4/5; width:100%; }
    .panel-text .num{ font-size:10px; padding:6px 11px; margin-bottom:11px; }
    .panel-text h2{ font-size:1.55rem; line-height:1.08; margin-bottom:10px; }
    .panel-text p{ font-size:.9rem; line-height:1.5; }
    .specs{ margin-top:14px; }
    .specs span{ font-size:10.5px; padding:6px 10px; }
    .price{ font-size:1.45rem; margin-top:17px; }
    .product-wa{ width:100%; max-width:330px; }
    .comparison{ padding-top:45px; }
    .compare-groups{ flex-direction:column; }
    .compare-grid{ grid-template-columns:1.1fr repeat(2,1fr); font-size:.72rem; }
    .compare-grid>div{ padding:10px 7px; }
    .carousel-arrow{ width:32px; height:32px; }
    .carousel-arrow svg{ width:14px; height:14px; }
    .carousel-arrow.prev{ left:6px; }
    .carousel-arrow.next{ right:6px; }
  }

  @media (max-width:420px){
    .panel-inner{ grid-template-columns:1fr; gap:14px; }
    .panel-text h2{ font-size:1.2rem; }
    header .logo-word{ display:none; }
    header .logo-img{ height:52px; }
    header .tag{ font-size:9px; letter-spacing:0.08em; }
  }

  @media (max-width:600px){
    /* Hero en mobile: el video queda completo arriba (sin texto encima),
       y el texto pasa a fluir normal, debajo, sobre fondo sólido */
    .hero{
      display:block;
      height:auto;
      min-height:0;
      padding:0;
    }
    .hero-media{
      position:relative;
      inset:auto;
      width:100%;
      aspect-ratio:16/9;
      overflow:hidden;
      z-index:auto;
    }
    .hero-overlay{
      background:linear-gradient(180deg, rgba(27,28,30,0) 55%, rgba(27,28,30,0.7) 100%);
    }
    .hero-content{
      position:static;
      z-index:auto;
      padding:26px 6vw 6px;
      background:var(--charcoal);
    }
    .marquee{
      position:static;
    }
    .scroll-hint{ display:none; }
    .hero h1{ font-size:2.1rem; max-width:none; }
    .hero p{ font-size:0.9rem; max-width:none; }
    .hero .eyebrow{ font-size:10px; padding:5px 11px; }

    /* Sección "Por dentro y por fuera": sin pin, cuadrícula 2x2 simple */
    .pin-reveal{ height:auto; }
    .pin-reveal-inner{
      position:static;
      height:auto;
      display:grid;
      grid-template-columns:1fr 1fr;
      grid-template-areas:
        "eyebrow eyebrow"
        "product product"
        "c1 c2"
        "c3 c4";
      gap:12px;
      padding:70px 24px 60px;
      align-items:center;
      justify-items:center;
    }
    .pin-ghost-text{ display:none; }
    .pin-eyebrow{
      position:static;
      grid-area:eyebrow;
      transform:none;
      margin-bottom:6px;
    }
    .pin-product{
      grid-area:product;
      width:52vw;
      max-width:220px;
      margin-bottom:8px;
    }
    .pin-callout{
      position:static;
      width:100%;
      justify-content:center;
      text-align:left;
    }
    .pin-c1{ grid-area:c1; }
    .pin-c2{ grid-area:c2; }
    .pin-c3{ grid-area:c3; }
    .pin-c4{ grid-area:c4; }
  }

  /* === Lightbox: tocar foto para ampliar === */
  .carousel img, .img-wrap img, .spec-img img, .pin-product img, .pin-callout .thumb img{
    cursor:zoom-in;
  }
  .lightbox{
    position:fixed;
    inset:0;
    background:rgba(10,10,11,0.94);
    z-index:200;
    display:none;
    align-items:center;
    justify-content:center;
    padding:24px;
    cursor:zoom-out;
  }
  .lightbox.active{
    display:flex;
  }
  .lightbox img{
    max-width:100%;
    max-height:85vh;
    object-fit:contain;
    border-radius:8px;
    box-shadow:0 30px 80px rgba(0,0,0,0.6);
  }
  .lightbox-close{
    position:absolute;
    top:20px;
    right:24px;
    font-size:34px;
    line-height:1;
    color:var(--cream);
    font-weight:400;
    cursor:pointer;
    z-index:201;
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
    transition:background .2s ease;
  }
  .lightbox-close:hover{
    background:rgba(255,255,255,0.18);
  }
  /* Flechas y puntos dentro del lightbox: navegar entre las fotos de un mismo producto sin cerrar la vista ampliada */
  .lightbox-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:46px;height:46px;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
    border:1px solid rgba(242,239,233,0.25);
    backdrop-filter:blur(4px);
    color:var(--cream);
    display:none;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:201;
    transition:background .2s ease;
    user-select:none;
  }
  .lightbox-arrow.show{ display:flex; }
  .lightbox-arrow:hover{ background:rgba(181,80,46,0.8); }
  .lightbox-arrow.prev{ left:16px; }
  .lightbox-arrow.next{ right:16px; }
  .lightbox-arrow svg{ width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2; }
  .lightbox-dots{
    position:absolute;
    bottom:26px;
    left:0;right:0;
    display:none;
    gap:7px;
    justify-content:center;
    z-index:201;
  }
  .lightbox-dots.show{ display:flex; }
  .lightbox-dots span{
    width:7px;height:7px;
    border-radius:50%;
    background:rgba(242,239,233,0.35);
    cursor:pointer;
    transition:background .2s ease, transform .2s ease;
  }
  .lightbox-dots span.active{
    background:var(--accent);
    transform:scale(1.3);
  }
  @media (max-width:600px){
    .lightbox-arrow{ width:38px;height:38px; }
    .lightbox-arrow.prev{ left:8px; }
    .lightbox-arrow.next{ right:8px; }
  }

  @media (prefers-reduced-motion: reduce){
    .img-wrap img, .carousel img{ transform:none !important; opacity:1 !important; }
  }

  /* === Mejoras de conversión y móvil 2.0 === */
  .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px;align-items:center}
  .hero-wa,.product-wa{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#25D366;color:#071b0e;text-decoration:none;font-weight:800;border-radius:100px;box-shadow:0 12px 30px -10px rgba(37,211,102,.55);transition:transform .2s ease,box-shadow .2s ease}
  .hero-wa{padding:14px 22px;font-size:.95rem}
  .hero-wa:hover,.product-wa:hover{transform:translateY(-2px);box-shadow:0 16px 34px -10px rgba(37,211,102,.7)}
  .hero-note{font-size:11px!important;color:#fff!important;margin:0!important;opacity:.85}
  .how-buy{max-width:1180px;margin:0 auto;padding:80px 6vw 30px}
  .how-buy-head{margin-bottom:30px}
  .how-buy-head .num{font-size:12px;letter-spacing:.2em;color:var(--rust);text-transform:uppercase;margin-bottom:16px}
  .how-buy-head h2{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:800;max-width:18ch}
  .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .step{background:#232426;border:1px solid rgba(242,239,233,.1);border-radius:12px;padding:24px;min-height:150px}
  .step strong{display:block;font-size:12px;color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
  .step h3{font-size:1rem;margin-bottom:8px}
  .step p{font-size:.85rem;line-height:1.5;color:var(--metal-mid)}
  .product-wa{margin-top:16px;padding:11px 17px;font-size:.85rem;width:max-content}
  .product-wa svg,.hero-wa svg{width:18px;height:18px;fill:currentColor}
  .comparison{max-width:1180px;margin:0 auto;padding:60px 6vw 30px}
  .comparison h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:20px}
  .compare-groups{display:flex;gap:24px;flex-wrap:wrap}
  .compare-card{flex:1 1 320px;min-width:280px}
  .compare-card-title{font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
  .compare-grid{display:grid;grid-template-columns:1.4fr repeat(2,1fr);overflow:hidden;border:1px solid rgba(242,239,233,.12);border-radius:12px;background:#232426}
  .compare-grid>div{padding:13px 14px;border-right:1px solid rgba(242,239,233,.08);border-bottom:1px solid rgba(242,239,233,.08);font-size:.82rem}
  .compare-grid .head{font-weight:800;color:var(--cream);background:#2b2c2f}
  .compare-grid .muted{color:var(--metal-mid)}
  .mobile-sticky-cta{display:none}
  @media (max-width:800px){
    .hero-actions{margin-top:18px;align-items:flex-start;flex-direction:column}
    .hero-wa{width:100%;max-width:330px}
    .steps{grid-template-columns:1fr 1fr}
    .panel-inner{grid-template-columns:1fr;gap:18px;align-items:stretch}
    .panel:nth-child(even) .panel-inner{direction:ltr}
    .panel{padding:44px 5vw}
    .img-wrap,.carousel-wrap,.carousel{aspect-ratio:4/5;width:100%}
    .panel-text .num{font-size:10px;padding:6px 11px;margin-bottom:11px}
    .panel-text h2{font-size:1.55rem;line-height:1.08;margin-bottom:10px}
    .panel-text p{font-size:.9rem;line-height:1.5}
    .specs{margin-top:14px}
    .specs span{font-size:10.5px;padding:6px 10px}
    .price{font-size:1.45rem;margin-top:17px}
    .product-wa{width:100%;max-width:330px}
    .comparison{padding-top:45px}
    .compare-groups{flex-direction:column}
    .compare-grid{grid-template-columns:1.1fr repeat(2,1fr);font-size:.72rem}
    .compare-grid>div{padding:10px 7px}
  }
  @media (max-width:520px){
    header{padding:10px 5vw}
    header .logo-img{height:54px}
    header .tag{font-size:8px;max-width:130px;text-align:right}
    .header-right{gap:8px}
    .hero-content{padding-left:5vw;padding-right:5vw}
    .hero h1{font-size:clamp(2.15rem,10vw,3rem);line-height:.98}
    .hero p{font-size:.92rem;line-height:1.45;margin-top:16px}
    .scroll-hint{display:none}
    .specs-mosaic{padding-top:60px}
    .how-buy{padding-top:55px}
    .steps{grid-template-columns:1fr}
    .step{min-height:auto;padding:19px}
    .comparison{padding-left:5vw;padding-right:5vw}
    .compare-grid{font-size:.68rem}
    .compare-grid>div{padding:9px 5px}
    .mobile-sticky-cta{position:fixed;display:flex;left:10px;right:10px;bottom:10px;z-index:140;padding:10px;background:rgba(27,28,30,.92);border:1px solid rgba(242,239,233,.12);backdrop-filter:blur(8px);border-radius:16px;box-shadow:0 12px 35px rgba(0,0,0,.45)}
    .mobile-sticky-cta a{width:100%;text-align:center;background:#25D366;color:#071b0e;text-decoration:none;font-weight:900;padding:13px;border-radius:11px;font-size:.9rem}
    footer{padding-bottom:125px}
  }



@media (max-width:640px){#guia-busqueda{padding-left:5vw!important;padding-right:5vw!important}#guia-busqueda h2{font-size:26px;line-height:1.15}#guia-busqueda article{padding:17px!important}}

/* Footer premium Hogar y Campo */
.hc-footer{padding:72px 6vw 26px;background:linear-gradient(160deg,#26331d 0%,#1b1c1e 68%);border-top:1px solid rgba(201,162,39,.28);text-align:left}
.hc-footer-inner{max-width:1160px;margin:0 auto}
.hc-footer-top{display:grid;grid-template-columns:minmax(300px,1.65fr) repeat(3,minmax(150px,1fr));gap:42px;padding-bottom:42px}
.hc-footer-brand{max-width:470px}
.hc-footer-kicker,.hc-footer-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--metal-mid);font-weight:800}
.hc-footer-brand h2{font-size:clamp(1.7rem,3.2vw,2.55rem);line-height:1.05;margin:12px 0 14px;font-weight:850;letter-spacing:-.025em}
.hc-footer-brand p{color:var(--metal-mid);font-size:14px;line-height:1.65;margin:0}
.hc-footer-trust{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 22px}
.hc-footer-trust span{font-size:11px;color:var(--cream);padding:7px 10px;border:1px solid rgba(242,239,233,.1);border-radius:999px;background:rgba(255,255,255,.025)}
.hc-footer-actions{display:flex;flex-wrap:wrap;gap:10px}
.hc-footer-primary,.hc-footer-secondary{display:inline-flex;align-items:center;gap:10px;text-decoration:none;border-radius:999px;padding:12px 17px;font-size:13px;font-weight:800;transition:transform .2s ease,background .2s ease}
.hc-footer-primary{background:var(--rust);color:var(--cream)}
.hc-footer-secondary{border:1px solid rgba(242,239,233,.2);color:var(--cream)}
.hc-footer-primary:hover,.hc-footer-secondary:hover{transform:translateY(-2px)}
.hc-footer-col{display:flex;flex-direction:column;gap:11px;font-size:13px}
.hc-footer-col a{color:var(--cream);text-decoration:none;line-height:1.35}
.hc-footer-col a:hover{text-decoration:underline;text-underline-offset:3px}
.hc-footer-contact span{color:var(--metal-mid);line-height:1.35}
.hc-footer-whatsapp{font-weight:800!important}
.hc-footer-social-label{margin-top:8px}
.hc-footer-socials{display:flex;gap:8px}
.hc-footer-socials a{width:34px;height:34px;border:1px solid rgba(242,239,233,.16);border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:900;text-decoration:none!important}
.hc-footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);font-size:11px;color:var(--metal-dark)}
@media(max-width:900px){.hc-footer-top{grid-template-columns:1.5fr 1fr 1fr}.hc-footer-contact{grid-column:2 / -1}}
@media(max-width:600px){.hc-footer{padding:58px 5vw 92px}.hc-footer-top{grid-template-columns:1fr;gap:30px}.hc-footer-brand{max-width:none}.hc-footer-contact{grid-column:auto}.hc-footer-bottom{flex-direction:column;gap:8px}.hc-footer-actions{display:grid;grid-template-columns:1fr}.hc-footer-primary,.hc-footer-secondary{justify-content:center}.hc-footer-trust{gap:6px}.hc-footer-trust span{font-size:10.5px}}