/* ═══════════════════════════════════════════════════════════════
   BRASAS — Section layouts
   ═══════════════════════════════════════════════════════════════ */

/* ───────────────────────── HERO ───────────────────────── */
.hero {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: var(--sp-10) var(--container-pad) var(--sp-8);
  overflow: hidden;
  isolation: isolate;
}

/* Animated fire-glow fallback (works without video) */
.hero__fire-bg {
  position: absolute;
  inset: 0;
  z-index: -3;
  background:
    radial-gradient(ellipse 80% 60% at 50% 90%, rgba(231, 76, 60, 0.55), transparent 60%),
    radial-gradient(ellipse 60% 50% at 30% 70%, rgba(255, 107, 0, 0.4), transparent 65%),
    radial-gradient(ellipse 70% 55% at 75% 75%, rgba(192, 57, 43, 0.4), transparent 60%),
    linear-gradient(180deg, #0d0b0a 0%, #1a1110 45%, #2a1411 100%);
  animation: fireBreath 7s ease-in-out infinite alternate;
}
@keyframes fireBreath {
  0%   { transform: scale(1.0) translateY(0); opacity: 1; }
  50%  { transform: scale(1.05) translateY(-1%); opacity: 0.92; }
  100% { transform: scale(1.0) translateY(1%); opacity: 1; }
}

.hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  filter: saturate(1.15) contrast(1.1) brightness(0.8);
}

.hero__overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(28,25,23,0.55) 0%, rgba(28,25,23,0.3) 45%, rgba(28,25,23,0.9) 100%),
    radial-gradient(ellipse at center, rgba(28,25,23,0) 40%, rgba(28,25,23,0.55) 100%);
}

.hero__content {
  text-align: center;
  max-width: 1100px;
  display: grid;
  gap: var(--sp-5);
  justify-items: center;
}

.hero__eyebrow {
  opacity: 0;
  animation: fadeUp 900ms var(--ease-out) 200ms forwards;
}

.hero__wordmark {
  font-family: var(--ff-display);
  font-size: var(--fs-mega);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.02em;
  margin: 0;
  overflow: hidden;
}

.hero__wordmark-fill {
  display: inline-block;
  background-image:
    radial-gradient(ellipse 70% 80% at 50% 110%, #FFB547 0%, #FF6B00 20%, #E74C3C 45%, #C0392B 70%, #5a1f17 100%);
  background-size: 100% 160%;
  background-position: 0 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: flameShift 6s ease-in-out infinite alternate, wordmarkIn 1100ms var(--ease-out) 150ms both;
  text-shadow: 0 0 60px rgba(231, 76, 60, 0.15);
}
@keyframes flameShift {
  0%   { background-position: 0% 100%; }
  100% { background-position: 0% 40%; }
}
@keyframes wordmarkIn {
  from { clip-path: inset(0 0 100% 0); opacity: 0; }
  to   { clip-path: inset(0 0 0% 0);   opacity: 1; }
}

.hero__tagline {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 400;
  font-size: var(--fs-xl);
  color: var(--warm-white);
  max-width: 620px;
  opacity: 0;
  animation: fadeUp 900ms var(--ease-out) 600ms forwards;
}

.hero__cta {
  opacity: 0;
  transform: scale(0.96);
  animation: popIn 700ms var(--ease-out) 900ms forwards;
  margin-top: var(--sp-3);
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
  from { opacity: 0; transform: scale(0.96); }
  to   { opacity: 1; transform: scale(1); }
}

.hero__scroll-cue {
  position: absolute;
  bottom: var(--sp-6);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-3);
  color: var(--warm-mid);
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}
.hero__scroll-line {
  width: 1px;
  height: 56px;
  background: linear-gradient(180deg, transparent, var(--gold));
  position: relative;
  overflow: hidden;
}
.hero__scroll-line::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 30%;
  background: var(--gold);
  animation: scrollDrip 2.4s ease-in-out infinite;
}
@keyframes scrollDrip {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(400%); }
}

@media (max-width: 620px) {
  .hero { padding-block: var(--sp-9) var(--sp-7); }
  .hero__tagline { font-size: 16px; }
}

