/* HeavyGaming 2.12: editorial imagery, original explainers and opt-in documentary references. */
.visual-practice-section {background:#090f0d;position:relative;isolation:isolate}
.visual-practice-section::before {content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 75% 36% at 20% 0,rgba(97,161,91,.11),transparent 75%)}
.visual-practice-grid {display:grid;grid-template-columns:1.33fr 1fr 1fr;gap:15px;align-items:stretch}
.practice-card {min-height:435px;overflow:hidden;position:relative;display:flex;flex-direction:column;justify-content:end;border:1px solid #456146;border-radius:11px;color:#f8fff4;background:#15251b;isolation:isolate;transition:border-color .2s ease,transform .2s ease}
.practice-card>img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:saturate(1.06);transition:transform .4s}
.practice-card::before {content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.06) 6%,rgba(4,10,7,.08) 34%,rgba(4,10,7,.82) 66%,#060f08 98%);z-index:-1}
.practice-card>div {padding:27px 25px 26px}
.practice-card h3 {margin:11px 0 12px;font-size:clamp(1.6rem,2vw,2.25rem);line-height:1.12;letter-spacing:-.05em;font-weight:900}
.practice-card p {font-size:.85rem;line-height:1.5;color:#c6d8c9;margin:0 0 20px;max-width:365px}
.practice-card strong {display:block;color:#d3fb68;border-top:1px solid #718772;padding-top:15px;font-size:.81rem}
.practice-tag {display:inline-block;padding:7px 9px;background:#d3fb68;color:#112016;font:850 .62rem/1 monospace;letter-spacing:.05em}
.practice-card:hover {transform:translateY(-3px);border-color:#d3fb68}
.practice-card:hover>img {transform:scale(1.055)}
.visual-lab-home .visual-diagram-card img {aspect-ratio:2/1;object-fit:cover;background:#08120c}
.visual-lab-home .visual-diagram-card>div {padding-bottom:23px}
.hub-visual-section {background:radial-gradient(circle at 15% 10%,#15221a,#08100b 62%);border-block:1px solid #345039}
.hub-visual-grid {display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);gap:50px;align-items:center}
.hub-visual-media {position:relative;min-width:0;border-radius:9px;border:1px solid #4f6b4d;overflow:hidden;background:#0e1912;box-shadow:0 30px 70px #0008}
.hub-visual-media img {display:block;width:100%;height:auto;max-width:100%}
.hub-visual-media>span {position:absolute;left:14px;top:14px;font:800 .62rem/1 monospace;letter-spacing:.05em;background:#d3fb68;color:#142315;padding:8px 10px}
.hub-visual-copy h2 {font-size:clamp(2rem,3.45vw,3.2rem);line-height:1.08;letter-spacing:-.055em;margin:10px 0 20px;font-weight:950}
.hub-visual-copy>p {font-size:1rem;color:#c0d2c0;max-width:490px;margin-bottom:24px}
.hub-visual-copy>small {display:block;color:#869b88;font-size:.73rem;line-height:1.5;margin-top:17px}
.article-lab {margin:40px 0;padding:25px;background:linear-gradient(135deg,#17251c,#0b1710);border-radius:13px;border:1px solid #57714c;box-shadow:0 18px 44px #0004;min-width:0}
.article-lab-top>.eyebrow {color:#d3fb68;display:block;margin-bottom:12px}
.article-lab-top h2 {margin:0 0 11px;font-weight:900;letter-spacing:-.047em;line-height:1.14;font-size:clamp(1.55rem,3vw,2.25rem)}
.article-lab-top>p {color:#c5d3c4;margin:0 0 23px;max-width:730px;font-size:.94rem}
.lab-figure {margin:0;padding:0;background:#0b130f;border:1px solid #536d4c;border-radius:8px;overflow:hidden}
.lab-figure-scroll {width:100%;max-width:100%;overflow:auto;overscroll-behavior-x:contain;scrollbar-color:#84ab75 #111e15;scrollbar-width:thin}
.lab-figure-scroll>img {width:100%;height:auto;max-width:100%;min-width:0;display:block;margin:0}
.lab-figure figcaption {display:flex;justify-content:space-between;gap:14px;padding:12px 14px;color:#aebfac;font-size:.77rem;border-top:1px solid #2d4230}
.lab-figure figcaption a {color:#d3fb68;font-weight:800;white-space:nowrap}
.article-lab-actions {margin-top:25px;border-top:1px solid #3c543c;padding-top:18px}
.article-lab-actions>strong {font-size:.86rem;color:#ecf6e9}
.article-lab-actions ol {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:14px 0 0;padding:0;list-style:none;counter-reset:checks}
.article-lab-actions li {counter-increment:checks;display:flex;flex-direction:column;gap:9px;background:#0f1b12;border:1px solid #3c583c;border-radius:7px;padding:13px 12px;color:#dae6d6;font-size:.8rem;font-weight:650;line-height:1.42}
.article-lab-actions li::before {content:'0' counter(checks);color:#d3fb68;font:900 .78rem/1 monospace}
.article-reference {border:1px solid #3e5846;border-radius:10px;overflow:hidden;margin:30px 0;background:#0f1a13}
.article-reference summary {list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 22px}
.article-reference summary::-webkit-details-marker {display:none}
.article-reference summary small {display:block;font:750 .62rem/1.4 monospace;color:#d3fb68;letter-spacing:.1em;margin-bottom:7px}
.article-reference summary strong {display:block;font-size:1rem;color:#f3faef;line-height:1.3}
.article-reference summary>span:last-child {border:1px solid #496d45;border-radius:5px;width:27px;height:27px;display:grid;place-items:center;color:#d3fb68;flex:none}
.article-reference[open] summary>span:last-child {transform:rotate(45deg)}
.article-reference summary:hover {background:#18271b}
.reference-inner {padding:0 22px 22px;border-top:1px solid #344a37}
.reference-inner>p:first-child {font-size:.87rem;color:#e1eadd;line-height:1.5;margin:15px 0}
.reference-disclosure {font-size:.75rem;color:#adbdac;line-height:1.5}
.reference-inner>button {margin:8px 0 14px;font-size:.84rem}
.reference-photo {background:#101716;border:1px solid #40573e;border-radius:7px;overflow:hidden}
.reference-photo>img {width:100%;height:auto;max-height:520px;object-fit:contain;display:block}
.reference-photo>p {padding:12px 16px;font-size:.77rem;color:#fabda7}
.reference-credit {font-size:.75rem;color:#adbeb1;margin:14px 0 0;line-height:1.6}
.reference-credit a {color:#d3fb68;text-decoration:underline;text-underline-offset:3px}
.aside-visual>a {color:#d3fb68!important;font-size:.83rem}
.visual-tools-hero {background:linear-gradient(90deg,#0b1510 0%,rgba(11,21,16,.95) 45%,rgba(11,21,16,.5) 100%),url('../images/creator.webp') right center/cover no-repeat;border-bottom:1px solid #405440}
.visual-tools-hero h1 {font-weight:950;letter-spacing:-.055em}
@media (max-width:1050px) {
  .visual-practice-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .practice-card:first-child {grid-column:1/-1;min-height:345px}
  .hub-visual-grid {grid-template-columns:1fr;gap:24px}
  .hub-visual-copy {max-width:710px}
}
@media (max-width:720px) {
  .visual-practice-grid {grid-template-columns:1fr}
  .practice-card,.practice-card:first-child {grid-column:auto;min-height:365px}
  .practice-card>div {padding:20px 19px}
  .hub-visual-section {padding:54px 0}
  .hub-visual-grid {gap:24px}
  .hub-visual-copy h2 {font-size:clamp(1.9rem,8vw,2.75rem)}
  .article-lab {margin:24px 0;padding:16px 12px}
  .article-lab-top {padding:0 4px}
  .lab-figure-scroll>img {width:820px;max-width:none;height:auto}
  .lab-figure::after {content:'← Zum Lesen der Grafik seitlich wischen →';display:block;text-align:center;color:#aabcac;border-top:1px solid #2e4730;font-size:.67rem;padding:9px}
  .lab-figure figcaption {flex-wrap:wrap;font-size:.71rem}
  .article-lab-actions ol {grid-template-columns:1fr}
  .article-lab-actions li {flex-direction:row;align-items:center}
  .reference-inner,.article-reference summary {padding-left:16px;padding-right:16px}
  .visual-tools-hero {background-position:center}
}
@media(prefers-reduced-motion:reduce){.practice-card,.practice-card>img {transform:none!important;transition:none!important}}
