/* =========================================================
   PHASE 18: SITE-WIDE QA FIXES
   Hero golden text restore + nav/dropdown/mobile stability + text overflow hardening
   ========================================================= */

/* 1) Site-wide clickability and stacking guard */
.siteNav,
header.nav{
  position: sticky !important;
  top: 0 !important;
  isolation: isolate !important;
  pointer-events: auto !important;
}
.navInner,
.navbar,
.brand,
.desktopMenu,
.navActions,
.moreWrap,
.navMore,
.moreBtn,
.moreMenu,
.menuBtn,
.notice-bell,
.header-bell,
.applyBtn,
.themeToggle{
  pointer-events: auto !important;
}
.moreMenu{
  z-index: 99999 !important;
  pointer-events: auto !important;
}
.moreWrap.open .moreMenu,
.navMore.open .moreMenu,
.moreWrap:focus-within .moreMenu,
.navMore:focus-within .moreMenu{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
}
.moreMenu a{
  pointer-events: auto !important;
  cursor: pointer !important;
}
.drawerScrim,
.scrim{z-index: 99990 !important;}
.mobileDrawer,
.drawer{
  z-index: 99991 !important;
  pointer-events: auto !important;
}
.mobileDrawer.open,
.drawer.open{
  display: flex !important;
  transform: translateX(0) !important;
}
.drawerLinks a,
.drawer a{
  pointer-events: auto !important;
  cursor: pointer !important;
}
.drawerApplyCta{
  background: linear-gradient(135deg,#f8df96,#e7c766,#c89d35) !important;
  color: #160b00 !important;
  border-color: rgba(248,223,150,.55) !important;
  text-align: center !important;
  font-weight: 950 !important;
  box-shadow: 0 14px 30px rgba(200,157,53,.20) !important;
}

/* 2) Hero golden text restored, without blocking the photo or using CTA buttons */
.hp-hero{
  position: relative !important;
  overflow: hidden !important;
}
.hp-hero-caption{
  position: absolute;
  z-index: 6;
  left: max(28px, calc((100vw - 1320px) / 2 + 24px));
  bottom: clamp(42px, 7vh, 86px);
  max-width: min(560px, calc(100vw - 48px));
  padding: clamp(14px, 2vw, 22px) clamp(15px, 2.4vw, 26px);
  border-radius: clamp(18px, 2vw, 30px);
  border: 1px solid rgba(230,199,102,.28);
  background: linear-gradient(135deg, rgba(5,8,15,.54), rgba(5,8,15,.22));
  box-shadow: 0 26px 70px rgba(0,0,0,.32);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  pointer-events: none;
}
.hp-hero-caption__eyebrow{
  color: rgba(245,220,150,.96);
  font-size: clamp(10px, .9vw, 13px);
  letter-spacing: .28em;
  text-transform: uppercase;
  font-weight: 950;
  margin-bottom: clamp(7px, 1vw, 12px);
  text-shadow: 0 2px 18px rgba(0,0,0,.42);
}
.hp-hero-caption__title{
  margin: 0;
  color: #f7dc8f;
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 900;
  letter-spacing: -.035em;
  line-height: .96;
  font-size: clamp(34px, 5vw, 76px);
  max-width: 12ch;
  text-shadow: 0 5px 24px rgba(0,0,0,.48), 0 0 26px rgba(230,199,102,.20);
}
html[data-theme="light"] .hp-hero-caption{
  background: linear-gradient(135deg, rgba(255,255,255,.52), rgba(255,250,240,.22));
  border-color: rgba(117,86,20,.24);
}
html[data-theme="light"] .hp-hero-caption__title{color:#7a4e05;text-shadow:0 2px 18px rgba(255,255,255,.55);}
html[data-theme="light"] .hp-hero-caption__eyebrow{color:#6e4a06;}

/* Override Phase 17 media-only hiding for the new, intentionally compact caption only. */
.hp-hero-caption,
.hp-hero-caption *{
  display: block !important;
  visibility: visible !important;
}

@media (max-width: 760px){
  .hp-hero{
    height: clamp(430px, 64svh, 590px) !important;
    min-height: 430px !important;
    max-height: 590px !important;
  }
  .hp-hero-caption{
    left: 14px;
    right: 14px;
    bottom: 18px;
    max-width: none;
    width: auto;
    padding: 12px 13px 13px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(5,8,15,.60), rgba(5,8,15,.30));
  }
  .hp-hero-caption__eyebrow{
    font-size: 8.5px;
    letter-spacing: .18em;
    margin-bottom: 5px;
  }
  .hp-hero-caption__title{
    font-size: clamp(25px, 8.2vw, 38px);
    max-width: 11.5ch;
    line-height: .98;
  }
}
@media (max-width: 390px){
  .hp-hero{height: clamp(400px, 60svh, 540px) !important; min-height: 400px !important;}
  .hp-hero-caption{left: 10px; right: 10px; bottom: 12px; padding: 10px 11px; border-radius: 16px;}
  .hp-hero-caption__title{font-size: clamp(23px, 7.8vw, 33px);}
}

/* 3) Site-wide text and layout hardening */
*,*::before,*::after{box-sizing:border-box;}
html,body{max-width:100%;overflow-x:hidden;}
main,section,article,aside,header,footer,.container,.card,.panel,.glass,.pageHero,.section,.grid,.formGrid{
  min-width:0;
}
h1,h2,h3,h4,h5,h6,p,li,a,button,label,span,strong,small,td,th,input,textarea,select,
.card,.panel,.glass,.badge,.pill,.btn,.primaryCta,.secondaryCta{
  overflow-wrap: anywhere;
  word-break: normal;
}
.section h1,.section h2,.pageHero h1,.pageHero h2,.section-head h2{
  text-wrap: balance;
  line-height: 1.06;
}
.pageHero p,.section p,.card p,.panel p{line-height:1.65;}
img,video,svg,canvas{max-width:100%;height:auto;}
.tableWrap,.table-wrap,.admin-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
table{max-width:100%;}
input,select,textarea,button{font:inherit;max-width:100%;}
.btn,.primaryCta,.secondaryCta,.applyBtn{white-space:normal;text-align:center;}

/* Prevent common filter/action rows from overflowing on tablet/mobile. */
.filters,.filterBar,.filterGrid,.actions,.formActions,.pageActions,.toolbar,.adminActions{
  min-width:0;
  flex-wrap:wrap;
}
@media (max-width: 860px){
  .container{width:min(100% - 24px, 1180px) !important;}
  .grid,.formGrid,.filters,.filterGrid{
    grid-template-columns:1fr !important;
  }
  .span-3,.span-4,.span-5,.span-6,.span-7,.span-8,.span-9,.span-10,.span-11,.span-12,
  .col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{
    grid-column:1 / -1 !important;
  }
  .card,.panel,.glass{border-radius:20px;}
  .pageHero{padding-top:clamp(42px, 7vw, 68px);padding-bottom:clamp(34px, 6vw, 56px);}
  .pageHero h1{font-size:clamp(31px, 9vw, 48px) !important;}
  .section{padding-block:clamp(42px, 7vw, 66px);}
}
@media (max-width: 520px){
  .container{width:min(100% - 18px, 1180px) !important;}
  .pageHero h1{font-size:clamp(28px, 10vw, 40px) !important;}
  .section h2,.section-head h2{font-size:clamp(25px, 8vw, 36px) !important;}
  .btn,.primaryCta,.secondaryCta{width:100%;justify-content:center;}
  .desktopMenu{display:none !important;}
}
