/* Isolated reading v2. Reference lock: Dentix dental-implants.
   83 photo-led articles and hubs plus three legal pages only.
   Original content, anchors, media and interaction classes are retained. */

/* Long reading sections must not depend on IntersectionObserver thresholds.
   Include the heading letters generated by main.js and its image fade state. */
.dentix-variant[data-dentix-reading="v2"] .reveal,
.dentix-variant[data-dentix-reading="v2"] .st-c,
.dentix-variant[data-dentix-reading="v2"] .pblock.reveal:not(.visible) img {
  opacity: 1;
  transform: none;
  visibility: visible;
  transition: none;
}

body[data-dentix-reading="v2"] .ahero {
  display: grid;
  gap: 12px;
  width: calc(100% - 24px);
  margin: 12px auto;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
}
body[data-dentix-reading="v2"] .ahero--media {
  grid-template-columns: minmax(0,47fr) minmax(0,53fr);
  align-items: stretch;
}
body[data-dentix-reading="v2"] .ahero__media {
  grid-column: 1;
  grid-row: 1;
  min-height: 520px;
  border-radius: 20px;
  overflow: hidden;
  background: #e9ecf0;
  aspect-ratio: auto;
}
body[data-dentix-reading="v2"] .ahero__media img {
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  object-fit: cover;
}
body[data-dentix-reading="v2"] .ahero__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
  min-width: 0;
  padding: 48px;
  max-width: none;
  border-radius: 20px;
  background: #fff;
}
body[data-dentix-reading="v2"] .ahero--media .ahero__body {
  grid-column: 2;
  grid-row: 1;
}
body[data-dentix-reading="v2"] .ahead h1 {
  max-width: none;
  margin: 0;
  color: #000;
  font-size: clamp(38px,4vw,56px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.05em;
  text-shadow: none;
}
body[data-dentix-reading="v2"] .ahead__lead {
  max-width: 62ch;
  margin-top: 24px;
  font-size: 17px;
  line-height: 1.65;
  color: #6b7280;
}
body[data-dentix-reading="v2"] .ahead__meta {
  margin-top: 28px;
  gap: 10px 16px;
}
body[data-dentix-reading="v2"] .ahero:not(.ahero--media) .ahero__body {
  width: 100%;
  max-width: none;
  padding: 48px max(48px,calc((100vw - 1104px) / 2));
}
body[data-dentix-reading="v2"][data-dentix-family="clinical_case_article"] .ahero__media img {
  object-fit: contain;
  transform: none;
}
body[data-dentix-reading="v2"] .ahero[data-long-title] h1 {
  font-size: clamp(32px,3.1vw,44px);
  line-height: 1.14;
}
body[data-dentix-reading="v2"][data-dentix-family="clinical_case_article"] .ahero[data-hero-photo="clinic-scene"] .ahero__media img {
  object-fit: cover;
}

/* A continuous white reading surface replaces stacked boxes and right aside. */
body[data-dentix-reading="v2"] .dentix-reading-canvas {
  width: calc(100% - 24px);
  margin: 12px auto 20px;
  padding: 60px 48px;
  border-radius: 20px;
  background: #fff;
}
body[data-dentix-reading="v2"] .dentix-reading-layout {
  display: grid;
  grid-template-columns: 170px minmax(0,840px);
  gap: 70px;
  align-items: start;
  max-width: 1080px;
  margin-inline: auto;
}
body[data-dentix-reading="v2"] .dentix-reading-body {
  min-width: 0;
  max-width: 840px;
}
body[data-dentix-reading="v2"] .atoc {
  position: sticky;
  top: calc(var(--header-h,98px) + 28px);
  max-height: calc(100dvh - var(--header-h,98px) - 56px);
  overflow-y: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
  transform: none;
  scrollbar-width: thin;
}
body[data-dentix-reading="v2"] .atoc__t {
  margin: 0;
  color: #000;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
body[data-dentix-reading="v2"] .atoc ul { margin: 16px 0 0; gap: 2px; }
body[data-dentix-reading="v2"] .atoc a {
  display: block;
  min-height: 44px;
  padding: 10px 10px 10px 12px;
  border: 0;
  border-left: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #6b7280;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}
body[data-dentix-reading="v2"] .atoc a:is(:hover,.is-active) {
  border-left-color: #5b7a12;
  background: transparent;
  color: #5b7a12;
}
body[data-dentix-reading="v2"] .pstack { gap: 0; }
body[data-dentix-reading="v2"] .psec {
  margin: 0;
  padding: 60px 0;
  gap: 28px;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 0;
  background: transparent;
}
body[data-dentix-reading="v2"] .psec:first-child { padding-top: 0; }
body[data-dentix-reading="v2"] .psec + .psec { margin-top: 0; }
body[data-dentix-reading="v2"] .psec__head { padding: 0; gap: 16px; }
body[data-dentix-reading="v2"] .psec__head h2 {
  font-size: clamp(28px,2.6vw,36px);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.04em;
}
body[data-dentix-reading="v2"] .pblock,
body[data-dentix-reading="v2"] .psec > .pblock {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body[data-dentix-reading="v2"] .pblock:hover { box-shadow: none; transform: none; }
body[data-dentix-reading="v2"] .pblock--sub + .pblock--sub { padding-top: 8px; }
body[data-dentix-reading="v2"] .prose { max-width: none; }
body[data-dentix-reading="v2"] .prose :is(p,li) { font-size: 16px; line-height: 1.75; }
body[data-dentix-reading="v2"] .prose figure img {
  height: auto;
  max-width: 100%;
  object-fit: contain;
}
body[data-dentix-reading="v2"] .dentix-reading-body > .ccase-meta {
  width: 100%;
  max-width: none;
  margin: 0 0 36px;
  padding: 0 0 28px;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 0;
  background: transparent;
}
body[data-dentix-reading="v2"] .dentix-reading-body > .acard {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 60px 0;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body[data-dentix-reading="v2"] .dentix-reading-body > .acard > .phead { margin-bottom: 28px; }
body[data-dentix-reading="v2"] .dentix-reading-body > .acard h2 { font-size: clamp(28px,2.6vw,36px); }
body[data-dentix-reading="v2"] .pmed {
  width: 100%;
  max-width: none;
  margin: 28px 0 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #6b7280;
  font-size: 12px;
  line-height: 1.6;
}

/* Related links retain all destinations without recreating a stack of cards. */
body[data-dentix-reading="v2"] .hgrid--compact { gap: 0 28px; }
body[data-dentix-reading="v2"] .hrow {
  min-height: 76px;
  padding: 20px 0;
  border: 0;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 0;
  background: transparent;
}
body[data-dentix-reading="v2"] .pfaq-list { border-radius: 0; }
body[data-dentix-reading="v2"] .dentix-reading-end {
  max-width: 1080px;
  margin: 60px auto 0;
}
body[data-dentix-reading="v2"] .dentix-reading-end .abox {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(200px,auto);
  align-items: center;
  gap: 12px 40px;
  padding: 32px 36px;
  border: 0;
  border-radius: 20px;
  background: #f0f4e3;
  box-shadow: none;
}
body[data-dentix-reading="v2"] .dentix-reading-end .abox b { grid-column: 1; grid-row: 1; color: #000; }
body[data-dentix-reading="v2"] .dentix-reading-end .abox p { grid-column: 1; grid-row: 2; max-width: 62ch; margin: 0; color: #6b7280; }
body[data-dentix-reading="v2"] .dentix-reading-end .abox .btn {
  grid-column: 2;
  grid-row: 1;
  width: auto;
  margin: 0;
  background: #5b7a12;
  color: #fff;
}
body[data-dentix-reading="v2"] .dentix-reading-end .abox__phone {
  grid-column: 2;
  grid-row: 2;
  justify-content: center;
  min-height: 44px;
  margin: 0;
  color: #5b7a12;
}

@media (max-width: 1100px) {
  body[data-dentix-reading="v2"] .ahero__body { padding: 36px; }
  body[data-dentix-reading="v2"] .dentix-reading-canvas { padding: 48px 32px; }
  body[data-dentix-reading="v2"] .dentix-reading-layout { gap: 40px; }
}
@media (max-width: 900px) {
  body[data-dentix-reading="v2"] .ahero[data-long-title] h1 { font-size: clamp(28px,8vw,32px); line-height: 1.14; }
  body[data-dentix-reading="v2"] .ahero--media { grid-template-columns: minmax(0,1fr); }
  body[data-dentix-reading="v2"] .ahero__media { grid-column: 1; grid-row: 1; min-height: 0; aspect-ratio: 16/9; }
  body[data-dentix-reading="v2"] .ahero--media .ahero__body { grid-column: 1; grid-row: 2; }
  body[data-dentix-reading="v2"] .ahero__media img { min-height: 0; }
  body[data-dentix-reading="v2"] .dentix-reading-layout { grid-template-columns: minmax(0,1fr); gap: 36px; }
  body[data-dentix-reading="v2"] .dentix-reading-body { max-width: none; }
  body[data-dentix-reading="v2"] .atoc { position: static; max-height: none; overflow: visible; padding-bottom: 24px; border-bottom: 1px solid #e5e7eb; }
  body[data-dentix-reading="v2"] .atoc ul { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-top: 12px; }
  body[data-dentix-reading="v2"] .atoc li { flex: 0 0 auto; }
  body[data-dentix-reading="v2"] .atoc a { width: max-content; max-width: 220px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 12px; }
  body[data-dentix-reading="v2"] .atoc a:is(:hover,.is-active) { border-color: #5b7a12; }
  body[data-dentix-reading="v2"] .ahero:not(.ahero--media) .ahero__body { padding: 36px; }
}
@media (max-width: 600px) {
  body[data-dentix-reading="v2"] .pbread { width: calc(100% - 48px); margin-block: 18px 12px; }
  body[data-dentix-reading="v2"] .ahero__body,
  body[data-dentix-reading="v2"] .ahero:not(.ahero--media) .ahero__body { padding: 32px 24px; }
  body[data-dentix-reading="v2"] .ahead h1 { font-size: clamp(30px,9.375vw,36px); line-height: 1.15; }
  body[data-dentix-reading="v2"] .ahead__lead { font-size: 16px; margin-top: 20px; }
  body[data-dentix-reading="v2"] .ahead__meta { margin-top: 24px; }
  body[data-dentix-reading="v2"] .dentix-reading-canvas { padding: 32px 24px; }
  body[data-dentix-reading="v2"] .psec { padding-block: 40px; gap: 24px; }
  body[data-dentix-reading="v2"] .psec__head { gap: 12px; }
  body[data-dentix-reading="v2"] .psec__head h2,
  body[data-dentix-reading="v2"] .dentix-reading-body > .acard h2 { font-size: clamp(26px,8.125vw,28px); }
  body[data-dentix-reading="v2"] .dentix-reading-body > .acard { padding-block: 40px; }
  body[data-dentix-reading="v2"] .hgrid--compact { grid-template-columns: minmax(0,1fr); }
  body[data-dentix-reading="v2"] .dentix-reading-end { margin-top: 40px; }
  body[data-dentix-reading="v2"] .dentix-reading-end .abox { grid-template-columns: minmax(0,1fr); padding: 28px 24px; gap: 16px; }
  body[data-dentix-reading="v2"] .dentix-reading-end .abox :is(b,p,.btn,.abox__phone) { grid-column: 1; grid-row: auto; }
  body[data-dentix-reading="v2"] .dentix-reading-end .abox .btn { margin-top: 8px; width: 100%; }
}
