/* NOTE: CSS reset, typography (font-family, font-size, line-height), header layout,
  and container are in _includes/style.html to prevent layout shifts. */

/* CSS Reset – defined in _includes/style.html */

/* Fonts – @font-face moved to _includes/style.html (critical CSS) */

/* Container – defined in _includes/style.html */

/* Buttons */

.btn {
  display: inline-block;
  width: 100%;
  padding: 12px 24px;
  font-size: 1.333rem;
  letter-spacing: 0.03em;
  line-height: 1.375;
  font-weight: 500;
  text-decoration: none;
  text-align: center;
  border-radius: 3px;
  cursor: pointer;
  border: none;
  transition: background-color 0.2s ease, opacity 0.2s ease, outline-offset 0.1s ease, outline-color 0.1s ease;

  &:hover { opacity: 0.85; }

  &:active {
    opacity: 0.7;
    outline: 1px solid currentColor;
    outline-offset: 2px;
  }

  &:focus { outline: none; }

  &:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
    border-radius: 3px;
  }

  &:disabled,
  &[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
  }

  &:visited { text-decoration: none; }

  @media (max-width: 770px) {
    width: 100%;
    min-width: 0;
  }
}

a, p { font-size: clamp(12px, 1.7vw, 20px) }

a:not(.btn) {
  &:focus { outline: none; }
  &:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; border-radius: 2px; }
}

.btn-primary {
  --btn-color: var(--navy);
  background-color: var(--btn-color);
  color: var(--cream);

  &:hover {
    background-color: transparent;
    color: var(--btn-color);
    outline: 1px solid var(--btn-color);
  }
}

.btn-share {
  background: transparent;
  color: var(--navy);
  display: inline-flex;
  align-items: center;
  padding: 0;
  margin: 10px 20px;
  gap: 0.5rem;
  width: auto;
}

.btn-parking-cta {
  width: 300px;
  @media (max-width: 770px) { width: 100%; }
}

hr {
  margin: 1rem 0;
  height: 1px;
  background-color: var(--navy);
  border: none;
}

.mapboxgl-marker svg {
  all: unset;
}

/* Typography (font-family, font-size, line-height) defined in _includes/style.html */

h1 { z-index: 1 }

hgroup {
  display: grid;
  gap: 2rem;
}

h5 {
  font-weight: 600;
  letter-spacing: 0.05em;
  gap: 0.725rem;
  display: flex;
  align-items: flex-start;

  svg {
    width: clamp(20px, 1.5vw, 24px);
    height: clamp(20px, 1.5vw, 24px);
  }
}

p {
  text-wrap: pretty;
  font-weight: 400;
}

/* HEADER */

header {
  nav#desktop {
    &:has(#discover-popover-anchor:hover),
    &:has(#discover-popover:hover),
    &:has(#discover-popover:focus-within),
    &:has(#discover-popover-anchor:focus-visible) {
      #discover-popover {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, 0);
        transition: opacity 300ms ease, transform 300ms ease, visibility 0s linear 0s;
      }

      #discover-popover-anchor svg:last-of-type {
        transform: rotate(180deg);
      }
    }

    &:has(#about-popover-anchor:hover),
    &:has(#about-popover:hover),
    &:has(#about-popover:focus-within),
    &:has(#about-popover-anchor:focus-visible) {
      #about-popover {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, 0);
        transition: opacity 300ms ease, transform 300ms ease, visibility 0s linear 0s;
      }

      #about-popover-anchor svg:last-of-type {
        transform: rotate(180deg);
      }
    }
  }
}

h7 {
  font-size: clamp(12px, 1.7vw, 20px);
  text-wrap: pretty;
}

@media (max-width: 770px) {
  body:has(#mobile:popover-open) main {
    filter: blur(4px);
    transition: filter 350ms ease;
  }

  body:has(#mobile:popover-open) aside#status {
    background: var(--navy);
    transition: background 350ms ease, color 350ms ease;
  }
}

nav#mobile {
  transition:
    max-height 350ms ease,
    overflow-y 0s 350ms,
    overlay 350ms allow-discrete,
    display 350ms allow-discrete;

  &:popover-open {
    transition:
      max-height 350ms ease,
      overlay 350ms allow-discrete,
      display 350ms allow-discrete;
  }

  .mobile-submenu-toggle {
    & > svg:last-of-type {
      transition: transform 300ms ease;
    }

    &:hover {
      color: var(--navy);
      background: var(--cream);

      svg { fill: var(--navy); }
    }
  }

  a:hover {
    color: var(--navy);
    background: var(--cream);
    transition: background-color 180ms ease, color 180ms ease;
  }

  .mobile-submenu-content {
    transition: max-height 300ms ease, opacity 300ms ease;
  }
}

@starting-style {
  nav#mobile:popover-open {
    max-height: 0;
  }
}

.map-container { height: 50dvh; }

::view-transition-group(header-jump) {
  z-index: 1;
  animation: none;
}

::view-transition-old(header-jump) {
  opacity: 0;
  animation: none;
}

/* LIST CONTAINER */
.list-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(390px, 100%), 1fr));
  gap: 2rem;


  .card {
    display: flex;
    flex-direction: column;
    gap: 1rem;

    :not(#accessibility) > p, :not(#accessibility) > .card-media {
      margin-top: auto;
    }

    img {
      margin: 1.5rem 0;
      height: auto;
      object-fit: cover;
      transition: transform 0.3s ease;

      &:hover {
        transform: scale(1.05);
      }
    }

    &[data="store-item"] {
      picture, img {
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
      }
    }

    &.hidden { display: none; }

    .datetime {
      font-size: clamp(12px, 2.2vw, 20px);
      margin-bottom: 0.75rem;
    }

    .store-title {
      display: flex;
      gap: 0.5rem;
      justify-content: space-between;
      align-items: start;
      text-align: center;
      h5 { text-align: left; }
    }

    .btn {
      margin-top: auto;
      align-self: flex-start;
     }
  }

  &:not(:has(.card:not(.hidden)))::after {
    content: "No result found";
    display: block;
    width: 100%;
    text-align: center;
    padding: 2rem 0;
    color: var(--muted, #888);
    font-size: clamp(16px, 2vw, 25px);
  }
}

main.parking {
  hr {
    width: 100%;
    border: 0;
    border-top: 1px solid currentColor;

    @media (max-width: 770px) { display: none; }
  }

  .list-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    width: 100%;

    .row {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 2rem 5rem;

      @media (max-width: 770px) {
        grid-template-columns: 1fr;
      }
    }

    .card {
      width: 100%;
      max-width: none;
      display: grid;
      grid-template-rows: auto auto 1fr auto;
      gap: 2rem;

      figure {
        margin: 0;
        width: 100%;
        aspect-ratio: 1440 / 1080;
        overflow: hidden;

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          margin: 0;
        }
      }

      h4 { margin: 0; }
      p { margin: 0; }
    }
  }
}

/* ARTICLES */

article {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;

  .btn:not(.btn-primary) {
    background: var(--navy);

    &:hover {
      background: transparent;
      color: var(--navy);
      outline: 1px solid var(--navy);
    }
  }

  &::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: var(--navy);
    margin: 2rem 0;
  }

  /* Weddings two lines tweak */
  &:has(+ #weddings)::after {
    height: 0;
    border-top: 1px solid var(--navy);
    border-bottom: 3px solid var(--navy);
    padding-top: 3px;
    background: transparent;
  }

  &:last-of-type { &::after { display: none; } }

  &#whats-new {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;

    >h5,
    >h2,
    >.footer { flex-basis: 100%; }

    img {
      margin-bottom: 0.75rem;
      width: 100%;
      height: auto;
      object-fit: cover;
      aspect-ratio: 4 / 3;
    }

    >section:not(.footer) {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      align-items: stretch;
    }
  }

  &#magazine {
    figure {
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 4px;
      margin: 0;

      img {
        width: 100%;
        height: auto;
        filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.15));
      }
    }

  }

  &#filming {
    align-items: center;

    .footer {
      flex-direction: column;
      align-items: flex-start;
    }

    img {
      width: 100%;
      height: auto;
      object-fit: cover;
    }
  }

  &#weddings {
    h5 { color: var(--pink-light); }

    .weddings-gallery {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr auto;
      gap: 10px;
      padding: 0;
      width: 100%;

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;

        &:first-child { grid-row: 1 / -1; }
      }
    }

    .btn-primary {
      --btn-color: var(--pink-light);
    }
  }

  section.footer {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 0;
    flex-wrap: wrap;

    > a, > div[role="group"] {
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .btn {
      width: fit-content;
      min-width: 360px;
    }
  }
}

.grid-col-2 {
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 1.5rem;
  overflow: hidden;

  .description {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }
}

:is(.store, .event, .shop, .food) .grid-col-2 {
  column-gap: clamp(2rem, 6vw, 6rem);
}

@media (min-width: 770px) {
  .annual-event-grid { align-items: start; }
}

@media (max-width: 770px) {
  .grid-col-2 {
    grid-template-columns: 100%;
  }
}

@media (min-width: 770px) {
  .content-wrapper > article#filming,
  .content-wrapper > article#magazine {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 5rem;
    align-items: start;

    > h5, > h2, > .footer { grid-column: 1; }
    > img, > figure { grid-column: 2; grid-row: 1 / span 3; align-self: start; }
    &::after { grid-column: 1 / -1; }
  }
}

@media (max-width: 770px) {
  .header-jump {
    top: calc(var(--header-height) - var(--header-nav-height) + var(--header-status-height));

    div { gap: 1rem; }
  }

  .content-wrapper>article {
    .footer {
      flex-direction: column;
      align-items: stretch;
      padding: 0;

      .btn { width: 100%; min-width: 0; }
    }

    &#whats-new {
      flex-direction: column;
      align-items: stretch;

      &>h5,
      &>h2,
      &>.footer { flex-basis: auto; }

      &>section {
        flex: none;
        gap: 1rem;

        &:not(:first-of-type):not(.footer) { display: none; }
      }
    }

    &#filming>img,
    &#weddings .weddings-gallery img:first-child {
      width: 100%;
      height: 235px;
      object-fit: cover;
    }

    &#filming {
      grid-template-columns: 1fr;

      &>div {
        align-items: stretch;
      }

      .footer { align-items: stretch; }

      .btn { width: 100%; }
    }

    &#magazine {
      figure img { width: 100%; }
    }

    &#weddings {
      .weddings-gallery {
        display: block;

        img:not(:first-child) {
          display: none;
        }
      }
    }
  }
}

/* FOOTER */

footer > .wrapper {
  address {
    .social {
      display: flex;
      align-items: center;
      margin-top: 0;
      gap: 1rem;

      a {
        background: var(--cream);

        svg {
          fill: var(--navy);
        }
      }
    }
  }

  hr {
    background-color: var(--cream);

    &:first-of-type {
      border: none;
      background-color: var(--navy);
      border-top: 2px solid var(--cream);
      height: 5px;
      margin: 1rem 0;
      border-bottom: 0.75px solid var(--cream);
    }
  }

  .btn-primary {
    background-color: var(--cream);
    color: var(--navy);
    padding: 1rem 5rem;
    margin-top: 1rem;
    width: fit-content;

    &:hover {
      background-color: var(--navy);
      color: var(--cream);
      outline: 1px solid var(--cream);
    }
  }

  section.main {
    nav.magazine {
      .magazine-cover { background-color: transparent; }

      a {
        color: var(--secondary);
        cursor: pointer;
      }
    }
  }
}

@media (max-width: 770px) {
  footer > .wrapper {
    section.main {
      address {
        border-bottom: 0.75px solid var(--cream);
      }

      nav.links {
        border-right: 0.75px solid var(--cream);
      }
    }

    .socials-mobile {
      .socials a {
        background: var(--cream);
        border-radius: 50%;

        svg { fill: var(--navy); }
      }
    }
  }
}

