/* Public layout: section background > bounded container > grid > card content.
   Keep Bootstrap's column gutters; never pad every nested container. */
#page-wrapper {
  --bcs-page-inset: 24px;
  --bcs-card-inset: 24px;
  --bcs-section-space: 48px;
}
@media (max-width: 767.98px) {
  #page-wrapper #main-header .navbar > .container,
  #page-wrapper #main-header .sub-header > .container,
  #page-wrapper #content-section section > .container,
  #page-wrapper #content-section main > .container,
  #page-wrapper #content-section > .container {
    padding-left: var(--bcs-page-inset);
    padding-right: var(--bcs-page-inset);
  }
  #page-wrapper .bcs-home section,
  #page-wrapper .bcs-local-section {
    padding-top: var(--bcs-section-space);
    padding-bottom: var(--bcs-section-space);
  }
  /* The navbar already reserves its own height. Hero padding is internal space. */
  #page-wrapper .bcs-home .home-hero {
  }
  #page-wrapper .bcs-home .home-offer-body,
  #page-wrapper .bcs-offer-card > div,
  #page-wrapper .bcs-choice-panel,
  #page-wrapper .bcs-text-card,
  #page-wrapper .bcs-catalogue-intro,
  #page-wrapper .bcs-location {
    padding: var(--bcs-card-inset);
  }
  #page-wrapper #main-header .navbar-brand { margin-right: 12px; }
  #page-wrapper #main-header .navbar-toggler {
    min-width: 44px;
    min-height: 44px;
    margin-right: 0;
  }
  #page-wrapper #main-header .navbar-collapse {
    padding-top: 12px;
    padding-bottom: 16px;
    max-height: calc(100dvh - 80px);
    overflow-y: auto;
  }
  #page-wrapper #main-header .navbar-nav .nav-link {
    min-height: 44px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  #page-wrapper .bcs-home .home-actions,
  #page-wrapper .bcs-actions { gap: 12px; }
}

/* Compact mobile header: explicit inner padding and matching reserved height. */
@media (max-width: 767.98px) {
  #page-wrapper #header-section { min-height: 80px; }
  #page-wrapper #main-header .navbar {
    min-height: 80px;
    padding: 0 !important; /* Overrides Bootstrap p-0 and legacy mobile !important. */
  }
  #page-wrapper #main-header .navbar > .container {
    min-height: 80px;
    padding-top: 12px;
    padding-bottom: 12px;
    align-items: center;
  }
  #page-wrapper #main-header .nav-logo {
    height: 44px;
    max-width: 160px;
    object-fit: contain;
    margin: 0;
  }
  #page-wrapper #main-header .navbar-toggler {
    position: relative;
    top: auto;
    right: auto;
    margin: 0;
    align-self: center;
  }
  #page-wrapper .bcs-home .home-hero-image {
    display: block;
    width: 100%;
    height: 180px;
    max-width: 100%;
    object-fit: cover;
    border-radius: 12px;
    margin-top: 8px;
  }
}

@media(max-width:767.98px){#page-wrapper #main-header .navbar > .container{justify-content:space-between}#page-wrapper #main-header .navbar-brand{position:static;float:none;transform:none;margin:0 12px 0 0;padding:0}}

/* A visible photographic hero at every viewport, independent of carousel JS. */
#page-wrapper .bcs-home .home-hero {
  background-color: #142b22;
  background-image: linear-gradient(90deg,rgba(9,28,21,.94),rgba(9,28,21,.72) 55%,rgba(9,28,21,.26)),url('../images/bcs-it-local-office.png');
  background-size: cover;
  background-position: center;
  min-height: 530px;
  display: flex;
  align-items: center;
}
#page-wrapper .bcs-home .home-hero h1,
#page-wrapper .bcs-home .home-hero .home-kicker,
#page-wrapper .bcs-home .home-hero .home-lead { color: #fff; }
#page-wrapper .bcs-home .home-hero .home-kicker { color: #d6edce; }
#page-wrapper .bcs-home .home-hero .col-lg-4 { display: none; }
#page-wrapper .bcs-home .home-hero .home-button { background:#e1f0d8;color:#173b25;border-color:#e1f0d8; }
#page-wrapper .bcs-home .home-hero .home-button.secondary { background:rgba(8,27,19,.4);color:#fff;border-color:#fff; }
#page-wrapper .bcs-home .home-hero .home-button:hover { background:#fff;color:#173b25; }
#page-wrapper .bcs-home .home-hero a:focus-visible { outline-color:#fff; }
@media(max-width:767.98px){
  #page-wrapper .bcs-home .home-hero {
    background-image:linear-gradient(180deg,rgba(9,28,21,.58),rgba(9,28,21,.90)),url('../images/bcs-it-local-office.png');
    background-position:62% center;
    min-height:560px;
  }
  #page-wrapper .bcs-home .home-hero h1 {font-size:clamp(1.9rem,7.7vw,2.3rem);line-height:1.18;}
  #page-wrapper .bcs-home .home-hero .home-lead {font-size:1rem;line-height:1.65;}
  #page-wrapper .bcs-home .home-hero .home-kicker {font-size:.85rem;line-height:1.5;}
}

/* Tablet / phone desktop mode: match Bootstrap's collapsed navigation range. */
@media(min-width:768px) and (max-width:991.98px){
  #page-wrapper #header-section{min-height:126px}
  #page-wrapper #main-header .navbar{background:#212121!important;min-height:80px;padding:0!important}
  #page-wrapper #main-header .navbar > .container{min-height:80px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between}
  #page-wrapper #main-header .navbar-brand{position:static;float:none;transform:none;margin:0 12px 0 0;padding:0}
  #page-wrapper #main-header .nav-logo{height:44px;width:auto;max-width:160px;object-fit:contain;margin:0}
  #page-wrapper #main-header .navbar-toggler{position:static;float:none;min-width:44px;min-height:44px;margin:0;border-radius:12px;align-self:center}
  #page-wrapper #main-header .navbar-collapse{flex-basis:100%;margin-top:12px;padding:16px 24px;max-height:calc(100dvh - 150px);overflow-y:auto}
  #page-wrapper #main-header .navbar-nav .nav-link{min-height:44px;padding:12px 0}
}
@media(min-width:992px){
  #page-wrapper #main-header .navbar-brand{position:static;float:none}
}