/**
 * gsts-marketing-design-system.css
 * Phase: marketing_design_system_pass
 * Scope: body.gsts-marketing-shell — NEVER applied to storefront, cart, checkout, or reservation.
 * Tokens derived from robexa-reservation.css (the visual reference).
 */

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
body.gsts-marketing-shell {
  /* Canvas */
  --gsts-mkt-bg-page:    #faf7f3;
  --gsts-mkt-bg-card:    #fffefb;
  --gsts-mkt-bg-muted:   #f4ece4;
  --gsts-mkt-bg-elevated: #ffffff;
  /* Typography */
  --gsts-mkt-navy:       #141f33;
  --gsts-mkt-navy-soft:  #2a3548;
  --gsts-mkt-text:       #141f33;
  --gsts-mkt-muted:      #5c6578;
  /* Accent */
  --gsts-mkt-orange:     #c67a1c;
  --gsts-mkt-orange-deep: #a45f0f;
  --gsts-mkt-orange-soft: rgba(198, 122, 28, 0.14);
  --gsts-mkt-orange-ghost: rgba(198, 122, 28, 0.09);
  --gsts-mkt-gradient-cta: linear-gradient(135deg, #dc8b22 0%, #c97416 52%, #b8660f 100%);
  --gsts-mkt-gradient-cta-hover: linear-gradient(135deg, #e3982e 0%, #d3821a 52%, #c46f12 100%);
  /* Structure */
  --gsts-mkt-border:       rgba(20, 31, 51, 0.10);
  --gsts-mkt-border-orange: rgba(200, 118, 38, 0.34);
  --gsts-mkt-radius:       16px;
  --gsts-mkt-radius-sm:    12px;
  --gsts-mkt-shadow:       0 14px 42px rgba(20, 31, 51, 0.08), 0 4px 12px rgba(20, 31, 51, 0.04);
  --gsts-mkt-shadow-card:  0 18px 48px rgba(20, 31, 51, 0.10), 0 2px 10px rgba(20, 31, 51, 0.05);
  --gsts-mkt-focus-ring:   rgba(210, 140, 48, 0.45);
  /* Header: align inner .container with homepage hero / banner (1140px from lg+) */
  --gsts-mkt-header-content-max: 1140px;
  --gsts-mkt-header-bar-shadow: 0 3px 18px rgba(20, 31, 51, 0.042), 0 1px 0 rgba(20, 31, 51, 0.055);

  /*
   * Bootstrap / TI theme default: vivid marketing orange on --bs-primary (#ff4900 class of values).
   * That primary propagates into unclassed prose links, .link-primary, .btn-link, .text-primary, etc.
   * Remap only inside the marketing shell so storefront ordering flows stay unchanged.
   */
  --bs-primary: #c67a1c;
  --bs-primary-rgb: 198, 122, 28;
  /*
   * TI `public/vendor/igniter-orange/css/app.css` sets :root --bs-link-color / --bs-link-color-rgb to #ff4900.
   * Bootstrap anchors + `.btn-link` use `var(--bs-link-color)` — without this, Register/terms + login links stay neon orange.
   */
  --bs-link-color: #c67a1c;
  --bs-link-hover-color: #8d5610;
  --bs-link-color-rgb: 198, 122, 28;
  --bs-link-hover-color-rgb: 141, 86, 16;

  background-color: var(--gsts-mkt-bg-page);
  color: var(--gsts-mkt-text);
}

/* Theme compiles `--bs-btn-focus-shadow-rgb: 217, 62, 0` on `.btn-link` — nudge to brand gold for focus glow. */
body.gsts-marketing-shell .btn-link {
  --bs-btn-focus-shadow-rgb: 198, 122, 28;
}

/* ============================================================
   REUSABLE PRIMITIVES
   ============================================================ */

/* Elevated soft panel */
body.gsts-marketing-shell .gsts-mkt-panel {
  background: var(--gsts-mkt-bg-card);
  border: 1px solid var(--gsts-mkt-border);
  border-radius: var(--gsts-mkt-radius);
  box-shadow: var(--gsts-mkt-shadow-card);
  padding: 1.35rem 1.45rem;
}
@media (min-width: 768px) {
  body.gsts-marketing-shell .gsts-mkt-panel {
    padding: 1.65rem 1.75rem;
  }
}

/* Muted tint inset callout */
body.gsts-marketing-shell .gsts-mkt-panel-muted {
  background: linear-gradient(165deg, var(--gsts-mkt-bg-card) 0%, var(--gsts-mkt-bg-muted) 100%);
  border: 1px solid var(--gsts-mkt-border);
  border-radius: var(--gsts-mkt-radius-sm);
  padding: 1.1rem 1.25rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

/* Kicker label */
body.gsts-marketing-shell .gsts-hero-kicker {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--gsts-mkt-orange);
}

/* ============================================================
   HEADER — marketing sticky topnav (premium minimal, RTL-safe)
   ============================================================ */
body.gsts-marketing-shell .gsts-marketing-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  transition: box-shadow 0.2s ease;
}

body.gsts-marketing-shell .gsts-marketing-topnav {
  background: var(--gsts-mkt-bg-card) !important;
  border-bottom: 1px solid rgba(20, 31, 51, 0.078);
  box-shadow: var(--gsts-mkt-header-bar-shadow);
}

/* Vertical rhythm: override Bootstrap `py-lg-0` on brochure layout for deliberate bar height */
body.gsts-marketing-shell .gsts-marketing-topnav.navbar {
  padding-top: 0.55rem !important;
  padding-bottom: 0.55rem !important;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav.navbar {
    padding-top: 0.65rem !important;
    padding-bottom: 0.65rem !important;
  }
}

/* Inner row: align with hero / homepage content rail (Bootstrap lg container is 960px; hero uses 1140px) */
body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-topnav-inner {
  min-height: 3.15rem;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-topnav-inner.container {
    max-width: var(--gsts-mkt-header-content-max) !important;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-topnav-inner {
    min-height: 3.35rem;
  }
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-brand {
  padding-inline-end: 0.2rem;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-brand {
    padding-inline-end: 0.45rem;
  }
}

/* Logo height: Theme Customize `logo_height` → `--gsts-theme-logo-height` on `<header.header>`; reinforced in gsts-public-logo.css */
body.gsts-marketing-shell .gsts-marketing-topnav .navbar-brand .img-logo {
  height: var(--gsts-theme-logo-height, 42px);
  max-height: var(--gsts-theme-logo-height, 42px);
  width: auto;
  object-fit: contain;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-brand .img-logo {
    height: var(--gsts-theme-logo-height, 46px);
    max-height: var(--gsts-theme-logo-height, 46px);
  }
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-brand .text-logo {
  font-weight: 700;
  color: var(--gsts-mkt-navy);
  line-height: 1.15;
  font-size: clamp(1.06rem, 2.2vw, 1.22rem);
}

/*
 * Flat marketing menu links only — brochure `marketing-public-nav` uses pill chips
 * (see gsts-marketing-public-nav.css); do not apply underline treatment there.
 */
body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn) {
  position: relative;
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--gsts-mkt-navy-soft);
  text-decoration: none;
  padding-bottom: 0.45rem;
  transition: color 0.16s ease;
}

/* Accent rail: precise, RTL-safe (logical insets), calmer than text-decoration */
body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn)::after {
  content: '';
  position: absolute;
  inset-inline: 0.35rem;
  bottom: 0.08rem;
  height: 2px;
  border-radius: 999px;
  pointer-events: none;
  background-color: transparent;
  opacity: 0;
  transform: scaleX(0.88);
  transform-origin: center;
  transition: background-color 0.17s ease, opacity 0.17s ease, transform 0.17s ease;
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn):hover {
  color: var(--gsts-mkt-orange);
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn):hover::after {
  background-color: rgba(198, 122, 28, 0.32);
  opacity: 1;
  transform: scaleX(1);
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn):focus-visible {
  color: var(--gsts-mkt-orange-deep);
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn):focus-visible::after {
  background-color: rgba(198, 122, 28, 0.42);
  opacity: 1;
  transform: scaleX(1);
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn).active {
  color: var(--gsts-mkt-orange-deep);
  font-weight: 600;
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) .nav-link:not(.btn).active::after {
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(164, 95, 15, 0.2) 18%,
    rgba(164, 95, 15, 0.92) 50%,
    rgba(164, 95, 15, 0.2) 82%,
    transparent 100%
  );
  opacity: 1;
  transform: scaleX(1);
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav:not(.gsts-marketing-public-nav) > .nav-item > .nav-link:not(.btn) {
    padding-inline: 0.7rem;
  }
}

