/* =============================================================
   layout.css — wrappers, grid, header/footer skeleton
   ============================================================= */

.sbt-container{
  width:100%;
  max-width:var(--sbt-content-max);
  margin-inline:auto;
  padding-inline:var(--sbt-gutter-mob);
}
@media (min-width: 900px){
  .sbt-container{ padding-inline:var(--sbt-gutter) }
}

.sbt-section{ padding-block:var(--sbt-space-8) }
.sbt-section--lg{ padding-block:var(--sbt-space-9) }
.sbt-section--sm{ padding-block:var(--sbt-space-6) }
.sbt-section--alt{ background:var(--sbt-mist) }

.sbt-grid{ display:grid; gap:var(--sbt-space-5) }
.sbt-grid--2{ grid-template-columns:repeat(2, minmax(0,1fr)) }
.sbt-grid--3{ grid-template-columns:repeat(3, minmax(0,1fr)) }
.sbt-grid--4{ grid-template-columns:repeat(4, minmax(0,1fr)) }
.sbt-grid--6{ grid-template-columns:repeat(6, minmax(0,1fr)) }
@media (max-width: 1000px){
  .sbt-grid--4, .sbt-grid--6{ grid-template-columns:repeat(3, minmax(0,1fr)) }
}
@media (max-width: 760px){
  .sbt-grid--2, .sbt-grid--3, .sbt-grid--4, .sbt-grid--6{ grid-template-columns:1fr }
}

/* Header */
.sbt-header{
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--sbt-cream) 92%, transparent);
  backdrop-filter:saturate(140%) blur(8px);
  -webkit-backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid color-mix(in srgb, var(--sbt-rustic) 12%, transparent);
}
.sbt-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--sbt-space-5); padding-block:var(--sbt-space-3);
}
.sbt-brand{
  display:inline-flex; align-items:center; gap:.55em;
  font-family:var(--sbt-font-display); font-size:1.35rem; font-weight:700;
  color:var(--sbt-basil); text-decoration:none; letter-spacing:-.02em;
}
.sbt-brand__mark{ font-size:1.4rem; filter:saturate(1.2) }

.sbt-nav{ display:flex; align-items:center; gap:var(--sbt-space-5) }
.sbt-nav__list{ list-style:none; margin:0; padding:0; display:flex; gap:var(--sbt-space-5) }
.sbt-nav__list a{
  text-decoration:none; color:var(--sbt-ink); font-weight:500;
  padding:.4em 0; border-bottom:2px solid transparent;
}
.sbt-nav__list a:hover, .sbt-nav__list .current-menu-item > a{
  color:var(--sbt-basil); border-bottom-color:var(--sbt-spice);
}

.sbt-nav-toggle{
  display:none; padding:.5em; border-radius:var(--sbt-radius-sm);
  border:1px solid color-mix(in srgb, var(--sbt-rustic) 25%, transparent);
}
@media (max-width: 900px){
  .sbt-nav{ display:none }
  .sbt-nav.is-open{
    display:flex; flex-direction:column; position:absolute; top:100%; left:0; right:0;
    background:var(--sbt-cream); padding:var(--sbt-space-5); border-bottom:1px solid color-mix(in srgb, var(--sbt-rustic) 12%, transparent);
  }
  .sbt-nav.is-open .sbt-nav__list{ flex-direction:column; gap:var(--sbt-space-3); width:100% }
  .sbt-nav-toggle{ display:inline-flex; align-items:center; gap:.4em }
}

/* Footer */
.sbt-footer{
  background:var(--sbt-basil); color:color-mix(in srgb, var(--sbt-cream) 92%, transparent);
  padding:var(--sbt-space-9) 0 var(--sbt-space-6); margin-top:var(--sbt-space-8);
}
.sbt-footer a{ color:var(--sbt-sage) }
.sbt-footer a:hover{ color:var(--sbt-cream) }
.sbt-footer h4{ color:var(--sbt-sage); font-family:var(--sbt-font-display); font-size:1.05rem; font-weight:700; letter-spacing:.02em; text-transform:uppercase; margin-bottom:var(--sbt-space-3) }
.sbt-footer__cols{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--sbt-space-6) }
@media (max-width: 900px){ .sbt-footer__cols{ grid-template-columns:1fr 1fr } }
@media (max-width: 600px){ .sbt-footer__cols{ grid-template-columns:1fr } }
.sbt-footer__brand p{ opacity:.85; max-width:30ch }
.sbt-footer__menu{ list-style:none; padding:0; margin:0 }
.sbt-footer__menu li{ margin:.4em 0 }
.sbt-footer__bottom{
  margin-top:var(--sbt-space-7); padding-top:var(--sbt-space-4);
  border-top:1px solid color-mix(in srgb, var(--sbt-cream) 18%, transparent);
  display:flex; justify-content:space-between; gap:var(--sbt-space-4); flex-wrap:wrap;
  font-size:.875rem; opacity:.85;
}