/* === Design tokens ===*/
:root {
  --gf-gold:        #FF8C00; /* Vibrant Orange */
  --gf-gold-dark:   #cc7000;
  --gf-anthracite:  #2C2C2C;
  --gf-surface:     #FAFAFA;
  --gf-card:        #FFFFFF;
  --gf-border:      #E0E0E0;
  --gf-border-dark: #444444;
  --gf-text:        #1A1A1A;
  --gf-text-light:  #F4F4F4;
  --gf-muted:       #888888;
}

/* === Base ===*/
*, *::before, *::after { box-sizing: border-box; }

body {
  background: var(--gf-surface);
  color: var(--gf-text);
  font-family: 'Barlow', sans-serif;
  margin: 0;
  overflow-x: hidden;
}

.bg-anthracite {
  background: var(--gf-anthracite);
  color: var(--gf-text-light);
}

.bg-surface {
  background: var(--gf-surface);
  color: var(--gf-text);
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'Bebas Neue', sans-serif;
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* === Buttons ===*/
.btn-gold {
  display: inline-block;
  background: var(--gf-gold);
  color: #fff;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.1rem;
  letter-spacing: .15em;
  padding: .85rem 2rem;
  text-decoration: none;
  text-transform: uppercase;
  transition: filter .25s, transform .25s;
  border: none;
  cursor: pointer;
}
.btn-gold:hover { filter: brightness(1.12); transform: scale(1.04); color: #fff; }

.btn-ghost {
  display: inline-block;
  border: 2px solid var(--gf-gold);
  color: var(--gf-gold);
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.1rem;
  letter-spacing: .15em;
  padding: .85rem 2rem;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .25s, color .25s;
  background: transparent;
}
.btn-ghost:hover { background: var(--gf-gold); color: #fff; }

/* === Section label ===*/
.section-label {
  font-family: 'Bebas Neue', sans-serif;
  color: var(--gf-gold);
  letter-spacing: .3em;
  font-size: .85rem;
  margin-bottom: .4rem;
}

.section-heading {
  font-family: 'Bebas Neue', sans-serif;
  line-height: .9;
}
.bg-anthracite .section-heading { color: var(--gf-text-light); }
.bg-surface .section-heading { color: var(--gf-anthracite); }

/* === Scroll-fade animation ===*/
.fade-up {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity .7s ease, transform .7s ease;
}
.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* === NAVBAR ===*/
#gf-nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  transition: background .3s, backdrop-filter .3s, border-color .3s;
  border-bottom: 1px solid transparent;
  padding: 1rem 0;
}
#gf-nav.scrolled {
  background: rgba(44,44,44,.95);
  backdrop-filter: blur(12px);
  border-color: var(--gf-border-dark);
}
#gf-nav .nav-brand {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.8rem;
  letter-spacing: .15em;
  color: var(--gf-gold);
  text-decoration: none;
}
.brand-logo-nav {
  height: 52px;
}
#gf-nav .nav-link {
  font-family: 'Bebas Neue', sans-serif;
  font-size: .95rem;
  letter-spacing: .15em;
  color: #fff !important;
  transition: color .25s;
  text-transform: uppercase;
}
#gf-nav .nav-link:hover { color: var(--gf-gold) !important; }

#gf-nav .navbar-toggler {
  border: none;
  color: #fff;
  font-size: 1.6rem;
  padding: 0;
}
#gf-nav .navbar-toggler:focus { box-shadow: none; }
@media (max-width: 991px) {
  #gf-nav .navbar-collapse {
    background: rgba(44,44,44,.98);
    padding: 1rem 1.5rem;
  }
}

/* === HERO SLIDER ===*/
#hero-slider {
  min-height: 100vh;
  position: relative;
  background: var(--gf-anthracite);
}
.carousel-item {
  height: 100vh;
  position: relative;
}
.carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.slider-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(44,44,44,.9) 0%, rgba(44,44,44,.6) 50%, rgba(44,44,44,.2) 100%);
}
.slider-caption {
  position: absolute;
  top: 50%;
  left: 10%;
  transform: translateY(-50%);
  z-index: 10;
  color: var(--gf-text-light);
}
.slider-caption h1 {
  font-size: clamp(4rem, 10vw, 8rem);
  line-height: .9;
  margin-bottom: 1rem;
}
.slider-caption p {
  font-size: 1.2rem;
  max-width: 600px;
  color: #ddd;
}