.weddings, .wedding {
  > .content-wrapper > article::after { display: none; }

  > .content-wrapper > article#events::before {
    content: "";
    display: block;
    height: 1px;
    background: var(--navy);
    margin: 2rem 0;
  }

  @media (min-width: 770px) {
    > .content-wrapper > article#events::before { display: none; }

    > .content-wrapper > article#venues::after,
    > .content-wrapper > article#gallery::after {
      content: "";
      display: block;
      height: 1px;
      background: var(--navy);
      margin: 2rem 0;
    }
  }

  .list-container {
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
  }

  @media (max-width: 770px) {
    .list-container { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
  }

  #gallery video {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  details.gallery-more {
    summary {
      width: calc(50% - 1rem);

      @media (max-width: 769px) { width: 100%; }

      &::marker, &::-webkit-details-marker { display: none; }
    }
  }

  .gallery-more-extra {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease;

    :has(> details.gallery-more[open]) > & { max-height: 100%; }
  }

  h5 {
    color: var(--pink-40);
    background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2084%2084%22%20fill=%22%23f4afbe%22%3E%3Cpath%20d=%22M41%2019c5.437%204.53%2010.465%209.343%2015.438%2014.375l2.217%202.23L64%2041c-1.514%203.568-3.605%205.837-6.352%208.547l-2.578%202.559-2.695%202.645-2.719%202.691L43%2064c-3.668-1.539-5.986-3.755-8.766-6.57l-2.695-2.715-2.789-2.84-2.836-2.863L19%2042c4.53-5.437%209.343-10.465%2014.375-15.437l2.23-2.217L41%2019zm23.938-7.375C68%2012%2068%2012%2069.938%2013.688%2071%2016%2071%2016%2071.188%2018.438%2069.303%2022.504%2065.942%2024.092%2062%2026c-2.336.849-4.57%201.443-7%202%20.608-6.083%202.974-15.486%209.938-16.375zM55%2056l5.25%201.813%202.953%201.02C65.891%2059.954%2067.833%2061.067%2070%2063c.938%202.438.938%202.438%201%205-1.062%202.313-1.062%202.313-3%204-2.875.688-2.875.688-6%200-3.344-3.271-5.673-7.537-7-12v-4zM17.875%2011.563C21%2012%2021%2012%2023.125%2013.813%2025.769%2018.307%2027.374%2023.06%2029%2028c-6.412-1.559-11.544-2.958-16-8-.5-3.187-.5-3.187%200-6%202-2%202-2%204.875-2.437zM29%2057l-2.312%205.813-1.301%203.27C24.136%2068.715%2023.315%2070.279%2021%2072c-3.062.313-3.062.313-6%200-2-2-2-2-2.5-4.812.574-3.658%201.686-4.908%204.641-7.082C25.395%2055.198%2025.395%2055.198%2029%2057zm6%204c5.685%203.663%205.685%203.663%206.495%207.1.095%202.428.029%204.788-.12%207.212l-.082%202.533L41%2084c-4.875-1.875-4.875-1.875-6-3l-.098-4.473.01-2.725.025-2.865.014-2.877L35%2061zm26-26l9.813-.25%202.814-.102%202.705-.039%202.491-.063C81%2035%2081%2035%2082.792%2036.899%2084%2039%2084%2039%2084%2041l-8.687.375-2.475.152c-5.999.146-5.999.146-8.536-1.89-1.384-1.66-1.384-1.66-3.302-4.637zm-53.648-.098l2.578.01%202.695.025%202.719.014L22%2035c-3.723%205.685-3.723%205.685-7.006%206.495-2.294.095-4.516.03-6.806-.12l-2.389-.082L0%2041l1-5c2.349-1.174%203.738-1.115%206.352-1.098zM37%200h4l.375%208.188.152%202.33c.146%205.659.146%205.659-1.89%208.149-1.66%201.384-1.66%201.384-4.637%203.333l-.125-9.312-.051-2.67-.02-2.568-.032-2.365C35%203%2035%203%2037%200zm11%2061l.313%209.813.127%202.814c.046%202.552.048%204.867-.439%207.373-2.52%202.137-2.52%202.137-5%203l-.25-9.25-.102-2.645c-.099-6.503-.099-6.503%202.305-9.715C47%2061%2047%2061%2048%2061zm21.547-18.488l5.203.176%202.691.068L84%2043c-.863%202.48-.863%202.48-3%205-3.401.661-6.739.468-10.187.313l-2.85-.068L61%2048c2.293-4.089%203.975-5.346%208.547-5.488zM0%2043l8.75-.312%202.5-.127c2.352-.047%204.444-.032%206.75.439%202.578%202.52%202.578%202.52%204%205l-9.875.125-2.84.051-2.715.02-2.507.032C2%2048%202%2048%200%2046v-3zM43%200c3.875.875%203.875.875%205%202l.098%204.473-.01%202.725-.025%202.865-.014%202.877L48%2022c-2.48-1.422-2.48-1.422-5-4-.634-3.1-.472-6.102-.312-9.25l.068-2.547L43%200z%22/%3E%3C/svg%3E") no-repeat left / 1em;
    padding-left: calc(0.725rem + 1em);
  }

  .btn-primary { --btn-color: var(--pink-40); }
  .site-plan { img { mix-blend-mode: multiply; } }

  > .content-wrapper > article > section, .site-plan, .wedding-article {
    &::after {
      content: "";
      display: block;
      height: 1px;
      background: var(--navy);
      margin: 2rem 0;
    }


    display: flex;
    flex-direction: column;
    gap: 1.5rem;

    > h3, > h5 { order: -3; }
    > h6, > .description { order: -1; }
    > img, > picture, > .image-split { order: -3; }

    .text-block {
      display: flex;
      flex-direction: column;
      gap: 2rem;

      @media (max-width: 769px) {
        > h5 { display: none; }
      }
    }

    @media (min-width: 770px) {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      column-gap: 5rem;
      align-items: start;

      > h3, > h5, > h6, > .description, > .text-block { grid-column: 1; }
      > img, > picture, > .image-split { grid-column: 2; grid-row: 1 / span 2; }
      > img, > picture img { width: 100%; height: auto; display: block; }

      &::after { grid-column: 1 / -1; }

      > h5 { display: none; }
    }
  }

  .weddings-connect-brochure {
    display: contents;

    > article:last-of-type { margin-bottom: 0; }

    .brochure-awards {
      display: flex;
      gap: clamp(1rem, 3vw, 2rem);
      align-items: center;
      justify-content: space-between;

      img {
        width: 48%;
        max-width: 250px;
        max-height: 250px;
        object-fit: contain;
      }
    }

    @media (min-width: 770px) {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: 5rem;

      > article::after { display: none; }

      &:not(:last-child)::after {
        content: "";
        display: block;
        grid-column: 1 / -1;
        height: 1px;
        background: var(--navy);
        margin: 2rem 0;
      }
    }
  }

  .wedding-faq-grid {
    display: grid;
    gap: 2.5rem;
    margin-top: 2rem;
    margin-bottom: 3rem;

    > article {
      display: grid;
      align-content: space-around;
      gap: 2rem;
      padding-bottom: 3rem;
      border-bottom: 1px solid var(--navy);
      &::after { display: none; }

      h3, h6 { margin: 0; }
    }

    @media (min-width: 770px) {
      grid-template-columns: 1fr 1fr;
      column-gap: clamp(2rem, 6vw, 6rem);
      row-gap: 2.5rem;

      > article:nth-last-child(-n + 2) { border-bottom: none; }

      &::after {
        content: "";
        display: block;
        grid-column: 1 / -1;
        height: 1px;
        background: var(--navy);
      }
    }
  }
}

.slideshow {
  position: relative;
  width: 100%;
  margin: 0;
}