/* ───────────────────────── TRADITION PIN ───────────────────────── */
/* Height is driven by ScrollTrigger.pin() — no artificial sticky padding. */
.tradition-pin {
  position: relative;
  background: var(--charcoal-900);
}

.tradition-pin__stage {
  position: relative;
  height: 100vh;
  height: 100dvh;
  display: grid;
  place-items: center;
  text-align: center;
  padding: var(--sp-5);
  overflow: hidden;
}
.tradition-pin__stage::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 45% at 50% 70%, rgba(192, 57, 43, 0.18), transparent 65%),
    radial-gradient(ellipse 40% 30% at 50% 30%, rgba(183, 134, 11, 0.1), transparent 60%);
  pointer-events: none;
}

.tradition-pin__eyebrow {
  position: absolute;
  top: var(--sp-9);
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  color: var(--warm-mid);
}

.tradition-pin__words {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(2px, 0.5vw, 12px);
  width: 100%;
}
.tradition-pin__word {
  font-family: var(--ff-display);
  font-weight: 500;
  font-style: italic;
  font-size: clamp(56px, 11vw, 172px);
  line-height: 1;
  letter-spacing: -0.02em;
  background-image:
    radial-gradient(ellipse at 50% 110%, #FFB547 0%, #FF6B00 25%, #E74C3C 55%, #8B2616 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  opacity: 0;
  transform: translateY(40px) scale(0.92);
  will-change: opacity, transform;
  text-align: center;
}
/* First word visible by default (so layout is correct before JS runs) */
.tradition-pin__word[data-word="1"] { opacity: 1; transform: none; }
/* Word 2 slight indent, word 3 longer — subtle editorial rhythm */
.tradition-pin__word[data-word="2"] { font-size: clamp(50px, 9.5vw, 148px); }
.tradition-pin__word[data-word="3"] { font-size: clamp(60px, 12vw, 184px); }

.tradition-pin__sub {
  position: absolute;
  bottom: var(--sp-9);
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  font-size: var(--fs-xs);
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--warm-mid);
}

/* Reduced motion: static triptych (class-gated, not @media-reduce) */
.reduced-motion .tradition-pin { padding: var(--sp-9) 0; }
.reduced-motion .tradition-pin__stage { height: auto; gap: var(--sp-5); }
.reduced-motion .tradition-pin__word { opacity: 1; transform: none; }

/* ───────────────────────── MARQUEE STRIP ───────────────────────── */
.marquee {
  background: var(--charcoal-900);
  overflow: hidden;
  position: relative;
  padding: var(--sp-6) 0;
  border-top: 1px solid var(--gold-soft);
  border-bottom: 1px solid var(--gold-soft);
}
.marquee::before,
.marquee::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 18%;
  z-index: 2;
  pointer-events: none;
}
.marquee::before {
  left: 0;
  background: linear-gradient(90deg, var(--charcoal-900) 0%, transparent 100%);
}
.marquee::after {
  right: 0;
  background: linear-gradient(-90deg, var(--charcoal-900) 0%, transparent 100%);
}
.marquee__track {
  display: flex;
  align-items: center;
  gap: var(--sp-6);
  white-space: nowrap;
  will-change: transform;
}
.marquee__item {
  flex: 0 0 auto;
  font-family: var(--ff-display);
  font-style: italic;
  font-size: clamp(32px, 5vw, 64px);
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--warm-white);
  opacity: 0.85;
}
.marquee__item em {
  font-style: normal;
  color: var(--gold);
  margin: 0 0.1em;
  font-size: 0.7em;
  position: relative;
  top: -0.1em;
  opacity: 0.7;
}

/* ───────────────────────── ABOUT ───────────────────────── */
.about {
  background: var(--charcoal-900);
  padding: var(--sp-10) 0;
}
.about__grid {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: var(--sp-9);
  align-items: center;
}
.about__copy p {
  color: var(--warm-mid);
  font-size: var(--fs-lg);
  line-height: 1.75;
  max-width: 58ch;
}
.about__copy .h-display {
  font-style: italic;
  color: var(--warm-white);
  margin-bottom: var(--sp-6);
}
.about__pitmaster-intro { color: var(--warm-white) !important; padding-top: var(--sp-2); }
.about__pitmaster-intro strong { font-family: var(--ff-display); font-weight: 500; font-size: 1.05em; }

