
:root{
  --bg:#02040a;--bg2:#070b17;--paper:#f7f9fe;--ink:#17243b;--muted:#5d6b81;--line:#d9e2ed;
  --blue:#1689ff;--blue2:#0a55d9;--violet:#6e3cff;--magenta:#db32ff;--cyan:#44d9ff;
  --green:#2aa86a;--yellow:#e6ad20;--red:#d94c5a;--external:#6d7890;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0!important;color:var(--ink);
  background:
    radial-gradient(circle at 12% 0%,rgba(21,111,255,.34),transparent 32%),
    radial-gradient(circle at 90% 4%,rgba(193,42,255,.18),transparent 30%),
    linear-gradient(180deg,var(--bg2),var(--bg) 68%,#000)!important;
  font-family:"Segoe UI",Arial,Helvetica,sans-serif!important;line-height:1.58;
}
img{max-width:100%} a{color:#1769b6}
.v-world-nav{
  position:sticky;top:0;z-index:9999;display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:11px 18px;background:rgba(2,5,13,.96);border-bottom:1px solid rgba(68,217,255,.18);
  box-shadow:0 8px 28px rgba(0,0,0,.36);backdrop-filter:blur(13px)
}
.v-world-brand{
  margin-right:auto;color:#fff;font-weight:900;letter-spacing:.04em;display:flex;align-items:center;gap:10px
}
.v-world-brand:before{
  content:"";width:52px;height:30px;border-radius:8px;
  background:url("../brand/vires-systemstart.png") center/cover no-repeat;
  border:1px solid rgba(68,217,255,.25);box-shadow:0 0 16px rgba(78,74,255,.28)
}
.v-world-brand small{display:block;color:#9bb0cd;font-size:.68rem;font-weight:500;letter-spacing:.02em}
.v-world-nav a{
  color:#eaf4ff;text-decoration:none;font-size:.74rem;font-weight:850;padding:7px 10px;
  border:1px solid rgba(91,173,255,.22);border-radius:999px;background:rgba(14,37,70,.48)
}
.v-world-nav a:hover{border-color:var(--magenta);box-shadow:0 0 18px rgba(219,50,255,.22)}
main{
  width:min(1180px,calc(100% - 30px))!important;margin:26px auto 48px!important;background:#fff!important;
  border:1px solid rgba(89,150,255,.20)!important;border-radius:28px!important;overflow:hidden!important;
  box-shadow:0 32px 100px rgba(0,0,0,.52),0 0 45px rgba(27,116,255,.18),0 0 80px rgba(202,39,255,.07)!important
}

/* Landing hero: use the supplied VIRES image as the visual identity without placing text on top of its central logo. */
.v-hero{
  position:relative;isolation:isolate;overflow:hidden;color:#fff!important;
  min-height:720px;padding:585px 62px 48px!important;
  background:#050914!important;
}
.v-hero:before{
  content:"";position:absolute;z-index:-2;left:0;right:0;top:0;height:590px;
  background:url("../brand/vires-systemstart.png") center center/cover no-repeat;
}
.v-hero:after{
  content:"";position:absolute;z-index:-1;inset:0;
  background:linear-gradient(180deg,transparent 0%,transparent 61%,rgba(4,8,20,.76) 77%,#050914 86%);
}
.v-kicker{color:#79ddff!important;letter-spacing:.18em;text-transform:uppercase;font-size:.74rem;font-weight:900}
.v-hero h1{margin:.2em 0 .28em!important;color:#fff!important;font:600 clamp(2.5rem,5.4vw,5.3rem)/.98 Georgia,serif!important;letter-spacing:-.04em}
.v-hero p{max-width:900px;color:#d8e7f8!important;font:1.08rem/1.65 Georgia,serif!important}
.v-badges{display:flex;gap:7px;flex-wrap:wrap;margin-top:15px}
.v-badge{display:inline-flex;padding:6px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.17);background:rgba(8,19,42,.66);font-size:.7rem}

/* Common sections */
.v-world-section{padding:50px 62px}
.v-world-section.alt{background:linear-gradient(180deg,#f3f7fd,#fff)}
.v-world-section.dark{
  color:#fff;background:
    radial-gradient(circle at 90% 10%,rgba(219,50,255,.13),transparent 31%),
    radial-gradient(circle at 10% 90%,rgba(22,137,255,.16),transparent 32%),
    linear-gradient(145deg,#050b17,#0a1730)
}
.v-world-section h2{margin:0 0 12px;color:#193f6b;font:600 2rem/1.2 Georgia,serif}
.v-world-section.dark h2{color:#fff}
.v-world-lead{max-width:930px;color:#43556c;font:1.06rem/1.72 Georgia,serif}
.v-world-section.dark .v-world-lead{color:#d0dced}
.v-legend{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;margin:24px 0!important}
.v-light{min-width:0!important;overflow:hidden!important;padding:18px!important;border:1px solid var(--line)!important;border-radius:18px!important;background:#fff!important}
.v-light:before{content:"";display:block;width:46px;height:46px;border-radius:50%;margin-bottom:11px;box-shadow:0 0 18px rgba(0,0,0,.15)}
.v-light.g{border-top:5px solid var(--green)!important;background:#eef9f3!important}.v-light.g:before{background:var(--green)}
.v-light.y{border-top:5px solid var(--yellow)!important;background:#fff8df!important}.v-light.y:before{background:var(--yellow)}
.v-light.r{border-top:5px solid var(--red)!important;background:#fff0f2!important}.v-light.r:before{background:var(--red)}
.v-light.x{border-top:5px solid var(--external)!important;background:#f0f3f7!important}.v-light.x:before{background:var(--external)}
.v-light b{display:block;color:#173b63}.v-light p{margin:.35em 0 0;color:#475970;font-size:.9rem;overflow-wrap:anywhere}
.v-flow,.flow,.ha-formula{
  max-width:100%!important;overflow-x:auto!important;overflow-wrap:anywhere!important;white-space:pre-wrap!important;
  margin:20px 0!important;padding:18px 20px!important;border:1px solid rgba(68,217,255,.18)!important;border-radius:15px!important;
  background:#071326!important;color:#e8f5ff!important;font:.9rem/1.7 Consolas,"Courier New",monospace!important
}
.v-callout{margin:20px 0;padding:18px 20px;border-left:5px solid #3271ad;border-radius:0 15px 15px 0;background:#eef6ff;color:#364b63}
.v-callout.gold{border-left-color:#c79534;background:#fff8e8}.v-callout.green{border-left-color:var(--green);background:#eef9f3}

/* Landing cards — min-width:0 and auto rows prevent the old overlaps. */
.v-cardgrid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:15px!important;margin-top:24px!important;align-items:stretch!important}
.v-card{
  min-width:0!important;min-height:292px!important;display:flex!important;flex-direction:column!important;
  padding:20px!important;border:1px solid #d4e0ec!important;border-radius:20px!important;overflow:hidden!important;
  background:radial-gradient(circle at 90% 0%,rgba(22,137,255,.08),transparent 34%),linear-gradient(150deg,#fff,#f4f8fd)!important;
  box-shadow:0 12px 30px rgba(14,43,80,.08)!important
}
.v-card.norm{border-color:rgba(163,89,255,.36)!important;background:linear-gradient(145deg,#fbf7ff,#f4f8fd)!important}
.v-card .num{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--blue2),var(--violet));font-weight:900}
.v-card h3{margin:13px 0 7px;color:#173c67;font:600 1.22rem/1.25 Georgia,serif;overflow-wrap:anywhere}
.v-card p{margin:0 0 15px;color:#516177;font-size:.91rem;overflow-wrap:anywhere}
.v-card a{margin-top:auto;width:max-content;max-width:100%;text-decoration:none;padding:8px 11px;border:1px solid #b9cee3;border-radius:999px;font-size:.74rem;font-weight:900}

/* Subpages and brand mood */
.v-subhero,.cover{
  position:relative!important;isolation:isolate;overflow:hidden!important;color:#fff!important;
  padding:50px 62px 44px!important;background:#061126!important
}
.v-subhero:before,.cover:before{
  content:"";position:absolute;z-index:-2;inset:0;
  background:url("../brand/vires-systemstart.png") center 45%/cover no-repeat
}
.v-subhero:after,.cover:after{
  content:"";position:absolute;z-index:-1;inset:0;
  background:linear-gradient(90deg,rgba(2,4,12,.93) 0%,rgba(2,4,12,.78) 48%,rgba(2,4,12,.42) 100%)
}
.v-subhero h1,.cover h1{color:#fff!important;text-shadow:0 0 22px rgba(75,94,255,.34)}
.v-subhero p,.cover p{color:#d9e6f4!important}
.cover .k{color:#70d9ff!important}
.v-subhero h1{margin:.22em 0 .28em;font:600 clamp(2.3rem,5vw,4.6rem)/1.02 Georgia,serif}
.v-subhero p{max-width:900px;font:1.06rem/1.65 Georgia,serif}

/* Media slots */
.v-media-band{padding:28px 62px 8px!important;background:#fff!important}
.v-media-grid{display:grid!important;grid-template-columns:minmax(0,1.3fr) minmax(240px,.7fr)!important;gap:26px!important;align-items:start!important}
.v-media-grid.coveronly{grid-template-columns:minmax(250px,380px) minmax(0,1fr)!important}
.v-slot{position:relative;overflow:hidden;border:1px solid #cbd8e5;border-radius:20px;background:linear-gradient(145deg,#061126,#17395e);box-shadow:0 16px 38px rgba(13,39,72,.12)}
.v-slot.landscape{aspect-ratio:16/10}.v-slot.portrait{aspect-ratio:2/3}
.v-slot img{width:100%;height:100%;object-fit:cover;display:block}
.v-slot-fallback{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:22px;color:#dce8f7;background:radial-gradient(circle at 80% 10%,rgba(68,217,255,.18),transparent 32%),radial-gradient(circle at 20% 90%,rgba(219,50,255,.14),transparent 32%),linear-gradient(145deg,#061126,#17395e)}
.v-slot-fallback b{display:block;color:#f1d797;margin-bottom:7px}
.v-slot-path{font:.72rem/1.45 Consolas,monospace;color:#a2bad5;overflow-wrap:anywhere}
.v-media-copy{min-width:0}.v-media-copy h2{margin:0 0 9px;color:#194a7b;font:600 1.5rem/1.2 Georgia,serif}.v-media-copy p{color:#46576d}
.v-chiprow{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}

/* Chips and tables */
.v-chip,.chip,.ha-chip{
  display:inline-flex!important;align-items:center!important;max-width:100%!important;
  padding:5px 9px!important;border-radius:999px!important;font-size:.71rem!important;font-weight:900!important;
  border:1px solid!important;white-space:normal!important;line-height:1.25!important
}
.v-chip.g,.chip.g,.ha-chip.g{background:#edf9f2!important;color:#176840!important;border-color:#9fd1b4!important}
.v-chip.y,.chip.y,.ha-chip.y{background:#fff8df!important;color:#765000!important;border-color:#e2c46b!important}
.v-chip.r,.chip.r,.ha-chip.r{background:#fff0f2!important;color:#8c2a33!important;border-color:#e0a6ab!important}
.v-chip.x,.chip.x,.ha-chip.x{background:#eef2f6!important;color:#465466!important;border-color:#ccd5df!important}
.v-tablewrap,.tablewrap,.ha-table-wrap{width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;margin:16px 0 28px!important;border:1px solid #d4e0eb!important;border-radius:17px!important;background:#fff!important}
.v-table,table,.ha-table{width:100%!important;min-width:760px!important;border-collapse:collapse!important;table-layout:auto!important}
.v-table th,.v-table td,th,td,.ha-table th,.ha-table td{padding:10px 11px!important;border-right:1px solid #d6e0eb!important;border-bottom:1px solid #d6e0eb!important;vertical-align:top!important;text-align:left!important;overflow-wrap:anywhere!important;word-break:normal!important}
.v-table th,th,.ha-table th{background:#123e70!important;color:#fff!important}

/* Original detailed HTML pages */
.content,.ha-appendix,.v-prose{padding:42px 62px 62px!important;max-width:100%!important;overflow:hidden!important}
.content h2,.ha-appendix h2,.v-prose h2{margin:1.9em 0 .65em!important;padding-bottom:7px!important;border-bottom:1px solid #d7e1ec!important;color:#174777!important;font:600 1.58rem/1.22 Georgia,serif!important}
.content h3,.ha-appendix h3,.v-prose h3{color:#244f7d!important}
.content p,.content li,.ha-appendix p,.ha-appendix li,.v-prose p,.v-prose li{color:#2c3c51!important;overflow-wrap:anywhere}
.legend,.ha-legend,.cards,.ha-role-grid,.ha-stage-grid{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important
}
.legend .light,.ha-light,.card,.ha-role,.ha-stage{min-width:0!important;overflow:hidden!important}
.core,.ha-core,.audit,.ha-audit,.note,.ha-note,.ha-blue-note,.ha-final{max-width:100%!important;overflow-wrap:anywhere!important}
.ha-appendix{background:#fff!important}
.ha-appendix h1{color:#173e6c!important;font:600 clamp(2.1rem,4vw,3.7rem)/1.04 Georgia,serif!important}
.ha-light.green:before{background:var(--green)!important}.ha-light.yellow:before{background:var(--yellow)!important}.ha-light.red:before{background:var(--red)!important}
.ha-light.green{border-top-color:var(--green)!important}.ha-light.yellow{border-top-color:var(--yellow)!important}.ha-light.red{border-top-color:var(--red)!important}
.ha-audit{background:#071326!important}.ha-audit h3,.ha-audit p,.ha-audit li{color:#e5f0ff!important}

/* Footer */
.v-page-footer{padding:28px 62px 36px!important;background:#f4f8fd!important;border-top:1px solid #d6e0eb!important;color:#627389!important;font-size:.82rem!important}
.v-page-footer .links{display:flex!important;gap:7px!important;flex-wrap:wrap!important;margin-top:11px!important}
.v-page-footer a{display:inline-flex!important;padding:6px 9px!important;border:1px solid #c7d5e4!important;border-radius:999px!important;text-decoration:none!important;font-size:.71rem!important;font-weight:800!important}

/* Responsive: nothing may sit on top of anything else. */
@media(max-width:960px){
  main{width:calc(100% - 16px)!important;margin:8px auto 30px!important}
  .v-world-section,.v-subhero,.v-prose,.v-media-band,.v-page-footer,.content,.ha-appendix{padding-left:24px!important;padding-right:24px!important}
  .v-legend{grid-template-columns:1fr 1fr!important}
  .v-cardgrid{grid-template-columns:1fr 1fr!important}
  .v-media-grid,.v-media-grid.coveronly{grid-template-columns:1fr!important}
  .v-slot.portrait{max-width:380px;margin:auto}
}
@media(max-width:660px){
  main{width:100%!important;margin:0!important;border-radius:0!important;border-left:0!important;border-right:0!important}
  .v-world-nav{position:relative}
  .v-world-brand{width:100%;margin-bottom:4px}
  .v-hero{min-height:auto!important;padding:260px 22px 38px!important}
  .v-hero:before{height:275px!important;background-size:cover!important}
  .v-hero:after{background:linear-gradient(180deg,transparent 0%,rgba(4,8,20,.30) 50%,#050914 68%)!important}
  .v-legend,.v-cardgrid,.legend,.ha-legend,.cards,.ha-role-grid,.ha-stage-grid{grid-template-columns:1fr!important}
  table,.v-table,.ha-table{min-width:680px!important}
}
@media print{
  body{background:#fff!important}.v-world-nav{display:none!important}
  main{width:auto!important;margin:0!important;box-shadow:none!important;border:0!important;border-radius:0!important}
  .v-hero,.v-subhero,.cover{background:#fff!important;color:#111!important;padding:10mm 4mm!important;min-height:auto!important}
  .v-hero:before,.v-hero:after,.v-subhero:before,.v-subhero:after,.cover:before,.cover:after{display:none!important}
  .v-hero h1,.v-hero p,.v-subhero h1,.v-subhero p,.cover h1,.cover p,.cover .k{color:#111!important;text-shadow:none!important}
  .v-world-section,.v-prose,.v-media-band,.v-page-footer,.content,.ha-appendix{padding:9mm 4mm!important}
  .v-card,.v-light,.v-slot,.card,.ha-light{box-shadow:none!important;break-inside:avoid}
}


/* ---------- Gesamtprojekt-Prozentbewertung ---------- */
.share-summary{
  display:grid;grid-template-columns:1.05fr .95fr;gap:18px;margin:24px 0 30px;align-items:stretch
}
.share-hero{
  position:relative;overflow:hidden;padding:28px;border-radius:22px;color:#fff;
  background:
    radial-gradient(circle at 90% 0%,rgba(219,50,255,.22),transparent 34%),
    radial-gradient(circle at 10% 100%,rgba(22,137,255,.26),transparent 38%),
    linear-gradient(145deg,#061126,#102d54);
  border:1px solid rgba(89,150,255,.25);box-shadow:0 16px 40px rgba(8,35,70,.14)
}
.share-hero .big{font:700 clamp(3.6rem,9vw,7rem)/.92 Georgia,serif;letter-spacing:-.06em;margin:4px 0 8px}
.share-hero .label{color:#dce9fa;font-weight:800;letter-spacing:.05em}
.share-hero p{color:#d5e3f5!important;margin:12px 0 0!important}
.share-side{display:grid;gap:14px}
.share-box{min-width:0;padding:20px;border:1px solid #d5e0eb;border-radius:18px;background:linear-gradient(145deg,#fff,#f5f9fd)}
.share-box strong{display:block;color:#173f6b;font-size:1.05rem;margin-bottom:6px}
.share-bar{height:16px;border-radius:999px;background:#e8eef6;overflow:hidden;border:1px solid #d2dce8;margin:10px 0 5px}
.share-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#1689ff,#6e3cff,#db32ff)}
.share-bar.ai span{background:linear-gradient(90deg,#db32ff,#6e3cff)}
.share-bar.mid span{background:linear-gradient(90deg,#22a267,#e5ad20)}
.share-scale{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0
}
.share-scale .share-box{min-height:180px}
.share-scale .percent{font:700 2.3rem/1 Georgia,serif;color:#173e6c}
.share-table-note{font-size:.85rem;color:#607086;margin-top:8px}
@media(max-width:900px){.share-summary,.share-scale{grid-template-columns:1fr}}


/* ---------- Norm v3.3: saubere responsive Darstellung ---------- */
.norm-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:20px 0 26px;
  align-items:stretch;
}
.norm-card{
  min-width:0;
  padding:18px 19px;
  border:1px solid #d6e0eb;
  border-radius:17px;
  background:
    radial-gradient(circle at 92% 0%,rgba(22,137,255,.07),transparent 32%),
    linear-gradient(150deg,#ffffff,#f7faff);
  box-shadow:0 9px 24px rgba(13,42,77,.06);
  overflow:hidden;
}
.norm-card b{
  display:block;
  margin-bottom:6px;
  color:#174b7b;
  font-weight:900;
}
.norm-card,
.norm-card *{
  overflow-wrap:anywhere;
}
.v-prose .v-legend{
  align-items:stretch!important;
}
.v-prose .v-light{
  height:100%;
}
@media(max-width:760px){
  .norm-grid{grid-template-columns:1fr}
}