.slideshow-barrier {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.slideshow-track {
  display: flex;
  width: calc(100% * var(--slides));
  height: 100%;
  animation: slideshow-autoplay calc(var(--count) * var(--duration-per-slide)) linear infinite;
  will-change: transform;
  transform: translateZ(0);
}

.slideshow-slide {
  height: 100%;
  width: calc(100% / var(--slides));
  flex: 0 0 calc(100% / var(--slides));
}

.slideshow-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@keyframes slideshow-autoplay {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .slideshow-track {
    animation: none;
  }
}

.weddings {
  .list-container .card { justify-content: space-between; }

  .private-events {
    > h6 { margin: 0; order: 2; }
    > .events-slideshow { order: 1; }
    > .events-buttons {
      order: 3;
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
      width: 100%;
      margin-top: auto;
    }

    h5 {
      color: var(--navy);
      background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2284%22%20height=%2284%22%20viewBox=%220%200%20838%20838%22%20fill=%22%23252159%22%3E%3Cpath%20d=%22M418.993%20127.868c2.972%201.676%205.227%203.955%207.597%206.369l1.676%201.671%205.545%205.58%203.982%203.986%208.571%208.606%2013.567%2013.616%2021.476%2021.554%2038.414%2038.545%2013.471%2013.524%208.405%208.438%203.879%203.9c7.633%207.751%207.633%207.751%2015.693%2015.048%203.756%203.196%206.923%206.791%2010.182%2010.484%205.113%205.646%2010.569%2010.964%2015.961%2016.34l3.994%203.995%2010.765%2010.752%2011.279%2011.271%2021.323%2021.302%2024.29%2024.269L709%20417c-1.564%203.753-3.884%206.132-6.744%208.99l-1.48%201.487-4.95%204.937-3.569%203.574-9.837%209.824-10.597%2010.593-18.37%2018.354-26.561%2026.537-43.089%2043.053-41.865%2041.824-2.605%202.604-12.939%2012.931L419%20709c-3.741-1.562-6.123-3.869-8.977-6.717l-1.483-1.472-4.923-4.92-3.564-3.548-9.795-9.78-10.562-10.536-23.087-23.051-14.403-14.386-39.846-39.807-2.575-2.575-5.169-5.168-2.592-2.591-2.595-2.594-41.701-41.633-42.772-42.715-24.032-23.994-20.446-20.429-10.444-10.428-9.538-9.541-3.472-3.456-4.675-4.69-2.637-2.634C128%20420%20128%20420%20128.082%20417.859c1.532-3.101%204.002-5.339%206.44-7.735l1.764-1.769%205.891-5.856%204.208-4.204%209.082-9.047%2014.357-14.308%2022.712-22.634%2040.657-40.525%2014.275-14.221%208.883-8.851%204.121-4.101%205.625-5.604%201.649-1.634c2.977-2.978%205.631-6.082%208.254-9.37a73.99%2073.99%200%200%201%203.434-2.999c6.21-5.321%2011.869-11.215%2017.62-17.021l3.915-3.939%208.386-8.443%2013.262-13.334%202.266-2.276%204.585-4.603%2030.846-31.022%2020.854-20.961%2011.023-11.091%2010.352-10.401%203.797-3.833%205.184-5.196%201.516-1.563c3.345-3.278%203.345-3.278%205.953-3.452zm-5.113%2062.004l-1.707%201.728-1.804%201.803-5.909%205.941-4.094%204.103-10.781%2010.831-10.999%2011.039L357%20247c1.51%203.021%203.739%203.143%206.875%204.25%2016.576%206.202%2030.351%2016.294%2040.813%2030.688%203.13%204.139%205.27%205.736%2010.313%207.063%206.261.696%2010.919-.135%2016-4%202.911-3.158%205.456-6.544%208-10%2010.28-13.745%2026.237-21.29%2042-27-5.736-7.003-12.155-13.319-18.547-19.715l-3.659-3.669-7.635-7.642-9.792-9.823-7.541-7.553-3.612-3.626-5.033-5.034-1.508-1.525c-4.461-4.42-5.415-3.896-9.793.459zm-165.256%20165.38l-1.888%201.898-1.981%201.98-6.509%206.526-4.502%204.506-11.871%2011.896-12.105%2012.125L186%20418c1.65%204.256%204.829%207.096%208.01%2010.237l1.863%201.864%206.103%206.071%204.229%204.22%2011.136%2011.087%2011.361%2011.322L251%20485c1.961-2.941%202.521-5.084%203.191-8.496%202.002-10.108%205.725-18.588%2010.809-27.504l1.43-2.578c5.313-8.74%2013.411-16.256%2021.633-22.234%204.086-3.07%205.708-5.183%206.938-10.187.169-5.309-.612-7.981-4-12.062-3.321-3.484-6.987-6.354-10.816-9.254C266.457%20382.1%20259.524%20366.969%20254%20351c-2.277%200-3.842%202.721-5.376%204.252zM584%20351l-1.066%202.859c-7.246%2019.017-17.48%2033.549-33.809%2045.828-4.504%203.421-4.504%203.421-7.125%208.313-.259%204.717-.03%207.817%203.145%2011.465%202.518%202.235%205.065%204.274%207.765%206.275%2018.249%2013.577%2029.609%2032.709%2033.09%2055.26%203.78%200%204.72-1.367%207.308-3.935l1.724-1.757%201.834-1.832%205.99-6.039%204.157-4.17%2010.934-11.008%2011.161-11.22L651%20419c-1.657-4.29-4.886-7.16-8.086-10.329l-1.888-1.893-6.186-6.168-4.289-4.288-8.991-8.967-11.548-11.528-8.856-8.843-4.26-4.254-5.94-5.919-1.793-1.794c-2.221-2.748-2.221-2.748-5.164-4.017zM401%20546l-3.5%204c-13.856%2016.119-32.982%2023.509-53.5%2027%204.066%204.88%208.328%209.469%2012.832%2013.945l1.983%201.983%206.428%206.411%204.481%204.476%2011.748%2011.723%2012.006%2011.986L417%20651c2.883-1.307%204.946-2.697%207.176-4.936l1.827-1.819%201.968-1.99%202.1-2.099%206.85-6.883%204.758-4.767%2012.507-12.557%2012.769-12.809L492%20578l-1-2a128.33%20128.33%200%200%200-7.187-1.75c-19.061-4.486-34.911-14.45-47.5-29.562-4.128-4.841-7.894-7.102-14.187-8.625-8.901-.67-15.174%203.803-21.125%209.938zm269%2039h85v85h-61v21h144c0%2014.92-4.137%2027.204-14.258%2038.348-5.504%205.22-10.906%208.452-18.18%2010.527-3.125%201.029-3.125%201.029-5.562%203.125-1.675%204.916-2.137%209.744-2.693%2014.883-1.792%2012.35-10.428%2022.142-19.499%2030.039C767.27%20795.72%20755.848%20798.483%20743%20798l-.187%202.375c-2.74%2012.224-11.432%2021.755-21.281%2029.09C712.439%20834.979%20703.493%20837%20693%20837V692h-22v62h-85v-85h61v-23h22v-19l1-42zm-586%201h85v60h22v23h62v85h-85v-62h-22v145c-16.711-1.285-29.27-5.224-40.891-17.441C99.565%20812.834%2095.491%20805.616%2094%20797l-1.949.141c-13.906.555-25.604-4.732-36.238-13.391C46.818%20775.445%2040.842%20764.141%2039%20752a105.72%20105.72%200%200%201-.062-5.312l.027-2.676L39%20742l-1.871-.445C30.463%20739.789%2025.458%20737.182%2020%20733l-2.094-1.559C8.057%20723.543%201.849%20711.438%200%20699v-8h145v-21H84v-84zM146%201v144h22V85h84v84h-61v23h-22v61H84v-85l61-1v-21H0c0-15.331%204.809-27.446%2015.375-38.637C22.137%20101.275%2029.921%2096.424%2039%2095l.078-2.422c.836-16.179%206.57-29.29%2018.41-40.508C68.886%2042.676%2080.434%2039.314%2095%2040l.188-2.375C97.378%2027.851%20103.047%2020.965%20110%2014l1.75-1.785C121.336%203.205%20133.297%201%20146%201zm547%200c15.459%200%2027.399%204.982%2038.637%2015.469C737.183%2022.409%20744%2031.524%20744%2040l2.676.078c14.937.706%2028.83%205.857%2039.324%2016.922%209.373%2011.296%2014%2024.325%2014%2039l2.633.305c11.291%202.332%2021.094%2011.195%2027.617%2020.32%206.212%209.782%207.75%2017.777%207.75%2029.375H694v22h60v85h-85v-61h-22v-23h-61V85h84v60h23V1zm145%20346v144c-19.803-1.415-35.027-5.729-50-19l-1.859-1.574c-13.507-12.299-19.993-30.463-21.359-48.277-.639-19.748%206.195-38.646%2019.639-53.141C798.954%20354.007%20817.215%20347%20838%20347zM0%20347c18.451%200%2036.372%205.458%2049.77%2018.676L52%20368l2.324%202.23C65.732%20381.794%2072.064%20397.889%2073%20414l.16%202.219c.713%2018.588-6.321%2036.944-18.41%2050.906C39.285%20483.597%2022.289%20489.408%200%20491V347zM347%200h144c0%2020.184-6.987%2037.746-20.937%2052.375-16.422%2015.387-35.215%2020.509-57.203%2019.965-18.992-.854-35.07-9.65-47.86-23.34-12.415-14.12-18-30.314-18-49zm117%20780c15.101%2012.904%2024.22%2029.204%2027%2049v8H347c0-19.834%207.278-37.466%2021.063-51.687%2025.708-25.4%2067.378-27.131%2095.938-5.312z%22/%3E%3C/svg%3E") no-repeat left / 1em;
    }

    .btn-primary { --btn-color: var(--navy); }

    .events-slideshow { aspect-ratio: 3 / 2; }

    @media (min-width: 770px) {
      display: grid;
      grid-template-columns: 1fr 1fr;
      column-gap: clamp(2rem, 6vw, 6rem);
      row-gap: 1.5rem;
      align-items: start;

      > .events-slideshow {
        grid-column: 2;
        grid-row: 1 / span 4;
        align-self: center;
      }

      > .events-buttons {
        align-self: end;
        margin-top: 0;
      }
    }
  }

  ul {
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;

    li {
      display: flex;
      gap: 1rem;
    }

    li::before {
      content: "";
      width: 1em;
      height: 1em;
      flex-shrink: 0;
      background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2084%2084%22%20fill=%22%23f4afbe%22%3E%3Cpath%20d=%22M41%2019c5.437%204.53%2010.465%209.343%2015.438%2014.375l2.217%202.23L64%2041c-1.514%203.568-3.605%205.837-6.352%208.547l-2.578%202.559-2.695%202.645-2.719%202.691L43%2064c-3.668-1.539-5.986-3.755-8.766-6.57l-2.695-2.715-2.789-2.84-2.836-2.863L19%2042c4.53-5.437%209.343-10.465%2014.375-15.437l2.23-2.217L41%2019zm23.938-7.375C68%2012%2068%2012%2069.938%2013.688%2071%2016%2071%2016%2071.188%2018.438%2069.303%2022.504%2065.942%2024.092%2062%2026c-2.336.849-4.57%201.443-7%202%20.608-6.083%202.974-15.486%209.938-16.375zM55%2056l5.25%201.813%202.953%201.02C65.891%2059.954%2067.833%2061.067%2070%2063c.938%202.438.938%202.438%201%205-1.062%202.313-1.062%202.313-3%204-2.875.688-2.875.688-6%200-3.344-3.271-5.673-7.537-7-12v-4zM17.875%2011.563C21%2012%2021%2012%2023.125%2013.813%2025.769%2018.307%2027.374%2023.06%2029%2028c-6.412-1.559-11.544-2.958-16-8-.5-3.187-.5-3.187%200-6%202-2%202-2%204.875-2.437zM29%2057l-2.312%205.813-1.301%203.27C24.136%2068.715%2023.315%2070.279%2021%2072c-3.062.313-3.062.313-6%200-2-2-2-2-2.5-4.812.574-3.658%201.686-4.908%204.641-7.082C25.395%2055.198%2025.395%2055.198%2029%2057zm6%204c5.685%203.663%205.685%203.663%206.495%207.1.095%202.428.029%204.788-.12%207.212l-.082%202.533L41%2084c-4.875-1.875-4.875-1.875-6-3l-.098-4.473.01-2.725.025-2.865.014-2.877L35%2061zm26-26l9.813-.25%202.814-.102%202.705-.039%202.491-.063C81%2035%2081%2035%2082.792%2036.899%2084%2039%2084%2039%2084%2041l-8.687.375-2.475.152c-5.999.146-5.999.146-8.536-1.89-1.384-1.66-1.384-1.66-3.302-4.637zm-53.648-.098l2.578.01%202.695.025%202.719.014L22%2035c-3.723%205.685-3.723%205.685-7.006%206.495-2.294.095-4.516.03-6.806-.12l-2.389-.082L0%2041l1-5c2.349-1.174%203.738-1.115%206.352-1.098zM37%200h4l.375%208.188.152%202.33c.146%205.659.146%205.659-1.89%208.149-1.66%201.384-1.66%201.384-4.637%203.333l-.125-9.312-.051-2.67-.02-2.568-.032-2.365C35%203%2035%203%2037%200zm11%2061l.313%209.813.127%202.814c.046%202.552.048%204.867-.439%207.373-2.52%202.137-2.52%202.137-5%203l-.25-9.25-.102-2.645c-.099-6.503-.099-6.503%202.305-9.715C47%2061%2047%2061%2048%2061zm21.547-18.488l5.203.176%202.691.068L84%2043c-.863%202.48-.863%202.48-3%205-3.401.661-6.739.468-10.187.313l-2.85-.068L61%2048c2.293-4.089%203.975-5.346%208.547-5.488zM0%2043l8.75-.312%202.5-.127c2.352-.047%204.444-.032%206.75.439%202.578%202.52%202.578%202.52%204%205l-9.875.125-2.84.051-2.715.02-2.507.032C2%2048%202%2048%200%2046v-3zM43%200c3.875.875%203.875.875%205%202l.098%204.473-.01%202.725-.025%202.865-.014%202.877L48%2022c-2.48-1.422-2.48-1.422-5-4-.634-3.1-.472-6.102-.312-9.25l.068-2.547L43%200z%22/%3E%3C/svg%3E") no-repeat center / contain;
      margin-top: calc(1em / 3);
    }
  }
}

form {
  display: flex;
  flex-direction: column;

  .btn.btn-primary {
    margin-top: 2.875rem;
  }

  input:not([type="checkbox"]) {
    width: 100%;
    padding: 25px 0 41px 0;
    border: none;
    border-bottom: 1px solid var(--navy);
    color: var(--navy);
    background-color: transparent;
    text-align: left;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 16px;
    &::placeholder { color: var(--navy); }
    transition: opacity 0.2s ease, outline-offset 0.1s ease, outline-color 0.1s ease;
    &:focus { outline: none; }
    &:active { outline: none; }
    &::-webkit-calendar-picker-indicator { display: none; }
  }

  label.date-field {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--navy);
    padding-top: 25px;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--navy);

    input[type="date"] {
      border-bottom: none;
      padding-top: 0;
      padding-bottom: 41px;
    }
  }

  fieldset {
    border: none;
    padding: 0;
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;

    legend {
      padding: 0 0 0.5rem;
      font-weight: 500;
      letter-spacing: 0.04em;

      a {
        font-size: 12px;
        &:focus { outline: none; }
        &:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; border-radius: 2px; }
      }
    }

    label {
      cursor: pointer;
      display: flex;
      align-items: flex-start;
      gap: 1rem;
    }

    input[type="checkbox"] {
      appearance: none;
      -webkit-appearance: none;
      width: 1.25rem;
      height: 1.25rem;
      flex-shrink: 0;
      border: 1.5px solid var(--navy);
      border-radius: 2px;
      background-color: transparent;
      cursor: pointer;
      transition: opacity 0.2s ease, background-color 0.15s ease, outline-offset 0.1s ease, outline-color 0.1s ease;

      &:checked {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpolyline points='1,5 4.5,8.5 11,1' fill='none' stroke='%231a2744' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: 75%;
      }
      &:focus { outline: none; }
      &:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
      &:active { opacity: 0.7; }
    }
  }

  .form-message {
    margin-top: 1rem;
    font-size: 1.25rem;
    font-weight: 700;
    opacity: 1;
    transition: opacity 0.3s ease;

    color: var(--green);
    &[aria-hidden="true"] { opacity: 0; pointer-events: none; }
    &[data-error] { color: var(--red); }
  }

  label:has(input[type="file"]) {
    position: relative;
    border: 1.5px solid var(--navy);
    border-radius: 0.25rem;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    text-align: center;
    transition: background-color 0.2s ease;

    &:focus-within { outline: 2px solid var(--navy); outline-offset: 2px; }

    &.drag-over { background-color: color-mix(in srgb, var(--navy) 8%, transparent); }
    svg { color: var(--navy); margin-bottom: 0.5rem; }

    .file-upload-label {
      font-weight: 600;
      font-size: 0.85rem;
      letter-spacing: 0.08em;
      margin: 0;
    }

    .file-upload-hint { font-size: 0.8rem; margin: 0; opacity: 0.7; }

    cursor: pointer;

    span.btn {
      margin-top: 0.75rem;
      width: fit-content;
      min-width: 0;
    }

    input[type="file"] {
      position: absolute;
      width: 1px;
      height: 1px;
      opacity: 0;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      padding: 0;
      border: none;
    }

    .file-name {
      margin: 0;
      font-size: 0.85rem;
      word-break: break-all;
      min-height: 1.5em;
      &[data-error] { color: var(--red); }
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  label:has(input[type="file"]) { transition: none; }
}

input[type="number"] {
  appearance: textfield;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  display: none;
}

input[type="search"] {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--navy);
  border-top: 1px solid var(--navy);
  padding: clamp(1rem, 3.5vw, 1.5rem) 40px clamp(1rem, 3.5vw, 1.5rem) 0;
  font-size: clamp(12px, 2.2vw, 20px);
  font-weight: 400;
  letter-spacing: 0.08em;
  color: var(--navy);
  outline: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23111c4e' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 4px center;
  background-size: 20px;
  line-height: 100%;

  &::placeholder { color: var(--navy) }
  &::-webkit-search-cancel-button { display: none }
  &::webkit-details-marker { display: none }
}

