/* ============================================================
   Bootstrap 5 layout fallback — grid, flex, navbar, carousel.
   Loads BEFORE the CDN so real Bootstrap overrides it when
   present, but the site lays out correctly if the CDN is
   blocked or slow. Specificity kept flat (single-class) so
   media-query overrides win correctly.
   ============================================================ */

/* Container */
.container{width:100%;margin-right:auto;margin-left:auto;padding-right:12px;padding-left:12px}
@media(min-width:576px){.container{max-width:540px}}
@media(min-width:768px){.container{max-width:720px}}
@media(min-width:992px){.container{max-width:960px}}
@media(min-width:1200px){.container{max-width:1140px}}
@media(min-width:1400px){.container{max-width:1320px}}

/* Row + gutters */
.row{display:flex;flex-wrap:wrap;margin-right:calc(-.5 * var(--vo-gx,1.5rem));margin-left:calc(-.5 * var(--vo-gx,1.5rem));margin-top:calc(-1 * var(--vo-gy,0))}
.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--vo-gx,1.5rem) * .5);padding-left:calc(var(--vo-gx,1.5rem) * .5);margin-top:var(--vo-gy,0)}
.g-3{--vo-gx:1rem;--vo-gy:1rem}
.g-4{--vo-gx:1.5rem;--vo-gy:1.5rem}
.g-5{--vo-gx:3rem;--vo-gy:3rem}
.g-md-4{--vo-gx:1.5rem;--vo-gy:1.5rem}
.g-lg-5{--vo-gx:3rem}

/* Base cols (all widths flat: single-class specificity) */
.col-6{width:50%}
.col-md-4,.col-md-6{width:100%}
.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7{width:100%}

@media(min-width:768px){
  .col-md-4{width:33.33333%}
  .col-md-6{width:50%}
}
@media(min-width:992px){
  .col-lg-2{width:16.66667%}
  .col-lg-3{width:25%}
  .col-lg-4{width:33.33333%}
  .col-lg-5{width:41.66667%}
  .col-lg-6{width:50%}
  .col-lg-7{width:58.33333%}
}

/* Flex + spacing utilities */
.d-flex{display:flex}
.align-items-center{align-items:center}
.justify-content-center{justify-content:center}
.justify-content-between{justify-content:space-between}
.flex-wrap{flex-wrap:wrap}
.text-center{text-align:center}
.w-100{width:100%!important}
.gap-3{gap:1rem}
.mx-auto{margin-right:auto;margin-left:auto}
.ms-auto{margin-left:auto}
.ms-lg-3{margin-left:0}
@media(min-width:992px){.ms-lg-3{margin-left:1rem}}
.mt-2{margin-top:.5rem}
.mt-lg-0{margin-top:.5rem}
@media(min-width:992px){.mt-lg-0{margin-top:0}}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0!important}

/* Navbar (expand-lg) */
.navbar{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}
.navbar>.container{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}
.navbar-brand{display:inline-block}
.navbar-nav{display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}
.nav-link{display:block}
.navbar-toggler{display:inline-block;padding:.25rem .75rem;background:transparent;border:1px solid transparent;cursor:pointer}
.navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center}
.collapse:not(.show){display:none}
.dropdown{position:relative}
.dropdown-menu{position:absolute;z-index:1000;display:none;min-width:10rem;padding:.5rem 0;margin:0;list-style:none;background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:.375rem}
.dropdown-menu.show{display:block}
.dropdown-item{display:block;width:100%;padding:.25rem 1rem;clear:both;white-space:nowrap;background:transparent;border:0}
.dropdown-toggle{white-space:nowrap}
.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid transparent;border-bottom:0;border-left:.3em solid transparent}
@media(min-width:992px){
  .navbar-expand-lg{flex-wrap:nowrap;justify-content:flex-start}
  .navbar-expand-lg .navbar-nav{flex-direction:row}
  .navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}
  .navbar-expand-lg .navbar-toggler{display:none}
  .navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}
}

/* Offcanvas (Bootstrap 5) */
.offcanvas{position:fixed;bottom:0;z-index:1045;display:flex;flex-direction:column;max-width:100%;visibility:hidden;background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}
.offcanvas.offcanvas-end{top:0;right:0;width:400px;border-left:1px solid rgba(0,0,0,.15);transform:translateX(100%)}
.offcanvas.showing,.offcanvas.show:not(.hiding){transform:none}
.offcanvas.showing,.offcanvas.hiding,.offcanvas.show{visibility:visible}
.offcanvas-header{display:flex;align-items:center;justify-content:space-between;padding:1rem}
.offcanvas-body{flex-grow:1;padding:1rem;overflow-y:auto}
.offcanvas-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}
.offcanvas-backdrop.fade{opacity:0}.offcanvas-backdrop.show{opacity:.5}

/* Carousel */
.carousel{position:relative}
.carousel-inner{position:relative;width:100%;overflow:hidden}
.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;backface-visibility:hidden}
.carousel-item.active{display:block}
.carousel-fade .carousel-item{opacity:0;transition:opacity .6s ease}
.carousel-fade .carousel-item.active{opacity:1}
.carousel-control-prev,.carousel-control-next{position:absolute;top:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;cursor:pointer}
.carousel-indicators{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;justify-content:center;padding:0;margin:0;list-style:none}
.carousel-indicators [data-bs-target]{box-sizing:content-box;cursor:pointer;border:0;background:transparent}
