/*
 * Responsive condiviso rilevato direttamente dal sito Elementor originale.
 * Caricato per ultimo su tutte le pagine.
 */

html {
  scrollbar-gutter: stable;
}

.mobile-nav-logo,
.mobile-nav-contact {
  display: none;
}

.nav a[aria-current="page"] {
  color: var(--sage);
  opacity: 1;
}

body[data-page="events"] .events-intro__copy h1 {
  margin-bottom: 40px;
}

body[data-page="locale"] .locale-story__copy p {
  color: var(--ink);
  font: 300 18px/26px var(--body);
}

/* Fixed desktop heights read from the original Elementor containers. */
@media (min-width: 1025px) {
  body[data-page="events"] .events-hero,
  body[data-page="locale"] .locale-hero {
    height: 490px;
    min-height: 490px;
    max-height: none;
    background-position: center;
  }

  body[data-page="menu-choice"] .menu-choice-reference__hero {
    height: 350px;
  }

  body[data-page="menu"] .menu-reference__masthead {
    height: 350px;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  body[data-page="events"] .events-hero,
  body[data-page="locale"] .locale-hero {
    height: 49vh;
    min-height: 0;
    max-height: none;
  }

  body[data-page="menu-choice"] .menu-choice-reference__hero {
    height: 35vh;
  }

  body[data-page="home"] .home-hero {
    height: 100svh;
    min-height: 0;
  }

  body[data-page="home"] .home-coffee {
    width: 100%;
    height: 1295px;
    padding: 80px 40px;
  }

  body[data-page="home"] .home-coffee__inner {
    height: 1135px;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  body[data-page="home"] .home-coffee__copy {
    width: 100%;
    height: 535px;
    flex: 0 0 535px;
    padding: 30px;
  }

  body[data-page="home"] .home-coffee__photos {
    width: 100%;
    height: 600px;
    max-width: none;
    flex: 0 0 600px;
  }

  body[data-page="home"] .home-day {
    height: 684px;
    padding: 0 0 80px;
  }

  body[data-page="home"] .home-day__panel {
    width: 67%;
    height: 604px;
    margin-left: 33%;
    padding: 250px 50px 38px;
    border-radius: 15px 0 0 15px;
  }

  body[data-page="home"] .home-day__title {
    top: 80px;
    left: calc(33% + 50px);
    right: 50px;
    font-size: 80px;
    line-height: 82px;
    white-space: normal;
    color: #fff;
    background: none;
    -webkit-text-fill-color: #fff;
    transform: none;
    will-change: auto;
  }

  body[data-page="home"] .home-sandwich {
    height: 537px;
    padding: 70px 20px;
  }

  body[data-page="home"] .home-sandwich > h2 {
    font-size: 36px;
    line-height: 42px;
  }

  body[data-page="home"] .home-menu-promo {
    height: 818.1875px;
    padding: 0 40px;
  }

  body[data-page="home"] .home-menu-promo__inner {
    height: 100%;
    padding: 80px 0;
  }

  body[data-page="home"] .home-menu-promo__card {
    width: 100%;
    height: 100%;
    padding: 20px;
  }

  body[data-page="home"] .home-menu-promo__surface {
    height: 100%;
    min-height: 0;
    padding: 120px 20px;
  }

  body[data-page="home"] .home-menu-promo__card h2 {
    font-size: 60px;
    line-height: 75px;
  }

  body[data-page="home"] .home-photo-grid {
    height: 546.390625px;
    padding: 0 20px 40px;
  }

  body[data-page="home"] .home-photo-card {
    min-height: 0;
    height: 506.390625px;
  }

  body[data-page="home"] .home-location {
    height: 597px;
  }

  body[data-page="menu"] .menu-reference__section .menu-reference__inner {
    padding-right: 30px;
    padding-left: 30px;
  }

  body[data-page="menu"] .menu-reference__masthead {
    height: 35vh;
  }

  body[data-page="menu"] .menu-reference__nav {
    height: 68px;
  }

  body[data-page="menu"] .menu-reference__nav > div {
    justify-content: center;
    align-items: flex-start;
    gap: 20px;
    overflow: visible;
  }

  body[data-page="menu"] .menu-reference__nav a {
    height: 48px;
    padding: 8px 15px;
    font-size: 16px;
    line-height: 30px;
  }

  body[data-page="menu"] .menu-reference__nav a:nth-child(-n + 2) {
    height: 44px;
    padding: 6px;
  }

  body[data-page="menu"] .menu-reference__section:first-child .menu-reference__inner {
    padding-top: 70px;
  }

  body[data-page="menu"] .menu-reference__inner > h2 {
    line-height: 58px;
  }

  body[data-page="events"] .events-intro {
    height: 643px;
    padding: 0;
  }

  body[data-page="events"] .events-intro__inner {
    display: block;
    width: calc(100% - 80px);
    margin: 0 auto;
    padding: 80px 0;
  }

  body[data-page="events"] .events-intro__photos {
    display: none;
  }

  body[data-page="events"] .events-intro__copy {
    padding: 30px;
  }

  body[data-page="events"] .events-intro__copy h1 {
    margin-bottom: 40px;
    font-size: 70px;
    line-height: 75px;
  }

  body[data-page="events"] .events-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body[data-page="locale"] .locale-story {
    height: 2345.171875px;
  }

  body[data-page="locale"] .locale-story__copy h1 {
    top: 0;
  }

  body[data-page="locale"] .locale-pets {
    height: 398.328125px;
  }

  body[data-page="locale"] .locale-pets__inner {
    height: 298.328125px;
  }

  body[data-page="contact"] .contact-reference__top {
    width: 90%;
    height: 1709px;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 80px 0;
  }

  body[data-page="contact"] .contact-reference__info {
    width: 100%;
    height: 599px;
    flex: 0 0 599px;
    padding: 30px;
  }

  body[data-page="contact"] .contact-reference__image {
    width: 800px;
    max-width: 100%;
    height: 950px;
    aspect-ratio: auto;
    object-fit: cover;
  }

  body[data-page="contact"] .contact-reference__form-section {
    height: 1061.296875px;
  }

  body[data-page="menu-choice"] .menu-choice-reference__cards {
    height: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, 280px);
  }

  body[data-page="menu-choice"] .menu-choice-reference__card,
  body[data-page="menu-choice"] .menu-choice-reference__card:nth-child(n+4) {
    grid-column: span 1;
  }
}

@media (max-width: 767px) {
  body[data-page="events"] .events-intro__copy h1 {
    margin-bottom: 28px;
  }

  body[data-page="locale"] .locale-story__copy p {
    font-size: 16px;
    line-height: 24px;
  }

  body[data-page="menu"] .menu-reference__nav a {
    height: 42px;
    padding: 5px;
    font-size: 12px;
    line-height: 30px;
  }

  body[data-page="menu"] .menu-reference__masthead h1 {
    line-height: 66px;
  }

  body[data-page="menu"] .menu-reference__masthead h2 {
    margin-top: 20px;
  }

  body[data-page="home"] .home-hero {
    height: 100svh;
    min-height: 0;
  }

  body[data-page="home"] .home-coffee {
    height: 1084px;
    padding: 0 0 40px;
  }

  body[data-page="home"] .home-coffee__inner {
    height: 1044px;
  }

  body[data-page="home"] .home-coffee__copy {
    height: 744px;
    flex: 0 0 744px;
  }

  body[data-page="home"] .home-coffee__photos {
    height: 300px;
    flex: 0 0 300px;
    padding: 0;
  }

  body[data-page="home"] .home-coffee__track {
    height: 300px;
    grid-auto-columns: 300px;
    gap: 15px;
  }

  body[data-page="home"] .home-coffee__photos img {
    width: 300px;
    height: 300px;
    aspect-ratio: auto;
  }

  body[data-page="home"] .home-day {
    height: 850px;
    padding: 0 0 80px;
  }

  body[data-page="home"] .home-day__panel {
    width: 100%;
    height: 770px;
    margin: 0;
    padding: 230px 50px 20px;
    border-radius: 0;
  }

  body[data-page="home"] .home-day__title {
    top: 80px;
    left: 50px;
    right: 50px;
    font-size: 50px;
    line-height: 48px;
  }

  body[data-page="home"] .home-sandwich {
    height: 610px;
    padding: 50px 20px;
  }

  body[data-page="home"] .home-sandwich__inner {
    height: 439px;
  }

  body[data-page="home"] .home-menu-promo {
    height: 627.1875px;
  }

  body[data-page="home"] .home-photo-grid {
    height: 798px;
  }

  body[data-page="home"] .home-location {
    height: 980px;
    grid-template-rows: 597px 383px;
  }

  body[data-page="home"] .home-location__map {
    height: 597px;
    min-height: 597px;
  }

  body[data-page="home"] .home-location__copy {
    height: 383px;
    padding: 40px;
  }

  body[data-page="home"] .home-location__copy h2 {
    font-size: 32px;
    line-height: 40px;
  }

  body[data-page="contact"] .contact-reference__top {
    width: 90%;
    height: 982.78125px;
    padding: 0;
    gap: 0;
  }

  body[data-page="contact"] .contact-reference__info {
    width: 100%;
    height: 542px;
    flex: 0 0 542px;
    padding: 35px 0;
  }

  body[data-page="contact"] .contact-reference__image {
    order: -1;
    width: 100%;
    height: 440.78125px;
    flex: 0 0 440.78125px;
    padding-top: 40px;
    aspect-ratio: auto;
    object-fit: cover;
  }

  body[data-page="contact"] .contact-reference__form-section {
    height: 1129.65625px;
  }
}

@media (max-width: 1024px) {
  .nav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    z-index: 2147483631;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: min(400px, 100%);
    max-width: 100%;
    height: 100vh;
    height: 100dvh;
    gap: 0;
    padding: 40px 20px 40px;
    overflow: auto;
    background: #fff;
    color: var(--green);
    visibility: hidden;
    transform: translateX(100%);
    transition:
      transform 1.5s ease,
      visibility 0s linear 1.5s;
  }

  .nav.open {
    visibility: visible;
    transform: none;
    transition:
      transform 1.5s ease,
      visibility 0s linear 0s;
  }

  .nav .mobile-nav-logo {
    display: block;
    width: 100px;
    height: 100px;
    margin: 0 0 20px;
    object-fit: contain;
  }

  .nav > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 46px;
    padding: 13px 20px;
    color: var(--green);
    text-transform: uppercase;
    font: 300 16px/20px var(--body);
  }

  .mobile-nav-contact {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
  }

  .nav .mobile-nav-phone {
    display: grid;
    place-items: center;
    width: 62px;
    height: 61px;
    min-height: 61px;
    flex: 0 0 61px;
    padding: 14px;
    border: 2px solid var(--sage);
    border-radius: 500px;
    color: var(--sage);
    text-decoration: none;
    transition: .3s;
  }

  .mobile-nav-phone svg {
    display: block;
    width: 25px;
    height: 25px;
    fill: currentColor;
    transform: translateY(-2px);
  }

  .mobile-nav-social {
    display: flex;
    gap: 5px;
    margin-top: 20px;
  }

  .mobile-nav-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding: 0;
    border-radius: 10%;
    background: var(--sage);
    color: #fff;
    transition: .3s;
  }

  .mobile-nav-social svg {
    width: 25px;
    height: 25px;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 3.5;
  }

  .mobile-nav-social .social-dot {
    fill: currentColor;
    stroke: none;
  }

  .menu-toggle {
    position: relative;
    z-index: 2147483632;
    font-size: 0;
  }

  .menu-toggle::before {
    content: "☰";
    font: 400 24px/1 Arial,sans-serif;
  }

  .menu-open {
    overflow: hidden;
  }

  .menu-open::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 99;
    background: rgba(0, 0, 0, .8);
  }

  .menu-open .brand {
    visibility: hidden;
  }

  .menu-open .site-header {
    background: transparent;
  }

  .menu-open .menu-toggle {
    position: fixed;
    top: 10px;
    right: 10px;
    width: 25px;
    height: 25px;
    margin: 0;
    border-radius: 2px;
    background: var(--green);
    color: #fff;
  }

  .menu-open .menu-toggle::before {
    content: "×";
    font: 700 20px/23px Arial,sans-serif;
  }
}

@media (max-width: 767px) {
  .mobile-nav-social {
    margin-top: 30px;
  }
}