.image-split {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;

  &:has(picture:nth-child(2)):not(:has(picture:nth-child(3))) {
    flex-direction: row;
    picture { width: 50%; }
  }
}

/* TODO: cleanup redurant styles */

/* Calendar Styles */
.calendar { padding-top: 1.3rem; }

.calendar-filter {
  margin-bottom: 1.5rem;
  position: relative;
  height: 3rem;
}

.calendar-select {
  position: absolute;
  inset: 0;
  padding: 0.5rem 0;
  font-size: 18px;
  border: none;
  background-color: transparent;
  color: var(--navy);
  font-weight: 500;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

.calendar-filter::after {
  content: "⌃";
  font-size: 30px;
  transform: rotate(180deg);
  position: absolute;
  top: -9px;
  left: 175px;
  pointer-events: none;
}

.calendar-select:focus {
  outline: none;
  border-color: #666;
}

.calendar-items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));

  @media (max-width: 770px) { grid-template-columns: 1fr; }

  a {
    display: flex;
    gap: 1.5rem;
    padding: 1rem 0;
    text-decoration: none;

    &:hover .calendar-item-image img {
      transform: scale(1.08);
      transform-origin: center center;
    }
  }

  h3 {
    font-size: clamp(1.5rem, 2vw, 2rem);
    margin: 0 0 0.25rem 0;
    font-family: "Big Caslon", "Book Antiqua", "Palatino Linotype", Georgia, serif;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  p {
    font-size: clamp(0.875rem, 1vw, 1.25rem);
    margin: 0 0 0.25rem 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

.calendar-item-date {
  font-size: 1.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  display: flex;
  min-width: 80px;
}

.calendar-item-content {
  display: flex;
  gap: 2rem;
  flex: 1;
  align-items: flex-start;
}

.calendar-item-image {
  width: clamp(110px, 20vw, 280px);
  aspect-ratio: 3 / 4;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 4px;

  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 200ms ease;
  }
}

.calendar-item-details {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

@media (min-width: 771px) {
  .calendar-items {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 3rem;
    row-gap: 3.5rem;

    a {
      gap: 1.75rem;
      align-items: flex-start;
    }

    h3 {
      font-size: clamp(1.5rem, 1.6vw, 1.75rem);
      margin: 0;
    }
  }

  .calendar-item-date {
    font-size: clamp(0.875rem, 1vw, 1rem);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    min-width: 0;
  }

  .calendar-item-content {
    height: auto;
    align-items: flex-start;
  }

  .calendar-item-image {
    width: clamp(180px, 18vw, 240px);
    aspect-ratio: 3 / 4;

    img { height: 100%; }
  }

  .calendar-item-details { gap: 1rem; }
}

.calendar-item-time {
  font-size: clamp(0.875rem, 1vw, 1.25rem);
}

/* Color Themes for pages */

h5[title] {
  color: var(--navy);
  background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2284%22%20height=%2284%22%20viewBox=%220%200%20838%20838%22%20fill=%22%23252159%22%3E%3Cpath%20d=%22M418.993%20127.868c2.972%201.676%205.227%203.955%207.597%206.369l1.676%201.671%205.545%205.58%203.982%203.986%208.571%208.606%2013.567%2013.616%2021.476%2021.554%2038.414%2038.545%2013.471%2013.524%208.405%208.438%203.879%203.9c7.633%207.751%207.633%207.751%2015.693%2015.048%203.756%203.196%206.923%206.791%2010.182%2010.484%205.113%205.646%2010.569%2010.964%2015.961%2016.34l3.994%203.995%2010.765%2010.752%2011.279%2011.271%2021.323%2021.302%2024.29%2024.269L709%20417c-1.564%203.753-3.884%206.132-6.744%208.99l-1.48%201.487-4.95%204.937-3.569%203.574-9.837%209.824-10.597%2010.593-18.37%2018.354-26.561%2026.537-43.089%2043.053-41.865%2041.824-2.605%202.604-12.939%2012.931L419%20709c-3.741-1.562-6.123-3.869-8.977-6.717l-1.483-1.472-4.923-4.92-3.564-3.548-9.795-9.78-10.562-10.536-23.087-23.051-14.403-14.386-39.846-39.807-2.575-2.575-5.169-5.168-2.592-2.591-2.595-2.594-41.701-41.633-42.772-42.715-24.032-23.994-20.446-20.429-10.444-10.428-9.538-9.541-3.472-3.456-4.675-4.69-2.637-2.634C128%20420%20128%20420%20128.082%20417.859c1.532-3.101%204.002-5.339%206.44-7.735l1.764-1.769%205.891-5.856%204.208-4.204%209.082-9.047%2014.357-14.308%2022.712-22.634%2040.657-40.525%2014.275-14.221%208.883-8.851%204.121-4.101%205.625-5.604%201.649-1.634c2.977-2.978%205.631-6.082%208.254-9.37a73.99%2073.99%200%200%201%203.434-2.999c6.21-5.321%2011.869-11.215%2017.62-17.021l3.915-3.939%208.386-8.443%2013.262-13.334%202.266-2.276%204.585-4.603%2030.846-31.022%2020.854-20.961%2011.023-11.091%2010.352-10.401%203.797-3.833%205.184-5.196%201.516-1.563c3.345-3.278%203.345-3.278%205.953-3.452zm-5.113%2062.004l-1.707%201.728-1.804%201.803-5.909%205.941-4.094%204.103-10.781%2010.831-10.999%2011.039L357%20247c1.51%203.021%203.739%203.143%206.875%204.25%2016.576%206.202%2030.351%2016.294%2040.813%2030.688%203.13%204.139%205.27%205.736%2010.313%207.063%206.261.696%2010.919-.135%2016-4%202.911-3.158%205.456-6.544%208-10%2010.28-13.745%2026.237-21.29%2042-27-5.736-7.003-12.155-13.319-18.547-19.715l-3.659-3.669-7.635-7.642-9.792-9.823-7.541-7.553-3.612-3.626-5.033-5.034-1.508-1.525c-4.461-4.42-5.415-3.896-9.793.459zm-165.256%20165.38l-1.888%201.898-1.981%201.98-6.509%206.526-4.502%204.506-11.871%2011.896-12.105%2012.125L186%20418c1.65%204.256%204.829%207.096%208.01%2010.237l1.863%201.864%206.103%206.071%204.229%204.22%2011.136%2011.087%2011.361%2011.322L251%20485c1.961-2.941%202.521-5.084%203.191-8.496%202.002-10.108%205.725-18.588%2010.809-27.504l1.43-2.578c5.313-8.74%2013.411-16.256%2021.633-22.234%204.086-3.07%205.708-5.183%206.938-10.187.169-5.309-.612-7.981-4-12.062-3.321-3.484-6.987-6.354-10.816-9.254C266.457%20382.1%20259.524%20366.969%20254%20351c-2.277%200-3.842%202.721-5.376%204.252zM584%20351l-1.066%202.859c-7.246%2019.017-17.48%2033.549-33.809%2045.828-4.504%203.421-4.504%203.421-7.125%208.313-.259%204.717-.03%207.817%203.145%2011.465%202.518%202.235%205.065%204.274%207.765%206.275%2018.249%2013.577%2029.609%2032.709%2033.09%2055.26%203.78%200%204.72-1.367%207.308-3.935l1.724-1.757%201.834-1.832%205.99-6.039%204.157-4.17%2010.934-11.008%2011.161-11.22L651%20419c-1.657-4.29-4.886-7.16-8.086-10.329l-1.888-1.893-6.186-6.168-4.289-4.288-8.991-8.967-11.548-11.528-8.856-8.843-4.26-4.254-5.94-5.919-1.793-1.794c-2.221-2.748-2.221-2.748-5.164-4.017zM401%20546l-3.5%204c-13.856%2016.119-32.982%2023.509-53.5%2027%204.066%204.88%208.328%209.469%2012.832%2013.945l1.983%201.983%206.428%206.411%204.481%204.476%2011.748%2011.723%2012.006%2011.986L417%20651c2.883-1.307%204.946-2.697%207.176-4.936l1.827-1.819%201.968-1.99%202.1-2.099%206.85-6.883%204.758-4.767%2012.507-12.557%2012.769-12.809L492%20578l-1-2a128.33%20128.33%200%200%200-7.187-1.75c-19.061-4.486-34.911-14.45-47.5-29.562-4.128-4.841-7.894-7.102-14.187-8.625-8.901-.67-15.174%203.803-21.125%209.938zm269%2039h85v85h-61v21h144c0%2014.92-4.137%2027.204-14.258%2038.348-5.504%205.22-10.906%208.452-18.18%2010.527-3.125%201.029-3.125%201.029-5.562%203.125-1.675%204.916-2.137%209.744-2.693%2014.883-1.792%2012.35-10.428%2022.142-19.499%2030.039C767.27%20795.72%20755.848%20798.483%20743%20798l-.187%202.375c-2.74%2012.224-11.432%2021.755-21.281%2029.09C712.439%20834.979%20703.493%20837%20693%20837V692h-22v62h-85v-85h61v-23h22v-19l1-42zm-586%201h85v60h22v23h62v85h-85v-62h-22v145c-16.711-1.285-29.27-5.224-40.891-17.441C99.565%20812.834%2095.491%20805.616%2094%20797l-1.949.141c-13.906.555-25.604-4.732-36.238-13.391C46.818%20775.445%2040.842%20764.141%2039%20752a105.72%20105.72%200%200%201-.062-5.312l.027-2.676L39%20742l-1.871-.445C30.463%20739.789%2025.458%20737.182%2020%20733l-2.094-1.559C8.057%20723.543%201.849%20711.438%200%20699v-8h145v-21H84v-84zM146%201v144h22V85h84v84h-61v23h-22v61H84v-85l61-1v-21H0c0-15.331%204.809-27.446%2015.375-38.637C22.137%20101.275%2029.921%2096.424%2039%2095l.078-2.422c.836-16.179%206.57-29.29%2018.41-40.508C68.886%2042.676%2080.434%2039.314%2095%2040l.188-2.375C97.378%2027.851%20103.047%2020.965%20110%2014l1.75-1.785C121.336%203.205%20133.297%201%20146%201zm547%200c15.459%200%2027.399%204.982%2038.637%2015.469C737.183%2022.409%20744%2031.524%20744%2040l2.676.078c14.937.706%2028.83%205.857%2039.324%2016.922%209.373%2011.296%2014%2024.325%2014%2039l2.633.305c11.291%202.332%2021.094%2011.195%2027.617%2020.32%206.212%209.782%207.75%2017.777%207.75%2029.375H694v22h60v85h-85v-61h-22v-23h-61V85h84v60h23V1zm145%20346v144c-19.803-1.415-35.027-5.729-50-19l-1.859-1.574c-13.507-12.299-19.993-30.463-21.359-48.277-.639-19.748%206.195-38.646%2019.639-53.141C798.954%20354.007%20817.215%20347%20838%20347zM0%20347c18.451%200%2036.372%205.458%2049.77%2018.676L52%20368l2.324%202.23C65.732%20381.794%2072.064%20397.889%2073%20414l.16%202.219c.713%2018.588-6.321%2036.944-18.41%2050.906C39.285%20483.597%2022.289%20489.408%200%20491V347zM347%200h144c0%2020.184-6.987%2037.746-20.937%2052.375-16.422%2015.387-35.215%2020.509-57.203%2019.965-18.992-.854-35.07-9.65-47.86-23.34-12.415-14.12-18-30.314-18-49zm117%20780c15.101%2012.904%2024.22%2029.204%2027%2049v8H347c0-19.834%207.278-37.466%2021.063-51.687%2025.708-25.4%2067.378-27.131%2095.938-5.312z%22/%3E%3C/svg%3E") no-repeat left / 1em;
  padding-left: calc(0.725rem + 1em);
}

.galleries {
  h5[title] {
    background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2284%22%20height=%2284%22%20viewBox=%220%200%20837%20837%22%20fill=%22%231d6e8a%22%3E%3Cpath%20d=%22M396%2041h45v333h22v22h333v43H463v25h-22v333h-45V464h-23v-25H41v-43h332v-22h23V41zM74.063%20150.875c19.129-.563%2037.785%205.898%2052.188%2018.5L131%20174l2.117%202.082c13.496%2014.152%2019.442%2032.435%2020.195%2051.73-.313%2011.879-2.941%2023.592-8.312%2034.188l-1.527%203.016c-9.478%2017.395-24.904%2029.611-43.562%2036.051-20.846%205.919-42.717%203.843-61.75-6.629-18.33-11.106-31.481-27.954-36.66-48.812-4.394-19.848-1.514-41.37%209.422-58.664%201.943-2.733%203.967-5.356%206.078-7.961l1.645-2.141c11.995-14.826%2030.439-23.137%2049.043-25.547%202.124-.182%204.247-.309%206.375-.437zM757.406%20532.84c21.131-.732%2039.722%206.831%2055.43%2020.656%2015.777%2014.891%2023.787%2034.507%2024.539%2056.004-.421%2012.013-2.933%2023.764-8.375%2034.5l-1.527%203.016c-10.519%2019.305-27.584%2030.894-48.297%2037.188-19.569%204.91-40.674%201.596-58.176-8.203-19.116-11.877-30.698-29.497-36-51-3.389-19.191-.564-39.365%209.887-56.004%201.948-2.752%203.985-5.382%206.113-7.996l1.832-2.363c11.53-14.054%2029.815-22.982%2047.668-25.324l6.906-.473zm-633.879%2016.191c2.572%202.251%205.033%204.576%207.473%206.969l2.348%202.238c13.208%2013.479%2019.382%2032.679%2019.902%2051.262-.684%2021.779-8.952%2041.111-24.25%2056.5-16.366%2014.797-37.084%2020.934-58.894%2020.132C54.937%20685.182%2040.8%20679.479%2029%20670l-2.52-2.023C11.716%20655.412%202.268%20638.305%200%20619c-1.712-22.708%204.134-43.507%2019-61%2026.931-28.849%2073.194-34.151%20104.527-8.969zM272.633%2014.098C290.012%2028.064%20301.295%2045.603%20304%2068c1.095%2021.076-3.375%2040.495-17%2057l-1.832%202.359c-11.621%2014.189-29.345%2022.227-47.105%2025.328a122.69%20122.69%200%200%201-4.062.313l-2.562.16c-21.442.67-40.364-6.474-56.309-20.727-15.767-15.04-23.716-34.301-24.504-55.934.421-12.013%202.933-23.764%208.375-34.5l1.527-3.016c9.047-16.603%2023.958-29.232%2041.992-35.137%2023.987-7.058%2049.526-5.174%2070.113%2010.25zM811%20170l2.488%202.207c14.922%2014.016%2022.089%2032.696%2023.762%2052.797.501%2021.532-7.746%2041.285-22.25%2056.996-12.56%2013.149-31.027%2021.546-49.25%2022.203-22.942.379-42.477-5.9-59.41-21.844-15.427-15.556-22.6-34.882-22.589-56.665.253-16.966%206.177-32.194%2016.249-45.694l1.613-2.176c12.349-15.29%2030.966-23.959%2050.137-26.574%2021.469-1.614%2043.054%204.206%2059.25%2018.75z%22/%3E%3Cpath%20d=%22M654%2014c16.281%2013.129%2027.37%2029.182%2031%2050%201.611%2022.903-1.64%2043.849-16.988%2061.77L666%20128l-1.793%202.074c-13.432%2014.577-32.419%2021.677-51.812%2023.211-21.608.562-41.394-7.181-57.055-21.926-15.046-15.172-22.608-34.167-22.84-55.422.205-18.769%206.805-36.914%2019.5-50.937l1.723-2C579.275-4.777%20623.774-7.361%20654%2014zM271.523%20697.656c17.343%2012.9%2027.843%2030.074%2032.039%2051.172%202.874%2020.84-2.127%2041.176-14.562%2058.172-2.846%203.498-5.843%206.782-9%2010l-1.824%201.898c-14.99%2014.372-35.665%2018.674-55.711%2018.371-20.621-.727-38.615-10.851-52.652-25.52-13.09-14.916-19.48-33.73-19.062-53.523%201.777-22.936%2011.246-41.249%2028.063-56.914%2026.151-21.878%2064.768-21.997%2092.711-3.656zm383.649%201.547C671.054%20711.751%20681.726%20728.901%20685%20749c1.863%2022.798-2.387%2044.048-17.25%2061.938-12.749%2014.572-30.944%2024.619-50.348%2026.286-22.087%201.253-41.33-3.662-58.402-18.223l-2.504-1.926C543.642%20806.393%20534.99%20788.484%20533%20772c-1.435-23.507%202.9-44.584%2018.802-62.619%2026.968-29.254%2071.039-32.634%20103.37-10.178zM506%20507h142c0%2014.84-4.402%2026.201-14.437%2037.25C628.228%20549.345%20617.743%20557%20610%20557l-.078%202.422c-.666%2012.892-3.909%2022.439-11.922%2032.578l-1.844%202.5c-6.88%207.978-16.956%2013.298-27.156%2015.5l-6.937.5c-3.263.305-3.263.305-6.062%201.5-1.915%202.831-2.815%205.508-3.844%208.762-3.713%2010.399-13.577%2018.649-23.156%2023.551C522%20647%20522%20647%20506%20649V507zm0-318c15.054%200%2026.682%203.986%2037.813%2014.313C549.317%20209.186%20556%20218.694%20556%20227l3.75-.187c14.066.066%2025.924%206.246%2035.961%2015.773%208.813%209.295%2014.525%2020.734%2014.352%2033.727l-.027%202.676L610%20281l1.73.34c12.282%202.988%2022.557%2011.034%2029.27%2021.66%204.94%209.069%207%2016.595%207%2027H506V189zM189%20507h141v141c-13.176%200-21.615-2.087-32-10l-3.125-2.25c-6.912-6.611-11.519-14.841-14.875-23.75v-2l-1.73.141c-13.793.614-25.532-5.231-35.957-13.828-8.972-8.37-14.71-19.486-15.551-31.805-.01-2.85.054-5.665.238-8.508l-2.375-.187c-11.954-2.679-21.461-10.974-28.383-20.848C190.3%20525.566%20189%20518.394%20189%20507zm141-318v141H189c0-14.621%204.085-25.94%2014.125-36.687%206.557-6.257%2014.226-10.66%2022.875-13.312l.262-2.605C227.723%20265.102%20230.86%20254.561%20239%20245l1.75-2.562c7.142-7.737%2017.862-13.547%2028.25-15.437a144.7%20144.7%200%200%201%206.25-.062l3.266.027L281%20227l.344-2.672c2.293-11.631%2011.373-21.681%2020.906-28.203C311.377%20190.718%20319.408%20189%20330%20189z%22/%3E%3C/svg%3E") no-repeat left / 1em;
    padding-left: calc(0.725rem + 1em);
  }
  h5 { color: var(--blue); }

  .btn-primary { --btn-color: var(--blue); }
}

.shops {
  h5[title] {
    background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2284%22%20height=%2284%22%20viewBox=%220%200%20838%20838%22%20fill=%22%23d51668%22%3E%3Cpath%20d=%22M520%20189l2.412%201.054c45.731%2020.194%2086.368%2055.888%20111.55%2099.165l2.188%203.711c14.914%2025.082%2024.28%2052.517%2029.849%2081.07l.505%202.507c5.285%2027.497%205.184%2060.08-.505%2087.493l-.618%203.011C660.904%20488.187%20654.45%20508.516%20645%20528l-1.104%202.287c-27.881%2056.997-78.844%20103.248-138.833%20124.401-12.503%204.28-25.12%207.821-38.062%2010.5l-2.223.469c-15.037%202.961-30.118%203.722-45.402%203.656l-2.639-.006c-21.891-.077-42.531-2.858-63.736-8.307l-2.218-.553C308.862%20649.842%20271.949%20625.548%20241%20596l-2.043-1.918c-5.138-4.95-9.515-10.512-13.957-16.082l-2.633-3.223c-23.502-28.982-39.523-63.356-48.055-99.59l-.577-2.398c-3.769-16.811-5.24-33.698-5.127-50.894l-.019-8.685C168.518%20349.899%20195.379%20289.252%20239%20244l1.619-1.685c7.06-7.312%2014.298-14.125%2022.381-20.315l1.646-1.271c9.992-7.679%2020.44-14.437%2031.354-20.729l2.232-1.293C364.938%20160.573%20450.141%20158.183%20520%20189zM372.313%20335.5L336%20336v166h166V335c-64.85-.065-64.85-.065-129.687.5zM704%200h134v133c-15.44%200-24.715-3.429-36.031-13.875-5.631-5.928-9.395-13.403-11.969-21.125l-2.93-.297C774.572%2096.268%20765.647%2093.439%20756%2085l-1.871-1.516C743.78%2074.357%20740.161%2060.2%20739%2047l-2.238-.777c-13.139-4.958-22.913-13.139-29.039-25.879C704.858%2013.249%20704.667%208.002%20704%200zM0%200h134c-1.294%2015.524-4.571%2026.429-16.234%2037.031C111.738%2041.937%20105.704%2045.645%2098%2047l-.078%202.203C97.222%2061.608%2093.912%2071.359%2086%2081l-1.738%202.152C77.109%2091.132%2065.723%2096.954%2055%2098c-2.692.122-5.303.098-8%200l-.445%201.652C44.69%20105.92%2041.844%20110.744%2038%20116l-1.75%202.625C29.454%20125.799%2020.529%20130.618%2011%20133H0V0zm838%20704v133H704c1.131-12.441%203.298-21.201%2011-31l1.602-2.055c3.113-3.524%206.006-5.892%2010.363-7.66%206.393-2.484%206.393-2.484%2012.035-6.285%201.642-4.034%202.064-7.533%202.461-11.824C742.477%20767.765%20749.342%20757.78%20757%20751c9.947-7.814%2021.298-12.032%2034-11l.375-1.801C794.183%20726.917%20801.583%20717.694%20811%20711c8.843-5.017%2016.898-7%2027-7zM0%20704c13.667%201.051%2022.763%203.053%2033%2012l1.797%201.445C40.727%20722.667%2044.025%20729.802%2047%20737v3l3.25-.187c12.727.067%2024.688%205.605%2033.906%2014.219%208.386%208.955%2014.092%2020.318%2013.906%2032.781l-.027%202.395L98%20791l1.801.375c11.952%202.974%2021.556%2010.962%2027.887%2021.41C132.129%20821.059%20134%20828.639%20134%20838L0%20837V704zm838-357v144c-19.803-1.415-35.027-5.729-50-19l-1.859-1.574c-13.507-12.299-19.993-30.463-21.359-48.277-.639-19.748%206.195-38.646%2019.639-53.141C798.954%20354.007%20817.215%20347%20838%20347zM0%20347c18.838%200%2036.361%205.64%2050.047%2018.943L54%20370l2.012%201.918C64.731%20380.794%2069.899%20393.939%2072%20406l.391%202.164C75.258%20427.102%2069.968%20446.445%2059%20462c-11.647%2014.693-26.437%2024.472-45%2028l-14%201V347zM347%200h144c0%2020.184-6.987%2037.746-20.937%2052.375-16.422%2015.387-35.215%2020.509-57.203%2019.965-18.992-.854-35.07-9.65-47.86-23.34-12.415-14.12-18-30.314-18-49zm117%20780c15.503%2013.247%2024.256%2029.767%2027%2050v7H347c0-19.834%207.278-37.466%2021.063-51.687%2025.708-25.4%2067.378-27.131%2095.938-5.312zM126%20627h43v42h42v43h-43v-42h-42v-43zm543%200h43v43h-42v42h-42v-43h41v-42zM168%20126h42v43h-41v41h-43v-43h42v-41zm459%200h43v42h42v42h-43v-42h-42v-42z%22/%3E%3C/svg%3E") no-repeat left / 1em;
    padding-left: calc(0.725rem + 1em);
  }
  h5 { color: var(--pink); }

  .btn-primary { --btn-color: var(--pink); }
}

a.read-more {
  text-transform: uppercase;
  font-size: clamp(12px, 1.5vw, 16px);
  letter-spacing: 0.05em;
  font-weight: 600;
  padding-top: 0.5rem;

  &::after {
    content: "›";
    font-size: 1.3em;
    line-height: 0;
    position: relative;
    right: -10px;
  }
}


.foods {
  h5[title] {
    background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2284%22%20height=%2284%22%20viewBox=%220%200%20836%20836%22%20fill=%22%23f58c29%22%3E%3Cpath%20d=%22M358.098%20112.128c3.123%201.432%205.308%203.889%207.68%206.31l1.716%201.715%205.584%205.633%203.884%203.897%2010.199%2010.273%2010.417%2010.476L418%20171c4.016-1.602%206.668-4.433%209.623-7.475l1.667-1.69%203.567-3.632%205.65-5.733%2016.058-16.301%209.837-9.966%203.741-3.812%205.234-5.302%201.553-1.617c1.452-1.44%201.452-1.44%204.071-3.471%203.802.259%205.662%202.289%208.272%204.902l2.579%202.561%202.818%202.845%203.005%202.997%208.25%208.271%208.9%208.906%2015.417%2015.442%2022.29%2022.326%2036.165%2036.219%2035.131%2035.192%202.187%202.19%2010.863%2010.875L725%20355c-1.844%203.987-4.454%206.723-7.551%209.778l-1.715%201.716-5.616%205.584-3.893%203.884-10.249%2010.199-10.457%2010.417L665%20417c5.68%206.941%2012.05%2013.177%2018.398%2019.496l3.606%203.602%209.44%209.415%209.653%209.633L725%20478c-1.475%203.41-3.384%205.637-5.999%208.259l-2.549%202.57-2.816%202.808-2.979%202.995-8.207%208.222-8.843%208.869-19.345%2019.381-12.074%2012.091-33.415%2033.454-2.161%202.162-4.337%204.338-2.175%202.175-2.177%202.178-34.94%2035.008-35.853%2035.911-20.138%2020.176-17.146%2017.163-8.751%208.767-8.009%208.006-4.274%204.308-2.564%202.53-2.211%202.213C482%20723%20482%20723%20479.904%20722.874c-3.159-1.45-5.374-3.955-7.775-6.404l-1.746-1.744-5.681-5.73-3.951-3.964-10.377-10.451-10.598-10.657L419%20663c-6.941%205.68-13.177%2012.05-19.496%2018.398l-3.602%203.606-9.415%209.44-9.633%209.653L358%20723c-3.415-1.476-5.636-3.387-8.256-6.01l-2.568-2.556-2.806-2.824-2.993-2.987-8.216-8.23-8.863-8.867-15.353-15.37-22.198-22.222-36.015-36.051-34.985-35.026-2.178-2.18-10.818-10.826L113%20480c1.844-3.987%204.454-6.723%207.551-9.778l1.715-1.716%205.616-5.584%203.893-3.884%2010.249-10.199%2010.457-10.417L173%20418c-5.68-6.941-12.05-13.177-18.398-19.496l-3.606-3.602-9.44-9.415-9.653-9.633L113%20357c1.475-3.41%203.384-5.637%205.999-8.259l2.549-2.57%202.816-2.808%202.979-2.995%208.207-8.222%208.843-8.869%2019.345-19.381%2012.074-12.091%2033.415-33.454%202.161-2.162%204.337-4.338%202.175-2.175%202.177-2.178%2034.94-35.008%2035.853-35.911%2020.138-20.176%2017.146-17.163%208.751-8.767%208.009-8.006%204.274-4.308%202.564-2.53%202.211-2.213C356%20112%20356%20112%20358.098%20112.128zM252%20250c1.621%203.689%203.927%206.551%206.438%209.688%2029.1%2037.191%2046.23%2082.578%2051.563%20129.312l.29%202.479c4.929%2047.083-3.475%2096.032-24.29%20138.521l-1.23%202.518c-8.337%2016.877-18.229%2032.325-29.907%2047.076-1.865%202.247-1.865%202.247-2.863%204.406%203.653-1.606%206.464-3.878%209.563-6.375C315.406%20535.488%20385.738%20519.011%20453%20527c46.911%206.208%2089.665%2024.991%20127.087%2053.662%201.903%201.331%203.812%202.356%205.913%203.338l-1.108-1.467C571.84%20565.204%20560.316%20547.611%20551%20528l-.996-2.056C540.076%20505.332%20533.886%20483.5%20530%20461l-.496-2.754c-4.805-27.599-4.328-57.697.496-85.246l.472-2.787c7.282-41.492%2025.476-80.221%2051.222-113.364%201.326-1.878%202.333-3.77%203.306-5.849l-1.445%201.097c-58.432%2044.134-127.426%2064.881-200.641%2055.508-46.425-6.58-89.77-25.055-126.347-54.391-1.472-1.14-3.019-2.181-4.568-3.214zM693%200c15.878%201.323%2029.202%204.991%2040.375%2016.996C739.099%2024.055%20742.978%2031.124%20745%2040l1.949-.141C758.95%2039.38%20769.241%2043.153%20779%2050l1.855%201.262c10.058%207.665%2016.013%2019.855%2018.895%2031.863.345%203.963.33%207.9.25%2011.875l1.617.445c14.685%204.421%2025.389%2013.461%2032.641%2026.883C838.03%20130.32%20839%20137.135%20839%20146H694v45h-47v-46h46V0zm-45%20645h46v46h145c-1.341%2016.094-5.164%2029.583-17.599%2040.389C814.993%20736.479%20807.468%20742%20799%20742l.141%201.949c.55%2013.759-4.491%2025.83-13.328%2036.176-9.86%2010.46-21.412%2016.456-35.875%2017.438-3.202.273-3.202.273-5.937%201.438-1.939%202.856-2.872%205.552-3.918%208.836-3.214%209.398-12.438%2017.973-20.922%2022.77-2.688%201.257-5.377%202.367-8.16%203.395l-3.5%201.313C704%20836%20704%20836%20693%20836V692h-45v-47zM146%200v145h45v46h-46v-45H0c2.195-17.564%205.514-30.771%2019.445-42.297C34%2094%2034%2094%2040%2094l-.141-1.695c-.68-15.101%205.656-27.536%2015.578-38.492C63.449%2046.132%2074.888%2040.256%2086%2039l2.539-.324A279.38%20279.38%200%200%201%2095%2038l.883-2.344C98.515%2028.968%20101.24%2023.393%20106%2018l1.891-2.242C118.087%204.542%20131.136%200%20146%200zm-1%20645h47v47h-46v144c-15.413%200-27.009-4.215-38.312-14.812C101.996%20815.17%2095%20805.599%2095%20797l-3.187.188c-14.226-.075-27.374-5.96-37.559-15.703-9.633-10.618-14.895-23.886-15.379-38.172L39%20741l-2.672-.344c-11.651-2.297-21.715-11.389-28.203-20.969C2.509%20710.191%201.006%20702.063%200%20691h145v-46zm249-252h50v51h-50v-51z%22/%3E%3C/svg%3E") no-repeat left / 1em;
    padding-left: calc(0.725rem + 1em);
  }
  h5 { color: var(--orange); }

  .btn-primary { --btn-color: var(--orange); }
}

.shop {
  h5 { color: var(--pink); }

  .today {
    color: var(--pink);
    font-weight: 700;
  }
}

.gallery {
  h5 { color: var(--blue) }

  .btn-primary { --btn-color: var(--blue); }

  .today {
    color: var(--blue);
    font-weight: 700;
  }
}

.food {
  h5 { color: var(--orange) }

  .btn-primary { --btn-color: var(--orange); }

  .today {
    color: var(--orange);
    font-weight: 700;
  }
}

.events,
.event {
  h5 { color: var(--purple) }

  .btn-primary {
    --btn-color: var(--purple);
    width: 100%;
  }

  .landing-banner {
    height: calc(100vh - 169px);
    &::after { display: none; }
    .hero { top: 0; }
  }

  .list-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
  }

  @media (max-width: 770px) {
    .list-container { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
  }
}

@media (max-width: 770px) {
  #accessibility > #family-friendly {
    border-top: 1px solid var(--navy);
    padding-top: 2rem;
  }
}

main.news .list-container {
  grid-template-columns: repeat(2, 1fr);

  @media (max-width: 770px) { grid-template-columns: 1fr; }
}

.store, .event {
  h5 { margin-bottom: 1rem }

  h6, h7 { display: block; margin: 1.75rem 0 }

  table#storeHours td { font-size: clamp(12px, 1.7vw, 20px); }

  .social { margin: 1.75rem 0 }

  p {
    margin: 1rem 0;
  }
}

.two-col-30 {
  display: flex;
  gap: 5rem;
  flex-wrap: wrap;

  > :first-child { flex: 840px 1 1; }
  > :last-child { flex: 320px 1 1; }

  @media (max-width: 770px) { gap: 1.5rem; }
}

.hours-notes {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* Hours Display Component */
table {
  caption {
    background-color: var(--navy);
    color: white;
    padding: 10px 0;
  }

  width: 100%;
  border-collapse: collapse;
  padding: 0;
  margin: 0;

  td {
    padding: 8px 0;
    border-bottom: 1px solid var(--navy);
    font-size: 14px;

    &:last-child {
      text-align: right;
      text-transform: uppercase;
    }
  }

  .today {
    color: var(--navy);
    font-weight: 700;
  }
}

img.village-map {
  width: 100%;
  height: 500px;
  object-fit: cover;
}

/* Events Show Page */

.event {
  padding-bottom: 2.5rem;

  .video {
    width: 100%;
    height: clamp(200px, 30vw, 500px);
    background-color: var(--gray);
    margin: 1.5rem 0 1rem 0;
    video { height: 100% }
  }

  .event-meta--date {
    --event-meta-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E");
  }

  .event-meta--time {
    --event-meta-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E");
  }

  .event-meta--location {
    --event-meta-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-7.5 8-13a8 8 0 1 0-16 0c0 5.5 8 13 8 13Z'/%3E%3Ccircle cx='12' cy='9' r='2.5'/%3E%3C/svg%3E");
  }

  .event-meta {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    line-height: 1;
    margin: 2rem 0;
    font-size: clamp(12px, 1.3vw, 16px);

    &::before {
      content: "";
      width: 25px;
      height: 25px;
      background-color: var(--navy);
      -webkit-mask: var(--event-meta-icon) center / auto no-repeat;
              mask: var(--event-meta-icon) center / auto no-repeat;
    }
  }

  .top-section {
    background-color: var(--purple-light);
    position: relative;
    z-index: 1;

    .top-title {
      margin: auto 0 0;

      @media (min-width: 770px) {
        padding: 2rem clamp(1.5rem, 4vw, 3rem);
      }
    }

    .content-wrapper {
      background-color: var(--purple-light);
      box-shadow: none;
      clip-path: unset;
      overflow: visible;
      grid-template-columns: 1fr 1fr;

      > div:last-child {
        margin-right: min(0px, calc((1396px - 100vw) / 2));
      }

      @media (min-width: 770px) {
        padding: 0;
      }

      @media (max-width: 770px) {
        grid-template-columns: 100%;

        > div:first-child {
          padding-inline: clamp(1.5rem, 4vw, 3rem);
        }

        > div:last-child {
          margin-right: 0;
        }
      }
    }
  }

  ul {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-left: 1rem;
    font-size: clamp(12px, 1.7vw, 20px);
    line-height: clamp(20px, 2.5vw, 40px);
    font-weight: bold;
  }

  .schedule-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;

    span:last-child { white-space: nowrap; flex-shrink: 0; }
  }
}

.social {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;

  a {
    background: var(--navy);
    width: clamp(2rem, 4vw, 4rem);
    height: clamp(2rem, 4vw, 4rem);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    margin-right: 0.5rem;

    svg {
      fill: var(--cream);
    }
  }
}

/* Dialog modals styles */

dialog {
  height: 80dvh;
  width: 80dvw;
  padding: 0;

  &::before {
    content: "✕";
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    font-size: 2.25rem;
    line-height: 1;
    color: grey;
    cursor: pointer;
    z-index: 10;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    padding: 10px;
  }

  &::backdrop {
    background: color-mix(in srgb, var(--navy) 55%, transparent);
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity 250ms ease,
                display 300ms allow-discrete, overlay 300ms allow-discrete;
  }

  &[open]::backdrop { opacity: 1; }

  @starting-style { &[open]::backdrop { opacity: 0; } }
}

/* Newsletter Page */

.newsletter {
  .content-wrapper {
    display: grid;
    gap: 1.5rem;

    @media (max-width: 770px) {
      > hr { display: none; }
    }
  }

  form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(2rem, 6vw, 6rem);
    row-gap: 0;

    .required-note {
      grid-column: 1 / -1;
      margin: 0 0 1rem;
    }

    .form-fields,
    .form-consents {
      display: flex;
      flex-direction: column;
      min-width: 0;
    }

    .form-consents {
      margin-top: 2rem;
      gap: 2rem;

      fieldset { margin-top: 0; }

      .btn.btn-primary { margin-top: auto; align-self: stretch; margin-bottom: 0; }
    }

    .response {
      grid-column: 1 / -1;
      margin-top: 1rem;
      padding: 0.75rem 1rem;
      border-radius: 4px;
      font-size: 1.25rem;
      line-height: 1.4;

      &[hidden] { display: none; }
      &[data-state="success"] { background: #e6f4ea; color: #1e7e34; }
      &[data-state="error"] { background: #fce8e6; color: #b00020; }
      a { text-decoration: underline; color: inherit; }
    }

    @media (max-width: 770px) {
      grid-template-columns: 1fr;

      .form-consents {
        margin-top: 3rem;

        .btn.btn-primary { width: 100%; }
      }
    }
  }
}

/* Contacts Page */

.contacts {
  .content-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(2rem, 6vw, 6rem);
    row-gap: 1.5rem;

    > section:first-of-type {
      grid-column: 1 / -1;
      display: grid;
      gap: 1.25rem;

      p { max-width: 60ch; }
    }

    > hr { grid-column: 1 / -1; }

    @media (max-width: 770px) {
      grid-template-columns: 1fr;
    }
  }

  address {
    font-style: normal;
    display: grid;
    gap: 1rem;
    align-content: start;

    section {
      display: grid;
      gap: 1rem;
    }

    section:last-of-type hr { display: none; }

    @media (max-width: 770px) {
      section:last-of-type hr { display: block; }
    }
  }

  aside {
    display: grid;
    gap: 1rem;
    align-content: start;

    section { display: grid; gap: 1rem; }

    section:has(.social) { gap: 2rem; }
  }

  .social { padding-bottom: 2rem; }

  .btn-primary {
    margin-bottom: 1rem;

    &:last-of-type {
      background-color: var(--pink-40);
    }
  }

  nav:not(.social) {
    margin-top: 2rem;
  }
}

/* Leasing Page & Filming & Photography Page */

.leasing,
.filming-photography,
.privacy {
  padding-bottom: 2rem;
  .btn-primary { margin-bottom: 2rem; }

  ul {
    padding-left: 2rem;
    margin-bottom: 0.75rem;
  }
}

.filming-photography,
.privacy {
  ul:last-of-type + hr { display: none; }
}

.leasing {
  .content-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: clamp(2rem, 6vw, 6rem);
    row-gap: 2rem;

    > section:first-of-type {
      grid-column: 1 / -1;
      display: grid;
      gap: 2rem;

      p { max-width: 70ch; }
    }

    > hr { grid-column: 1 / -1; }

    @media (max-width: 770px) {
      grid-template-columns: 1fr;

      > hr { display: none; }
    }
  }

  .leasing-intro {
    display: grid;
    gap: 3rem;
    align-content: start;

    hr { display: none; }

    @media (max-width: 770px) {
      hr { display: block; }
    }
  }

  .leasing-sections {
    display: grid;
    gap: 2rem;
    align-content: start;

    section {
      display: grid;
      gap: 2rem;
    }

    section:last-of-type hr { display: none; }

    @media (max-width: 770px) {
      section:not(:last-of-type) hr { display: block; }
    }
  }
}

