:root{
      --blue:#1E90FF;
      --blue2:#49AEFF;
      --blue-dark:#0066FF;
      --dark:#030609;
      --dark-2:#071017;
      --card:#101820;
      --line:rgba(255,255,255,.14);
      --text:#ffffff;
      --muted:#c6ced8;
    }

    *{margin:0;padding:0;box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      font-family:"Exo 2",sans-serif;
      background:var(--dark);
      color:var(--text);
      overflow-x:hidden;
    }
    a{text-decoration:none;color:inherit}

    .site-bg{
      min-height:100vh;
      background:
        radial-gradient(circle at 72% 18%, rgba(30,144,255,.20), transparent 24%),
        radial-gradient(circle at 72% 24%, rgba(20,130,255,.22), transparent 28%),
        linear-gradient(90deg, #030609 0%, #060b10 45%, #0b1218 100%);
      position:relative;
      overflow:hidden;
    }
    .site-bg::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.22) 56%,rgba(0,0,0,.45)),
        repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 120px);
      pointer-events:none;
    }

    .nav{
      max-width:1480px;
      margin:auto;
      padding:28px 42px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:26px;
      position:relative;
      z-index:5;
    }
    .logo{
      font-weight:800;
      font-style:italic;
      letter-spacing:-2px;
      font-size:2.25rem;
      line-height:.86;
      text-transform:uppercase;
    }
    .logo span{color:var(--blue)}
    .logo small{
      display:block;
      color:var(--blue);
      font-style:normal;
      font-size:.62rem;
      letter-spacing:8px;
      margin-top:9px;
      padding-left:5px;
    }
    .menu{
      display:flex;
      gap:30px;
      align-items:center;
      font-weight:800;
      font-size:.95rem;
      text-transform:uppercase;
    }
    .menu a{transition:.25s;opacity:.95}
    .menu a:hover,.menu .active{color:var(--blue)}
    .whats-top{
      border:2px solid var(--blue);
      border-radius:999px;
      padding:13px 22px;
      display:flex;
      align-items:center;
      gap:10px;
      font-weight:800;
      white-space:nowrap;
      box-shadow:0 0 30px rgba(30,144,255,.18);
    }

    .hero{
      max-width:1480px;
      min-height:680px;
      margin:auto;
      padding:52px 42px 40px;
      display:grid;
      grid-template-columns:.92fr 1.08fr;
      align-items:center;
      gap:20px;
      position:relative;
      z-index:2;
    }
    .pill{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:11px 18px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.34);
      background:rgba(255,255,255,.055);
      backdrop-filter:blur(10px);
      font-weight:800;
      margin-bottom:28px;
      box-shadow:inset 0 0 20px rgba(255,255,255,.025);
    }
    h1{
      font-size:clamp(3.3rem,6vw,6.35rem);
      line-height:.93;
      letter-spacing:-4px;
      text-transform:uppercase;
      font-weight:800;
      margin-bottom:26px;
    }
    .blue{color:var(--blue)}
    .lead{
      max-width:570px;
      color:#edf2f5;
      font-size:1.33rem;
      line-height:1.55;
      margin-bottom:30px;
    }
    .hero-features{display:flex;gap:28px;flex-wrap:wrap;margin-bottom:36px}
    .mini-feature{display:flex;align-items:flex-start;gap:12px;font-weight:800;color:#fff}
    .mini-feature .ico{width:34px;height:34px;color:var(--blue);filter:drop-shadow(0 0 8px rgba(30,144,255,.45))}
    .mini-feature small{display:block;color:#cbd3dd;font-weight:500;margin-top:4px;font-size:.95rem}

    .actions{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
    .btn{
      min-height:64px;
      border-radius:18px;
      padding:16px 30px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:12px;
      font-weight:800;
      text-transform:uppercase;
      transition:.25s;
    }
    .btn:hover{transform:translateY(-3px)}
    .btn-main{
      background:linear-gradient(180deg,var(--blue2),var(--blue-dark));
      color:#fff;
      box-shadow:0 0 32px rgba(30,144,255,.28);
    }
    .btn-main small{display:block;font-size:.95rem}
    .btn-outline{border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.32)}
    .btn-outline span{color:var(--blue);font-size:1.5rem}

    .printer-scene{
      height:540px;
      position:relative;
      filter:drop-shadow(0 45px 70px rgba(0,0,0,.75));
    }
    .printer-scene::before{
      content:"";
      position:absolute;
      inset:30px 0 auto 40px;
      height:480px;
      background:
        radial-gradient(circle at 56% 48%,rgba(30,144,255,.20),transparent 22%),
        radial-gradient(circle at 70% 20%,rgba(35,140,255,.24),transparent 25%);
      filter:blur(18px);
      opacity:.78;
    }
    .rail{position:absolute;top:120px;left:70px;right:10px;height:24px;background:linear-gradient(180deg,#252e36,#050608);border-radius:18px;box-shadow:inset 0 2px 0 rgba(255,255,255,.16)}
    .rail-thin{position:absolute;top:152px;left:120px;right:40px;height:8px;background:#040608;border-radius:12px}
    .tower{position:absolute;right:8px;top:42px;width:36px;height:415px;border-radius:20px;background:linear-gradient(90deg,#05080a,#242c35,#07090c)}
    .head{
      position:absolute;top:70px;left:265px;width:220px;height:178px;border-radius:18px;
      background:linear-gradient(145deg,#27313a,#06080b);
      border:1px solid rgba(255,255,255,.16);
      box-shadow:inset 0 0 22px rgba(255,255,255,.035),0 22px 42px rgba(0,0,0,.56);
    }
    .head::before{content:"TOPRINT";position:absolute;top:28px;left:24px;font-size:1rem;font-weight:800;font-style:italic}
    .head::after{content:"3D";position:absolute;top:28px;left:102px;color:var(--blue);font-weight:800;font-style:italic}
    .fan{position:absolute;left:38px;bottom:30px;width:78px;height:78px;border-radius:50%;background:radial-gradient(circle,#06080a 30%,#2a3440 31% 43%,#07090b 44%);border:4px solid #303b46}
    .fan2{position:absolute;right:30px;bottom:34px;width:68px;height:68px;border-radius:14px;background:#05070a;border:3px solid #303b46}
    .warn{position:absolute;right:74px;top:106px;color:#ffd21c;font-size:1.5rem}
    .nozzle{position:absolute;left:93px;bottom:-32px;width:34px;height:55px;background:linear-gradient(180deg,#202832,#050607);clip-path:polygon(25% 0,75% 0,100% 60%,50% 100%,0 60%)}
    .tube{position:absolute;left:382px;top:0;width:130px;height:130px;border:12px solid #101820;border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;transform:rotate(-22deg)}
    .bed{position:absolute;left:145px;right:35px;bottom:70px;height:86px;border-radius:10px;background:linear-gradient(180deg,#242a30,#06080a);transform:skewX(-13deg);box-shadow:0 28px 55px rgba(0,0,0,.68),inset 0 1px 0 rgba(255,255,255,.18)}
    .vase{position:absolute;left:315px;bottom:135px;width:180px;height:168px;border-radius:42% 42% 22% 22%;clip-path:polygon(16% 0,84% 0,100% 45%,78% 100%,22% 100%,0 45%);background:linear-gradient(90deg,#166ee8,#66b7ff 52%,#0d5bd7);box-shadow:0 0 46px rgba(30,144,255,.42)}
    .vase::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(100deg,rgba(0,0,0,.16) 0 9px,rgba(255,255,255,.22) 9px 17px);opacity:.7}
    .line{position:absolute;left:397px;bottom:296px;width:2px;height:70px;background:var(--blue);box-shadow:0 0 14px var(--blue)}

    .benefits{
      max-width:1370px;
      margin:-28px auto 0;
      position:relative;
      z-index:4;
      display:grid;
      grid-template-columns:repeat(4,1fr);
      border:1px solid var(--line);
      border-radius:20px;
      background:linear-gradient(180deg,rgba(20,29,38,.88),rgba(12,18,24,.86));
      backdrop-filter:blur(12px);
      overflow:hidden;
    }
    .benefit{padding:24px 38px;display:flex;align-items:center;gap:18px;border-right:1px solid var(--line)}
    .benefit:last-child{border-right:0}
    .benefit svg{width:38px;color:var(--blue);filter:drop-shadow(0 0 8px rgba(30,144,255,.32))}
    .benefit b{display:block;margin-bottom:4px}
    .benefit small{color:#cbd3dd;font-size:1rem}

    section{padding:58px 42px;background:#030609;position:relative;z-index:2}
    .section-title{text-align:center;margin-bottom:28px}
    .section-title h2{font-size:clamp(2rem,4vw,3rem);text-transform:uppercase;letter-spacing:-1px}
    .section-title p{color:#c7d0da;margin-top:8px;font-size:1.05rem}
    .categories{max-width:1370px;margin:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
    .card{
      min-height:420px;
      border-radius:18px;
      border:1px solid var(--line);
      background:linear-gradient(180deg,rgba(21,31,40,.86),rgba(8,13,18,.95));
      padding:24px;
      position:relative;
      overflow:hidden;
      transition:.25s;
    }
    .card:hover{transform:translateY(-7px);border-color:rgba(30,144,255,.48);box-shadow:0 0 32px rgba(30,144,255,.08)}
    .product-art{height:190px;margin-bottom:20px;display:flex;align-items:center;justify-content:center;position:relative}
    .product-art::before{content:"";position:absolute;width:150px;height:150px;border-radius:50%;background:rgba(30,144,255,.08);filter:blur(20px)}
    .pot{width:115px;height:125px;background:linear-gradient(145deg,#d7d9db,#333a42);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);border-radius:0 0 22px 22px;position:relative}
    .plant{position:absolute;top:0;width:130px;height:80px;background:radial-gradient(ellipse at center,#74b9ff 0 35%,transparent 36%);filter:drop-shadow(0 0 8px rgba(30,144,255,.3))}
    .dragon{font-size:6.6rem;filter:hue-rotate(160deg) drop-shadow(0 0 18px rgba(30,144,255,.25))}
    .controller{font-size:6.2rem;filter:drop-shadow(0 0 18px rgba(30,144,255,.45))}
    .tool{width:135px;height:110px;background:linear-gradient(145deg,#8e98a2,#28313a);border-radius:18px;clip-path:polygon(0 15%,70% 15%,70% 0,100% 35%,72% 70%,72% 55%,0 55%)}
    .cup{font-size:6.4rem;filter:drop-shadow(0 0 18px rgba(255,210,70,.35))}
    .badge{position:absolute;top:18px;right:18px;background:var(--blue);color:#fff;border-radius:999px;padding:6px 12px;font-weight:800;font-size:.8rem}
    .card h3{text-transform:uppercase;font-size:1.3rem;margin-bottom:12px}
    .card p{color:#d4dbe4;line-height:1.48;font-size:1.05rem;margin-bottom:18px}
    .card a{color:var(--blue);font-weight:800;font-size:1.08rem}

    .copa-strip{
      max-width:1370px;
      margin:36px auto 0;
      border-radius:18px;
      background:linear-gradient(90deg,#061a31,#0f3560);
      color:#fff;
      padding:36px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
      overflow:hidden;
      border:1px solid rgba(30,144,255,.42);
      box-shadow:0 0 30px rgba(30,144,255,.08);
    }
    .copa-strip strong{font-size:2rem;text-transform:uppercase}
    .copa-strip p{font-size:1.12rem;margin-top:6px;color:#cbd3dd}
    .copa-strip .btn-black{background:linear-gradient(180deg,var(--blue2),var(--blue-dark));color:#fff;border-radius:16px;padding:17px 30px;font-weight:800;white-space:nowrap}

    .wide-cta{
      max-width:1370px;
      margin:32px auto 0;
      border:1px solid rgba(30,144,255,.38);
      border-radius:18px;
      background:linear-gradient(90deg,rgba(30,144,255,.16),rgba(30,144,255,.04));
      padding:28px 34px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:24px;
    }
    .wide-cta strong{font-size:2rem;color:var(--blue)}
    .wide-cta p{color:#cbd3dd}

    footer{background:#030609;border-top:1px solid rgba(255,255,255,.1);padding:50px 42px 26px}
    .footer-grid{max-width:1370px;margin:auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr 1fr;gap:34px}
    .footer-grid h4{color:var(--blue);text-transform:uppercase;margin-bottom:16px}
    .footer-grid p,.footer-grid a{display:block;color:#cdd5df;line-height:1.7;margin-bottom:7px}
    .social{display:flex;gap:16px;font-size:1.8rem}
    .copy{text-align:center;color:#87919f;margin-top:34px;font-size:.95rem}
    .float-whats{position:fixed;right:22px;bottom:22px;z-index:60;background:linear-gradient(180deg,var(--blue2),var(--blue-dark));color:#fff;border-radius:999px;padding:14px 20px;font-weight:800;box-shadow:0 0 42px rgba(30,144,255,.35)}

    @media(max-width:1100px){
      .menu{display:none}
      .hero{grid-template-columns:1fr;text-align:center}
      .lead{margin-left:auto;margin-right:auto}
      .hero-features,.actions{justify-content:center}
      .printer-scene{height:460px;transform:scale(.88)}
      .benefits{grid-template-columns:repeat(2,1fr);margin:0 24px}
      .categories{grid-template-columns:repeat(2,1fr)}
      .footer-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:650px){
      .nav{padding:20px}
      .whats-top{display:none}
      .hero{padding:25px 20px 30px}
      section,footer{padding-left:20px;padding-right:20px}
      h1{letter-spacing:-2px}
      .hero-features{display:grid;grid-template-columns:1fr}
      .printer-scene{height:310px;transform:scale(.6);transform-origin:center top}
      .benefits,.categories,.footer-grid{grid-template-columns:1fr}
      .benefit{border-right:0;border-bottom:1px solid var(--line)}
      .copa-strip,.wide-cta{flex-direction:column;text-align:center}
      .float-whats{left:16px;right:16px;text-align:center}
      .card{min-height:360px}
    }

/* SEO/product pages */
.product-page{
  min-height:100vh;
  padding:72px 42px;
  background:
    radial-gradient(circle at 75% 12%, rgba(30,144,255,.18), transparent 26%),
    linear-gradient(90deg,#030609 0%,#071017 100%);
}
.product-container{
  max-width:1180px;
  margin:auto;
}
.product-hero-card{
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:linear-gradient(180deg,rgba(21,31,40,.86),rgba(8,13,18,.95));
  padding:48px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
}
.product-hero-card h1{
  font-size:clamp(2.5rem,5vw,4.8rem);
  line-height:.95;
  margin-bottom:18px;
}
.product-hero-card p{
  color:#d4dbe4;
  font-size:1.18rem;
  line-height:1.65;
  max-width:780px;
  margin-bottom:24px;
}
.product-list{
  margin-top:28px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.product-list article{
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  padding:22px;
  background:rgba(255,255,255,.04);
}
.product-list h2{
  font-size:1.25rem;
  margin-bottom:8px;
  color:var(--blue);
}
.product-list p{
  font-size:1rem;
  margin:0;
}
@media(max-width:800px){
  .product-page{padding:44px 20px}
  .product-hero-card{padding:30px}
  .product-list{grid-template-columns:1fr}
}


/* ===== MOBILE RESPONSIVE FIX ===== */
@media(max-width:900px){

.nav{
flex-direction:column;
gap:16px;
padding:20px;
}

.menu{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:14px;
font-size:14px;
text-align:center;
}

.phone{
width:100%;
text-align:center;
}

.hero{
grid-template-columns:1fr !important;
padding:20px;
gap:24px;
}

h1,
.hero h1{
font-size:58px !important;
line-height:.95 !important;
word-break:break-word;
}

.lead,
.hero p{
font-size:20px !important;
line-height:1.5 !important;
max-width:100%;
}

.pill{
width:100%;
text-align:center;
justify-content:center;
padding:14px;
font-size:14px;
}

.features{
flex-direction:column;
gap:16px;
}

.buttons{
flex-direction:column;
gap:14px;
}

.btn{
width:100%;
}

.hero-img{
height:auto !important;
}

.hero-img img{
width:100%;
height:auto;
border-radius:20px;
}

.cards{
grid-template-columns:1fr !important;
padding:20px !important;
}

.card{
width:100%;
}

.quality{
grid-template-columns:1fr !important;
padding:0 20px;
}

.seo-section{
padding:20px;
}

.seo-box{
padding:28px;
}

.seo-box h2{
font-size:38px !important;
line-height:1.1;
}

.seo-grid{
grid-template-columns:1fr !important;
}

.footer{
padding:40px 20px;
}

.footer-grid{
grid-template-columns:1fr !important;
gap:30px;
}

}


/* ===== AJUSTE REAL 22/05 ===== */
/* Bloque azul de Copa removido/oculto en desktop y mobile */
.copa-strip{
  display:none !important;
}

/* Corrección de hero/impresora en celular */
@media(max-width:650px){
  .hero{
    grid-template-columns:1fr !important;
    text-align:center !important;
    padding:24px 18px 36px !important;
    gap:10px !important;
  }

  .hero h1{
    font-size:3rem !important;
    line-height:.95 !important;
    letter-spacing:-1.5px !important;
  }

  .lead{
    font-size:1.05rem !important;
    line-height:1.5 !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .hero-features{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:16px !important;
    justify-items:start !important;
    text-align:left !important;
    max-width:330px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .actions{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:14px !important;
  }

  .btn{
    width:100% !important;
  }

  .printer-scene{
    width:100% !important;
    max-width:390px !important;
    height:300px !important;
    margin:8px auto 0 !important;
    transform:none !important;
    overflow:hidden !important;
  }

  .printer-scene::before{
    height:260px !important;
    inset:20px auto auto 0 !important;
    width:100% !important;
  }

  .tube{
    display:none !important;
  }

  .rail{
    top:72px !important;
    left:28px !important;
    right:24px !important;
    height:15px !important;
  }

  .rail-thin{
    top:94px !important;
    left:48px !important;
    right:40px !important;
  }

  .tower{
    top:34px !important;
    right:24px !important;
    height:220px !important;
    width:22px !important;
  }

  .head{
    top:44px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:150px !important;
    height:120px !important;
  }

  .head::before{
    top:18px !important;
    left:16px !important;
    font-size:.75rem !important;
  }

  .head::after{
    top:18px !important;
    left:74px !important;
    font-size:.75rem !important;
  }

  .fan{
    left:24px !important;
    bottom:20px !important;
    width:48px !important;
    height:48px !important;
    border-width:3px !important;
  }

  .fan2{
    right:22px !important;
    bottom:22px !important;
    width:42px !important;
    height:42px !important;
  }

  .warn{
    display:none !important;
  }

  .nozzle{
    left:63px !important;
    bottom:-24px !important;
    width:24px !important;
    height:40px !important;
  }

  .line{
    left:50% !important;
    bottom:140px !important;
    height:42px !important;
  }

  .vase{
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:72px !important;
    width:105px !important;
    height:98px !important;
  }

  .bed{
    left:42px !important;
    right:42px !important;
    bottom:40px !important;
    height:48px !important;
  }

  .benefits{
    grid-template-columns:1fr !important;
    margin:0 18px !important;
  }

  .categories{
    grid-template-columns:1fr !important;
  }

  .card{
    min-height:auto !important;
  }
}