/* =========================================================================
   Catálogo de servicios — modal sobrepuesto (ver catalogo-tesla-modal.html)
   Todo queda dentro de #catalog-modal para no chocar con css/style.css.
========================================================================= */

body.modal-lock{ overflow:hidden; }

#catalog-modal{
  --cm-navy:#060d1e;
  --cm-navy-2:#0d1830;
  --cm-blue:#0e5af2;
  --cm-blue-dark:#0a46c9;
  --cm-steel:#8A97A6;
  --cm-page:#FFFFFF;
  --cm-ink:#1B2635;
  --cm-pagew:880px;

  position:fixed; inset:0; z-index:1000;
  background:rgba(3,7,17,.78);
  backdrop-filter:blur(2px);
  display:none;
  align-items:flex-start; justify-content:center;
  padding:26px 16px;
  overflow-y:auto;
  font-family:'IBM Plex Sans', Arial, sans-serif;
  color:var(--cm-ink);
}
#catalog-modal.open{ display:flex; }
#catalog-modal *{ box-sizing:border-box; }
#catalog-modal img{ max-width:100%; display:block; }
#catalog-modal a{ color:inherit; }

#catalog-modal .modal-shell{ width:100%; max-width:calc(var(--cm-pagew) + 20px); position:relative; }
#catalog-modal .modal-close{ position:sticky; top:0; z-index:20; display:flex; justify-content:flex-end; margin-bottom:8px; }
#catalog-modal .modal-close button{
  background:#fff; border:none; width:42px; height:42px; border-radius:50%;
  font-size:20px; line-height:1; color:var(--cm-navy); cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.3);
  display:flex; align-items:center; justify-content:center;
}
#catalog-modal .modal-close button:hover{ background:var(--cm-blue); color:#fff; }

#catalog-modal .page{ margin:34px auto 24px; }
#catalog-modal .jumpnav{ position:sticky; top:0; z-index:15; border-radius:4px 4px 0 0; margin-top:52px; }
#catalog-modal footer.sitefoot{ color:#C7D0DB; padding-bottom:20px; }

#catalog-modal .jumpnav{ position:sticky; top:0; z-index:80; background:var(--cm-navy-2); border-bottom:3px solid var(--cm-blue); }
#catalog-modal .jumpnav-inner{
  max-width:var(--cm-pagew); margin:0 auto; padding:10px 20px;
  display:flex; align-items:center; flex-wrap:wrap; row-gap:6px; column-gap:14px;
  overflow-x:visible;
}
#catalog-modal .jumpnav .brand{ display:flex; align-items:center; gap:8px; white-space:nowrap; flex-shrink:0; margin-right:4px; }
#catalog-modal .jumpnav .brand img{ height:22px; width:auto; }
#catalog-modal .jumpnav a{
  color:#B7C4D6; font-size:11px; white-space:nowrap; text-decoration:none;
  font-family:'Exo 2',sans-serif; letter-spacing:.02em; text-transform:uppercase;
  padding:4px 0; border-bottom:2px solid transparent;
}
#catalog-modal .jumpnav a:hover{ color:#fff; border-color:var(--cm-blue); }

#catalog-modal .page{
  max-width:var(--cm-pagew); background:var(--cm-page);
  box-shadow:0 6px 26px rgba(6,13,30,.22), 0 1px 0 rgba(0,0,0,.04);
  position:relative; min-height:1000px; padding-bottom:60px; overflow:hidden;
  scroll-margin-top:110px;
}
#catalog-modal .page-topline{
  display:flex; justify-content:space-between; align-items:center;
  font-size:11px; color:var(--cm-blue); padding:14px 40px 8px;
  font-family:'Exo 2',sans-serif; font-weight:500;
}
#catalog-modal .tribar{ display:flex; height:8px; margin:0 40px 26px; }
#catalog-modal .tribar span{ flex:1; }
#catalog-modal .tribar span:nth-child(1){ background:var(--cm-navy); }
#catalog-modal .tribar span:nth-child(2){ background:var(--cm-blue); }
#catalog-modal .tribar span:nth-child(3){ background:var(--cm-steel); }

