/* Palette inspired by your logo */
:root{
  --gb-navy: #0f2743;
  --gb-coral: #ff5a49;
  --gb-sky:   #2aa8ff;
  --gb-must:  #ffb84d;
  --gb-cream: #fff7ef;

  /* Map into Bootstrap where helpful */
  --bs-primary: var(--gb-navy);
  --bs-info: var(--gb-sky);
  --bs-warning: var(--gb-must);
  --gb-page-pad: clamp(1rem, 3vw, 2.5rem);
}

header .container-xxl,
main .container-xxl,
footer .container-xxl {
  padding-left: var(--gb-page-pad);
  padding-right: var(--gb-page-pad);
}

body{ background-color: var(--gb-cream); }
.text-accent{ color: var(--gb-coral) !important; }
.btn-accent{
  background-color: var(--gb-coral);
  border-color: var(--gb-coral);
  color:#fff;
}
.btn-accent:hover{ filter: brightness(.93); color:#fff; }

.hero{
  background:
    radial-gradient(60rem 60rem at -10% -10%, rgba(42,168,255,.12), transparent 40%),
    radial-gradient(40rem 40rem at 110% 10%, rgba(255,184,77,.15), transparent 40%);
}

/* Nice card hover */
.card-hover{ transition: transform .15s ease, box-shadow .15s ease; }
.card-hover:hover{ transform: translateY(-2px); box-shadow: 0 .5rem 1rem rgba(0,0,0,.08); }

/* Horizontal scroll with snaps */
.x-scroll{
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding-bottom: .25rem;
}
.x-scroll > *{ scroll-snap-align: start; }

/* Mini gallery inside list cards */
.cover-grid{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: .4rem;
}
.cover-grid .ratio{ border: 1px solid rgba(0,0,0,.06); }

/* Make 2x3 cover ratio */
.ratio-2x3{ aspect-ratio: 2 / 3; width: 100%; }
.object-fit-cover{ object-fit: cover; }

.cover-frame{
  width: clamp(250px, 42vw, 420px);  /* min, fluid, max */
  margin-left: auto;
  margin-right: auto;                /* center it in the column */
}


/* Prefer dark text on light brand background */
:root { color-scheme: light; }
@media (prefers-color-scheme: dark){
  body{ background-color: #0e1724; }
  .bg-body, .bg-body-tertiary{ background-color: #0f1a2a !important; }
  .navbar, .card{ background-color: #13243a; }
  .text-primary-emphasis{ color: #dfe7f3 !important; }
  .card, .border-bottom{ border-color: rgba(255,255,255,.12)!important; }
  .btn-outline-dark{ color:#e6e6e6; border-color: rgba(255,255,255,.4); }
}