/*
 * site.css
 * -----------------------------------------------------------------------------
 * Este archivo concentra la base visual del portal final.
 *
 * Secciones principales:
 * 1. Tokens y reglas base compartidas
 * 2. Layout global del portal
 * 3. Sidebar, toolbar y tarjetas de convocatorias
 * 4. Footer, cookies y modales
 * 5. Accesibilidad visual y responsive
 *
 * -----------------------------------------------------------------------------
 */

/* Tokens, resets y utilidades base */
:root {
  --font-sans:'Roboto', Arial, sans-serif;
  --font-slab:'Roboto Slab', 'Roboto', Arial, sans-serif;
  --bg:#EDF0F5;--surface:#fff;--primary:#25306B;--primary-2:#006BB9;--primary-mid:#2C3D9E;--text:#1f2d3a;--muted:#5f6f7c;--border:#d8e1e8;--shadow:0 10px 24px rgba(37,48,107,.08);--success:#1f7a4c;--success-soft:#e7f4ec;--warning:#b35b00;--warning-soft:#fff1e5;--chip:#EDF0F5;--chip-text:#25306B;--radius:16px;
}
*{box-sizing:border-box}body{margin:0;font-family:var(--font-sans);background:var(--bg);color:var(--text);line-height:1.5}a{color:inherit}button,input,select{font:inherit}.container{width:min(1180px,calc(100% - 32px));margin:0 auto}
.topbar{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}.topbar .container{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0}.brand img{display:block;height:48px;width:auto}.nav{display:flex;gap:16px;flex-wrap:wrap}.nav a{text-decoration:none;color:var(--text);font-size:15px;font-weight:700}
.hero{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-2) 100%);color:#fff;padding:40px 0 44px;border-bottom-left-radius:28px;border-bottom-right-radius:28px}.hero h1{margin:0 0 10px;font-size:38px;line-height:1.1}.hero p{margin:0;max-width:820px;color:rgba(255,255,255,.88);font-size:18px}
.note,.filters-box,.sidebar-panel{margin:24px 0 18px;padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:var(--shadow)}.note-kicker{display:inline-flex;align-items:center;min-height:32px;padding:6px 10px;border-radius:999px;background:var(--chip);color:var(--primary);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.note h2{margin:12px 0 8px;color:var(--primary);font-size:28px}.note p{margin:0;color:var(--muted)}
.filters-grid,.filters-row,.search-row,.group-grid,.compact-row,.collapse-panel{display:grid;gap:12px}.filters-grid.is-5{grid-template-columns:2fr 1fr 1fr 1.2fr 1fr}.filters-grid.is-4{grid-template-columns:2fr 1fr 1fr 1.2fr}.filters-row.is-4{grid-template-columns:repeat(4,minmax(0,1fr))}.search-row{grid-template-columns:minmax(0,1fr) auto}.group-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.compact-row{grid-template-columns:2fr 1fr 1fr 1fr 1fr 1fr}.quick-row{display:flex;flex-wrap:wrap;gap:8px}.field label{display:block;margin-bottom:6px;color:var(--muted);font-size:13px;font-weight:700}.field input,.field select,.ghost-btn,.submit-btn{width:100%;min-height:44px;border:1px solid var(--border);border-radius:12px;background:#fff;color:var(--text);padding:0 12px}.submit-btn,.ghost-btn{display:inline-flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;text-decoration:none}.submit-btn{background:var(--primary);border-color:var(--primary);color:#fff}.ghost-btn{color:var(--primary)}.range-box{min-height:44px;border:1px solid var(--border);border-radius:12px;background:#fff;padding:6px 12px;display:grid;align-content:center}.range-box span{color:var(--muted);font-size:11px;text-transform:uppercase;font-weight:700;letter-spacing:.04em}.range-box strong{color:var(--primary);font-size:14px}.filter-chip,.quick-chip,.sidebar-pill{display:inline-flex;align-items:center;min-height:34px;padding:6px 10px;border-radius:999px;background:var(--chip);color:var(--primary);font-size:13px;font-weight:700}.summary-row{margin:0 0 16px}.sidebar-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px}.sidebar-panel{align-self:start;display:grid;gap:14px}.sidebar-block{display:grid;gap:8px}.sidebar-block h4{margin:0;color:var(--primary);font-size:16px}.sidebar-pill{background:#f8fbfd;border:1px solid var(--border);color:var(--text);border-radius:10px}.group-card{padding:14px;border:1px solid var(--border);border-radius:12px;background:#f8fbfd;display:grid;gap:10px}.group-card h4{margin:0;color:var(--primary);font-size:18px}
.results-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:0 0 18px}.results-head h3{margin:0 0 6px;font-size:30px;color:var(--primary)}.results-head p{margin:0;color:var(--muted)}.results-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.results-tools label{font-size:14px;font-weight:700;color:var(--muted)}.results-tools select{min-height:42px;border:1px solid var(--border);border-radius:10px;background:var(--surface);padding:0 12px;color:var(--text)}.results-list{display:grid;gap:14px}
.call-card{display:grid;grid-template-columns:112px minmax(0,1fr) 240px;gap:18px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;cursor:pointer}.call-card:hover,.call-card:focus-visible{transform:translateY(-2px);border-color:#b8cad8;box-shadow:0 14px 30px rgba(11,60,93,.12);outline:none}.call-card__status{display:flex;justify-content:center}.status-badge{display:inline-flex;align-items:center;justify-content:center;min-width:96px;min-height:42px;padding:8px 10px;border-radius:12px;font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;text-align:center}.status-badge.is-new{background:var(--success-soft);color:var(--success)}.status-badge.is-warning{background:var(--warning-soft);color:var(--warning)}.call-card__code{margin:0 0 6px;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.call-card__main h4{margin:0 0 8px;font-size:25px;line-height:1.12;color:var(--primary)}.call-card__main h4 a{text-decoration:none}.call-card__main h4 a:hover{text-decoration:underline}.call-card__org{margin:0 0 10px;color:var(--text);font-size:17px;font-weight:700}.call-card__meta{display:flex;flex-wrap:wrap;gap:8px 14px;margin:0;padding:0;list-style:none;color:var(--muted);font-size:14px}.call-card__meta li + li::before{content:'\00B7';margin-right:14px;color:#91a4b3}.call-card__side{display:grid;justify-items:end;gap:10px;text-align:right}.deadline-label{margin:0;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.deadline-value{margin:-4px 0 0;color:#09314d;font-size:18px;font-weight:700}.tag-pill{display:inline-flex;align-items:center;min-height:34px;padding:6px 10px;border-radius:10px;background:var(--chip);color:var(--chip-text);font-size:13px;font-weight:700}.calendar-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--primary);font-size:14px;font-weight:700;padding:0 14px;cursor:pointer}.calendar-icon{width:18px;height:18px;border:2px solid currentColor;border-radius:4px;position:relative;display:inline-block;flex:0 0 18px}.calendar-icon::before,.calendar-icon::after{content:'';position:absolute;top:-4px;width:2px;height:6px;background:currentColor}.calendar-icon::before{left:4px}.calendar-icon::after{right:4px}.calendar-icon span{position:absolute;left:2px;right:2px;top:5px;height:2px;background:currentColor;display:block}
.modal-backdrop{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(18,32,46,.55)}.modal-backdrop.is-open{display:flex}.modal-card{width:min(520px,100%);background:#fff;border-radius:18px;padding:24px;box-shadow:0 24px 48px rgba(0,0,0,.18)}.modal-card h3{margin:0 0 8px;color:var(--primary);font-size:28px;line-height:1.15}.modal-card p{margin:0 0 14px;color:var(--muted)}.modal-card ul{margin:0 0 18px;padding-left:18px}.modal-close{border:0;border-radius:999px;background:var(--primary);color:#fff;padding:10px 16px;font-weight:700;cursor:pointer}
@media (max-width:1024px){.filters-grid.is-5,.filters-grid.is-4,.filters-row.is-4,.group-grid,.compact-row,.sidebar-layout,.collapse-panel{grid-template-columns:1fr 1fr}.call-card{grid-template-columns:100px minmax(0,1fr)}.call-card__side{grid-column:2;justify-items:start;text-align:left}}@media (max-width:720px){.hero h1{font-size:30px}.hero p{font-size:16px}.topbar .container,.results-head,.sidebar-layout,.filters-grid.is-5,.filters-grid.is-4,.filters-row.is-4,.search-row,.group-grid,.compact-row,.collapse-panel{grid-template-columns:1fr}.call-card{grid-template-columns:1fr}.call-card__status,.call-card__side{justify-content:flex-start;justify-items:start;text-align:left}.call-card__main h4{font-size:22px}}

/* Estructura global del layout final */
body { background: var(--bg); }
body.modal-open { overflow: hidden; }
/* Accesibilidad inicial y cabecera superior */
.skip-link { position: absolute; left: 12px; top: -48px; z-index: 50; padding: 10px 14px; border-radius: 10px; background: #fff; color: var(--primary); text-decoration: none; font-weight: 700; box-shadow: var(--shadow); }
.skip-link:focus { top: 12px; }
.support-strip { background: var(--gov-navy); color: #fff; font-size: 14px; }
.support-strip .container { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; flex-wrap: wrap; }
.support-strip strong { font-weight: 700; }
.support-strip a { color: #fff; text-decoration: none; }
.support-phone { display: inline-flex; align-items: center; gap: 6px; }
.support-phone__icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; }
.support-phone__icon svg { width: 18px; height: 18px; display: block; }
.support-phone-link { display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-decoration: none; }
.support-phone-link:hover, .support-phone-link:focus-visible { text-decoration: underline; outline: none; }
.topbar { position: sticky; top: 0; z-index: 30; }
.main-nav { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.main-nav a { text-decoration: none; color: var(--text); font-size: 15px; font-weight: 700; }
.header-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.header-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 14px; border-radius: 999px; text-decoration: none; font-weight: 700; border: 1px solid var(--border); background: #fff; color: var(--primary); }
.header-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.hero { background: transparent; padding: 24px 0 18px; border-radius: 0; }
.hero-shell { display: grid; grid-template-columns: minmax(0, 1.45fr) 360px; gap: 20px; }
.search-panel, .promo-panel { background: #fff; border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow); }
.search-panel { padding: 24px; }
.hero-kicker { display: inline-flex; align-items: center; min-height: 34px; padding: 6px 10px; border-radius: 999px; background: var(--blue-soft); color: var(--primary); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 12px; }
.search-panel h1 { margin: 0 0 8px; color: var(--primary); font-size: 38px; line-height: 1.08; }
.search-panel p { margin: 0 0 18px; color: var(--muted); font-size: 17px; }
.search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; }
.search-submit { min-height: 44px; border: 0; border-radius: 12px; background: var(--primary); color: #fff; padding: 0 18px; font-weight: 700; cursor: pointer; }
.quick-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.quick-link { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 999px; background: #f7fbff; border: 1px solid #cfe0ee; color: var(--primary); text-decoration: none; font-weight: 700; }
.promo-panel { padding: 20px; background: linear-gradient(180deg, #fff 0%, #f6fbff 100%); }
.promo-panel h2 { margin: 0 0 10px; color: var(--primary); font-size: 26px; line-height: 1.15; }
.promo-panel p { margin: 0 0 16px; color: var(--muted); }
main { padding: 4px 0 42px; }
.content-shell { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 22px; }
.sidebar-panel { margin: 0; position: sticky; top: 90px; display: grid; align-content: start; gap: 12px; }
.sidebar-panel h2 { margin: 0; color: var(--primary); font-size: 29px; line-height: 1.1; }
.sidebar-muted { margin: 0; color: var(--muted); font-size: 15px; }
.active-filters { margin: 0; display: grid; gap: 6px; }
.active-filters.is-empty { display: none; }
.active-filters .chip-row { display: flex; flex-wrap: wrap; gap: 6px; }
.active-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 6px 10px 6px 12px; border: 1px solid #9bb7cf; border-radius: 999px; background: var(--blue-soft); color: var(--primary); font-size: 13px; font-weight: 700; cursor: pointer; }
.active-chip:hover, .active-chip:focus-visible { background: var(--chip); border-color: var(--primary-2); outline: none; }
.active-chip:focus-visible { box-shadow: 0 0 0 3px rgba(0, 74, 143, .16); }
.active-chip__remove { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border: 1px solid rgba(0, 74, 143, .22); border-radius: 999px; background: rgba(255,255,255,.78); font-size: 12px; line-height: 1; }
.filter-box { display: grid; gap: 6px; margin: 0; }
.filter-box + .filter-box { margin-top: 0; padding-top: 0; border-top: 0; }
.filter-box h3 { margin: 0; font-size: 13px; color: var(--text); }
.filter-links { display: grid; gap: 6px; }
.filter-link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--border); background: #fff; text-decoration: none; color: var(--text); font-weight: 700; }
.filter-link.active { background: #dceeff; border-color: #6da2c8; color: var(--primary); }
.filter-box select { width: 100%; min-height: 42px; border: 1px solid var(--border); border-radius: 12px; background: #fff; color: var(--text); padding: 0 10px; }
/* Toolbar de resultados: contador, estado y ordenamiento */
.results-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 24px; align-items: end; margin-bottom: 16px; }
.results-toolbar > :first-child { display: grid; align-content: end; min-height: 0; padding-bottom: 2px; }
.results-toolbar h2 { margin: 0; color: var(--primary); font-size: 34px; line-height: 1.1; }
.results-toolbar p { margin: 0; color: var(--muted); }
#results-source-note:empty { display: none; }
.results-actions { display: grid; grid-template-columns: repeat(2, 248px); gap: 12px 16px; align-items: end; justify-content: end; }
.results-actions__group { display: grid; gap: 6px; min-width: 0; width: 100%; }
.results-actions label { color: var(--muted); font-size: 14px; font-weight: 700; margin-bottom: 2px; }
.results-actions select { min-height: 42px; border: 1px solid var(--border); border-radius: 10px; background: #fff; padding: 0 12px; }
.results-actions__group:not(.status-filter) .combo-select { width: 100%; min-width: 0; }
.results-actions__group:not(.status-filter) .combo-select__trigger { width: 100%; min-height: 48px; border: 1px solid var(--border); border-radius: 14px; background: #fff; color: var(--text); padding: 0 38px 0 12px; font: inherit; text-align: left; }
.results-actions__group:not(.status-filter) .combo-select__trigger::after { right: 14px; }
.results-actions__group:not(.status-filter) .combo-select.is-open .combo-select__trigger,
.results-actions__group:not(.status-filter) .combo-select__trigger:focus-visible { outline: 2px solid rgba(0, 74, 143, .22); outline-offset: 1px; border-color: #7ba6cf; background: #fff; }
.results-actions__group:not(.status-filter) .combo-select__panel { border-radius: 14px; }
.status-filter { min-width: 0; width: 100%; }
.status-filter__control { display: flex; align-items: center; gap: 6px; min-height: 48px; padding: 0 14px; border: 2px solid var(--border); border-radius: 14px; transition: background .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease; }
.status-filter__dot { width: 12px; height: 12px; border-radius: 999px; flex: none; background: currentColor; }
.status-filter select { width: 100%; min-height: 40px; border: 0; padding: 0 22px 0 0; background: transparent; color: inherit; font: inherit; font-weight: 700; appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 12px) calc(50% - 3px), calc(100% - 6px) calc(50% - 3px); background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; border-radius: 0; }
.status-filter select:focus-visible { outline: none; }
.status-filter__control:focus-within { box-shadow: 0 0 0 3px rgba(0, 74, 143, .14); }
.status-filter[data-status-tone="abierta"] .status-filter__control { background: linear-gradient(180deg, #f1fff7 0%, #dff4e8 100%); border-color: #2f8b5d; color: #125637; box-shadow: inset 0 0 0 1px rgba(47,139,93,.12); }
.status-filter[data-status-tone="evaluation"] .status-filter__control { background: linear-gradient(180deg, #fff8e9 0%, #ffe9bb 100%); border-color: #d08b08; color: #7a4b00; box-shadow: inset 0 0 0 1px rgba(208,139,8,.12); }
.status-filter[data-status-tone="finalizada"] .status-filter__control { background: linear-gradient(180deg, #fff1f1 0%, #f7d9d9 100%); border-color: #c14949; color: #7f2328; box-shadow: inset 0 0 0 1px rgba(193,73,73,.12); }
.status-filter[data-status-tone="abierta"] .combo-select__panel { border-color: #78c096; background: #f8fffb; }
.status-filter[data-status-tone="evaluation"] .combo-select__panel { border-color: #efb957; background: #fffdf8; }
.status-filter[data-status-tone="finalizada"] .combo-select__panel { border-color: #d78585; background: #fff9f9; }
.status-filter .combo-select { width: 100%; }
.status-filter .combo-select__trigger { min-height: 40px; padding: 0 22px 0 0; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; box-shadow: none; }
.status-filter .combo-select__trigger::after { right: 2px; border-color: currentColor; }
.status-filter .combo-select.is-open .combo-select__trigger,
.status-filter .combo-select__trigger:focus-visible { outline: none; background: transparent; box-shadow: none; }
.status-filter .combo-select__panel { padding: 8px; border-width: 2px; border-radius: 14px; }
.combo-select--no-search .combo-select__search { display: none; }
.combo-select--no-search .combo-select__options { margin-top: 0; }
.combo-select__status-value { display: inline-flex; align-items: center; gap: 6px; }
.combo-select__status-dot { width: 12px; height: 12px; border-radius: 999px; flex: none; background: currentColor; }
.combo-select__option--status { display: flex; align-items: center; gap: 6px; min-height: 42px; border: 1px solid transparent; border-radius: 12px; font-weight: 700; }
.combo-select__option--abierta { background: #e3f7ea; border-color: #7fc19a; color: #125637; }
.combo-select__option--abierta:hover,
.combo-select__option--abierta:focus-visible,
.combo-select__option--abierta.is-selected { background: #cfeeda; color: #125637; border-color: #2f8b5d; }
.combo-select__option--evaluation { background: #fff1cf; border-color: #efbe61; color: #7a4b00; }
.combo-select__option--evaluation:hover,
.combo-select__option--evaluation:focus-visible,
.combo-select__option--evaluation.is-selected { background: #ffe0a0; color: #7a4b00; border-color: #d08b08; }
.combo-select__option--finalizada { background: #fbe1e1; border-color: #d98f8f; color: #7f2328; }
.combo-select__option--finalizada:hover,
.combo-select__option--finalizada:focus-visible,
.combo-select__option--finalizada.is-selected { background: #f3caca; color: #7f2328; border-color: #c14949; }
.cards { display: grid; gap: 16px; }
/* Tarjetas de convocatoria */
.job-card { position: relative; overflow: hidden; background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 18px 18px 20px; box-shadow: var(--shadow); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.job-card:hover, .job-card:focus-within { transform: translateY(-2px); border-color: #b8cad8; box-shadow: 0 14px 30px rgba(0,41,76,.12); outline: none; }
.deadline-pill { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px; border-radius: 10px; background: #edf1f4; color: #111; font-weight: 700; }
.deadline-pill--evaluation { background: #edf1f4; color: #111; }
.deadline-pill--evaluation .deadline-dot { background: #2f7cc0; }
.deadline-dot { width: 12px; height: 12px; border-radius: 50%; background: #199a78; }
.ribbon { position: absolute; width: 84px; height: 84px; overflow: hidden; pointer-events: none; z-index: 2; }
.ribbon::before, .ribbon::after { content: ""; position: absolute; z-index: -1; display: block; border: 4px solid transparent; }
.ribbon-top-right { top: -6px; right: 0; }
.ribbon-top-right::before, .ribbon-top-right::after { border-top-color: transparent; border-right-color: transparent; }
.ribbon-top-right::before { top: 0; left: 0; }
.ribbon-top-right::after { bottom: 0; right: 0; }
.ribbon.warning::before, .ribbon.warning::after { border-color: #d28a1f; }
.ribbon.new::before, .ribbon.new::after { border-color: #267cc7; }
.ribbon__label { position: absolute; display: flex; align-items: center; justify-content: center; width: 144px; height: 24px; padding: 0; text-align: center; text-transform: uppercase; letter-spacing: .03em; font-size: 9px; font-weight: 700; line-height: 1; color: #fff; box-shadow: 0 3px 6px rgba(0,0,0,.08); transform-origin: center; }
.ribbon-top-right .ribbon__label { top: 18px; left: -31px; transform: rotate(45deg); }
.ribbon.warning .ribbon__label { background: linear-gradient(180deg, #f8c361 0%, #f0a329 100%); }
.ribbon.new .ribbon__label { background: linear-gradient(180deg, #58b2f0 0%, #2f92de 100%); }
.ribbon__label::before { content: attr(data-ribbon-label); display: block; }
.job-card .ribbon + .deadline-pill { display: flex; width: 100%; box-sizing: border-box; margin-top: 8px; margin-right: 0; padding-right: 86px; }
.job-card h3 { margin: 14px 0 14px; max-width: 860px; font-size: 25px; line-height: 1.08; color: var(--primary); }
.job-card h3 a { color: var(--primary); text-decoration: none; transition: color .18s ease; }
.job-card h3 a:hover { text-decoration: underline; }
.job-card h3 a:focus-visible { text-decoration: underline; outline: 2px solid rgba(0, 74, 143, .22); outline-offset: 3px; border-radius: 4px; }
.job-card h3 a:visited,
.job-card.is-visited h3 a { color: #5c7088; }
.job-card.is-visited { border-color: #c7d4df; background: #fbfdff; }
.job-card.is-visited .deadline-pill { background: #eef3f7; color: #30485f; }
.job-card.is-visited:hover,
.job-card.is-visited:focus-within { border-color: #b6c5d1; }
.job-card__org { margin: 0 0 16px; font-size: 18px; color: var(--text); }
.job-card__body { display: grid; grid-template-columns: 1fr; gap: 10px 20px; padding: 16px 0 18px; border-top: 1px solid #e9edf1; }
.meta-label { display: block; margin-bottom: 2px; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; font-weight: 700; }
.meta-value { display: block; font-size: 16px; color: var(--text); }
.job-card__footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.job-card__tags { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tag-pill { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border-radius: 12px; font-size: 13px; font-weight: 700; }
.tag-pill--category { background: #d9efdb; color: #1f6f45; }
.tag-pill--no-exp { background: #e6f0ff; color: #2459a6; padding-left: 10px; }
.tag-pill__icon { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; flex: 0 0 16px; }
.tag-pill__icon svg { display: block; width: 16px; height: 16px; }
.calendar-link { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 14px; border: 1px solid #d5e0ea; border-radius: 999px; background: #fff; color: var(--primary); font-size: 14px; font-weight: 600; cursor: pointer; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.calendar-link:hover, .calendar-link:focus-visible { border-color: #a9bfd3; background: #f8fbfd; color: var(--primary); transform: translateY(-1px); outline: none; }
.favorite-link { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid #d5e0ea; border-radius: 999px; background: #fff; color: #65778a; cursor: pointer; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.favorite-link:hover, .favorite-link:focus-visible { border-color: #a9bfd3; background: #f8fbfd; color: var(--primary); transform: translateY(-1px); outline: none; }
.favorite-link.is-active { border-color: #d892a6; background: #fff0f4; color: #a62d50; }
.favorite-link.is-active:hover, .favorite-link.is-active:focus-visible { border-color: #c76a87; background: #ffe4ec; color: #8d2140; }
.favorite-icon { font-size: 18px; line-height: 1; }
.calendar-icon { width: 18px; height: 18px; border: 2px solid currentColor; border-radius: 4px; position: relative; display: inline-block; }
.calendar-icon::before, .calendar-icon::after { content: ""; position: absolute; top: -4px; width: 2px; height: 6px; background: currentColor; }
.calendar-icon::before { left: 4px; }
.calendar-icon::after { right: 4px; }
.calendar-icon span { position: absolute; left: 2px; right: 2px; top: 5px; height: 2px; background: currentColor; display: block; }
.job-card__footer-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.share-links { display: flex; gap: 6px; align-items: center; }
.share-links a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid #d5e0ea; border-radius: 999px; background: #fff; text-decoration: none; color: var(--primary); font-size: 13px; font-weight: 700; text-align: center; transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease; }
.share-links a:hover, .share-links a:focus-visible { border-color: #a9bfd3; background: #f8fbfd; color: var(--primary); transform: translateY(-1px); outline: none; }
.more-wrap { display: flex; justify-content: center; margin-top: 18px; }
/* Footer institucional */
.footer { margin-top: 40px; background: #162a60; color: #fff; }
.footer-flag { display: flex; height: 10px; }
.footer-flag .blue { flex: 1; background: var(--gov-blue); }
.footer-flag .white { width: 68px; background: #ffffff; }
.footer-flag .red { flex: 1; background: var(--gov-red); }
.footer-grid { display: grid; grid-template-columns: 1.1fr .95fr 1.25fr; gap: 24px; padding: 34px 0 30px; }
.footer-brand { display: grid; align-content: start; gap: 6px; }
.servicecivil-mark { display: inline-grid; gap: 6px; width: fit-content; }
.servicecivil-mark__title { display: flex; align-items: flex-end; gap: 4px; font-size: 34px; line-height: .92; letter-spacing: -.03em; color: #fff; }
.servicecivil-mark__title .heavy { font-weight: 800; }
.servicecivil-mark__title .light { font-weight: 400; }
.servicecivil-mark__bars { display: flex; width: 286px; height: 8px; border-radius: 999px; overflow: hidden; background: #fff; }
.servicecivil-mark__bars .bar-blue { width: 46%; background: var(--gov-blue); }
.servicecivil-mark__bars .bar-red { flex: 1; background: var(--gov-red); }
.footer-brand__subtitle { margin: 0; color: #fff; font-size: 18px; font-weight: 700; }
.footer-brand__meta { margin: 0; color: rgba(255,255,255,.84); font-size: 14px; }
.footer-brand__address { margin: 2px 0 0; color: rgba(255,255,255,.92); font-size: 15px; line-height: 1.45; }
.footer-government { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; width: fit-content; padding: 0 12px; border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font-size: 13px; font-weight: 700; }
.footer-government::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(90deg, var(--gov-blue) 0 50%, var(--gov-red) 50% 100%); }
.footer-column { display: grid; align-content: start; gap: 12px; }
.footer-column--institutional { gap: 14px; }
.footer-link-groups { display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 18px 28px; align-items: start; }
.footer-link-group { display: grid; align-content: start; gap: 6px; min-width: 0; }
.footer-link-group h4 { margin-top: 0; }
.footer h2, .footer h3, .footer h4 { margin: 0; color: #fff; }
.footer h3 { font-size: 18px; }
.footer h4 { margin-top: 8px; font-size: 16px; color: rgba(255,255,255,.92); }
.footer p, .footer li, .footer a { color: rgba(255,255,255,.84); font-size: 14px; text-decoration: none; }
.footer a:hover { color: #fff; text-decoration: underline; }
.footer ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.footer-doc-list { gap: 6px; }
.footer-doc-link { display: grid; gap: 3px; padding: 2px 0; }
.footer-doc-link:hover, .footer-doc-link:focus-visible { text-decoration: none; }
.footer-doc-link__title { color: rgba(255,255,255,.92); }
.footer-doc-link__meta { color: rgba(255,255,255,.68); font-size: 12px; letter-spacing: .02em; }
.footer-doc-link:hover .footer-doc-link__title,
.footer-doc-link:focus-visible .footer-doc-link__title { color: #fff; text-decoration: underline; }
.footer-doc-link:focus-visible .footer-doc-link__meta { color: rgba(255,255,255,.84); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.76); font-size: 13px; }
.footer-bottom__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 0 18px; flex-wrap: wrap; }
.footer-bottom__links { display: flex; flex-wrap: wrap; gap: 14px; }
.footer-bottom__links a { color: rgba(255,255,255,.84); text-decoration: none; }
.footer-bottom__links a:hover { color: #fff; text-decoration: underline; }
@media (max-width: 1100px) { .hero-shell, .content-shell, .footer-grid { grid-template-columns: 1fr; } .footer-link-groups { grid-template-columns: 1fr; } .sidebar-panel { position: static; } }
@media (max-width: 760px) { .topbar .container, .results-toolbar { align-items: flex-start; flex-direction: column; } .search-row, .job-card__body { grid-template-columns: 1fr; } .search-panel h1 { font-size: 32px; } .job-card h3 { font-size: 22px; } .ribbon { position: absolute; top: -5px; right: 0; width: 72px; height: 72px; min-width: 0; overflow: hidden; display: block; border-radius: 0; margin-bottom: 0; } .job-card .ribbon + .deadline-pill { width: 100%; box-sizing: border-box; margin-top: 8px; margin-right: 0; padding-right: 74px; } .ribbon__label { position: absolute; width: 124px; height: 22px; padding: 0; top: 16px; left: -28px; transform: rotate(45deg); box-shadow: 0 3px 6px rgba(0,0,0,.08); border-radius: 0; } }

/* Banner de cookies */
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 80; }
.cookie-banner[hidden] { display: none; }
.cookie-banner__inner { background: #fff; border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 20px 40px rgba(0, 41, 76, .18); overflow: hidden; }
.cookie-banner__flag { display: flex; height: 8px; }
.cookie-banner__flag .blue { flex: 1; background: var(--gov-blue); }
.cookie-banner__flag .white { width: 54px; background: #fff; }
.cookie-banner__flag .red { flex: 1; background: var(--gov-red); }
.cookie-banner__content { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; padding: 18px 20px; align-items: center; }
.cookie-banner__content h3 { margin: 0 0 6px; color: var(--primary); font-size: 20px; }
.cookie-banner__content p { margin: 0; color: var(--muted); font-size: 14px; }
.cookie-banner__content p + p { margin-top: 2px; }
.cookie-banner__actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
.cookie-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--border); background: #fff; color: var(--primary); font-weight: 700; cursor: pointer; }
.cookie-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.cookie-link { color: var(--primary); font-weight: 700; text-decoration: none; }
.cookie-banner__details { display: none; padding: 0 20px 18px; color: var(--muted); font-size: 14px; }
.cookie-banner.is-config-open .cookie-banner__details { display: block; }
.cookie-banner__details strong { color: var(--text); }


/* Accesibilidad visual: escala tipografica y modo blanco y negro */
:root {
  --font-sans:'Roboto', Arial, sans-serif;
  --font-slab:'Roboto Slab', 'Roboto', Arial, sans-serif; --font-scale: 1; }
html[data-font-size="small"] { --font-scale: .92; }
html[data-font-size="large"] { --font-scale: 1.12; }
body { font-size: calc(15px * var(--font-scale)); }
.accessibility-bar { background: #e9eff4; border-bottom: 1px solid var(--border); }
.accessibility-bar .container { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 8px 0; flex-wrap: wrap; }
.accessibility-label { color: var(--primary); font-size: calc(12px * var(--font-scale)); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.accessibility-tools { display: flex; flex-wrap: wrap; gap: 6px; }
.accessibility-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--border); background: #fff; color: var(--primary); font-size: calc(13px * var(--font-scale)); font-weight: 700; cursor: pointer; }
.accessibility-btn[aria-pressed="true"] { background: var(--primary); border-color: var(--primary); color: #fff; }
.support-strip, .support-strip a { font-size: calc(13px * var(--font-scale)); }
.main-nav a, .header-btn, .quick-link, .filter-link, .filter-box select, .results-actions label, .results-actions select, .cookie-btn, .cookie-link { font-size: calc(14px * var(--font-scale)); }
.search-panel, .promo-panel, .sidebar-panel, .cookie-banner__content { padding: 20px; }
.hero { padding: 18px 0 14px; }
.hero-shell { gap: 16px; }
.search-panel h1 { font-size: calc(34px * var(--font-scale)); }
.search-panel p, .promo-panel p, .job-card__org, .meta-value, .footer-brand__address { font-size: calc(15px * var(--font-scale)); }
.promo-panel h2 { font-size: calc(23px * var(--font-scale)); }
.sidebar-panel h2, .results-toolbar h2 { font-size: calc(29px * var(--font-scale)); }
.sidebar-muted, .results-toolbar p, .footer-brand__meta, .footer p, .footer li, .footer a, .cookie-banner__content p, .cookie-banner__details { font-size: calc(13px * var(--font-scale)); }
.job-card { padding: 16px 16px 18px; }
.job-card h3 { font-size: calc(22px * var(--font-scale)); }
.job-card__body { padding: 14px 0 16px; }
.meta-label { font-size: calc(11px * var(--font-scale)); }
.tag-pill, .active-chip, .chip, .hero-kicker { font-size: calc(12px * var(--font-scale)); }
.servicecivil-mark__title { font-size: calc(27px * var(--font-scale)); }
.footer-grid { padding: 28px 0 24px; }
.footer h3 { font-size: calc(17px * var(--font-scale)); }
.footer h4 { font-size: calc(15px * var(--font-scale)); }
.cookie-banner__content h3 { font-size: calc(18px * var(--font-scale)); }
.cookie-banner__content { grid-template-columns: minmax(0, 1fr) auto; gap: 16px; }
.cookie-banner__inner { border-radius: 16px; }
html[data-visual-mode="bw"] body { background: #efefef; color: #111; }
html[data-visual-mode="bw"] .support-strip,
html[data-visual-mode="bw"] .topbar,
html[data-visual-mode="bw"] .footer,
html[data-visual-mode="bw"] .header-btn.primary,
html[data-visual-mode="bw"] .search-submit,
html[data-visual-mode="bw"] .cookie-btn.primary,
html[data-visual-mode="bw"] .accessibility-btn[aria-pressed="true"] { background: #111 !important; border-color: #444 !important; color: #fff !important; }
html[data-visual-mode="bw"] .hero-kicker,
html[data-visual-mode="bw"] .quick-link,
html[data-visual-mode="bw"] .filter-link.active,
html[data-visual-mode="bw"] .active-chip,
html[data-visual-mode="bw"] .tag-pill,
html[data-visual-mode="bw"] .cookie-banner__flag .blue,
html[data-visual-mode="bw"] .cookie-banner__flag .red,
html[data-visual-mode="bw"] .footer-flag .blue,
html[data-visual-mode="bw"] .footer-flag .red,
html[data-visual-mode="bw"] .servicecivil-mark__bars .bar-blue,
html[data-visual-mode="bw"] .servicecivil-mark__bars .bar-red { background: #111 !important; border-color: #444 !important; color: #fff !important; }
html[data-visual-mode="bw"] .ribbon.new,
html[data-visual-mode="bw"] .ribbon.warning { background: #111 !important; color: #fff !important; box-shadow: none; }
html[data-visual-mode="bw"] .ribbon.new::before,
html[data-visual-mode="bw"] .ribbon.warning::before,
html[data-visual-mode="bw"] .ribbon.new::after,
html[data-visual-mode="bw"] .ribbon.warning::after {
    display: none !important;
}
html[data-visual-mode="bw"] .ribbon.new,
html[data-visual-mode="bw"] .ribbon.warning {
    background: transparent !important;
}
html[data-visual-mode="bw"] .ribbon.new .ribbon__label,
html[data-visual-mode="bw"] .ribbon.warning .ribbon__label {
    background: #111 !important;
    box-shadow: none !important;
}
html[data-visual-mode="bw"] .search-panel,
html[data-visual-mode="bw"] .promo-panel,
html[data-visual-mode="bw"] .sidebar-panel,
html[data-visual-mode="bw"] .job-card,
html[data-visual-mode="bw"] .cookie-banner__inner { box-shadow: none !important; border-color: #666 !important; }
html[data-visual-mode="bw"] .deadline-dot,
html[data-visual-mode="bw"] .footer-government::before { background: #111 !important; }
html[data-visual-mode="bw"] .favorite-link,
html[data-visual-mode="bw"] .calendar-link,
html[data-visual-mode="bw"] .share-links a { background: #fff !important; border-color: #111 !important; color: #111 !important; box-shadow: none !important; }
html[data-visual-mode="bw"] .favorite-link.is-active { background: #111 !important; color: #fff !important; }
html[data-visual-mode="bw"] .job-card h3 a:visited,
html[data-visual-mode="bw"] .job-card.is-visited h3 a { color: #444 !important; }
html[data-visual-mode="bw"] .job-card.is-visited .deadline-pill { background: #ececec !important; color: #111 !important; }
html[data-visual-mode="bw"] .footer-government { background: rgba(255,255,255,.12) !important; }
@media (max-width: 760px) { .accessibility-bar .container, .cookie-banner__content { grid-template-columns: 1fr; } .cookie-banner__actions { justify-content: flex-start; } }

    
/* Ajustes globales de densidad visual y compactacion */
body {
    font-size: calc(14px * var(--font-scale));
}

.container {
    width: min(1080px, calc(100% - 36px));
}

.topbar .container {
    padding: 9px 0;
}

.topbar__actions {
    gap: 6px;
    font-size: calc(12px * var(--font-scale));
}

.brand {
    gap: 14px;
}

.brand img {
    height: 50px;
}

.hero {
    padding: 12px 0 10px;
}

.hero-shell {
    grid-template-columns: minmax(0, 1.55fr) 320px;
    gap: 14px;
}

.search-panel,
.promo-panel,
.sidebar-panel,
.results-toolbar,
.cookie-banner__content {
    border-radius: 14px;
}

.search-panel {
    padding: 16px;
}

.search-panel h1 {
    font-size: calc(27px * var(--font-scale));
    margin-bottom: 8px;
}

.search-panel p,
.promo-panel p,
.results-toolbar p,
.results-summary,
.cookie-banner p {
    font-size: calc(14px * var(--font-scale));
}

.search-grid {
    gap: 6px;
    margin-top: 14px;
}

.search-grid input,
.search-grid select,
.search-submit,
.filter-box select,
.filter-link,
.calendar-btn {
    min-height: 40px;
}

.search-grid input,
.search-grid select,
.filter-box select {
    padding: 0 12px;
    font-size: calc(14px * var(--font-scale));
}

.search-submit,
.quick-link,
.calendar-btn,
.cookie-btn {
    font-size: calc(13px * var(--font-scale));
}

.quick-links {
    gap: 6px;
    margin-top: 12px;
}

.quick-link {
    min-height: 34px;
    padding: 0 12px;
}

.promo-panel {
    padding: 16px;
}

.promo-panel h2,
.sidebar-panel h2,
.results-toolbar h2,
.servicecivil-footer__title {
    font-size: calc(21px * var(--font-scale));
}

.main-content {
    padding: 14px 0 28px;
}

.content-shell {
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 18px;
}

.sidebar-panel {
    padding: 14px;
    gap: 12px;
}

.filter-box + .filter-box {
    margin-top: 0;
    padding-top: 0;
}

.filter-box h3 {
    font-size: calc(13px * var(--font-scale));
    margin-bottom: 0;
}

.filter-list {
    gap: 6px;
}

.filter-link {
    padding: 0 12px;
}

.filter-link,
.filter-box select,
.results-count,
.results-summary,
.meta-label,
.meta-value,
.job-card__org,
.status-tag,
.cookie-link,
.cookie-banner__eyebrow,
.footer-links a,
.footer-meta,
.footer-contact li {
    font-size: calc(14px * var(--font-scale));
}

.results-toolbar {
    padding: 16px;
    margin-bottom: 14px;
}

.results-count {
    margin-bottom: 4px;
}

.cards {
    gap: 12px;
}

.job-card {
    padding: 14px 14px 16px;
    border-radius: 14px;
}

.deadline-pill {
    min-height: 32px;
    padding: 0 10px;
    font-size: calc(13px * var(--font-scale));
}

.ribbon.new,
.ribbon.warning {
    top: 12px;
    right: -36px;
    width: 124px;
    padding: 7px 0;
    font-size: calc(12px * var(--font-scale));
}

.job-card h3 {
    font-size: calc(19px * var(--font-scale));
    line-height: 1.18;
    margin: 12px 0 10px;
}

.job-card__org {
    margin: 0 0 12px;
}

.job-card__body {
    padding: 12px 0 14px;
    gap: 8px 14px;
}

.status-tag {
    min-height: 34px;
    padding: 0 12px;
}

.job-card__footer {
    margin-top: 14px;
    padding-top: 12px;
}

.calendar-btn {
    padding: 0 14px;
}

.servicecivil-footer {
    margin-top: 28px;
}

.servicecivil-footer__band {
    height: 10px;
}

.servicecivil-footer__main {
    padding: 22px 0 18px;
}

.footer-grid {
    gap: 18px;
}

.servicecivil-mark {
    gap: 12px;
    margin-bottom: 12px;
}

.servicecivil-mark__title {
    font-size: calc(26px * var(--font-scale));
}

.servicecivil-mark__bars {
    width: 230px;
    height: 7px;
}

.footer-contact,
.footer-links {
    gap: 6px;
}

.footer-links h3,
.footer-contact h3 {
    font-size: calc(15px * var(--font-scale));
    margin-bottom: 8px;
}

.servicecivil-footer__bottom {
    padding: 12px 0;
}

.cookie-banner {
    left: 12px;
    right: 12px;
    bottom: 12px;
}

.cookie-banner__content {
    padding: 14px 16px;
    gap: 12px;
}

.cookie-actions {
    gap: 6px;
}

.cookie-btn {
    min-height: 38px;
    padding: 0 12px;
}

.accessibility-bar .container {
    padding: 6px 0;
    gap: 6px;
}

.accessibility-bar__label {
    font-size: calc(12px * var(--font-scale));
}

.accessibility-btn {
    min-height: 30px;
    padding: 0 10px;
    font-size: calc(12px * var(--font-scale));
}

@media (max-width: 991px) {
    .hero-shell,
    .content-shell,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .container {
        width: min(100% - 28px, 1080px);
    }
}

/* Componentes de accesibilidad heredados de iteraciones previas.
   La version final usa controles en el header; esta seccion puede retirarse si
   se elimina definitivamente el markup asociado. */
.accessibility-bar {
    display: none;
}

.accessibility-fab-wrap {
    position: fixed;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    pointer-events: none;
}

.accessibility-fab-wrap > * {
    pointer-events: auto;
}

.accessibility-fab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 52px;
    padding: 0 16px;
    border: 0;
    border-radius: 16px 0 0 16px;
    background: var(--primary-2);
    color: #fff;
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .02em;
    box-shadow: 0 14px 30px rgba(0, 41, 76, .20);
    cursor: pointer;
}

.accessibility-fab::before {
    content: "A";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .18);
    font-size: calc(15px * var(--font-scale));
    font-weight: 800;
}

.accessibility-panel {
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%);
    width: min(340px, calc(100vw - 56px));
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(0, 41, 76, .18);
    padding: 18px;
}

.accessibility-panel__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.accessibility-panel__header h2 {
    margin: 0;
    color: var(--primary);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.1;
}

.accessibility-panel__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    color: var(--primary);
    font-size: 18px;
    cursor: pointer;
}

.accessibility-panel__intro {
    margin: 0 0 14px;
    color: var(--muted);
    font-size: calc(13px * var(--font-scale));
    line-height: 1.45;
}

.accessibility-panel__group + .accessibility-panel__group {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

.accessibility-panel__label {
    display: block;
    margin-bottom: 8px;
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.accessibility-panel .accessibility-tools {
    gap: 6px;
}

.accessibility-panel .accessibility-btn {
    min-height: 36px;
    padding: 0 12px;
}

html[data-visual-mode="bw"] .accessibility-fab {
    background: #111 !important;
    color: #fff !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .accessibility-panel {
    border-color: #666 !important;
    box-shadow: none !important;
}

@media (max-width: 760px) {
    .accessibility-fab-wrap {
        right: 12px;
        top: auto;
        bottom: 92px;
        transform: none;
    }

    .accessibility-fab {
        min-height: 46px;
        padding: 0 14px;
        border-radius: 999px;
    }

    .accessibility-panel {
        position: fixed;
        right: 12px;
        left: 12px;
        top: auto;
        bottom: 148px;
        width: auto;
        transform: none;
    }
}

/* Accesibilidad activa del header: contraste y tamano de letra */
.header-accessibility {
    display: flex;
    align-items: center;
    gap: 6px;
}

.header-a11y-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #fff;
    color: var(--primary);
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.header-a11y-btn:hover {
    background: #f7fbff;
    border-color: #9ebdd4;
}

.header-a11y-btn:focus-visible {
    outline: 3px solid rgba(10, 94, 168, .18);
    outline-offset: 2px;
}

.header-a11y-btn[aria-pressed="true"] {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

.header-a11y-btn--contrast {
    font-size: 0;
}

.contrast-icon {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 2px solid currentColor;
    background: linear-gradient(90deg, currentColor 0 50%, transparent 50% 100%);
}

html[data-visual-mode="bw"] .header-a11y-btn {
    border-color: #666;
}

html[data-visual-mode="bw"] .header-a11y-btn:hover {
    background: #f0f0f0;
}

html[data-visual-mode="bw"] .header-a11y-btn[aria-pressed="true"] {
    background: #111;
    border-color: #111;
    color: #fff;
}

@media (max-width: 760px) {
    .header-actions {
        width: 100%;
        justify-content: flex-start;
    }
}

.footer-inline-btn {
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,.84);
    font: inherit;
    cursor: pointer;
    text-decoration: none;
}

.footer-inline-btn:hover {
    color: #fff;
    text-decoration: underline;
}

.footer-inline-btn:focus-visible {
    outline: 2px solid rgba(255,255,255,.5);
    outline-offset: 2px;
}

/* Cabecera final: navegacion principal, acciones y estados */
.topbar {
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid #cfdae3;
    box-shadow: 0 12px 28px rgba(8, 43, 75, .06);
    backdrop-filter: blur(10px);
}

.topbar .container {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 0;
    flex-wrap: wrap;
}

.brand {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

.main-nav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px;
    border: 1px solid #d3dee7;
    border-radius: 16px;
    background: linear-gradient(180deg, #eef4f8 0%, #e7eff5 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85);
}

.main-nav a {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 12px;
    color: #28485e;
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
    transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.main-nav a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 8px;
    height: 2px;
    border-radius: 999px;
    background: var(--primary);
    opacity: 0;
    transform: scaleX(.45);
    transform-origin: center;
    transition: transform .18s ease, opacity .18s ease;
}

.main-nav a:hover,
.main-nav a:focus-visible {
    background: #fff;
    color: var(--primary);
    box-shadow: 0 8px 18px rgba(11, 60, 93, .10);
    transform: translateY(-1px);
    outline: none;
}

.main-nav a:hover::after,
.main-nav a:focus-visible::after {
    opacity: .9;
    transform: scaleX(1);
}

.main-nav a.is-current,
.main-nav a[aria-current="page"] {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 10px 22px rgba(11, 60, 93, .18);
}

.main-nav a.is-current::after,
.main-nav a[aria-current="page"]::after {
    background: rgba(255, 255, 255, .7);
    opacity: .85;
    transform: scaleX(1);
}

.header-actions {
    margin-left: auto;
    gap: 12px;
}

.header-accessibility {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px;
    border: 1px solid #d3dee7;
    border-radius: 16px;
    background: linear-gradient(180deg, #eef4f8 0%, #e7eff5 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85);
}

.header-btn,
.header-a11y-btn {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.header-btn {
    min-height: 42px;
    padding: 0 16px;
    border-radius: 12px;
}

.header-btn:hover,
.header-btn:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(11, 60, 93, .08);
    outline: none;
}

.header-btn.primary {
    box-shadow: 0 10px 22px rgba(11, 60, 93, .16);
}

.header-btn.primary:hover,
.header-btn.primary:focus-visible {
    background: var(--primary-2);
    border-color: var(--primary-2);
}

.header-a11y-btn {
    width: 42px;
    min-width: 42px;
    height: 42px;
    border-radius: 12px;
}

.header-a11y-btn:hover,
.header-a11y-btn:focus-visible {
    background: #fff;
    border-color: #9ebdd4;
    box-shadow: 0 8px 18px rgba(11, 60, 93, .10);
    transform: translateY(-1px);
    outline: none;
}

@media (max-width: 980px) {
    .main-nav {
        order: 3;
        width: 100%;
        justify-content: center;
    }

    .header-actions {
        margin-left: 0;
        width: 100%;
        justify-content: flex-end;
    }
}

@media (max-width: 720px) {
    .main-nav {
        justify-content: flex-start;
        overflow-x: auto;
        padding: 4px;
    }

    .main-nav a {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .header-actions {
        justify-content: space-between;
    }
}

.topbar {
    background: #fff;
    border-bottom: 1px solid #d8e2ea;
    box-shadow: 0 8px 18px rgba(8, 43, 75, .04);
    backdrop-filter: none;
}

.topbar .container {
    gap: 20px;
    padding: 12px 0 10px;
    align-items: center;
}

.brand img {
    height: 52px;
}

.main-nav {
    display: flex;
    align-items: stretch;
    gap: 24px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    margin-left: 8px;
}

.main-nav a {
    position: relative;
    min-height: 48px;
    padding: 0 2px;
    border-radius: 0;
    background: transparent;
    color: #415b6d;
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
    white-space: nowrap;
    box-shadow: none;
    transform: none;
    transition: color .18s ease, opacity .18s ease;
}

.main-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: var(--primary-2);
    opacity: 0;
    transform: scaleX(.55);
    transform-origin: center;
    transition: transform .18s ease, opacity .18s ease;
}

.main-nav a:hover,
.main-nav a:focus-visible {
    background: transparent;
    color: var(--primary);
    box-shadow: none;
    transform: none;
    outline: none;
}

.main-nav a:hover::after,
.main-nav a:focus-visible::after {
    opacity: .72;
    transform: scaleX(1);
}

.main-nav a.is-current,
.main-nav a[aria-current="page"] {
    background: transparent;
    color: var(--primary);
    font-weight: 800;
    box-shadow: none;
}

.main-nav a.is-current::after,
.main-nav a[aria-current="page"]::after {
    opacity: 1;
    transform: scaleX(1);
}

.header-actions {
    margin-left: auto;
    gap: 6px;
    padding-left: 18px;
    border-left: 1px solid #dde6ed;
}

.header-accessibility {
    gap: 6px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.header-a11y-btn {
    width: 38px;
    min-width: 38px;
    height: 38px;
    border-radius: 10px;
    border-color: #cfdae3;
    background: #fff;
    color: var(--primary);
    box-shadow: none;
}

.header-a11y-btn:hover,
.header-a11y-btn:focus-visible {
    background: #f3f8fb;
    border-color: #a8c0d2;
    box-shadow: none;
    transform: none;
}

.header-btn {
    min-height: 40px;
    padding: 0 15px;
    border-radius: 10px;
    box-shadow: none;
}

.header-btn:hover,
.header-btn:focus-visible {
    transform: none;
    box-shadow: none;
}

.header-btn.primary {
    box-shadow: none;
}

.header-btn.primary:hover,
.header-btn.primary:focus-visible {
    background: var(--primary-2);
    border-color: var(--primary-2);
}

@media (max-width: 980px) {
    .main-nav {
        order: 3;
        width: 100%;
        margin-left: 0;
        padding-top: 6px;
        border-top: 1px solid #e4ebf1;
        gap: 18px;
        overflow-x: auto;
    }

    .header-actions {
        padding-left: 0;
        border-left: 0;
        width: auto;
        margin-left: auto;
    }
}

@media (max-width: 720px) {
    .topbar .container {
        gap: 12px;
    }

    .main-nav {
        gap: 16px;
        justify-content: flex-start;
    }

    .header-actions {
        width: 100%;
        justify-content: space-between;
    }
}

.main-nav a {
    font-weight: 600;
    color: #304a5d;
    letter-spacing: .01em;
}

.main-nav a::after {
    height: 4px;
    bottom: -2px;
    background: var(--primary-2);
}

.main-nav a:hover,
.main-nav a:focus-visible {
    color: var(--primary);
}

.main-nav a:hover::after,
.main-nav a:focus-visible::after {
    opacity: .88;
    transform: scaleX(1);
}

.main-nav a.is-current,
.main-nav a[aria-current="page"] {
    color: var(--primary);
    font-weight: 600;
}

.main-nav a.is-current::after,
.main-nav a[aria-current="page"]::after {
    opacity: 1;
    transform: scaleX(1);
}

.header-a11y-btn,
.header-btn {
    font-weight: 800;
}

.header-a11y-btn {
    border: 2px solid var(--primary);
    background: #fff;
    color: var(--primary);
}

.header-a11y-btn:hover,
.header-a11y-btn:focus-visible {
    background: var(--chip);
    border-color: var(--primary-2);
    color: var(--primary);
}

.header-a11y-btn[aria-pressed="true"] {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

.header-a11y-btn[aria-pressed="true"] .contrast-icon {
    border-color: currentColor;
}

.contrast-icon {
    border-width: 2px;
}

.header-btn {
    border: 2px solid var(--primary);
    background: #fff;
    color: var(--primary);
}

.header-btn:hover,
.header-btn:focus-visible {
    background: var(--chip);
    border-color: var(--primary-2);
    color: var(--primary);
}

.header-btn.primary {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

.header-btn.primary:hover,
.header-btn.primary:focus-visible {
    background: var(--primary-mid);
    border-color: #041f32;
    color: #fff;
}

html[data-visual-mode="bw"] .main-nav a {
    color: #222;
}

html[data-visual-mode="bw"] .main-nav a::after {
    background: #111;
}

html[data-visual-mode="bw"] .main-nav a.is-current,
html[data-visual-mode="bw"] .main-nav a[aria-current="page"] {
    color: #000;
}

html[data-visual-mode="bw"] .header-a11y-btn,
html[data-visual-mode="bw"] .header-btn {
    border-color: #111;
    color: #111;
    background: #fff;
}

html[data-visual-mode="bw"] .header-a11y-btn[aria-pressed="true"],
html[data-visual-mode="bw"] .header-btn.primary {
    background: #111;
    border-color: #111;
    color: #fff;
}

.main-nav a.is-current,
.main-nav a[aria-current="page"] {
    box-shadow: inset 0 -4px 0 var(--primary-2);
}

.main-nav a.is-current::after,
.main-nav a[aria-current="page"]::after {
    opacity: 0;
    transform: scaleX(.4);
}

html[data-visual-mode="bw"] .main-nav a.is-current,
html[data-visual-mode="bw"] .main-nav a[aria-current="page"] {
    box-shadow: inset 0 -4px 0 #111;
}

.header-a11y-btn,
.header-btn {
    font-weight: 500;
    letter-spacing: 0;
}

html[data-visual-mode="bw"] .topbar {
    background: #fff !important;
    border-bottom-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .main-nav a {
    color: #111 !important;
}

html[data-visual-mode="bw"] .main-nav a:hover,
html[data-visual-mode="bw"] .main-nav a:focus-visible {
    color: #000 !important;
}

html[data-visual-mode="bw"] .main-nav a::after {
    background: #111 !important;
}

html[data-visual-mode="bw"] .header-actions {
    border-left-color: #111 !important;
}

html[data-visual-mode="bw"] .header-a11y-btn,
html[data-visual-mode="bw"] .header-btn {
    background: #fff !important;
    color: #111 !important;
    border: 2px solid #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .header-a11y-btn:hover,
html[data-visual-mode="bw"] .header-a11y-btn:focus-visible,
html[data-visual-mode="bw"] .header-btn:hover,
html[data-visual-mode="bw"] .header-btn:focus-visible {
    background: #f2f2f2 !important;
    color: #000 !important;
    border-color: #000 !important;
}

html[data-visual-mode="bw"] .header-a11y-btn[aria-pressed="true"],
html[data-visual-mode="bw"] .header-btn.primary {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}

html[data-visual-mode="bw"] .header-a11y-btn[aria-pressed="true"] .contrast-icon {
    border-color: currentColor !important;
}

/* Layout base del listado: resumen de filtros y contenedor de resultados */
.field-help {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.search-row--single {
    grid-template-columns: minmax(0, 1fr) auto;
}

.search-panel__hint {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 14px;
}

.content-shell--sidebar {
    grid-template-columns: 300px minmax(0, 1fr);
}

.sidebar-panel--sticky {
    align-self: start;
}

.filter-summary-strip {
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--shadow);
}

.filter-note {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.filter-summary-strip .chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.results-toolbar + .filter-summary-strip {
    margin-top: -2px;
}
/* Selects buscables reutilizables */
.combo-select {
    position: relative;
}

.combo-select.is-disabled {
    opacity: .72;
}

.combo-select.is-disabled .combo-select__trigger {
    cursor: not-allowed;
}

.combo-select__native {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

.combo-select__trigger {
    width: 100%;
    min-height: 42px;
    padding: 0 40px 0 14px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #fff;
    color: var(--text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    position: relative;
}

.combo-select__trigger::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 50%;
    width: 9px;
    height: 9px;
    border-right: 2px solid #5f7285;
    border-bottom: 2px solid #5f7285;
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none;
}

.combo-select.is-open .combo-select__trigger,
.combo-select__trigger:focus-visible {
    outline: 2px solid rgba(0, 74, 143, .22);
    outline-offset: 1px;
    border-color: #7ba6cf;
    background: #fff;
}

.combo-select__panel {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 6px);
    z-index: 30;
    padding: 8px;
    border: 1px solid #cdd9e5;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 30px rgba(0, 41, 76, .14);
}

.combo-select__search {
    width: 100%;
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #f7fafc;
    color: var(--text);
    font: inherit;
}

.combo-select__search::placeholder {
    color: #667686;
}

.combo-select__search:focus-visible {
    outline: 2px solid rgba(0, 74, 143, .22);
    outline-offset: 1px;
    border-color: #7ba6cf;
    background: #fff;
}

.combo-select__options {
    display: grid;
    gap: 4px;
    max-height: 220px;
    margin-top: 8px;
    overflow: auto;
}

.combo-select__option {
    width: 100%;
    min-height: 38px;
    padding: 8px 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.combo-select__option:hover,
.combo-select__option:focus-visible {
    background: #eef4fa;
    outline: none;
}

.combo-select__option.is-selected {
    background: var(--blue-soft);
    color: var(--primary);
    font-weight: 600;
}

.combo-select__empty {
    padding: 8px 12px;
    color: var(--muted);
    font-size: 14px;
}

.filter-actions {
    display: flex;
    justify-content: flex-start;
    margin-top: 0;
}

.filter-reset-btn {
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    color: var(--primary);
    font: inherit;
    cursor: pointer;
}

.filter-reset-btn:hover,
.filter-reset-btn:focus-visible {
    outline: none;
    border-color: #7ba6cf;
    background: #f4f8fb;
}

html[data-visual-mode="bw"] .combo-select__trigger,
html[data-visual-mode="bw"] .combo-select__search,
html[data-visual-mode="bw"] .combo-select__panel,
html[data-visual-mode="bw"] .filter-reset-btn {
    background: #fff !important;
    border-color: #111 !important;
    color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .combo-select__option.is-selected {
    background: #111 !important;
    color: #fff !important;
}
html[data-visual-mode="bw"] .combo-select__option--status {
    background: #fff !important;
    color: #111 !important;
    border: 1px solid #111 !important;
}
html[data-visual-mode="bw"] .combo-select__status-dot {
    background: #111 !important;
}
.results-state {
    padding: 28px 24px;
    border: 1px dashed #c6d4e1;
    border-radius: 18px;
    background: #f7fafc;
    color: var(--muted);
    font-size: 15px;
}

.results-state--loading {
    color: var(--primary);
    font-weight: 600;
}

.results-state--error {
    border-color: #d97a7a;
    background: #fff5f5;
    color: #7f1d1d;
}

.results-state--empty {
    background: #fbfcfd;
}

.results-state--notice {
    border-style: solid;
    border-color: #cfe0ee;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%);
    color: var(--text);
    box-shadow: 0 14px 28px rgba(0, 41, 76, .08);
}

.results-state--notice h3 {
    margin: 0 0 8px;
    color: var(--primary);
    font-size: 24px;
    line-height: 1.12;
}

.results-state--notice p {
    margin: 0;
    max-width: 700px;
    color: var(--text);
    line-height: 1.42;
}

.results-state--notice a {
    color: var(--primary);
    font-weight: 700;
}

.results-state__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin-bottom: 12px;
    padding: 0 10px;
    border-radius: 999px;
    background: #e8f2fb;
    color: var(--primary);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.results-state__actions {
    margin-top: 16px;
}

.results-state__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 12px;
    background: var(--primary);
    color: #fff !important;
    text-decoration: none;
    font-weight: 700;
}

.results-state__link:hover,
.results-state__link:focus-visible {
    background: var(--primary-2);
    outline: none;
}


/* Modales: calendario y confirmacion de salida */
.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 160;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(7, 30, 53, .62);
}

.modal-backdrop.is-open {
    display: flex;
}

.modal-card {
    position: relative;
    width: min(100%, 740px);
    max-height: min(82vh, 700px);
    overflow: auto;
    padding: 22px;
    padding-right: 56px;
    border-radius: 20px;
    background: #fff;
    color: var(--text);
    box-shadow: 0 24px 46px rgba(0, 41, 76, .22);
}

.modal-card:focus {
    outline: none;
}

.modal-card h3 {
    margin: 0 0 6px;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.15;
    font-weight: 500;
}

.modal-card > p {
    margin: 0 0 14px;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
    line-height: 1.45;
}

.modal-card--calendar {
    width: min(100%, 740px);
}

.calendar-modal__eyebrow {
    display: block;
    margin: 0 0 8px;
    padding: 0;
    color: var(--muted);
    font-size: calc(13px * var(--font-scale));
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

.calendar-table-wrap {
    margin-bottom: 12px;
    border: 1px solid #d8e4ef;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}

.calendar-table {
    width: 100%;
    border-collapse: collapse;
}

.calendar-table thead th {
    padding: 10px 14px;
    background: #f4f8fb;
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .02em;
    text-align: left;
}

.calendar-table tbody th,
.calendar-table tbody td {
    padding: 10px 14px;
    border-top: 1px solid #e4edf5;
    vertical-align: top;
    text-align: left;
}

.calendar-table tbody th {
    width: 42%;
    color: var(--text);
    font-size: calc(13px * var(--font-scale));
    font-weight: 500;
}

.calendar-table tbody td {
    color: var(--muted);
    font-size: calc(13px * var(--font-scale));
}

.calendar-table__row--highlight th,
.calendar-table__row--highlight td {
    background: #fff7df;
}

.modal-close {
    min-width: 120px;
}

.modal-dismiss {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid #d5e0ea;
    border-radius: 999px;
    background: #fff;
    color: var(--primary);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.modal-dismiss:hover,
.modal-dismiss:focus-visible {
    border-color: #a9bfd3;
    background: #f8fbfd;
    color: var(--primary);
    transform: translateY(-1px);
    outline: none;
}

html[data-visual-mode="bw"] .modal-backdrop {
    background: rgba(17, 17, 17, .74);
}

html[data-visual-mode="bw"] .modal-card,
html[data-visual-mode="bw"] .calendar-table-wrap,
html[data-visual-mode="bw"] .modal-card__note,
html[data-visual-mode="bw"] .modal-dismiss {
    background: #fff !important;
    color: #111 !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .modal-card h3,
html[data-visual-mode="bw"] .calendar-table thead th,
html[data-visual-mode="bw"] .calendar-table tbody th,
html[data-visual-mode="bw"] .calendar-modal__eyebrow {
    color: #111 !important;
}

html[data-visual-mode="bw"] .calendar-table__row--highlight th,
html[data-visual-mode="bw"] .calendar-table__row--highlight td {
    background: #f2f2f2 !important;
}

html[data-visual-mode="bw"] .calendar-modal__eyebrow {
    background: transparent !important;
}

@media (max-width: 760px) {
    .modal-backdrop {
padding: 12px;
    }

    .modal-card {
padding: 18px 16px 16px;
padding-right: 48px;
border-radius: 16px;
max-height: min(88vh, 720px);
    }

    .modal-dismiss {
top: 12px;
right: 12px;
width: 34px;
height: 34px;
font-size: 20px;
    }

    .modal-card h3 {
font-size: calc(18px * var(--font-scale));
    }
    .calendar-table-wrap {
border: 0;
background: transparent;
margin-bottom: 10px;
    }

    .calendar-table thead {
display: none;
    }

    .calendar-table,
    .calendar-table tbody,
    .calendar-table tr,
    .calendar-table th,
    .calendar-table td {
display: block;
width: 100%;
    }

    .calendar-table tbody tr {
margin-bottom: 8px;
border: 1px solid #d8e4ef;
border-radius: 12px;
overflow: hidden;
background: #fff;
    }

    .calendar-table tbody tr:first-child th,
    .calendar-table tbody tr:first-child td {
border-top: 0;
    }

    .calendar-table tbody th {
padding: 10px 12px 4px;
border-top: 0;
font-size: calc(12px * var(--font-scale));
background: #f8fbfd;
    }

    .calendar-table tbody td {
padding: 0 12px 10px;
border-top: 0;
font-size: calc(13px * var(--font-scale));
    }
}

.modal-card__note {
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid #d8e4ef;
    border-radius: 12px;
    background: #f7fafc;
    color: var(--text);
    font-size: calc(13px * var(--font-scale));
    line-height: 1.4;
    font-weight: 600;
}

.modal-card__actions {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: wrap;
}
.modal-card__actions--calendar {
    justify-content: space-between;
    align-items: center;
}

.modal-card__note--subtle {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    font-size: calc(12px * var(--font-scale));
    line-height: 1.35;
    font-weight: 400;
    max-width: 420px;
}

.modal-card__actions--calendar .modal-close {
    margin-left: auto;
}

.modal-btn {
    min-height: 38px;
    padding: 0 14px;
    border-radius: 12px;
    border: 1px solid transparent;
    font: inherit;
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
    cursor: pointer;
}

.modal-btn--secondary {
    background: #fff;
    border-color: var(--border);
    color: var(--text);
}

.modal-btn--primary {
    background: var(--primary);
    color: #fff;
}

.modal-btn--primary:hover,
.modal-btn--primary:focus-visible {
    background: var(--primary-2);
    outline: none;
}

.modal-btn--secondary:hover,
.modal-btn--secondary:focus-visible {
    border-color: #a9bfd3;
    background: #f7fafc;
    outline: none;
}

.cards[data-loading="true"] {
    opacity: .94;
}

.cards[data-loading="false"] {
    opacity: 1;
}

.job-card__body--extended {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.job-card__footer-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
}

.filter-summary-strip .chip-row:empty::before,
.active-filters .chip-row:empty::before {
    content: none;
}

#load-more-btn[hidden] {
    display: none;
}

@media (max-width: 760px) {
    .job-card__body--extended {
grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .job-card__footer {
align-items: flex-start;
    }

    .job-card__footer-actions {
width: 100%;
gap: 6px;
    }

    .calendar-link {
min-height: 36px;
padding: 0 12px;
font-size: 13px;
    }

    .share-links {
gap: 6px;
    }

    .share-links a,
    .favorite-link {
width: 36px;
height: 36px;
    }
}

/* Sidebar sticky: mantiene visibles los filtros durante el scroll */
.portal-home .content-shell--sidebar {
    align-items: start;
}

.portal-home .sidebar-panel--sticky {
    position: sticky;
    top: 96px;
    max-height: calc(100vh - 112px);
    overflow: auto;
    padding-right: 12px;
}

.portal-home .sidebar-panel--sticky {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.portal-home .sidebar-panel--sticky::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.portal-home .sidebar-panel--sticky::-webkit-scrollbar-thumb {
    background: #c2ceda;
    border-radius: 999px;
}

.portal-home .sidebar-panel--sticky.has-open-combo {
    overflow: visible;
}

.portal-home .sidebar-panel--sticky .combo-select.is-open {
    z-index: 90;
}

.portal-home .sidebar-panel--sticky .combo-select__panel {
    z-index: 120;
}

.portal-home .sidebar-panel--sticky .combo-select.is-open-up .combo-select__panel {
    top: auto;
    bottom: calc(100% + 6px);
}

@media (max-width: 1100px) {
    .portal-home .sidebar-panel--sticky {
position: static;
max-height: none;
overflow: visible;
padding-right: 0;
    }
}

/* Hero principal del home */
.portal-home .hero--home {
    padding: 10px 0 18px;
}

.portal-home .hero-home__container {
    width: min(1080px, calc(100% - 36px));
    margin: 0 auto;
    padding: 0;
}

.portal-home .hero-home {
    padding: 22px 24px 24px;
    border-radius: 0 0 24px 24px;
    background: linear-gradient(180deg, #0d4c8a 0%, #0d4b88 100%);
    box-shadow: 0 12px 24px rgba(6, 33, 60, .12);
    color: #fff;
    text-align: center;
}

.portal-home .hero-home h1 {
    margin: 0 auto;
    max-width: 820px;
    color: #fff;
    font-size: calc(36px * var(--font-scale));
    line-height: 1.1;
    letter-spacing: -.02em;
}

.portal-home .hero-home__lead {
    margin: 12px auto 20px;
    max-width: 680px;
    color: rgba(255,255,255,.92);
    font-size: calc(17px * var(--font-scale));
    line-height: 1.45;
}

.portal-home .hero-home__form {
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(300px, 1.05fr);
    gap: 12px;
    align-items: end;
}

.portal-home .hero-home__field {
    display: grid;
    gap: 6px;
    text-align: left;
}

.portal-home .hero-home__field label {
    color: rgba(255,255,255,.86);
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
}

.portal-home .hero-home__searchbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: stretch;
    border-radius: 14px;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(9, 48, 87, .10);
    overflow: hidden;
}

.portal-home .hero-home__searchbar input {
    min-height: calc(54px * var(--font-scale));
    border: 0;
    border-radius: 14px 0 0 14px;
    background: transparent;
    box-shadow: none;
    padding: 0 18px;
}

.portal-home .hero-home__searchclear {
    min-width: 44px;
    border: 0;
    border-left: 1px solid rgba(9, 48, 87, .10);
    background: #fff;
    color: #5e7081;
    font: inherit;
    font-size: calc(21px * var(--font-scale));
    line-height: 1;
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease;
}

.portal-home .hero-home__searchclear:hover,
.portal-home .hero-home__searchclear:focus-visible {
    background: #f6f9fc;
    color: var(--primary);
    outline: none;
}

.portal-home .hero-home__searchclear[hidden] {
    display: none;
}

.portal-home .hero-home__searchbar input:focus-visible {
    outline: none;
}

.portal-home .hero-home__searchbar input[type="search"]::-webkit-search-decoration,
.portal-home .hero-home__searchbar input[type="search"]::-webkit-search-cancel-button,
.portal-home .hero-home__searchbar input[type="search"]::-webkit-search-results-button,
.portal-home .hero-home__searchbar input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none;
    appearance: none;
}

.portal-home .hero-home__searchbar input[type="search"]::-ms-clear,
.portal-home .hero-home__searchbar input[type="search"]::-ms-reveal {
    display: none;
    width: 0;
    height: 0;
}

.portal-home .hero-home__searchbar:focus-within {
    outline: 3px solid rgba(255,255,255,.30);
    outline-offset: 2px;
}

.portal-home .hero-home__field input,
.portal-home .hero-home__field select {
    width: 100%;
    min-height: calc(54px * var(--font-scale));
    border: 0;
    border-radius: 14px;
    padding: 0 18px;
    background: #fff;
    color: #24384d;
    font: inherit;
    font-size: calc(16px * var(--font-scale));
    box-shadow: inset 0 0 0 1px rgba(9, 48, 87, .10);
}

.portal-home .hero-home__field input::placeholder {
    color: #6c7b89;
}

.portal-home .hero-home__field select {
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #506476 50%), linear-gradient(135deg, #506476 50%, transparent 50%);
    background-position: calc(100% - 24px) calc(50% - 4px), calc(100% - 17px) calc(50% - 4px);
    background-size: 7px 7px, 7px 7px;
    background-repeat: no-repeat;
    padding-right: 42px;
}

.portal-home .hero-home__field .combo-select {
    width: 100%;
}

.portal-home .hero-home__field .combo-select__trigger {
    width: 100%;
    min-height: calc(54px * var(--font-scale));
    border: 0;
    border-radius: 14px;
    padding: 0 42px 0 18px;
    background: #fff;
    color: #24384d;
    font: inherit;
    font-size: calc(16px * var(--font-scale));
    box-shadow: inset 0 0 0 1px rgba(9, 48, 87, .10);
    text-align: left;
}

.portal-home .hero-home__field .combo-select__trigger::after {
    right: 24px;
    border-right-color: #506476;
    border-bottom-color: #506476;
}

.portal-home .hero-home__field .combo-select.is-open .combo-select__trigger,
.portal-home .hero-home__field .combo-select__trigger:focus-visible {
    outline: 3px solid rgba(255,255,255,.30);
    outline-offset: 2px;
    background: #fff;
    border-color: transparent;
}

.portal-home .hero-home__field .combo-select__panel {
    top: calc(100% + 8px);
}

.portal-home .hero-home__field input:focus-visible,
.portal-home .hero-home__field select:focus-visible {
    outline: 3px solid rgba(255,255,255,.30);
    outline-offset: 2px;
}

.portal-home .hero-home__submit {
    min-height: calc(54px * var(--font-scale));
    border: 0;
    border-radius: 0 14px 14px 0;
    background: linear-gradient(180deg, #ffc928 0%, #ffbe08 100%);
    color: #0b2f51;
    font: inherit;
    font-size: calc(15px * var(--font-scale));
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 20px;
    box-shadow: none;
    cursor: pointer;
}

.portal-home .hero-home__submit:hover,
.portal-home .hero-home__submit:focus-visible {
    background: linear-gradient(180deg, #ffd54f 0%, #ffc928 100%);
    outline: none;
}

.portal-home .hero-home__submit span[aria-hidden="true"] {
    font-size: calc(18px * var(--font-scale));
    line-height: 1;
}

.portal-home .hero-home__explore {
    width: 100%;
    max-width: 900px;
    margin: 16px auto 0;
    display: grid;
    gap: 6px;
    justify-items: start;
}

.portal-home .hero-home__explore-label {
    color: rgba(255,255,255,.82);
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .02em;
}

.portal-home .hero-home__quickfilters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.portal-home .hero-home__quick {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: calc(40px * var(--font-scale));
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.28);
    background: rgba(255,255,255,.08);
    color: #fff;
    text-decoration: none;
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.portal-home .hero-home__quick-icon {
    width: 18px;
    height: 18px;
    flex: none;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.portal-home .hero-home__quick:hover,
.portal-home .hero-home__quick:focus-visible {
    background: rgba(255,255,255,.16);
    border-color: rgba(255,255,255,.46);
    outline: none;
}

.portal-home .hero-home__quick.active {
    background: #ffd24a;
    border-color: #d8aa1f;
    color: #0b2f51;
    box-shadow: 0 6px 14px rgba(0,0,0,.14);
}

html[data-visual-mode="bw"] .portal-home .hero-home__explore-label,
html[data-visual-mode="bw"] .portal-home .hero-home__quick {
    color: #fff !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__quick {
    background: transparent !important;
    border-color: #fff !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__quick.active {
    background: #fff !important;
    color: #111 !important;
    border-color: #666 !important;
}

@media (max-width: 760px) {
    .portal-home .hero-home__explore {
margin-top: 14px;
max-width: none;
    }

    .portal-home .hero-home__quickfilters {
gap: 6px;
    }

    .portal-home .hero-home__quick {
min-height: calc(36px * var(--font-scale));
padding: 0 12px;
font-size: calc(13px * var(--font-scale));
    }
}

html[data-visual-mode="bw"] .portal-home .hero-home {
    background: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home h1,
html[data-visual-mode="bw"] .portal-home .hero-home__lead,
html[data-visual-mode="bw"] .portal-home .hero-home__field label {
    color: #fff !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__field input,
html[data-visual-mode="bw"] .portal-home .hero-home__field select {
    background: #fff !important;
    color: #111 !important;
    box-shadow: inset 0 0 0 2px #111 !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__field .combo-select__trigger,
html[data-visual-mode="bw"] .portal-home .hero-home__field .combo-select__panel,
html[data-visual-mode="bw"] .portal-home .hero-home__field .combo-select__search {
    background: #fff !important;
    color: #111 !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__submit {
    background: #fff !important;
    color: #111 !important;
    border: 2px solid #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__searchbar {
    background: #fff !important;
    box-shadow: inset 0 0 0 2px #111 !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__searchbar input {
    background: transparent !important;
    color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__searchbar .hero-home__searchclear {
    background: #fff !important;
    color: #111 !important;
    border-left: 2px solid #111 !important;
}

html[data-visual-mode="bw"] .portal-home .hero-home__searchbar .hero-home__submit {
    border: 0 !important;
    border-left: 2px solid #111 !important;
}

html[data-visual-mode="bw"] .status-filter__control {
    background: #fff !important;
    border: 2px solid #111 !important;
    color: #111 !important;
    box-shadow: none !important;
}

@media (max-width: 1100px) {
    .portal-home .hero-home h1 {
font-size: calc(34px * var(--font-scale));
    }

    .portal-home .hero-home__lead {
font-size: calc(16px * var(--font-scale));
    }

    .portal-home .hero-home__form {
grid-template-columns: 1fr;
max-width: 720px;
    }
}

@media (max-width: 760px) {
    .portal-home .hero-home__container {
width: min(100%, calc(100% - 24px));
    }

    .portal-home .hero-home {
padding: 18px 14px 20px;
border-radius: 0 0 20px 20px;
    }

    .portal-home .hero-home h1 {
font-size: calc(28px * var(--font-scale));
    }

    .portal-home .hero-home__lead {
margin: 10px auto 16px;
font-size: calc(15px * var(--font-scale));
    }

    .portal-home .hero-home__form {
max-width: none;
    }

    .portal-home .hero-home__field input,
    .portal-home .hero-home__field select,
    .portal-home .hero-home__field .combo-select__trigger,
    .portal-home .hero-home__submit {
min-height: calc(50px * var(--font-scale));
border-radius: 12px;
font-size: calc(15px * var(--font-scale));
    }

    .portal-home .hero-home__searchbar {
border-radius: 12px;
    }

    .portal-home .hero-home__searchbar input {
min-height: calc(50px * var(--font-scale));
border-radius: 12px 0 0 12px;
    }

    .portal-home .hero-home__searchbar .hero-home__searchclear {
min-width: 40px;
font-size: calc(22px * var(--font-scale));
    }

    .portal-home .hero-home__searchbar .hero-home__submit {
min-height: calc(50px * var(--font-scale));
border-radius: 0 12px 12px 0;
padding: 0 16px;
    }
}

/*
 * Variante alternativa de legibilidad
 * -----------------------------------------------------------------------------
 * Esta capa no modifica la estructura ni la lÃƒÂ³gica del sitio.
 * Solo mejora lectura base: tamaÃƒÂ±o mÃƒÂ­nimo, interlineado y contraste.
 * Se activa ÃƒÂºnicamente con la clase .legibility-alt en <body>.
 * -----------------------------------------------------------------------------
 */
body.legibility-alt {
    --muted: #435768;
    --border: #c7d4de;
    font-size: calc(16px * var(--font-scale));
    color: #17232d;
}

body.legibility-alt .support-strip,
body.legibility-alt .support-strip a,
body.legibility-alt .main-nav a,
body.legibility-alt .header-btn,
body.legibility-alt .quick-link,
body.legibility-alt .filter-link,
body.legibility-alt .filter-box select,
body.legibility-alt .results-actions label,
body.legibility-alt .results-actions select,
body.legibility-alt .cookie-btn,
body.legibility-alt .cookie-link,
body.legibility-alt .sidebar-muted,
body.legibility-alt .results-toolbar p,
body.legibility-alt .footer-brand__meta,
body.legibility-alt .footer p,
body.legibility-alt .footer li,
body.legibility-alt .footer a,
body.legibility-alt .cookie-banner__content p,
body.legibility-alt .cookie-banner__details,
body.legibility-alt .meta-label,
body.legibility-alt .tag-pill,
body.legibility-alt .active-chip,
body.legibility-alt .chip,
body.legibility-alt .hero-kicker,
body.legibility-alt .note-kicker,
body.legibility-alt .call-card__code,
body.legibility-alt .deadline-label,
body.legibility-alt .footer-doc-link__meta,
body.legibility-alt .field label,
body.legibility-alt .accessibility-label,
body.legibility-alt .accessibility-btn,
body.legibility-alt .combo-select__search,
body.legibility-alt .combo-select__option,
body.legibility-alt .search-panel p,
body.legibility-alt .hero-home__lead,
body.legibility-alt .promo-panel p,
body.legibility-alt .call-card__meta,
body.legibility-alt .footer-brand__address,
body.legibility-alt .modal-card p,
body.legibility-alt .modal-card li,
body.legibility-alt .calendar-timeline__value,
body.legibility-alt .calendar-timeline__note {
    font-size: calc(16px * var(--font-scale));
    line-height: 1.6;
}

body.legibility-alt .call-card__org,
body.legibility-alt .meta-value,
body.legibility-alt .results-actions .combo-select__trigger,
body.legibility-alt .filter-box .combo-select__trigger,
body.legibility-alt .hero-home__field .combo-select__trigger,
body.legibility-alt .hero-home__searchbar input,
body.legibility-alt .search-submit,
body.legibility-alt .hero-home__submit,
body.legibility-alt .calendar-btn,
body.legibility-alt .modal-close,
body.legibility-alt .cookie-btn {
    font-size: calc(17px * var(--font-scale));
    line-height: 1.42;
}

body.legibility-alt .search-panel h1,
body.legibility-alt .hero h1,
body.legibility-alt .results-toolbar h2,
body.legibility-alt .sidebar-panel h2,
body.legibility-alt .call-card__main h4,
body.legibility-alt .job-card h3,
body.legibility-alt .modal-card h3,
body.legibility-alt .promo-panel h2 {
    line-height: 1.22;
    letter-spacing: -.01em;
}

body.legibility-alt .servicecivil-mark__title {
    line-height: 1.05;
}

body.legibility-alt .field input,
body.legibility-alt .field select,
body.legibility-alt .hero-home__field input,
body.legibility-alt .hero-home__field select,
body.legibility-alt .hero-home__field .combo-select__trigger,
body.legibility-alt .hero-home__submit,
body.legibility-alt .search-submit,
body.legibility-alt .header-btn,
body.legibility-alt .filter-link,
body.legibility-alt .calendar-btn,
body.legibility-alt .combo-select__trigger,
body.legibility-alt .cookie-btn,
body.legibility-alt .modal-close {
    min-height: calc(48px * var(--font-scale));
}

body.legibility-alt .hero-home__searchbar input {
    padding-right: 44px;
}

body.legibility-alt .hero-home__searchbar .hero-home__searchclear {
    min-width: 44px;
    font-size: calc(18px * var(--font-scale));
}

body.legibility-alt .tag-pill,
body.legibility-alt .active-chip,
body.legibility-alt .filter-chip,
body.legibility-alt .quick-chip,
body.legibility-alt .status-badge {
    min-height: calc(40px * var(--font-scale));
    padding-top: 8px;
    padding-bottom: 8px;
}

body.legibility-alt .filter-box h3,
body.legibility-alt .results-actions label,
body.legibility-alt .meta-label,
body.legibility-alt .call-card__code,
body.legibility-alt .deadline-label,
body.legibility-alt .footer h3,
body.legibility-alt .footer h4 {
    color: #213544;
}

body.legibility-alt .footer-doc-link__meta,
body.legibility-alt .support-strip,
body.legibility-alt .support-strip a,
body.legibility-alt .footer-brand__meta {
    color: rgba(255,255,255,.92);
}

body.legibility-alt .combo-select__option {
    min-height: 44px;
}

body.legibility-alt .calendar-table th,
body.legibility-alt .calendar-table td {
    padding-top: 10px;
    padding-bottom: 10px;
}

@media (max-width: 760px) {
    body.legibility-alt .search-panel h1,
    body.legibility-alt .hero h1 {
        font-size: calc(27px * var(--font-scale));
        line-height: 1.24;
    }

    body.legibility-alt .results-toolbar h2,
    body.legibility-alt .sidebar-panel h2 {
        font-size: calc(26px * var(--font-scale));
        line-height: 1.24;
    }

    body.legibility-alt .call-card__main h4,
    body.legibility-alt .job-card h3 {
        font-size: calc(22px * var(--font-scale));
        line-height: 1.25;
    }
}

/* Tipografias del sistema visual gubernamental
 * -----------------------------------------------------------------------------
 * Roboto queda como base para interfaz y lectura corrida.
 * Roboto Slab se reserva para titulos y bloques de jerarquia principal.
 */
body,
button,
input,
select,
textarea {
    font-family: var(--font-sans);
}

.search-panel h1,
.hero h1,
.hero-home h1,
.note h2,
.promo-panel h2,
.sidebar-panel h2,
.results-head h3,
.results-toolbar h2,
.job-card h3,
.call-card__main h4,
.modal-card h3,
.cookie-banner__content h3,
.accessibility-panel__header h2,
.results-state--notice h3,
.footer h2,
.footer h3,
.footer h4,
.servicecivil-mark__title {
    font-family: var(--font-slab);
}



/* Texto accesible reutilizable para lectores de pantalla. */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Acciones secundarias de la tarjeta: favorito, calendario y compartir. */
.share-links {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.share-links__label {
    color: var(--muted);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.share-links a {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid #d5e0ea;
    border-radius: 999px;
    background: #fff;
    text-decoration: none;
    color: var(--primary);
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.share-links a:hover,
.share-links a:focus-visible {
    border-color: #a9bfd3;
    background: #f8fbfd;
    color: var(--primary);
    transform: translateY(-1px);
    outline: none;
}

.share-links__icon {
    width: 16px;
    height: 16px;
    display: block;
    fill: currentColor;
}

.favorite-link,
.share-links a {
    flex: 0 0 auto;
}

@media (max-width: 760px) {
    .share-links {
        gap: 6px;
    }

    .share-links__label {
        width: 100%;
        margin-bottom: 2px;
    }
}

@media (max-width: 760px) {
    .modal-card__actions--calendar {
        align-items: flex-start;
    }

    .modal-card__actions--calendar .modal-card__note--subtle {
        max-width: none;
    }
}

/* Ajuste de contraste para titulos del footer en la variante legible. */
body.legibility-alt .footer h3 {
    color: #fff;
}

body.legibility-alt .footer h4 {
    color: rgba(255,255,255,.92);
}







/* Pagina interior: Que es Empleos Publicos */
.content-page {
    padding: 18px 0 48px;
}

.breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 18px;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
}

.breadcrumbs a {
    color: var(--primary);
    text-decoration: none;
}

.breadcrumbs a:hover,
.breadcrumbs a:focus-visible {
    text-decoration: underline;
}

.page-hero {
    margin-bottom: 26px;
}

.page-hero__shell {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) 340px;
    gap: 20px;
    align-items: start;
    padding: 26px;
    border: 1px solid var(--border);
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--shadow);
}

.page-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--chip);
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.page-hero h1 {
    margin: 14px 0 10px;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(42px * var(--font-scale));
    line-height: 1.1;
}

.page-lead {
    margin: 0;
    max-width: 760px;
    color: var(--text);
    font-size: calc(19px * var(--font-scale));
    line-height: 1.6;
}

.page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

.page-hero__aside {
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid #d7e2ea;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
}

.page-hero__aside h2 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(23px * var(--font-scale));
    line-height: 1.2;
}

.page-hero__aside ul {
    margin: 0;
    padding-left: 18px;
    display: grid;
    gap: 6px;
    color: var(--text);
}

.page-hero__aside p {
    margin: 0;
    color: var(--muted);
}

.page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 22px;
    align-items: start;
}

.page-main,
.page-side {
    display: grid;
    gap: 18px;
}

.content-card,
.info-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 20px;
    box-shadow: var(--shadow);
}

.content-card {
    padding: 24px;
}

.content-card h2 {
    margin: 0 0 12px;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(29px * var(--font-scale));
    line-height: 1.18;
}

.content-card h3 {
    margin: 0 0 8px;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.25;
}

.content-card p,
.content-card li,
.info-card p,
.info-card li {
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.52;
}

.content-card p:last-child,
.info-card p:last-child {
    margin-bottom: 0;
}

.content-card ul,
.content-card ol,
.info-card ul {
    margin: 0;
    padding-left: 18px;
}

.prose-stack {
    display: grid;
    gap: 12px;
}

.types-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.type-card {
    display: grid;
    gap: 6px;
    min-height: 100%;
    padding: 18px;
    border: 1px solid #d8e1e8;
    border-radius: 16px;
    background: #f9fbfd;
}

.type-card p,
.type-card li {
    font-size: calc(15px * var(--font-scale));
}

.type-card ul {
    display: grid;
    gap: 6px;
}

.checklist {
    display: grid;
    gap: 6px;
    margin-top: 12px;
}

.checklist li {
    list-style: none;
    position: relative;
    padding-left: 28px;
}

.checklist li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #2f8b5d;
}

.info-card {
    padding: 20px;
}

.info-card h2,
.info-card h3 {
    margin: 0 0 10px;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(22px * var(--font-scale));
    line-height: 1.22;
}

.info-card ul {
    display: grid;
    gap: 6px;
}

.info-card--accent {
    border-color: #cbdceb;
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
}

.inline-note {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #fff6df;
    border: 1px solid #e8c56a;
    color: #6c4b00;
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
}

.cta-stack {
    display: grid;
    gap: 6px;
}

.page-link-list {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.page-link-list a {
    color: var(--primary);
    text-decoration: none;
    font-weight: 700;
}

.page-link-list a:hover,
.page-link-list a:focus-visible {
    text-decoration: underline;
}

@media (max-width: 980px) {
    .page-hero__shell,
    .page-grid,
    .types-grid {
        grid-template-columns: 1fr;
    }

    .page-hero__aside {
        order: -1;
    }
}

@media (max-width: 760px) {
    .content-page {
        padding-top: 12px;
    }

    .page-hero__shell,
    .content-card,
    .info-card {
        padding: 18px;
    }

    .page-hero h1 {
        font-size: calc(34px * var(--font-scale));
    }

    .page-lead {
        font-size: calc(17px * var(--font-scale));
    }
}

/* Refinamiento UX/UI de la pagina interior. */
.page-hero__summary {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.summary-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 52px;
    padding: 10px 14px;
    border: 1px solid #d5e1eb;
    border-radius: 16px;
    background: #f8fbfe;
    color: var(--text);
}

.summary-chip strong {
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(22px * var(--font-scale));
    line-height: 1;
}

.summary-chip span {
    font-size: calc(14px * var(--font-scale));
    line-height: 1.35;
}

.page-hero__aside--highlight {
    position: relative;
    overflow: hidden;
}

.page-hero__aside--highlight::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-mid) 100%);
}

.mini-kicker {
    margin: 0;
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.page-section-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 24px;
}

.section-chip {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid #cfdce7;
    border-radius: 999px;
    background: #fff;
    color: var(--primary);
    text-decoration: none;
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}

.section-chip:hover,
.section-chip:focus-visible {
    background: var(--chip);
    border-color: var(--primary-2);
    color: var(--primary);
    outline: none;
}

.page-grid--editorial {
    align-items: start;
}

.section-heading {
    display: grid;
    gap: 6px;
    margin-bottom: 16px;
}

.section-heading p {
    margin: 0;
    color: var(--muted);
}

.split-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.insight-card {
    display: grid;
    gap: 6px;
    min-height: 100%;
    padding: 18px;
    border: 1px solid #d7e2ea;
    border-radius: 18px;
    background: #f8fbfe;
}

.insight-card--muted {
    background: #fbfcfd;
}

.insight-card h3 {
    margin: 0;
}

.insight-card ul {
    display: grid;
    gap: 6px;
}

.section-note {
    margin: 16px 0 0;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
}

.type-stack {
    display: grid;
    gap: 14px;
}

.type-panel {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 18px;
    border: 1px solid #d8e1e8;
    border-radius: 18px;
    background: #fbfcfe;
}

.type-panel__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-2) 100%);
    color: #fff;
    font-family: var(--font-slab);
    font-size: calc(28px * var(--font-scale));
    line-height: 1;
}

.type-panel__body {
    display: grid;
    gap: 6px;
}

.type-panel__body p {
    margin: 0;
}

.type-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 2px 0 0;
    padding: 0;
    list-style: none;
}

.type-tags li {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--chip);
    color: var(--chip-text);
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
    line-height: 1.3;
}

.requirement-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.requirement-card {
    display: grid;
    gap: 6px;
    min-height: 100%;
    padding: 16px;
    border: 1px solid #d9e2e9;
    border-radius: 16px;
    background: #fff;
}

.requirement-card h3 {
    margin: 0;
    font-size: calc(18px * var(--font-scale));
}

.requirement-card p {
    margin: 0;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
    line-height: 1.55;
}

.info-card--sticky {
    position: sticky;
    top: 104px;
}

.side-note {
    margin: 0;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
    line-height: 1.6;
}

.side-highlight {
    display: grid;
    gap: 6px;
    padding: 16px;
    border: 1px solid #d6e2ec;
    border-radius: 16px;
    background: #f8fbfe;
}

.side-highlight strong {
    color: var(--primary);
}

@media (max-width: 980px) {
    .split-grid,
    .requirement-grid,
    .type-panel {
        grid-template-columns: 1fr;
    }

    .type-panel__number {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        font-size: calc(21px * var(--font-scale));
    }

    .info-card--sticky {
        position: static;
    }
}

@media (max-width: 760px) {
    .page-section-nav {
        margin-bottom: 18px;
    }

    .summary-chip {
        width: 100%;
        justify-content: flex-start;
    }

    .section-chip {
        min-height: 38px;
    }
}

/* Pagina definitiva: Que es Empleos Publicos */
.about-page {
    padding: 20px 0 52px;
}

.about-page .breadcrumbs {
    margin-bottom: 16px;
}

.about-layout {
    display: grid;
    gap: 22px;
}

.about-hero {
    display: grid;
    gap: 20px;
    padding: 26px;
    border: 1px solid var(--border);
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--shadow);
}

.about-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--chip);
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.about-hero h1 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(44px * var(--font-scale));
    line-height: 1.08;
}

.about-hero__lead {
    margin: 0;
    max-width: 860px;
    color: var(--text);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.62;
}

.about-section {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 22px;
    box-shadow: var(--shadow);
    padding: 24px;
}

.about-section h2 {
    margin: 0 0 12px;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(27px * var(--font-scale));
    line-height: 1.18;
}

.about-section h3 {
    margin: 0 0 10px;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.25;
}

.about-section p,
.about-section li {
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.52;
}

.about-section p:last-child {
    margin-bottom: 0;
}

.about-section ul,
.about-section ol {
    margin: 0;
    padding-left: 18px;
}

.about-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.about-kpi {
    display: grid;
    align-content: start;
    gap: 6px;
    min-height: 132px;
    padding: 20px 18px;
    border: 1px solid #d7e2ea;
    border-radius: 18px;
    background: #f8fbfe;
}

.about-kpi strong {
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.1;
}

.about-kpi span {
    color: var(--text);
    font-size: calc(14px * var(--font-scale));
    line-height: 1.42;
}

.about-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.about-grid-main {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
    align-items: start;
}

.about-main {
    display: grid;
    gap: 18px;
}

.about-grid-main--single .about-main {
    max-width: none;
}

.type-stack {
    display: grid;
    gap: 14px;
}

.type-panel {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
    padding: 18px;
    border: 1px solid #d8e1e8;
    border-radius: 18px;
    background: #fbfcfe;
}

.type-panel__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-2) 100%);
    color: #fff;
    font-family: var(--font-slab);
    font-size: calc(28px * var(--font-scale));
    line-height: 1;
}

.type-panel__body {
    display: grid;
    gap: 6px;
}

.type-panel__body p {
    margin: 0;
}

@media (max-width: 980px) {
    .about-kpis,
    .about-grid-2,
    .about-grid-main,
    .type-panel {
        grid-template-columns: 1fr;
    }

    .type-panel__number {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        font-size: calc(21px * var(--font-scale));
    }
}

@media (max-width: 760px) {
    .about-hero,
    .about-section {
        padding: 18px;
    }

    .about-hero h1 {
        font-size: calc(34px * var(--font-scale));
    }
}
.about-section--highlight {
    border-color: #cbdceb;
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
}

.about-section--highlight h2 {
    margin-bottom: 10px;
}

.about-section--highlight p {
    max-width: 860px;
}

.about-section--nested {
    padding: 20px 22px;
    border-radius: 20px;
    box-shadow: none;
    background: #f9fbfd;
}

.about-section--nested h3 {
    margin-bottom: 14px;
}

.about-section--nested .checklist {
    margin-top: 0;
}

.about-section--highlight .about-grid-2 {
    margin-top: 18px;
}





html[data-visual-mode="bw"] .about-hero,
html[data-visual-mode="bw"] .about-section,
html[data-visual-mode="bw"] .about-kpi,
html[data-visual-mode="bw"] .type-panel,
html[data-visual-mode="bw"] .about-section--nested {
    background: #fff !important;
    color: #111 !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .about-hero__eyebrow {
    background: #fff !important;
    color: #111 !important;
    border: 1px solid #111 !important;
}

html[data-visual-mode="bw"] .about-hero h1,
html[data-visual-mode="bw"] .about-hero__lead,
html[data-visual-mode="bw"] .about-section h2,
html[data-visual-mode="bw"] .about-section h3,
html[data-visual-mode="bw"] .about-section p,
html[data-visual-mode="bw"] .about-section li,
html[data-visual-mode="bw"] .about-kpi strong,
html[data-visual-mode="bw"] .about-kpi span,
html[data-visual-mode="bw"] .type-panel__body p {
    color: #111 !important;
}

html[data-visual-mode="bw"] .type-panel__number {
    background: #111 !important;
    color: #fff !important;
}

html[data-visual-mode="bw"] .breadcrumbs,
html[data-visual-mode="bw"] .breadcrumbs a,
html[data-visual-mode="bw"] .section-note {
    color: #111 !important;
}

/* Centro de Ayuda */
.help-page__main {
    padding: 20px 0 52px;
}

.help-layout {
    display: grid;
    gap: 22px;
}

.help-hero,
.help-section {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 24px;
    box-shadow: var(--shadow);
}

.help-hero {
    display: grid;
    gap: 18px;
    padding: 26px;
}

.help-hero__eyebrow,
.help-card__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    width: fit-content;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--chip);
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.help-hero h1 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(44px * var(--font-scale));
    line-height: 1.08;
}

.help-hero__lead {
    margin: 0;
    max-width: 860px;
    color: var(--text);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.62;
}

.help-section {
    padding: 24px;
}

.help-section--highlight {
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
    border-color: #cbdceb;
}

.help-section__header {
    display: grid;
    gap: 6px;
    margin-bottom: 18px;
}

.help-section__header h2 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(27px * var(--font-scale));
    line-height: 1.18;
}

.help-section__header p {
    margin: 0;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.62;
}

.help-contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
    gap: 18px;
    align-items: stretch;
}

.help-card {
    display: grid;
    gap: 12px;
    padding: 22px;
    border: 1px solid #d8e1e8;
    border-radius: 20px;
    background: #fff;
}

.help-card h3 {
    margin: 0;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.2;
}

.help-card p,
.help-card li {
    margin: 0;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.6;
}

.help-card__note {
    color: var(--muted) !important;
}

.help-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.faq-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 18px;
}

.faq-search {
    display: grid;
    gap: 6px;
}

.faq-search span {
    color: var(--muted);
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
}

.faq-search input {
    width: 100%;
    min-height: 46px;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
}

.faq-search input:focus-visible {
    outline: 2px solid rgba(0, 74, 143, .22);
    outline-offset: 1px;
    border-color: #7ba6cf;
}

.faq-status {
    margin: 0;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
}

.faq-groups {
    display: grid;
    gap: 18px;
}

.faq-group {
    display: grid;
    gap: 6px;
}

.faq-group__title {
    margin: 0;
    color: var(--primary);
    font-size: calc(22px * var(--font-scale));
    line-height: 1.2;
}

.faq-list {
    display: grid;
    gap: 6px;
}

.faq-item {
    border: 1px solid #d8e1e8;
    border-radius: 18px;
    background: #fbfcfe;
    overflow: hidden;
}

.faq-item[open] {
    background: #fff;
    border-color: #c1d5e5;
}

.faq-item summary {
    list-style: none;
    cursor: pointer;
    padding: 18px 52px 18px 18px;
    position: relative;
    color: var(--primary);
    font-size: calc(18px * var(--font-scale));
    font-weight: 700;
    line-height: 1.45;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary::after {
    content: '+';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--primary);
    font-size: 28px;
    line-height: 1;
    font-weight: 400;
}

.faq-item[open] summary::after {
    content: 'Ã¢Ë†â€™';
}

.faq-item__answer {
    padding: 0 18px 18px;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.7;
}

.faq-item__answer p {
    margin: 0;
}

.faq-item__answer a {
    color: var(--primary);
}

.help-doc-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.help-doc-group {
    display: grid;
    gap: 12px;
    padding: 20px;
    border: 1px solid #d8e1e8;
    border-radius: 20px;
    background: #fbfcfe;
}

.help-doc-group h3 {
    margin: 0;
    color: var(--primary);
    font-size: calc(22px * var(--font-scale));
}

.help-doc-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 6px;
}

.help-doc-list a {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid #d8e1e8;
    border-radius: 14px;
    background: #fff;
    color: var(--text);
    text-decoration: none;
}

.help-doc-list a:hover,
.help-doc-list a:focus-visible {
    border-color: #a8bfd3;
    background: #f8fbfd;
    outline: none;
}

.help-doc-list a span {
    color: var(--muted);
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.help-doc-list__title {
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    font-weight: 600;
    line-height: 1.55;
}

.help-doc-list__meta {
    color: var(--muted);
    font-size: calc(16px * var(--font-scale));
    font-weight: 600;
    line-height: 1.42;
    text-transform: none;
    letter-spacing: 0;
}

.page-inner .footer-doc-link__title,
.page-inner .footer-doc-link__meta {
    line-height: 1.42;
}

.help-empty-state {
    padding: 18px;
    border: 1px dashed #c3d4e2;
    border-radius: 18px;
    background: #f9fbfd;
    color: var(--muted);
}

html[data-visual-mode="bw"] .help-hero,
html[data-visual-mode="bw"] .help-section,
html[data-visual-mode="bw"] .help-card,
html[data-visual-mode="bw"] .faq-item,
html[data-visual-mode="bw"] .help-doc-group,
html[data-visual-mode="bw"] .help-doc-list a,
html[data-visual-mode="bw"] .help-empty-state {
    background: #fff !important;
    color: #111 !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .help-hero__eyebrow,
html[data-visual-mode="bw"] .help-card__eyebrow,

html[data-visual-mode="bw"] .help-hero h1,
html[data-visual-mode="bw"] .help-hero__lead,
html[data-visual-mode="bw"] .help-section__header h2,
html[data-visual-mode="bw"] .help-section__header p,
html[data-visual-mode="bw"] .help-card h3,
html[data-visual-mode="bw"] .help-card p,
html[data-visual-mode="bw"] .faq-group__title,
html[data-visual-mode="bw"] .faq-item summary,
html[data-visual-mode="bw"] .faq-item__answer,
html[data-visual-mode="bw"] .help-doc-group h3,
html[data-visual-mode="bw"] .help-doc-list a,
html[data-visual-mode="bw"] .help-doc-list a span,
html[data-visual-mode="bw"] .faq-status,
html[data-visual-mode="bw"] .faq-search span {
    color: #111 !important;
}

html[data-visual-mode="bw"] .faq-search input {
    background: #fff !important;
    color: #111 !important;
    border-color: #111 !important;
}

@media (max-width: 980px) {
    .help-contact-grid,
    .help-doc-groups {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .help-hero,
    .help-section,
    .help-card,
    .help-doc-group {
        padding: 18px;
    }

    .help-hero h1 {
        font-size: calc(34px * var(--font-scale));
    }

    .help-hero__lead {
        font-size: calc(17px * var(--font-scale));
    }

    .faq-toolbar {
        grid-template-columns: 1fr;
    }

    .faq-item summary {
        font-size: calc(16px * var(--font-scale));
        padding-right: 46px;
    }
}



.help-hero--support {
    gap: 22px;
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
    border-color: #cbdceb;
}

.help-hero__intro {
    display: grid;
    gap: 12px;
}

.help-hero--support .help-contact-grid {
    margin-top: 2px;
}

.help-hero--support .help-card {
    background: #fff;
}

.help-hero--support .help-card h2 {
    margin: 0;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.2;
}

.help-doc-list a {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px 16px;
    padding: 14px 16px;
}

.help-doc-list__title {
    line-height: 1.45;
}

.help-doc-list__meta {
    justify-self: end;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #d7e2ea;
    border-radius: 999px;
    background: #f4f8fb;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .help-doc-list a {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .help-doc-list__meta {
        justify-self: start;
    }
}

/* PÃƒÂ¡gina: Inicia sesiÃƒÂ³n */
.login-page__main {
    padding: 20px 0 52px;
}

.login-layout {
    display: grid;
    gap: 22px;
}

.login-panel__intro {
    display: grid;
    gap: 14px;
}

.login-panel__eyebrow,
.login-method__eyebrow,
.login-aside-card__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    width: fit-content;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--chip);
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.login-panel__intro h1 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(44px * var(--font-scale));
    line-height: 1.08;
}

.login-panel__lead {
    margin: 0;
    max-width: 780px;
    color: var(--text);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.62;
}

.login-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .78fr);
    gap: 18px;
    align-items: start;
}

.login-panel,
.login-aside-card,
.login-method,
.login-form-card {
    background: #fff;
    border: 1px solid #d8e1e8;
    border-radius: 22px;
}

.login-panel {
    display: grid;
    gap: 18px;
    padding: 24px;
    box-shadow: var(--shadow);
}

.login-method,
.login-form-card,
.login-aside-card {
    display: grid;
    gap: 12px;
    padding: 22px;
}

.login-method {
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
    border-color: #cbdceb;
}

.login-method h1,
.login-method h2,
.login-form-card h2,
.login-aside-card h2 {
    margin: 0;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.2;
}

.login-method h1 {
    font-family: var(--font-sans);
    font-weight: 700;
}

.login-method p,
.login-form-card p,
.login-aside-card p {
    margin: 0;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.62;
}

.login-claveunica-btn {
    display: flex;
    width: 100%;
    min-height: 56px;
    padding: 8px 14px;
    border: 4px solid #fff;
    border-radius: 14px;
    background: #0f69c4;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(15, 105, 196, .16);
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.login-claveunica-btn:hover {
    background: #0b4e91;
    border-color: #fff;
    color: #fff;
}

.login-claveunica-btn:focus-visible {
    background: #0b4e91;
    border-color: #ffbe5c;
    color: #fff;
    outline: none;
}

.login-claveunica-btn:active {
    background: #07305a;
    border-color: #fff;
    color: #fff;
}

.login-claveunica-btn__content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 2rem;
}

.login-claveunica-btn__content span {
    font-size: calc(16px * var(--font-scale));
    font-weight: 700;
    line-height: 1.2;
}

.login-claveunica-btn__icon {
    display: block;
    width: 24px;
    height: 24px;
    flex: none;
}

.login-account-toggle {
    display: grid;
    gap: 12px;
    justify-items: center;
}

.login-account-toggle summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    max-width: 100%;
    padding: 4px 0;
    list-style: none;
    cursor: pointer;
    color: var(--primary);
    font-size: calc(15px * var(--font-scale));
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}

.login-account-toggle summary::-webkit-details-marker {
    display: none;
}

.login-account-toggle summary::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 10px solid #2c6db6;
    flex: none;
    transform: translateY(1px);
}

.login-account-toggle[open] summary::before {
    border-top: 10px solid #2c6db6;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    border-bottom: 0;
    transform: translateY(0);
}

.login-account-toggle summary:hover,
.login-account-toggle summary:focus-visible {
    text-decoration: underline;
    outline: none;
}

.login-account-toggle .login-form-card {
    margin-top: 2px;
    width: 100%;
}

.login-form {
    display: grid;
    gap: 14px;
}

.login-form--account {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 14px;
}

.login-form--account .login-field {
    min-width: 0;
}

.login-form--account .login-form__actions {
    grid-column: 1 / -1;
    justify-content: center;
    margin-top: 2px;
}

.login-form--account .login-submit,
.login-form--account .login-action-link {
    min-width: 170px;
    min-height: 46px;
}

.login-form--account .login-action-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.login-field {
    display: grid;
    gap: 6px;
}

.login-field label {
    color: var(--text);
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
}

.login-field input {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
}

.login-field input:focus-visible {
    outline: 2px solid rgba(0, 74, 143, .22);
    outline-offset: 1px;
    border-color: #7ba6cf;
}

.login-field__hint,
.login-field__error {
    margin: 0;
    font-size: calc(14px * var(--font-scale));
    line-height: 1.55;
}

.login-field__hint {
    color: var(--muted);
}

.login-field__error {
    color: #b33a2b;
    min-height: 1.3em;
}

.login-field input[aria-invalid="true"] {
    border-color: #b33a2b;
    box-shadow: inset 0 0 0 1px #b33a2b;
}

.login-form__actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.login-submit {
    min-width: 154px;
    min-height: 46px;
}

.login-text-link {
    color: var(--primary);
    font-size: calc(15px * var(--font-scale));
    font-weight: 700;
    text-decoration: none;
}

.login-text-link:hover,
.login-text-link:focus-visible {
    text-decoration: underline;
    outline: none;
}

.login-aside {
    display: grid;
    gap: 18px;
}

.login-aside-card__note {
    color: var(--muted) !important;
}


html[data-visual-mode="bw"] .login-panel,
html[data-visual-mode="bw"] .login-method,
html[data-visual-mode="bw"] .login-form-card,
html[data-visual-mode="bw"] .login-aside-card {
    background: #fff !important;
    color: #111 !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .login-panel__eyebrow,
html[data-visual-mode="bw"] .login-method__eyebrow,
html[data-visual-mode="bw"] .login-aside-card__eyebrow {
    background: #fff !important;
    color: #111 !important;
    border: 1px solid #111 !important;
}

html[data-visual-mode="bw"] .login-panel__intro h1,
html[data-visual-mode="bw"] .login-panel__lead,
html[data-visual-mode="bw"] .login-method h1,
html[data-visual-mode="bw"] .login-method h2,
html[data-visual-mode="bw"] .login-method p,
html[data-visual-mode="bw"] .login-form-card h2,
html[data-visual-mode="bw"] .login-form-card p,
html[data-visual-mode="bw"] .login-aside-card h2,
html[data-visual-mode="bw"] .login-aside-card p,
html[data-visual-mode="bw"] .login-field label,
html[data-visual-mode="bw"] .login-text-link {
    color: #111 !important;
}

html[data-visual-mode="bw"] .login-field input {
    background: #fff !important;
    border-color: #111 !important;
    color: #111 !important;
}

html[data-visual-mode="bw"] .login-field__hint,
html[data-visual-mode="bw"] .login-field__error {
    color: #111 !important;
}

html[data-visual-mode="bw"] .login-field input[aria-invalid="true"] {
    border-color: #111 !important;
    box-shadow: inset 0 0 0 1px #111 !important;
}

html[data-visual-mode="bw"] .login-form--account .login-action-link {
    background: #fff !important;
    border-color: #111 !important;
    color: #111 !important;
}

html[data-visual-mode="bw"] .login-claveunica-btn,
html[data-visual-mode="bw"] .login-submit {
    background: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .login-claveunica-btn:focus-visible {
    border-color: #fff !important;
}

@media (max-width: 980px) {
    .login-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .login-panel,
    .login-method,
    .login-form-card,
    .login-aside-card {
        padding: 18px;
    }

    .login-panel__intro h1 {
        font-size: calc(34px * var(--font-scale));
    }

    .login-form__actions {
        align-items: stretch;
    }

    .login-form--account {
        grid-template-columns: 1fr;
    }

    .login-form--account .login-submit,
    .login-form--account .login-action-link,
    .login-claveunica-btn {
        width: 100%;
    }
}







html[data-visual-mode="bw"] .login-account-toggle summary::before {
    border-left-color: #111 !important;
}

html[data-visual-mode="bw"] .login-account-toggle[open] summary::before {
    border-top-color: #111 !important;
    border-left-color: transparent !important;
}

/* Pagina: Recuperar clave */
.recovery-grid {
    grid-template-columns: minmax(0, 1fr);
}

.recovery-form-card {
    gap: 12px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.recovery-form {
    gap: 14px;
}

.recovery-panel .login-panel__intro {
    gap: 6px;
}

.recovery-panel .login-panel__intro h1 {
    margin: 0;
}

.recovery-form-card .login-form__actions {
    justify-content: flex-start;
    margin-top: 2px;
}

html[data-visual-mode="bw"] .recovery-form-card {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* Pagina: Crear cuenta */
.registration-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .72fr);
}

.registration-panel {
    gap: 20px;
}

.registration-notice {
    display: grid;
    gap: 6px;
    padding: 18px 20px;
    border: 1px solid #d7e2ea;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, var(--chip) 100%);
}

.registration-notice strong {
    color: var(--primary);
    font-size: calc(15px * var(--font-scale));
}

.registration-notice p {
    margin: 0;
    color: var(--text);
    font-size: calc(15px * var(--font-scale));
    line-height: 1.62;
}

.registration-form {
    display: grid;
    gap: 18px;
}

.registration-section {
    display: grid;
    gap: 14px;
    padding: 22px;
    border: 1px solid #d8e1e8;
    border-radius: 20px;
    background: #fff;
}

.registration-section h2 {
    margin: 0;
    color: var(--primary);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.2;
}

.registration-section > p {
    margin: 0;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.62;
}

.registration-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 14px 16px;
}

.registration-field {
    display: grid;
    align-content: start;
    gap: 6px;
}

.registration-field--full {
    grid-column: 1 / -1;
}

.registration-field label {
    color: var(--text);
    font-size: calc(14px * var(--font-scale));
    font-weight: 700;
}

.registration-field input,
.registration-field select,
.registration-field textarea {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
    box-sizing: border-box;
}

.registration-field textarea {
    min-height: 96px;
    padding: 10px 12px;
    resize: vertical;
}

.registration-field input:focus-visible,
.registration-field select:focus-visible,
.registration-field textarea:focus-visible {
    outline: 2px solid rgba(0, 74, 143, .22);
    outline-offset: 1px;
    border-color: #7ba6cf;
}

.registration-field__help {
    margin: 0;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
    line-height: 1.55;
}

.registration-field__help--placeholder {
    visibility: hidden;
    user-select: none;
}

.registration-field.is-disabled label,
.registration-field.is-disabled .registration-field__help {
    color: #6f7d89;
}

.registration-check {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    color: var(--text);
    font-size: calc(15px * var(--font-scale));
    line-height: 1.58;
}

.registration-check input {
    margin-top: 4px;
    flex: none;
}

.registration-check a {
    color: var(--primary);
    font-weight: 700;
    text-decoration: none;
}

.registration-check a:hover,
.registration-check a:focus-visible {
    text-decoration: underline;
    outline: none;
}

.registration-form__actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.registration-submit {
    min-width: 160px;
    min-height: 48px;
}

html[data-visual-mode="bw"] .registration-notice,
html[data-visual-mode="bw"] .registration-section {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .registration-notice strong,
html[data-visual-mode="bw"] .registration-notice p,
html[data-visual-mode="bw"] .registration-section h2,
html[data-visual-mode="bw"] .registration-section > p,
html[data-visual-mode="bw"] .registration-field label,
html[data-visual-mode="bw"] .registration-field__help,
html[data-visual-mode="bw"] .registration-check,
html[data-visual-mode="bw"] .registration-check a {
    color: #111 !important;
}

html[data-visual-mode="bw"] .registration-field input,
html[data-visual-mode="bw"] .registration-field select,
html[data-visual-mode="bw"] .registration-field textarea {
    background: #fff !important;
    border-color: #111 !important;
    color: #111 !important;
}

html[data-visual-mode="bw"] .registration-submit {
    background: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}

@media (max-width: 980px) {
    .registration-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .registration-section {
        padding: 18px;
    }

    .registration-fields {
        grid-template-columns: 1fr;
    }

    .registration-field--full {
        grid-column: auto;
    }

    .registration-form__actions {
        align-items: stretch;
    }

    .registration-submit {
        width: 100%;
    }
}



/* Registro final: crear cuenta */
.registration-page .registration-grid {
    grid-template-columns: 1fr;
}

.registration-page__intro {
    gap: 6px;
}

.registration-required-note {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 12px 16px;
    border: 1px solid #d9e3eb;
    border-radius: 16px;
    background: #fff;
    color: var(--text);
}

.registration-required-note p {
    margin: 0;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.42;
}

.registration-required-note__mark {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    font-weight: 800;
}

.registration-validation-message {
    padding: 14px 16px;
    border: 1px solid #d88b8b;
    border-radius: 16px;
    background: #fff6f6;
    color: #8b1f1f;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.42;
}

.registration-validation-message--success {
    border-color: #81b78f;
    background: #f4fbf6;
    color: #235b34;
}

.registration-id-reference {
    margin: 0;
    display: grid;
    gap: 16px;
}

.registration-id-reference__media {
    width: 100%;
    display: grid;
    align-items: center;
    justify-items: center;
    padding: 16px;
    border: 1px solid #d9e3eb;
    border-radius: 18px;
    background: linear-gradient(180deg, #fbfdff 0%, #f2f7fb 100%);
}

.registration-id-reference figcaption {
    display: grid;
    align-content: center;
    gap: 6px;
    padding: 22px 24px;
    border: 1px solid #d9e3eb;
    border-radius: 18px;
    background: #fff;
}

.registration-id-reference figcaption strong {
    color: var(--primary);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.25;
}

.registration-id-reference figcaption span {
    color: var(--text);
    font-size: calc(15px * var(--font-scale));
    line-height: 1.6;
}

.registration-id-reference--official {
    grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
    align-items: stretch;
}

.registration-id-reference--official .registration-id-reference__media {
    display: grid;
    justify-content: center;
}

.registration-id-reference--official img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 14px;
}

.registration-id-reference--official figcaption {
    width: 100%;
    max-width: none;
    justify-items: start;
}

.registration-page .combo-select {
    width: 100%;
}

.registration-page .combo-select__trigger {
    min-height: 50px;
    border-radius: 12px;
}

.registration-page .combo-select__search {
    min-height: 44px;
}

.registration-page .registration-field input[type="date"] {
    height: 50px;
    min-height: 50px;
    padding-right: 14px;
    line-height: 1.2;
    cursor: pointer;
}

.registration-page .registration-field input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
}

.registration-field__help--body {
    margin-top: -2px;
}

.registration-check--compact {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 12px;
    margin: 0;
    font-weight: 700;
}

.registration-field .registration-check input[type="checkbox"] {
    width: 18px;
    min-width: 18px;
    max-width: 18px;
    height: 18px;
    min-height: 18px;
    margin: 0;
    padding: 0;
    flex: none;
    accent-color: var(--primary);
}

.registration-trans-note {
    gap: 12px;
    padding: 18px 20px;
    border: 1px solid #d9e3eb;
    border-radius: 16px;
    background: #f9fbfd;
}

.registration-trans-note p {
    margin: 0;
    color: var(--text);
    font-size: calc(15px * var(--font-scale));
    line-height: 1.62;
}

.registration-social-copy {
    display: grid;
    gap: 6px;
}

.registration-social-copy p {
    margin: 0;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.62;
}


.registration-section__lead {
    margin: 0;
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.62;
}

.registration-radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0;
    padding: 0;
    border: 0;
}

.registration-radio-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 48px;
    padding: 0 16px;
    border: 1px solid #d9e3eb;
    border-radius: 999px;
    background: #fff;
    color: var(--text);
    font-size: calc(15px * var(--font-scale));
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}

.registration-radio-option input[type="radio"] {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--primary);
}

.registration-radio-group.is-invalid {
    padding: 10px;
    border: 1px solid #c64f4f;
    border-radius: 14px;
    background: #fff6f6;
}

.registration-field input.is-invalid,
.registration-field textarea.is-invalid,
.registration-field select[aria-invalid="true"] {
    border-color: #c64f4f;
    box-shadow: 0 0 0 3px rgba(198, 79, 79, .12);
}

.registration-field .combo-select.combo-select--invalid .combo-select__trigger {
    border-color: #c64f4f;
    box-shadow: 0 0 0 3px rgba(198, 79, 79, .12);
}

.registration-check.is-invalid {
    padding: 10px 12px;
    border: 1px solid #c64f4f;
    border-radius: 12px;
    background: #fff6f6;
}

html[data-visual-mode="bw"] .registration-required-note,
html[data-visual-mode="bw"] .registration-id-reference,
html[data-visual-mode="bw"] .registration-id-reference__media,
html[data-visual-mode="bw"] .registration-id-reference figcaption,
html[data-visual-mode="bw"] .registration-validation-message,
html[data-visual-mode="bw"] .registration-check.is-invalid,
html[data-visual-mode="bw"] .registration-trans-note,
html[data-visual-mode="bw"] .registration-radio-group.is-invalid,
html[data-visual-mode="bw"] .registration-radio-option {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
    color: #111 !important;
}

html[data-visual-mode="bw"] .registration-required-note p,
html[data-visual-mode="bw"] .registration-required-note strong,
html[data-visual-mode="bw"] .registration-id-reference figcaption strong,
html[data-visual-mode="bw"] .registration-id-reference figcaption span,
html[data-visual-mode="bw"] .registration-social-copy p,
html[data-visual-mode="bw"] .registration-section__lead,
html[data-visual-mode="bw"] .registration-radio-option {
    color: #111 !important;
}

html[data-visual-mode="bw"] .registration-required-note__mark {
    background: #111 !important;
    color: #fff !important;
}

html[data-visual-mode="bw"] .registration-field input.is-invalid,
html[data-visual-mode="bw"] .registration-field textarea.is-invalid,
html[data-visual-mode="bw"] .registration-field .combo-select.combo-select--invalid .combo-select__trigger {
    border-color: #111 !important;
    box-shadow: 0 0 0 2px rgba(17, 17, 17, .18) !important;
}

@media (max-width: 760px) {
    .registration-page .login-panel__intro h1 {
        font-size: calc(32px * var(--font-scale));
    }

    .registration-id-reference--official {
        grid-template-columns: 1fr;
    }

    .registration-id-reference figcaption {
        padding: 18px 18px 20px;
    }
}

/* Detalle de convocatoria */
.detail-page__main {
    padding: 20px 0 52px;
}

.detail-layout {
    display: grid;
    gap: 18px;
    max-width: 1240px;
    margin: 0 auto;
}

/* Detail page template */
.detail-template {
    display: grid;
    gap: 18px;
}

.detail-template__hero {
    display: grid;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 24px;
    background: linear-gradient(135deg, #25306B 0%, #2C3D9E 55%, #006BB9 100%);
    color: #fff;
    box-shadow: var(--shadow);
}

.detail-template__eyebrow {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 34px;
    margin: 0;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-size: calc(14px * var(--font-scale));
    line-height: 1;
    font-weight: 800;
}

.detail-template__hero h1 {
    margin: 0;
    color: #fff;
    font-family: var(--font-slab);
    font-size: calc(36px * var(--font-scale));
    line-height: 1.08;
}

.detail-template__hero-copy {
    display: grid;
    gap: 10px;
    margin-top: 8px;
}

.detail-template__hero-copy p {
    margin: 0;
    max-width: 76ch;
    color: rgba(255, 255, 255, .92);
    font-size: calc(15px * var(--font-scale));
    line-height: 1.45;
}

.detail-template__meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 18px;
    margin: 0;
}

.detail-template__meta-item {
    display: grid;
    gap: 6px;
    margin: 0;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, .16);
}

.detail-template__meta-item dt {
    margin: 0;
    color: rgba(255, 255, 255, .76);
    font-size: calc(12px * var(--font-scale));
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.detail-template__meta-item dd {
    margin: 0;
    color: #fff;
    font-size: calc(16px * var(--font-scale));
    line-height: 1.42;
    font-weight: 500;
}
.detail-template__hero-panel {
    grid-area: panel;
    justify-self: end;
    align-self: start;
    display: grid;
    gap: 10px;
    width: min(420px, 100%);
    padding: 18px 20px;
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 20px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 36px rgba(9, 28, 86, .18);
}

.detail-template__hero-panel .detail-template__metric-head h2,
.detail-template__hero-panel .detail-template__metric strong,
.detail-template__hero-panel .detail-template__metric span,
.detail-template__hero-panel p {
    color: var(--primary);
}

.detail-template__hero-panel .detail-template__metric-head h2 {
    font-size: calc(22px * var(--font-scale));
}

.detail-template__hero-panel .detail-template__metric-icon {
    background: linear-gradient(180deg, #eef4ff 0%, #dbe8ff 100%);
    color: var(--primary);
    box-shadow: inset 0 0 0 1px rgba(37, 48, 107, .12);
}

.detail-template__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 340px);
    gap: 18px;
    align-items: start;
}

.detail-template-card {
    background: #fff;
    border: 1px solid #d8e1e8;
    border-radius: 22px;
    box-shadow: var(--shadow);
}

.detail-template__content {
    overflow: hidden;
}
.detail-template__support-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 24px 28px;
    border-bottom: 1px solid #dbe6ee;
}

.detail-template__support-grid .detail-template-card {
    height: 100%;
    box-shadow: none;
}

.detail-template__section {
    display: grid;
    gap: 14px;
    padding: 24px 28px;
}

.detail-template__section + .detail-template__section {
    border-top: 1px solid #dbe6ee;
}

.detail-template__section-head {
    display: grid;
    gap: 6px;
}

.detail-template__section h2 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(27px * var(--font-scale));
    line-height: 1.15;
}

.detail-template__section-note {
    margin: 0;
    color: #60708c;
    font-size: calc(14px * var(--font-scale));
    line-height: 1.55;
}

.detail-template__rent {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(46px * var(--font-scale));
    line-height: 1;
}

.detail-template__data-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
    margin: 0;
}

.detail-template__data-item {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 16px 18px;
    border: 1px solid #dbe6ee;
    border-radius: 16px;
    background: #f8fbff;
}

.detail-template__data-item--wide {
    grid-column: 1 / -1;
}

.detail-template__data-item dt {
    margin: 0;
    color: #60708c;
    font-size: calc(12px * var(--font-scale));
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.detail-template__data-item dd {
    margin: 0;
    color: var(--primary);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.55;
}

.detail-template__richtext {
    display: grid;
    gap: 6px;
}

.detail-template__richtext > * {
    margin: 0;
}

.detail-template__richtext h3 {
    margin: 2px 0 0;
    color: var(--primary);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.28;
}

.detail-template__richtext p,
.detail-template__richtext li,
.detail-template__richtext label,
.detail-template__mini-timeline span,
.detail-template__alert,
.detail-template__sidecard p {
    color: var(--text);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.52;
}

.detail-template__richtext ul,
.detail-template__richtext ol,
.detail-template__checklist {
    display: grid;
    gap: 6px;
    margin: 0;
    padding-left: 18px;
}

.detail-template__table-wrap {
    margin-top: 2px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.detail-template__table-wrap table {
    min-width: 720px;
}

.detail-template__richtext table {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
    border: 1px solid #d8e1e8;
    border-radius: 16px;
    background: #fff;
}

.detail-template__richtext table th,
.detail-template__richtext table td {
    padding: 10px 12px;
    border-bottom: 1px solid #e1e8ef;
    text-align: left;
    vertical-align: top;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.55;
}

.detail-template__richtext table th {
    background: #f3f7fb;
    color: var(--primary);
    font-weight: 800;
}

.detail-template__sidebar {
    display: grid;
    gap: 14px;
    align-content: start;
}

.detail-template__sidecard {
    display: grid;
    gap: 12px;
    padding: 18px;
}

.detail-template__sidecard h2 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(21px * var(--font-scale));
    line-height: 1.18;
}

.detail-template__sideeyebrow {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 32px;
    margin: 0;
    padding: 0 12px;
    border-radius: 999px;
    background: #eef4fb;
    color: var(--primary);
    font-size: calc(13px * var(--font-scale));
    line-height: 1;
    font-weight: 800;
}

.detail-template__metric-head {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.detail-template__metric-head h2 {
    margin: 0;
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(20px * var(--font-scale));
    line-height: 1.2;
}

.detail-template__metric-icon {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: #3c763d;
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

.detail-template__metric-icon svg {
    width: 20px;
    height: 20px;
    display: block;
}
.detail-template__metric {
    display: grid;
    gap: 4px;
}

.detail-template__metric strong {
    color: var(--primary);
    font-family: var(--font-slab);
    font-size: calc(42px * var(--font-scale));
    line-height: 1;
}

.detail-template__metric span {
    color: #60708c;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.45;
    font-weight: 600;
}

.detail-template__sidecard--metric {
    background: linear-gradient(180deg, #f6fbf6 0%, #edf7ef 100%);
}

.detail-template__sidecard--cta {
    background: linear-gradient(180deg, #fff8e6 0%, #fff0c5 100%);
    border-color: #f0d88b;
}

.detail-template__apply-btn,
.detail-template__secondary-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 54px;
    padding: 0 18px;
    border-radius: 14px;
    font-size: calc(16px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
}

.detail-template__apply-btn {
    background: linear-gradient(180deg, #ffd24d 0%, #ffc422 100%);
    border: 1px solid rgba(37, 48, 107, .12);
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .08);
    color: #24305a;
}

.detail-template__apply-btn:hover,
.detail-template__apply-btn:focus-visible {
    background: linear-gradient(180deg, #ffd865 0%, #ffc422 100%);
}

.detail-template__secondary-btn {
    width: fit-content;
    min-height: 48px;
    padding: 0 16px;
    border: 1px solid #c9d7e5;
    background: #fff;
    color: var(--primary);
}

.detail-template__secondary-btn:hover,
.detail-template__secondary-btn:focus-visible {
    border-color: #8aa6c3;
    background: #f7fbff;
}

.detail-template__checklist {
    list-style: none;
    padding-left: 0;
}

.detail-template__checklist li {
    position: relative;
    padding-left: 22px;
}

.detail-template__checklist li::before {
    content: '';
    position: absolute;
    top: .62em;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #46a56e;
}

.detail-template__timeline,
.detail-template__mini-timeline {
    display: grid;
    gap: 12px;
}

.detail-template__timeline-item {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border: 1px solid #dbe6ee;
    border-left: 4px solid var(--secondary);
    border-radius: 16px;
    background: #fbfcfe;
}

.detail-template__mini-timeline {
    position: relative;
    gap: 18px;
    padding-left: 18px;
}

.detail-template__mini-timeline::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: #d6e1ea;
}

.detail-template__mini-timeline article {
    position: relative;
    display: grid;
    gap: 4px;
    padding: 0 0 0 18px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.detail-template__mini-timeline article::before {
    content: '';
    position: absolute;
    left: -16px;
    top: 6px;
    width: 12px;
    height: 12px;
    border: 3px solid var(--secondary);
    border-radius: 50%;
    background: #fff;
}
.detail-template__timeline-item h3,
.detail-template__mini-timeline strong {
    margin: 0;
    color: var(--primary);
    font-size: calc(16px * var(--font-scale));
    line-height: 1.3;
}

.detail-template__timeline-item p,
.detail-template__mini-timeline span {
    margin: 0;
}

.detail-template__iframe-wrap {
    width: 100%;
    overflow: hidden;
    border: 1px solid #d8e1e8;
    border-radius: 18px;
    background: #fff;
}

.detail-template__iframe-wrap iframe {
    display: block;
    width: 100%;
    min-height: 360px;
    border: 0;
}

.detail-template__check {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: var(--text);
}

.detail-template__check input {
    width: 18px;
    min-width: 18px;
    height: 18px;
    margin-top: 4px;
}

.detail-template__warning {
    display: grid;
    gap: 14px;
    padding: 18px 20px;
    border: 1px solid #f0d88b;
    border-radius: 18px;
    background: linear-gradient(180deg, #fff8e6 0%, #fff3d0 100%);
}

.detail-template__download {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    min-height: 46px;
    padding: 0 16px;
    border: 1px solid #c9d7e5;
    border-radius: 14px;
    background: #f7fbff;
    color: var(--primary);
    text-decoration: none;
}

.detail-template__download-title {
    font-weight: 800;
}

.detail-template__download-meta {
    font-size: calc(13px * var(--font-scale));
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #60708c;
}

.detail-template__alerts {
    display: grid;
    gap: 12px;
}

.detail-template__alert {
    padding: 18px 20px;
    border-left: 4px solid var(--secondary);
}

html[data-visual-mode="bw"] .detail-template__hero,
html[data-visual-mode="bw"] .detail-template-card,
html[data-visual-mode="bw"] .detail-template__data-item,
html[data-visual-mode="bw"] .detail-template__timeline-item,
html[data-visual-mode="bw"] .detail-template__mini-timeline article,
html[data-visual-mode="bw"] .detail-template__warning,
html[data-visual-mode="bw"] .detail-template__iframe-wrap,
html[data-visual-mode="bw"] .detail-template__download,
html[data-visual-mode="bw"] .detail-template__postular-footer {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .detail-template__hero,
html[data-visual-mode="bw"] .detail-template__hero h1,
html[data-visual-mode="bw"] .detail-template__meta-item dt,
html[data-visual-mode="bw"] .detail-template__meta-item dd,
html[data-visual-mode="bw"] .detail-template__section h2,
html[data-visual-mode="bw"] .detail-template__section-note,
html[data-visual-mode="bw"] .detail-template__rent,
html[data-visual-mode="bw"] .detail-template__data-item dt,
html[data-visual-mode="bw"] .detail-template__data-item dd,
html[data-visual-mode="bw"] .detail-template__richtext h3,
html[data-visual-mode="bw"] .detail-template__richtext p,
html[data-visual-mode="bw"] .detail-template__richtext li,
html[data-visual-mode="bw"] .detail-template__sidecard h2,
html[data-visual-mode="bw"] .detail-template__sideeyebrow,
html[data-visual-mode="bw"] .detail-template__metric strong,
html[data-visual-mode="bw"] .detail-template__metric span,
html[data-visual-mode="bw"] .detail-template__metric-head h2,
html[data-visual-mode="bw"] .detail-template__mini-timeline strong,
html[data-visual-mode="bw"] .detail-template__mini-timeline span,
html[data-visual-mode="bw"] .detail-template__warning h3,
html[data-visual-mode="bw"] .detail-template__warning p,
html[data-visual-mode="bw"] .detail-template__download,
html[data-visual-mode="bw"] .detail-template__alert {
    color: #111 !important;
}

html[data-visual-mode="bw"] .detail-template__eyebrow,
html[data-visual-mode="bw"] .detail-template__sideeyebrow,
html[data-visual-mode="bw"] .detail-template__apply-btn,
html[data-visual-mode="bw"] .detail-template__secondary-btn,
html[data-visual-mode="bw"] .detail-template__metric-icon,
html[data-visual-mode="bw"] .detail-template__checklist li::before,
html[data-visual-mode="bw"] .detail-template__postular-footer-icon {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}

html[data-visual-mode="bw"] .detail-template__hero-panel {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .detail-template__hero-panel p,
html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric strong,
html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric span,
html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric-head h2 {
    color: #111 !important;
}

html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric-icon {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}
@media (max-width: 1120px) {
    .detail-template__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .detail-template__body {
        grid-template-columns: 1fr;
    }

    .detail-template__support-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .detail-template__hero,
    .detail-template__section,
    .detail-template__sidecard,
    .detail-template__alert,
    .detail-template__support-grid {
        padding: 20px;
        border-radius: 20px;
    }

    .detail-template__hero h1 {
        font-size: calc(32px * var(--font-scale));
    }

    .detail-template__meta,
    .detail-template__data-grid,
    .detail-template__support-grid {
        grid-template-columns: 1fr;
    }

    .detail-template__data-item--wide {
        grid-column: auto;
    }

    .detail-template__rent {
        font-size: calc(38px * var(--font-scale));
    }

    .detail-template__iframe-wrap iframe {
        min-height: 320px;
    }

    .detail-template__apply-btn,
    .detail-template__secondary-btn,
    .detail-template__download {
        width: 100%;
    }
}

/* Detail hero layout override */
.detail-template__hero {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    grid-template-areas:
        "title panel"
        "meta panel";
    column-gap: 24px;
    row-gap: 14px;
    align-items: start;
    padding: 20px 24px;
    border-radius: 18px;
}

.detail-template__hero h1 {
    grid-area: title;
    font-size: calc(32px * var(--font-scale));
}

.detail-template__meta {
    grid-area: meta;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 16px;
}

.detail-template__meta-item--span-2 {
    grid-column: span 2;
}

.detail-template__hero-panel {
    grid-area: panel;
    justify-self: end;
    align-self: start;
    width: min(400px, 100%);
    padding: 16px 18px;
    border-radius: 16px;
}

@media (max-width: 1120px) {
    .detail-template__hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "title"
            "panel"
            "meta";
    }

    .detail-template__hero-panel {
        justify-self: stretch;
        width: 100%;
        max-width: none;
    }
}
/* End detail page template */

/* Index2 variant */
.brand--index2 {
    display: inline-grid;
    gap: 6px;
    text-decoration: none;
}

.brand--index2__text {
    color: var(--primary);
    font-size: calc(28px * var(--font-scale));
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.03em;
}

.brand--index2__mark {
    display: flex;
    align-items: center;
    gap: 2px;
    padding-left: 44px;
    height: 4px;
}

.brand--index2__bar {
    display: block;
    height: 4px;
}

.brand--index2__bar--blue {
    width: 34px;
    background: #2d69b2;
}

.brand--index2__bar--red {
    width: 92px;
    background: #e14b55;
}

body.portal-home--index2 .container {
    width: min(1760px, calc(100% - 56px));
}

body.portal-home--index2 .hero-home__container {
    width: min(1760px, calc(100% - 56px));
}

body.portal-home--index2 .topbar .container {
    gap: 24px;
}

body.portal-home--index2 .content-shell--sidebar {
    grid-template-columns: 272px minmax(0, 1fr);
    gap: 20px;
}

body.portal-home--index2 .hero-home {
    padding: 24px 30px 26px;
}

body.portal-home--index2 .hero-home__form,
body.portal-home--index2 .hero-home__explore {
    max-width: 1180px;
}

body.portal-home--index2 .hero-home__form {
    grid-template-columns: minmax(0, 1.8fr) minmax(300px, .8fr);
    gap: 16px;
    align-items: end;
}

body.portal-home--index2 .hero-home__field {
    gap: 6px;
}

body.portal-home--index2 .hero-home__field--search {
    min-width: 0;
}

body.portal-home--index2 .hero-home__field--region {
    width: 100%;
    max-width: 420px;
    justify-self: end;
}

body.portal-home--index2 .hero-home__searchbar {
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(3, 26, 48, .10), inset 0 0 0 1px rgba(9, 48, 87, .08);
}

body.portal-home--index2 .hero-home__searchbar input {
    padding: 0 20px;
}

body.portal-home--index2 .hero-home__searchclear {
    min-width: 46px;
}

body.portal-home--index2 .hero-home__submit {
    min-width: 104px;
}

body.portal-home--index2 .hero-home__field .combo-select__trigger,
body.portal-home--index2 .hero-home__field select {
    border-radius: 16px;
    box-shadow: 0 10px 24px rgba(3, 26, 48, .08), inset 0 0 0 1px rgba(9, 48, 87, .08);
}

body.portal-home--index2 .hero-home__quickfilters {
    gap: 12px;
}

body.portal-home--index2 .results-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 16px 24px;
    margin-bottom: 12px;
}

body.portal-home--index2 .results-toolbar > :first-child {
    display: grid;
    align-content: end;
    min-height: 0;
    padding-bottom: 2px;
}

body.portal-home--index2 .results-toolbar h2 {
    margin-bottom: 0;
}

body.portal-home--index2 .results-actions {
    display: grid;
    grid-template-columns: repeat(2, 248px);
    gap: 12px 16px;
    align-items: end;
    justify-content: end;
}

body.portal-home--index2 .results-actions__group,
body.portal-home--index2 .status-filter {
    width: 100%;
    min-width: 0;
}

body.portal-home--index2 .results-actions label {
    margin-bottom: 2px;
}

body.portal-home--index2 .status-filter__control {
    min-height: 48px;
    padding: 0 14px;
    border-radius: 14px;
}

body.portal-home--index2 .status-filter .combo-select__trigger,
body.portal-home--index2 .status-filter select {
    min-height: 44px;
}

body.portal-home--index2 .results-actions__group:not(.status-filter) .combo-select,
body.portal-home--index2 .results-actions__group:not(.status-filter) .combo-select__trigger {
    width: 100%;
    min-width: 0;
}

body.portal-home--index2 .results-actions__group:not(.status-filter) .combo-select__trigger {
    min-height: 48px;
    border-radius: 14px;
}

body.portal-home--index2 #results-source-note:empty {
    display: none;
}

body.portal-home--index2 .filter-summary-strip {
    margin-bottom: 14px;
}

body.portal-home--index2 .cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

body.portal-home--index2 .job-card {
    display: grid;
    align-content: start;
    gap: 12px;
    min-height: 100%;
}

body.portal-home--index2 .job-card__body {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
}

body.portal-home--index2 .job-card__body > div:first-child {
    display: none;
}

body.portal-home--index2 .job-card h3 {
    max-width: none;
}

body.portal-home--index2 .ribbon,
body.portal-home--index2 .ribbon.new,
body.portal-home--index2 .ribbon.warning {
    position: absolute;
    top: -6px;
    left: auto;
    right: 0;
    width: 84px;
    min-width: 0;
    height: 84px;
    padding: 0;
    border-radius: 0;
    transform: none;
    transform-origin: initial;
}

body.portal-home--index2 .ribbon__label {
    top: 18px;
    right: auto;
    left: -31px;
    width: 144px;
    transform: rotate(45deg);
}

body.portal-home--index2 .job-card .ribbon + .deadline-pill {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    margin-top: 8px;
    margin-left: 0;
    margin-right: 0;
    padding-right: 116px;
}

body.portal-home--index2 .job-card h3 {
    padding-right: 68px;
}

body.portal-home--index2 .deadline-pill {
    gap: 6px;
    font-size: 14px;
    line-height: 1.1;
    white-space: nowrap;
}

body.portal-home--index2 .deadline-dot {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
}

@media (max-width: 1520px) {
    body.portal-home--index2 .container,
    body.portal-home--index2 .hero-home__container {
        width: min(1520px, calc(100% - 56px));
    }
}

@media (max-width: 1300px) {
    body.portal-home--index2 .cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1320px) {
    body.portal-home--index2 .job-card__body {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1180px) {
    body.portal-home--index2 .hero-home__form {
        grid-template-columns: 1fr;
        max-width: 920px;
    }

    body.portal-home--index2 .hero-home__field--region {
        max-width: none;
        justify-self: stretch;
    }
}

/*
 * La franja intermedia necesita respirar antes de llegar a tablet:
 * - el toolbar se apila antes para que el titulo no se corte
 * - las tarjetas bajan a una columna antes de que queden demasiado angostas
 */
html[data-visual-mode="bw"] .detail-template__hero-panel {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode="bw"] .detail-template__hero-panel p,
html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric strong,
html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric span,
html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric-head h2 {
    color: #111 !important;
}

html[data-visual-mode="bw"] .detail-template__hero-panel .detail-template__metric-icon {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}
@media (max-width: 1120px) {
    body.portal-home--index2 .results-toolbar {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    body.portal-home--index2 .results-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-content: stretch;
    }

    body.portal-home--index2 .results-toolbar > :first-child {
        min-height: 0;
        padding-bottom: 0;
    }

    body.portal-home--index2 .cards {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    body.portal-home--index2 .content-shell--sidebar {
        grid-template-columns: 1fr;
        gap: 18px;
    }
}

@media (max-width: 760px) {
    body.portal-home--index2 .container,
    body.portal-home--index2 .hero-home__container {
        width: min(100%, calc(100% - 20px));
    }

    body.portal-home--index2 .hero-home {
        padding: 18px 16px 20px;
    }

    body.portal-home--index2 .cards,
    body.portal-home--index2 .job-card__body {
        grid-template-columns: 1fr;
    }

    body.portal-home--index2 .results-toolbar {
        align-items: stretch;
    }

    body.portal-home--index2 .results-actions {
        grid-template-columns: 1fr;
    }

    body.portal-home--index2 .results-toolbar > :first-child {
        min-height: 0;
        padding-bottom: 0;
    }

    body.portal-home--index2 .ribbon,
    body.portal-home--index2 .ribbon.new,
    body.portal-home--index2 .ribbon.warning {
        position: absolute;
        top: -5px;
        left: auto;
        right: 0;
        width: 72px;
        height: 72px;
        min-width: 0;
        min-height: 0;
        padding: 0;
        border-radius: 0;
        transform: none;
        box-shadow: none;
        overflow: hidden;
        display: block;
        align-items: initial;
    }

    body.portal-home--index2 .ribbon::before,
    body.portal-home--index2 .ribbon::after,
    body.portal-home--index2 .ribbon.new::after,
    body.portal-home--index2 .ribbon.warning::after {
        display: block;
    }

    body.portal-home--index2 .ribbon__label {
        position: absolute;
        top: 16px;
        right: auto;
        left: -28px;
        width: 124px;
        height: 22px;
        padding: 0;
        border-radius: 0;
        transform: rotate(45deg);
        box-shadow: 0 3px 6px rgba(0,0,0,.08);
    }

    body.portal-home--index2 .job-card .ribbon + .deadline-pill {
        width: 100%;
        box-sizing: border-box;
        margin-top: 8px;
        margin-right: 0;
        padding-right: 74px;
    }
}
/* Fin index2 variant */
/* Version 2: ancho global para paginas internas */
.page-wide .container {
    width: min(1760px, calc(100% - 56px));
}

.page-wide .topbar .container,
.page-wide .support-strip .container,
.page-wide .accessibility-bar .container {
    gap: 24px;
}

.page-wide .about-layout,
.page-wide .help-layout,
.page-wide .login-layout,
.page-wide .detail-layout {
    gap: 18px;
    max-width: 1240px;
    margin: 0 auto;
}

.page-wide .about-hero__lead,
.page-wide .help-hero__lead,
.page-wide .login-panel__lead {
    max-width: 980px;
}

.page-wide .help-contact-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(320px, .85fr);
}

.page-wide .login-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(320px, .82fr);
}


@media (max-width: 1520px) {
    .page-wide .container {
        width: min(1520px, calc(100% - 56px));
    }
}

@media (max-width: 980px) {
    .page-wide .help-contact-grid,
    .page-wide .login-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .page-wide .container {
        width: min(100%, calc(100% - 20px));
    }

    .page-wide .topbar .container,
    .page-wide .support-strip .container,
    .page-wide .accessibility-bar .container {
        gap: 16px;
    }
}




.registration-page .login-grid,
.registration-page .registration-panel,
.registration-page .registration-form {
    width: 100%;
    max-width: none;
}

.registration-page .registration-form {
    gap: 18px;
}

.registration-section__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px 20px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.registration-section__required-note {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: var(--muted);
    font-size: calc(14px * var(--font-scale));
    line-height: 1.42;
}

.registration-section__required-note span {
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    font-weight: 800;
    flex: none;
}

.registration-id-reference {
    gap: 14px;
}

.registration-id-reference__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    width: fit-content;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--chip);
    color: var(--primary);
    font-size: calc(12px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.registration-id-reference__media {
    padding: 12px;
}

.registration-id-reference figcaption {
    gap: 6px;
    padding: 18px 20px;
}

.registration-id-reference--official {
    grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
    align-items: stretch;
}

.registration-id-reference--official img {
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
}

html[data-visual-mode="bw"] .registration-section__required-note,
html[data-visual-mode="bw"] .registration-id-reference__eyebrow {
    color: #111 !important;
}

html[data-visual-mode="bw"] .registration-section__required-note span {
    background: #111 !important;
    color: #fff !important;
}

@media (max-width: 760px) {
    .registration-section__header {
        align-items: flex-start;
    }

    .registration-section__required-note {
        width: 100%;
    }

    .registration-id-reference--official {
        grid-template-columns: 1fr;
    }
}

/* Ancho global definitivo */
body .container,
body .hero-home__container {
    width: min(1760px, calc(100% - 56px));
}

@media (max-width: 1520px) {
    body .container,
    body .hero-home__container {
        width: min(1520px, calc(100% - 56px));
    }
}

@media (max-width: 760px) {
    body .container,
    body .hero-home__container {
        width: min(100%, calc(100% - 20px));
    }
}
/* Fin ancho global definitivo */



/* Marca Empleos Publicos final */
.brand {
    display: inline-grid;
    gap: 6px;
    text-decoration: none;
    align-items: start;
    flex: 0 0 auto;
}

.brand__text {
    color: var(--primary);
    font-size: calc(28px * var(--font-scale));
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.03em;
}

.brand__mark {
    display: flex;
    align-items: center;
    gap: 2px;
    padding-left: 44px;
    height: 4px;
}

.brand__bar {
    display: block;
    height: 4px;
}

.brand__bar--blue {
    width: 34px;
    background: #2d69b2;
}

.brand__bar--red {
    width: 92px;
    background: #e14b55;
}

.brand img {
    display: none;
}

@media (max-width: 760px) {
    .brand__text {
        font-size: calc(21px * var(--font-scale));
    }

    .brand__mark {
        padding-left: 38px;
    }

    .brand__bar--red {
        width: 80px;
    }
}
/* Fin marca Empleos Publicos final */

/* Ajustes finales registro ancho */
.registration-page .login-grid,
.registration-page .login-panel,
.registration-page .registration-panel,
.registration-page .registration-form,
.registration-page .login-panel__intro,
.registration-page .login-panel__lead {
    width: 100%;
    max-width: none;
}

.registration-page .registration-fields {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 18px;
}

.registration-page .registration-field--full {
    grid-column: 1 / -1;
}

.registration-id-reference--official {
    grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
}

.registration-id-reference__media {
    padding: 10px;
}

.registration-id-reference--official img {
    max-width: 220px;
}

@media (max-width: 1180px) {
    .registration-page .registration-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .registration-page .registration-fields {
        grid-template-columns: 1fr;
    }
}
/* Fin ajustes finales registro ancho */

/* Ajuste UX login final */
.login-panel {
    gap: 16px;
}

.login-account-toggle {
    width: 100%;
    gap: 6px;
    justify-items: stretch;
}

.login-account-toggle summary {
    width: fit-content;
    max-width: 100%;
    justify-self: center;
    padding: 2px 0;
}

.login-account-toggle .login-form-card {
    width: 100%;
    max-width: none;
    margin-top: 0;
}

.login-form-card {
    gap: 14px;
}

.login-form-card h2,
.login-form-card p {
    max-width: 760px;
}

@media (min-width: 981px) {
    .page-wide.login-page .login-grid {
        grid-template-columns: minmax(0, 1.22fr) 340px;
    }
}
/* Fin ajuste UX login final */


/* Ajuste armonia login final */
.page-wide.login-page .breadcrumbs,
.page-wide.login-page .login-grid {
    width: min(100%, 1340px);
    justify-self: center;
}

.page-wide.login-page .login-grid {
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 18px;
    align-items: start;
}

.page-wide.login-page .login-panel {
    align-items: stretch;
}

.page-wide.login-page .login-panel__intro,
.page-wide.login-page .login-method,
.page-wide.login-page .login-account-toggle {
    width: min(100%, 900px);
    justify-self: center;
}

.page-wide.login-page .login-method,
.page-wide.login-page .login-account-toggle .login-form-card {
    border-radius: 20px;
}

.page-wide.login-page .login-account-toggle .login-form-card {
    margin-inline: auto;
}

.page-wide.login-page .login-account-toggle summary {
    justify-self: center;
}

.page-wide.login-page .login-aside {
    align-content: start;
}

@media (max-width: 980px) {
    .page-wide.login-page .breadcrumbs,
    .page-wide.login-page .login-grid {
        width: 100%;
    }

    .page-wide.login-page .login-grid {
        grid-template-columns: 1fr;
    }

    .page-wide.login-page .login-panel__intro,
    .page-wide.login-page .login-method,
    .page-wide.login-page .login-account-toggle {
        width: 100%;
        justify-self: stretch;
    }
}
/* Fin ajuste armonia login final */


/* Centrado definitivo registro */
.page-wide.registration-page .breadcrumbs,
.page-wide.registration-page .login-grid,
.page-wide.registration-page .registration-grid {
    width: min(100%, 1440px);
    justify-self: center;
}

.page-wide.registration-page .login-grid,
.page-wide.registration-page .registration-grid {
    grid-template-columns: 1fr;
}

.page-wide.registration-page .registration-panel {
    width: 100%;
}

@media (max-width: 760px) {
    .page-wide.registration-page .breadcrumbs,
    .page-wide.registration-page .login-grid,
    .page-wide.registration-page .registration-grid {
        width: 100%;
    }
}
/* Fin centrado definitivo registro */

/* Sistema de botones alineado al Framework Digital */
.header-btn,
.search-submit,
.login-submit,
.registration-submit,
.modal-btn--primary,
.modal-btn--secondary,
.submit-btn,
.ghost-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 22px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-size: calc(16px * var(--font-scale));
    font-weight: 700;
    line-height: 1.35;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.header-btn,
.modal-btn--secondary,
.ghost-btn {
    background: #eee;
    border-color: #eee;
    color: #212529;
}

.header-btn.primary,
.search-submit,
.login-submit,
.registration-submit,
.modal-btn--primary,
.submit-btn {
    background: var(--primary-2);
    border-color: var(--primary-2);
    color: #fff;
}

.header-btn:hover,
.header-btn:focus-visible,
.modal-btn--secondary:hover,
.modal-btn--secondary:focus-visible,
.ghost-btn:hover,
.ghost-btn:focus-visible {
    background: #dbdbdb;
    border-color: #d5d5d5;
    color: #212529;
    box-shadow: 0 0 0 .2rem rgba(207, 208, 208, .45);
    outline: none;
    text-decoration: none;
    transform: none;
}

.header-btn.primary:hover,
.header-btn.primary:focus-visible,
.search-submit:hover,
.search-submit:focus-visible,
.login-submit:hover,
.login-submit:focus-visible,
.registration-submit:hover,
.registration-submit:focus-visible,
.modal-btn--primary:hover,
.modal-btn--primary:focus-visible,
.submit-btn:hover,
.submit-btn:focus-visible {
    background: #00578d;
    border-color: #004f80;
    color: #fff;
    box-shadow: 0 0 0 .2rem rgba(38, 133, 190, .45);
    outline: none;
    transform: none;
}

.search-submit,
.login-submit,
.registration-submit,
.submit-btn {
    min-height: 56px;
}

.header-btn {
    min-height: 48px;
    padding: 0 18px;
    border-radius: 8px;
}

.header-btn.primary {
    box-shadow: none;
}

.header-a11y-btn {
    border-radius: 8px;
}

@media (max-width: 760px) {
    .header-btn,
    .search-submit,
    .login-submit,
    .registration-submit,
    .modal-btn--primary,
    .modal-btn--secondary,
    .submit-btn,
    .ghost-btn {
        width: 100%;
    }
}

/* Paleta e identidad institucional oficial */
:root {
    --gov-blue: #006BB9;
    --gov-red: #FF1D3D;
    --gov-navy: #25306B;
    --primary: #25306B;
    --primary-2: #006BB9;
    --primary-mid: #2C3D9E;
    --bg: #EDF0F5;
    --chip: #EDF0F5;
    --chip-text: #25306B;
    --shadow: 0 10px 24px rgba(37, 48, 107, .08);
}

.support-strip {
    background: var(--gov-navy);
}

.footer-flag .blue,
.servicecivil-mark__bars .bar-blue,
.brand__bar--blue {
    background: var(--gov-blue);
}

.footer-flag .red,
.servicecivil-mark__bars .bar-red,
.brand__bar--red {
    background: var(--gov-red);
}

.footer-government {
    background: rgba(255, 255, 255, .06);
}

/* Fin paleta e identidad institucional oficial */






















/* Detail footer panels override */
.detail-template__alert {
    background: #dff1fb;
    border-color: #a9d0e6;
    color: #2f6e9b;
    box-shadow: none;
}

.detail-template__postular-footer {
    display: grid;
    gap: 20px;
    padding: 28px 20px 22px;
    background: #dff1fb;
    border: 1px solid #a9d0e6;
    border-radius: 22px;
    box-shadow: none;
}

.detail-template__postular-footer-head {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(47, 110, 155, .2);
}

.detail-template__postular-footer-head h2 {
    margin: 0;
    color: #2f6e9b;
    font-family: var(--font-slab);
    font-size: calc(22px * var(--font-scale));
    line-height: 1.2;
}

.detail-template__postular-footer-icon {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #2f6e9b;
    color: #fff;
    font-size: calc(18px * var(--font-scale));
    font-weight: 900;
    line-height: 1;
}

.detail-template__postular-footer-actions {
    display: flex;
    align-items: center;
}

.detail-template__postular-footer .detail-template__secondary-btn {
    min-width: 290px;
    border-color: #2f5a94;
    color: #5f6f86;
    background: #fff;
}

.detail-template__postular-footer .detail-template__secondary-btn:hover,
.detail-template__postular-footer .detail-template__secondary-btn:focus-visible {
    border-color: #274f84;
    background: #f9fcff;
    color: #40526c;
}

html[data-visual-mode='bw'] .detail-template__postular-footer {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode='bw'] .detail-template__postular-footer,
html[data-visual-mode='bw'] .detail-template__postular-footer-head h2 {
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__postular-footer-icon {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}

/* Detail sidebar docs panel override */
.detail-template__sidecard--docs {
    gap: 18px;
    background: #dff1fb;
    border-color: #a9d0e6;
    box-shadow: none;
}

.detail-template__sidecard-head--info {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(47, 110, 155, .2);
}

.detail-template__sidecard-head--info h2 {
    margin: 0;
    color: #2f6e9b;
    font-family: var(--font-slab);
    font-size: calc(22px * var(--font-scale));
    line-height: 1.2;
}

.detail-template__sidecard--docs .detail-template__sidecard-head--info {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 10px;
}

.detail-template__sidecard--docs .detail-template__sidecard-head--info h2 {
    font-size: calc(18px * var(--font-scale));
    line-height: 1.15;
}

.detail-template__sidecard--docs .detail-template__sidecard-info-icon {
    width: 24px;
    height: 24px;
    font-size: calc(16px * var(--font-scale));
}

.detail-template__sidecard-info-icon {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #2f6e9b;
    color: #fff;
    font-size: calc(18px * var(--font-scale));
    font-weight: 900;
    line-height: 1;
}

.detail-template__checklist--dash {
    gap: 4px;
    padding-left: 0;
    list-style: none;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(47, 110, 155, .2);
}

.detail-template__checklist--dash li {
    padding-left: 0;
    color: #2f6e9b;
    line-height: 1.32;
}

.detail-template__checklist--dash li::before {
    content: '- ';
    position: static;
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    color: #2f6e9b;
}

.detail-template__legend {
    display: grid;
    gap: 4px;
}

.detail-template__legend-title,
.detail-template__legend-item {
    margin: 0;
    color: #2f6e9b;
}

.detail-template__legend-title {
    font-style: italic;
}

.detail-template__legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.detail-template__legend-icon {
    display: inline-block;
    font-weight: 900;
    line-height: 1;
}

.detail-template__legend-icon--ok {
    color: #15803d;
}

.detail-template__legend-icon--missing {
    color: #dc2626;
}

.detail-template__secondary-btn--portal {
    width: fit-content;
    min-width: 290px;
    border-color: #2f5a94;
    color: #5f6f86;
    background: #fff;
}

.detail-template__secondary-btn--portal:hover,
.detail-template__secondary-btn--portal:focus-visible {
    border-color: #274f84;
    background: #f9fcff;
    color: #40526c;
}

html[data-visual-mode='bw'] .detail-template__sidecard--docs {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode='bw'] .detail-template__sidecard-head--info h2,
html[data-visual-mode='bw'] .detail-template__checklist--dash li,
html[data-visual-mode='bw'] .detail-template__legend-title,
html[data-visual-mode='bw'] .detail-template__legend-item {
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__sidecard-info-icon,
html[data-visual-mode='bw'] .detail-template__legend-icon--ok,
html[data-visual-mode='bw'] .detail-template__legend-icon--missing {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}

.detail-template__meta-item--wide {
    grid-column: 1 / -1;
}




.detail-template__main {
    display: grid;
    gap: 18px;
    align-content: start;
}

.detail-template__conditions-card,
.detail-template__summary-card {
    overflow: hidden;
}




@media (max-width: 1120px) {
    .detail-template__meta-item--span-2 {
        grid-column: 1 / -1;
    }
}

.detail-template__main--intro {
    display: grid;
    gap: 18px;
    align-content: start;
}

.detail-template__stack {
    display: grid;
    gap: 18px;
    margin-top: 18px;
}

/* Detail compact spacing override */
.detail-template {
    gap: 14px;
}

.detail-template__hero {
    gap: 14px;
    border-radius: 16px;
}

.detail-template__hero-panel,
.detail-template-card,
.detail-template__iframe-wrap,
.detail-template__warning,
.detail-template__postular-footer {
    border-radius: 14px;
}

.detail-template__body {
    gap: 14px;
}

.detail-template__main,
.detail-template__main--intro,
.detail-template__stack {
    gap: 12px;
}

.detail-template__stack {
    margin-top: 12px;
}

.detail-template__sidebar {
    gap: 12px;
}

.detail-template__sidecard--docs,
.detail-template__mini-timeline {
    gap: 12px;
}

@media (max-width: 760px) {
    .detail-template__hero,
    .detail-template__section,
    .detail-template__sidecard,
    .detail-template__alert,
    .detail-template__support-grid {
        border-radius: 16px;
    }
}

/* Detail accessible contrast override */
.detail-template__alert,
.detail-template__postular-footer,
.detail-template__sidecard--docs {
    background: #edf7fd;
    border-color: #8fb8d9;
}

.detail-template__alert,
.detail-template__postular-footer,
.detail-template__postular-footer-head h2,
.detail-template__sidecard-head--info h2,
.detail-template__checklist--dash li,
.detail-template__checklist--dash li::before,
.detail-template__legend-title,
.detail-template__legend-item {
    color: #173b66;
}

.detail-template__postular-footer-head,
.detail-template__sidecard-head--info,
.detail-template__checklist--dash {
    border-bottom-color: rgba(23, 59, 102, .22);
}

.detail-template__postular-footer-icon,
.detail-template__sidecard-info-icon {
    background: #173b66;
}

.detail-template__alert a,
.detail-template__sidecard--docs a:not(.detail-template__secondary-btn),
.detail-template__postular-footer a:not(.detail-template__secondary-btn) {
    color: #102f54;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

.detail-template__secondary-btn--portal,
.detail-template__postular-footer .detail-template__secondary-btn {
    border-color: #1f4f7f;
    color: #173b66;
}

.detail-template__secondary-btn--portal:hover,
.detail-template__secondary-btn--portal:focus-visible,
.detail-template__postular-footer .detail-template__secondary-btn:hover,
.detail-template__postular-footer .detail-template__secondary-btn:focus-visible {
    border-color: #163f67;
    background: #ffffff;
    color: #102f54;
}

/* Detail accordion controls */
.detail-template__section-head,
.detail-template__accordion-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.detail-template__sidecard-head,
.detail-template__postular-footer-head {
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.detail-template__toggle {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 12px;
    border: 1px solid #b7cadb;
    border-radius: 12px;
    background: #fff;
    color: #173b66;
    font-size: calc(14px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}

.detail-template__toggle:hover,
.detail-template__toggle:focus-visible {
    border-color: #8eaed0;
    background: #f8fbff;
    color: #102f54;
    outline: none;
}

.detail-template__toggle-icon {
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-1px);
    transition: transform .18s ease;
}

.detail-template__toggle[aria-expanded='true'] .detail-template__toggle-icon {
    transform: rotate(-135deg) translateY(-1px);
}

.detail-template__collapsible-body[hidden] {
    display: none !important;
}

.detail-template__section.is-collapsed,
.detail-template__sidecard.is-collapsed,
.detail-template__postular-footer.is-collapsed {
    gap: 0;
}

.detail-template__section.is-collapsed .detail-template__section-head,
.detail-template__sidecard.is-collapsed .detail-template__sidecard-head,
.detail-template__sidecard.is-collapsed .detail-template__accordion-head,
.detail-template__postular-footer.is-collapsed .detail-template__postular-footer-head {
    padding-bottom: 0;
    border-bottom-color: transparent;
}

html[data-visual-mode='bw'] .detail-template__toggle {
    border-color: #111 !important;
    background: #fff !important;
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__toggle:hover,
html[data-visual-mode='bw'] .detail-template__toggle:focus-visible {
    background: #f3f3f3 !important;
}

/* Detail hero postulaciones panel reference style */
.detail-template__hero-panel--metric {
    gap: 16px;
    padding: 20px 22px;
    border-color: #bfdab2;
    background: linear-gradient(180deg, #e5f2dd 0%, #dceecf 100%);
    box-shadow: none;
    justify-items: center;
}

.detail-template__hero-panel--metric .detail-template__metric-title {
    margin: 0;
    text-align: center;
    color: #2f7a3c;
    font-family: var(--font-sans);
    font-size: calc(23px * var(--font-scale));
    font-weight: 800;
    line-height: 1.16;
}

.detail-template__hero-panel--metric .detail-template__metric-title span {
    font-weight: 500;
}

.detail-template__hero-panel--metric .detail-template__metric-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
}

.detail-template__hero-panel--metric .detail-template__metric-icon {
    width: 68px;
    height: 68px;
    background: #2f7a3c;
    color: #fff;
    box-shadow: none;
}

.detail-template__hero-panel--metric .detail-template__metric-icon svg {
    width: 32px;
    height: 32px;
}

.detail-template__hero-panel--metric .detail-template__metric-row strong {
    color: #2f7a3c;
    font-family: var(--font-sans);
    font-size: calc(56px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
}

.detail-template__hero-panel--metric .detail-template__metric-date {
    margin: 0;
    text-align: center;
    color: #2b6840;
    font-size: calc(16px * var(--font-scale));
    line-height: 1.35;
    font-weight: 500;
}

.detail-template__hero-panel--metric .detail-template__metric-date strong {
    color: inherit;
    font-weight: 800;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric {
    background: #fff !important;
    border-color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-title,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-row strong,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-date {
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-icon {
    background: #111 !important;
    color: #fff !important;
}

/* Detail hero chip */
.detail-template__hero-intro {
    grid-area: title;
    display: grid;
    gap: 12px;
    align-content: start;
}

.detail-template__hero-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 54px;
    margin: 0;
    padding: 0 24px;
    border-radius: 999px;
    background: #1d2a66;
    color: #fff;
    font-size: calc(18px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 12px 22px rgba(7, 25, 80, .18);
}

html[data-visual-mode='bw'] .detail-template__hero-chip {
    background: #111 !important;
    color: #fff !important;
    box-shadow: none !important;
}

/* Detail hero intro institution-first */
.detail-template__hero-intro {
    gap: 10px;
}

.detail-template__hero-kicker {
    margin: 0;
    color: rgba(255, 255, 255, .9);
    font-size: calc(18px * var(--font-scale));
    line-height: 1.28;
    font-weight: 700;
}

.detail-template__hero-intro h1 {
    margin: 0;
    color: #fff;
    font-size: calc(32px * var(--font-scale));
    line-height: 1.08;
}

@media (max-width: 760px) {
    .detail-template__hero-kicker {
        font-size: calc(16px * var(--font-scale));
    }
}

html[data-visual-mode='bw'] .detail-template__hero-kicker {
    color: #111 !important;
}

/* Detail hero panel integrated update */
.detail-template__hero-panel--metric {
    gap: 14px;
    padding: 18px 20px;
    border-color: rgba(255, 255, 255, .2);
    background: rgba(9, 29, 86, .18);
    box-shadow: none;
    justify-items: center;
}

.detail-template__hero-panel--metric .detail-template__metric-title {
    color: #fff;
}

.detail-template__hero-panel--metric .detail-template__metric-title span {
    color: rgba(255, 255, 255, .88);
}

.detail-template__hero-panel--metric .detail-template__metric-icon {
    width: 62px;
    height: 62px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
}

.detail-template__hero-panel--metric .detail-template__metric-row strong {
    color: #fff;
    font-size: calc(52px * var(--font-scale));
}

.detail-template__metric-remaining {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    margin: 0;
    padding: 0 18px;
    border-radius: 999px;
    background: #1d2a66;
    color: #fff;
    font-size: calc(16px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
}

.detail-template__hero-panel--metric .detail-template__metric-date {
    color: rgba(255, 255, 255, .92);
}

.detail-template__hero-panel--metric .detail-template__metric-date strong {
    color: #fff;
}

html[data-visual-mode='bw'] .detail-template__metric-remaining {
    background: #111 !important;
    color: #fff !important;
}

/* Detail hero redesign final */
.detail-template__hero {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 330px);
    grid-template-areas:
        "intro intro"
        "meta panel";
    column-gap: 22px;
    row-gap: 14px;
    align-items: start;
    padding: 24px 30px 22px;
    border-radius: 18px;
    background: linear-gradient(135deg, #273579 0%, #30439b 48%, #0f73c4 100%);
}

.detail-template__hero-intro {
    grid-area: intro;
    display: grid;
    gap: 10px;
    align-content: start;
    max-width: none;
}

.detail-template__hero-kicker {
    display: grid;
    gap: 8px;
    margin: 0;
}

.detail-template__hero-label {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: rgba(255, 255, 255, .82);
    font-size: calc(11px * var(--font-scale));
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.detail-template__hero-kicker-text {
    display: block;
    max-width: none;
    color: rgba(255, 255, 255, .92);
    font-size: calc(17px * var(--font-scale));
    line-height: 1.24;
    font-weight: 700;
}

.detail-template__hero-titleblock {
    display: grid;
    gap: 10px;
}

.detail-template__hero-titleblock h1,
.detail-template__hero-intro h1,
.detail-template__hero h1 {
    margin: 0;
    max-width: none;
    color: #fff;
    font-size: calc(31px * var(--font-scale));
    line-height: 1.03;
}

.detail-template__meta {
    grid-area: meta;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 18px;
    align-self: start;
}

.detail-template__meta-item,
.detail-template__meta-item--wide {
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, .14);
}

.detail-template__meta-item dt {
    color: rgba(255, 255, 255, .74);
    font-size: calc(12px * var(--font-scale));
    letter-spacing: .05em;
}

.detail-template__meta-item dd {
    color: #fff;
    font-size: calc(14px * var(--font-scale));
    line-height: 1.3;
    font-weight: 700;
}

.detail-template__hero-panel,
.detail-template__hero-panel--metric {
    grid-area: panel;
    justify-self: end;
    align-self: start;
    width: min(330px, 100%);
    padding: 16px 18px 14px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 18px;
    background: rgba(247, 250, 255, .96);
    box-shadow: 0 18px 36px rgba(9, 28, 86, .16);
    justify-items: stretch;
    gap: 10px;
}

.detail-template__hero-panel--metric .detail-template__metric-title {
    margin: 0;
    color: #173b66;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.2;
    font-weight: 900;
    text-align: center;
}

.detail-template__hero-panel--metric .detail-template__metric-title span {
    display: inline;
    color: #173b66;
    font-weight: 500;
}

.detail-template__hero-panel--metric .detail-template__metric-row {
    justify-content: center;
    align-items: center;
    gap: 14px;
}

.detail-template__hero-panel--metric .detail-template__metric-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(180deg, #eef4ff 0%, #dce8ff 100%);
    border: 1px solid rgba(33, 73, 133, .12);
    color: #224c87;
}

.detail-template__hero-panel--metric .detail-template__metric-row strong {
    color: #173b66;
    font-size: calc(44px * var(--font-scale));
    line-height: 1;
}

.detail-template__metric-remaining {
    display: block;
    margin: 0;
    color: #173b66;
    font-size: calc(13px * var(--font-scale));
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.detail-template__metric-remaining strong {
    color: inherit;
}

.detail-template__metric-remaining span {
    color: inherit;
    font-weight: 700;
}

.detail-template__hero-panel--metric .detail-template__metric-date {
    margin: 0;
    color: #173b66;
    font-size: calc(13px * var(--font-scale));
    line-height: 1.35;
    text-align: center;
}

.detail-template__hero-panel--metric .detail-template__metric-date strong {
    color: #102e55;
}

@media (max-width: 1120px) {
    .detail-template__hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "intro"
            "panel"
            "meta";
        padding: 24px 22px 22px;
    }

    .detail-template__hero-panel,
    .detail-template__hero-panel--metric {
        justify-self: stretch;
        width: 100%;
        max-width: none;
    }

    .detail-template__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .detail-template__hero-titleblock h1,
    .detail-template__hero-intro h1,
    .detail-template__hero h1 {
        font-size: calc(28px * var(--font-scale));
    }

    .detail-template__hero-kicker-text {
        font-size: calc(16px * var(--font-scale));
    }

    .detail-template__meta {
        grid-template-columns: 1fr;
    }

    .detail-template__meta {
        grid-template-columns: 1fr;
    }
}

html[data-visual-mode='bw'] .detail-template__hero-label {
    background: #fff !important;
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__hero-kicker-text,
html[data-visual-mode='bw'] .detail-template__hero-titleblock h1,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-title,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-title span,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-row strong,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-date,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-date strong {
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric {
    background: #fff !important;
    border-color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__metric-remaining {
    background: #111 !important;
    color: #fff !important;
}

/* Detail hero layout refinement */
.detail-template__hero {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 320px);
    grid-template-areas:
        "intro panel"
        "meta meta";
    column-gap: 28px;
    row-gap: 16px;
    align-items: start;
}

.detail-template__hero-intro {
    grid-area: intro;
    gap: 10px;
    max-width: none;
    min-width: 0;
}

.detail-template__hero-kicker {
    margin: 0;
    max-width: none;
    color: rgba(255, 255, 255, .9);
    font-size: calc(17px * var(--font-scale));
    line-height: 1.28;
    font-weight: 700;
}

.detail-template__hero h1,
.detail-template__hero-intro h1 {
    max-width: none;
    font-size: calc(36px * var(--font-scale));
    line-height: 1.03;
}

.detail-template__meta {
    grid-area: meta;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 14px;
}

.detail-template__meta-item--wide {
    grid-column: 1 / -1;
}

.detail-template__hero-panel,
.detail-template__hero-panel--metric {
    grid-area: panel;
    align-self: start;
    margin-top: 2px;
}

@media (max-width: 1180px) {
    .detail-template__hero {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
        column-gap: 20px;
    }

    .detail-template__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 960px) {
    .detail-template__hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "intro"
            "panel"
            "meta";
    }

    .detail-template__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .detail-template__hero h1,
    .detail-template__hero-intro h1 {
        font-size: calc(29px * var(--font-scale));
    }

    .detail-template__hero-kicker {
        font-size: calc(15px * var(--font-scale));
    }

    .detail-template__meta {
        grid-template-columns: 1fr;
    }
}

/* Detail hero intro full-width fix */
.detail-template__hero-intro {
    justify-self: stretch;
    width: 100%;
}

.detail-template__hero-kicker,
.detail-template__hero h1,
.detail-template__hero-intro h1 {
    width: 100%;
    max-width: none;
    text-align: left;
    justify-self: stretch;
}

.detail-template__hero-intro h1 {
    grid-area: auto;
}

/* Detail final consolidated layout and hero panel */
.detail-template__hero-panel--metric {
    width: min(320px, 100%);
    padding: 18px 18px 16px;
    border: 1px solid rgba(38, 107, 67, .12);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 24px rgba(15, 41, 77, .09);
    justify-items: center;
    text-align: center;
    gap: 8px;
}

.detail-template__hero-panel--metric .detail-template__metric-title {
    width: 100%;
    margin: 0;
    color: #173b66;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.2;
    font-weight: 900;
    text-align: center;
}

.detail-template__hero-panel--metric .detail-template__metric-title span {
    color: #35584a;
    font-weight: 500;
}

.detail-template__hero-panel--metric .detail-template__metric-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
}

.detail-template__hero-panel--metric .detail-template__metric-icon {
    width: 58px;
    height: 58px;
    background: linear-gradient(180deg, #f2faf4 0%, #e5f5ea 100%);
    border: 1px solid rgba(31, 106, 61, .16);
    color: #1f6a3d;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9);
}

.detail-template__hero-panel--metric .detail-template__metric-row strong {
    color: #1f6a3d;
    font-family: var(--font-sans);
    font-size: calc(34px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
}

.detail-template__hero-panel--metric .detail-template__metric-date {
    order: 3;
    margin: 2px 0 0;
    color: #2c5842;
    font-size: calc(14px * var(--font-scale));
    line-height: 1.35;
    text-align: center;
}

.detail-template__hero-panel--metric .detail-template__metric-date strong {
    color: #1a5f39;
}

.detail-template__metric-status {
    order: 4;
    margin: 2px 0 0;
    color: #173b66;
    font-size: calc(14px * var(--font-scale));
    line-height: 1.3;
    font-weight: 800;
    text-align: center;
}

.detail-template__secondary-btn--portal,
.detail-template__postular-footer .detail-template__secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: start;
    align-self: start;
    width: fit-content;
    max-width: 100%;
    min-width: 0;
    min-height: 50px;
    padding: 0 28px;
    border: none;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffd24d 0%, #ffbf1f 100%);
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .08);
    color: #173b66;
    font-size: calc(15px * var(--font-scale));
    font-weight: 800;
    white-space: nowrap;
}

.detail-template__secondary-btn--portal:hover,
.detail-template__secondary-btn--portal:focus-visible,
.detail-template__postular-footer .detail-template__secondary-btn:hover,
.detail-template__postular-footer .detail-template__secondary-btn:focus-visible {
    background: linear-gradient(180deg, #ffd95f 0%, #ffbf1f 100%);
    color: #102f54;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric {
    background: #fff !important;
    border-color: #111 !important;
    box-shadow: none !important;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-title,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-title span,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-row strong,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-date,
html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-date strong,
html[data-visual-mode='bw'] .detail-template__metric-status {
    color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__hero-panel--metric .detail-template__metric-icon {
    background: #111 !important;
    color: #fff !important;
    border-color: #111 !important;
}

html[data-visual-mode='bw'] .detail-template__secondary-btn--portal,
html[data-visual-mode='bw'] .detail-template__postular-footer .detail-template__secondary-btn {
    background: #111 !important;
    color: #fff !important;
}

@media (min-width: 1121px) {
    .detail-template {
        display: grid;
        gap: 12px;
    }

    .detail-template__body {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 340px;
        gap: 12px;
        align-items: start;
    }

    .detail-template__body > * {
        min-width: 0;
    }

    .detail-template__main--intro {
        display: grid;
        gap: 12px;
        align-content: start;
        min-width: 0;
    }

    .detail-template__sidebar {
        display: grid;
        gap: 12px;
        align-content: start;
        width: auto;
        margin: 0;
        float: none;
        clear: none;
        min-width: 0;
    }

    .detail-template__stack {
        display: grid;
        gap: 12px;
        margin-top: 12px;
    }

    .detail-template__content {
        display: block;
    }
}

@media (max-width: 1120px) {
    .detail-template__body {
        grid-template-columns: 1fr;
    }

    .detail-template__hero-panel--metric {
        width: 100%;
        max-width: none;
    }
}

/* Detail hero/sidebar final compact override */
.detail-template__hero {
    grid-template-columns: 1fr !important;
    grid-template-areas:
        "intro"
        "meta" !important;
    row-gap: 14px !important;
    padding: 24px 28px 22px !important;
}

.detail-template__hero-intro {
    display: grid !important;
    gap: 10px !important;
}

.detail-template__hero-context,
.detail-template__hero-titleblock {
    display: grid;
    gap: 4px;
}

.detail-template__hero-eyebrow {
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: calc(11px * var(--font-scale));
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.detail-template__hero-kicker,
.detail-template__hero-kicker-text {
    max-width: none !important;
    margin: 0;
    color: #ffffff;
    font-size: calc(17px * var(--font-scale)) !important;
    font-weight: 700;
    line-height: 1.25 !important;
}

.detail-template__hero-titleblock h1,
.detail-template__hero-intro h1,
.detail-template__hero h1 {
    max-width: none !important;
    margin: 0;
    font-size: calc(31px * var(--font-scale)) !important;
    line-height: 1.05 !important;
}

.detail-template__meta {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px 18px !important;
}

.detail-template__meta-item,
.detail-template__meta-item--wide,
.detail-template__meta-item--hero-wide {
    padding-top: 10px !important;
}

.detail-template__meta-item dd {
    font-size: calc(14px * var(--font-scale)) !important;
    line-height: 1.28 !important;
}

.detail-template__sidecard--metric {
    display: grid;
    gap: 10px;
    padding: 16px 18px 14px;
    border: 1px solid rgba(38, 107, 67, .10);
    border-radius: 18px;
    background: rgba(247, 250, 255, .98);
    box-shadow: 0 14px 28px rgba(15, 41, 77, .08);
    justify-items: stretch;
    text-align: center;
}

.detail-template__sidecard--metric .detail-template__metric-title {
    margin: 0;
    color: #173b66;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.2;
    font-weight: 900;
    text-align: center;
}

.detail-template__sidecard--metric .detail-template__metric-title span {
    color: #35584a;
    font-weight: 500;
}

.detail-template__sidecard--metric .detail-template__metric-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
}

.detail-template__sidecard--metric .detail-template__metric-icon {
    width: 58px;
    height: 58px;
    background: linear-gradient(180deg, #f2faf4 0%, #e5f5ea 100%);
    border: 1px solid rgba(31, 106, 61, .16);
    color: #1f6a3d;
}

.detail-template__sidecard--metric .detail-template__metric-icon svg {
    width: 28px;
    height: 28px;
}

.detail-template__sidecard--metric .detail-template__metric-row strong {
    color: #1f6a3d;
    font-size: calc(40px * var(--font-scale));
    font-weight: 800;
    line-height: 1;
}

.detail-template__sidecard--metric .detail-template__metric-date {
    margin: 0;
    color: #173b66;
    font-size: calc(13px * var(--font-scale));
    line-height: 1.35;
    text-align: center;
}

.detail-template__sidecard--metric .detail-template__metric-date strong {
    color: #102e55;
}

.detail-template__sidecard--metric .detail-template__metric-status {
    margin: 0;
    color: #173b66;
    font-size: calc(13px * var(--font-scale));
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

@media (max-width: 1120px) {
    .detail-template__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .detail-template__meta {
        grid-template-columns: 1fr !important;
    }

    .detail-template__meta-item--hero-wide {
        grid-column: auto !important;
    }
}

/* Otros Empleos mockup final */
.detail-template__otros-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 292px);
    gap: 18px;
    margin-top: 18px;
    align-items: start;
}

.detail-template__otros-main,
.detail-template__otros-side {
    display: grid;
    gap: 18px;
}

.detail-template__otros-side {
    width: 100%;
    max-width: 292px;
    justify-self: end;
    align-content: start;
}

.detail-template__module {
    padding: 0;
    overflow: hidden;
}

.detail-template__module-head {
    display: none;
}

.detail-template__module--perfil .detail-template__module-head {
    display: block;
    padding: 22px 24px 8px;
    border-bottom: 1px solid rgba(16, 46, 85, .08);
}

.detail-template__module--perfil .detail-template__module-lead {
    margin-bottom: 4px !important;
}

.detail-template__module--perfil .detail-template__subsection:first-child,
.detail-template__module--requisitos-generales .detail-template__subsection:first-child {
    padding-top: 12px;
}

.detail-template__module--requisitos-generales .detail-template__module-head {
    display: block;
    padding: 22px 24px 14px;
    border-bottom: 1px solid rgba(16, 46, 85, .08);
}

.detail-template__module-lead {
    margin: 0 0 18px !important;
    color: #173b66;
    font-size: calc(16px * var(--font-scale));
    line-height: 1.35;
}

.detail-template__subsection--legal p + p {
    margin-top: 18px !important;
}

.detail-template__module-head h2 {
    margin: 0;
    color: #213d83;
    font-size: calc(24px * var(--font-scale));
    line-height: 1.1;
    font-family: 'Roboto Slab', serif;
}

.detail-template__subsection {
    padding: 18px 24px 0;
}

.detail-template__subsection:last-child {
    padding-bottom: 24px;
}

.detail-template__subsection:first-child {
    padding-top: 24px;
}

.detail-template__subsection h3 {
    margin: 0 0 12px;
    color: #213d83;
    font-size: calc(24px * var(--font-scale));
    line-height: 1.1;
    font-weight: 700;
    font-family: 'Roboto Slab', serif;
}

.detail-template__optional {
    color: rgba(23, 59, 102, .6);
    font-size: .68em;
    font-weight: 700;
}

.detail-template__subsection p,
.detail-template__subsection li {
    color: #1d2f47;
    font-size: calc(15px * var(--font-scale));
    line-height: 1.65;
}

.detail-template__subsection p {
    margin: 0;
}

.detail-template__subsection ul,
.detail-template__subsection ol {
    margin: 0;
    padding-left: 22px;
}

.detail-template__subsection + .detail-template__subsection {
    border-top: 1px solid rgba(16, 46, 85, .08);
    padding-top: 18px;
}

.detail-template__subsection--file-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.detail-template__file-inline-meta {
    margin: 0 !important;
    color: #173b66;
    font-size: calc(16px * var(--font-scale));
    line-height: 1.35;
}

.detail-template__file-inline-meta strong {
    font-weight: 800;
}

.detail-template__file-link {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid rgba(16, 46, 85, .16);
    border-radius: 12px;
    background: #f7fbff;
    color: #1f4d8f;
    font-size: calc(14px * var(--font-scale));
    font-weight: 800;
    text-decoration: none;
}

.detail-template__file-meta {
    margin: 10px 0 0 !important;
    color: #5a708c;
    font-size: calc(13px * var(--font-scale));
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

@media (max-width: 1120px) {
    .detail-template__otros-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .detail-template__subsection--file-inline {
        flex-direction: column;
        align-items: flex-start;
    }
}


/* Logged-in variant for otrosempleos1 */
.detail-template__login-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 18px;
}

.detail-template__login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid #c6d2e0;
    border-radius: 8px;
    background: #fff;
    color: #144b87;
    font-size: calc(15px * var(--font-scale));
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: 0 1px 0 rgba(20, 75, 135, .06);
}

.detail-template__login-btn:hover,
.detail-template__login-btn:focus-visible {
    border-color: #9eb8d5;
    background: #f8fbff;
}

.detail-template__login-btn-icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
    color: currentColor;
}

.detail-template__login-btn-icon svg {
    width: 16px;
    height: 16px;
}

.detail-template__login-btn--wide {
    min-width: 268px;
}

.detail-template__module--discapacidad {
    border-color: #d6dde8;
}

.detail-template__module--discapacidad .detail-template__subsection {
    padding-top: 18px;
}

.detail-template__radio-group {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.detail-template__radio-option {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #16345f;
    font-size: calc(16px * var(--font-scale));
    font-weight: 500;
}

.detail-template__radio-option input {
    width: 16px;
    height: 16px;
    accent-color: #e53935;
}

.detail-template__postular-footer--login .detail-template__postular-footer-head h2 {
    font-size: calc(18px * var(--font-scale));
    line-height: 1.35;
}

.detail-template__postular-footer--login .detail-template__postular-footer-actions {
    justify-content: flex-start;
}

@media (max-width: 900px) {
    .detail-template__login-actions {
        grid-template-columns: 1fr;
    }

    .detail-template__login-btn,
    .detail-template__login-btn--wide {
        width: 100%;
    }
}


.detail-template__hero--contrata .detail-template__hero-intro {
    max-width: none;
}

.detail-template__hero--contrata .detail-template__hero-copy {
    max-width: none;
}

.detail-template__hero--contrata .detail-template__hero-copy p {
    max-width: none;
}


/* Contrata roman cards: show section headers */
.detail-template__hero--contrata ~ .detail-template-card .detail-template__module-head,
.detail-template__hero--contrata ~ .detail-template__otros-grid .detail-template__module-head {
    display: block;
    padding: 22px 24px 14px;
    border-bottom: 1px solid rgba(16, 46, 85, .08);
}

.detail-template__hero--contrata ~ .detail-template-card .detail-template__module-head h2,
.detail-template__hero--contrata ~ .detail-template__otros-grid .detail-template__module-head h2 {
    margin: 0;
}

.detail-template__hero--contrata ~ .detail-template-card .detail-template__subsection:first-child,
.detail-template__hero--contrata ~ .detail-template__otros-grid .detail-template__subsection:first-child {
    padding-top: 18px;
}