#catalog-modal .page-footer{ position:absolute; bottom:22px; right:40px; display:flex; align-items:center; gap:10px; }
#catalog-modal .page-footer .flogo img{ height:26px; width:auto; display:block; }
#catalog-modal .page-footer .pnum{
  font-family:'Exo 2',sans-serif; font-weight:700; color:var(--cm-navy); font-size:15px;
  border-left:2px solid var(--cm-steel); padding-left:10px;
}

#catalog-modal .section-title{
  display:inline-block; background:var(--cm-page); border-left:6px solid var(--cm-blue);
  padding:6px 16px; font-family:'Exo 2',sans-serif; font-weight:700; font-size:20px;
  color:var(--cm-navy); margin:0 40px 22px;
}

#catalog-modal .icon-badge{
  width:64px; height:64px; border-radius:50%; background:#fff; border:2px solid var(--cm-steel);
  display:flex; align-items:center; justify-content:center; box-shadow:0 3px 10px rgba(0,0,0,.15);
  flex-shrink:0; font-size:26px;
}

#catalog-modal .photoph{ background:#DCE3EC no-repeat center/cover; border:none; position:relative; overflow:hidden; }
#catalog-modal .photoph img{ width:100%; height:100%; object-fit:cover; display:block; }

#catalog-modal .cover{ padding-bottom:0; }
#catalog-modal .cover .page-topline{ color:var(--cm-blue); font-weight:500; }
#catalog-modal .cover-logo{ padding:18px 40px 26px; display:flex; align-items:center; justify-content:center; }
#catalog-modal .cover-logo img{ height:84px; width:auto; }
#catalog-modal .cover-tribar,
#catalog-modal .cover-tribar-2{ display:flex; height:9px; margin:0 0 4px; }
#catalog-modal .cover-tribar-2{ margin:4px 0 0; }
#catalog-modal .cover-tribar span,
#catalog-modal .cover-tribar-2 span{ flex:1; }
#catalog-modal .cover-tribar span:nth-child(1),
#catalog-modal .cover-tribar-2 span:nth-child(1){ background:var(--cm-navy); }
#catalog-modal .cover-tribar span:nth-child(2),
#catalog-modal .cover-tribar-2 span:nth-child(2){ background:var(--cm-blue); }
#catalog-modal .cover-tribar span:nth-child(3),
#catalog-modal .cover-tribar-2 span:nth-child(3){ background:var(--cm-steel); }
#catalog-modal .cover-photos{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:4px; }
#catalog-modal .cover-photos .photoph{ aspect-ratio:3/4; }
#catalog-modal .cover-title{
  text-align:center; padding:56px 20px 60px; font-family:'Exo 2',sans-serif;
  font-weight:800; font-size:44px; color:var(--cm-navy); letter-spacing:.03em;
}
#catalog-modal .cover-title small{
  display:block; font-family:'IBM Plex Sans',sans-serif; font-weight:500; font-size:15px;
  color:var(--cm-blue); letter-spacing:.06em; text-transform:uppercase; margin-top:10px;
}

#catalog-modal .toc{ padding:0 40px; }
#catalog-modal .toc h1{ font-family:'Exo 2',sans-serif; font-weight:700; font-size:22px; color:var(--cm-navy); margin-bottom:26px; letter-spacing:.03em; }
#catalog-modal .toc-row{ display:flex; align-items:baseline; gap:8px; padding:11px 0; border-bottom:1px dotted #C7D0DB; font-size:15px; }
#catalog-modal .toc-row b{ font-weight:700; color:var(--cm-ink); white-space:nowrap; }
#catalog-modal .toc-row .fill{ flex:1; border-bottom:1px dotted #C7D0DB; margin-bottom:4px; }
#catalog-modal .toc-row .pg{ font-weight:700; color:var(--cm-blue); font-family:'Exo 2',sans-serif; }
#catalog-modal .toc-row a{ text-decoration:none; color:inherit; display:flex; align-items:baseline; gap:8px; width:100%; }
#catalog-modal .toc-row:hover b{ color:var(--cm-blue); }

