/* SIHO Watch & Choose reusable visual standard
   Applies only to pages carrying .video-standard-page.
   Accepted direction: compact headings, balanced spacing, direct-play video,
   clear orange / deep-green / outlined action hierarchy, and mobile-first fit. */

.video-standard-page{
  --vs-ink:#08242b;
  --vs-muted:#536b70;
  --vs-line:#d6e3e2;
  --vs-orange:#f39a3f;
  --vs-orange-deep:#bd641d;
  --vs-green:#0b8d69;
  --vs-green-deep:#075d48;
  --vs-teal:#087f88;
  --vs-soft:#edf7f4;
}

.video-standard-page main h1{
  letter-spacing:-.025em;
  text-wrap:balance;
}
.video-standard-page main h2,
.video-standard-page main h3{
  text-wrap:balance;
}

/* Reusable three-level action system. */
.video-standard-page .vs-primary,
.video-standard-page .featured-links a,
.video-standard-page .video-card-links a,
.video-standard-page.c05-page .c05-actions a,
.video-standard-page.c06-page .c06-hero .cta-button,
.video-standard-page.c06-page .c06-cta .cta-button,
.video-standard-page.videos-page .signcta .navcta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:11px 19px;
  border-radius:12px;
  font-size:.86rem;
  font-weight:850;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}

