@font-face {
  font-family: "Montserrat";
  font-weight: 800;
  font-style: normal;
  font-display: swap;
  src: url("/assets/fonts/montserrat-800.woff2") format("woff2");
}

:root {
  --red: #d61043;
  --dark: #323232;
  --grey: #606060;
  --blue: #0d5ebb;
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --impact: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  /* Wix used the licensed "Lulo Clean" for buttons/labels; Montserrat ExtraBold is the closest free match. */
  --lulo: "Montserrat", "Arial Black", sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #fff;
  color: #000;
  font: 300 14px/18px var(--sans);
  letter-spacing: 0.016em; /* Wix's Helvetica Light runs ~4% wider than Helvetica Neue Light */
  overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6, p, ul, ol { margin: 0; font-weight: 400; }
h1, h2, h3, h4, h5, h6 { letter-spacing: 0; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }

/* ---------- nav ---------- */
.nav { background: #000; height: 41px; }
.nav ul {
  list-style: none; margin: 0 auto; padding: 9px 0 0 1px;
  width: 1021px; max-width: 100%; display: flex;
}
.nav li { flex: 0 0 170px; }
.nav a {
  display: block; height: 23px; line-height: 23px; text-align: center;
  color: #fff; text-decoration: none; font-size: 14px;
}
.nav a[aria-current] { background: var(--red); }

/* ---------- header band ---------- */
.top { background: rgba(212, 212, 212, 0.16); height: 402px; }
.wrap { position: relative; width: 980px; max-width: 100%; margin: 0 auto; }
.top .wrap { height: 402px; }
.logo { position: absolute; top: 32px; left: 50%; margin-left: -333px; width: 667px; height: 132px; }
.logo img { width: 667px; height: 132px; }
.hours {
  position: absolute; top: 195px; left: 0; right: 0; text-align: center;
  font: 400 48px/58.7px var(--impact); color: var(--red);
}
.btn {
  display: block; height: 40px; line-height: 40px; text-align: center; text-decoration: none; color: #fff;
  font: 800 12px/40px var(--lulo); letter-spacing: 0.255em; text-transform: uppercase; padding-left: 0.255em;
}
.btn-l, .btn-r { position: absolute; top: 264px; width: 142px; }
.btn-l { left: 0; }
.btn-r { right: 0; }
.btn-dark, .btn-dark:visited { background: var(--dark); }
.btn-red { background: var(--red); }

/* Hover/focus colours as on Wix: menu and dark buttons turn red, red buttons turn black */
.nav a, .btn { transition: background-color 0.15s ease; }
.nav a:hover, .nav a:focus-visible, .btn-dark:hover, .btn-dark:focus-visible { background: var(--red); }
.btn-red:hover, .btn-red:focus-visible { background: #000; }
.nav a:focus-visible, .btn:focus-visible { outline: 2px solid #000; outline-offset: 2px; }
.btn:active { filter: brightness(0.85); }
@media (prefers-reduced-motion: reduce) { .nav a, .btn { transition: none; } }

/* ---------- main content ---------- */
.main { position: relative; }
.c { margin-bottom: 16px; }
.main > .c:last-child { margin-bottom: 0; }

.h34 { font: 700 34px/41px var(--sans); }
.h32 { font: 700 32px/38px var(--sans); }
.h45 { line-height: 45px; }
.h22 { font: 700 22px/26px var(--sans); }
.hd { font-family: var(--sans); }
.lh18 { line-height: 18px; }
.f15 { font-size: 15px; line-height: 19px; }
.b { font-style: italic; font-weight: 400; letter-spacing: 0; }
p { font-weight: 300; }
b { font-weight: 700; }

.link, a.link { color: var(--blue); text-decoration: underline; }
/* Phone numbers and email: same colour as the text around them, with a light underline so they look tappable */
.plain {
  color: inherit; text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 3px; text-decoration-color: rgba(214, 16, 67, 0.55);
}
/* Text links (phone, email, directions, location names) turn red on hover/focus */
.plain:hover, .plain:focus-visible, .link:hover, .link:focus-visible, .loc-link:hover, .loc-link:focus-visible {
  color: var(--red); text-decoration-color: currentColor; text-decoration-thickness: 2px;
}

.bar { height: 6px; background: var(--red); border-radius: 3px; }

.imgbox { border: 2px solid var(--grey); background: var(--grey); }
.imgbox img { width: 100%; }

.about-copy p { margin-bottom: 18px; }
.about-copy p:last-child { margin-bottom: 0; }
.how p { margin-bottom: 12px; }
.how ol { padding-left: 25px; margin-bottom: 12px; }
.how .or { font-size: 17px; font-weight: 700; line-height: 21px; color: var(--grey); margin-bottom: 11px; }
.notfound { padding-left: 20px; line-height: 26px; }
.types { color: var(--grey); padding-left: 31px; line-height: 23.5px; }

.loc-link {
  font: 700 22px/26px var(--sans); color: var(--blue); text-decoration: underline; display: block;
}
.loc-addr { line-height: 18px; }

.map { height: 280px; }
.map iframe { width: 100%; height: 100%; border: 0; display: block; background: #e5e3df; }

.faq p, .contact-info p { margin-bottom: 18px; }
.faq p:last-child { margin-bottom: 0; }
.faq .q { display: block; font-size: 17px; line-height: 21px; font-weight: 400; letter-spacing: 0; }
.faq b { font-weight: 400; letter-spacing: 0; }
.contact-info i { font-style: italic; font-weight: 400; letter-spacing: 0; }

.wl ul { padding-left: 25px; line-height: 19.6px; }
.wl ul ul { list-style: circle; }

.geo { color: var(--grey); line-height: 18px; letter-spacing: 0.021em; }
.geo-loc { color: #909090; letter-spacing: 0.42px; }
.geo-ls { letter-spacing: 0.42px; }

/* ---------- home ---------- */
.lulo { font: 800 24px/36px var(--lulo); letter-spacing: 0.256em; color: #292929; text-align: center; text-transform: uppercase; }
.impact { font: 400 41px/50px var(--impact); text-align: center; }
.home-watch { color: var(--red); }
.home-crush { color: #000; animation: slide-in-left 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.2s both; }
@keyframes slide-in-left { from { transform: translateX(-100vw); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .home-crush { animation: none; } }
.home-panel { background: rgba(96, 96, 96, 0.63); height: 118px; }
.hero-img { object-fit: cover; }

/* ---------- footer ---------- */
.foot { background: #000; height: 107px; }
.foot .wrap { height: 107px; }
.copy { position: absolute; left: 18px; top: 40px; color: #d4d4d4; font-size: 14px; line-height: 18px; }

/* ---------- desktop: reproduce the Wix layout ---------- */
@media (min-width: 1000px) {
  .main { width: 980px; margin: 0 auto; height: calc(var(--h) * 1px); }
  .c { position: absolute; left: calc(var(--x) * 1px); top: calc(var(--y) * 1px); width: calc(var(--w) * 1px); margin: 0; }
  .c.btn { width: calc(var(--w) * 1px); }
  .loc-link { width: auto; }
  .h32, .h34 { white-space: nowrap; }
  .hero-img { position: absolute; top: -40px; height: 415px; }
  .hero-l { left: calc(490px - 50vw); width: calc(50vw - 425px); object-position: right; }
  .hero-r { left: 912px; width: calc(50vw - 422px); object-position: left; }
  .home .c { z-index: 1; }
}

/* ---------- narrower screens: stack in reading order ---------- */
@media (max-width: 999px) {
  .nav { height: auto; }
  .nav ul { width: 100%; flex-wrap: wrap; padding: 6px 8px; gap: 2px; justify-content: center; }
  .nav li { flex: 0 0 auto; }
  .nav a { padding: 0 12px; }

  .top { height: auto; padding: 24px 16px 28px; }
  .top .wrap { height: auto; display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 16px; }
  .logo, .hours, .btn-l, .btn-r { position: static; }
  .logo { width: 100%; height: auto; margin: 0; order: 1; }
  .logo img { width: 100%; height: auto; max-width: 667px; margin: 0 auto; }
  .hours { width: 100%; order: 2; font-size: 34px; line-height: 42px; }
  .btn-l { order: 3; } .btn-r { order: 4; }
  .btn-l, .btn-r { width: calc(50% - 8px); }

  .main { width: 100%; padding: 24px 16px 32px; }
  .c { margin-bottom: 20px; }
  .btn { width: 100%; }
  .h34 { font-size: 28px; line-height: 34px; }
  .h32 { font-size: 26px; line-height: 32px; }
  .imgbox { max-width: 100%; }
  .bar { width: 60%; }
  .map { height: 260px; }
  .home-panel, .hero-img { display: none; }
  .home .hero-img { display: block; width: 100%; height: 220px; margin-bottom: 12px; }
  .lulo { font-size: 18px; line-height: 28px; }
  .impact { font-size: 34px; line-height: 42px; }
  .home .c.btn { margin-bottom: 12px; }
  .geo { margin-top: 12px; }
  .foot { height: auto; }
  .foot .wrap { height: auto; display: flex; flex-direction: column; gap: 16px; padding: 24px 16px; }
  .copy { position: static; }
}