/* === TEXT TICKER (v1 style) ===*/
#marquee-section {
  background: var(--gf-gold);
  overflow: hidden;
  padding: .9rem 0;
}
.marquee-track {
  display: flex;
  white-space: nowrap;
  animation: marquee-txt 22s linear infinite;
}
.marquee-item {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem;
  letter-spacing: .2em;
  color: #fff;
  margin: 0 2rem;
  flex-shrink: 0;
}
.marquee-dot { opacity: .45; margin: 0 .8rem; }
@keyframes marquee-txt {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* === PHOTO MARQUEE (2-row, opposite directions) ===*/
.photo-marquee-section { background: #111; overflow: hidden; }
.photo-marquee-row { overflow: hidden; }
.photo-marquee-row + .photo-marquee-row { border-top: 1px solid rgba(255,255,255,.05); }
.photo-marquee-track {
  display: flex;
  width: fit-content;
}
.photo-marquee-item {
  width: 280px;
  height: 280px;
  flex: none;
  overflow: hidden;
}
@media (max-width: 575px) {
  .photo-marquee-item { width: 160px; height: 160px; }
}
.photo-marquee-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.photo-marquee-ltr .photo-marquee-track { animation: photo-ltr 28s linear infinite; }
.photo-marquee-rtl .photo-marquee-track { animation: photo-rtl 28s linear infinite; }
@keyframes photo-ltr { from { transform: translateX(0); } to { transform: translateX(-1680px); } }
@keyframes photo-rtl { from { transform: translateX(-1680px); } to { transform: translateX(0); } }
@media (max-width: 575px) {
  @keyframes photo-ltr { from { transform: translateX(0); } to { transform: translateX(-960px); } }
  @keyframes photo-rtl { from { transform: translateX(-960px); } to { transform: translateX(0); } }
}

/* === MENU SHOWCASE ===*/
#menu { padding: 6rem 0; }
.menu-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
@media (max-width: 1199px) {
  .menu-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 767px) {
  .menu-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 449px) {
  .menu-grid { grid-template-columns: 1fr; }
}
.menu-card {
  text-align: center;
  text-decoration: none;
  color: inherit;
  display: block;
}
.menu-card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 1rem;
  transition: transform .3s;
}
.menu-card:hover img { transform: scale(1.03); }
.menu-card h3 {
  font-size: 1.4rem;
  color: var(--gf-text);
  margin: 0;
  transition: color .3s;
}
.menu-card:hover h3 { color: var(--gf-gold); }
.bg-anthracite .menu-card h3 { color: var(--gf-text-light); }
.bg-anthracite .menu-card:hover h3 { color: var(--gf-gold); }

/* === LOCATIONS (BRANCHES) ===*/
#locations { padding: 6rem 0; }
.filter-tabs {
  display: flex;
  gap: 1rem;
  margin-bottom: 2rem;
  justify-content: center;
  flex-wrap: wrap;
}
.filter-btn {
  background: transparent;
  border: 1px solid var(--gf-border);
  color: var(--gf-text);
  padding: .5rem 1.5rem;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.1rem;
  cursor: pointer;
  border-radius: 4px;
}
.filter-btn.active, .filter-btn:hover {
  background: var(--gf-gold);
  color: #fff;
  border-color: var(--gf-gold);
}
/* Filter buttons on dark background */
.bg-anthracite .filter-btn {
  color: var(--gf-text-light);
  border-color: var(--gf-border-dark);
}
.branch-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
@media (max-width: 991px) {
  .branch-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
  .branch-grid { grid-template-columns: 1fr; }
}
.branch-card {
  background: var(--gf-card);
  border: 1px solid var(--gf-border);
  padding: 1.5rem;
  border-radius: 8px;
  text-align: left;
}
.bg-anthracite .branch-card {
  background: rgba(255,255,255,.05);
  border-color: var(--gf-border-dark);
}
.branch-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.5rem;
  margin-bottom: .5rem;
}
.branch-address {
  font-size: .9rem;
  color: var(--gf-muted);
  margin-bottom: 1rem;
  min-height: 40px;
}
.branch-link {
  color: var(--gf-gold);
  font-weight: 600;
  text-decoration: none;
  font-size: .9rem;
  text-transform: uppercase;
}
.branch-link:hover { text-decoration: underline; }

/* === FOOTER ===*/
footer {
  background: var(--gf-anthracite);
  color: var(--gf-text-light);
  padding: 5rem 0 2rem;
}
footer a { color: #ddd; text-decoration: none; }
footer a:hover { color: var(--gf-gold); }
.hashtag {
  font-family: 'Bebas Neue', sans-serif;
  color: var(--gf-gold);
  font-size: 1.5rem;
  letter-spacing: .1em;
}