.video-standard-page .featured-links a:first-child,
.video-standard-page.c05-page .c05-actions a:first-child,
.video-standard-page.c06-page .c06-hero .cta-button{
  border:1px solid #ffbb72;
  color:#182c30;
  background:linear-gradient(180deg,#ffc56f 0%,var(--vs-orange) 100%);
  box-shadow:0 5px 0 var(--vs-orange-deep),0 13px 24px rgba(189,100,29,.22);
}

.video-standard-page .featured-links a:nth-child(2),
.video-standard-page.c05-page .c05-actions a:nth-child(2){
  border:1px solid rgba(255,255,255,.38);
  color:#effafb;
  background:rgba(255,255,255,.06);
  box-shadow:0 5px 0 rgba(0,0,0,.3);
}

.video-standard-page .video-card-links a:first-child{
  border:1px solid #087982;
  color:#fff;
  background:linear-gradient(180deg,#15a8b1 0%,#087f88 100%);
  box-shadow:0 4px 0 #05545a,0 10px 20px rgba(8,127,136,.18);
}
.video-standard-page .video-card-links a:nth-child(2){
  min-height:44px;
  border:1px solid #b7d7d3;
  color:#12685f;
  background:#eff8f5;
  box-shadow:0 4px 0 #b7d7d3;
}

.video-standard-page.c06-page .c06-cta .cta-button,
.video-standard-page.c05-page .guide-cta .cta-button,
.video-standard-page.videos-page .signcta .navcta{
  border:1px solid #18a780;
  color:#fff;
  background:linear-gradient(180deg,#19ad82 0%,var(--vs-green) 100%);
  box-shadow:0 5px 0 var(--vs-green-deep),0 14px 26px rgba(7,93,72,.26);
}

.video-standard-page .featured-links a:hover,
.video-standard-page .video-card-links a:hover,
.video-standard-page.c05-page .c05-actions a:hover,
.video-standard-page.c06-page .cta-button:hover,
.video-standard-page.videos-page .signcta .navcta:hover{
  transform:translateY(-2px);
  filter:brightness(1.03);
  text-decoration:none;
}

/* Watch & Choose hub. */
.video-standard-page.videos-page .featured-video{
  padding:clamp(34px,4.2vw,52px) 0;
}
.video-standard-page.videos-page .featured-copy h1{
  max-width:18ch;
  font-size:clamp(2rem,3vw,3.05rem);
  line-height:1.08;
}
.video-standard-page.videos-page .featured-links{
  gap:14px;
  margin-top:22px;
}
.video-standard-page.videos-page .video-feed,
.video-standard-page.videos-page .guide-links,
.video-standard-page.videos-page .quick-answers{
  padding:clamp(42px,4.8vw,58px) 0;
}
.video-standard-page.videos-page .feed-head h2,
.video-standard-page.videos-page .guide-links h2,
.video-standard-page.videos-page .quick-answers h2{
  font-size:clamp(1.75rem,2.65vw,2.5rem);
  line-height:1.13;
}
.video-standard-page.videos-page .video-card-copy{
  padding:22px 23px 24px;
}
.video-standard-page.videos-page .video-card-links{
  gap:12px;
  margin-top:18px;
}
.video-standard-page.videos-page .signcta .navcta{
  width:max-content;
  min-width:168px;
}

/* C05: keep the old URL and SEO facts, but give it the accepted visual rhythm. */
.video-standard-page.c05-page .guide{
  --flow:52px;
  --flow-compact:32px;
  width:min(1240px,calc(100% - 48px));
  margin:22px auto 64px;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.video-standard-page.c05-page .guide-head{
  align-items:center;
  padding:clamp(34px,4vw,52px);
  border-radius:28px;
  color:#f5fbfc;
  background:
    radial-gradient(circle at 84% 12%,rgba(117,217,207,.15),transparent 34%),
    linear-gradient(135deg,#08292f 0%,#0a3b3b 100%);
  box-shadow:0 22px 54px rgba(7,45,51,.16);
}
.video-standard-page.c05-page .guide-head .meta{color:#8fe2d6}
.video-standard-page.c05-page .guide-head-copy h1{
  max-width:24ch;
  font-size:clamp(1.95rem,2.65vw,2.5rem);
  line-height:1.08;
  color:#fff;
}
.video-standard-page.c05-page .guide-head-copy .lede{color:#cce0df}
.video-standard-page.c05-page .guide-head-media{
  aspect-ratio:16/10;
  background:#041217;
}
.video-standard-page.c05-page .guide-head-media video{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#041217;
}
.video-standard-page.c05-page .guide-head-media figcaption{
  position:static;
  padding:10px 14px;
  color:#c8dcdf;
  background:#071f2a;
  font-family:inherit;
  font-size:.76rem;
  line-height:1.45;
  letter-spacing:0;
  text-transform:none;
}
.video-standard-page.c05-page .guide-head-media figcaption a{
  color:#8ee1e6;
  font-weight:800;
}
.video-standard-page.c05-page .c05-actions{
  display:flex;
  flex-wrap:wrap;
  gap:13px;
  margin-top:22px;
}
.video-standard-page.c05-page .c05-actions a:nth-child(2){
  border-color:#7ea8a8;
  color:#164f51;
  background:#eef7f5;
  box-shadow:0 4px 0 #b8d3cf;
}
.video-standard-page.c05-page .guide-facts{
  margin:clamp(34px,4vw,48px) 0;
  padding:clamp(28px,3.2vw,40px);
}
.video-standard-page.c05-page .guide-sec{
  margin:clamp(38px,4.7vw,56px) 0;
}
.video-standard-page.c05-page .guide-sec h2,
.video-standard-page.c05-page .guide-faq h2,
.video-standard-page.c05-page .guide-related h2,
.video-standard-page.c05-page .guide-cta h2{
  font-size:clamp(1.75rem,2.65vw,2.45rem);
  line-height:1.12;
}
.video-standard-page.c05-page .guide-fig{
  aspect-ratio:16/10;
}
.video-standard-page.c05-page .guide-faq,
.video-standard-page.c05-page .guide-related{
  margin:clamp(42px,5vw,58px) 0;
  padding:0;
}
.video-standard-page.c05-page .guide-related .apps{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.video-standard-page.c05-page .guide-cta{
  margin-top:clamp(42px,5vw,58px);
  padding:clamp(38px,4.5vw,58px);
}

/* C06: shorten the vertical rhythm and make actions unmissable. */
.video-standard-page.c06-page .c06-hero-copy h1{
  font-size:clamp(2rem,3vw,3rem);
  line-height:1.08;
}
.video-standard-page.c06-page .c06-hero>.wrap{
  grid-template-columns:minmax(0,1.12fr) minmax(340px,.68fr);
  gap:clamp(32px,4.5vw,62px);
}
.video-standard-page.c06-page .c06-hero-copy .c06-quick-wrap{
  padding:20px 0 0;
}
.video-standard-page.c06-page .c06-quick-mobile{
  display:none;
}
.video-standard-page.c06-page .c06-hero-copy .c06-quick{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.video-standard-page.c06-page .c06-hero-copy .c06-quick div{
  padding:16px 17px;
  background:rgba(255,255,255,.88);
}
.video-standard-page.c06-page .c06-video-shell{
  width:min(100%,410px);
}
.video-standard-page.c06-page .c06-video,
.video-standard-page.c06-page .c06-youtube-player{
  max-height:650px;
}
.video-standard-page.c06-page .c06-hero .cta-button::after,
.video-standard-page.c06-page .c06-cta .cta-button::after{
  display:none;
}
.video-standard-page.c06-page .c06-section,
.video-standard-page.c06-page .c06-faq{
  padding:clamp(42px,4.8vw,58px) 0;
}
.video-standard-page.c06-page .c06-cta{
  padding:clamp(42px,4.8vw,58px) 0;
}
.video-standard-page.c06-page .c06-intro h2,
.video-standard-page.c06-page .c06-proof h2,
.video-standard-page.c06-page .c06-faq h2,
.video-standard-page.c06-page .c06-cta h2{
  font-size:clamp(1.8rem,2.8vw,2.55rem);
  line-height:1.12;
}

/* C07 is the accepted visual reference, with the title kept compact enough
   to preserve the video and the first action in the opening screen. */
.video-standard-page.c07-page .c07-hero h1{
  max-width:21ch;
  font-size:clamp(2.15rem,3.2vw,3rem);
  line-height:1.08;
}
.video-standard-page.c07-page .c07-head h2,
.video-standard-page.c07-page .c07-cta h2{
  font-size:clamp(1.8rem,2.75vw,2.55rem);
  line-height:1.12;
}

@media(max-width:980px){
  .video-standard-page.c06-page .c06-hero>.wrap{
    grid-template-columns:1fr;
  }
  .video-standard-page.c06-page .c06-video-shell{
    width:min(100%,420px);
    justify-self:center;
  }
}

@media(max-width:680px){
  .video-standard-page main h1{
    font-size:clamp(1.9rem,8.4vw,2.28rem)!important;
    line-height:1.1!important;
  }
  .video-standard-page main h2{
    font-size:clamp(1.58rem,7vw,1.95rem)!important;
    line-height:1.15!important;
  }
  .video-standard-page .featured-links,
  .video-standard-page.c05-page .c05-actions{
    flex-direction:column;
  }
  .video-standard-page .featured-links a,
  .video-standard-page .video-card-links a,
  .video-standard-page.c05-page .c05-actions a,
  .video-standard-page.c06-page .cta-button,
  .video-standard-page.videos-page .signcta .navcta{
    width:100%;
    min-height:48px;
  }
  .video-standard-page.videos-page .video-feed,
  .video-standard-page.videos-page .guide-links,
  .video-standard-page.videos-page .quick-answers,
  .video-standard-page.c06-page .c06-section,
  .video-standard-page.c06-page .c06-faq,
  .video-standard-page.c06-page .c06-cta{
    padding:36px 0;
  }
  .video-standard-page.c05-page .guide{
    --flow:40px;
    width:min(100% - 28px,1240px);
    margin:14px auto 42px;
    padding:0;
  }
  .video-standard-page.c05-page .guide-head{
    gap:22px;
    padding:28px 20px;
    border-radius:22px;
  }
  .video-standard-page.c05-page .guide-head-media{
    aspect-ratio:16/11;
  }
  .video-standard-page.c05-page .guide-sec{
    margin:36px 0;
  }
  .video-standard-page.c05-page .guide-related .apps{
    grid-template-columns:1fr;
  }
  .video-standard-page.c06-page .c06-quick-desktop{display:none}
  .video-standard-page.c06-page .c06-quick-mobile{
    display:block;
    width:100%;
    padding:0;
  }
  .video-standard-page.c06-page .c06-quick-mobile .c06-quick{grid-template-columns:1fr}
  .video-standard-page.c06-page .c06-hero>.wrap{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:28px;
  }
  .video-standard-page.c06-page .c06-video-shell{
    width:min(100%,324px);
    justify-self:center;
  }
}