.media-hero {
  position:relative;
  isolation:isolate;
  max-width:100%;
  overflow-x:clip;
  padding-top:var(--space-8);
  padding-bottom:var(--space-8);
  background:
    radial-gradient(ellipse at 18% 12%,var(--glow-orange),var(--clear) 46%),
    radial-gradient(ellipse at 88% 24%,var(--glow-blue),var(--clear) 54%),
    linear-gradient(180deg,var(--bg),var(--slab-top));
}

.media-hero::after {
  content:'';
  position:absolute;
  inset:auto 0 0;
  z-index:-1;
  height:var(--space-8);
  border-top:1px solid var(--border);
  background:linear-gradient(180deg,var(--clear),var(--panel));
}

.media-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.88fr);
  align-items:center;
  gap:var(--space-8);
}

.media-hero .hero-copy h1 {
  max-width:760px;
}

.media-lead-panel {
  min-width:0;
  border:1px solid var(--panel);
  border-radius:var(--r-md);
  background:linear-gradient(135deg,var(--slab-top),var(--slab-bottom));
  padding:var(--space-2);
  box-shadow:
    0 7px 0 var(--slab-edge),
    0 9px 0 var(--panel),
    var(--shadow-card);
}

.media-panel-chrome {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  min-height:44px;
  padding-inline:var(--space-2);
  border:1px solid var(--border);
  border-bottom:0;
  border-radius:var(--r-sm) var(--r-sm) 0 0;
  background:linear-gradient(180deg,var(--panel),var(--bg));
  color:var(--muted);
  font-size:var(--text-xs);
}

.media-panel-body {
  display:grid;
  gap:var(--space-1);
  padding:var(--space-2);
  border-inline:1px solid var(--border);
  background:var(--panel);
}

.media-stage {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--space-2);
  align-items:start;
  padding:var(--space-2);
  border:1px solid var(--border);
  border-radius:var(--r-sm);
  background:var(--bg);
}

.media-stage:nth-child(even) {
  background:var(--blue-tint);
  border-color:var(--slab-edge);
}

.media-stage-mark {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:56px;
  min-height:32px;
  padding-inline:var(--space-1);
  border-radius:var(--r-sm);
  background:var(--panel);
  color:var(--blue-dark);
  font-family:var(--mono);
  font-size:var(--text-xs);
  font-weight:var(--weight-semibold);
}

.media-stage strong {
  display:block;
  margin-bottom:var(--space-1);
  font-size:var(--text-sm);
}

.media-stage p {
  margin:0;
  color:var(--muted);
  font-size:var(--text-xs);
  line-height:1.7;
}

.media-panel-foot {
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-1);
  padding:var(--space-2);
  border:1px solid var(--border);
  border-top:0;
  border-radius:0 0 var(--r-sm) var(--r-sm);
  background:var(--panel);
}

.media-article {
  display:grid;
  gap:var(--space-10);
}

.media-article > section {
  scroll-margin-top:var(--anchor-offset);
}

.media-summary {
  display:grid;
  grid-template-columns:minmax(180px,.34fr) minmax(0,1fr);
  gap:var(--space-6);
  padding-bottom:var(--space-8);
  border-bottom:1px solid var(--border);
}

.media-summary h2,
.section-heading h2 {
  margin-bottom:0;
}

.media-summary-copy {
  max-width:900px;
}

.media-summary-copy > p {
  color:var(--muted);
  line-height:1.9;
}

.media-summary-copy > p:last-of-type {
  margin-bottom:0;
}

.section-heading {
  display:grid;
  grid-template-columns:minmax(240px,.72fr) minmax(0,1fr);
  align-items:end;
  gap:var(--space-6);
  margin-bottom:var(--space-4);
}

.section-heading > p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}

.matrix-key {
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-1);
  margin-bottom:var(--space-3);
}

.media-table th:first-child {
  width:20%;
}

.media-table td:last-child {
  min-width:260px;
}

.ip-ledger {
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  background:var(--panel);
  box-shadow:var(--shadow-panel);
}

.ip-row {
  display:grid;
  grid-template-columns:minmax(160px,.28fr) minmax(0,1fr);
  gap:var(--space-4);
  padding:var(--space-4);
  border-bottom:1px solid var(--border);
}

.ip-row:nth-child(even) {
  background:var(--panel-alt);
}

.ip-row:last-child {
  border-bottom:0;
}

.ip-row h3 {
  margin:0;
  color:var(--blue-dark);
}

.ip-row p {
  color:var(--muted);
  line-height:1.9;
}

.ip-row p:last-child {
  margin-bottom:0;
}

.quality-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-3);
}

.quality-card {
  min-width:0;
  padding:var(--space-3);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  background:var(--panel);
  box-shadow:var(--shadow-panel);
}

.quality-card:nth-child(even) {
  background:linear-gradient(145deg,var(--blue-tint),var(--panel));
  border-color:var(--slab-edge);
}

.quality-card h3 {
  margin-top:var(--space-2);
  margin-bottom:var(--space-2);
  font-size:var(--text-xl);
}

.quality-card p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}

