/* Local fonts, static-slide setup, and the small interactive elements. */
@font-face {
  font-family: Lato;
  src: url('assets/lato-regular.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Lato;
  src: url('assets/lato-bold.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'Dancing Script';
  src: url('assets/dancing-script-bold.woff2') format('woff2');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
html { scroll-behavior: smooth; }
.bg { opacity: 1; }
.static-slider:not(.flickity-enabled) { overflow: hidden; white-space: normal; }
.static-slider:not(.flickity-enabled) > .banner { display: block; }
.hero-dot {
  position: absolute;
  bottom: 15px;
  left: calc(50% - 6px);
  width: 12px !important;
  height: 12px;
  border-radius: 50%;
  background: white;
}
span.btn-txt { display: block; line-height: 1.3; }
/* Native dialogs provide keyboard focus management without any library. */
dialog:not([open]) { display: none; }
dialog::backdrop { background: rgba(0,0,0,.6); }
dialog { color: #777; border: 0; padding: 0; font: inherit; }
.site-drawer {
  position: fixed;
  inset: 0 auto 0 0;
  margin: 0;
  padding: 55px 0 30px;
  width: 260px;
  max-width: 85vw;
  height: 100%;
  max-height: none;
  background: #f8f8f8;
  overflow-y: auto;
}
.site-drawer .dialog-close {
  position: absolute;
  right: 10px;
  top: 8px;
  margin: 0;
  min-width: 35px;
  min-height: 35px;
  padding: 0;
  font-size: 28px;
  font-weight: 400;
  line-height: 35px;
}
.site-drawer .social-icons { padding: 15px 20px; }
#top-link { opacity: 0; pointer-events: none; transition: opacity .25s; }
#top-link.is-visible { opacity: 1; pointer-events: auto; }
:focus-visible { outline: 2px solid #dd3333; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* The telephone link occupies the former cart position in the navigation. */
.header-phone-link { white-space: nowrap; gap: .25em; }
@media (max-width: 549px) {
  .mobile-nav .header-phone-link {
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 0;
    font-size: 14px;
    line-height: 1.35;
    padding: 10px 0;
  }
}
@media (max-width: 849px) {
  #masthead .header-inner > .show-for-medium.flex-left,
  #masthead .header-inner > .show-for-medium.flex-right { min-width: 0; }
}

/* Footer: navigation, opening hours, and live social embeds. */
.footer-columns { display: grid; grid-template-columns: .8fr 1fr 1.35fr 326px; gap: 30px; padding: 0 15px; }
.footer-columns > .col { width: 100%; max-width: 100%; min-width: 0; padding: 0; }
.footer-columns .widget-title { font-size: 18px; }
.footer-columns .menu a { font-size: 16px; }
.footer-location { margin: 0 0 12px; font-size: 16px; }
.store-hours { font-size: 15px; line-height: 1.6; margin-bottom: 18px; }
.store-hours > div { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.store-hours dt { font-weight: 400; }
.store-hours dd { margin: 0; white-space: nowrap; }
.footer-hours-phone { font-size: 16px; }
.social-feed { display: block; width: 100%; height: 500px; margin: 0; border: 0; border-radius: 3px; background: #fff; }
.social-feed-link { display: inline-block; font-size: 14px; margin-top: 12px; text-decoration: underline; }
@media (max-width: 1099px) {
  .footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 35px 30px; }
}
@media (max-width: 699px) {
  .footer-columns { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .store-hours { max-width: 360px; }
}
.footer-columns .widget-title { text-transform: uppercase; font-weight: 700; }
.store-hours dt { text-transform: none; }

/* ---------- Modern polish: deeper teal, 3D pill buttons, phone pill, motion ---------- */
:root { --teal-deep: #1d7f7a; --teal-deeper: #166660; --red: #dd3333; --red-deep: #a82222; }
/* Deeper teal only where white text sits on teal (WCAG AA ~5:1). */
#events, .banner, .header-top, .long-bar, .featured-title, .footer-1 .button.primary { background-color: var(--teal-deep) !important; }
#events p, #events h2, #events h3 { text-shadow: 0 1px 2px rgba(0,0,0,.18); }

.button, button[type="submit"], input[type="submit"], a.button {
  border-radius: 999px !important;
  border-width: 0 !important;
  font-weight: 700;
  letter-spacing: .02em;
  padding-left: 1.6em !important; padding-right: 1.6em !important;
  box-shadow: 0 4px 0 rgba(0,0,0,.22), 0 8px 18px -6px rgba(0,0,0,.35) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
.button.primary:not(.is-outline), button[type="submit"] { background-color: var(--teal-deep) !important; color: #fff !important; box-shadow: 0 4px 0 var(--teal-deeper), 0 10px 20px -8px rgba(0,0,0,.4) !important; }
.button.secondary:not(.is-outline), .button.alt:not(.is-outline) { background-color: var(--red) !important; color: #fff !important; box-shadow: 0 4px 0 var(--red-deep), 0 10px 20px -8px rgba(0,0,0,.4) !important; }
.button.is-outline { border: 2px solid currentColor !important; }
.button:hover, button[type="submit"]:hover { transform: translateY(-2px); filter: brightness(1.06); }
.button:active, button[type="submit"]:active { transform: translateY(3px); box-shadow: 0 1px 0 rgba(0,0,0,.25), 0 3px 8px -4px rgba(0,0,0,.3) !important; }

/* Phone number as a red pill, logo untouched. */
.header-phone-link {
  display: inline-flex !important; align-items: center; gap: .45em;
  background: var(--red); color: #fff !important; border-radius: 999px;
  padding: 0 1em !important; line-height: 2.4em !important; height: auto !important; margin: 0 !important;
  box-shadow: 0 3px 0 var(--red-deep), 0 8px 16px -6px rgba(0,0,0,.4);
  transition: transform .18s ease, box-shadow .18s ease;
}
.header-phone-link::before {
  content: ""; width: 1em; height: 1em; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.header-phone-link:hover { transform: translateY(-2px); color: #fff !important; }
@media (max-width: 549px) {
  .mobile-nav .header-phone-link { flex-direction: row !important; font-size: 13px !important; padding: 0 .8em !important; line-height: 2.5em !important; min-height: 44px; }
}

/* Hours footnote. */
.hours-updated { display: block; margin: -8px 0 14px; font-size: 12px; opacity: .75; font-style: italic; }
.store-hours .hours-special dt, .store-hours .hours-special dd { color: #ffd27a; }

/* Motion: section reveal + hero slow zoom. */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: none; }
#hero-desktop .bg, #hero-mobile .bg { animation: hero-zoom 18s ease-out both; }
@keyframes hero-zoom { from { transform: scale(1.12); } to { transform: scale(1); } }
.box-image img, .img-inner img { transition: transform .5s ease; }
.box:hover .box-image img, .img:hover .img-inner img { transform: scale(1.04); }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; } }

/* WCAG AA: body grey text and nav links darkened slightly. */
body, .nav > li > a, .nav-top-link:not(.header-phone-link), p, li { color: #5c5c5c; }
.dark, .dark p, .dark li, .footer-1, .footer-1 a, .absolute-footer, #events, #events p, #events li, .banner p { color: #fff; }
.nav > li > a:hover, .nav > li.active > a { color: var(--teal-deep); }
.breadcrumbs, .breadcrumbs a, nav a, .is-small, .product-cat, .category, small, .meta-location-info, .box-text p, .price, .woocommerce-breadcrumb { color: #5c5c5c; }
.meta-location-info, [style*="background-color: #28ada6"], [style*="background-color:#28ada6"], .bg-primary-color, .section .bg-primary-color, h3[style*="28ada6"] { background-color: var(--teal-deep) !important; }
.footer-1 small, .footer-1 .hours-updated { color: #fff; }
figcaption { color: #5c5c5c !important; }
.meta-location-info, .meta-location-info * { color: #fff !important; }
.box-text .category, .category.is-smaller { color: #5c5c5c !important; opacity: 1 !important; }
.col-inner.dark[style*="dd3333"] { border-radius: 999px; box-shadow: 0 4px 0 var(--red-deep), 0 10px 20px -8px rgba(0,0,0,.4); transition: transform .18s ease; }
.col-inner.dark[style*="dd3333"]:hover { transform: translateY(-2px); }
h3[style*="28ada6"] { border-radius: 999px; }
.home-hours + .hours-updated { text-align: center; margin: 0 0 10px; color: #5c5c5c; }
#top-link { border-radius: 50% !important; padding: 0 !important; width: 44px; height: 44px; }

/* Open now badge */
.open-status { display: table; margin: 0 auto 10px; padding: 4px 14px; border-radius: 999px; font-weight: 700; font-size: 15px; }
.footer-hours .open-status { margin: 0 0 8px; font-size: 13px; }
.open-status.is-open { background: #e3f6ec; color: #11633a !important; }
.open-status.is-closed { background: #fdecec; color: #8a1c1c !important; }
.open-status::before { content: "●"; margin-right: 6px; }

/* Where to find us */
#find-us { padding: 50px 0; background: #fff; }
.find-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin-top: 20px; }
.find-card { background: #fff; border-radius: 16px; box-shadow: 0 6px 20px rgba(0,0,0,.08); padding: 20px; text-align: center; }
.find-card h3 { margin-bottom: 6px; }
.find-card p { margin-bottom: 6px; }
.find-card iframe { width: 100%; height: 240px; border: 0; border-radius: 12px; margin: 10px 0 14px; display: block; }
.copyright-footer a { color: inherit; text-decoration: underline; }

/* Social icons with names */
.social-icons .icon-label { margin-left: 5px; font-size: 12px; text-transform: none; }
.social-icons a.icon { width: auto !important; padding: 0 8px !important; min-height: 44px; display: inline-flex !important; align-items: center; }
.follow-card p { color: #eee !important; }
.follow-card .follow-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin: 0 0 10px; color: #fff; }
.follow-btn.fb { background: #1877f2; } .follow-btn.ig { background: #c1356f; } .follow-btn.mail { background: #1f8a84; }

/* Sticky call bar on phones */
.mobile-call-bar { display: none; }
@media (max-width: 849px) {
  .mobile-call-bar { display: flex; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; align-items: center; justify-content: center; gap: 8px; min-height: 52px; border-radius: 999px; background: var(--red); color: #fff !important; font-weight: 700; font-size: 17px; box-shadow: 0 6px 16px rgba(0,0,0,.25), inset 0 -3px 0 rgba(0,0,0,.2); }
  #footer { padding-bottom: 80px; }
}

/* Booklet */
.booklet-more { display: block; margin: 10px auto 30px; }
#find-us h2 { text-align: center; }

/* Fixes: plain social labels, visible phone icon, single location card. */
.social-icons .icon-label { background: none !important; color: inherit !important; font-family: Lato, sans-serif; font-weight: 700; padding: 0; }
.header-phone-link::before { display: inline-block; background-color: #fff !important; }
.find-grid { max-width: 640px; margin-left: auto; margin-right: auto; }

/* Image motion: slow continuous hero zoom, photos zoom in as they scroll into view. */
#hero-desktop, #hero-mobile, .banner { overflow: hidden; }
#hero-desktop .bg, #hero-mobile .bg, .banner .bg { animation: hero-kenburns 20s ease-in-out infinite alternate !important; transform-origin: center; }
@keyframes hero-kenburns { from { transform: scale(1); } to { transform: scale(1.15); } }
.img-inner, .box-image { overflow: hidden; }
.reveal .img-inner img, .reveal .box-image img { transform: scale(1.12); transition: transform 1.4s ease-out; }
.reveal.is-visible .img-inner img, .reveal.is-visible .box-image img { transform: scale(1); }
.reveal.is-visible .box:hover .box-image img, .reveal.is-visible .img:hover .img-inner img { transform: scale(1.06); transition-duration: .5s; }