.div2 {
  --dv-bg: #081521;
  --dv-panel: #102435;
  --dv-edge: rgba(135, 202, 210, .17);
  --dv-text: #e9f5f7;
  --dv-muted: #9cb5c0;
  --dv-accent: #64dbd8;
  color: var(--dv-text);
  padding-bottom: 72px;
}
.div2 * { box-sizing: border-box; }
.div2-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 5vw, 64px);
  margin: 32px 0 22px;
  border: 1px solid var(--dv-edge);
  border-radius: 23px;
  background:
    radial-gradient(ellipse at 85% 20%, rgba(59,183,191,.18), transparent 48%),
    linear-gradient(135deg,#0b1d2e,#102a3a 58%,#091926);
}
.div2-eyebrow {
  color: var(--dv-accent);
  font-size: .76rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 700;
}
.div2-hero h1 {
  font-size: clamp(2rem,4.6vw,3.8rem);
  line-height: 1.08;
  margin: 18px 0;
  color: #fff;
  max-width: 760px;
}
.div2-hero p {
  color: #c0d3da;
  max-width: 690px;
  line-height: 1.7;
}
.div2-pill {
  display: inline-block;
  padding: 7px 12px;
  border: 1px solid rgba(100,219,216,.42);
  border-radius: 99px;
  color: var(--dv-accent);
  font-size: .76rem;
  font-weight: 700;
}
.div2-metrics {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
  margin: 22px 0;
}
.div2-card,.div2-panel {
  background: linear-gradient(155deg,#10283a,#0c1d2c);
  border: 1px solid var(--dv-edge);
  border-radius: 17px;
  padding: 21px;
}
.div2-card small,.div2-muted {
  display: block;
  color: var(--dv-muted);
}
.div2-card strong {
  display: block;
  font-size: clamp(1.5rem,3vw,2.2rem);
  margin-top: 10px;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
.div2-panel { margin-top: 18px; }
.div2-panel h2 {
  color: #fff;
  margin: 0 0 10px;
  font-size: 1.3rem;
}
.div2-controls {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 22px 0;
}
.div2-controls input,.div2-controls select {
  border: 1px solid #385463;
  border-radius: 9px;
  background: #071927;
  color: #f1fbff;
  padding: 12px;
  min-height: 44px;
  font: inherit;
}
.div2-controls input { flex: 2 1 200px; }
.div2-controls select { flex: 1 1 130px; }
.div2-table-wrap { overflow-x: auto; }
.div2 table {
  border-collapse: collapse;
  width: 100%;
  min-width: 700px;
}
.div2 th {
  text-align: left;
  font-size: .76rem;
  color: #9fbac3;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 13px 12px;
}
.div2 td {
  padding: 15px 12px;
  border-top: 1px solid var(--dv-edge);
  color: #e8f3f6;
}
.div2 tbody tr { cursor: pointer; }
.div2 tbody tr:hover,
.div2 tbody tr:focus-within { background: rgba(100,219,216,.08); }
.div2 button.div2-open {
  border: 1px solid #427881;
  background: #153746;
  border-radius: 8px;
  color: #b5f0ed;
  padding: 8px 11px;
  cursor: pointer;
}
.div2-bull { color: #83e4ba; font-weight: 700; }
.div2-bear { color: #ffb6a0; font-weight: 700; }
.div2-detail {
  min-height: 260px;
  padding: 22px;
  border: 1px dashed #42606e;
  border-radius: 12px;
  background: rgba(2,13,22,.42);
}
.div2-status {
  color: #b5cbd3;
  font-size: .87rem;
  margin-top: 12px;
}
.div2-footer {
  color: #93abb6;
  font-size: .85rem;
  line-height: 1.6;
  margin-top: 25px;
}
@media(max-width:760px) {
  .div2-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .div2-hero { padding: 26px 20px; }
}


/* DIV.01.23E — isolated preview chart */
.div2-evidence-line {
  margin: 9px 0;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.div2-evidence-ok { color: #83e4ba; }
.div2-evidence-review { color: #ffbe91; }
.div2-chart-wrap {
  margin-top: 22px;
  border: 1px solid rgba(135,202,210,.2);
  border-radius: 12px;
  background: #071724;
  padding: 12px;
  min-width: 0;
}
.div2 #indicator-chart {
  width: 100%;
  height: 410px;
  min-height: 410px;
  position: relative;
}
.div2 #indicator-volume {
  width: 100%;
  height: 110px;
  min-height: 110px;
  position: relative;
}
.div2 #indicator-chart canvas,
.div2 #indicator-volume canvas {
  display: block;
  width: 100%;
  height: 100%;
}
@media (max-width: 760px) {
  .div2 #indicator-chart {
    height: 310px;
    min-height: 310px;
  }
}

/* DIV.01.24F indicator panels */
.div2-indicator-panels {
  display:grid;
  gap:16px;
  margin-top:18px;
}
.div2-indicator-card {
  background:#081b29;
  border:1px solid rgba(128,195,204,.28);
  border-radius:13px;
  padding:16px;
  overflow:hidden;
}
.div2-indicator-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  color:#f0f7f8;
  margin-bottom:12px;
}
.div2-confirmed { color:#6fe0b8; font-size:.82rem; }
.div2-unconfirmed { color:#a8bbc6; font-size:.82rem; }
.div2-indicator-svg {
  display:block;
  width:100%;
  height:auto;
  background:#0b2030;
  border-radius:8px;
}
.div2-indicator-foot {
  margin:10px 0 0;
  color:#a8c1cb;
  font-size:.82rem;
}

/* DIV.01.25B shared timeline */
.div2-chart-wrap .div2-indicator-panels {
  margin-top: 22px;
}
.div2-chart-wrap .div2-indicator-card {
  padding: 14px 0 10px;
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}
.div2-chart-wrap .div2-indicator-svg {
  width: 100%;
}

/* DIV.01.25C explanation styles */
.div2-explanation {
  margin: 20px 0 24px;
  padding: clamp(18px, 3vw, 28px);
  background: linear-gradient(135deg, #123548, #092332);
  border: 1px solid rgba(100,219,216,.45);
  border-left: 4px solid #64dbd8;
  border-radius: 14px;
  color: #eaf6f8;
}
.div2-explanation h4 {
  margin: 0 0 20px;
  color: #fff;
  font-size: clamp(1.2rem, 2vw, 1.5rem);
}
.div2-explanation-item {
  padding: 12px 0;
  border-top: 1px solid rgba(190,225,230,.13);
}
.div2-explanation-item strong {
  display: block;
  color: #75e1dc;
  margin-bottom: 7px;
  font-size: 1rem;
}
.div2-explanation-item p {
  color: #d9e8ed;
  margin: 0;
  line-height: 1.7;
}
.div2-explanation-item.is-warning strong {
  color: #ffca8e;
}
.div2-explanation-note {
  margin: 17px 0 0;
  padding-top: 13px;
  border-top: 1px solid rgba(190,225,230,.13);
  color: #aabfc8;
  font-size: .86rem;
  line-height: 1.6;
}

/* DIV025D2 — market identity and explanation */
.div2-market-summary {
  margin-bottom: 22px;
  padding: 22px;
  background: linear-gradient(115deg,#123b4d,#0b2635);
  border: 1px solid rgba(100,219,216,.55);
  border-left: 5px solid #64dbd8;
  border-radius: 14px;
  color: #eaf6f8;
}
.div2-market-summary h3 {
  color: #fff;
  font-size: clamp(1.25rem,2.6vw,1.8rem);
  margin: 0 0 8px;
  overflow-wrap: anywhere;
}
.div2-summary-subtitle {
  color: #76e1db;
  font-weight: 700;
}
.div2-summary-indicator {
  padding: 8px 0;
  border-bottom: 1px solid rgba(180,220,225,.13);
  font-variant-numeric: tabular-nums;
}
.div2-summary-indicator.is-confirmed { color: #81e2ba; }
.div2-summary-indicator.is-warning { color: #ffbc94; }
.div2-summary-conclusion {
  margin: 17px 0 0;
  padding-top: 13px;
  border-top: 1px solid rgba(180,220,225,.25);
  font-weight: 600;
  line-height: 1.7;
}

/* DIV.01.26B — compact two-column hero */
.div2 .div2-hero {
  padding: clamp(20px, 3vw, 32px);
  margin: 20px 0 18px;
  min-height: 0;
}
.div2-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: clamp(18px, 3vw, 42px);
  align-items: center;
}
.div2 .div2-hero h1 {
  font-size: clamp(1.9rem, 3vw, 2.9rem);
  margin: 12px 0 16px;
}
.div2-hero-side h2 {
  color: #fff;
  font-size: clamp(1.05rem, 1.5vw, 1.35rem);
  line-height: 1.4;
  margin: 0 0 10px;
}
.div2-hero-side p {
  margin: 0;
  line-height: 1.6;
}
@media (max-width: 760px) {
  .div2-hero-layout { grid-template-columns: 1fr; gap: 14px; }
  .div2 .div2-hero { padding: 21px; }
}

/* DIV.01.27B mobile — meer verticale ruimte */
@media (max-width: 760px) {
  .div2 #indicator-chart {
    height: 460px !important;
    min-height: 460px !important;
  }
}

/* DIV.WEB.03 — opvallende Analyseer-knop */
.div2 button.div2-open {
  background: linear-gradient(135deg, #64dbd8, #22b8bc);
  color: #06232c;
  border: 1px solid #82f0e8;
  border-radius: 9px;
  padding: 10px 16px;
  font-weight: 750;
  box-shadow: 0 3px 12px rgba(34, 199, 195, .18);
  transition: background .2s ease, box-shadow .2s ease,
              transform .2s ease;
}

.div2 button.div2-open:hover {
  background: linear-gradient(135deg, #91f5ed, #43d5d0);
  box-shadow: 0 5px 18px rgba(34, 199, 195, .32);
  transform: translateY(-1px);
}

.div2 button.div2-open:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 3px;
}

.div2 button.div2-open:active {
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .div2 button.div2-open {
    transition: none;
  }
}

/* DIV.WEB.04 — kleuraccenten */

/* Overzichtskaarten */
.div2 .div2-metrics .div2-card {
  transition: border-color .2s ease, box-shadow .2s ease;
}

.div2 .div2-metrics .div2-card:nth-child(2) {
  background: linear-gradient(145deg, #10382f, #0c2728);
  border-color: rgba(111,224,184,.45);
}

.div2 .div2-metrics .div2-card:nth-child(2) strong {
  color: #83e4ba;
}

.div2 .div2-metrics .div2-card:nth-child(3) {
  background: linear-gradient(145deg, #3b222c, #251e2b);
  border-color: rgba(255,155,135,.4);
}

.div2 .div2-metrics .div2-card:nth-child(3) strong {
  color: #ffb6a0;
}

/* Bullish- en bearish-labels in tabel */
.div2 td.div2-bull {
  color: #83e4ba;
  font-weight: 750;
}

.div2 td.div2-bear {
  color: #ffad99;
  font-weight: 750;
}

/* Analysepanelen */
.div2 .div2-detail {
  border: 1px solid rgba(100,219,216,.3);
  background: linear-gradient(145deg, #0c2433, #081924);
  border-radius: 15px;
}

/* RSI/MACD-panelen */
.div2 .div2-indicator-card {
  background: linear-gradient(145deg, #0b2636, #081b29);
  border-color: rgba(100,219,216,.28);
}

/* Bevestigde indicatoren */
.div2 .div2-confirmed {
  color: #83e4ba;
  font-weight: 700;
}

/* Onderzoeksuitleg */
.div2 .div2-explanation {
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
}

/* Respecteer verminderde beweging */
@media (prefers-reduced-motion: reduce) {
  .div2 .div2-metrics .div2-card {
    transition: none;
  }
}

/* DIV.GEM.WEB.08 — hero title accent */
.div2 .div2-hero h1 span {
  color: #17d4ee !important;
  text-shadow: 0 0 28px rgba(23,212,238,.28);
}


/* SEO.32B — Divergence SEO content, responsive two-column layout */
.div2 .div2-seo-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(28px, 4vw, 64px);
  align-items: start;
}

.div2 .div2-seo-column {
  min-width: 0;
}

.div2 .div2-seo-column h3 {
  margin-top: 26px;
}

.div2 .div2-seo-column h3:first-child {
  margin-top: 18px;
}

@media (max-width: 760px) {
  .div2 .div2-seo-grid {
    grid-template-columns: 1fr;
  }
}


/* SEO.32C — readability fix */
.div2 #divergentie-uitleg,
.div2 #divergence-explained {
  line-height: 1.75;
}

.div2 .div2-seo-column h3 {
  color: #ffffff;
  font-size: 1.12rem;
  font-weight: 700;
  line-height: 1.35;
  margin: 30px 0 14px;
}

.div2 .div2-seo-column p {
  color: #dce8f1;
  line-height: 1.75;
  margin: 0 0 15px;
}

.div2 .div2-seo-column h3:not(:first-child) {
  padding-top: 22px;
  border-top: 1px solid rgba(255,255,255,.12);
}

.div2 .div2-seo-grid {
  column-gap: clamp(40px, 5vw, 76px);
  margin-top: 24px;
}

@media (max-width: 760px) {
  .div2 .div2-seo-grid {
    row-gap: 12px;
  }
}

/* SEO.32E — compact footer spacing */
.div2 {
  padding-bottom: 24px;
}

/* SEO.32F — remove excess gap above site footer */
main.container.div2 {
  padding-bottom: 12px;
}

/* SEO.32H — styling aanvullende SEO-tekst en links */
.div2 .div2-seo-addendum {
  margin-top: 28px;
  padding: 24px 28px;
  background: #101e30;
  color: #dce8f1;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
}

.div2 .div2-seo-addendum h3 {
  color: #fff;
  margin: 0 0 14px;
}

.div2 .div2-seo-addendum h3:not(:first-child) {
  margin-top: 26px;
}

.div2 .div2-seo-addendum p {
  color: #dce8f1;
  line-height: 1.75;
}

.div2 .div2-seo-addendum a {
  color: #64dbd8;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* SEO.32J — Educatieve divergentiegrafieken */
.div2 .div2-example-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin: 28px 0 36px;
}

.div2 .div2-example-card {
  min-width: 0;
  padding: 22px;
  background: #101e30;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
}

.div2 .div2-example-card h3 {
  margin: 0 0 14px;
  color: #fff;
  font-size: 1.1rem;
}

.div2 .div2-example-card svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 245px;
}

@media (max-width: 760px) {
  .div2 .div2-example-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}


/* MU-SEO38-DIVERGENCE-CIRCUIT-FIX */
.page-divergence .mu-tool-circuit {
    display: block;
    background: #101e30;
    color: #ffffff;
    padding: 28px;
    margin: 32px 0;
    border-radius: 14px;
    box-sizing: border-box;
}

.page-divergence .mu-tool-circuit h2,
.page-divergence .mu-tool-circuit p {
    color: #ffffff;
}

.page-divergence .mu-tool-circuit-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.page-divergence .mu-tool-circuit-links a {
    display: inline-block;
    padding: 11px 16px;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 8px;
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
}

.page-divergence .mu-tool-circuit-links a:hover,
.page-divergence .mu-tool-circuit-links a:focus-visible {
    background: #ffffff;
    color: #102b4e;
}