/* Order CTA — brochure layout + legacy header partial */
body.gsts-marketing-shell .gsts-marketing-topnav .btn-primary,
body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-cta.btn {
  color: #fff !important;
  background: var(--gsts-mkt-gradient-cta) !important;
  border-color: var(--gsts-mkt-orange-deep) !important;
  border-radius: 999px !important;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.01em;
  box-shadow:
    0 2px 8px rgba(184, 108, 28, 0.14),
    0 1px 2px rgba(20, 31, 51, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.24);
  min-height: 40px;
  padding-block: 0.42rem !important;
  padding-inline: 1.22rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  transition: background 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, transform 0.12s ease;
}

body.gsts-marketing-shell .gsts-marketing-topnav .btn-primary.btn-sm {
  min-height: 38px;
  padding-block: 0.38rem !important;
  padding-inline: 1.05rem !important;
  font-size: 0.875rem;
}

body.gsts-marketing-shell .gsts-marketing-topnav .btn-primary:hover,
body.gsts-marketing-shell .gsts-marketing-topnav .btn-primary:focus-visible,
body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-cta.btn:hover,
body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-cta.btn:focus-visible {
  color: #fff !important;
  background: var(--gsts-mkt-gradient-cta-hover) !important;
  border-color: #8d5610 !important;
  box-shadow:
    0 4px 14px rgba(184, 108, 28, 0.2),
    0 1px 2px rgba(20, 31, 51, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.26);
  transform: translateY(-0.5px);
}

