/* HERMS Global - responsive layout optimization layer
   Load LAST in <head>: <link rel="stylesheet" href="/css/herms-optimize.css"> */

/* ---------- Global foundations ---------- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
body{font-size:16px;line-height:1.6;text-rendering:optimizeLegibility}
img,video,iframe,svg{max-width:100%;height:auto}
p,li,td{overflow-wrap:anywhere}
h1,h2,h3{line-height:1.15;text-wrap:balance}
a:focus-visible,button:focus-visible{outline:3px solid #4aa8ff;outline-offset:2px}
.container{max-width:1280px}

/* Responsive tables (e.g. Lebanon regulations page) */
table,.Table{display:block;width:100%!important;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-collapse:collapse}
table td,table th{min-width:120px;padding:8px 10px;vertical-align:top}

/* Carousels must never widen the page */
.owl-carousel,.owl-stage-outer,.herms-hero{overflow:hidden}

/* Footer tap targets */
#footer a{display:inline-block;padding:10px 4px;min-height:44px}

/* ---------- Desktop ---------- */
@media (min-width:992px){
  .header-main .navbar-nav{flex-wrap:wrap;justify-content:center;row-gap:4px}
  .header-main .nav-link{white-space:nowrap}
  .milestones-slider-main-content .row>[class*="col-lg-2"]{display:flex}
  .m-s-m-c-box{width:100%}
}
@media (min-width:992px) and (max-width:1279px){
  .header-main .nav-link{font-size:12px;padding-left:.55rem!important;padding-right:.55rem!important}
}

/* ---------- Tablet & mobile ---------- */
@media (max-width:991.98px){
  .container-fluid.px-5{padding-left:16px!important;padding-right:16px!important}

  /* Compact header: logo + contact chips + socials in a tight block */
  .header-top{padding:10px 0}
  .header-top .row{row-gap:6px}
  .header-top-logo{display:flex;justify-content:center}
  .herms-brand-symbol img{max-height:56px;width:auto}
  .h-t-s-s-address .row{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:0}
  .h-t-s-s-address .row>[class*="col-"]{flex:0 0 auto;width:auto;max-width:100%;margin:0!important;padding:0}
  .h-t-s-s-address-a{border:0!important;padding:0!important}
  .h-t-s-s-address-a p{margin:0;font-size:13px;display:flex;align-items:center;gap:6px;min-height:32px}
  .h-t-s-s-address-a img{width:20px;height:20px}
  .header-top-socials{display:flex;justify-content:center;gap:10px}
  .header-top-socials img{width:24px;height:24px}
  .navbar-toggler{min-width:48px;min-height:44px}
  .navbar-collapse{max-height:75vh;overflow-y:auto}
  .navbar-nav .nav-link{padding:12px 16px!important;min-height:44px}

  /* Hero + banners */
  .herms-hero-copy h1,.herms-hero-copy h2{font-size:clamp(28px,7.5vw,44px)!important}
  .herms-section-banner h2{font-size:clamp(24px,6.5vw,38px)!important}
  .herms-hero-cta{min-height:48px;display:inline-flex;align-items:center}

  /* Numbers grid: 2 per row on phones, 3 on tablets */
  .milestones-slider-main-content .row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0}
  .milestones-slider-main-content .row>[class*="col-"]{width:auto;max-width:none;padding:0;margin:0!important}
  .m-s-m-c-box{height:100%!important;display:flex;align-items:center;justify-content:center}
  .m-s-m-c-box .marquee-item{height:auto!important;min-height:0!important;padding:16px 8px!important;margin:0!important}
  .header-top-socials{margin-top:2px}
  .header-main .navbar{padding-top:4px;padding-bottom:4px}
  .territory-section-1 hr{width:40%!important}
}
@media (max-width:575.98px){
  .milestones-slider-main-content .row{grid-template-columns:repeat(2,1fr);gap:10px}
  .m-s-m-c-box h4,.m-s-m-c-box h5{font-size:12px!important;letter-spacing:.02em}
  .ranumber,.ranumber span{font-size:28px!important}
  .team-section-1 p{font-size:16px!important}

  /* Floating actions: one tidy bottom bar, nothing covers content */
  .book-left-side-bar{position:fixed!important;left:0;right:0;bottom:0!important;top:auto!important;width:100%;z-index:998}
  .book-left-side-bar a.icon{height:52px!important;margin:0!important;padding:6px 72px 6px 16px!important;font-size:13px;line-height:1.3;justify-content:center;text-align:center}
  .float{bottom:64px!important;left:auto!important;right:12px;width:52px!important;height:52px!important;z-index:999}
  .float .my-float{margin-top:11px!important}
  body{padding-bottom:56px}

  /* Side Enquiry tab: smaller, never over text */
  .buttonLink .verticalButton{width:110px!important;height:40px!important;font-size:13px}
}
@media (max-width:360px){
  .h-t-s-s-address-a p{font-size:12px}
  .milestones-slider-main-content .row{gap:8px}
}

/* Respect reduced-motion users */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  [data-aos]{opacity:1!important;transform:none!important}
}