.filming-photography {
  .content-wrapper > section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(2rem, 5vw, 5rem);

    @media (max-width: 770px) {
      grid-template-columns: 1fr;
      gap: 1.5rem;
    }

    p { margin: 0 0 1rem; }
    ul { margin-bottom: 1rem; }
    article:first-of-type::after { display: none; }
  }
}

.call-for-submission {
  @media (max-width: 770px) {
    .content-wrapper > hr { display: none; }
  }

  .content-wrapper > section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: start;

    @media (max-width: 770px) {
      grid-template-columns: 1fr;
      gap: 1.5rem;
    }

    > article:first-of-type {
      display: grid;
      gap: 3rem;
      align-content: start;
      h6 { margin: 0; }
      &::after { display: none; }
    }
  }
}

/* Pagination */
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 3rem 0 2rem;

  .pages {
    display: flex;
    gap: 0.5rem;
  }

  a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--navy);
    color: var(--navy);
    text-decoration: none;
    font-size: 0.9rem;
    transition: background-color 0.2s ease, color 0.2s ease;
    padding: 0.6rem 1.2rem;

    &:hover {
      background-color: var(--navy);
      color: var(--cream);
    }
  }

  button {
    padding: 0.6rem 1.2rem;
    border: 1px solid var(--navy);
    color: var(--navy);
    text-decoration: none;
    font-size: 0.9rem;
    transition: background-color 0.2s ease, color 0.2s ease;

    &:disabled {
      background-color: #D1D5DB;
      cursor: not-allowed;
    }
  }
}