.about__portrait { position: relative; }
.about__portrait-frame {
  position: relative;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: var(--radius);
  outline: 1px solid var(--gold);
  outline-offset: -14px;
}
.about__portrait-frame img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.85) contrast(1.1) brightness(0.85);
}
.about__caption {
  margin: var(--sp-4) 0 0;
  font-size: var(--fs-xs);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--warm-mid);
  text-align: center;
}

@media (max-width: 900px) {
  .about__grid { grid-template-columns: 1fr; gap: var(--sp-7); }
  .about__portrait { max-width: 420px; margin-inline: auto; }
}

/* ───────────────────────── MENU HORIZONTAL ───────────────────────── */
.menu {
  background: var(--charcoal-800);
  overflow: hidden;
  position: relative;
}
.menu__rail {
  position: absolute;
  left: var(--sp-4);
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: left center;
  z-index: 3;
  pointer-events: none;
}
.menu__rail-label {
  display: inline-block;
  white-space: nowrap;
  font-size: var(--fs-xs);
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--warm-mid);
}

.menu__pin {
  position: relative;
  height: 100vh;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--sp-8) 0 var(--sp-6);
}

.menu__header {
  max-width: var(--container);
  width: 100%;
  margin: 0 auto var(--sp-6);
  padding: 0 var(--container-pad);
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--sp-5);
  align-items: end;
}
.menu__header .eyebrow { margin-bottom: 0; }
.menu__active-name {
  grid-column: 2;
  justify-self: start;
  margin: 0;
  font-style: italic;
  font-size: var(--fs-h2);
  color: var(--warm-white);
  transition: opacity var(--dur) var(--ease);
  min-height: 1em;
}
.menu__counter {
  margin: 0;
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  letter-spacing: 0.3em;
  color: var(--gold);
  font-variant-numeric: tabular-nums;
}

.menu__track {
  display: flex;
  gap: var(--sp-5);
  padding: var(--sp-3) var(--container-pad);
  will-change: transform;
  perspective: 1400px;
}

.menu__progress {
  max-width: var(--container);
  margin: var(--sp-6) auto 0;
  padding: 0 var(--container-pad);
  height: 1px;
  width: calc(100% - 2 * var(--container-pad));
  background: rgba(183, 134, 11, 0.15);
  position: relative;
}
.menu__progress-fill {
  position: absolute;
  inset: 0;
  width: 0%;
  background: var(--gold);
  transform-origin: left;
}

.menu__swipe-hint {
  display: none;
  margin: var(--sp-4) var(--container-pad) 0;
  font-size: var(--fs-xs);
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gold);
}

/* Mobile: abandon pin, use native horizontal scroll */
@media (max-width: 820px) {
  .menu__rail { display: none; }
  .menu__pin {
    height: auto;
    padding: var(--sp-9) 0 var(--sp-8);
  }
  .menu__active-name { display: none; }
  .menu__header { grid-template-columns: 1fr auto; }
  .menu__track {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: var(--sp-5);
  }
  .menu__track::-webkit-scrollbar { display: none; }
  .cut-card {
    scroll-snap-align: center;
    opacity: 1;
    width: 78vw;
    max-width: 360px;
    min-height: 460px;
  }
  .menu__progress { display: none; }
  .menu__swipe-hint { display: block; }
}

/* ───────────────────────── TESTIMONIALS (conveyor belt) ───────────────────────── */
.testimonials {
  background: var(--charcoal-900);
  padding: var(--sp-10) 0 var(--sp-9);
  position: relative;
  overflow: hidden;
}
.testimonials__head {
  max-width: var(--container);
  margin: 0 auto var(--sp-7);
  padding: 0 var(--container-pad);
  text-align: center;
}
.testimonials__head .h-display {
  font-style: italic;
  margin: var(--sp-2) 0 0;
}

/* Viewport masks the track; edges fade for a polished hand-off. */
.testimonials__viewport {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.testimonials__viewport::before,
.testimonials__viewport::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 12%;
  z-index: 2;
  pointer-events: none;
}
.testimonials__viewport::before {
  left: 0;
  background: linear-gradient(90deg, var(--charcoal-900) 0%, transparent 100%);
}
.testimonials__viewport::after {
  right: 0;
  background: linear-gradient(-90deg, var(--charcoal-900) 0%, transparent 100%);
}