#catalog-modal .ind-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px 26px; padding:0 40px; }
#catalog-modal .ind-card figcaption{ font-family:'Exo 2',sans-serif; font-weight:700; font-size:14.5px; color:var(--cm-navy); margin-bottom:8px; }
#catalog-modal .ind-card .photoph{ aspect-ratio:16/9; border-radius:3px; }

#catalog-modal .about-wrap{ padding:0 40px; display:grid; grid-template-columns:1fr 220px; gap:30px; }
#catalog-modal .about-text h2{ font-family:'Exo 2',sans-serif; font-weight:700; font-size:18px; color:var(--cm-navy); margin:20px 0 10px; }
#catalog-modal .about-text h2:first-child{ margin-top:0; }
#catalog-modal .about-text p{ font-size:14.5px; color:#33404F; margin-bottom:12px; line-height:1.65; }
#catalog-modal .about-side .photoph{ aspect-ratio:3/4; margin-bottom:14px; border-radius:3px; }

#catalog-modal .svc-hero{ padding:30px 40px 20px; position:relative; }
#catalog-modal .svc-hero .photoph{ aspect-ratio:16/6.2; border-radius:3px; }
#catalog-modal .svc-hero .icon-badge{ position:absolute; left:56px; top:16px; z-index:3; }
#catalog-modal .svc-hero .svc-title{
  position:absolute; left:112px; top:36px; background:#fff; padding:8px 18px;
  font-family:'Exo 2',sans-serif; font-weight:700; font-size:18px; color:var(--cm-navy);
  box-shadow:0 2px 8px rgba(0,0,0,.12); max-width:70%;
}

#catalog-modal .svc-body{ padding:26px 40px 0; display:grid; grid-template-columns:1fr 260px; gap:34px; }
#catalog-modal .svc-body.reverse{ grid-template-columns:260px 1fr; }
#catalog-modal .svc-body.reverse .arrowcol{ order:1; }
#catalog-modal .svc-body.reverse .svc-text{ order:2; }
#catalog-modal .svc-text p{ font-size:14.5px; color:#33404F; line-height:1.7; margin-bottom:14px; }

#catalog-modal .arrowcol{ display:flex; flex-direction:column; gap:9px; }
#catalog-modal .arrow-item{
  background:var(--cm-navy); color:#fff; font-family:'Exo 2',sans-serif; font-weight:500; font-size:13px;
  letter-spacing:.01em; padding:11px 14px 11px 18px;
  clip-path: polygon(0 0, 88% 0, 100% 50%, 88% 100%, 0 100%);
}
#catalog-modal .arrow-item:nth-child(odd){ background:var(--cm-navy); }
#catalog-modal .arrow-item:nth-child(even){ background:var(--cm-blue); }

#catalog-modal .icon-strip{ display:flex; gap:16px; flex-wrap:wrap; margin-top:8px; }
#catalog-modal .icon-strip .isc{ display:flex; flex-direction:column; align-items:center; gap:6px; width:88px; }
#catalog-modal .icon-strip .isc .ring{
  width:52px; height:52px; border-radius:50%; border:2px solid var(--cm-blue);
  display:flex; align-items:center; justify-content:center; color:var(--cm-blue); font-size:16px;
}
#catalog-modal .icon-strip .isc span{ font-size:11px; color:var(--cm-navy); text-align:center; font-family:'Exo 2',sans-serif; }

#catalog-modal .chip-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
#catalog-modal .chip{
  background:var(--cm-navy); color:#fff; font-family:'Exo 2',sans-serif; font-size:12px;
  padding:8px 14px; clip-path: polygon(0 0, 92% 0, 100% 50%, 92% 100%, 0 100%);
}

