/* Diseño Desarrollo Web · secciones específicas, sin modificar el CSS global */
.xw-benefit-strip{background:#3f207c;color:#fff;padding:0;}
.xw-benefit-strip .xw-benefit-shell{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:23px;padding-bottom:23px;background:linear-gradient(100deg,#4b2597,#381778);}
.xw-benefit{min-width:0;text-align:center;padding:9px 18px;border-right:1px solid rgba(18,8,40,.35);display:flex;flex-direction:column;justify-content:center;gap:3px;}
.xw-benefit:last-child{border-right:0;}
.xw-benefit strong{font-size:clamp(15px,1.35vw,21px);line-height:1.3;color:#fff;}
.xw-benefit span{font-size:13px;line-height:1.4;color:#ede4ff;}
.xw-difference{padding:76px 0 82px;background:#111;}
.xw-difference h2{margin:0 0 26px;font-size:clamp(29px,3.4vw,46px);letter-spacing:-.045em;line-height:1.1;color:#f5f4f2;}
.xw-difference-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.xw-difference-card{background:#191919;padding:30px 26px 32px;min-width:0;border-radius:7px;display:flex;flex-direction:column;align-items:flex-start;min-height:245px;}
.xw-difference-icon{width:62px;height:62px;display:flex;align-items:center;justify-content:center;background:#292929;border-radius:8px;margin-bottom:24px;color:#c9c9cd;}
.xw-difference-icon svg{width:35px;height:35px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.xw-difference-card h3{color:#f5f4f2;margin:0 0 9px;font-size:clamp(20px,1.8vw,25px);line-height:1.18;letter-spacing:-.025em;}
.xw-difference-card p{color:#aeb0b5;line-height:1.65;font-size:15px;margin:0;}
@media(max-width:900px){.xw-difference{padding:52px 0 58px}.xw-difference-grid{gap:12px}.xw-difference-card{padding:20px 17px;min-height:250px}.xw-difference-icon{width:52px;height:52px;margin-bottom:18px}.xw-difference-card h3{font-size:19px}}
@media(max-width:680px){.xw-benefit-strip .xw-benefit-shell{grid-template-columns:1fr;padding-top:10px;padding-bottom:10px}.xw-benefit{padding:13px 10px;border-right:0;border-bottom:1px solid rgba(18,8,40,.32)}.xw-benefit:last-child{border-bottom:0}.xw-benefit strong{font-size:16px}.xw-benefit span{font-size:12px}.xw-difference{padding:38px 0 42px}.xw-difference-grid{grid-template-columns:1fr}.xw-difference-card{min-height:auto;padding:22px 20px}.xw-difference-icon{margin-bottom:15px}}

/* Technology logos · isolated to web development page */
.xw-technologies{background:#111;padding:0 0 84px;}
.xw-technologies h2{margin:0 0 10px;font-size:clamp(28px,3vw,42px);letter-spacing:-.035em;line-height:1.14;color:#f4f4f4;}
.xw-technologies-lead{margin:0 0 30px;color:#aeb0b5;max-width:720px;font-size:16px;line-height:1.65;}
.xw-technologies-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;}
.xw-technology{min-width:0;min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;background:#191919;border:1px solid #292929;border-radius:7px;padding:20px 10px;}
.xw-technology img{display:block;width:52px;height:52px;object-fit:contain;opacity:.88;}
.xw-technology span{color:#dedee2;font-size:14px;font-weight:650;line-height:1.3;text-align:center;}
@media(max-width:1000px){.xw-technologies-grid{grid-template-columns:repeat(4,minmax(0,1fr));}.xw-technologies{padding-bottom:64px;}}
@media(max-width:640px){.xw-technologies{padding-bottom:44px}.xw-technologies-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.xw-technology{min-height:102px;padding:12px 5px;gap:10px}.xw-technology img{width:36px;height:36px}.xw-technology span{font-size:12px}.xw-technologies-lead{font-size:14px;margin-bottom:22px}}


/* Reparación localizada: Desarrollo Web - FAQ e imágenes responsivas.
   No modifica Inicio, cobertura ni el CSS global. */
.xw-faq-section .xw-mobile-section-banner { display:none !important; }
.xw-faq-section .xw-faq-layout,
.xw-faq-section .xw-faq-content,
.xw-faq-section .xw-faq-list { min-width:0 !important; }
.xw-faq-section .xw-faq-list,
.xw-faq-section .xw-faq-content {
  overflow:visible !important;
  overflow-y:visible !important;
  max-height:none !important;
  scrollbar-width:none !important;
}
.xw-faq-section .xw-faq-list::-webkit-scrollbar{display:none !important;}
@media (min-width:1025px) {
  .xw-faq-section{overflow:clip !important;}
  .xw-faq-section .xw-faq-layout{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:32px !important;
    min-height:800px !important;
    height:auto !important;
    align-items:stretch !important;
    overflow:visible !important;
  }
  .xw-faq-section .xw-faq-media{
    display:block !important;
    grid-column:1 !important;
    grid-row:1 !important;
    align-self:stretch !important;
    position:relative !important;
    min-height:800px !important;
    height:auto !important;
    overflow:hidden !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
  }
  .xw-faq-section .xw-faq-media img{
    position:absolute !important;
    top:auto !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:auto !important;
    height:100% !important;
    max-width:100% !important;
    object-fit:contain !important;
    object-position:right bottom !important;
  }
  .xw-faq-section .xw-faq-content{
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    height:auto !important;
    min-height:0 !important;
    padding:48px 0 !important;
  }
  .xw-faq-section .xw-faq-list{flex:0 0 auto !important;height:auto !important;}
}
@media (max-width:1024px){
  .xw-faq-section .xw-faq-media{display:none !important;}
  .xw-faq-section .xw-faq-layout{
    display:block !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }
  .xw-faq-section .xw-faq-content{
    display:block !important;
    height:auto !important;
    padding:0 !important;
    min-height:0 !important;
  }
  .xw-faq-section .xw-mobile-section-banner{
    display:block !important;
    width:100% !important;
    margin:20px 0 14px !important;
    overflow:hidden !important;
  }
  .xw-faq-section .xw-mobile-section-banner img{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    object-fit:contain !important;
  }
}


/* XIRIZ — Desarrollo Web: misma sombra lateral exterior que la franja CTA
   aplicada al bloque de beneficios. */
body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip,
body[data-route="/en/solutions/web-development/"] .xw-benefit-strip{
  position:relative;
  isolation:isolate;
  background:#3f207c;
}
body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip .xw-benefit-shell,
body[data-route="/en/solutions/web-development/"] .xw-benefit-strip .xw-benefit-shell{
  position:relative;
  z-index:1;
}
body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip::before,
body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip::after,
body[data-route="/en/solutions/web-development/"] .xw-benefit-strip::before,
body[data-route="/en/solutions/web-development/"] .xw-benefit-strip::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:clamp(28px,7vw,108px);
  pointer-events:none;
  z-index:0;
}
body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip::before,
body[data-route="/en/solutions/web-development/"] .xw-benefit-strip::before{
  left:0;
  background:linear-gradient(90deg, rgba(31,11,70,.46) 0%, rgba(31,11,70,.20) 52%, rgba(31,11,70,0) 100%);
}
body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip::after,
body[data-route="/en/solutions/web-development/"] .xw-benefit-strip::after{
  right:0;
  background:linear-gradient(270deg, rgba(31,11,70,.46) 0%, rgba(31,11,70,.20) 52%, rgba(31,11,70,0) 100%);
}
@media(max-width:680px){
  body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip::before,
  body[data-route="/soluciones/desarrollo-web/"] .xw-benefit-strip::after,
  body[data-route="/en/solutions/web-development/"] .xw-benefit-strip::before,
  body[data-route="/en/solutions/web-development/"] .xw-benefit-strip::after{
    width:22px;
  }
}


/* XIRIZ — Beneficios de Desarrollo Web con la misma sombra lateral
   exterior de la franja de consultoría. */
.xw-benefit-strip{
  background:#3f207c !important;
  overflow:visible !important;
}
.xw-benefit-strip .xw-benefit-shell{
  position:relative !important;
  isolation:isolate !important;
  background:linear-gradient(100deg,#4b2597,#381778) !important;
}
.xw-benefit-strip .xw-benefit-shell::before,
.xw-benefit-strip .xw-benefit-shell::after{
  content:"" !important;
  display:block !important;
  position:absolute;
  top:0;
  bottom:0;
  width:clamp(24px,3.5vw,56px);
  border:0;
  border-radius:0;
  pointer-events:none;
  z-index:0;
}
.xw-benefit-strip .xw-benefit-shell::before{
  right:100%;
  left:auto;
  background:linear-gradient(to left,rgba(12,5,35,.258),transparent);
}
.xw-benefit-strip .xw-benefit-shell::after{
  left:100%;
  right:auto;
  background:linear-gradient(to right,rgba(12,5,35,.258),transparent);
}
.xw-benefit-strip .xw-benefit{position:relative;z-index:1;}
@media (max-width:767px){
  .xw-benefit-strip .xw-benefit-shell::before,
  .xw-benefit-strip .xw-benefit-shell::after{display:none !important;}
}

/* Corrección: eliminar la sombra duplicada de la franja completa.
   Se conserva exclusivamente la sombra de .xw-benefit-shell. */
.xw-benefit-strip::before,
.xw-benefit-strip::after {
  content:none !important;
  display:none !important;
}

/* Desarrollo Web (ES/EN): igualar los colores de la franja de beneficios
   con las barras de consultoría, sin modificar estructura ni textos. */
.xw-benefit-strip{
  background:#595F7F !important;
  background-color:#595F7F !important;
}
.xw-benefit-strip .xw-benefit-shell{
  background:#595F7F !important;
  background-color:#595F7F !important;
}
.xw-benefit-strip .xw-benefit{
  border-color:rgba(29,29,29,.35) !important;
}
.xw-benefit-strip .xw-benefit span{
  color:#fff !important;
}