.testimonials__track {
  display: flex;
  gap: var(--sp-5);
  padding: var(--sp-3) var(--container-pad);
  will-change: transform;
  /* transition is set by JS to: transform 0.8s cubic-bezier(.25,.1,.25,1) */
}

.testimonial {
  flex: 0 0 auto;
  width: clamp(280px, 32vw, 420px);
  margin: 0;
  padding: var(--sp-6) var(--sp-5) var(--sp-5);
  background: rgba(44, 44, 42, 0.35);
  border: 1px solid var(--gold-soft);
  border-radius: var(--radius-lg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--sp-5);
  position: relative;
}
.testimonial::before {
  content: "\201C";
  position: absolute;
  top: -12px;
  left: var(--sp-5);
  font-family: var(--ff-display);
  font-style: italic;
  font-size: 90px;
  line-height: 1;
  color: var(--gold);
  opacity: 0.55;
}

.testimonial__quote {
  margin: 0;
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 400;
  font-size: var(--fs-lg);
  line-height: 1.45;
  color: var(--warm-white);
}

.testimonial__cite {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: var(--sp-4);
  border-top: 1px solid rgba(183, 134, 11, 0.22);
  font-style: normal;
}
.testimonial__name {
  font-family: var(--ff-display);
  font-size: var(--fs-md);
  color: var(--gold);
  letter-spacing: 0.02em;
}
.testimonial__meta {
  font-size: var(--fs-xs);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--warm-mid);
}

@media (max-width: 620px) {
  .testimonial { width: 78vw; padding: var(--sp-5); }
  .testimonial__quote { font-size: var(--fs-md); }
}

/* ───────────────────────── RESERVE ───────────────────────── */
.reserve {
  background: var(--charcoal-900);
  padding: var(--sp-10) 0;
  position: relative;
  overflow: hidden;
}
.reserve__glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 60% 50% at 85% 20%, rgba(192, 57, 43, 0.13), transparent 60%),
              radial-gradient(ellipse 40% 35% at 10% 90%, rgba(183, 134, 11, 0.07), transparent 65%);
}
.reserve__grid {
  position: relative;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: var(--sp-9);
  align-items: start;
}
.reserve__copy .h-display {
  font-style: italic;
  margin-bottom: var(--sp-5);
}
.reserve__lede {
  color: var(--warm-mid);
  font-size: var(--fs-lg);
  line-height: 1.7;
  max-width: 44ch;
}
.reserve__contact {
  margin-top: var(--sp-7);
  padding-top: var(--sp-6);
  border-top: 1px solid var(--gold-soft);
}
.reserve__phone {
  display: block;
  font-family: var(--ff-display);
  font-size: var(--fs-h3);
  color: var(--gold);
  letter-spacing: 0.02em;
  margin-bottom: var(--sp-2);
  transition: color var(--dur) var(--ease);
}
.reserve__phone:hover { color: var(--gold-light); }
.reserve__hours-note {
  font-size: var(--fs-xs);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--warm-mid);
  margin: 0;
}

