/* ===== Base / Variables ===== */
:root{
  --background-color:#000;
  --surface-color:#111214;
  --heading-color:#fff;
  --default-color:#e9edf1;
  --contrast-color:#fff;
  --accent-color:#E69F00;
}
html,body{height:100%;scroll-behavior:smooth;}
body{font-family:Roboto,system-ui,-apple-system,Segoe UI,Helvetica,Arial,sans-serif;color:var(--default-color);background:var(--background-color);}
.section{padding:80px 0;background:var(--background-color);color:var(--default-color);}
.section-title h2{color:var(--heading-color);font-weight:800;margin-bottom:.5rem;}
.section-title p{color:color-mix(in srgb,var(--default-color),transparent 20%);margin:0;}
.light-background{
  --background-color:#f6f8fb;--surface-color:#fff;--heading-color:#111216;--default-color:#2b2f36;--contrast-color:#111216;
}

/* ===== Header / Nav ===== */
.header{background:rgba(0,0,0,.55);backdrop-filter:blur(8px);z-index:997;}
.navmenu ul{list-style:none;margin:0;padding:0;display:flex;gap:20px;align-items:center;}
.navmenu a{color:var(--contrast-color);text-decoration:none;font-weight:600;opacity:.85;transition:opacity .2s,color .2s;}
.navmenu a:hover,.navmenu a.active{opacity:1;color:var(--accent-color);}
.mobile-nav-toggle{font-size:28px;cursor:pointer;color:var(--contrast-color);}

/* Mobile nav (coherente con JS: body.mobile-nav-active) */
@media (max-width:1199.98px){
  .navmenu ul{
    position:absolute;top:100%;right:12px;left:12px;padding:16px;border-radius:12px;
    background:#0f1012;border:1px solid rgba(255,255,255,.06);
    display:none;flex-direction:column;gap:12px;
  }
  body.mobile-nav-active #navmenu ul{display:flex;}
}

/* CTA header button */
.btn-getstarted{
  display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:50px;font-weight:800;font-size:14px;
  background:var(--accent-color);color:var(--contrast-color);text-decoration:none;border:2px solid var(--accent-color);
  transition:transform .2s,box-shadow .2s,background-color .2s;
}
.btn-getstarted:hover{transform:translateY(-2px);box-shadow:0 10px 24px color-mix(in srgb,var(--accent-color),transparent 70%);}