/* Blog show layout */
.blog-show__main {
  min-width: 0;
  display: grid;
  gap: 1.5rem;
}

.blog-show__sidebar {
  display: none;
}

@media (min-width: 992px) {
  .blog-show {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
    gap: 4rem;
    align-items: start;
  }

  .blog-show__sidebar {
    display: block;

    h6 {
      margin: 0 0 1.5rem;
      letter-spacing: 0.05em;
    }

    ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
    }

    li {
      border-bottom: 1px solid var(--navy);

      &:first-child {
        border-top: 1px solid var(--navy);
      }
    }

    a {
      display: block;
      padding: 0.85rem 0;
      color: var(--navy);
      text-decoration: none;
      font-size: 1rem;

      &:hover {
        text-decoration: underline;
      }
    }
  }
}

/* Blog post nav */
.blog-post-nav {
  margin-top: 2rem;

  hr {
    margin: 0;
  }
}

.blog-post-nav__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem 0;
  font-size: 0.9rem;
  letter-spacing: 0.05em;

  a {
    color: var(--navy);
    text-decoration: none;

    &:hover {
      text-decoration: underline;
    }
  }
}

/* History Page */

main.history {
  .content-wrapper {
    .cover {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 3 / 2;
      padding: clamp(1rem, 3vw, 3rem);
      box-sizing: border-box;
      object-fit: contain;
      background: var(--navy);
    }

    .cover + hr,
    .block + hr {
      position: relative;
      z-index: 1;
      height: 21px;
      margin: 12px 0;
      border: none;
      background: transparent url('/assets/images/history/line.webp');
    }

    .block {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: clamp(1rem, 2.5vw, 2rem);
      align-items: stretch;

      @media (max-width: 770px) {
        grid-template-columns: 1fr;
      }

      &:nth-of-type(even) {
        .text    { order: 2; }
        .collage { order: 1; }
      }

      &[id]:nth-of-type(odd) .collage img:first-child {
        order: 3;
      }

      .text {
        position: relative;
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
        gap: clamp(1.5rem, 4vw, 4rem);
        padding: clamp(2rem, 5vw, 4rem) clamp(1.5rem, 4vw, 3rem);
        overflow: hidden;

        &::before {
          content: '';
          position: absolute;
          inset: 0;
          z-index: 0;
          background: var(--block-bg) center / cover;
          opacity: 0.25;
          pointer-events: none;
        }

        > * { position: relative; z-index: 1; }
      }

      .label {
        display: flex;
        align-items: center;
        align-self: start;
        justify-self: start;
        gap: 1rem;
        font-family: var(--font-caslon);
        font-size: clamp(35px, 4vw, 40px);
        line-height: 1;
        letter-spacing: 0.1em;
        writing-mode: vertical-rl;
        text-orientation: mixed;
        transform: rotate(180deg);

        &::before,
        &::after {
          content: '';
          width: clamp(25px, 4vw, 40px);
          aspect-ratio: 1;
          background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%2284%22%20height=%2284%22%20viewBox=%220%200%20838%20838%22%20fill=%22%23252159%22%3E%3Cpath%20d=%22M418.993%20127.868c2.972%201.676%205.227%203.955%207.597%206.369l1.676%201.671%205.545%205.58%203.982%203.986%208.571%208.606%2013.567%2013.616%2021.476%2021.554%2038.414%2038.545%2013.471%2013.524%208.405%208.438%203.879%203.9c7.633%207.751%207.633%207.751%2015.693%2015.048%203.756%203.196%206.923%206.791%2010.182%2010.484%205.113%205.646%2010.569%2010.964%2015.961%2016.34l3.994%203.995%2010.765%2010.752%2011.279%2011.271%2021.323%2021.302%2024.29%2024.269L709%20417c-1.564%203.753-3.884%206.132-6.744%208.99l-1.48%201.487-4.95%204.937-3.569%203.574-9.837%209.824-10.597%2010.593-18.37%2018.354-26.561%2026.537-43.089%2043.053-41.865%2041.824-2.605%202.604-12.939%2012.931L419%20709c-3.741-1.562-6.123-3.869-8.977-6.717l-1.483-1.472-4.923-4.92-3.564-3.548-9.795-9.78-10.562-10.536-23.087-23.051-14.403-14.386-39.846-39.807-2.575-2.575-5.169-5.168-2.592-2.591-2.595-2.594-41.701-41.633-42.772-42.715-24.032-23.994-20.446-20.429-10.444-10.428-9.538-9.541-3.472-3.456-4.675-4.69-2.637-2.634C128%20420%20128%20420%20128.082%20417.859c1.532-3.101%204.002-5.339%206.44-7.735l1.764-1.769%205.891-5.856%204.208-4.204%209.082-9.047%2014.357-14.308%2022.712-22.634%2040.657-40.525%2014.275-14.221%208.883-8.851%204.121-4.101%205.625-5.604%201.649-1.634c2.977-2.978%205.631-6.082%208.254-9.37a73.99%2073.99%200%200%201%203.434-2.999c6.21-5.321%2011.869-11.215%2017.62-17.021l3.915-3.939%208.386-8.443%2013.262-13.334%202.266-2.276%204.585-4.603%2030.846-31.022%2020.854-20.961%2011.023-11.091%2010.352-10.401%203.797-3.833%205.184-5.196%201.516-1.563c3.345-3.278%203.345-3.278%205.953-3.452zm-5.113%2062.004l-1.707%201.728-1.804%201.803-5.909%205.941-4.094%204.103-10.781%2010.831-10.999%2011.039L357%20247c1.51%203.021%203.739%203.143%206.875%204.25%2016.576%206.202%2030.351%2016.294%2040.813%2030.688%203.13%204.139%205.27%205.736%2010.313%207.063%206.261.696%2010.919-.135%2016-4%202.911-3.158%205.456-6.544%208-10%2010.28-13.745%2026.237-21.29%2042-27-5.736-7.003-12.155-13.319-18.547-19.715l-3.659-3.669-7.635-7.642-9.792-9.823-7.541-7.553-3.612-3.626-5.033-5.034-1.508-1.525c-4.461-4.42-5.415-3.896-9.793.459zm-165.256%20165.38l-1.888%201.898-1.981%201.98-6.509%206.526-4.502%204.506-11.871%2011.896-12.105%2012.125L186%20418c1.65%204.256%204.829%207.096%208.01%2010.237l1.863%201.864%206.103%206.071%204.229%204.22%2011.136%2011.087%2011.361%2011.322L251%20485c1.961-2.941%202.521-5.084%203.191-8.496%202.002-10.108%205.725-18.588%2010.809-27.504l1.43-2.578c5.313-8.74%2013.411-16.256%2021.633-22.234%204.086-3.07%205.708-5.183%206.938-10.187.169-5.309-.612-7.981-4-12.062-3.321-3.484-6.987-6.354-10.816-9.254C266.457%20382.1%20259.524%20366.969%20254%20351c-2.277%200-3.842%202.721-5.376%204.252zM584%20351l-1.066%202.859c-7.246%2019.017-17.48%2033.549-33.809%2045.828-4.504%203.421-4.504%203.421-7.125%208.313-.259%204.717-.03%207.817%203.145%2011.465%202.518%202.235%205.065%204.274%207.765%206.275%2018.249%2013.577%2029.609%2032.709%2033.09%2055.26%203.78%200%204.72-1.367%207.308-3.935l1.724-1.757%201.834-1.832%205.99-6.039%204.157-4.17%2010.934-11.008%2011.161-11.22L651%20419c-1.657-4.29-4.886-7.16-8.086-10.329l-1.888-1.893-6.186-6.168-4.289-4.288-8.991-8.967-11.548-11.528-8.856-8.843-4.26-4.254-5.94-5.919-1.793-1.794c-2.221-2.748-2.221-2.748-5.164-4.017zM401%20546l-3.5%204c-13.856%2016.119-32.982%2023.509-53.5%2027%204.066%204.88%208.328%209.469%2012.832%2013.945l1.983%201.983%206.428%206.411%204.481%204.476%2011.748%2011.723%2012.006%2011.986L417%20651c2.883-1.307%204.946-2.697%207.176-4.936l1.827-1.819%201.968-1.99%202.1-2.099%206.85-6.883%204.758-4.767%2012.507-12.557%2012.769-12.809L492%20578l-1-2a128.33%20128.33%200%200%200-7.187-1.75c-19.061-4.486-34.911-14.45-47.5-29.562-4.128-4.841-7.894-7.102-14.187-8.625-8.901-.67-15.174%203.803-21.125%209.938zm269%2039h85v85h-61v21h144c0%2014.92-4.137%2027.204-14.258%2038.348-5.504%205.22-10.906%208.452-18.18%2010.527-3.125%201.029-3.125%201.029-5.562%203.125-1.675%204.916-2.137%209.744-2.693%2014.883-1.792%2012.35-10.428%2022.142-19.499%2030.039C767.27%20795.72%20755.848%20798.483%20743%20798l-.187%202.375c-2.74%2012.224-11.432%2021.755-21.281%2029.09C712.439%20834.979%20703.493%20837%20693%20837V692h-22v62h-85v-85h61v-23h22v-19l1-42zm-586%201h85v60h22v23h62v85h-85v-62h-22v145c-16.711-1.285-29.27-5.224-40.891-17.441C99.565%20812.834%2095.491%20805.616%2094%20797l-1.949.141c-13.906.555-25.604-4.732-36.238-13.391C46.818%20775.445%2040.842%20764.141%2039%20752a105.72%20105.72%200%200%201-.062-5.312l.027-2.676L39%20742l-1.871-.445C30.463%20739.789%2025.458%20737.182%2020%20733l-2.094-1.559C8.057%20723.543%201.849%20711.438%200%20699v-8h145v-21H84v-84zM146%201v144h22V85h84v84h-61v23h-22v61H84v-85l61-1v-21H0c0-15.331%204.809-27.446%2015.375-38.637C22.137%20101.275%2029.921%2096.424%2039%2095l.078-2.422c.836-16.179%206.57-29.29%2018.41-40.508C68.886%2042.676%2080.434%2039.314%2095%2040l.188-2.375C97.378%2027.851%20103.047%2020.965%20110%2014l1.75-1.785C121.336%203.205%20133.297%201%20146%201zm547%200c15.459%200%2027.399%204.982%2038.637%2015.469C737.183%2022.409%20744%2031.524%20744%2040l2.676.078c14.937.706%2028.83%205.857%2039.324%2016.922%209.373%2011.296%2014%2024.325%2014%2039l2.633.305c11.291%202.332%2021.094%2011.195%2027.617%2020.32%206.212%209.782%207.75%2017.777%207.75%2029.375H694v22h60v85h-85v-61h-22v-23h-61V85h84v60h23V1zm145%20346v144c-19.803-1.415-35.027-5.729-50-19l-1.859-1.574c-13.507-12.299-19.993-30.463-21.359-48.277-.639-19.748%206.195-38.646%2019.639-53.141C798.954%20354.007%20817.215%20347%20838%20347zM0%20347c18.451%200%2036.372%205.458%2049.77%2018.676L52%20368l2.324%202.23C65.732%20381.794%2072.064%20397.889%2073%20414l.16%202.219c.713%2018.588-6.321%2036.944-18.41%2050.906C39.285%20483.597%2022.289%20489.408%200%20491V347zM347%200h144c0%2020.184-6.987%2037.746-20.937%2052.375-16.422%2015.387-35.215%2020.509-57.203%2019.965-18.992-.854-35.07-9.65-47.86-23.34-12.415-14.12-18-30.314-18-49zm117%20780c15.101%2012.904%2024.22%2029.204%2027%2049v8H347c0-19.834%207.278-37.466%2021.063-51.687%2025.708-25.4%2067.378-27.131%2095.938-5.312z%22/%3E%3C/svg%3E");
          background-size: contain;
          background-repeat: no-repeat;
        }
      }

      .body {
        display: flex;
        flex-direction: column;
        gap: 1rem;

        p {
          margin: 0;
          max-width: 52ch;
          font-family: var(--font-montserrat);
          font-size: clamp(13px, 1.3vw, 18px);
          line-height: 1.5;
          color: var(--navy);
        }
      }

      .notes {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        margin: 0;
        padding: 1.5rem 0 0;
        list-style: decimal inside;
        font-family: var(--font-montserrat);
        font-size: clamp(10px, 0.9vw, 13px);
        line-height: 1.4;
        color: var(--navy-80);

        li::marker { content: counter(list-item) ") "; }
      }

      .collage {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;

        img {
          display: block;
          width: 100%;
          height: auto;
          aspect-ratio: 4 / 3;
          object-fit: cover;
        }

        img:first-child { grid-column: 1 / -1; }
      }
    }
  }
}

