/* DRUK R5.21 — evidence-driven final behavioural patch.
   Scope: TC-13/14/15 header, TC-34 floating actions, TC-36 course sticky nav,
   mobile viewport containment. Loaded LAST on every HTML page. */
:root{--druk-header-live-height:118px}

/* One sticky wrapper is the reliable model: topbar can collapse inside it,
   while the main header remains pinned at viewport top. */
#siteHeader{
  display:block!important;
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:5000!important;
  width:100%!important;
  background:#fff!important;
  isolation:isolate!important;
}
body{padding-top:var(--druk-header-live-height)!important;}
#siteHeader>.topbar,
#siteHeader>.site-header{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
}
#siteHeader>.topbar{
  overflow:hidden!important;
  max-height:44px!important;
  opacity:1!important;
  transform:none!important;
  transition:max-height .24s ease,opacity .18s ease,transform .24s ease!important;
}
body.topbar-collapsed #siteHeader>.topbar{
  max-height:0!important;
  opacity:0!important;
  transform:translateY(-100%)!important;
  pointer-events:none!important;
}
#siteHeader>.site-header{
  z-index:2!important;
  background:rgba(255,255,255,.985)!important;
  -webkit-backdrop-filter:blur(12px)!important;
  backdrop-filter:blur(12px)!important;
  box-shadow:0 1px 0 rgba(8,47,87,.10),0 8px 22px rgba(8,47,87,.05)!important;
}

/* Mobile menu always opens immediately below the live sticky header. */
.mobile-panel{
  top:var(--druk-header-live-height)!important;
  height:calc(100dvh - var(--druk-header-live-height))!important;
  max-height:calc(100dvh - var(--druk-header-live-height))!important;
  bottom:auto!important;
}

/* Course in-page navigator: stays below the live header at every width. */
.course-page-nav.v85-course-sticky-nav,
.v85-course-sticky-nav,
.course-page-nav{
  position:sticky!important;
  top:var(--druk-header-live-height)!important;
  z-index:3000!important;
  background:rgba(255,255,255,.98)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
}
.course-page-nav.v85-course-sticky-nav .container,
.v85-course-sticky-nav .container{
  overflow-x:auto!important;
  overscroll-behavior-inline:contain!important;
  scrollbar-width:none!important;
}
.course-page-nav.v85-course-sticky-nav .container::-webkit-scrollbar,
.v85-course-sticky-nav .container::-webkit-scrollbar{display:none!important}

/* Homepage visual viewport always excludes the actual live header height. */
body.v83-home .vh-section.vh-hero{
  height:calc(100dvh - var(--druk-header-live-height))!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
}

/* Hero copy stays inside the mobile visual frame with a true 1rem safe gap. */
@media(max-width:520px){
  #siteHeader>.topbar{display:none!important;max-height:0!important}
  body.v83-home .vh-hero-card{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:16px!important;
    top:auto!important;
    margin:0!important;
    width:auto!important;
    max-width:none!important;
    max-height:32%!important;
    overflow:visible!important;
    transform:none!important;
  }
  body.v83-home .vh-copy-click-target h1,
  body.v83-home .vh-copy-click-target h2{
    font-size:clamp(22px,7vw,28px)!important;
    line-height:1.03!important;
    margin:0!important;
  }
  body.v83-home .home-slider-prev,
  body.v83-home .home-slider-next{top:14px!important}
}

/* Floating actions must never sit on top of hero copy. Hide them while the
   hero occupies the viewport; reveal after the user moves past the hero. */
body.v83-home.home-hero-visible .whatsapp-float,
body.v83-home.home-hero-visible .back-top{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(8px)!important;
}
body.v83-home:not(.home-hero-visible) .whatsapp-float{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:none!important;
}

/* Predictable safe rail for floating controls after the hero. */
body.v83-home .whatsapp-float{right:16px!important;bottom:18px!important}
body.v83-home .back-top{right:16px!important;bottom:84px!important}
@media(max-width:640px){
  body.v83-home .whatsapp-float{right:12px!important;bottom:12px!important}
  body.v83-home .back-top{right:12px!important;bottom:76px!important}
}

/* Sticky descendants cannot work inside an overflow-hidden ancestor. */
body.v83-course main#main{overflow:visible!important;}
html body.v83-course .course-page-nav.v85-course-sticky-nav{
  position:sticky!important;
  top:var(--druk-header-live-height)!important;
  z-index:3000!important;
}
body.v83-course{overflow:visible!important;}
body.v83-home.home-hero-visible .whatsapp-float,
body.v83-home.home-hero-visible .back-top{transition:none!important;}
html,body{overflow-anchor:none!important;}

/* TC09-TC12: remove scrollbar-width overflow from legacy 100vw course bands. */
body.v83-course .course-copy-section:nth-of-type(even){
  margin-left:0!important;
  margin-right:0!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:24px!important;
  padding-right:24px!important;
  box-sizing:border-box!important;
}
@media(min-width:1200px){
  body.v83-course .course-copy-section:nth-of-type(even){
    padding-left:32px!important;
    padding-right:32px!important;
  }
}

/* TC09-TC12: placement bridge used the same scrollbar-sensitive 100vw bleed. */
body.v83-course .v83-placement-bridge{
  margin-left:0!important;
  margin-right:0!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:24px!important;
  padding-right:24px!important;
  box-sizing:border-box!important;
}
@media(min-width:1200px){
  body.v83-course .v83-placement-bridge{padding-left:32px!important;padding-right:32px!important}
}

/* TC58: mobile grid children must be allowed to shrink inside the viewport. */
@media(max-width:720px){
  .facility-story-row{
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:100%!important;
  }
  .facility-story-row>* ,
  .facility-story-row>div,
  .facility-story-row figure{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  .facility-story-row h1,.facility-story-row h2,.facility-story-row h3,
  .facility-story-row p{max-width:100%!important;overflow-wrap:anywhere!important}

  body.v83-home .v68-final-cta-shell{
    grid-template-columns:minmax(0,1fr)!important;
    width:calc(100% - 24px)!important;
    max-width:calc(100% - 24px)!important;
  }
  body.v83-home .v68-final-cta-shell>* ,
  body.v83-home .v68-final-cta-copy,
  body.v83-home .v68-final-cta-image{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  body.v83-home .v68-final-cta-copy .btn{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}

/* TC32: preserve Nextwebi-style first-view stats after switching to a true fixed header. */
@media(min-width:821px){
  body.v83-home .vh-section.vh-hero{
    height:calc(100dvh - var(--druk-header-live-height) - 72px)!important;
    min-height:500px!important;
  }
  body.v83-home .v82-home-trust{margin-top:-46px!important;padding-top:0!important}
}
@media(min-width:821px) and (max-height:720px){
  body.v83-home .vh-section.vh-hero{
    height:calc(100dvh - var(--druk-header-live-height) - 82px)!important;
    min-height:430px!important;
  }
}

/* TC50/TC55: restore intentional breathing space where the generic v83-family-grid
   rule deliberately zeroes gaps for joined card grids. These are image/editorial grids. */
body.v83-standard .v83-family-grid .lab-intro-grid{
  gap:clamp(28px,4vw,50px)!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
}
body.student-life-v26.v83-standard .v83-family-grid .image-feature-grid{
  gap:22px!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
}
@media(max-width:720px){
  body.student-life-v26.v83-standard .v83-family-grid .image-feature-grid{gap:18px!important}
}
