
/* Catálogo responsive IISO */
body.catalog-open{overflow:hidden}
#modal-servicios.modal-overlay{position:fixed;inset:0;z-index:100000;background:rgba(10,25,60,.72);padding:clamp(10px,3vw,36px);align-items:center;justify-content:center;overflow:hidden}
#modal-servicios .modal-content{box-sizing:border-box;width:min(1120px,100%);max-width:1120px;max-height:calc(100dvh - 24px);margin:0;overflow-y:auto;overscroll-behavior:contain;border-radius:22px;padding:clamp(18px,3vw,36px);background:#f7f9ff;position:relative;transform:none}
.catalog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}
.catalog-head h2{font-size:clamp(25px,3vw,38px);line-height:1.2;margin:4px 0 12px;color:#0e1e4a}
.catalog-head p{margin:0;color:#5c6986}.catalog-head .catalog-kicker{font-size:12px;letter-spacing:.15em;color:#1750d7;font-weight:800}
.catalog-close{border:1px solid #d6dfed;border-radius:12px;background:white;font-size:27px;line-height:1;min-width:44px;min-height:44px;cursor:pointer;color:#14244c}
.catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.catalog-item{min-width:0;border:1px solid #dfe6f3;background:#fff;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:18px;box-shadow:0 3px 14px rgba(20,46,110,.04)}
.catalog-item-top h3{margin:0 0 9px;color:#122653;font-size:clamp(17px,1.6vw,21px);line-height:1.3;overflow-wrap:anywhere}
.catalog-item-top span{font-size:13px;color:#66748f}
.catalog-toggle{align-self:flex-start;border:1px solid #bcd0ff;border-radius:10px;background:#eef4ff;color:#174ed1;font-weight:700;padding:11px 16px;cursor:pointer;min-height:44px}
.catalog-toggle:hover,.catalog-toggle:focus-visible{background:#dce9ff}
.catalog-detail{border-top:1px solid #e3e9f3;padding-top:14px}
.catalog-detail[hidden]{display:none}
.catalog-detail ul{padding:0;list-style:none;margin:0 0 18px;display:grid;gap:9px}
.catalog-detail li{position:relative;padding-left:22px;font-size:14px;line-height:1.5;color:#273b5c}
.catalog-detail li::before{content:'✓';position:absolute;left:0;color:#1760d9;font-weight:800}
.catalog-contact{display:inline-block;background:#164bd5;color:white!important;border-radius:10px;text-decoration:none;padding:12px 15px;font-weight:700;font-size:14px}
@media(max-width:700px){#modal-servicios.modal-overlay{padding:0;align-items:stretch}#modal-servicios .modal-content{width:100%;max-height:100dvh;height:100dvh;border-radius:0;padding:20px 16px 32px}.catalog-grid{grid-template-columns:1fr;gap:12px}.catalog-item{padding:17px}.catalog-head{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){#modal-servicios *,#modal-servicios{animation:none!important;transition:none!important}}

/* Identidad corporativa IISO en el catálogo: marca de agua tenue */
#modal-servicios .modal-content{isolation:isolate;background:#f5f8ff;scroll-behavior:smooth}
#modal-servicios .modal-content::before{
 content:"";position:absolute;z-index:0;pointer-events:none;
 top:30px;right:50px;width:clamp(190px,27vw,430px);aspect-ratio:1;
 background:url('../assets/img/logoiiso.png') center/contain no-repeat;
 opacity:.16;
}
#modal-servicios .catalog-head,#modal-servicios .catalog-grid{position:relative;z-index:1}
#modal-servicios .catalog-item{box-shadow:0 8px 28px rgba(20,45,105,.055)}
#modal-servicios .catalog-close{flex-shrink:0}
#modal-servicios .catalog-scroll-top{
 position:absolute;z-index:20;right:clamp(22px,5vw,75px);bottom:clamp(22px,5vh,52px);
 width:54px;height:54px;border:0;border-radius:50%;
 background:#008d46;color:white;display:grid;place-items:center;
 box-shadow:0 9px 25px rgba(0,80,45,.24);cursor:pointer;
 opacity:0;visibility:hidden;transform:translateY(12px);
 transition:opacity .2s,transform .2s,visibility .2s;
}
#modal-servicios .catalog-scroll-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
#modal-servicios .catalog-scroll-top:hover{background:#00753a}
#modal-servicios .catalog-scroll-top:focus-visible{outline:3px solid #ffffff;outline-offset:3px}
#modal-servicios .catalog-scroll-top svg{width:27px;height:27px}
@media(max-width:700px){
 #modal-servicios .modal-content::before{top:65px;right:-50px;width:260px;opacity:.12}
 #modal-servicios .catalog-scroll-top{right:20px;bottom:22px;width:50px;height:50px}
}
@media(prefers-reduced-motion:reduce){#modal-servicios .modal-content{scroll-behavior:auto}#modal-servicios .catalog-scroll-top{transition:none}}

/* Corrección: la marca de agua debe quedar sobre el fondo del modal, no detrás de él. */
#modal-servicios .modal-content::before { z-index:0 !important; }
#modal-servicios .catalog-head, #modal-servicios .catalog-grid { position:relative;z-index:1; }
/* Flecha fija dentro del área visible, por encima del modal y sus tarjetas. */
#modal-servicios .catalog-scroll-top {position:fixed !important;z-index:100001 !important;right:clamp(20px,5vw,75px);bottom:clamp(20px,5vh,52px);}

/* Refinamiento corporativo: icono por tarjeta, sin marca de agua */
#modal-servicios .modal-content::before { content:none !important; display:none !important; }
#modal-servicios .catalog-item-top { display:flex; align-items:center; gap:13px; }
#modal-servicios .catalog-brand-icon { width:42px; height:42px; flex:0 0 42px; object-fit:contain; border-radius:10px; background:#eef3ff; padding:6px; box-sizing:border-box; }
#modal-servicios .catalog-item-heading { min-width:0; }
#modal-servicios .catalog-item-heading h3 { margin:0 0 6px; }
#modal-servicios .catalog-scroll-top { background:#1649d7 !important; color:#fff !important; box-shadow:0 9px 25px rgba(22,73,215,.24) !important; }
#modal-servicios .catalog-scroll-top:hover { background:#103aa9 !important; }
@media(max-width:700px) { #modal-servicios .catalog-brand-icon { width:36px; height:36px; flex-basis:36px; padding:5px; } }

/* La flecha azul se mantiene separada del botón flotante de WhatsApp */
#modal-servicios .catalog-scroll-top{bottom:100px!important;right:24px!important}
@media(max-width:700px){#modal-servicios .catalog-scroll-top{bottom:94px!important;right:22px!important}}