/* Search dialog */

.search-dialog {
  border: none;
  background: transparent;
  margin: 0;
  opacity: 0;
  transition: opacity 250ms ease, transform 300ms cubic-bezier(0.34, 1.2, 0.64, 1),
              display 300ms allow-discrete, overlay 300ms allow-discrete;

  &[open] {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }

  &::before { display: none; }

  @starting-style {
    &[open] {
      opacity: 0;
      transform: translateX(-50%) translateY(-2rem);
    }
  }

}

.search-modal-card {
  background: var(--navy);
  color: var(--cream);
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.search-close-btn {
  background: transparent;
  border: none;
  color: var(--cream-60);
  cursor: pointer;
  &:hover { color: var(--cream); }
}

.search-modal-card input[type="search"] {
  border: none;
  border-bottom: 1px solid var(--cream-40);
  color: var(--cream);
  font-size: clamp(16px, 2vw, 18px);
  padding: 1rem 3.25rem 1rem 1rem;

  &::placeholder { color: var(--cream-60); }
  &::-webkit-search-cancel-button { display: none; }
  &::-moz-search-clear-button { display: none; }
}

.search-results {
  opacity: 0;
  pointer-events: none;
  transition: max-height 300ms cubic-bezier(0.4, 0, 0.2, 1),
              opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);

  li { transition: height 250ms cubic-bezier(0.4, 0, 0.2, 1), opacity 200ms ease; }

  li[data-hidden] {
    height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    border: none;
  }

  .search-result-group-header {
    text-align: left;
    pointer-events: none;

    & > div {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 0.4rem;
      padding: 0.9rem 1.25rem 0.4rem;
      font-size: 10px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: var(--cream-60);
    }

    svg {
      width: 16px;
      height: 16px;
    }
  }
}