.reserve__form {
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
  padding: var(--sp-7);
  background: rgba(44, 44, 42, 0.35);
  border: 1px solid var(--gold-soft);
  border-radius: var(--radius-lg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.reserve__submit {
  margin-top: var(--sp-2);
  position: relative;
}
.reserve__submit[disabled] { opacity: 0.7; cursor: wait; }
.reserve__spinner {
  display: none;
  width: 14px; height: 14px;
  border: 2px solid rgba(28, 25, 23, 0.3);
  border-top-color: var(--charcoal-900);
  border-radius: 50%;
  animation: spin 700ms linear infinite;
}
.reserve__submit.is-loading .reserve__spinner { display: inline-block; }
.reserve__submit.is-loading .reserve__submit-label { opacity: 0.7; }
@keyframes spin { to { transform: rotate(360deg); } }

.reserve__success,
.reserve__error {
  margin: 0;
  padding: var(--sp-4);
  font-size: var(--fs-sm);
  letter-spacing: 0.04em;
  text-align: center;
  border-radius: var(--radius);
}
.reserve__success {
  background: rgba(183, 134, 11, 0.12);
  color: var(--gold-light);
  border: 1px solid var(--gold-soft);
  font-family: var(--ff-display);
  font-style: italic;
  font-size: var(--fs-lg);
}
.reserve__error {
  background: rgba(231, 76, 60, 0.12);
  color: var(--fire-bright);
  border: 1px solid rgba(231, 76, 60, 0.3);
}

@media (max-width: 900px) {
  .reserve__grid { grid-template-columns: 1fr; gap: var(--sp-7); }
  .reserve__form { padding: var(--sp-5); }
}

/* ───────────────────────── VISIT ───────────────────────── */
.visit {
  background: var(--charcoal-800);
  padding: var(--sp-10) 0;
}
.visit__grid {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: grid;
  grid-template-columns: 1fr 1fr 1.2fr;
  gap: var(--sp-8);
  align-items: start;
}
.visit__col { display: flex; flex-direction: column; gap: var(--sp-5); }
.visit__col--map { gap: var(--sp-3); }

.visit__addr {
  font-size: var(--fs-h3);
  font-style: normal;
  line-height: 1.2;
  letter-spacing: -0.005em;
  margin-bottom: var(--sp-3);
}
.visit__phone {
  font-family: var(--ff-display);
  font-size: 28px;
  color: var(--gold);
  margin-top: var(--sp-4);
  transition: color var(--dur) var(--ease);
}
.visit__phone:hover { color: var(--gold-light); }

.hours {
  margin: 0;
  padding: 0;
}
.hours__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: var(--sp-3) 0;
  border-bottom: 1px solid rgba(168, 162, 158, 0.12);
  transition: color var(--dur) var(--ease);
  position: relative;
}
.hours__row dt {
  font-family: var(--ff-display);
  font-size: var(--fs-lg);
  color: var(--warm-white);
  margin: 0;
}
.hours__row dd {
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  color: var(--warm-mid);
  letter-spacing: 0.05em;
  margin: 0;
}
.hours__row.is-today dt { color: var(--gold); }
.hours__row.is-today dd { color: var(--gold-light); }
.hours__row.is-today::before {
  content: "";
  position: absolute;
  left: -12px;
  top: 50%;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
  transform: translateY(-50%);
  box-shadow: 0 0 0 rgba(183, 134, 11, 0.6);
  animation: pulse 1.8s ease-in-out infinite;
}
@keyframes pulse {
  0%   { box-shadow: 0 0 0 0 rgba(183, 134, 11, 0.6); }
  100% { box-shadow: 0 0 0 10px rgba(183, 134, 11, 0); }
}

.visit__map {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--radius);
  border: 1px solid var(--gold-soft);
}
.visit__map iframe {
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(0.45) contrast(0.95) brightness(0.88);
}

@media (max-width: 960px) {
  .visit__grid { grid-template-columns: 1fr 1fr; }
  .visit__col--map { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .visit__grid { grid-template-columns: 1fr; gap: var(--sp-7); }
}

/* ───────────────────────── FOOTER ───────────────────────── */
.footer {
  background: var(--charcoal-900);
  border-top: 1px solid var(--gold-soft);
  padding: var(--sp-8) 0 var(--sp-6);
}
.footer__inner {
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: var(--sp-7);
  align-items: start;
  padding-bottom: var(--sp-6);
  border-bottom: 1px solid rgba(168, 162, 158, 0.1);
  margin-bottom: var(--sp-5);
}
.footer__wordmark {
  display: block;
  font-family: var(--ff-display);
  font-size: 40px;
  letter-spacing: 0.04em;
  color: var(--warm-white);
}
.footer__tagline {
  margin: var(--sp-2) 0 0;
  font-style: italic;
  font-family: var(--ff-display);
  color: var(--warm-mid);
}
.footer__cols {
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}
.footer__nav,
.footer__social {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-5);
}
.footer__nav a,
.footer__social a {
  font-size: var(--fs-xs);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--warm-mid);
}
.footer__nav a:hover,
.footer__social a:hover { color: var(--gold); }

.footer__fine {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--container-pad);
  font-size: var(--fs-xs);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--warm-dim);
  text-align: center;
}

@media (max-width: 620px) {
  .footer__inner { grid-template-columns: 1fr; gap: var(--sp-5); }
}