/* ── Layout ── */
.int-page { display:flex; flex-direction:column; min-height:100%; background:#fafafe; font-family:'Segoe UI',system-ui,-apple-system,sans-serif; }

/* ── Header ── */
.int-header { background:#fff; padding:8px 8px 24px; position:relative; overflow:hidden; border-bottom:1px solid #f0ecfc; }
.int-header__watermark { position:absolute; pointer-events:none; user-select:none; font-size:clamp(48px,7vw,110px); font-weight:900; text-transform:uppercase; color:#c4b5fd; opacity:0.22; line-height:1; white-space:nowrap; letter-spacing:-3px; top:16px; left:48px; z-index:0; }


.int-header__inner { max-width:1200px; margin:0 auto; display:flex; justify-content:center; align-items:center; position:relative; z-index:1; margin-top:10px; }


.int-header__left { display:flex; flex-direction:column; }
h1.int-header__title { font-size:clamp(32px,4vw,58px); font-weight:900; color:#16103a; line-height:1.05; letter-spacing:-2px; margin:6px 0 14px; text-transform:uppercase; }
.int-header__desc { font-size:14px; color:#7a6faa; line-height:1.75; max-width:480px; }
.int-header__stats { display:flex; align-items:center; gap:0; background:rgba(196,181,253,0.12); border:1px solid rgba(167,139,250,0.2); border-radius:20px; padding:24px 32px; backdrop-filter:blur(8px); }
.int-stat { display:flex; flex-direction:column; align-items:center; gap:4px; padding:0 24px; }
.int-stat__div { width:1px; height:40px; background:rgba(167,139,250,0.25); flex-shrink:0; }
.int-stat__num { font-size:32px; font-weight:900; color:#5b21b6; line-height:1; letter-spacing:-1px; }
.int-stat__label { font-size:10px; font-weight:700; letter-spacing:0.09em; text-transform:uppercase; color:#9580c8; }

/* ── Mapa mundial ── */
.int-map-wrap { position:relative; height:320px; border-bottom:1px solid #ede8f8; }
.int-leaflet { width:100%; height:100%; }
.int-popup-wrap .leaflet-popup-content-wrapper { border-radius:12px; padding:0; border:1px solid rgba(167,139,250,0.28); box-shadow:0 12px 36px rgba(88,28,235,0.15); overflow:hidden; }
.int-popup-wrap .leaflet-popup-content { margin:0; line-height:1; }
.int-popup-wrap .leaflet-popup-tip-container { display:none; }
.int-map-popup { padding:14px 16px 16px; display:flex; flex-direction:column; gap:4px; min-width:195px; }
.imp-tipo { font-size:9.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#7c3aed; }
.imp-nombre { font-size:13px; font-weight:700; color:#16103a; line-height:1.35; display:block; margin-top:1px; }
.imp-loc { font-size:11.5px; color:#7a6faa; margin-top:1px; }
.imp-badge { display:inline-block; font-size:10px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; border-radius:99px; padding:2px 9px; margin-top:6px; align-self:flex-start; }
.imp-badge--proximo { background:#ede9fe; color:#5b21b6; }
.imp-badge--fin { background:#f1f5f9; color:#94a3b8; }
.int-tooltip { display:flex; flex-direction:column; gap:2px; max-width:220px; }
.int-tooltip strong { font-size:12px; color:#16103a; line-height:1.35; }
.int-tooltip span { font-size:11px; color:#7a6faa; }

/* ── Filtros ── */
.int-filtros { background:#fafafe; border-bottom:1px solid rgba(167,139,250,0.15); border-top:1px solid rgba(167,139,250,0.1); padding:14px 48px; position:sticky; top:0; z-index:100; box-shadow:0 2px 16px rgba(109,40,217,0.05); }
.int-filtros__inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; }
.int-filtros__selects { display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:center; background:#fff; border:1px solid rgba(167,139,250,0.22); border-radius:99px; padding:5px 6px; box-shadow:0 1px 8px rgba(109,40,217,0.05); }
.int-filter-pill { position:relative; display:flex; align-items:center; }
.int-filter-pill svg { position:absolute; right:12px; pointer-events:none; color:#9580c8; transition:color 0.15s; }
.int-select { -webkit-appearance:none; appearance:none; height:34px; padding:0 32px 0 14px; border:1.5px solid transparent; border-radius:99px; font-size:12.5px; font-weight:500; color:#5a5080; background:transparent; font-family:inherit; cursor:pointer; transition:border-color 0.15s,background 0.15s,color 0.15s; min-width:120px; }
.int-select:hover { border-color:rgba(167,139,250,0.3); background:rgba(167,139,250,0.05); }
.int-select:focus { outline:none; border-color:rgba(124,58,237,0.4); background:rgba(196,181,253,0.08); }
.int-select--active { border-color:rgba(124,58,237,0.35)!important; background:rgba(196,181,253,0.14)!important; color:#5b21b6!important; font-weight:700; }
.int-clear-btn { height:34px; padding:0 14px; border:none; border-radius:99px; font-size:11.5px; font-weight:700; color:#7c3aed; background:rgba(196,181,253,0.18); cursor:pointer; font-family:inherit; transition:background 0.15s; white-space:nowrap; letter-spacing:0.02em; }
.int-clear-btn:hover { background:rgba(196,181,253,0.32); }
.int-filtros__result { display:flex; flex-direction:column; align-items:center; padding:0 4px 0 16px; gap:0; }
.int-filtros__result-num { font-size:20px; font-weight:900; color:#7c3aed; line-height:1; letter-spacing:-0.5px; }
.int-filtros__result-label { font-size:9.5px; font-weight:600; letter-spacing:0.07em; text-transform:uppercase; color:#9580c8; }

/* ── Acordeón horizontal ── */
.int-hacc-outer { background:#fafafe; border-top:1px solid rgba(167,139,250,0.12); overflow:hidden; }
.int-hacc { display:flex; height:340px; width:100%; max-width:1200px; margin:0 auto; overflow:hidden; }
.int-hacc-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; flex:1; gap:14px; color:#9580c8; font-size:13px; }
.int-hacc__item { display:flex; flex-direction:row; overflow:hidden; flex:0 0 88px; border-right:1px solid rgba(167,139,250,0.1); transition:flex 0.55s cubic-bezier(0.4,0,0.2,1); }
.int-hacc__item:last-child { border-right:none; }
.int-hacc__item--open { flex:1; }
.int-hacc__trigger { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; position:relative; width:88px; flex-shrink:0; height:100%; padding:14px 0 58px; background:none; border:none; border-left:2px solid transparent; cursor:pointer; font-family:inherit; overflow:hidden; transition:background 0.2s,border-left-color 0.25s; }
.int-hacc__trigger:hover { background:rgba(167,139,250,0.04); }
.int-hacc__item--open .int-hacc__trigger { background:rgba(167,139,250,0.07); border-left-color:var(--reg-color,#7c3aed); }
.int-hacc__label { writing-mode:vertical-lr; transform:rotate(180deg); font-size:24px; font-weight:900; letter-spacing:0.04em; text-transform:uppercase; color:var(--reg-color,#7c3aed); opacity:0.16; white-space:nowrap; overflow:hidden; flex-shrink:1; transition:opacity 0.22s; }
.int-hacc__trigger:hover .int-hacc__label { opacity:0.44; }
.int-hacc__item--open .int-hacc__label { opacity:0.86; }
.int-hacc__count { writing-mode:vertical-lr; transform:rotate(180deg); position:absolute; bottom:26px; font-size:18px; font-weight:900; letter-spacing:-0.5px; line-height:1; color:var(--reg-color,#7c3aed); opacity:0.2; white-space:nowrap; transition:opacity 0.22s; }
.int-hacc__trigger:hover .int-hacc__count { opacity:0.48; }
.int-hacc__item--open .int-hacc__count { opacity:0.82; }
.int-hacc__body { flex:1; overflow-y:auto; overscroll-behavior:contain; min-width:0; }
.int-hacc__body::-webkit-scrollbar { width:4px; }
.int-hacc__body::-webkit-scrollbar-thumb { background:rgba(167,139,250,0.28); border-radius:99px; }
.int-hacc__body-hdr { display:flex; align-items:baseline; gap:12px; padding:12px 18px 8px; position:sticky; top:0; background:#fafafe; border-bottom:1px solid rgba(167,139,250,0.1); z-index:1; }
.int-hacc__body-title { font-size:12px; font-weight:900; color:var(--reg-color,#5b21b6); letter-spacing:0.05em; text-transform:uppercase; opacity:0.75; }
.int-hacc__body-count { font-size:10px; font-weight:700; color:#9580c8; text-transform:uppercase; letter-spacing:0.08em; }
.int-hacc .int-cards-grid { grid-template-columns:repeat(3,1fr); gap:11px; padding:12px 16px 20px; }

/* ── Cards ── */
.int-cards-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; padding:16px 22px 28px; }
.int-card { background:#fff; border:1px solid rgba(167,139,250,0.2); border-radius:12px; padding:14px 15px 13px; cursor:pointer; transition:box-shadow 0.2s,border-color 0.2s,transform 0.18s; position:relative; overflow:hidden; }
.int-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--card-color,#7c3aed); transform:scaleX(0); transform-origin:left; transition:transform 0.22s ease; }
.int-card:hover { box-shadow:0 8px 28px rgba(109,40,217,0.1); transform:translateY(-2px); }
.int-card:hover::before,.int-card--selected::before { transform:scaleX(1); }
.int-card--selected { border-color:var(--card-color,#7c3aed); box-shadow:0 10px 36px rgba(109,40,217,0.14); }
.int-card__top { display:flex; align-items:center; gap:6px; margin-bottom:7px; }
.int-card__tipo { font-size:7px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--card-color,#7c3aed); }
.int-badge { font-size:10px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; border-radius:99px; padding:2px 8px; }
.int-badge--proximo { background:#ede9fe; color:#5b21b6; }
.int-badge--finalizado { background:#f1f5f9; color:#94a3b8; }
.int-cards-grid .int-card__title { font-size:14px !important; font-weight:700; color:#16103a; line-height:1.35; margin-bottom:7px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.int-card__loc { display:flex; align-items:center; gap:6px; margin-bottom:6px; flex-wrap:wrap; }
.int-card__loc-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.int-card__loc span { font-size:12.5px; color:#555; }
.int-card__loc strong { color:#16103a; }
.int-card__region { font-size:10.5px!important; color:#9580c8!important; background:#f5f0ff; border-radius:99px; padding:1px 8px; }
.int-card__fecha { display:flex; align-items:center; gap:5px; font-size:11px; color:#7a6faa; margin-bottom:7px; }
.int-card__meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.int-card__sector { font-size:11px; color:#8878b8; line-height:1.4; flex:1; }
.int-mod-badge { font-size:10px; font-weight:700; letter-spacing:0.04em; border-radius:99px; padding:2px 8px; white-space:nowrap; }
.int-mod-badge--presencial { background:#dcfce7; color:#166534; }
.int-mod-badge--virtual { background:#dbeafe; color:#1e40af; }
.int-mod-badge--hibrido,.int-mod-badge--h\u00edbrido { background:#fef3c7; color:#92400e; }
.int-mod-badge--semipresencial { background:#fce7f3; color:#9d174d; }
.int-card__expanded { margin-top:14px; padding-top:14px; border-top:1px solid rgba(167,139,250,0.15); display:flex; flex-direction:column; gap:8px; }
.int-card__disciplina { font-size:12.5px; color:#3a3360; line-height:1.5; }
.int-card__org,.int-card__limite { font-size:12px; color:#7a6faa; line-height:1.5; }
.int-card__org em,.int-card__limite em { color:#9580c8; font-style:normal; font-weight:600; }
.int-card__links { display:flex; gap:8px; flex-wrap:wrap; margin-top:4px; }
.int-card__link { font-size:12px; font-weight:700; border-radius:8px; padding:5px 12px; text-decoration:none; transition:opacity 0.15s; }
.int-card__link:hover { opacity:0.8; }
.int-card__link--web { background:var(--card-color,#7c3aed); color:#fff; }
.int-card__link--ins { background:#f0edf8; color:var(--card-color,#7c3aed); }

/* ── Responsive ── */
@media (max-width:1100px) { .int-hacc .int-cards-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:800px) {


  /* Acordeón: el trigger debe pintarse antes que el body en columna,
     y las regiones cerradas no deben ocupar espacio */
  .int-hacc__trigger { order:-1; }
  .int-hacc__item:not(.int-hacc__item--open) .int-hacc__body { display:none; }

  /* Filtros: reservar espacio para el widget de accesibilidad de gov.co
     (fixed, top-right) y pasar los selects a grid 2x2 en vez de flex-wrap */
  .int-filtros { padding:12px 56px 12px 20px; }
  .int-filtros__inner { flex-direction:column; align-items:stretch; gap:10px; }
  .int-filtros__selects { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:8px; }
  .int-filter-pill { width:100%; }
  .int-select { width:100%; min-width:0; height:40px;text-align: center; }
  .int-clear-btn { grid-column:1 / -1; height:38px; }
  .int-filtros__result { padding:4px 0 0; }

  .int-header { padding:20px 20px 36px; }
  .int-header__inner { grid-template-columns:1fr; gap:28px; }
  
  .int-header__watermark { font-size:42px; left:20px; }
  .int-header__stats { padding:18px 16px; }
  .int-stat { padding:0 14px; }
  .int-stat__num { font-size:26px; }
  .int-filtros { padding:12px 20px; }
  .int-map-wrap { height:180px; }
  .int-hacc { flex-direction:column; height:auto; max-width:100%; }
  .int-hacc__item { flex-direction:column; flex:none; border-right:none; border-bottom:1px solid rgba(167,139,250,0.1); }
  .int-hacc__item--open { flex:none; }
  .int-hacc__trigger { flex-direction:row; align-items:center; width:100%; height:54px; padding:0 20px 0 16px; gap:12px; overflow:hidden; border-right:none; border-bottom:2px solid transparent; justify-content:flex-start; border-left:none; }
  .int-hacc__item--open .int-hacc__trigger { border-bottom-color:var(--reg-color,#7c3aed); border-left-color:transparent; }
  .int-hacc__label { writing-mode:horizontal-tb; transform:none; font-size:12px; letter-spacing:0.1em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
  .int-hacc__count { writing-mode:horizontal-tb; transform:none; position:static; font-size:18px; order:-1; }
  .int-hacc__body { max-height:380px; }
  .int-hacc .int-cards-grid { grid-template-columns:1fr; padding:10px 16px 20px; }
}