@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

:root {
  --nav-bg:     #1A478A;
  --eu-yellow:  #FFCC00;
  --nav-text:   rgba(255,255,255,0.90);
  --text:       #26324B;
  --muted:      #546FA6;
  --border:     #CBD2E6;
  --danger:     #DA1E28;
  --danger-bg:  #FDECEA;
  --warn:       #8F5600;
  --warn-bg:    #FDF3E3;
  --ok:         #24A148;
  --ok-bg:      #E5F5EB;
  --tab-active: #2B4CA8;
  --font:       'Roboto', Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--font); color: var(--text); background: #F5F7FB; }

/* ── Header ─────────────────────────────────────────────── */
.hvd-header__top { background:#fff; border-bottom:1px solid var(--border); padding:12px 0; }
.hvd-header__top-inner { max-width:1280px; margin:0 auto; padding:0 24px; display:flex; align-items:center; }
.hvd-header__logo-link { display:flex; align-items:center; text-decoration:none; }
.hvd-header__logo { display:block; width:172px; height:auto; }
.hvd-header__divider { width:1px; height:32px; background:var(--border); margin:0 16px; }
.hvd-header__site-name { font-size:.9rem; font-weight:700; color:var(--text); }
/* Beta label next to the site name */
.hvd-beta-badge { margin-left:10px; padding:2px 9px; border-radius:999px; background:var(--eu-yellow); color:var(--text);
  font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; line-height:1.5; white-space:nowrap; }
.hvd-header__menubar { background:var(--nav-bg); width:100%; }
.hvd-header__menu { list-style:none; display:flex; max-width:1280px; margin:0 auto; padding:0 24px; }
.hvd-header__menu-link { display:block; padding:14px 20px; font-family:var(--font); font-size:.9375rem; color:var(--nav-text); text-decoration:none; border-bottom:3px solid transparent; transition:background .15s; white-space:nowrap; }
.hvd-header__menu-link:hover { background:rgba(255,255,255,.10); color:#fff; }
.hvd-header__menu-link--active { font-weight:700; color:#fff; border-bottom-color:var(--eu-yellow); background:rgba(255,255,255,.10); }

/* ── Layout ──────────────────────────────────────────────── */
.hvd-page { padding-top:2rem; padding-bottom:2rem; }
.hvd-page-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:1rem; padding-bottom:1rem; border-bottom:2px solid #3860ED; }
.hvd-page-meta { font-size:.8rem; color:var(--muted); margin-top:4px; }
.hvd-detail-bar { background:#EEF1FA; border-bottom:1px solid var(--border); padding:10px 0; }
.hvd-detail-bar__inner { display:flex; align-items:center; gap:12px; }
.hvd-detail-bar__label { font-size:.875rem; font-weight:700; }
.hvd-detail-bar__meta { font-size:.75rem; color:var(--muted); margin-left:auto; }
.hvd-two-col { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.hvd-card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }

/* ── Reports section spacing ──────────────────────────────── */
#page-reports > * + * { margin-top:1.5rem; }
#page-reports .hvd-table th,
#page-reports .hvd-table td { padding-top:12px; padding-bottom:12px; }

/* ── Cards ───────────────────────────────────────────────── */
.hvd-card { background:#fff; border:1px solid var(--border); border-radius:4px; padding:20px 24px; box-shadow:0 1px 3px rgba(38,50,75,.06); }
.hvd-card--clickable { cursor:pointer; transition:box-shadow .15s, border-color .15s; }
.hvd-card--clickable:hover { border-color:#3860ED; box-shadow:0 2px 8px rgba(56,96,237,.15); }
.hvd-card__label { font-size:.6875rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#3860ED; margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid var(--border); }
.hvd-card__icon { font-size:2rem; margin-bottom:8px; }
.hvd-card__title { font-size:1rem; font-weight:700; margin-bottom:4px; }
.hvd-card__desc { font-size:.85rem; color:var(--muted); }


.hvd-source-portals { padding-top: 2rem; }
.hvd-portal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.hvd-portal-card { display: flex; flex-direction: column; gap: 14px; }
.hvd-portal-card__count { font-size: .95rem; color: var(--muted); }
.hvd-portal-card__metric { color: var(--muted); font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.hvd-portal-card__status { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; font-size: .85rem; }
.hvd-portal-card__badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hvd-portal-card__pct { color: var(--danger); flex-shrink: 0; }
.hvd-portal-card__button { justify-content: center; width: 100%; margin-top: 4px; }

/* ── Tabs ────────────────────────────────────────────────── */
.hvd-tabs-wrapper { padding-top:1.5rem; }
.hvd-tablist { list-style:none; display:flex; border-bottom:2px solid var(--border); }
.hvd-tab { font-family:var(--font); font-size:.9375rem; font-weight:400; color:var(--muted); background:transparent; border:none; border-bottom:3px solid transparent; padding:12px 20px; margin-bottom:-2px; cursor:pointer; transition:color .15s; }
.hvd-tab:hover { color:var(--tab-active); }
.hvd-tab--active { font-weight:700; color:var(--tab-active); border-bottom-color:var(--tab-active); }

/* Sub-tabs (guidance) */
.hvd-subtabs { display:flex; gap:8px; margin-bottom:0; flex-wrap:wrap; }
.hvd-subtab { font-family:var(--font); font-size:.875rem; padding:8px 16px; border:1px solid var(--border); border-radius:4px; background:#fff; color:var(--muted); cursor:pointer; transition:all .15s; }
.hvd-subtab:hover { border-color:#3860ED; color:#3860ED; }
.hvd-subtab--active { background:#3860ED; color:#fff; border-color:#3860ED; font-weight:700; }
.hvd-subtab-panel { display:none; }
.hvd-subtab-panel:first-of-type, .hvd-subtab-panel[style=""] { display:block; }

/* ── Metrics ─────────────────────────────────────────────── */
.hvd-metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:8px; }
.hvd-metric {
  background:#fff;
  border-radius:4px;
  padding:20px 24px;
  border:1px solid var(--border);
  border-top:3px solid #3860ED;
  box-shadow:0 1px 4px rgba(38,50,75,.07);
  transition:box-shadow .15s;
}
.hvd-metric:hover { box-shadow:0 3px 10px rgba(38,50,75,.12); }
.hvd-metric--danger { border-top-color:var(--danger); background:var(--danger-bg); }
.hvd-metric--warn   { border-top-color:#F39811;       background:var(--warn-bg); }
.hvd-metric__val {
  font-size:2.75rem;
  font-weight:300;
  line-height:1;
  color:var(--text);
  margin-bottom:8px;
  letter-spacing:-.02em;
}
.hvd-metric--danger .hvd-metric__val { color:var(--danger); }
.hvd-metric--warn   .hvd-metric__val { color:var(--warn); }
.hvd-metric__lbl {
  font-size:.8125rem;
  font-weight:500;
  color:var(--muted);
  line-height:1.4;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.hvd-metric__note { font-size:.75rem; margin-top:6px; color:var(--muted); }
.hvd-metric--danger .hvd-metric__note { color:var(--danger); }
.hvd-metric--warn   .hvd-metric__note { color:var(--warn); }

/* ── Progress bars ───────────────────────────────────────── */
.hvd-progress-list { display:flex; flex-direction:column; gap:8px; }
.hvd-progress-row { display:flex; align-items:center; gap:10px; }
.hvd-progress-lbl { font-size:.875rem; color:var(--muted); width:200px; flex-shrink:0; }
.hvd-bar-track { flex:1; height:8px; background:#E0E5F5; border-radius:4px; overflow:hidden; }
.hvd-bar-fill { height:100%; border-radius:4px; transition:width .6s ease; }
.hvd-bar-fill--ok { background:var(--ok); }
.hvd-bar-fill--warn { background:#F39811; }
.hvd-bar-fill--danger { background:var(--danger); }
.hvd-progress-pct { font-size:.875rem; font-weight:700; width:40px; text-align:right; }
.hvd-progress-pct--ok { color:var(--ok); }
.hvd-progress-pct--warn { color:var(--warn); }
.hvd-progress-pct--danger { color:var(--danger); }

/* ── Roadmap ─────────────────────────────────────────────── */
.hvd-roadmap { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:8px 0; }
.hvd-roadmap__step { background:#F3F5FB; border-radius:4px; padding:12px 16px; text-align:center; min-width:100px; }
.hvd-roadmap__step--final { background:var(--ok-bg); }
.hvd-roadmap__val { font-size:1.5rem; font-weight:700; }
.hvd-roadmap__lbl { font-size:.75rem; color:var(--muted); }
.hvd-roadmap__delta { font-size:.75rem; font-weight:700; color:var(--ok); }
.hvd-roadmap__arrow { font-size:1.2rem; color:var(--border); }

/* ── Check items ─────────────────────────────────────────── */
.hvd-check-item { display:flex; gap:12px; padding:14px 0; border-bottom:1px solid var(--border); }
.hvd-check-item:last-child { border-bottom:none; }
.hvd-check-icon { font-size:18px; flex-shrink:0; margin-top:1px; }
.hvd-check-icon--ok { color:var(--ok); }
.hvd-check-icon--warn { color:#F39811; }
.hvd-check-icon--danger { color:var(--danger); }
.hvd-check-icon--info { color:var(--muted); }
.hvd-check-body { flex:1; }
.hvd-check-head { display:flex; align-items:center; gap:8px; margin-bottom:4px; flex-wrap:wrap; }
.hvd-check-name { font-size:1rem; font-weight:700; }
.hvd-check-desc { font-size:.875rem; color:var(--muted); line-height:1.5; }
.hvd-findings-interpretation {
  margin: 12px 0 6px;
  padding: 16px 18px;
  background: #F8F9FD;
  border: 1px solid var(--border);
  border-left: 4px solid #3860ED;
  border-radius: 4px;
}
.hvd-findings-interpretation__title {
  margin-bottom: 8px;
  color: var(--text);
  font-size: .9375rem;
  font-weight: 700;
}
.hvd-findings-interpretation p {
  color: var(--muted);
  font-size: .875rem;
  line-height: 1.55;
}
.hvd-findings-interpretation p + p { margin-top: 6px; }

/* ── Action items ────────────────────────────────────────── */
.hvd-action-item { display:flex; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid var(--border); }
.hvd-action-item:last-child { border-bottom:none; }
.hvd-action-num { font-size:1.75rem; font-weight:700; color:var(--border); width:28px; flex-shrink:0; }
.hvd-action-body { flex:1; }
.hvd-action-title { font-size:1rem; font-weight:700; margin-bottom:3px; }
.hvd-action-desc { font-size:.875rem; color:var(--muted); }
.hvd-action-impact { font-size:1rem; font-weight:700; color:var(--ok); white-space:nowrap; }

/* ── Badges ──────────────────────────────────────────────── */
.hvd-badge { display:inline-flex; align-items:center; font-size:.6875rem; font-weight:700; padding:2px 8px; border-radius:3px; }
.hvd-badge--mandatory { background:var(--danger-bg); color:var(--danger); border:1px solid var(--danger); }
.hvd-badge--recommended { background:var(--warn-bg); color:var(--warn); border:1px solid #F39811; }
.hvd-badge--ok { background:var(--ok-bg); color:var(--ok); border:1px solid var(--ok); }
.hvd-badge--info { background:#F5F7FB; color:var(--muted); border:1px solid var(--border); }

/* ── Table ───────────────────────────────────────────────── */
.hvd-table-wrap { border:1px solid var(--border); border-radius:4px; overflow-x:auto; }
.hvd-table { width:100%; border-collapse:collapse; font-size:.875rem; }
.hvd-table th { background:#F3F5FB; padding:8px 12px; text-align:left; font-weight:700; font-size:.6875rem; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); border-bottom:2px solid #3860ED; }
.hvd-table td { padding:10px 12px; border-bottom:1px solid var(--border); vertical-align:middle; }
.hvd-table tr:last-child td { border-bottom:none; }
.hvd-table tr:hover td { background:#F8F9FD; }
.icon-ok { color:var(--ok); }
.icon-miss { color:var(--danger); }
.icon-warn { color:#F39811; }

/* ── Dataset toolbar ─────────────────────────────────────── */
.hvd-ds-toolbar { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.hvd-input, .hvd-select { padding:8px 12px; border:2px solid var(--border); border-radius:4px; font-family:var(--font); font-size:.875rem; background:#fff; color:var(--text); }
.hvd-input { flex:1; min-width:200px; }
.hvd-input:focus, .hvd-select:focus { outline:none; border-color:#3860ED; }

/* ── Buttons ─────────────────────────────────────────────── */
.hvd-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border:2px solid #3860ED; border-radius:4px; background:#fff; font-family:var(--font); font-size:.875rem; font-weight:700; color:#3860ED; cursor:pointer; transition:all .15s; text-decoration:none; }
.hvd-btn:hover { background:#3860ED; color:#fff; }
.hvd-btn--primary { background:#3860ED; color:#fff; }
.hvd-btn--primary:hover { background:#2B4CA8; border-color:#2B4CA8; }
.hvd-btn--outline { background:transparent; border-color:rgba(255,255,255,.4); color:#3860ED; }

/* Dataset pagination */
.hvd-table-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:12px; }
.hvd-table-count { font-size:.8rem; color:var(--muted); }
.hvd-pagination { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.hvd-pagination__size, .hvd-pagination__page { display:inline-flex; align-items:center; gap:6px; font-size:.8rem; }
.hvd-pagination .hvd-btn { justify-content:center; min-width:36px; padding:6px 10px; }
.hvd-pagination .hvd-btn:disabled { background:#fff; color:var(--muted); border-color:var(--border); opacity:.5; cursor:default; }
.hvd-page-input { width:4.5rem; padding:8px; border:2px solid var(--border); border-radius:4px; background:#fff; color:var(--text); font:inherit; text-align:center; }
.hvd-page-input:focus { outline:2px solid #3860ED; outline-offset:2px; }
.hvd-table .hvd-table-empty { padding:24px; text-align:center; color:var(--muted); }
.hvd-table-note { margin-top:12px; color:var(--muted); font-size:.8rem; }
.hvd-category-check { white-space:nowrap; }
.hvd-category-check span:last-child { font-size:.75rem; }
.hvd-table-wrap:focus-visible { outline:2px solid #3860ED; outline-offset:2px; }

/* ── Code box ────────────────────────────────────────────── */
.hvd-code-box { background:#26324B; color:#D4D2CC; border-radius:4px; padding:14px 16px; font-family:'Courier New',monospace; font-size:.75rem; line-height:1.8; overflow-x:auto; }
.hvd-code-title { font-family:var(--font); font-size:.6875rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#546FA6; margin-bottom:8px; }
.hvd-code-pred { color:#82C4E0; }
.hvd-code-iri { color:#8FCA76; }
.hvd-code-comment { color:#546FA6; }

/* ── Inline code ─────────────────────────────────────────── */
code { font-family:'Courier New',monospace; font-size:.8em; background:#F3F5FB; border:1px solid var(--border); padding:1px 5px; border-radius:3px; color:#1A3A6C; }

/* ── Prevent empty dynamic containers creating blank space ── */
#findings-mandatory:empty,
#findings-recommended:empty,
#findings-passing:empty { display:none; }

/* ── Guidance — two-column pedagogical layout ──────────────── */
.hvd-guide-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(38,50,75,.06);
}
.hvd-guide-card--focus {
  background: #F7F7FA;
  border-radius: 8px;
}
.hvd-guide-head {
  padding: 28px 22px 20px;
}
.hvd-guide-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  min-height: 360px;
}
.hvd-guide-layout--focus {
  grid-template-columns: 1fr 520px;
  min-height: auto;
}
/* Sections with a links figure: a wider right column, below the text on smaller screens */
.hvd-guide-layout--links {
  grid-template-columns: 1fr 460px;
}
@media (max-width: 1100px) {
  .hvd-guide-layout--links { grid-template-columns: 1fr; }
  .hvd-guide-layout--links .hvd-guide-left { border-right: none; border-bottom: 1px solid var(--border); }
}
.hvd-guide-left {
  padding: 28px 32px;
  border-right: 1px solid var(--border);
}
.hvd-guide-left--focus {
  padding: 16px 28px 20px;
  border-right: none;
}
.hvd-guide-right {
  padding: 28px 24px;
  background: #F5F7FB;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: stretch;
  justify-content: flex-start;
}
.hvd-guide-right--focus {
  padding: 8px 20px 20px;
  background: #fff;
  align-items: center;
}
.hvd-guide-article {
  font-size: .6875rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #3860ED;
  margin-bottom: 8px;
}
.hvd-guide-title {
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--text);
  line-height: 1.4;
  margin-bottom: 14px;
}
.hvd-guide-notice {
  margin: 0 0 14px;
}
.hvd-guide-notice__emphasis {
  color: var(--danger);
  font-weight: 700;
}
.hvd-guide-body {
  font-size: .9rem;
  color: var(--muted);
  line-height: 1.7;
}
.hvd-guide-body + .hvd-guide-body { margin-top: 14px; }
.hvd-guide-requirements { margin-top: 14px; }
.hvd-guide-requirements__label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 6px;
  font-size: .8125rem;
  font-weight: 700;
}
.hvd-guide-requirements__label span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: 0 0 7px;
}
.hvd-guide-requirements--required .hvd-guide-requirements__label { color: #A95C00; }
.hvd-guide-requirements--required .hvd-guide-requirements__label span { background: #E87800; }
.hvd-guide-requirements--optional .hvd-guide-requirements__label { color: #1A6630; }
.hvd-guide-requirements--optional .hvd-guide-requirements__label span { background: var(--ok); }
.hvd-guide-requirements ul {
  margin-left: 17px;
  color: var(--text);
  font-size: .875rem;
  line-height: 1.7;
}
.hvd-guide-requirements li { padding-left: 2px; }
.hvd-guide-requirements li + li { margin-top: 4px; }
.hvd-guide-list {
  margin: 12px 0 16px 18px;
  font-size: .875rem;
  color: var(--muted);
  line-height: 1.8;
}
.hvd-guide-prefix-box {
  margin-top: 16px;
  padding: 10px 14px;
  background: #F3F5FB;
  border-radius: 4px;
  font-size: .8rem;
  color: var(--muted);
  margin-bottom: 20px;
}
.hvd-guide-prefix-row { margin-bottom: 4px; }
.hvd-guide-prefix-row:last-child { margin-bottom: 0; }
.hvd-guide-link { color: #3860ED; text-decoration: none; }
.hvd-guide-link:hover { text-decoration: underline; }
.hvd-guide-focus {
  margin: 0 22px 22px;
  border: 1px solid #CAD1E1;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.hvd-guide-focus__header {
  background: #D9DEEA;
  padding: 18px 28px;
  font-size: 1rem;
  font-weight: 700;
  color: #171A22;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hvd-guide-focus__close {
  background: transparent;
  border: none;
  color: #3860ED;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  padding: 0;
}
.hvd-guide-focus__close:focus {
  outline: 2px solid #3860ED;
  outline-offset: 2px;
}
.hvd-accordion {
  margin: 0 22px 22px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}
.hvd-accordion-item + .hvd-accordion-item {
  border-top: 1px solid #D5DEF4;
}
.hvd-accordion-item[open] {
  background: #FAFBFF;
}
.hvd-accordion-summary {
  list-style: none;
  cursor: pointer;
  padding: 16px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.hvd-accordion-summary::-webkit-details-marker { display: none; }
.hvd-accordion-title {
  font-size: 1rem;
  color: var(--text);
  line-height: 1.5;
}
.hvd-accordion-icon {
  color: #3860ED;
  font-size: 1.8rem;
  font-weight: 300;
  line-height: 1;
  flex-shrink: 0;
}
.hvd-accordion-icon::before { content: "+"; }
.hvd-accordion-item[open] .hvd-accordion-icon::before { content: "-"; }
.hvd-accordion-panel {
  padding: 0 22px 20px;
}
.hvd-accordion-panel--layout {
  padding: 0;
}

/* ── DCAT diagram box ────────────────────────────────────────── */
.hvd-guide-diagram {
  width: 100%;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
  font-size: .8125rem;
}
.hvd-diagram-title {
  background: #E8EDF8;
  padding: 8px 12px;
  font-weight: 700;
  font-style: italic;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  text-align: center;
}
.hvd-diagram-section {
  padding: 5px 12px;
  font-size: .75rem;
  font-weight: 600;
  border-bottom: 1px solid var(--border);
}
.hvd-diagram-required { background: #E8EDF8; color: #2B4CA8; }
.hvd-diagram-optional { background: #F3F2ED; color: #4A4A45; }
.hvd-diagram-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 12px;
  border-bottom: 1px solid #F0F2F8;
  gap: 8px;
}
.hvd-diagram-row:last-child { border-bottom: none; }
.hvd-diagram-type {
  font-size: .75rem;
  color: var(--muted);
  white-space: nowrap;
}
/* Links between entities, drawn under a class diagram */
.hvd-links-svg { display: block; width: 100%; height: auto; padding: 10px 8px 4px; box-sizing: border-box; font-family: inherit; }
.hvd-links-svg .hvd-links-node { cursor: pointer; }
.hvd-links-svg .hvd-links-node rect { fill: #EEF2FB; stroke: #B9C6E8; }
.hvd-links-svg .hvd-links-node:hover rect,
.hvd-links-svg .hvd-links-node:focus rect { fill: #DCE4F5; stroke: #2B4CA8; }

/* ── Code modal ──────────────────────────────────────────────── */
.hvd-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(38,50,75,.5);
  z-index: 1000;
  align-items: center;
  justify-content: center;
}
.hvd-modal[style*="display:flex"],
.hvd-modal[style*="display: flex"] { display: flex !important; }
.hvd-modal-box {
  background: #fff;
  border-radius: 4px;
  width: 680px;
  max-width: 95vw;
  max-height: 85vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 8px 32px rgba(38,50,75,.2);
}
.hvd-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border);
  font-weight: 700;
  font-size: .9375rem;
  color: var(--text);
  background: #F5F7FB;
}
.hvd-modal-close {
  background: none;
  border: none;
  font-size: 1.1rem;
  color: var(--muted);
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
}
.hvd-modal-close:hover { background: var(--border); color: var(--text); }
.hvd-modal-body { padding: 20px; overflow-y: auto; }
.hvd-modal-code-title {
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 8px;
}
.hvd-modal-code {
  background: #EEF1FA;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 14px 16px;
  font-family: 'Courier New', monospace;
  font-size: .8125rem;
  line-height: 1.8;
  color: var(--text);
  overflow-x: auto;
}

/* ── Page visibility ─────────────────────────────────────── */
/* Using both the page div and an inner wrapper to defeat ECL overrides */
.hvd-page { display: block; }
.hvd-page.hvd-hidden { display: none !important; }
.hvd-page.hvd-hidden .hvd-page-inner,
.hvd-page.hvd-hidden .ecl-container,
.hvd-page.hvd-hidden > * { display: none !important; }
#page-about.hvd-hidden,
#page-reports.hvd-hidden,
#page-detail.hvd-hidden { display: none !important; }

@media (max-width: 768px) {
  .hvd-portal-grid { grid-template-columns: 1fr; }
}

/* ── Report form ─────────────────────────────────────────── */
.hvd-report-intro {
  max-width: 720px;
  margin-top: 24px;
  margin-bottom: 32px;
  line-height: 1.45;
}
.hvd-report-form {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 36px 40px;
  max-width: 900px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.hvd-report-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 32px;
  row-gap: 28px;
}
.hvd-report-field { display: flex; flex-direction: column; gap: 12px; }
.hvd-report-label {
  font-size: .875rem;
  font-weight: 700;
  color: var(--text);
}
.hvd-required { color: var(--danger); }
.hvd-select--full {
  width: 100%;
  padding: 10px 14px;
  border: 2px solid var(--border);
  border-radius: 4px;
  font-family: var(--font);
  font-size: .9375rem;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  appearance: auto;
}
.hvd-select--full:focus { outline: none; border-color: var(--tab-active); }
.hvd-report-actions { display: flex; justify-content: center; margin-top: 32px; }
.hvd-btn--download {
  background: var(--tab-active);
  color: #fff;
  border-color: var(--tab-active);
  padding: 12px 32px;
  font-size: 1rem;
}
.hvd-btn--download:hover { background: #1a3a8f; border-color: #1a3a8f; }

@media (max-width: 768px) {
  .hvd-report-form { padding: 28px 24px; }
  .hvd-report-row { grid-template-columns: 1fr; }
}

/* ── Home page ───────────────────────────────────────────── */
.hvd-home { max-width: 1180px; }
.hvd-home-hero {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--border);
  border-top: 4px solid #3860ED;
  border-radius: 4px;
  color: var(--text);
  padding: 40px 48px;
  box-shadow: 0 1px 4px rgba(38,50,75,.07);
}
.hvd-home-hero::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 0;
  width: 96px;
  height: 4px;
  background: var(--eu-yellow);
}
.hvd-home-hero__content {
  position: relative;
  max-width: 880px;
  z-index: 1;
}
.hvd-home-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  color: #3860ED;
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hvd-home-kicker::before {
  content: "";
  width: 28px;
  height: 3px;
  background: var(--eu-yellow);
}
.hvd-home-title {
  max-width: 820px;
  margin-bottom: 18px;
  color: var(--text);
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  line-height: 1.16;
  font-weight: 700;
}
.hvd-home-lead {
  max-width: 760px;
  color: var(--muted);
  font-size: 1.1rem;
  line-height: 1.6;
}
.hvd-home-panel {
  position: relative;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  margin-top: 28px;
  padding: 36px 40px;
  box-shadow: 0 1px 4px rgba(38,50,75,.07);
}
.hvd-home-panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, var(--eu-yellow) 0 96px, #3860ED 96px 100%);
}
.hvd-home-section-label {
  margin-bottom: 12px;
  color: #3860ED;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hvd-home-heading {
  margin-top: 28px;
  margin-bottom: 18px;
  color: var(--text);
  font-size: 1.5rem;
  line-height: 1.25;
}
.hvd-home-panel p {
  max-width: 920px;
  color: var(--text);
  font-size: 1rem;
  line-height: 1.65;
}
.hvd-home-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}
.hvd-home-feature {
  display: flex;
  gap: 16px;
  min-height: 132px;
  padding: 20px;
  background: #F8F9FD;
  border: 1px solid var(--border);
  border-left: 4px solid #3860ED;
  border-radius: 4px;
}
.hvd-home-feature__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  background: #EEF1FA;
  border-radius: 50%;
  font-size: 1.4rem;
}
.hvd-home-feature h3 {
  margin-bottom: 6px;
  color: var(--text);
  font-size: 1rem;
  line-height: 1.3;
}
.hvd-home-feature p {
  color: var(--muted);
  font-size: .9375rem;
  line-height: 1.55;
}
.hvd-home-closing { margin-top: 28px; }
@media (max-width: 900px) {
  .hvd-home-hero { padding: 40px 32px; }
  .hvd-home-panel { padding: 32px 28px; }
  .hvd-home-feature-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .hvd-home-hero { padding: 32px 24px; }
  .hvd-home-panel { padding: 28px 22px; }
  .hvd-home-feature { flex-direction: column; }
}

:is(#modal-dataset, #modal-distribution) .hvd-modal-code {
  margin: 0;
  padding: 0;
  border: 0;
  background: #fff;
  color: #000;
  font-family: Consolas, "Courier New", monospace;
  font-size: 14px;
  line-height: 1.65;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

:is(#modal-dataset, #modal-distribution) .hvd-code-pred { color: #0000ff; }
:is(#modal-dataset, #modal-distribution) .hvd-code-keyword { color: #a000ff; }
:is(#modal-dataset, #modal-distribution) .hvd-code-string { color: #b00000; }
:is(#modal-dataset, #modal-distribution) .hvd-code-iri { color: #1686a6; }
:is(#modal-dataset, #modal-distribution) .hvd-code-comment { color: #008000; }

.hvd-accordion-panel--layout .hvd-guide-left,
.hvd-accordion-panel--layout .hvd-guide-right {
  padding-top: 12px;
}

.hvd-accordion-panel--layout .hvd-guide-left > .hvd-guide-requirements:first-child {
  margin-top: 0;
}