:root{
  --brand-brown:#111111;
  --brand-amber:#d40000;
  --brand-brown-dark:#000000;
}
html{scroll-behavior:smooth}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
.navbar{border-bottom:1px solid rgba(0,0,0,.06)}
footer{border-top:1px solid rgba(0,0,0,.06)}
.hero{background:linear-gradient(90deg,#ff6b6b,#b30000);color:#fff}
.hero-headline{display:inline-block;padding:.35em 0;border-radius:.6rem;background:transparent;}

.btn-cta{background:var(--brand-amber);border:none;color:#ffffff;font-weight:700}
.btn-cta:hover{filter:brightness(.95)}
.object-fit-cover{object-fit:cover}
.gallery .card{transition:transform .15s ease, box-shadow .15s ease}
.gallery .card:hover{transform:translateY(-2px); box-shadow:0 .5rem 1rem rgba(0,0,0,.12)}


/* Black CTA that lightens on hover */
.btn-black{background:#000;color:#fff;border:none}
.btn-black:hover{background:#222;color:#fff}
.btn-black:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* SPA sections */
section[id]{scroll-margin-top:84px}
.section-pad{padding-top:4.5rem;padding-bottom:4.5rem}

/* Bread truck */
#bread-truck{
  position: fixed;
  left: 0;           /* left is fine; JS uses translateX */
  bottom: 12px;
  width: 160px;      /* adjust to taste */
  height: auto;
  z-index: 9999;
  pointer-events: none;
  will-change: transform;
}


/* Red/Black/White theme overrides */
.navbar{background:#000000 !important}
.navbar .navbar-brand,.navbar .nav-link{color:#ffffff !important}
.navbar .nav-link:hover,.navbar .nav-link:focus{color:var(--brand-amber) !important}
.brand-logo{height:60px;width:auto;display:inline-block;transform:scale(2.5);transform-origin:left center}
.brand-text{letter-spacing:0.2px}
.bg-black{background:#000000 !important;color:#ffffff}
.bg-black a{color:#ffffff}
.bg-black a:hover{color:var(--brand-amber)}

.footer-logo {
  height: 60px;
  width: auto;
  display: block;
  transform: scale(2.5);
  transform-origin: left center
}

.site-footer {
  overflow: hidden;
  padding: .5rem 0;
}

.section-title{color:#000000}
.section-title .accent{color:var(--brand-amber)}

.callout{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);color:#ffffff}
.navbar.navbar-dark .nav-link{color:#ffffff}
.navbar.navbar-dark .nav-link:hover{color:#ffffff;opacity:.85}

.product-card-img{width:100%;height:220px;object-fit:contain;background:#000;display:block;}

#problem-solution .display-5 { letter-spacing: -0.02em; }
#problem-solution .lead { max-width: 42rem; }
#problem-solution aside p { line-height: 1.45; }
#problem-solution { scroll-margin-top: 90px; }

.img-rotate-wrap{
  width: 100%;
  min-height: 260px;          /* set whatever height your design needs */
  display: flex;
  justify-content: center;     /* horizontal center */
  overflow: hidden;            /* hide overflow after rotation */
}

.rotated-90{
  transform: rotate(90deg);
  transform-origin: center;
  max-width: 100%;
  max-height: 100%;
  height: auto;
  width: auto;
}