.search-dialog:has(#searchInput[aria-expanded="true"]) .search-results {
  max-height: min(360px, calc(100dvh - var(--header-height) - 4rem));
  overflow-y: auto;
  opacity: 1;
  pointer-events: auto;
}

.search-results [role="option"] {
  cursor: pointer;
  border-bottom: 1px solid var(--cream-40);
  text-align: left;
  transition: background 200ms ease;

  & > a {
    display: block;
    padding: 0.75rem 1.25rem;
  }

  &:last-child { border-bottom: none; }

  &:hover,
  &[aria-selected="true"] {
    background: color-mix(in srgb, var(--cream) 12%, var(--navy));
  }
}

.search-result-title {
  display: block;
  font-weight: 500;
  font-size: clamp(15px, 2vw, 17px);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
  text-decoration: none;
}

.search-results[data-no-results]::after {
  content: "No results found";
  display: block;
  padding: 1.25rem;
  font-size: 14px;
  color: var(--cream-60);
  text-align: center;
}

.error {
  hgroup {
    text-align: center;
    justify-items: center;
  }

  .btn-primary {
    width: fit-content;
    margin-inline: auto;
  }
}

/* About Page */

main.about {
  h3#village-map { margin-bottom: 2rem; }

  .about-feature {
    display: flex;
    flex-direction: row;
    gap: 3rem;
    align-items: flex-start;
    justify-content: space-between;

    article {
      flex: 0 0 42%;
      gap: 2.5rem;
    }

    figure {
      flex: 1;
      margin: 0;
      aspect-ratio: 4 / 3;
      overflow: hidden;
      max-width: 48.5%;

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
      }
    }
  }

  .about-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;

    h3 { margin-bottom: 2rem; }

    figure {
      margin: 1rem 0;
      aspect-ratio: 4 / 3;
      overflow: hidden;

      img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
      }
    }
  }

  @media (max-width: 770px) {
    .about-feature {
      flex-direction: column;
      align-items: stretch;
      gap: 1.5rem;

      article { display: contents; }

      h3 { order: 0; }
      figure {
        order: 1;
        max-width: 100%;
      }
      p { order: 2; }
      .btn {
        order: 3;
        width: 100%;
        max-width: 100%;
      }
    }

    .about-pair { grid-template-columns: 1fr; }
  }
}

@media (min-width: 770px) {
  .food, .gallery, .shop, .event {
    .hero {
      display: none;
    }

    .landing-banner {
      display: none;
    }
  }
}

.hero-desc {
  height: 100%;
  position: relative;
  overflow: hidden;
  isolation: isolate;

  img {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }

  video.videobgframe {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    opacity: 0;
    transition: opacity 1s;
    background: transparent;

    &.loaded { opacity: 1; }
  }
}

@media (max-width: 770px) {
  .hero-desc {
    display: none;
  }
}

.gift-cards .btn {
  margin-top: 2rem;
  width: 360px;
}

.magazines .list-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3rem;

  .card {
    gap: 0;
    width: fit-content;
    align-items: center;

    a { width: auto; }

    img { aspect-ratio: 3 / 4; }
  }

  @media (max-width: 770px) { grid-template-columns: 1fr; }
}
