/* DEVARTIVA - HOMOLOGACION VISUAL SERVICIOS FASE1
   Aplica una capa final, no destructiva, sobre las landings dedicadas.
*/

/* Base compartida */
body.dev-service-page{
  --dv-navy:#071c33;
  --dv-navy-2:#0b2d50;
  --dv-blue:#1687f8;
  --dv-blue-2:#4db5ff;
  --dv-text:#10213e;
  --dv-muted:#667085;
  --dv-line:#dce5ef;
  --dv-soft:#f5f8fc;
  --dv-radius:18px;
  --dv-max:1440px;
  color:var(--dv-text);
}

body.dev-service-page > header{
  height:76px!important;
  min-height:76px!important;
  padding-left:max(5vw,28px)!important;
  padding-right:max(5vw,28px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  background:#fff!important;
  border-bottom:1px solid #e4eaf2!important;
  position:sticky!important;
  top:0!important;
  z-index:40!important;
}

body.dev-service-page > header img{
  width:185px!important;
  max-height:50px!important;
  object-fit:contain!important;
}

body.dev-service-page > header nav{
  display:flex!important;
  align-items:center!important;
  gap:24px!important;
}

body.dev-service-page > header nav a{
  font-size:14px!important;
  font-weight:750!important;
  text-decoration:none!important;
  color:#13233e!important;
}

/* Hero */
body.dev-service-page main > section:first-child{
  min-height:535px!important;
  padding:64px max(5vw,28px)!important;
  background:linear-gradient(120deg,#061728,#0b3157)!important;
  color:#fff!important;
}

body.dev-service-page main > section:first-child h1{
  font-size:clamp(42px,4.8vw,66px)!important;
  line-height:1.03!important;
  letter-spacing:-.045em!important;
  margin-top:14px!important;
  margin-bottom:20px!important;
}

body.dev-service-page main > section:first-child p{
  line-height:1.58!important;
}

body.dev-service-page main > section:first-child .primary,
body.dev-service-page main > section:first-child .button.primary{
  background:var(--dv-blue)!important;
  color:#fff!important;
  border-radius:8px!important;
  min-height:50px!important;
  padding:0 20px!important;
  font-weight:850!important;
}

body.dev-service-page main > section:first-child .secondary{
  min-height:50px!important;
  padding:0 20px!important;
  border-radius:8px!important;
  border:1px solid #58b3ff!important;
  color:#fff!important;
}

/* Visuales hero conocidos */
body.dev-service-linux .linux-visual,
body.dev-service-software .soft-visual,
body.dev-service-ia .ia-visual,
body.dev-service-support .visual,
body.dev-service-n8n main > section:first-child > div:last-child{
  border-radius:20px!important;
  overflow:hidden!important;
  box-shadow:0 24px 65px rgba(0,0,0,.28)!important;
}

/* Imágenes */
body.dev-service-linux .linux-visual img,
body.dev-service-software .soft-visual > img,
body.dev-service-ia .ia-visual-photo > img,
body.dev-service-support .support-hero-img{
  width:100%!important;
  height:360px!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  margin:0!important;
}

/* Barras de capacidades */
body.dev-service-linux .dist,
body.dev-service-software .soft-capabilities,
body.dev-service-ia .ia-strip,
body.dev-service-support .strip{
  min-height:58px!important;
  padding:18px max(5vw,28px)!important;
  gap:28px!important;
  background:#f5f9fd!important;
  border-bottom:1px solid #dfe8f1!important;
  font-size:14px!important;
}

/* Secciones */
body.dev-service-page main > section:not(:first-child){
  scroll-margin-top:88px;
}

body.dev-service-linux .linux-section,
body.dev-service-software .soft-section,
body.dev-service-ia .ia-section,
body.dev-service-support .section{
  padding-top:76px!important;
  padding-bottom:76px!important;
}

body.dev-service-page h2{
  letter-spacing:-.035em!important;
}

/* Tarjetas de capacidades */
body.dev-service-linux .service-grid,
body.dev-service-software .soft-grid,
body.dev-service-ia .ia-grid,
body.dev-service-support .grid{
  gap:20px!important;
}

body.dev-service-linux .service-grid article,
body.dev-service-software .soft-grid article,
body.dev-service-ia .ia-grid article,
body.dev-service-support .grid article{
  border:1px solid var(--dv-line)!important;
  border-radius:var(--dv-radius)!important;
  padding:28px!important;
  background:#fff!important;
  box-shadow:0 12px 35px rgba(16,33,62,.045)!important;
}

/* Opciones comerciales: misma presencia en todos */
body.dev-service-page .dev-commercial-packages{
  padding:76px 0!important;
  background:#f6f9fd!important;
}
body.dev-service-page .dev-commercial-grid{
  gap:18px!important;
}
body.dev-service-page .dev-commercial-card{
  border-radius:18px!important;
  padding:26px!important;
  min-height:100%!important;
}
body.dev-service-page .dev-commercial-button,
body.dev-service-page .dev-commercial-wa{
  min-height:44px!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Formularios */
body.dev-service-linux .linux-contact,
body.dev-service-software .soft-contact,
body.dev-service-ia .ia-contact,
body.dev-service-support .contact{
  padding:76px max(5vw,28px)!important;
  gap:52px!important;
}

body.dev-service-linux .linux-contact form,
body.dev-service-software .soft-contact form,
body.dev-service-ia .ia-contact form,
body.dev-service-support .contact form{
  padding:28px!important;
  border-radius:18px!important;
  border:1px solid #dce5ef!important;
  box-shadow:0 18px 45px rgba(16,33,62,.07)!important;
}

body.dev-service-page form input,
body.dev-service-page form select,
body.dev-service-page form textarea{
  min-height:44px;
  border-radius:7px!important;
}

body.dev-service-page form textarea{
  min-height:130px;
}

/* Footer */
body.dev-service-page > footer{
  min-height:82px!important;
  padding:24px max(5vw,28px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  background:#041426!important;
  color:#b9cadc!important;
}

body.dev-service-page > footer img{
  width:145px!important;
  max-height:42px!important;
  object-fit:contain!important;
}

/* Ajustes particulares */
body.dev-service-support .support-brand-panel,
body.dev-service-software .soft-brand-panel,
body.dev-service-ia .ia-brand-panel{
  left:18px!important;
  bottom:18px!important;
}

body.dev-service-ia .ia-model-grid > div{
  min-height:108px!important;
}

/* Responsive */
@media(max-width:980px){
  body.dev-service-page > header nav a:not(:last-child){display:none}
  body.dev-service-page main > section:first-child{
    min-height:auto!important;
    padding-top:52px!important;
    padding-bottom:52px!important;
  }
  body.dev-service-page main > section:first-child h1{
    font-size:clamp(38px,8vw,56px)!important;
  }
  body.dev-service-linux .linux-visual img,
  body.dev-service-software .soft-visual > img,
  body.dev-service-ia .ia-visual-photo > img,
  body.dev-service-support .support-hero-img{
    height:320px!important;
  }
}

@media(max-width:640px){
  body.dev-service-page > header{
    height:70px!important;
    min-height:70px!important;
    padding-left:20px!important;
    padding-right:20px!important;
  }
  body.dev-service-page > header img{width:155px!important}
  body.dev-service-page main > section:first-child{
    padding-left:20px!important;
    padding-right:20px!important;
  }
  body.dev-service-linux .linux-visual img,
  body.dev-service-software .soft-visual > img,
  body.dev-service-ia .ia-visual-photo > img,
  body.dev-service-support .support-hero-img{
    height:260px!important;
  }
  body.dev-service-page > footer{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
}