
/* YNB mobile-first refinements. Last stylesheet intentionally wins. */
html{scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{overflow-x:clip}
img,svg,video{max-width:100%}
button,a,input{touch-action:manipulation}
button,a{ -webkit-tap-highlight-color:transparent }
:focus-visible{outline:3px solid #d8b46b!important;outline-offset:3px}
nav{z-index:1000!important}
nav .brand{min-width:0}
nav .ynb-brand-wordmark{white-space:nowrap}
#expertise{scroll-margin-top:76px}
@media(max-width:900px){
  nav{position:sticky!important;top:0!important;min-height:70px;padding:10px 5%!important;display:flex!important;align-items:center!important;gap:10px}
  nav .brand{flex:1 1 auto!important;max-width:calc(100% - 58px);gap:9px!important}
  nav .brand img{height:42px!important;width:42px!important;flex-shrink:0}
  nav .ynb-brand-wordmark{font-size:clamp(11px,2.6vw,16px)!important;letter-spacing:.015em!important}
  nav .ynb-menu-toggle{display:flex!important;margin-left:auto!important;flex:0 0 44px}
  nav .links{display:none!important;position:absolute!important;top:100%!important;left:0!important;right:0!important;background:#102744!important;flex-direction:column!important;align-items:stretch!important;padding:12px 5% 22px!important;gap:3px!important;max-height:calc(100dvh - 70px);overflow-y:auto;box-shadow:0 16px 36px #07132145}
  nav.ynb-nav-open .links{display:flex!important}
  nav .links a,nav .links a:not(.pill){display:block!important;color:#fff!important;padding:14px 12px!important;font-size:15px!important;min-height:46px;border-radius:8px}
  nav .links .pill{background:#8c102b!important;color:white!important;text-align:center}
  .hero{padding:70px 6%!important;min-height:min(680px,82svh)!important}
  .hero h1{font-size:clamp(42px,8vw,72px)!important;line-height:1.08!important}
  .section{padding:65px 6%!important}
  .split,.grid,.detail-grid{grid-template-columns:minmax(0,1fr)!important;gap:24px!important}
  .split>*{min-width:0}
  .section h2{font-size:clamp(34px,6.5vw,52px)!important}
  .service{padding:25px!important}
  .contact-details{overflow-wrap:anywhere}
  #expertise.ynb-practices{padding:70px 5% 60px!important;min-height:unset!important}
  #expertise .practice-stage{display:block!important;max-width:100%!important}
  #expertise .practice-stage:before,#expertise .practice-stage:after{display:none!important}
  #expertise .practice-current{max-width:100%!important}
  #expertise .practice-selected{max-width:100%!important;white-space:normal!important;overflow-wrap:break-word!important;font-size:clamp(23px,5.5vw,42px)!important;line-height:1.16!important}
  #expertise .practice-phrase{font-size:clamp(16px,3.4vw,23px)!important}
  #expertise .practice-choices{display:flex!important;overflow-x:auto!important;flex-wrap:nowrap!important;justify-content:flex-start!important;scroll-snap-type:x proximity;padding:8px 4px 14px!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  #expertise .practice-choices button{flex:0 0 auto;scroll-snap-align:start;min-height:44px}
  #expertise .practice-lede{padding:0 10px}
  .gate-panel{max-height:calc(100dvh - 24px)!important;overflow-y:auto!important}
  .gate-actions button{min-height:44px}
  .footer{padding:34px 6%!important}
  .dpdp,.dpdp *{min-width:0}
  .dpdp h1{font-size:clamp(35px,8vw,62px)!important;overflow-wrap:break-word}
  .dpdp .wrap{width:min(100% - 32px,1100px)!important}
  .dpdp .grid,.dpdp .two-col,.dpdp .feature-grid{grid-template-columns:minmax(0,1fr)!important}
  .dpdp .timeline{max-width:100%!important}
  .dpdp img,.dpdp svg{max-width:100%;height:auto}
  .dpdp table{display:block;max-width:100%;overflow-x:auto}
}
@media(max-width:520px){
  nav .ynb-brand-wordmark{font-size:clamp(10px,3.1vw,13px)!important}
  .hero h1{font-size:clamp(40px,11vw,56px)!important}
  .hero p,.intro{font-size:16px!important;line-height:1.65!important}
  .section{padding:56px 20px!important}
  .section h2{font-size:clamp(32px,9vw,44px)!important}
  #expertise.ynb-practices{padding:56px 18px!important}
  #expertise .practice-selected{font-size:clamp(23px,7vw,32px)!important}
  #expertise .practice-neighbour{font-size:clamp(17px,5vw,24px)!important}
  #expertise .practice-description{font-size:15px!important;line-height:1.55!important}
  .gate-overlay{padding:10px!important}
  .gate-panel{padding:20px!important;border-radius:14px!important}
  .gate-copy{font-size:13px!important}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 *,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
 .ynb-reveal{opacity:1!important;transform:none!important}
}