/* ============================================================
   LOCALE SWITCHER — marketing topnav (shared: home, About, TI static pages)
   Same pill + dropdown for `igniter-orange::includes.gsts-public-lang-switcher`.
   Loaded from this file on every `layout: marketing` page (see marketing.blade.php).
   ============================================================ */
body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang .gsts-header-lang {
  position: relative;
  flex: 0 0 auto;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.15;
  min-height: 38px;
  padding: 5px 12px;
  border: 1px solid var(--gsts-mkt-border);
  border-radius: 999px;
  background: linear-gradient(180deg, #fffefb 0%, #faf7f4 100%);
  color: var(--gsts-mkt-navy);
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(20, 31, 51, 0.04), 0 3px 10px rgba(20, 31, 51, 0.05);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-summary:hover {
  border-color: rgba(198, 122, 28, 0.28);
  box-shadow: 0 2px 4px rgba(20, 31, 51, 0.05), 0 6px 14px rgba(20, 31, 51, 0.07);
  color: var(--gsts-mkt-orange-deep);
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-summary:focus-visible {
  outline: 2px solid var(--gsts-mkt-focus-ring);
  outline-offset: 2px;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-summary::-webkit-details-marker {
  display: none;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-menu {
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 8px);
  width: min(280px, 92vw);
  background: #fffefb;
  border: 1px solid rgba(20, 31, 51, 0.12);
  border-radius: 14px;
  box-shadow: 0 14px 36px rgba(20, 31, 51, 0.12);
  padding: 8px;
  z-index: 2000;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-btn {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 42px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: start;
  color: #141f33;
  font-weight: 500;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-btn:hover {
  background: rgba(198, 122, 28, 0.1);
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-btn.is-active {
  font-weight: 700;
  color: #8d5610;
  text-decoration: underline;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-code {
  font-weight: 700;
  min-width: 3ch;
}

body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-native {
  opacity: 0.8;
  font-size: 0.9em;
}

/* Marketing topnav layout (logo + collapse) — shared marketing shell */
body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-topnav-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  column-gap: 0.5rem;
  row-gap: 0.2rem;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-topnav-inner {
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
  }
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-brand {
  flex: 0 1 auto;
  align-items: center;
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-toggler {
  margin-inline-start: auto;
}

body.gsts-marketing-shell .gsts-marketing-topnav .navbar-collapse {
  flex-basis: 100%;
  flex-grow: 1;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-collapse {
    flex-basis: auto;
    flex-grow: 0;
  }
}

@media (max-width: 991.98px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-collapse {
    padding-top: 0.35rem;
    margin-top: 0.25rem;
    border-top: 1px solid rgba(20, 31, 51, 0.08);
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-nav .nav-link {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
  }
}

/* RTL: mirror summary icon/text; dropdown uses `inset-inline-end` above */
html[dir="rtl"] body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang .gsts-lang-summary {
  flex-direction: row-reverse;
}

/*
 * Mobile nav drawer: locale `<details>` menu was `position:absolute; right:0` inside a narrow
 * flex item + often clipped by `.navbar-collapse` overflow — felt detached from trigger.
 * Desktop (≥992px): unchanged — rules gated to max-width 991.98px only.
 */
@media (max-width: 991.98px) {
  body.gsts-marketing-shell .gsts-marketing-topnav .navbar-collapse.collapse.show {
    overflow: visible !important;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang {
    width: 100%;
    max-width: 100%;
    align-self: stretch;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang:has(.gsts-lang-details[open]) {
    position: relative;
    z-index: 2040;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang .gsts-header-lang {
    width: 100%;
    max-width: 100%;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang .gsts-lang-details {
    position: relative;
    width: 100%;
    max-width: 100%;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-marketing-nav-lang .gsts-lang-summary {
    width: 100%;
    justify-content: space-between;
    box-sizing: border-box;
  }

  body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-menu {
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    top: calc(100% + 6px);
    box-sizing: border-box;
  }

  /* Beat global RTL rule (`right: auto`) so the panel spans the drawer width on small screens. */
  html[dir="rtl"] body.gsts-marketing-shell .gsts-marketing-topnav .gsts-lang-menu {
    left: 0 !important;
    right: 0 !important;
  }
}

/* ============================================================
   HERO — homepage hero section
   ============================================================ */
body.gsts-marketing-shell .gsts-home-marketing-hero {
  background: var(--gsts-mkt-bg-page) !important;
}
body.gsts-marketing-shell .gsts-home-marketing-hero.border-bottom {
  border-bottom-color: var(--gsts-mkt-border) !important;
}

body.gsts-marketing-shell .gsts-home-marketing-hero h1 {
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--gsts-mkt-navy);
}
body.gsts-marketing-shell .gsts-home-marketing-hero .lead {
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--gsts-mkt-muted);
}

/* Hero CTA — primary orange gradient */
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-primary {
  color: #fff !important;
  background: var(--gsts-mkt-gradient-cta) !important;
  border-color: var(--gsts-mkt-orange-deep) !important;
  border-radius: var(--gsts-mkt-radius-sm) !important;
  font-weight: 700;
  box-shadow: 0 8px 22px rgba(184, 108, 28, 0.26);
  min-height: 52px;
  transition: background 0.16s, box-shadow 0.16s, transform 0.12s;
}
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-primary:hover,
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-primary:focus-visible {
  color: #fff !important;
  background: var(--gsts-mkt-gradient-cta-hover) !important;
  border-color: #8d5610 !important;
  box-shadow: 0 0 0 0.2rem var(--gsts-mkt-focus-ring), 0 8px 24px rgba(184, 108, 28, 0.22);
  transform: translateY(-1px);
}
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-primary:active {
  transform: translateY(0);
}

/* Hero CTA — secondary warm cream outline */
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-outline-secondary {
  color: var(--gsts-mkt-navy) !important;
  border-color: var(--gsts-mkt-border-orange) !important;
  background: linear-gradient(180deg, #fffbf7 0%, #f4ece4 100%) !important;
  border-radius: var(--gsts-mkt-radius-sm) !important;
  font-weight: 600;
  min-height: 52px;
}
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-outline-secondary:hover,
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-outline-secondary:focus-visible {
  color: var(--gsts-mkt-orange-deep) !important;
  background: linear-gradient(180deg, #fffefb 0%, #f7eadc 100%) !important;
  border-color: rgba(175, 95, 22, 0.50) !important;
}

/* Hero CTA — link tertiary */
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-link {
  color: var(--gsts-mkt-muted);
  font-weight: 500;
  text-decoration: none;
}
body.gsts-marketing-shell .gsts-home-marketing-hero .btn-link:hover {
  color: var(--gsts-mkt-orange-deep);
  text-decoration: underline;
}

/* Hero info card (right column) */
body.gsts-marketing-shell .gsts-hero-info-card {
  background: linear-gradient(165deg, var(--gsts-mkt-bg-card) 0%, var(--gsts-mkt-bg-muted) 100%);
  border: 1px solid var(--gsts-mkt-border);
  border-radius: var(--gsts-mkt-radius);
  box-shadow: var(--gsts-mkt-shadow-card);
  padding: 1.5rem 1.5rem 1.35rem;
}
body.gsts-marketing-shell .gsts-hero-info-card h2 {
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--gsts-mkt-orange);
  margin-bottom: 0.65rem;
}
body.gsts-marketing-shell .gsts-hero-info-card p,
body.gsts-marketing-shell .gsts-hero-info-card li {
  font-size: 0.9rem;
  color: var(--gsts-mkt-muted);
  line-height: 1.6;
}
body.gsts-marketing-shell .gsts-hero-info-card a {
  color: var(--gsts-mkt-orange-deep);
  font-weight: 600;
  text-decoration: none;
}
body.gsts-marketing-shell .gsts-hero-info-card a:hover {
  text-decoration: underline;
}

/* ============================================================
   ABOUT STRIP — homepage about section
   ============================================================ */
body.gsts-marketing-shell .gsts-home-marketing-about {
  background: var(--gsts-mkt-bg-card) !important;
}
body.gsts-marketing-shell .gsts-home-marketing-about.border-bottom {
  border-bottom-color: var(--gsts-mkt-border) !important;
}
body.gsts-marketing-shell .gsts-home-marketing-about h2 {
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--gsts-mkt-navy);
}
body.gsts-marketing-shell .gsts-home-marketing-about p {
  color: var(--gsts-mkt-muted);
  line-height: 1.7;
}

/* ============================================================
   STATIC MARKETING PAGES (.gsts-marketing-page)
   ============================================================ */
body.gsts-marketing-shell .gsts-marketing-page h1 {
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--gsts-mkt-navy);
}
body.gsts-marketing-shell .gsts-marketing-page h2,
body.gsts-marketing-shell .gsts-marketing-page .h2 {
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--gsts-mkt-navy-soft);
}
body.gsts-marketing-shell .gsts-marketing-page h2.h5,
body.gsts-marketing-shell .gsts-marketing-page .h5 {
  color: var(--gsts-mkt-navy);
}
body.gsts-marketing-shell .gsts-marketing-page .lead,
body.gsts-marketing-shell .gsts-marketing-page p.lead {
  color: var(--gsts-mkt-muted);
  line-height: 1.65;
}

/* CMS / legal HTML: plain <a> without utilities inherits theme primary — force brand gold. */
body.gsts-marketing-shell .gsts-marketing-page .container a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.list-group-item-action) {
  color: var(--gsts-mkt-orange-deep);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
body.gsts-marketing-shell .gsts-marketing-page .container a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.list-group-item-action):hover,
body.gsts-marketing-shell .gsts-marketing-page .container a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.list-group-item-action):focus-visible {
  color: #8d5610;
  text-decoration: underline;
  border-bottom-color: rgba(198, 122, 28, 0.45);
}

/* Warm-restyle Bootstrap alerts inside static pages */
body.gsts-marketing-shell .gsts-marketing-page .alert-warning {
  background: linear-gradient(165deg, #fffdf8 0%, var(--gsts-mkt-bg-muted) 100%);
  border: 1px solid var(--gsts-mkt-border-orange);
  border-radius: var(--gsts-mkt-radius-sm);
  color: var(--gsts-mkt-navy);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
body.gsts-marketing-shell .gsts-marketing-page .alert-secondary {
  background: linear-gradient(165deg, #fffdf8 0%, var(--gsts-mkt-bg-muted) 100%);
  border: 1px solid var(--gsts-mkt-border);
  border-radius: var(--gsts-mkt-radius-sm);
  color: var(--gsts-mkt-navy-soft);
}

/* Content inset panels (.bg-light.rounded-3.border) */
body.gsts-marketing-shell .gsts-marketing-page .bg-light.rounded-3 {
  background: linear-gradient(165deg, var(--gsts-mkt-bg-card) 0%, var(--gsts-mkt-bg-muted) 100%) !important;
  border-color: var(--gsts-mkt-border) !important;
  border-radius: var(--gsts-mkt-radius) !important;
  box-shadow: var(--gsts-mkt-shadow);
}

/* Contact form card */
body.gsts-marketing-shell .gsts-marketing-page .border.rounded-3.bg-white.shadow-sm {
  background: var(--gsts-mkt-bg-card) !important;
  border-color: var(--gsts-mkt-border) !important;
  border-radius: var(--gsts-mkt-radius) !important;
  box-shadow: var(--gsts-mkt-shadow-card) !important;
}

/* Static page CTAs — primary */
body.gsts-marketing-shell .gsts-marketing-page .btn-primary {
  color: #fff !important;
  background: var(--gsts-mkt-gradient-cta) !important;
  border-color: var(--gsts-mkt-orange-deep) !important;
  border-radius: var(--gsts-mkt-radius-sm) !important;
  font-weight: 700;
  box-shadow: 0 6px 18px rgba(184, 108, 28, 0.22);
}
body.gsts-marketing-shell .gsts-marketing-page .btn-primary:hover,
body.gsts-marketing-shell .gsts-marketing-page .btn-primary:focus-visible {
  color: #fff !important;
  background: var(--gsts-mkt-gradient-cta-hover) !important;
  border-color: #8d5610 !important;
}

/* Static page CTAs — secondary outline */
body.gsts-marketing-shell .gsts-marketing-page .btn-outline-secondary {
  color: var(--gsts-mkt-navy) !important;
  border-color: var(--gsts-mkt-border-orange) !important;
  background: var(--gsts-mkt-bg-card) !important;
  border-radius: var(--gsts-mkt-radius-sm) !important;
  font-weight: 600;
}
body.gsts-marketing-shell .gsts-marketing-page .btn-outline-secondary:hover,
body.gsts-marketing-shell .gsts-marketing-page .btn-outline-secondary:focus-visible {
  color: var(--gsts-mkt-orange-deep) !important;
  background: var(--gsts-mkt-bg-muted) !important;
  border-color: rgba(175, 95, 22, 0.45) !important;
}

/* ============================================================
   FOOTER — marketing footer (readability + Robexa palette hierarchy)
   Applies to every page using marketing layout + this footer (not homepage-only).
   ============================================================ */
body.gsts-marketing-shell .gsts-marketing-footer {
  /* Scoped tokens — body stays dark; headings use brand gold only */
  --gf-heading: var(--gsts-mkt-orange);
  --gf-body: #1e2633;
  --gf-body-soft: #2e3748;
  --gf-label: #3d4658;
  --gf-link: #182132;
  /* Deeper brown-gold hover reads less “neon orange” than --gsts-mkt-orange-deep on legal strip links */
  --gf-link-hover: #8d5610;
  --gf-meta: #4d5668;

  background: linear-gradient(180deg, #fffefb 0%, var(--gsts-mkt-bg-muted) 52%, #efe6dc 100%);
  border-top: 1px solid rgba(20, 31, 51, 0.09);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94);
  color: var(--gf-body-soft);
}

body.gsts-marketing-shell .gsts-marketing-footer__wrap {
  position: relative;
  padding-inline: 0.75rem;
  padding-block-end: clamp(1.45rem, 2.6vw, 1.95rem);
  padding-block-start: clamp(1.75rem, 3vw, 2.35rem);
}

body.gsts-marketing-shell .gsts-marketing-footer__inner {
  max-width: 1140px;
  margin-inline: auto;
}

/* Bootstrap row inside footer: calmer gutters for 3-column balance */
body.gsts-marketing-shell .gsts-marketing-footer__inner > .row {
  --bs-gutter-x: 1.85rem;
  --bs-gutter-y: 1.65rem;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-footer__inner > .row {
    --bs-gutter-x: 2.15rem;
    --bs-gutter-y: 1.5rem;
  }

  /* Typical 3rd column (hours + legal): a touch more air before legal, slightly calmer body tone */
  body.gsts-marketing-shell .gsts-marketing-footer__inner > .row > [class*="col-"]:last-child .gsts-marketing-footer__hours {
    margin-block-end: 0.48rem;
    color: rgba(30, 38, 51, 0.9);
  }

  body.gsts-marketing-shell .gsts-marketing-footer__inner > .row > [class*="col-"]:last-child .gsts-legal-nav {
    margin-block-start: 0.42rem;
    padding-block-start: 0.28rem;
  }
}

body.gsts-marketing-shell .gsts-marketing-footer__heading {
  font-size: 0.7rem;
  letter-spacing: 0.115em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gf-heading);
  margin-block-end: 0.72rem;
  line-height: 1.35;
  text-shadow: 0 1px 0 rgba(255, 251, 247, 0.95);
  opacity: 0.97;
}

body.gsts-marketing-shell .gsts-marketing-footer__lead,
body.gsts-marketing-shell .gsts-marketing-footer__hours {
  color: var(--gf-body);
  font-size: 0.95rem;
  line-height: 1.66;
  letter-spacing: 0.006em;
  max-width: 28rem;
  font-weight: 400;
}

body.gsts-marketing-shell .gsts-marketing-footer__list {
  color: var(--gf-body-soft);
  font-size: 0.91rem;
  line-height: 1.62;
  letter-spacing: 0.004em;
}

body.gsts-marketing-shell .gsts-marketing-footer__list li + li {
  margin-block-start: 0.44rem;
}

body.gsts-marketing-shell .gsts-marketing-footer__label {
  display: block;
  font-size: 0.65rem;
  letter-spacing: 0.095em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gf-label);
  margin-block-end: 0.32rem;
  line-height: 1.4;
}

body.gsts-marketing-shell .gsts-marketing-footer__address {
  color: var(--gf-body-soft);
  font-size: 0.91rem;
  line-height: 1.62;
  margin-block-start: 0.28rem;
  letter-spacing: 0.003em;
}

body.gsts-marketing-shell .gsts-marketing-footer__muted {
  color: var(--gf-meta);
  font-size: 0.9rem;
  line-height: 1.6;
}

/* Links: dark navy default, brand gold hover/focus */
body.gsts-marketing-shell .gsts-marketing-footer a {
  color: var(--gf-link);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.14s ease, border-color 0.14s ease;
}

body.gsts-marketing-shell .gsts-marketing-footer a:hover {
  color: var(--gf-link-hover);
  border-bottom-color: rgba(198, 122, 28, 0.48);
}

body.gsts-marketing-shell .gsts-marketing-footer a:focus-visible {
  outline: 2px solid var(--gsts-mkt-focus-ring);
  outline-offset: 2px;
  border-radius: 2px;
  color: var(--gf-link-hover);
}

body.gsts-marketing-shell .gsts-marketing-footer .gsts-legal-nav {
  padding-block: 0.35rem 0.28rem;
  margin-block-start: 0.35rem;
}

body.gsts-marketing-shell .gsts-marketing-footer .gsts-legal-nav ul.list-inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 0.3rem 0.92rem;
  margin-block: 0;
  margin-inline: 0;
  padding-inline: 0;
  list-style: none;
}

body.gsts-marketing-shell .gsts-marketing-footer .gsts-legal-nav .list-inline-item {
  margin-inline-end: 0;
}

body.gsts-marketing-shell .gsts-marketing-footer .gsts-legal-nav a {
  font-weight: 500;
  font-size: 0.835rem;
  letter-spacing: 0.012em;
  color: rgba(24, 33, 50, 0.76);
  padding-block: 0.1rem;
  padding-inline: 0.06rem;
}

body.gsts-marketing-shell .gsts-marketing-footer .gsts-legal-nav a:hover,
body.gsts-marketing-shell .gsts-marketing-footer .gsts-legal-nav a:focus-visible {
  color: var(--gf-link-hover);
}

body.gsts-marketing-shell .gsts-marketing-footer .text-muted {
  color: var(--gf-meta) !important;
}

body.gsts-marketing-shell .gsts-marketing-footer__divider {
  height: 1px;
  margin-block: 1.45rem 1.05rem;
  margin-inline: 0;
  background: linear-gradient(90deg, transparent, rgba(20, 31, 51, 0.09), transparent);
}

body.gsts-marketing-shell .gsts-marketing-footer__bar {
  color: var(--gf-meta);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.28rem;
  text-align: center;
  margin-block-start: 0.08rem;
}

body.gsts-marketing-shell .gsts-marketing-footer__copyright,
body.gsts-marketing-shell .gsts-marketing-footer__legal {
  color: var(--gf-meta);
  line-height: 1.58;
  padding-block-start: 0;
  margin-block-start: 0.05rem;
  font-size: 0.865rem;
  letter-spacing: 0.01em;
}

body.gsts-marketing-shell .gsts-marketing-footer__copyright a,
body.gsts-marketing-shell .gsts-marketing-footer__legal a {
  color: var(--gf-link);
  font-weight: 600;
}

body.gsts-marketing-shell .gsts-marketing-footer__copyright a:hover,
body.gsts-marketing-shell .gsts-marketing-footer__legal a:hover {
  color: var(--gf-link-hover);
}

/* ============================================================
   HOMEPAGE — food category strip (home.blade.php wrapper only)
   Does not affect menus, cart, or other marketing pages.
   ============================================================ */
body.gsts-marketing-shell .gsts-home-category-strip {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-fade-wrapper {
  position: relative;
  isolation: isolate;
  border-radius: 999px;
  /* Without clipping, the inner scroll row reads as a rectangle past the pill radius */
  overflow: hidden;
  margin-top: 0.5rem;
  margin-bottom: 0.35rem;
  --menu-cat-bg: var(--gsts-mkt-bg-muted);
}

/* Match component inline fades (56px vs 40px) so left/right edge treatment is symmetric */
body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-fade-wrapper::before,
body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-fade-wrapper::after {
  width: 48px;
}

body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-wrapper .layout-scrollable {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  display: flex;
  /* flex-start: at scrollLeft 0 the first category chip stays in view. Centering
     max-content UL in a narrow scroller pushes the row off the start edge. */
  justify-content: flex-start;
  padding-left: 42px;
  padding-right: 42px;
}

body.gsts-marketing-shell .gsts-home-category-strip #navbar-categories.w-100 {
  width: max-content !important;
  max-width: none;
  margin-left: 0 !important;
  margin-right: 0 !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap;
}

body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-arrow {
  background: var(--gsts-mkt-bg-elevated) !important;
  border: 1px solid var(--gsts-mkt-border) !important;
  color: var(--gsts-mkt-orange-deep) !important;
  box-shadow: 0 2px 8px rgba(20, 31, 51, 0.08) !important;
}

body.gsts-marketing-shell .gsts-home-category-strip .menu-cat-chevron {
  background: var(--gsts-mkt-bg-elevated) !important;
  border: 1px solid var(--gsts-mkt-border);
  box-shadow: 0 2px 10px rgba(20, 31, 51, 0.08);
}

/* ============================================================
   CONTACT / KONTAKT — two-column shell (kontakt.blade.php)
   Editorial left column + existing form card; scoped to .gsts-page-kontakt.
   ============================================================ */
body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt > .gsts-contact-row {
  --bs-gutter-x: clamp(1.35rem, 3.6vw, 2.65rem);
  --bs-gutter-y: 1.35rem;
  align-items: flex-start;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt > .gsts-contact-row {
    --bs-gutter-x: clamp(1.85rem, 4vw, 3.1rem);
  }
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-intro {
  max-width: 32rem;
}

@media (min-width: 992px) {
  body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-intro {
    padding-block-start: 0.25rem;
    border-inline-start: 3px solid rgba(198, 122, 28, 0.26);
    padding-inline-start: clamp(1.1rem, 2vw, 1.45rem);
    margin-inline-start: 0.12rem;
  }
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-title {
  font-size: clamp(1.62rem, 2.1vw, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.032em;
  line-height: 1.12;
  color: var(--gsts-mkt-navy);
  margin-block-end: 0.55rem;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-lead.lead {
  font-size: clamp(1.01rem, 1.05vw, 1.14rem);
  line-height: 1.68;
  color: var(--gsts-mkt-muted);
  margin-block-end: clamp(1.15rem, 2vw, 1.55rem);
  max-width: 36rem;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-details {
  margin-block: 0;
  padding-block: clamp(1rem, 1.8vw, 1.2rem);
  padding-inline: clamp(1rem, 2vw, 1.2rem);
  border-radius: var(--gsts-mkt-radius);
  background: linear-gradient(165deg, var(--gsts-mkt-bg-card) 0%, var(--gsts-mkt-bg-muted) 100%);
  border: 1px solid var(--gsts-mkt-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-details__item {
  margin-block-end: 0.9rem;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-details__item:last-child {
  margin-block-end: 0;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-details__label {
  font-size: 0.68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: 0.085em;
  color: var(--gsts-mkt-orange) !important;
  margin-block-end: 0.2rem;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-details a {
  font-size: 0.97rem;
  font-weight: 600;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-details__value {
  display: block;
  font-size: 0.94rem;
  line-height: 1.62;
  color: var(--gsts-mkt-navy-soft);
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal {
  margin-block-start: clamp(1.35rem, 2.4vw, 1.75rem);
  padding-block-start: clamp(1.05rem, 2vw, 1.35rem);
  border-block-start: 1px solid rgba(20, 31, 51, 0.09);
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav {
  padding-block: 0;
  margin-block: 0;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav ul.list-inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: baseline;
  gap: 0.2rem 0.55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav .list-inline-item {
  margin-inline-end: 0;
}

/* Calmer than default marketing-page inline links (gold); align with footer legal tone */
body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav a {
  font-weight: 500;
  font-size: 0.82rem;
  letter-spacing: 0.012em;
  color: rgba(24, 33, 50, 0.74);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav a:hover {
  color: #8d5610;
  border-bottom-color: rgba(198, 122, 28, 0.42);
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav a:focus-visible {
  color: #8d5610;
  border-bottom-color: rgba(198, 122, 28, 0.42);
  outline: 2px solid var(--gsts-mkt-focus-ring, rgba(198, 122, 28, 0.55));
  outline-offset: 2px;
  border-radius: 2px;
}

body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-legal .gsts-legal-nav .text-muted {
  color: rgba(20, 31, 51, 0.32) !important;
  font-weight: 400;
}

/* Light shell sync with left rhythm (form / Livewire markup unchanged) */
body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-form-card {
  padding: clamp(1.25rem, 2vw, 1.6rem) !important;
}

@media (max-width: 991.98px) {
  body.gsts-marketing-shell .gsts-marketing-page.gsts-page-kontakt .gsts-contact-intro {
    border-inline-start: none;
    padding-inline-start: 0;
    margin-inline-start: 0;
    max-width: none;
  }
}