/* ===== Hero ===== */
.hero{
  position:relative;min-height:100vh;padding-top:120px;display:flex;align-items:stretch;overflow:hidden;
  background:url("../img/hero.jpg") center/cover no-repeat;
}
.hero::before{
  content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.25),rgba(0,0,0,.65));z-index:0;
}
.hero .container,.hero .hero-wrapper,.hero .hero-main-content{position:relative;z-index:1;}
.hero .hero-logo-img{width:140px;height:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.25));}
.hero .hero-title{font-weight:900;line-height:1.1;letter-spacing:-.02em;margin-bottom:12px;color:#fff;font-size:56px;}
@media (max-width:992px){.hero .hero-title{font-size:42px;}}
@media (max-width:575.98px){.hero .hero-title{font-size:30px;}}
.hero .hero-title .typed{
  background:linear-gradient(135deg,var(--accent-color),color-mix(in srgb,var(--accent-color),#8b5cf6 50%));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;
}
.hero .hero-title .typed::after{
  content:"";position:absolute;left:0;bottom:-6px;width:100%;height:4px;background:linear-gradient(135deg,var(--accent-color),color-mix(in srgb,var(--accent-color),#8b5cf6 50%));border-radius:2px;
}
.hero .hero-subtitle{font-size:1.125rem;line-height:1.6;margin:12px auto 24px;max-width:820px;color:rgba(255,255,255,.92);}
.hero .hero-actions{display:flex;flex-wrap:wrap;gap:14px 20px;justify-content:center;margin:10px 0 40px;}
.hero .action-btn{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:50px;font-weight:800;font-size:16px;text-decoration:none;position:relative;overflow:hidden;transition:all .25s;}
.hero .action-btn.primary{background:var(--accent-color);color:var(--contrast-color);border:2px solid var(--accent-color);}
.hero .action-btn.primary.outline{background:transparent;color:var(--accent-color);border:2px solid var(--accent-color);}
.hero .action-btn.primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px color-mix(in srgb,var(--accent-color),transparent 60%);}
.hero .action-btn.primary.outline:hover{background:color-mix(in srgb,var(--accent-color),transparent 92%);}
.hero .action-btn.secondary{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55);}
.hero .action-btn.secondary:hover{background:rgba(255,255,255,.08);border-color:var(--accent-color);color:var(--accent-color);}
@media (max-width:768px){.hero .action-btn{width:100%;max-width:320px;} .hero{padding-top:100px;}}

/* ===== Features ===== */
.features .features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:991.98px){.features .features-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:575.98px){.features .features-grid{grid-template-columns:1fr;}}
.features .feature-item{background:var(--surface-color);border-radius:12px;overflow:hidden;border:1px solid color-mix(in srgb,var(--default-color),transparent 88%);box-shadow:0 6px 20px rgba(0,0,0,.10);transition:all .3s;}
.features .feature-item:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,.14);border-color:color-mix(in srgb,var(--accent-color),transparent 70%);}
.features .feature-number{position:absolute;left:12px;top:12px;z-index:2;background:rgba(0,0,0,.5);color:#fff;font-weight:800;padding:6px 10px;border-radius:999px;font-size:12px;}
.features .feature-image img{width:100%;height:180px;object-fit:cover;display:block;}
.features .feature-content{padding:18px;}
.features .feature-icon{color:var(--accent-color);font-size:22px;margin-bottom:8px;}
.features .feature-content h4{color:var(--heading-color);font-weight:800;margin-bottom:6px;}
.features .feature-content p{color:color-mix(in srgb,var(--default-color),transparent 10%);margin-bottom:10px;}
.features .feature-tags{display:flex;gap:8px;flex-wrap:wrap;}
.features .tag{background:rgba(230,159,0,.12);color:var(--accent-color);padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px;}

/* ===== Get Started / Contact ===== */
.get-started .content { padding: 30px 0; }
.get-started .content h3 {
  font-size: 32px; font-weight: 700; margin-bottom: 25px;
  padding-bottom: 25px; position: relative; color: var(--heading-color);
}
.get-started .content h3::after {
  content:""; position:absolute; width:60px; height:4px;
  background: var(--accent-color); left:0; bottom:0;
}
.get-started .content p { font-size: 14px; }

/* Card del formulario */
.get-started .php-email-form {
  background: color-mix(in srgb, var(--default-color), transparent 97%);
  padding: 30px; height: 100%;
}
@media (max-width:575px){ .get-started .php-email-form { padding: 20px; } }

/* ===== Inputs y textarea (oscuro + consistencia) ===== */
.get-started .php-email-form .form-control,
.get-started .php-email-form input[type=text],
.get-started .php-email-form input[type=email],
.get-started .php-email-form input[type=tel],
.get-started .php-email-form textarea {
  font-size: 14px; padding: 12px 14px;
  background: #111214;                    /* fondo uniforme oscuro */
  color: #e9edf1;                          /* texto claro */
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 8px; line-height: 1.4;
  box-shadow: none; outline: none;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}

.get-started .php-email-form .form-control::placeholder { 
  color: rgba(233,237,241,0.55); opacity: 1;
}

.get-started .php-email-form .form-control:focus {
  border-color: var(--accent-color);              /* #E69F00 */
  box-shadow: 0 0 0 3px rgba(230,159,0,0.18);
  background: #15171a; color: #fff;
}

.get-started .php-email-form textarea.form-control { 
  min-height: 160px; resize: vertical; 
}

/* ===== Autofill Chrome/Edge/Safari ===== */
.get-started .php-email-form input.form-control:-webkit-autofill,
.get-started .php-email-form input.form-control:-webkit-autofill:focus,
.get-started .php-email-form textarea.form-control:-webkit-autofill,
.get-started .php-email-form textarea.form-control:-webkit-autofill:focus {
  -webkit-text-fill-color: #e9edf1;
  caret-color: #e9edf1;
  -webkit-box-shadow: 0 0 0 1000px #15171a inset;
  box-shadow: 0 0 0 1000px #15171a inset;
  transition: background-color 9999s ease-out 0s;
}

/* iOS: elimina brillo al enfocar tel/email */
.get-started .php-email-form input[type="tel"],
.get-started .php-email-form input[type="email"],
.get-started .php-email-form input[type="text"]{
  -webkit-appearance: none; appearance: none; background-clip: padding-box;
}

/* Botón */
.get-started .php-email-form button {
  color: var(--contrast-color); background: var(--accent-color);
  border: 0; padding: 12px 28px; border-radius: 6px;
  font-weight: 800; transition: .25s;
}
.get-started .php-email-form button:hover {
  background: color-mix(in srgb, var(--accent-color), transparent 15%);
}

/* (Opcional) estados de validación */
.get-started .php-email-form .form-control.is-invalid,
.get-started .php-email-form .form-control:invalid:focus {
  border-color: #ff6b6b;
  box-shadow: 0 0 0 3px rgba(255,107,107,.2);
}
.get-started .php-email-form .form-control.is-valid,
.get-started .php-email-form .form-control:valid:focus {
  border-color: #35c27e;
  box-shadow: 0 0 0 3px rgba(53,194,126,.2);
}


/* Info items */
.get-started .info-item{background:var(--surface-color);box-shadow:0 0 20px rgba(0,0,0,.1);padding:24px 0 30px;border-radius:10px;width:100%;}
.get-started .info-item i{color:var(--accent-color);width:56px;height:56px;font-size:24px;display:flex;justify-content:center;align-items:center;border-radius:50%;border:2px dotted color-mix(in srgb,var(--accent-color),transparent 40%);}
.get-started .info-item h3{font-size:18px;font-weight:700;color:color-mix(in srgb,var(--default-color),transparent 20%);margin:10px 0;}
.get-started .info-item p{margin:0;font-size:14px;}

/* ===== CTA (claro) ===== */
.call-to-action .btn{font-weight:800;border-radius:8px;padding:12px 20px;}
.call-to-action .btn-primary{background:var(--accent-color);border-color:var(--accent-color);color:var(--contrast-color);}
.call-to-action .btn-primary:hover{background:color-mix(in srgb,var(--accent-color),transparent 15%);border-color:color-mix(in srgb,var(--accent-color),transparent 15%);}

/* ===== FAQ ===== */
.faq .faq-card{background:var(--surface-color);border:1px solid color-mix(in srgb,var(--default-color),transparent 85%);border-radius:12px;padding:22px;box-shadow:0 8px 22px rgba(0,0,0,.14);}
.faq .faq-card i{color:var(--accent-color);font-size:22px;}
.faq .faq-card h3{color:var(--heading-color);margin:10px 0;font-weight:800;}
.faq .faq-list{display:flex;flex-direction:column;gap:12px;}
.faq .faq-item{background:var(--surface-color);border-radius:10px;border:1px solid color-mix(in srgb,var(--default-color),transparent 88%);padding:16px 18px;position:relative;}
.faq .faq-item h3{font-size:18px;font-weight:800;color:var(--heading-color);margin:0;cursor:pointer;}
.faq .faq-item .faq-content{display:none;margin-top:10px;}
.faq .faq-item.faq-active .faq-content{display:block;}
.faq .faq-item .faq-toggle{position:absolute;right:14px;top:14px;cursor:pointer;color:var(--accent-color);}

/* ===== Equipment (Swiper 1/2/3) ===== */
.equipment .equipment-header{margin-bottom:50px;}
.equipment .equipment-header h2{position:relative;font-size:36px;font-weight:700;margin-bottom:20px;padding-bottom:20px;color:var(--heading-color);}
.equipment .equipment-header h2::before{content:"";position:absolute;width:70px;height:4px;background:var(--accent-color);bottom:0;left:0;border-radius:2px;}
.equipment .equipment-header p{font-size:17px;color:color-mix(in srgb,var(--default-color),transparent 25%);max-width:600px;margin-bottom:0;}
@media (max-width:991px){
  .equipment .equipment-header{text-align:center;margin-bottom:30px;}
  .equipment .equipment-header h2::before{left:50%;transform:translateX(-50%);}
}
.equipment .equipment-controls{display:flex;gap:12px;}
.equipment .equipment-control-btn{width:46px;height:46px;display:flex;align-items:center;justify-content:center;background:var(--surface-color);border:1.5px solid color-mix(in srgb,var(--default-color),transparent 85%);border-radius:50%;color:var(--default-color);font-size:18px;cursor:pointer;transition:all .2s;}
.equipment .equipment-control-btn:hover{transform:translateY(-2px);border-color:var(--accent-color);color:var(--accent-color);box-shadow:0 8px 18px color-mix(in srgb,var(--default-color),transparent 90%);}
.equipment .equipment-slider{padding:10px 5px 40px;}
.equipment .swiper-wrapper{height:auto!important;}
.equipment .swiper-slide{height:auto;display:flex;}
.equipment .equipment-card{position:relative;border-radius:12px;overflow:hidden;background:var(--surface-color);border:1px solid color-mix(in srgb,var(--default-color),transparent 90%);box-shadow:0 6px 20px rgba(0,0,0,.08);transition:all .3s;height:100%;display:flex;flex-direction:column;width:100%;}
.equipment .equipment-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,.12);border-color:color-mix(in srgb,var(--accent-color),transparent 70%);}
.equipment .equip-image img{width:100%;height:220px;object-fit:cover;display:block;border-bottom:1px solid color-mix(in srgb,var(--default-color),transparent 85%);transition:transform .5s;}
.equipment .equipment-card:hover .equip-image img{transform:scale(1.05);}
.equipment .equip-content{padding:16px;text-align:left;display:flex;flex-direction:column;gap:8px;}
.equipment .equip-content h3{font-size:1.1rem;font-weight:800;color:var(--heading-color);margin:0;}
.equipment .equip-subtitle{display:block;font-size:.95rem;font-weight:600;color:var(--accent-color);margin:0 0 6px;}
.equipment .equip-specs{list-style:none;padding:0;margin:0;display:grid;gap:6px;font-size:.95rem;line-height:1.55;color:color-mix(in srgb,var(--default-color),transparent 10%);}
.equipment .equip-specs i{color:var(--accent-color);margin-right:6px;}

/* ===== Footer ===== */
.footer{background:#000;color:#f1f1f1;padding:40px 0 20px;font-size:15px;line-height:1.6;}
.footer a{color:rgba(255,255,255,.85);text-decoration:none;transition:color .2s,opacity .2s;}
.footer a:hover{color:var(--accent-color);}
