/*
Theme Name: Grotto Raffael
Theme URI: https://grottoraffael.ch
Description: Child theme di ticinoWEB CMS per Grotto Raffael (Losone): grotto ticinese con pagine a sezioni, gallerie, menù in PDF, negozio e buono regalo. Senza Elementor.
Author: ticinoWEB
Author URI: https://ticinoweb.com
Template: ticinoweb-ai-theme
Version: 1.3.1
Requires at least: 6.4
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: grottoraffael-child-theme
*/

/* ---------- Caratteri (OFL, inclusi nel tema) ---------- */
@font-face { font-family: "Josefin Sans"; src: url("assets/fonts/josefin-sans.woff2") format("woff2"); font-weight: 100 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Sacramento"; src: url("assets/fonts/sacramento-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Merriweather"; src: url("assets/fonts/merriweather.woff2") format("woff2"); font-weight: 300 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Overpass"; src: url("assets/fonts/overpass-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

/* ---------- Token ---------- */
:root {
  --gr-gold: #dfb57a;
  --gr-gold-dark: #b68745;
  --gr-sand: #b99c66;
  --gr-ink: #2a2826;
  --gr-text: #8f8c8a;
  --gr-soft: #a0a0a0;
  --gr-footer: #989390;
  --gr-line: #f3efe9;
  --gr-beige: #f5f1ec;
  --gr-dark: #232323;
  --gr-red: #f50301;
  --gr-highlight: #e8534f;
  --gr-sans: "Josefin Sans", "Helvetica Neue", Arial, sans-serif;
  --gr-script: "Sacramento", "Brush Script MT", cursive;
  --gr-serif: "Merriweather", Georgia, serif;
  --gr-body: "Overpass", "Helvetica Neue", Arial, sans-serif;
  --gr-wrap: 1140px;
  --gr-header-h: 79px;
}

/* ---------- Base ---------- */
body {
  margin: 0;
  background: #fff;
  color: var(--gr-text);
  font-family: var(--gr-sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
body img { max-width: 100%; height: auto; }
body a { color: inherit; }
.gr-main { display: block; }
.gr-wrap { width: 100%; max-width: var(--gr-wrap); margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.gr-narrow { max-width: 820px; }
.gr-skip { position: absolute; left: -9999px; top: 0; z-index: 1000; background: #fff; color: #000; padding: 10px 16px; }
.gr-skip:focus { left: 10px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.gr-notice { background: #fff4e0; color: #6b4b12; padding: 12px 16px; border-radius: 6px; }
.gr-icon { flex: none; vertical-align: middle; }

/* ---------- Testi ricorrenti ---------- */
.gr-kicker { margin: 0 0 10px; font-family: var(--gr-script); font-size: 36px; line-height: 1; font-weight: 400; color: var(--gr-gold); }
.gr-title { margin: 0 0 10px; font-family: var(--gr-sans); font-size: 42px; line-height: 1.2; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--gr-ink); }
.gr-title--plain { text-transform: none; font-size: 48px; color: #000; }
.gr-lead { margin: 0 0 18px; font-size: 18px; line-height: 1.6; letter-spacing: 1px; color: var(--gr-ink); }
.gr-lead--soft { color: rgba(0, 0, 0, .66); }
.gr-text { margin: 0; font-size: 16px; line-height: 1.6; color: var(--gr-text); }
.gr-text p { margin: 0 0 1em; }
.gr-center { text-align: center; }

/* ---------- Pulsanti ---------- */
.gr-btn,
body .gr-btn {
  display: inline-block;
  padding: 24px 40px;
  border: 0;
  border-radius: 5px;
  background: var(--gr-gold);
  color: #fff;
  font-family: var(--gr-sans);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .3s;
}
.gr-btn:hover,
.gr-btn:focus-visible { background: var(--gr-gold-dark); color: #fff; }
body .gr-btn--dark { background: var(--gr-ink); }
body .gr-btn--dark:hover, body .gr-btn--dark:focus-visible { background: #000; }
body .gr-btn--hero { padding: 20px 40px; border-radius: 8px; font-size: 18px; font-weight: 400; text-transform: uppercase; }
body .gr-btn--hero:hover { background: var(--gr-gold-dark); }
:focus-visible { outline: 2px solid var(--gr-gold-dark); outline-offset: 2px; }

/* ---------- Header ---------- */
.gr-header { position: relative; z-index: 50; background: #fff; }
.gr-header__inner { display: flex; align-items: center; gap: 5px; max-width: 1640px; min-height: var(--gr-header-h); margin: 0 auto; padding: 0 10px; box-sizing: border-box; }
.gr-header__logo { flex: none; display: block; width: 109px; padding-top: 6px; line-height: 0; }
.gr-header__logo img { width: 109px; height: auto; }
.gr-header__name { font-family: var(--gr-script); font-size: 30px; color: var(--gr-ink); }
.gr-nav { flex: 1; display: flex; align-items: center; justify-content: center; }
.gr-nav__menu { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; margin: 0; padding: 0; list-style: none; }
.gr-nav__menu > li { position: relative; }
.gr-nav__menu a {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 29px 9px;
  margin: 0 4px;
  color: #000;
  font-family: var(--gr-sans);
  font-size: 18px;
  font-weight: 300;
  line-height: 20px;
  text-decoration: none;
  transition: color .3s;
}
.gr-nav__menu a:hover,
.gr-nav__menu a:focus-visible,
.gr-nav__menu .current-menu-item > a,
.gr-nav__menu .current_page_item > a { color: var(--gr-gold); }
/* Le voci con un'àncora (#team) non sono «la pagina corrente» anche quando portano alla home. */
.gr-nav__menu .current-menu-item > a[href*="#"] { color: #000; }
.gr-nav__menu .gr-menu-highlight > a { color: var(--gr-highlight); }
.gr-nav__menu .gr-menu-highlight > a:hover { color: var(--gr-gold); }
.gr-nav__menu .menu-item-has-children > a::after {
  content: "";
  width: 0;
  height: 0;
  margin-left: 4px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid currentColor;
}
.gr-nav__menu .sub-menu {
  position: absolute;
  top: 100%;
  left: 8px;
  z-index: 60;
  min-width: 220px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--gr-dark);
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s, visibility .2s;
}
.gr-nav__menu li:hover > .sub-menu,
.gr-nav__menu li:focus-within > .sub-menu,
.gr-nav__menu li.is-open > .sub-menu { opacity: 1; visibility: visible; }
.gr-nav__menu .sub-menu li:not(:last-child) { border-bottom: 1px solid #343434; }
.gr-nav__menu .sub-menu a { margin: 0; padding: 15px 25px; color: var(--gr-gold); font-size: 14px; font-weight: 400; white-space: nowrap; }
.gr-nav__menu .sub-menu a:hover,
.gr-nav__menu .sub-menu a:focus-visible { color: #fff; }

/* Selettore lingua */
.gr-lang { position: relative; margin-left: 8px; }
.gr-lang summary { display: flex; align-items: center; gap: 8px; padding: 29px 6px; cursor: pointer; list-style: none; color: #000; }
.gr-lang summary::-webkit-details-marker { display: none; }
.gr-lang[open] summary .gr-icon { transform: rotate(180deg); }
.gr-lang ul { position: absolute; top: 100%; left: 0; z-index: 60; margin: 0; padding: 6px 0; list-style: none; background: var(--gr-dark); }
.gr-lang a { display: block; padding: 8px 14px; line-height: 0; }
.gr-lang__flag { display: block; width: 18px; height: 12px; object-fit: cover; }
.gr-lang__code { font-size: 13px; line-height: 1; color: #fff; }

/* Pulsante Buono Regalo */
.gr-header__voucher {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 180px;
  padding: 12px 20px;
  margin-left: auto;
  background: var(--gr-sand);
  color: #fff;
  font-family: var(--gr-body);
  font-size: 15px;
  line-height: 15px;
  text-decoration: none;
  box-sizing: border-box;
  transition: color .3s;
}
.gr-header__voucher:hover,
.gr-header__voucher:focus-visible { color: #000; }

.gr-menu-toggle { display: none; }

@media (max-width: 1500px) {
  .gr-nav__menu a { margin: 0 1px; padding-left: 7px; padding-right: 7px; }
}
@media (max-width: 1250px) {
  .gr-nav__menu a { margin: 0; padding-left: 5px; padding-right: 5px; font-size: 16px; }
  .gr-header__voucher { min-width: 0; }
}
@media (max-width: 1024px) {
  .gr-header__inner { flex-wrap: wrap; padding: 0 0 0 25px; }
  .gr-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 40px;
    margin-left: 25px;
    border: 0;
    border-radius: 3px;
    background: var(--gr-gold);
    cursor: pointer;
  }
  .gr-menu-toggle span,
  .gr-menu-toggle span::before,
  .gr-menu-toggle span::after { display: block; width: 20px; height: 2px; background: #fff; position: relative; transition: transform .2s; }
  .gr-menu-toggle span::before,
  .gr-menu-toggle span::after { content: ""; position: absolute; left: 0; }
  .gr-menu-toggle span::before { top: -6px; }
  .gr-menu-toggle span::after { top: 6px; }
  .gr-nav-open .gr-menu-toggle span { background: transparent; }
  .gr-nav-open .gr-menu-toggle span::before { transform: translateY(6px) rotate(45deg); }
  .gr-nav-open .gr-menu-toggle span::after { transform: translateY(-6px) rotate(-45deg); }
  .gr-header__voucher { order: 2; margin-right: 25px; }
  .gr-nav {
    order: 3;
    flex: 0 0 100%;
    display: none;
    flex-direction: column;
    align-items: stretch;
    background: var(--gr-dark);
  }
  .gr-nav-open .gr-nav { display: flex; }
  .gr-nav__menu { flex-direction: column; align-items: stretch; }
  .gr-nav__menu > li { border-bottom: 1px solid #343434; }
  .gr-nav__menu a { margin: 0; padding: 15px 25px; color: var(--gr-gold); font-size: 14px; font-weight: 400; }
  .gr-nav__menu a:hover, .gr-nav__menu .current-menu-item > a { color: #fff; }
  .gr-nav__menu .gr-menu-highlight > a { color: var(--gr-highlight); }
  .gr-nav__menu .sub-menu { position: static; display: none; min-width: 0; opacity: 1; visibility: visible; background: #1b1b1b; }
  .gr-nav__menu li.is-open > .sub-menu { display: block; }
  .gr-nav__menu .sub-menu a { padding-left: 45px; white-space: normal; }
  .gr-lang { margin: 0; padding: 0 25px; }
  .gr-lang summary { padding: 15px 0; color: #fff; }
  .gr-lang ul { position: static; display: flex; padding: 0 0 10px; }
}
@media (max-width: 767px) {
  .gr-header__inner { padding-left: 10px; }
  .gr-header__logo { width: 76px; }
  .gr-header__logo img { width: 76px; }
  .gr-menu-toggle { margin-left: 20px; }
  .gr-header__voucher { padding: 10px; margin-right: 10px; font-size: 14px; }
}

/* ---------- Fascia con foto e titolo (Il Grotto, Contatto, Banchetti, Shop) ---------- */
.gr-banner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 420px;
  overflow: hidden;
  background: #000;
  text-align: center;
}
.gr-banner__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 20% 65%; opacity: .62; }
.gr-banner__title {
  position: relative;
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0;
  padding: 0 16px;
  color: #fff;
  font-family: var(--gr-sans);
  font-size: 55px;
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: 8px;
}
/* Puntini decorativi ai lati del titolo: solo grafica, fuori dal testo del titolo (Google legge solo il titolo). */
.gr-banner__title::before,
.gr-banner__title::after { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .85; }
.gr-banner--logo .gr-banner__title::before,
.gr-banner--logo .gr-banner__title::after { content: none; }
.gr-banner__mark { display: none; }
.gr-banner--short { min-height: 265px; }
.gr-banner--logo { min-height: 565px; }
.gr-banner--logo .gr-banner__image { opacity: .7; }
.gr-banner__logo { display: block; width: 390px; max-width: 80vw; height: auto; }
@media (max-width: 1024px) {
  .gr-banner { min-height: 330px; }
  .gr-banner__title { font-size: 44px; }
}
@media (max-width: 767px) {
  .gr-banner { min-height: 240px; }
  .gr-banner__title { gap: 10px; font-size: 32px; letter-spacing: 5px; }
  .gr-banner--logo { min-height: 300px; }
}

/* ---------- Sezioni ---------- */
.gr-section { padding: 80px 0; }
.gr-section--tight { padding-top: 0; }
.gr-head { margin-bottom: 40px; text-align: center; }
.gr-split { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.gr-split__media img { display: block; width: 100%; }
.gr-split__text { padding: 10px 40px 10px 10px; }
.gr-split__text .gr-kicker { margin-bottom: 10px; }
.gr-split__text .gr-title { margin-bottom: 5px; }
.gr-split__text .gr-text { margin-bottom: 20px; }
.gr-cover-432 { height: 432px; object-fit: cover; }
@media (max-width: 767px) {
  .gr-section { padding: 50px 0; }
  .gr-split { grid-template-columns: 1fr; gap: 30px; text-align: center; }
  .gr-split__text { padding: 0; }
  .gr-title { font-size: 30px; }
  .gr-title--plain { font-size: 28px; }
  .gr-kicker { font-size: 30px; }
  .gr-cover-432 { height: auto; }
}

/* Home: foto grandi in dissolvenza */
.gr-hero { position: relative; display: flex; align-items: center; justify-content: center; height: 640px; overflow: hidden; background: #2a2826; text-align: center; }
.gr-hero__slides { position: absolute; inset: 0; }
.gr-hero__slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gr-hero__slide + .gr-hero__slide { opacity: 0; animation: gr-fade 14s infinite; }
.gr-hero__slides::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .22); }
@keyframes gr-fade { 0%, 42% { opacity: 0; } 50%, 92% { opacity: 1; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .gr-hero__slide + .gr-hero__slide { animation: none; } }
.gr-hero__text { position: relative; z-index: 1; padding: 50px; }
.gr-hero__title { margin: 0 0 30px; color: #fff; font-family: var(--gr-sans); font-size: 81px; font-weight: 600; line-height: 1; text-transform: uppercase; }
@media (max-width: 1024px) { .gr-hero { height: 520px; } .gr-hero__title { font-size: 60px; } }
@media (max-width: 767px) { .gr-hero { height: 420px; } .gr-hero__text { padding: 20px; } .gr-hero__title { font-size: 40px; } }

/* Home: video */
.gr-video { position: relative; display: block; width: 100%; padding: 0; border: 0; background: #000; cursor: pointer; line-height: 0; }
.gr-video img { display: block; width: 100%; height: auto; opacity: .85; transition: opacity .3s; }
.gr-video:hover img { opacity: 1; }
.gr-video__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; }
.gr-video__play .gr-icon { width: 80px; height: 80px; }

/* Home: «La qualità prima di tutto» con foto a destra */
.gr-quality { position: relative; overflow: hidden; }
.gr-quality__text { width: 50%; padding: 120px 50px 120px 0; box-sizing: border-box; }
.gr-quality__text .gr-kicker { margin-bottom: 10px; }
.gr-quality__image { position: absolute; top: 0; right: 0; width: 48%; height: 100%; object-fit: cover; object-position: center right; }
.gr-checks { margin: 0 0 30px; padding: 0; list-style: none; }
.gr-checks li { display: flex; gap: 8px; padding: 4px 0; color: #000; font-size: 17px; line-height: 1.6; }
.gr-checks .gr-icon { margin-top: 5px; color: var(--gr-gold); }
@media (max-width: 1024px) { .gr-quality__text { padding: 80px 30px 80px 0; } }
@media (max-width: 767px) {
  .gr-quality__text { width: 100%; padding: 50px 0 30px; text-align: center; }
  .gr-checks li { text-align: left; }
  .gr-quality__image { position: static; display: block; width: 100%; height: 360px; }
}

/* Home: loghi dei partner */
.gr-logos { margin-bottom: 60px; padding: 50px 0; border-bottom: 1px solid var(--gr-line); }
.gr-logos__row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; align-items: center; }
.gr-logos__row a { display: flex; justify-content: center; }
.gr-logos__row img { width: auto; max-height: 70px; opacity: .53; transition: opacity .5s; }
.gr-logos__row a:hover img { opacity: 1; }
@media (max-width: 767px) { .gr-logos__row { grid-template-columns: 1fr; gap: 40px; } .gr-logos__row img { max-height: 90px; } }

/* Home: «Il locale consiglia» */
.gr-dishes { padding: 100px 0 80px; }
.gr-dishes__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: stretch; padding: 0 40px; }
.gr-dishes__list { padding-top: 40px; }
.gr-menu-list { margin: 0 0 30px; padding: 0; list-style: none; }
.gr-menu-list li { display: flex; gap: 20px; align-items: center; justify-content: space-between; padding: 18px 0; border-bottom: 1px solid #000; max-width: 430px; }
.gr-menu-list h3 { margin: 0; color: #000; font-family: var(--gr-sans); font-size: 18px; font-weight: 600; line-height: 1.2; }
.gr-menu-list p { margin: 0; color: var(--gr-soft); font-size: 16px; font-weight: 600; line-height: 1.2; }
.gr-price { flex: none; color: var(--gr-gold); font-size: 16px; letter-spacing: 1px; white-space: nowrap; }
.gr-dishes__image img { width: 100%; height: 100%; min-height: 400px; object-fit: cover; }
@media (max-width: 767px) {
  .gr-dishes__grid { grid-template-columns: 1fr; padding: 0; }
  .gr-menu-list li { max-width: none; flex-direction: column; align-items: flex-start; gap: 8px; }
  .gr-dishes__list { text-align: center; }
  .gr-menu-list { text-align: left; }
}

/* Home: recensione su foto */
.gr-quote { position: relative; overflow: hidden; padding: 100px 20px; background: #3b2a1a; text-align: center; }
.gr-quote__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; }
.gr-quote blockquote { position: relative; max-width: 750px; margin: 0 auto; }
.gr-quote p { margin: 0 0 25px; color: #fff; font-family: var(--gr-sans); font-size: 30px; line-height: 1.3; }
.gr-quote cite { color: var(--gr-gold); font-family: var(--gr-script); font-size: 30px; font-style: normal; letter-spacing: 1px; }
@media (max-width: 767px) { .gr-quote { padding: 60px 20px; } .gr-quote p { font-size: 22px; } }

/* Gallerie */
.gr-gallery { display: grid; grid-template-columns: repeat(var(--gr-cols, 4), 1fr); gap: 10px; }
.gr-gallery__item { display: block; overflow: hidden; aspect-ratio: 3 / 2; background: #eee; }
.gr-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.gr-gallery__item:hover img { transform: scale(1.04); }
.gr-gallery--strip { gap: 4px; padding: 0 4px; }
.gr-strip { padding: 60px 0; }
.gr-section--gallery { padding: 60px 0; }
.gr-section--gallery .gr-wrap { max-width: 1210px; }
@media (max-width: 1024px) { .gr-gallery--strip { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) { .gr-gallery { grid-template-columns: repeat(2, 1fr); gap: 6px; } .gr-gallery--strip { grid-template-columns: 1fr; } .gr-gallery--strip .gr-gallery__item { aspect-ratio: 4 / 3; } }

/* Il Grotto: foto 2×2 */
.gr-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 30px; }
.gr-photos img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 767px) { .gr-photos { grid-template-columns: 1fr; gap: 20px; } }
.gr-story { padding: 70px 0 40px; }
.gr-story .gr-text { margin-bottom: 0; }

/* Il Grotto: recensioni */
.gr-reviews { position: relative; padding: 80px 0; }
.gr-reviews::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 285px; background: var(--gr-beige); }
.gr-reviews__head { position: relative; margin-bottom: 30px; text-align: center; }
.gr-reviews__grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; align-items: start; }
.gr-review { margin: 0; padding: 60px 40px 30px; background: #fff; box-shadow: 0 2px 30px rgba(0, 0, 0, .07); text-align: center; position: relative; }
.gr-review::before {
  content: "";
  position: absolute;
  top: -26px;
  left: 50%;
  width: 58px;
  height: 58px;
  margin-left: -29px;
  border-radius: 5px;
  background: var(--gr-gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M10 6H5.5A2.5 2.5 0 0 0 3 8.5V13a2 2 0 0 0 2 2h3c0 2-1 3-3 3.5V21c4-.5 6-3.3 6-7.5V7a1 1 0 0 0-1-1zm11 0h-4.5A2.5 2.5 0 0 0 14 8.5V13a2 2 0 0 0 2 2h3c0 2-1 3-3 3.5V21c4-.5 6-3.3 6-7.5V7a1 1 0 0 0-1-1z'/%3E%3C/svg%3E") center / 20px no-repeat;
}
.gr-review blockquote { margin: 0 0 20px; color: var(--gr-text); font-size: 16px; line-height: 1.5; }
.gr-review blockquote p { margin: 0; }
.gr-review figcaption strong { display: block; margin-top: 10px; color: var(--gr-ink); font-size: 17px; font-weight: 600; }
.gr-review figcaption span { color: rgba(42, 40, 38, .51); font-size: 15px; }
.gr-stars { display: inline-flex; gap: 8px; color: var(--gr-gold); }
@media (max-width: 1024px) { .gr-reviews__grid { gap: 20px; } .gr-review { padding: 50px 20px 30px; } }
@media (max-width: 767px) { .gr-reviews__grid { grid-template-columns: 1fr; gap: 50px; } }

.gr-wide-image { display: block; width: 100%; max-width: 820px; margin: 30px auto; }
.gr-miniature .gr-text { margin: 0 auto 40px; }
.gr-miniature .gr-gallery { max-width: 820px; margin: 0 auto; }

/* Galleria: invito a prenotare */
.gr-cta { padding: 70px 0; background: var(--gr-gold); }
.gr-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.gr-cta h2 { margin: 0; color: #fff; font-family: var(--gr-sans); font-size: 32px; font-weight: 400; }
@media (max-width: 767px) { .gr-cta__inner { flex-direction: column; text-align: center; } .gr-cta h2 { font-size: 26px; } }

/* Contatto */
.gr-contact__grid { display: grid; grid-template-columns: 1fr 1.65fr; gap: 50px; align-items: start; }
.gr-alert { margin: 15px 0 25px; color: var(--gr-red); font-size: 16px; font-weight: 600; line-height: 1.6; letter-spacing: 1px; }
.gr-contact-list { margin: 0; padding: 0; list-style: none; }
.gr-contact-list a { display: inline-flex; align-items: center; gap: 8px; padding: 2px 0; color: var(--gr-text); font-size: 18px; text-decoration: none; }
.gr-contact-list a:hover { color: var(--gr-gold-dark); }
.gr-contact-list .gr-icon { color: #000; }
.gr-hours { padding: 15px; background: var(--gr-gold); }
.gr-hours__inner { padding: 35px 20px 40px; border: 1px solid rgba(255, 255, 255, .4); color: #fff; text-align: center; }
.gr-hours h2 { margin: 0 0 20px; font-family: var(--gr-sans); font-size: 24px; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; color: #fff; }
.gr-hours h3 { margin: 0 0 15px; font-family: var(--gr-sans); font-size: 18px; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; color: #fff; }
.gr-hours dl { margin: 0 25px 25px; text-align: left; }
.gr-hours dl div { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .4); font-size: 15px; }
.gr-hours dt, .gr-hours dd { margin: 0; }
@media (max-width: 1024px) { .gr-contact__grid { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .gr-hours dl { margin: 0 0 20px; } .gr-hours__inner { padding: 25px 15px; } }

/* Mappa al clic */
.gr-map { position: relative; display: flex; align-items: center; justify-content: center; min-height: var(--gr-map-h, 450px); background: var(--gr-beige); }
.gr-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.gr-map__consent { max-width: 520px; padding: 30px 20px; color: var(--gr-ink); text-align: center; }
.gr-map__consent p { margin: 0 0 20px; }
.gr-map-band { padding: 0; }

/* Banchetti */
.gr-banquets { padding: 25px 0 0; }
.gr-banquets__intro { max-width: 1040px; margin: 0 auto 60px; color: var(--gr-ink); font-family: var(--gr-serif); font-size: 24px; font-weight: 400; line-height: 1; text-align: center; }
.gr-rows { max-width: 1060px; margin: 0 auto; }
.gr-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.gr-row__text { padding: 0 0 20px; }
.gr-row--reverse .gr-row__text { order: 2; padding-top: 30px; }
.gr-row h2 { margin: 0 0 15px; color: var(--gr-ink); font-family: var(--gr-serif); font-size: 22px; font-weight: 700; line-height: 1.3; }
.gr-row p { margin: 0 0 14px; color: #000; font-family: var(--gr-body); font-size: 16px; line-height: 1.7; text-align: justify; }
.gr-row img { display: block; width: 100%; height: 390px; object-fit: cover; }
.gr-underline { text-decoration: underline; }
.gr-banquets + .gr-map-band { margin-top: 60px; }
@media (max-width: 767px) {
  .gr-banquets__intro { font-size: 20px; line-height: 1.3; }
  .gr-row { grid-template-columns: 1fr; }
  .gr-row--reverse .gr-row__text { order: 0; padding-top: 0; }
  .gr-row img { height: 260px; }
}

/* Eventi */
.gr-events { padding: 20px 0 60px; }
.gr-page__title { margin: 0 0 20px; color: var(--gr-ink); font-family: var(--gr-serif); font-size: 40px; font-weight: 400; line-height: 1.3; }
.gr-events__title { margin: 0 0 15px; color: var(--gr-ink); font-family: var(--gr-serif); font-size: 32px; font-weight: 400; text-align: center; }
.gr-events__text { margin: 0 0 30px; color: var(--gr-soft); font-family: var(--gr-body); text-align: center; }
.gr-events figure { margin: 0; text-align: center; }
.gr-events figure img { width: 730px; }

/* Buono regalo */
.gr-voucher-head { padding: 50px 0; background: #f7f7f7; }
.gr-voucher-head__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.gr-voucher-head h1 { margin: 0 0 15px; color: var(--gr-ink); font-family: var(--gr-serif); font-size: 32px; font-weight: 400; }
.gr-voucher-head p { margin: 0 0 12px; color: var(--gr-soft); font-family: var(--gr-body); font-size: 16px; }
.gr-voucher-head strong { color: var(--gr-text); }
.gr-voucher-head__logo { display: flex; justify-content: center; }
.gr-voucher-head__logo img { width: 350px; }
.gr-voucher-form { padding: 60px 0 80px; }
@media (max-width: 767px) { .gr-voucher-head__grid { grid-template-columns: 1fr; } .gr-voucher-head__logo { order: -1; } .gr-voucher-head__logo img { width: 240px; } }

/* Modulo del buono (tW Formulari): carattere e angoli del sito. Il colore si sceglie nelle impostazioni del modulo. */
body .gr-voucher-form .twf-form { --twf-text: var(--gr-ink); --twf-radius: 0; font-family: var(--gr-sans); }

/* Pagine di testo (note legali, carrello, cassa) */
.gr-page--text { padding: 30px 0 80px; }
.gr-prose { max-width: 900px; color: #555; font-family: var(--gr-body); font-size: 16px; line-height: 1.7; }
.gr-prose h1, .gr-prose h2, .gr-prose h3 { color: var(--gr-ink); font-family: var(--gr-serif); font-weight: 400; line-height: 1.3; }
.gr-prose a { color: var(--gr-gold-dark); }
.gr-prose ul, .gr-prose ol { padding-left: 1.4em; }
.gr-article__date { margin: -10px 0 20px; color: var(--gr-soft); }
.gr-archive { padding: 0; list-style: none; }
.gr-archive li { padding: 10px 0; border-bottom: 1px solid var(--gr-line); }

/* ---------- Finestre: foto, video, popup ---------- */
.gr-lightbox { width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; margin: 0; padding: 0; border: 0; background: rgba(0, 0, 0, .92); }
.gr-lightbox::backdrop { background: rgba(0, 0, 0, .6); }
.gr-lightbox__stage { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 50px 70px; box-sizing: border-box; }
.gr-lightbox__stage img { max-width: 100%; max-height: 100%; object-fit: contain; }
.gr-lightbox.is-video .gr-lightbox__stage iframe { width: min(1100px, 100%); aspect-ratio: 16 / 9; height: auto; border: 0; }
.gr-lightbox button { position: absolute; padding: 10px; border: 0; background: transparent; color: #fff; cursor: pointer; }
.gr-lightbox__close { top: 10px; right: 10px; }
.gr-lightbox__prev { left: 10px; top: 50%; transform: translateY(-50%); }
.gr-lightbox__next { right: 10px; top: 50%; transform: translateY(-50%); }
.gr-lightbox.is-single .gr-lightbox__prev, .gr-lightbox.is-single .gr-lightbox__next { display: none; }
@media (max-width: 767px) { .gr-lightbox__stage { padding: 50px 10px; } }

.gr-popup { width: min(640px, calc(100vw - 32px)); padding: 0; border: 0; background: #fff; color: var(--gr-ink); text-align: center; }
.gr-popup::backdrop { background: rgba(0, 0, 0, .6); }
.gr-popup__image { display: block; width: 100%; height: auto; }
.gr-popup__body { padding: 30px; }
.gr-popup__body h2 { margin: 0 0 10px; font-family: var(--gr-sans); font-size: 32px; font-weight: 600; }
.gr-popup__close { position: absolute; top: 8px; right: 8px; padding: 6px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .85); color: #000; cursor: pointer; line-height: 0; }

/* ---------- Footer ---------- */
.gr-footer { padding: 80px 0 30px; background: #fff; color: var(--gr-footer); }
.gr-footer__cols { display: grid; grid-template-columns: 1.6fr 1fr .9fr 1.3fr; gap: 20px; }
.gr-footer__brand { padding-right: 40px; }
.gr-footer__logo { display: block; width: 150px; margin-bottom: -10px; }
.gr-footer__text { font-size: 17px; font-weight: 300; line-height: 1.5; }
.gr-footer__text p { margin: 15px 0 0; }
.gr-footer__social { display: flex; gap: 20px; margin: 12px 0 0; }
.gr-footer__social a { color: var(--gr-footer); transition: color .3s; }
.gr-footer__social a:hover { color: var(--gr-gold); }
.gr-footer__links { margin: 0; padding: 0; list-style: none; }
.gr-footer__links li + li { margin-top: 14px; }
.gr-footer__links a { display: inline-flex; align-items: center; gap: 8px; color: var(--gr-footer); font-size: 16px; text-decoration: none; transition: color .3s; }
.gr-footer__links a:hover { color: #000; }
.gr-footer__links--icons .gr-icon { color: #000; }
.gr-footer__contact p { margin: 0; }
.gr-footer__label { margin: 0 0 4px !important; color: var(--gr-gold); font-size: 17px; letter-spacing: 1px; }
.gr-footer__label a { color: var(--gr-gold); text-decoration: none; }
.gr-footer__label--partner { margin-top: 20px !important; color: var(--gr-red); }
.gr-footer__phone { margin-bottom: 30px !important; font-size: 17px; letter-spacing: 1px; }
.gr-footer__phone a { color: var(--gr-footer); text-decoration: none; }
.gr-footer__contact > .gr-footer__label + .gr-footer__label--partner { margin-top: 20px; }
.gr-footer__partner { display: block; width: 100%; max-width: 280px; margin-top: 12px; }
.gr-footer__bottom { margin-top: 40px; padding: 30px 0 0; border: 1px solid #403e3c; border-bottom: 0; border-radius: 25px 25px 0 0; text-align: center; }
.gr-footer__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; margin: 0; padding: 0 20px; list-style: none; }
.gr-footer__legal a { color: #ddd; font-size: 16px; text-decoration: none; }
.gr-footer__legal a:hover { color: #000; }
.gr-footer__copy { margin: 12px 0 0; font-size: 15px; line-height: 1.5; }
.gr-footer__copy a { color: var(--gr-footer); text-decoration: none; }
.gr-lang-flags { display: flex; justify-content: center; gap: 14px; margin: 25px 0 0; padding: 0; list-style: none; }
.gr-lang-flags a { display: block; line-height: 0; }
@media (max-width: 1024px) { .gr-footer__cols { grid-template-columns: 1fr 1fr; gap: 40px 20px; } }
@media (max-width: 767px) {
  .gr-footer { padding-top: 60px; }
  .gr-footer__cols { grid-template-columns: 1fr; }
  .gr-footer__brand { padding-right: 0; }
}

/* ---------- WooCommerce ---------- */
.gr-shop__inner { padding-top: 60px; padding-bottom: 80px; }
body .woocommerce ul.products li.product,
body.woocommerce ul.products li.product {
  padding: 30px 30px 30px;
  border: 1px solid #ddd;
  border-radius: 3px;
  box-sizing: border-box;
  text-align: left;
}
body.woocommerce ul.products li.product .woocommerce-loop-product__title,
body .woocommerce ul.products li.product .woocommerce-loop-product__title { font-family: var(--gr-serif); font-size: 20px; font-weight: 400; color: var(--gr-ink); }
body.woocommerce ul.products li.product .price,
body .woocommerce ul.products li.product .price { font-family: var(--gr-serif); color: var(--gr-ink); font-size: 15px; }
body .woocommerce ul.products li.product img { height: 120px; object-fit: contain; }
body.woocommerce a.button,
body.woocommerce button.button,
body .woocommerce a.button,
body .woocommerce button.button,
body .woocommerce .button.alt,
body.woocommerce .button.alt,
body .woocommerce #respond input#submit {
  border-radius: 0;
  background: var(--gr-gold-dark);
  color: #fff;
  font-family: var(--gr-sans);
  font-weight: 600;
}
body.woocommerce a.button:hover,
body.woocommerce button.button:hover,
body .woocommerce a.button:hover,
body .woocommerce button.button:hover,
body .woocommerce .button.alt:hover { background: var(--gr-ink); color: #fff; }
body .woocommerce div.product .product_title { font-family: var(--gr-sans); font-size: 40px; font-weight: 600; color: var(--gr-ink); }
body .woocommerce div.product p.price { color: var(--gr-ink); font-size: 20px; letter-spacing: 2px; }
.gr-shop .woocommerce-breadcrumb { display: none; }

/* ---------- Banner dei cookie del parent (tW SEO): colori e carattere del sito ---------- */
body { --tw-cookie-primary: var(--gr-gold-dark); }
body .tw-cookie-banner,
body .tw-cookie-btn { font-family: var(--gr-sans); }
body .tw-cookie-banner { border-radius: 0; }
body .tw-cookie-text { color: var(--gr-ink); }
body .tw-cookie-text a { color: var(--gr-gold-dark); }
body .tw-cookie-btn { border-radius: 5px; }

/* =========================================================================
   1.1.0 — icone nel menu, bandiere in fila, header che resta in alto,
   foto più morbide, movimento (GSAP) e parallasse. Ritocchi leggeri.
   ========================================================================= */

/* Header che resta in alto, con un'ombra leggera quando si scorre */
.gr-header { position: sticky; top: 0; transition: box-shadow .3s ease; }
body.admin-bar .gr-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .gr-header { top: 46px; } }
.gr-header.is-scrolled { box-shadow: 0 6px 24px rgba(42, 40, 38, .08); }

/* Voci del menu con icona sopra il testo e sottolineatura oro al passaggio */
.gr-nav__menu .gr-icon { color: var(--gr-gold); transition: transform .3s ease; }
.gr-menu-label {
  background-image: linear-gradient(var(--gr-gold), var(--gr-gold));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1.5px;
  padding-bottom: 2px;
  transition: background-size .35s ease;
}
.gr-nav__menu a:hover .gr-menu-label,
.gr-nav__menu a:focus-visible .gr-menu-label,
.gr-nav__menu .current-menu-item:not(.menu-item-type-custom) > a .gr-menu-label { background-size: 100% 1.5px; }
.gr-nav__menu > li > a .gr-icon { width: 16px; height: 16px; }
.gr-nav__menu .gr-menu-highlight .gr-icon { color: var(--gr-highlight); }
.gr-nav__menu .menu-item-has-children > a:has(.gr-menu-label)::after { display: none; }
.gr-nav__menu .menu-item-has-children > a .gr-menu-label::after {
  content: "";
  display: inline-block;
  margin-left: 6px;
  vertical-align: middle;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
}
@media (min-width: 1025px) {
  .gr-header.is-scrolled .gr-nav__menu > li > a { padding-top: 24px; padding-bottom: 24px; }
  .gr-nav__menu .sub-menu { border-radius: 0 0 6px 6px; overflow: hidden; box-shadow: 0 14px 30px rgba(0, 0, 0, .18); }
}
.gr-nav__menu .sub-menu a { gap: 10px; }
.gr-nav__menu .sub-menu .gr-icon { width: 16px; height: 16px; color: var(--gr-gold); }

/* Tutte le bandiere in fila: la lingua attiva piena con un anello oro, le altre più tenui */
.gr-lang-row { display: flex; align-items: center; gap: 10px; margin: 0 0 0 14px; padding: 0; list-style: none; }
.gr-lang-row li { line-height: 0; }
.gr-lang-row a,
.gr-lang-row span { display: block; padding: 3px; border-radius: 4px; line-height: 0; }
.gr-lang-row a { opacity: .5; filter: saturate(.55); transition: opacity .25s, filter .25s, transform .25s; }
.gr-lang-row a:hover,
.gr-lang-row a:focus-visible { opacity: 1; filter: none; transform: translateY(-1px); }
.gr-lang-row .is-current span { box-shadow: 0 0 0 1.5px var(--gr-gold); }
.gr-lang-row .gr-lang__flag { width: 22px; height: 15px; border-radius: 2px; }
@media (max-width: 1024px) {
  .gr-lang-row { margin: 0; padding: 14px 25px 18px; gap: 14px; }
  .gr-lang-row .is-current span { box-shadow: 0 0 0 1.5px var(--gr-gold); }
  .gr-nav__menu a .gr-icon { width: 18px; height: 18px; }
}

/* Foto con angoli morbidi e un'ombra leggera */
.gr-split__media img,
.gr-split__media .gr-video,
.gr-photos img,
.gr-dishes__image img,
.gr-wide-image,
.gr-row img,
.gr-events figure img { border-radius: 6px; box-shadow: 0 12px 32px rgba(42, 40, 38, .12); }
.gr-split__media .gr-video { overflow: hidden; }
.gr-gallery__item { border-radius: 4px; }
.gr-review { border-radius: 6px; }
.gr-hours { border-radius: 6px; }

/* Pulsanti che si alzano un poco al passaggio */
body .gr-btn { transition: background-color .3s, transform .25s ease, box-shadow .25s ease; }
body .gr-btn:hover,
body .gr-btn:focus-visible { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(42, 40, 38, .16); }
.gr-header__voucher { border-radius: 4px; transition: color .3s, transform .25s ease, box-shadow .25s ease; }
.gr-header__voucher:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(42, 40, 38, .14); }

/* Parallasse: le foto grandi sono più alte del loro riquadro e si spostano piano mentre si scorre
   (solo con il movimento attivo: classe gr-motion messa da assets/js/motion.js) */
.gr-motion .gr-hero__slides { top: -8%; bottom: -8%; }
.gr-motion .gr-banner__image,
.gr-motion .gr-quote__bg { top: -12%; height: 124%; }
@media (min-width: 768px) {
  .gr-motion .gr-quality__image { top: -8%; height: 116%; }
}
@media (prefers-reduced-motion: reduce) {
  .gr-header, .gr-menu-label, body .gr-btn, .gr-lang-row a { transition: none; }
}

/* 1.1.1 — l'header resta in alto: le àncore (#team) si fermano sotto di lui; da telefono «Chi siamo» resta oro */
[id] { scroll-margin-top: 96px; }
@media (max-width: 1024px) {
  .gr-nav__menu .current-menu-item > a[href*="#"] { color: var(--gr-gold); }
}

/* 1.2.0 — contenuti nella stessa scatola dell'header (1640 px, stessi margini): logo e pulsante «Buono Regalo»
   segnano i bordi. Le fasce colorate e le foto di sfondo restano a tutta larghezza, il loro contenuto no. */
:root { --gr-wrap: 1640px; }
@media (min-width: 768px) { .gr-wrap { padding-left: 10px; padding-right: 10px; } }
@media (min-width: 1025px) {
  /* La foto della «qualità» si ferma al bordo destro della scatola invece che dello schermo */
  /* 100% = larghezza della sezione (senza barra di scorrimento): la foto occupa la colonna destra della scatola,
     larga e allineata come la foto di «Il locale consiglia» (due colonne con 50 px in mezzo). */
  .gr-quality__image {
    right: calc((100% - min(100%, var(--gr-wrap))) / 2 + 10px);
    width: calc((min(100%, var(--gr-wrap)) - 20px - 50px) / 2);
    border-radius: 6px;
  }
  .gr-quality__text { width: calc((100% - 50px) / 2); padding-right: 0; }
  .gr-dishes__grid { padding: 0; }
}

/* 1.3.0 — il video suona dentro la pagina, al posto dell'anteprima, nelle stesse proporzioni 16:9 */
.gr-video-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 6px; background: #000; box-shadow: 0 12px 32px rgba(42, 40, 38, .12); }
.gr-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.gr-split__media .gr-video { aspect-ratio: 16 / 9; }
.gr-split__media .gr-video img { width: 100%; height: 100%; object-fit: cover; }
