/* ===== Automatización e IA — estilos específicos de página ===== */
:root{
  --ai-green:#4ade80;
  --ai-cyan:#22d3ee;
  --ai-dark-1:#071a10;
  --ai-dark-2:#0a1f2e;
  --ai-dark-3:#081a22;
  --ai-grey-green:#7fa899;
  --ai-grey-blue:#aebaca;
  --ai-text-navy:#1d293d;
  --ai-text-grey:#62748e;
  --ai-glass-border:rgba(34,211,238,.25);
  --ai-glass-bg:rgba(10,31,46,.55);
  --ai-gradient:linear-gradient(90deg,var(--ai-green),var(--ai-cyan));
}

/* current nav link: no hover color change, stays green */
.main-nav a.active,
.main-nav a.active:hover{color:var(--green);}

/* ---------- shared dark-section helpers ---------- */
.auto-hero,
.auto-what,
.auto-ia,
.final-cta{
  position:relative;
  overflow:hidden;
  color:#fff;
}
.auto-neural{
  position:absolute;inset:-10%;z-index:0;pointer-events:none;
  background-image:radial-gradient(rgba(74,222,128,.16) 1.4px, transparent 1.4px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 70% 35%, #000 0%, transparent 70%);
  mask-image:radial-gradient(ellipse 70% 60% at 70% 35%, #000 0%, transparent 70%);
  opacity:.7;
}
.auto-neural-2{-webkit-mask-image:radial-gradient(ellipse 60% 55% at 85% 15%, #000 0%, transparent 70%);mask-image:radial-gradient(ellipse 60% 55% at 85% 15%, #000 0%, transparent 70%);}
.auto-neural-3{-webkit-mask-image:radial-gradient(ellipse 65% 55% at 20% 20%, #000 0%, transparent 70%),radial-gradient(ellipse 55% 45% at 85% 90%, #000 0%, transparent 70%);mask-image:radial-gradient(ellipse 65% 55% at 20% 20%, #000 0%, transparent 70%),radial-gradient(ellipse 55% 45% at 85% 90%, #000 0%, transparent 70%);}
.auto-neural-4{-webkit-mask-image:radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 72%);mask-image:radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 72%);}

.grad-text{
  background:var(--ai-gradient);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  display:inline-block;
}
.accent-grad{
  background:var(--ai-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;
}

.eyebrow-chip{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(74,222,128,.12);border:1px solid rgba(74,222,128,.3);
  color:var(--ai-green);font-family:'Inter',sans-serif;font-weight:700;font-size:12px;
  letter-spacing:2.5px;text-transform:uppercase;padding:7px 16px;border-radius:999px;margin-bottom:20px;
}

/* buttons unique to this page */
.btn-gradient{
  background:var(--ai-gradient);color:#0b1c14;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;
  box-shadow:0 8px 24px rgba(74,222,128,.32),0 0 0 1px rgba(74,222,128,.15) inset;
}
.btn-outline-green{
  background:rgba(74,222,128,.08);color:var(--ai-green);border:1.5px solid rgba(74,222,128,.55);
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;
}
.auto-manual .btn-outline-green{color:var(--green-dark);border-color:var(--green);background:rgba(85,192,54,.06);}

/* ================= HERO ================= */
.auto-hero{
  background:linear-gradient(162deg, var(--ai-dark-1) 24%, var(--ai-dark-2) 68%, var(--ai-dark-3) 95%);
  padding:88px 24px 96px;
}
.auto-hero-wrap{
  position:relative;z-index:1;display:flex;align-items:center;gap:48px;flex-wrap:wrap;
}
.auto-hero-content{flex:1;min-width:340px;max-width:560px;}
.auto-badge-pill{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(74,222,128,.12);border:1px solid rgba(74,222,128,.32);
  color:var(--ai-green);font-family:'Inter',sans-serif;font-weight:600;font-size:13px;
  padding:8px 18px;border-radius:999px;margin-bottom:24px;
}
.auto-badge-pill .icon{width:16px;height:16px;}
.auto-hero-content h1{
  font-family:'Manrope',sans-serif;font-weight:800;color:#fff;
  font-size:clamp(32px,4.6vw,56px);line-height:1.1;letter-spacing:-1px;margin:0 0 20px;
}
.auto-hero-content p{
  font-family:'Plus Jakarta Sans',sans-serif;color:var(--ai-grey-green);font-size:16px;line-height:1.6;
  max-width:460px;margin:0 0 32px;
}
.auto-hero-actions{display:flex;gap:16px;flex-wrap:wrap;}

.auto-hero-visual{flex:1;min-width:300px;max-width:501px;position:relative;display:flex;justify-content:center;}
.auto-mascot{width:100%;max-width:420px;filter:drop-shadow(0 30px 50px rgba(0,0,0,.45));}
.auto-float-card{
  position:absolute;display:flex;align-items:center;gap:12px;
  background:var(--ai-glass-bg);backdrop-filter:blur(10px);
  border:1px solid var(--ai-glass-border);border-radius:16px;padding:14px 18px;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}
.auto-float-card b{display:block;font-family:'Inter',sans-serif;font-weight:700;font-size:13px;color:#fff;}
.auto-float-card small{font-family:'Inter',sans-serif;font-size:11px;color:var(--ai-grey-blue);}
.fc-icon{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.fc-icon .icon{width:18px;height:18px;}
.fc-icon-green{background:rgba(74,222,128,.18);color:var(--ai-green);}
.fc-icon-cyan{background:rgba(34,211,238,.18);color:var(--ai-cyan);}
.fc-1{top:6%;left:-6%;}
.fc-2{bottom:10%;right:-4%;}

/* ================= QUÉ PUEDES AUTOMATIZAR ================= */
.auto-what{
  background:linear-gradient(31deg, var(--ai-dark-1) 18%, var(--ai-dark-2) 59%, var(--ai-dark-3) 82%);
  padding:96px 24px;
}
.auto-what .wrap{position:relative;z-index:1;}
.auto-what-head{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;margin-bottom:64px;flex-wrap:wrap;}
.auto-what-heading{max-width:640px;}
.auto-what-heading h2{
  font-family:'Manrope',sans-serif;font-weight:800;color:#fff;
  font-size:clamp(26px,3.6vw,36px);letter-spacing:-.5px;line-height:1.2;margin:0 0 16px;
}
.auto-what-heading p{font-family:'Plus Jakarta Sans',sans-serif;color:var(--ai-grey-green);font-size:16px;line-height:1.6;max-width:520px;}
.auto-glow-logo{
  width:64px;height:64px;border-radius:50%;flex-shrink:0;
  background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.35);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 40px rgba(74,222,128,.35);
}
.auto-glow-logo img{width:34px;height:34px;object-fit:contain;}

.workflow{
  display:flex;justify-content:space-between;gap:12px;position:relative;
  margin-bottom:72px;flex-wrap:wrap;
}
.workflow-line{
  position:absolute;top:52px;left:8%;right:8%;height:2px;
  background:linear-gradient(90deg,var(--ai-green),var(--blue));z-index:0;
}
.workflow-step{
  flex:1;min-width:150px;display:flex;flex-direction:column;align-items:center;text-align:center;
  position:relative;z-index:1;
}
.wf-num{
  font-family:'Inter',sans-serif;font-weight:700;font-size:12px;color:var(--ai-dark-1);
  background:var(--ai-gradient);width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin-bottom:12px;
}
.wf-circle{
  width:64px;height:64px;border-radius:16px;background:#fff;color:var(--green-dark);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px;
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.wf-circle .icon{width:28px;height:28px;}
.workflow-step p{font-family:'Inter',sans-serif;font-weight:600;font-size:13px;color:#fff;line-height:1.45;max-width:170px;}

.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:56px;}
.benefit-card{
  background:#fff;border-radius:18px;padding:28px 24px;
  box-shadow:0 10px 26px rgba(0,0,0,.22);
}
.benefit-icon{
  width:48px;height:48px;border-radius:12px;background:rgba(85,192,54,.1);color:var(--green-dark);
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;
}
.benefit-icon .icon{width:24px;height:24px;}
.benefit-card h4{font-family:'Inter',sans-serif;font-weight:700;font-size:16px;color:var(--navy);margin:0 0 10px;line-height:1.35;}
.benefit-rule{width:28px;height:3px;border-radius:999px;background:var(--green);margin-bottom:12px;}
.benefit-card p{font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;color:var(--body-gray);line-height:1.55;}

.auto-center-cta{display:flex;justify-content:center;}

/* ================= MENOS TIEMPO EN LO MANUAL (claro) ================= */
.auto-manual{background:#fff;padding:96px 24px;}
.auto-manual-head{max-width:640px;margin:0 auto 48px;text-align:center;}
.auto-manual-head h2{
  font-family:'Manrope',sans-serif;font-weight:800;font-size:clamp(26px,3.6vw,36px);
  color:var(--ai-text-navy);letter-spacing:-.5px;line-height:1.2;margin:0 0 16px;
}
.auto-manual-head p{font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;color:var(--ai-text-grey);line-height:1.6;}

.chip-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-bottom:56px;}
.chip{
  display:inline-flex;align-items:center;gap:8px;
  background:#fff;border:1px solid var(--border);border-radius:999px;
  padding:10px 18px;font-family:'Inter',sans-serif;font-weight:600;font-size:14px;color:var(--ai-text-navy);
  box-shadow:0 2px 8px rgba(11,28,48,.05);
}
.chip .icon{width:16px;height:16px;color:var(--green-dark);}

.area-label{
  display:block;text-align:center;font-family:'Inter',sans-serif;font-weight:700;font-size:12px;
  letter-spacing:2px;text-transform:uppercase;color:#94a3b8;margin-bottom:24px;
}
.area-carousel-wrap{display:flex;align-items:center;gap:12px;max-width:1024px;margin:0 auto;}
.area-track{
  display:flex;gap:16px;overflow-x:auto;scroll-behavior:smooth;padding:6px 2px 16px;flex:1;
  scrollbar-width:thin;
}
.area-card{
  flex:0 0 200px;background:#fff;border:1px solid var(--border);border-radius:16px;
  padding:24px 20px;display:flex;flex-direction:column;gap:14px;
  box-shadow:0 4px 12px rgba(11,28,48,.05);
}
.area-icon{
  width:44px;height:44px;border-radius:50%;background:#edfaf4;color:var(--green-dark);
  display:flex;align-items:center;justify-content:center;
}
.area-icon .icon{width:22px;height:22px;}
.area-card b{font-family:'Inter',sans-serif;font-weight:700;font-size:15px;color:var(--ai-text-navy);}
.area-arrow{
  width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;color:var(--ai-text-navy);cursor:pointer;flex-shrink:0;
  box-shadow:0 2px 8px rgba(11,28,48,.08);
}
.area-arrow .icon{width:18px;height:18px;}
.area-prev .icon{transform:rotate(180deg);}

/* ================= IA QUE TRABAJA PARA TU GESTIÓN ================= */
.auto-ia{
  background:linear-gradient(31deg, var(--ai-dark-1) 18%, #0d2a2a 50%, var(--ai-dark-2) 82%);
  padding:96px 24px;
}
.auto-ia .wrap{position:relative;z-index:1;}
.auto-ia h2{
  font-family:'Manrope',sans-serif;font-weight:800;color:#fff;
  font-size:clamp(26px,3.6vw,36px);letter-spacing:-.5px;margin:0 0 16px;
}
.auto-ia-lead{
  font-family:'Plus Jakarta Sans',sans-serif;color:var(--ai-grey-blue);font-size:16px;line-height:1.6;
  max-width:640px;margin:0 0 40px;
}

.ai-feature-row{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:40px;}
.ai-feature-card{
  flex:1;min-width:150px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;
  background:var(--ai-glass-bg);backdrop-filter:blur(6px);
  border:1px solid var(--ai-glass-border);border-radius:16px;padding:24px 16px;
}
.ai-feature-icon{
  width:44px;height:44px;border-radius:50%;background:rgba(34,211,238,.14);color:var(--ai-cyan);
  display:flex;align-items:center;justify-content:center;box-shadow:0 0 18px rgba(34,211,238,.25);
}
.ai-feature-icon .icon{width:22px;height:22px;}
.ai-feature-card span:last-child{font-family:'Inter',sans-serif;font-weight:600;font-size:13px;color:#fff;line-height:1.4;}

.auto-ia-quote{
  text-align:center;font-family:'Plus Jakarta Sans',sans-serif;font-style:italic;font-weight:500;
  color:rgba(255,255,255,.85);font-size:18px;max-width:600px;margin:0 auto 72px;line-height:1.5;
}

.emilia-block{display:flex;gap:56px;align-items:center;flex-wrap:wrap;}
.emilia-visual{flex:1;min-width:300px;}
.emilia-badge{
  display:inline-flex;align-items:center;gap:8px;color:var(--ai-green);
  font-family:'Inter',sans-serif;font-weight:600;font-size:13px;margin-bottom:16px;
}
.emilia-badge .icon{width:16px;height:16px;}
.emilia-heading{
  font-family:'Manrope',sans-serif;font-weight:800;font-size:clamp(28px,3.6vw,38px);color:#fff;margin:0 0 24px;
}
.emilia-panel{
  border-radius:20px;overflow:hidden;position:relative;
  background:radial-gradient(circle at 30% 20%, rgba(74,222,128,.18), transparent 60%),
             linear-gradient(160deg, rgba(10,31,46,.9), rgba(7,26,16,.9));
  border:1px solid var(--ai-glass-border);
  box-shadow:0 0 60px rgba(74,222,128,.12) inset, 0 20px 50px rgba(0,0,0,.4);
  display:flex;align-items:center;justify-content:center;padding:24px;min-height:280px;
}
.emilia-panel img{max-width:260px;opacity:.94;filter:drop-shadow(0 20px 30px rgba(0,0,0,.4));}
.emilia-copy{flex:1;min-width:300px;}
.emilia-copy > p{font-family:'Plus Jakarta Sans',sans-serif;color:var(--ai-grey-blue);font-size:16px;line-height:1.65;margin:0 0 28px;}
.emilia-checklist{display:flex;flex-direction:column;gap:14px;margin-bottom:32px;}
.emilia-checklist li{display:flex;align-items:center;gap:12px;font-family:'Inter',sans-serif;font-weight:500;font-size:15px;color:#fff;}
.ec-check{
  width:24px;height:24px;border-radius:50%;background:rgba(74,222,128,.16);color:var(--ai-green);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.ec-check .icon{width:14px;height:14px;}

/* ================= CASOS DE USO (claro) ================= */
.auto-cases{background:#f8fafc;padding:96px 24px;}
.auto-cases-head{text-align:center;max-width:640px;margin:0 auto 56px;}
.auto-cases-head h2{
  font-family:'Manrope',sans-serif;font-weight:800;font-size:clamp(26px,3.6vw,36px);
  color:var(--ai-text-navy);letter-spacing:-.5px;margin-top:16px;
}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1152px;margin:0 auto;}
.case-card{
  background:#fff;border:1px solid var(--border);border-radius:20px;padding:32px 28px;
  box-shadow:0 6px 18px rgba(11,28,48,.06);display:flex;flex-direction:column;
}
.case-title{
  font-family:'Inter',sans-serif;font-weight:800;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--green-dark);margin-bottom:20px;
}
.case-label{font-family:'Inter',sans-serif;font-weight:700;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#94a3b8;margin-bottom:8px;display:block;}
.case-label-after{color:var(--green-dark);}
.case-before{font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;color:var(--ai-text-grey);line-height:1.5;margin-bottom:22px;}
.case-divider{height:2px;border-radius:999px;background:var(--ai-gradient);margin-bottom:22px;width:100%;}
.case-after{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:15px;color:var(--ai-text-navy);line-height:1.5;}

/* ================= CTA FINAL ================= */
.final-cta{
  background:linear-gradient(150deg, var(--ai-dark-1) 10%, var(--ai-dark-2) 55%, #04090a 100%);
  padding:112px 24px;text-align:center;
}
.final-cta-inner{position:relative;z-index:1;max-width:576px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.final-cta-badge{
  width:80px;height:80px;border-radius:50%;
  background:rgba(74,222,128,.1);border:1px solid rgba(74,222,128,.35);
  display:flex;align-items:center;justify-content:center;margin-bottom:32px;
  box-shadow:0 0 60px rgba(74,222,128,.35);
}
.final-cta-badge img{width:42px;height:42px;object-fit:contain;}
.final-cta-quote{
  font-family:'Plus Jakarta Sans',sans-serif;font-style:italic;font-weight:500;
  color:rgba(255,255,255,.85);font-size:clamp(22px,3.2vw,32px);line-height:1.4;margin-bottom:36px;
}
.final-cta-caption{
  display:block;margin-top:20px;color:var(--ai-cyan);font-family:'Inter',sans-serif;font-weight:600;font-size:13px;letter-spacing:.3px;
}

/* ================= Responsive ================= */
@media (max-width: 980px){
  .benefit-grid{grid-template-columns:repeat(2,1fr);}
  .case-grid{grid-template-columns:1fr;}
  .workflow{flex-direction:column;align-items:center;gap:32px;}
  .workflow-line{display:none;}
  .auto-what-head{flex-direction:column;}
  .fc-1{left:0;}
  .fc-2{right:0;}
}
@media (max-width: 640px){
  .benefit-grid{grid-template-columns:1fr;}
  .ai-feature-row{flex-direction:column;}
  .emilia-block{flex-direction:column;}
  .auto-hero-visual{margin-top:32px;}
  .auto-float-card{position:static;margin-top:12px;}
  .auto-hero-visual{flex-direction:column;align-items:center;}
}
