/* Task41-J: SEO chrome visual polish — keep SEO DOM, reduce portal density noise. */

.video-breadcrumb{
  margin:0 0 var(--video-space-2);
  padding:0;
  font-size:0.75rem;
  line-height:1.3;
  color:var(--video-color-muted);
}
.video-breadcrumb ol{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.2rem 0.45rem;
  margin:0;
  padding:0;
  list-style:none;
}
.video-breadcrumb li{
  display:inline-flex;
  align-items:center;
  gap:0.45rem;
  max-width:100%;
}
.video-breadcrumb li:not(:last-child)::after{
  content:"/";
  color:var(--video-color-border);
  font-weight:400;
}
.video-breadcrumb a{
  color:inherit;
  text-decoration:none;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:12rem;
}
.video-breadcrumb a:hover{color:var(--video-color-accent);text-decoration:underline}
.video-breadcrumb li[aria-current="page"]{color:var(--video-color-text);font-weight:600}

/* Compact strip that does not compete with hero full-bleed. */
.video-breadcrumb--compact{
  min-height:0;
  max-height:1.75rem;
  overflow:hidden;
  opacity:0.85;
}
@media (min-width:48rem){
  .video-breadcrumb--compact{
    margin-bottom:var(--video-space-3);
    max-height:1.5rem;
  }
}

/* H2/H3 remain in HTML; home keeps them out of the portal viewport stack. */
.video-semantic-outline{
  margin:var(--video-space-6) 0 0;
  padding:var(--video-space-4) 0 0;
  border-block-start:1px solid var(--video-color-border);
  color:var(--video-color-muted);
}
.video-semantic-outline section{margin:0 0 var(--video-space-3)}
.video-semantic-outline h2{
  margin:0 0 var(--video-space-2);
  font-size:1rem;
  font-weight:700;
  color:var(--video-color-text);
}
.video-semantic-outline h3{
  margin:0 0 var(--video-space-1,0.25rem);
  font-size:0.875rem;
  font-weight:600;
  color:var(--video-color-muted);
}
.video-main[data-sese-page="home"] .video-semantic-outline{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Related / footer-adjacent link graph presentation. */
.video-internal-links{
  margin:var(--video-space-8) 0 0;
  padding:var(--video-space-5) 0 var(--video-space-2);
  border-block-start:1px solid var(--video-color-border);
  display:grid;
  gap:var(--video-space-3);
}
.video-internal-links--related{
  margin-top:var(--video-space-10,2.5rem);
}
.video-internal-links__home{
  font-weight:700;
  text-decoration:none;
  color:var(--video-color-text);
  width:fit-content;
}
.video-internal-links ul{
  display:flex;
  flex-wrap:wrap;
  gap:var(--video-space-2) var(--video-space-4);
  margin:0;
  padding:0;
  list-style:none;
}
.video-internal-links li{margin:0;padding:0}
.video-internal-links a{
  font-size:0.875rem;
  color:var(--video-color-muted);
  text-decoration:none;
}
.video-internal-links a:hover{color:var(--video-color-accent);text-decoration:underline}
.video-internal-links [data-link-group]::before{
  display:block;
  width:100%;
  margin:0 0 var(--video-space-2);
  font-size:0.75rem;
  font-weight:700;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--video-color-text);
  content:attr(data-link-group);
}
@media (min-width:48rem){
  .video-internal-links--related{
    grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));
    align-items:start;
  }
  .video-internal-links__home{grid-column:1/-1}
}
@media (max-width:47.999rem){
  .video-breadcrumb--compact{max-height:2.25rem;opacity:0.9}
  .video-internal-links{gap:var(--video-space-4)}
}