.diagnostic-flow {
  display:grid;
  gap:var(--space-2);
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:media-step;
}

.diagnostic-flow li {
  position:relative;
  display:grid;
  grid-template-columns:minmax(210px,.38fr) minmax(0,1fr);
  gap:var(--space-4);
  min-width:0;
  padding:var(--space-3) var(--space-3) var(--space-3) var(--space-10);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  background:var(--panel);
  counter-increment:media-step;
}

.diagnostic-flow li:nth-child(even) {
  background:var(--panel-alt);
}

.diagnostic-flow li::before {
  content:counter(media-step);
  position:absolute;
  left:var(--space-3);
  top:var(--space-3);
  display:grid;
  place-items:center;
  width:var(--space-5);
  height:var(--space-5);
  border-radius:var(--r-sm);
  background:var(--blue);
  color:var(--panel);
  font-family:var(--mono);
  font-size:var(--text-sm);
  font-weight:var(--weight-bold);
}

.diagnostic-flow h3 {
  margin:0;
  font-size:var(--text-lg);
}

.diagnostic-flow p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}

.multi-device-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-3);
}

.multi-device-grid .panel {
  box-shadow:none;
}

.multi-device-grid h3 {
  font-size:var(--text-lg);
}

.multi-device-grid p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}

.decision-ledger {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--r-md);
  background:var(--panel);
}

.decision-ledger > div {
  min-width:0;
  padding:var(--space-3);
  border-right:1px solid var(--border);
}

.decision-ledger > div:nth-child(even) {
  background:var(--panel-alt);
}

.decision-ledger > div:last-child {
  border-right:0;
}

.decision-ledger h3 {
  font-size:var(--text-lg);
}

.decision-ledger p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}

.refund-note {
  margin:var(--space-3) 0 0;
  padding:var(--space-3);
  border-left:4px solid var(--orange);
  border-radius:var(--r-sm);
  background:var(--orange-tint);
  color:var(--muted);
}

.refund-note strong {
  color:var(--ink);
}

.media-next-links {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-3);
  padding-top:var(--space-6);
  border-top:1px solid var(--border);
}

.media-next-links a {
  display:grid;
  gap:var(--space-1);
  min-width:0;
  min-height:144px;
  padding:var(--space-3);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  background:var(--panel);
  box-shadow:var(--shadow-panel);
}

.media-next-links a:last-child {
  background:linear-gradient(140deg,var(--orange-tint),var(--panel));
}

.media-next-links a:hover {
  border-color:var(--blue);
  color:var(--blue-dark);
}

.media-next-links span {
  color:var(--muted);
  font-size:var(--text-xs);
}

.media-next-links strong {
  font-size:var(--text-xl);
}

.media-next-links small {
  color:var(--muted);
  font-size:var(--text-sm);
}

@media (max-width:1000px) {
  .media-hero-grid {
    grid-template-columns:1fr;
    max-width:704px;
    gap:var(--space-6);
  }

  .media-summary,
  .section-heading {
    grid-template-columns:1fr;
    gap:var(--space-2);
  }

  .multi-device-grid,
  .decision-ledger {
    grid-template-columns:1fr;
  }

  .decision-ledger > div {
    border-right:0;
    border-bottom:1px solid var(--border);
  }

  .decision-ledger > div:last-child {
    border-bottom:0;
  }
}

@media (max-width:768px) {
  .media-hero {
    padding-top:var(--space-6);
    padding-bottom:var(--space-6);
  }

  .media-article {
    gap:var(--space-8);
  }

  .media-summary {
    padding-bottom:var(--space-6);
  }

  .quality-grid,
  .media-next-links {
    grid-template-columns:1fr;
  }

  .ip-row,
  .diagnostic-flow li {
    grid-template-columns:1fr;
  }

  .diagnostic-flow li {
    padding-left:var(--space-10);
  }
}

@media (max-width:640px) {
  .media-hero {
    padding-top:var(--space-4);
    padding-bottom:var(--space-5);
  }

  .media-hero-grid {
    gap:var(--space-4);
  }

  .media-lead-panel {
    padding:var(--space-1);
  }

  .media-panel-chrome {
    padding-inline:var(--space-1);
    font-size:var(--text-tiny);
  }

  .media-panel-body {
    padding:var(--space-1);
  }

  .media-stage {
    gap:var(--space-1);
    padding:var(--space-1);
  }

  .media-stage-mark {
    min-width:48px;
    font-size:var(--text-mini);
  }

  .media-panel-foot {
    padding:var(--space-1);
  }

  .ip-row,
  .quality-card,
  .decision-ledger > div,
  .media-next-links a {
    padding:var(--space-3);
  }

  .diagnostic-flow li {
    padding:var(--space-3);
    padding-top:var(--space-10);
  }

  .diagnostic-flow li::before {
    left:var(--space-3);
    top:var(--space-3);
  }

  .media-next-links a {
    min-height:0;
  }
}

@media (max-width:360px) {
  .media-stage {
    grid-template-columns:1fr;
  }

  .media-stage-mark {
    justify-self:start;
  }
}