#catalog-modal .callout{ background:#EEF3F8; border-left:4px solid var(--cm-blue); padding:14px 18px; margin-top:18px; font-size:13.5px; color:#33404F; }
#catalog-modal .callout b{ color:var(--cm-navy); }

#catalog-modal .split-page-block{ padding:0 40px 30px; border-bottom:1px solid #E1E6EC; margin-bottom:26px; }
#catalog-modal .split-page-block:last-of-type{ border-bottom:none; }
#catalog-modal .split-head{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
#catalog-modal .split-head .icon-badge{ width:46px; height:46px; position:static; font-size:20px; }
#catalog-modal .split-head h3{ font-family:'Exo 2',sans-serif; font-weight:700; font-size:17px; color:var(--cm-navy); }
#catalog-modal .split-page-block .photoph{ border-radius:3px; }

#catalog-modal .course-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:0 40px; }
#catalog-modal .course-item{
  background:var(--cm-navy); color:#fff; font-family:'Exo 2',sans-serif; font-size:14px; font-weight:500;
  padding:14px 20px; clip-path: polygon(0 0, 94% 0, 100% 50%, 94% 100%, 0 100%);
}
#catalog-modal .course-item:nth-child(3n+2){ background:var(--cm-blue); }
#catalog-modal .course-item:nth-child(3n){ background:#3D5A85; }

#catalog-modal .back-page{ padding:0; }
#catalog-modal .back-photo .photoph{ aspect-ratio:16/4; }
#catalog-modal .back-block{ background:linear-gradient(135deg, var(--cm-navy), var(--cm-navy-2)); color:#fff; padding:46px 44px; }
#catalog-modal .back-block .btitle{ display:flex; align-items:center; font-family:'Exo 2',sans-serif; font-weight:800; font-size:28px; letter-spacing:.01em; }
#catalog-modal .back-block .btitle img{ height:64px; width:auto; }
#catalog-modal .back-block .btitle em{ font-style:normal; color:#6FB1EA; }
#catalog-modal .back-block .bsub{ font-size:15px; color:#B7C4D6; margin:6px 0 26px; }
#catalog-modal .back-block .btagline{ font-size:14.5px; color:#DDE6F0; margin-bottom:24px; max-width:560px; }
#catalog-modal .contact-lines{ display:flex; flex-direction:column; gap:6px; font-size:14.5px; }
#catalog-modal .contact-lines a{ color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.3); }
#catalog-modal .contact-lines a:hover{ border-color:#6FB1EA; color:#6FB1EA; }
#catalog-modal .contact-lines .lbl{ color:#8FA6C2; font-family:'Exo 2',sans-serif; font-size:11px; letter-spacing:.08em; text-transform:uppercase; margin-top:14px; }

#catalog-modal footer.sitefoot{ max-width:var(--cm-pagew); margin:0 auto; text-align:center; color:#7B8898; font-size:12px; padding:20px 20px 0; }

@media (max-width:920px){
  #catalog-modal .page{ margin:0; box-shadow:none; min-height:auto; }
  #catalog-modal .ind-grid,
  #catalog-modal .svc-body,
  #catalog-modal .svc-body.reverse,
  #catalog-modal .about-wrap,
  #catalog-modal .course-grid{ grid-template-columns:1fr !important; }
  #catalog-modal .svc-body.reverse .arrowcol{ order:2; }
  #catalog-modal .svc-body.reverse .svc-text{ order:1; }
  #catalog-modal .svc-hero .svc-title{ position:static; margin-top:14px; box-shadow:none; padding:0; }
  #catalog-modal .svc-hero .icon-badge{ position:static; margin-bottom:10px; }
  #catalog-modal .cover-photos{ grid-template-columns:1fr; }
  #catalog-modal .cover-title{ font-size:32px; }
  #catalog-modal .page-footer{ position:static; justify-content:flex-end; padding:0 40px; margin-top:20px; }
}
@media (prefers-reduced-motion: reduce){ #catalog-modal{ scroll-behavior:auto; } }