:root{
  --navy:#0b2c5f;--blue:#1559c7;--blue2:#2878e6;--teal:#1fd6d0;--sky:#eef6ff;--sky2:#f8fbff;--ink:#152238;--muted:#61758f;--line:#d9e5f4;--white:#fff;--shadow:0 18px 45px rgba(20,55,105,.10);--green:#2f9e44;--amber:#e9a30b;--red:#d94841;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f7faff;color:var(--ink);line-height:1.5}
a{text-decoration:none;color:inherit} button,input,select{font:inherit}
.container{width:min(1240px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;font-size:.84rem;padding:8px 0}
.nav{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.nav-inner{min-height:94px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:18px;color:var(--navy);min-width:0}
.brand-logo{width:290px;height:72px;object-fit:contain;object-position:left center;display:block;flex:none}
.brand-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.brand-copy strong{font-size:1.15rem;line-height:1.2;color:var(--navy);max-width:520px}
.brand-copy span{font-size:1rem;color:#5f7697}
.nav-links{display:flex;align-items:center;gap:26px;font-size:.98rem;color:#314a68;flex-wrap:wrap}
.nav-links a.active,.nav-links a:hover{color:var(--blue);font-weight:800}
.badge-private{font-size:.73rem;padding:7px 10px;border-radius:999px;background:#edf5ff;border:1px solid #d4e7ff;color:#1b539f;font-weight:800}
.hero{background:radial-gradient(circle at 80% 18%,rgba(31,214,208,.14) 0,transparent 20%),radial-gradient(circle at 72% 22%,rgba(40,120,230,.12) 0,transparent 16%),linear-gradient(135deg,#f9fcff 0,#eef6ff 100%);padding:72px 0 60px;border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center}
.hero-visual{background:#fff;border:1px solid var(--line);border-radius:28px;padding:26px;box-shadow:var(--shadow);display:grid;place-items:center}
.hero-visual img{width:100%;max-width:500px;height:auto}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:#e1efff;color:#1450a6;border:1px solid #c7e0ff;border-radius:999px;padding:7px 12px;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
h1{font-size:clamp(2.35rem,5vw,4.5rem);line-height:1.03;margin:18px 0;color:var(--navy);letter-spacing:-.035em}.hero p{font-size:1.12rem;color:#4a607d;max-width:760px;margin:0 0 26px}
.hero-actions,.action-row{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:14px;font-weight:780;border:1px solid transparent;cursor:pointer;gap:10px}
.btn-primary{background:var(--blue);color:#fff}.btn-secondary{background:#fff;color:var(--navy);border-color:#c7d8ed}.btn-outline{background:#f3f8ff;border-color:#d6e7ff;color:#164f98}.btn-ghost{background:transparent;border-color:#d6e7ff;color:#164f98}
.btn-download{background:#0d4bb3;color:white;font-weight:900;letter-spacing:.06em;text-transform:uppercase;padding:16px 22px;justify-content:space-between;width:100%;max-width:410px;border-radius:14px}.btn-download .arrow{font-size:1.7rem;line-height:1}
.section{padding:58px 0}.section-tight{padding:32px 0}.section h2{font-size:2rem;color:var(--navy);margin:0 0 8px}.lead{color:var(--muted);margin:0 0 24px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:-34px;position:relative;z-index:2}.stat,.metric,.panel,.chart{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}.stat{padding:24px}.stat strong{display:block;font-size:2.2rem;color:var(--navy)}.stat span{color:var(--muted);font-size:.92rem}
.toolbar{margin:24px 0}.toolbar-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:20px;align-items:end}.filter-field{display:flex;flex-direction:column;gap:8px}.filter-field label{font-size:.84rem;font-weight:800;color:#385475}.toolbar-grid input,.toolbar-grid select,.dashboard-filters select{width:100%;padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);outline:none;box-shadow:0 4px 12px rgba(20,55,105,.04)}
.catalog-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:10px 0 18px}.subhead{margin:0;color:var(--navy);font-size:1.28rem}.result-count{font-size:.92rem;color:var(--muted);margin-top:6px}.mini-note{font-size:.82rem;color:#6982a1;max-width:420px;text-align:right}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 10px 28px rgba(20,55,105,.07);transition:.18s transform,.18s box-shadow}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card-visual{height:220px;position:relative;padding:16px;overflow:hidden}.card-visual.health{background:linear-gradient(135deg,#daf6f1,#f3fcfb)}.card-visual.medical{background:linear-gradient(135deg,#e2f0ff,#f5faff)}.card-visual.aqua{background:linear-gradient(135deg,#e2f6fb,#f5fcff)}.card-visual::after{content:"";position:absolute;width:178px;height:178px;border-radius:50%;right:-28px;bottom:-36px;border:28px solid rgba(21,89,199,.10)}
.visual-art{position:absolute;inset:0;display:grid;place-items:center;padding:18px;text-align:center}.visual-art .emoji{font-size:3.2rem;display:block;margin-bottom:10px}.visual-art .caption{font-weight:800;color:#284a77;font-size:1rem;max-width:82%}
.trl-badge{display:inline-block;background:var(--navy);color:#fff;border-radius:999px;padding:10px 14px;font-size:.86rem;font-weight:800;position:relative;z-index:2}.status-badge{position:absolute;right:16px;top:16px;background:#fff;color:#36506e;border:1px solid #cfe0f4;border-radius:999px;padding:7px 11px;font-size:.74rem;font-weight:800;max-width:180px;text-align:center;z-index:2}
.card-body{padding:24px}.card-body h3{margin:0 0 9px;color:var(--navy);font-size:1.08rem;line-height:1.35}.meta{font-size:.83rem;color:#60758f;margin-bottom:10px}.card-body p{color:#526780;font-size:.92rem;margin:0 0 16px;line-height:1.55}.card-link{display:inline-block;margin-top:18px;color:var(--blue);font-weight:800;font-size:1rem}
.panel,.chart,.metric{padding:24px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-grid .panel h3,.chart h3{margin-top:0;color:var(--navy)}
.detail-hero{padding:34px 0 26px;background:linear-gradient(135deg,#f9fcff,#edf6ff);border-bottom:1px solid var(--line)}.detail-actions{margin-bottom:8px;display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap}.back-link{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--navy);font-weight:800}.breadcrumbs{font-size:.85rem;color:#6b7f99;margin-bottom:14px}.detail-head{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:start}.detail-head h1{font-size:2.55rem;margin-top:10px}
.detail-side{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px}.kv{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #edf2f8;gap:16px}.kv:last-child{border:0}.kv span{color:var(--muted);font-size:.92rem}.kv strong{color:var(--navy);text-align:right;max-width:55%}
.detail-image{margin-top:20px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 10px 28px rgba(20,55,105,.05)}.detail-image .image-box{height:330px;border-radius:18px;display:grid;place-items:center;position:relative;overflow:hidden}.image-box.health{background:linear-gradient(135deg,#daf6f1,#f3fcfb)}.image-box.medical{background:linear-gradient(135deg,#e2f0ff,#f5faff)}.image-box.aqua{background:linear-gradient(135deg,#e2f6fb,#f5fcff)}.image-box::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-35px;bottom:-55px;border:38px solid rgba(21,89,199,.10)}.image-box .emoji{font-size:5.2rem;z-index:1}.image-box .caption{position:absolute;bottom:18px;left:18px;right:18px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.88);font-weight:800;color:#274873;z-index:1}.image-caption-note{font-size:.85rem;color:#6c84a2;margin-top:10px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}.stack-col{display:grid;gap:22px}.three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.content h3{color:var(--navy);margin:0 0 10px;font-size:1.15rem}.content p{color:#53687f;margin-top:0}.content ul{color:#53687f;padding-left:22px}.content li{margin-bottom:8px}
.ods-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.ods-row.compact{gap:8px;margin-top:2px}.ods-icon{width:126px;min-height:126px;border-radius:12px;background:var(--ods-color);color:#fff;padding:10px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 8px 20px rgba(20,55,105,.12)}.ods-icon.compact{width:92px;min-height:92px;padding:8px;border-radius:10px}.ods-top{display:flex;justify-content:space-between;align-items:flex-start}.ods-mini{font-size:.72rem;font-weight:900;letter-spacing:.05em}.ods-number{font-size:1.45rem;font-weight:900;line-height:1}.ods-icon.compact .ods-number{font-size:1.2rem}.ods-symbol{font-size:1.5rem;line-height:1}.ods-icon.compact .ods-symbol{font-size:1.2rem}.ods-label{font-size:.78rem;font-weight:800;line-height:1.15}.ods-icon.compact .ods-label{font-size:.66rem}
.keyword-list,.chip-list,.toggle-list,.legend-list{display:flex;flex-wrap:wrap;gap:10px}.keyword{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:#f4f9ff;border:1px solid #d8e7fb;color:#2f5c94;font-weight:700;font-size:.85rem}.chip{display:inline-flex;align-items:center;padding:9px 12px;border-radius:999px;background:#edf5ff;border:1px solid #d4e6ff;color:#184d91;font-weight:800;font-size:.86rem}
.radar-wrap{min-height:430px;display:grid;place-items:center}.radar-wrap svg{width:min(490px,100%);height:auto}.radar-note{font-size:.82rem;color:var(--muted);text-align:center;margin-top:-4px}.readiness-list{display:grid;gap:12px}.readiness-item{padding:12px 14px;border:1px solid #e2ecf8;border-radius:14px;background:#fbfdff}.readiness-item strong{display:block;color:var(--navy);margin-bottom:6px}.readiness-item p{margin:0;color:#53687f;font-size:.92rem;line-height:1.5}
.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.metric .num{font-size:2rem;font-weight:850;color:var(--navy)}.metric .lbl{font-size:.86rem;color:var(--muted)}
.chart-grid-2,.chart-grid-3{display:grid;gap:18px}.chart-grid-2{grid-template-columns:1fr 1fr}.chart-grid-3{grid-template-columns:repeat(3,1fr)}
.bars{display:flex;align-items:end;gap:10px;height:250px;padding-top:22px}.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:end;height:100%;gap:7px}.bar{width:76%;background:linear-gradient(180deg,var(--blue2),var(--navy));border-radius:8px 8px 2px 2px;min-height:3px}.bar.teal{background:linear-gradient(180deg,var(--teal),var(--blue))}.bar.green{background:linear-gradient(180deg,#66d18f,#2f9e44)}.bar.amber{background:linear-gradient(180deg,#ffd777,#e9a30b)}.bar.red{background:linear-gradient(180deg,#ff9f9a,#d94841)}.bar-val{font-size:.78rem;color:#47617f}.bar-lbl{font-size:.78rem;color:#6b7f99;text-align:center}
.linechart svg{width:100%;height:auto}.chart-note{font-size:.84rem;color:var(--muted);margin-top:10px}
.donut-wrap{display:grid;grid-template-columns:240px 1fr;gap:16px;align-items:center}.donut{width:200px;height:200px;border-radius:50%;margin:auto;position:relative}.donut::after{content:"";position:absolute;inset:34px;background:#fff;border-radius:50%;box-shadow:inset 0 0 0 1px #e8f0fa}.donut-center{position:absolute;inset:0;display:grid;place-items:center;z-index:1;font-weight:900;color:var(--navy);font-size:1.3rem;text-align:center}.legend-item{display:flex;align-items:center;gap:10px;font-size:.92rem;color:#49627f}.legend-swatch{width:14px;height:14px;border-radius:4px;display:inline-block}
.pipeline{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}.pipeline-step{background:#f4f9ff;border:1px solid #dbe9fb;border-radius:18px;padding:16px;text-align:center}.pipeline-step strong{display:block;font-size:1.5rem;color:var(--navy)}.pipeline-step span{font-size:.86rem;color:#516987}
.private-banner{display:flex;justify-content:space-between;gap:18px;align-items:center;background:#fff8e8;border:1px solid #f4dca8;color:#74541d;border-radius:16px;padding:16px 18px;margin-bottom:18px}.private-banner strong{display:block;color:#5b4318}
.dashboard-filters{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:end;margin:10px 0 18px}.toggle-box{border:1px solid var(--line);border-radius:18px;padding:16px;background:#fbfdff}.toggle-box h4{margin:0 0 10px;color:var(--navy)}.toggle-list label{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;background:#fff;border:1px solid #e1ebf8;border-radius:999px;font-size:.84rem;color:#355374}.toggle-list input{accent-color:var(--blue)}
.table-wrap{overflow:auto}.portfolio-table{width:100%;border-collapse:collapse;font-size:.9rem}.portfolio-table th,.portfolio-table td{padding:12px 10px;border-bottom:1px solid #e6effa;text-align:left;vertical-align:top}.portfolio-table th{color:var(--navy);font-size:.84rem;text-transform:uppercase;letter-spacing:.04em;background:#f9fbff;position:sticky;top:0}.portfolio-table td a{color:var(--blue);font-weight:700}
.status-pill{display:inline-block;border-radius:999px;padding:6px 10px;font-size:.76rem;font-weight:800}.status-open{background:#eaf7ef;color:#257942}.status-license{background:#edf5ff;color:#19539e}.status-negotiation{background:#fff5de;color:#9b6b00}.status-done{background:#ffe8e7;color:#b73029}
.traffic{display:inline-flex;gap:4px}.traffic-dot{width:12px;height:12px;border-radius:50%;display:inline-block}.t-green{background:var(--green)}.t-amber{background:var(--amber)}.t-red{background:var(--red)}
.footer{background:#09264f;color:#dbe8f7;padding:34px 0;margin-top:50px}.footer small{color:#a8bed7}
@media(max-width:1180px){.hero-grid,.detail-head,.two-col{grid-template-columns:1fr}.hero-visual{order:-1}.grid,.feature-grid,.chart-grid-3,.pipeline{grid-template-columns:1fr 1fr}.metric-grid,.chart-grid-2{grid-template-columns:1fr 1fr}.toolbar-grid,.dashboard-filters{grid-template-columns:1fr 1fr}.catalog-head{align-items:flex-start;flex-direction:column}.mini-note{text-align:left;max-width:none}.nav-links{gap:18px}}
@media(max-width:760px){.nav-links{display:none}.stats,.metric-grid,.grid,.feature-grid,.chart-grid-2,.chart-grid-3,.toolbar-grid,.dashboard-filters,.pipeline{grid-template-columns:1fr}.brand-logo{width:220px;height:58px}.brand-copy strong{font-size:1rem}.brand-copy span{font-size:.9rem}.stats{margin-top:0}.detail-head h1{font-size:2rem}.ods-icon{width:110px;min-height:110px}.ods-icon.compact{width:84px;min-height:84px}.donut-wrap{grid-template-columns:1fr}.detail-actions{align-items:flex-start;flex-direction:column}}

/* Gestión del portafolio */
.management-hero{padding:40px 0 30px;background:linear-gradient(135deg,#f9fcff,#edf6ff);border-bottom:1px solid var(--line)}
.management-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}
.upload-panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow)}
.upload-panel h3{margin:0 0 8px;color:var(--navy)}
.upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.file-drop{border:2px dashed #bdd5f2;border-radius:18px;padding:18px;background:#f8fbff;min-height:150px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.file-drop strong{color:var(--navy)}
.file-drop span{color:var(--muted);font-size:.87rem}
.file-drop input{margin-top:8px;width:100%}
.file-ok{display:inline-flex;align-items:center;gap:7px;color:#2f8245;font-weight:800;font-size:.83rem}
.preview-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.preview-form .full{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:7px}
.field label{font-size:.82rem;color:#385475;font-weight:800}
.field input,.field select,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--ink);outline:none}
.field textarea{min-height:88px;resize:vertical}
.readonly-box{padding:12px 14px;border:1px solid #e4edf8;border-radius:13px;background:#f8fbff;color:#526a87;font-size:.9rem}
.import-preview{display:none}.import-preview.visible{display:block}
.preview-readiness{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:10px 0 16px}
.level-mini{background:#edf5ff;border:1px solid #d5e6fb;border-radius:12px;padding:9px;text-align:center}.level-mini strong{display:block;color:var(--navy);font-size:1.15rem}.level-mini span{font-size:.72rem;color:#57718f}
.image-uploader{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center}.image-preview{width:150px;height:110px;border:1px dashed #bdd5f2;border-radius:15px;background:#f5f9ff;display:grid;place-items:center;overflow:hidden;color:#6d86a4;font-size:.8rem;text-align:center;padding:8px}.image-preview img{width:100%;height:100%;object-fit:cover}
.switches{display:flex;gap:16px;flex-wrap:wrap;margin:12px 0}.switches label{display:inline-flex;align-items:center;gap:8px;background:#f8fbff;border:1px solid #e1ebf8;border-radius:999px;padding:8px 11px;color:#355374;font-size:.86rem}.switches input{accent-color:var(--blue)}
.import-alert{padding:11px 13px;border-radius:12px;font-size:.85rem;margin:12px 0}.import-alert.info{background:#edf5ff;color:#27588f;border:1px solid #d7e7fb}.import-alert.warning{background:#fff5df;color:#8a6208;border:1px solid #f2dba2}.import-alert.success{background:#ebf8ef;color:#267643;border:1px solid #ccebd6}
.management-table .portfolio-table td{vertical-align:middle}.project-actions{display:flex;gap:6px;flex-wrap:wrap;min-width:250px}.action-mini{border:1px solid #d8e6f7;background:#fff;color:#24558f;border-radius:9px;padding:6px 8px;font-size:.75rem;font-weight:750;cursor:pointer}.action-mini:hover{background:#edf5ff}.action-mini.danger{color:#b33b35;border-color:#f1cfcc}.action-mini.warn{color:#8a6208;border-color:#f0d9a7}
.pub-dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px}.pub-on{background:#2fa344}.pub-off{background:#a6b4c5}
.version-chip{display:inline-block;border-radius:999px;padding:4px 7px;background:#eef5ff;color:#275a99;font-weight:800;font-size:.72rem}
.source-files{display:grid;gap:8px}.source-file{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;background:#f8fbff;border:1px solid #e1ebf8;border-radius:12px;font-size:.85rem}.source-file strong{color:var(--navy)}
@media(max-width:1000px){.management-grid{grid-template-columns:1fr}.preview-readiness{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){.upload-grid,.preview-form{grid-template-columns:1fr}.preview-form .full{grid-column:auto}.image-uploader{grid-template-columns:1fr}.preview-readiness{grid-template-columns:repeat(2,1fr)}}

.local-mode-warning{background:#fff3cd;border-bottom:1px solid #efd27a;color:#6b5310;padding:10px 4%;font-size:.9rem;position:relative;z-index:30}.local-mode-warning strong{color:#523d00}