/* ============================================================
   PARCO DEI PINI — Section Layouts
   ============================================================ */

/* ── Hero ── */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

.hero-media {
  position: absolute;
  inset: -8% -2%;
  background: url('../img/parco-dei-pini.png') center/cover no-repeat;
  will-change: transform;
  transform: scale(1.08);
  animation: heroReveal 1.8s 0.1s var(--ease-out-expo) forwards;
}
@keyframes heroReveal {
  from { transform: scale(1.16); filter: blur(10px); }
  to   { transform: scale(1.08); filter: blur(0); }
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, rgba(20,18,16,0.55) 0%, transparent 65%),
    linear-gradient(to top,   rgba(20,18,16,0.8)  0%, rgba(20,18,16,0.1) 50%, transparent 100%);
  z-index: 1;
}

.hero-content {
  position: relative;
  z-index: 2;
  padding: var(--sp-l) var(--sp-m) var(--sp-xl);
  max-width: 1320px;
  margin: 0 auto;
  width: 100%;
}

.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.75rem;
  opacity: 0;
  animation: fadeUp 0.8s 0.9s var(--ease-out-expo) forwards;
}
.hero-eyebrow::before {
  content: '';
  width: 40px; height: 1px;
  background: var(--gold-light);
}

.hero-title {
  color: var(--white);
  max-width: 12ch;
  margin-bottom: 1.75rem;
  opacity: 0;
  animation: fadeUp 1s 1.05s var(--ease-out-expo) forwards;
}
.hero-title em {
  font-style: italic;
  color: var(--gold-light);
  display: block;
}

.hero-sub {
  color: rgba(255,255,255,0.78);
  font-size: 1.1rem;
  font-weight: 300;
  max-width: 44ch;
  line-height: 1.75;
  margin-bottom: 2.75rem;
  opacity: 0;
  animation: fadeUp 1s 1.2s var(--ease-out-expo) forwards;
}

.hero-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  opacity: 0;
  animation: fadeUp 1s 1.35s var(--ease-out-expo) forwards;
}

.hero-scroll-indicator {
  position: absolute;
  bottom: 2.5rem;
  right: var(--sp-m);
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  color: rgba(255,255,255,0.5);
  font-size: 0.6rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  opacity: 0;
  animation: fadeIn 1s 1.8s ease forwards;
}
.scroll-line {
  width: 1px;
  height: 52px;
  position: relative;
  background: rgba(255,255,255,0.15);
  overflow: hidden;
}
.scroll-line::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(255,255,255,0.7);
  animation: scrollDown 2s ease-in-out infinite;
}
@keyframes scrollDown {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  to { opacity: 1; }
}

/* ── Awards ticker strip ── */
.awards-strip {
  background: var(--dark);
  padding: 1.1rem 0;
  overflow: hidden;
}
.awards-ticker {
  display: flex;
  gap: 0;
  user-select: none;
}
.ticker-track {
  display: flex;
  gap: 3rem;
  padding-right: 3rem;
  flex-shrink: 0;
}
.award-item {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  white-space: nowrap;
  color: rgba(255,255,255,0.55);
}
.award-dot {
  width: 3px; height: 3px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
}
.award-item strong { color: var(--gold-light); font-weight: 500; }
.award-item span { font-size: 0.72rem; letter-spacing: 0.12em; }

/* ── Manifesto ── */
.manifesto {
  background: var(--cream);
  text-align: center;
  padding: var(--sp-xl) 0;
}
.manifesto-quote {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 4.5vw, 3.25rem);
  font-weight: 300;
  font-style: italic;
  color: var(--dark);
  max-width: 22ch;
  margin: 0 auto 2rem;
  line-height: 1.25;
}
.manifesto-quote strong {
  font-weight: 600;
  font-style: normal;
  color: var(--gold);
}

/* ── USP grid ── */
.usp { background: var(--ivory); }
.usp-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid var(--sand);
  margin-top: var(--sp-l);
}
.usp-card {
  padding: var(--sp-l) var(--sp-m);
  border-right: 1px solid var(--sand);
  position: relative;
  overflow: hidden;
  transition: background var(--dur-fast);
}
.usp-card:last-child { border-right: none; }
.usp-card-line {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--dur-slow) var(--ease-out-expo);
}
.usp-card:hover .usp-card-line { transform: scaleX(1); }
.usp-number {
  font-family: var(--font-display);
  font-size: 5rem;
  font-weight: 200;
  color: var(--sand);
  line-height: 1;
  margin-bottom: 1rem;
  display: block;
}
.usp-title {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 400;
  margin-bottom: 0.75rem;
  color: var(--dark);
}
.usp-desc { font-size: 0.9rem; color: var(--soft); line-height: 1.7; }

/* ── Split sections ── */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 620px;
}
.split-reverse { direction: rtl; }
.split-reverse > * { direction: ltr; }

.split-img {
  position: relative;
  overflow: hidden;
}
.split-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 1s var(--ease-out-expo);
  will-change: transform;
}
.split-img:hover img { transform: scale(1.04); }

.split-content {
  padding: var(--sp-l);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--cream);
}
.split-content.dark {
  background: var(--dark-2);
  color: var(--cream);
}
.split-content.dark .eyebrow { color: var(--gold-light); }
.split-content.dark .body-l  { color: rgba(244,239,230,0.75); }

/* ── Spaces mosaic ── */
.spaces { background: var(--dark); }
.spaces-header { text-align: center; margin-bottom: var(--sp-l); }
.spaces-header .display-l { color: var(--cream); }

.spaces-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
}
.space-card {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  aspect-ratio: 4/3;
}
.space-card.tall { grid-row: span 2; aspect-ratio: auto; }
.space-card img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--ease-out-expo);
  will-change: transform;
}
.space-card:hover img { transform: scale(1.07); }
.space-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(20,18,16,0.88) 0%, transparent 55%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 2rem;
  transition: background var(--dur-mid);
}
.space-card:hover .space-card-overlay {
  background: linear-gradient(to top, rgba(20,18,16,0.95) 0%, rgba(20,18,16,0.15) 55%);
}
.space-card-title {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 400;
  color: var(--white);
  margin-bottom: 0.3rem;
  transform: translateY(8px);
  transition: transform var(--dur-mid) var(--ease-out-expo);
}
.space-card:hover .space-card-title { transform: translateY(0); }
.space-card-desc {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.6);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--dur-mid) var(--ease-out-expo),
              transform var(--dur-mid) var(--ease-out-expo);
  transition-delay: 0.05s;
}
.space-card:hover .space-card-desc { opacity: 1; transform: translateY(0); }

/* ── Menu section ── */
.menu { background: var(--ivory); }
.menu-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-l);
  align-items: start;
}
.menu-img {
  overflow: hidden;
  aspect-ratio: 3/4;
  position: relative;
}
.menu-img img { width: 100%; height: 100%; object-fit: cover; }
.menu-img-caption {
  position: absolute;
  bottom: 1.5rem; left: 1.5rem;
  background: var(--cream);
  padding: 0.5rem 1rem;
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
}
.menu-content { padding-top: var(--sp-m); }
.menu-courses { margin: 2rem 0; display: flex; flex-direction: column; gap: 0; }
.menu-course {
  display: flex;
  gap: 1.5rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--sand);
  transition: padding-left var(--dur-mid) var(--ease-out-expo);
}
.menu-course:first-child { border-top: 1px solid var(--sand); }
.menu-course:hover { padding-left: 0.5rem; }
.course-num {
  font-family: var(--font-display);
  font-size: 1.1rem;
  color: var(--gold);
  font-style: italic;
  min-width: 1.5rem;
  padding-top: 2px;
}
.course-name {
  font-family: var(--font-display);
  font-size: 1.1rem;
  color: var(--dark);
  font-weight: 500;
  display: block;
  margin-bottom: 0.3rem;
}
.course-desc { font-size: 0.82rem; color: var(--soft); line-height: 1.55; }
.menu-price {
  font-family: var(--font-display);
  font-size: 2.25rem;
  color: var(--dark);
  font-weight: 300;
  margin: 1.5rem 0 0.25rem;
}
.menu-price-note { font-size: 0.8rem; color: var(--soft); }

/* ── Events ── */
.events { background: var(--cream); }
.events-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: var(--sp-m);
}
.event-card {
  background: var(--ivory);
  padding: var(--sp-m);
  border-top: 2px solid var(--sand);
  transition: border-color var(--dur-fast), transform var(--dur-mid) var(--ease-out-expo),
              box-shadow var(--dur-mid);
}
.event-card:hover {
  border-color: var(--gold);
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(20,18,16,0.08);
}
.event-icon { font-size: 1.75rem; margin-bottom: 1rem; }
.event-title {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 400;
  margin-bottom: 0.75rem;
  color: var(--dark);
}
.event-desc { font-size: 0.88rem; color: var(--soft); line-height: 1.7; margin-bottom: 1.5rem; }

/* ── Gallery mosaic ── */
.gallery { background: var(--dark); }
.gallery-header { text-align: center; margin-bottom: var(--sp-m); }
.gallery-header .display-l { color: var(--cream); }
.gallery-mosaic {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 220px;
  gap: 3px;
}
.gallery-item { overflow: hidden; position: relative; cursor: zoom-in; }
.gallery-item.wide  { grid-column: span 2; }
.gallery-item.tall  { grid-row: span 2; }
.gallery-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.7s var(--ease-out-expo), filter 0.5s ease;
  filter: brightness(0.88) saturate(0.9);
}
.gallery-item:hover img {
  transform: scale(1.09);
  filter: brightness(1) saturate(1.05);
}

/* ── Reviews ── */
.reviews { background: var(--ivory); }
.reviews-header { text-align: center; margin-bottom: var(--sp-l); }
.reviews-score {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-bottom: 1rem;
}
.score-number {
  font-family: var(--font-display);
  font-size: 5.5rem;
  font-weight: 200;
  color: var(--dark);
  line-height: 1;
}
.stars { color: var(--gold); font-size: 1.25rem; letter-spacing: 3px; margin-bottom: 0.3rem; }
.score-label { font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--soft); }
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.review-card {
  background: var(--white);
  padding: 2.25rem;
  position: relative;
  transition: transform var(--dur-mid) var(--ease-out-expo),
              box-shadow var(--dur-mid);
}
.review-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 48px rgba(20,18,16,0.08);
}
.review-card::before {
  content: '\201C';
  font-family: var(--font-display);
  font-size: 6rem;
  line-height: 0.5;
  color: var(--sand);
  position: absolute;
  top: 1.75rem; left: 1.75rem;
}
.review-text {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-style: italic;
  color: var(--dark);
  line-height: 1.65;
  margin-bottom: 1.5rem;
  padding-top: 1.75rem;
  position: relative;
  z-index: 1;
}
.review-author { display: flex; align-items: center; gap: 0.75rem; }
.review-avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--sand);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display);
  font-size: 1rem;
  color: var(--gold);
}
.review-name  { font-size: 0.85rem; font-weight: 500; color: var(--dark); }
.review-date  { font-size: 0.72rem; color: var(--soft); }
.review-stars { color: var(--gold); font-size: 0.75rem; letter-spacing: 1px; }

/* ── Scarcity CTA bar ── */
.calendar-cta { background: var(--gold); padding: var(--sp-m); }
.calendar-inner {
  max-width: 1320px; margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-m);
  flex-wrap: wrap;
}
.calendar-title {
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 400;
  color: var(--white);
}
.btn-calendar {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 2.25rem;
  background: var(--white);
  color: var(--gold);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  transition: background var(--dur-fast), color var(--dur-fast);
  white-space: nowrap;
}
.btn-calendar:hover { background: var(--dark); color: var(--white); }

/* ── FAQ ── */
.faq { background: var(--cream); }
.faq-layout { display: grid; grid-template-columns: 1fr 2fr; gap: var(--sp-l); }
.faq-list { display: flex; flex-direction: column; gap: 0; }
.faq-item { border-bottom: 1px solid var(--sand); }
.faq-question {
  width: 100%; text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.35rem 0;
  font-size: 0.95rem;
  font-weight: 400;
  color: var(--dark);
  transition: color var(--dur-fast);
}
.faq-question:hover { color: var(--gold); }
.faq-icon {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border: 1px solid var(--sand);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.9rem;
  color: var(--gold);
  transition: transform var(--dur-fast), border-color var(--dur-fast);
}
.faq-item.open .faq-icon {
  transform: rotate(45deg);
  border-color: var(--gold);
}
.faq-answer {
  max-height: 0; overflow: hidden;
  transition: max-height 0.45s var(--ease-out-expo), padding 0.3s ease;
  font-size: 0.9rem;
  color: var(--soft);
  line-height: 1.75;
}
.faq-item.open .faq-answer { max-height: 400px; padding-bottom: 1.35rem; }

/* ── CTA finale ── */
.cta-final {
  position: relative;
  min-height: 640px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.cta-final-bg {
  position: absolute;
  inset: 0;
  background: url('../img/facciata-notturna.jpg') center/cover no-repeat;
  filter: brightness(0.3) saturate(0.8);
  transition: transform 1.2s var(--ease-out-expo);
}
.cta-final:hover .cta-final-bg { transform: scale(1.02); }
.cta-final-content {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: var(--sp-xl) var(--sp-m);
  max-width: 720px;
  margin: 0 auto;
}

/* ── Contact ── */
.contact { background: var(--dark); }
.contact-layout { display: grid; grid-template-columns: 1fr 1.5fr; gap: var(--sp-l); }
.contact-detail {
  display: flex; align-items: flex-start;
  gap: 1rem; margin-bottom: 1.35rem;
}
.contact-detail-icon  { font-size: 1rem; color: var(--gold); margin-top: 3px; }
.contact-detail-text  { font-size: 0.9rem; color: rgba(244,239,230,0.7); line-height: 1.6; }
.contact-detail-label {
  font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); display: block; margin-bottom: 0.2rem;
}

.form-card { background: var(--cream); padding: var(--sp-m); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-group { display: flex; flex-direction: column; gap: 0.4rem; }
.form-group.full { grid-column: 1 / -1; }
.form-label {
  font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--soft); font-weight: 500;
}
.form-input, .form-select, .form-textarea {
  padding: 0.9rem 1rem;
  border: 1px solid var(--sand);
  background: var(--white);
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--dark);
  transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
  appearance: none; -webkit-appearance: none;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(181,144,79,0.12);
}
.form-textarea { resize: vertical; min-height: 108px; }
.form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23B5904F' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.75rem;
  cursor: pointer;
}
.form-note { font-size: 0.75rem; color: var(--soft); margin-top: 0.75rem; }
.form-success { display: none; text-align: center; padding: 2.5rem; }

/* ── Instagram strip ── */
.instagram { background: var(--ivory); text-align: center; }
.instagram-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 3px;
  margin: var(--sp-m) 0;
}
.insta-item { aspect-ratio: 1; overflow: hidden; position: relative; }
.insta-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.5s var(--ease-out-expo), filter 0.4s;
  filter: brightness(0.92) saturate(0.85);
}
.insta-item:hover img {
  transform: scale(1.1);
  filter: brightness(1) saturate(1);
}
.insta-overlay {
  position: absolute; inset: 0;
  background: rgba(20,18,16,0.42);
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transition: opacity 0.35s;
}
.insta-item:hover .insta-overlay { opacity: 1; }

/* ── Google section ── */
.google-section { background: var(--cream); }
.google-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-m);
  flex-wrap: wrap;
}

/* ── Footer ── */
footer {
  background: var(--dark);
  padding: var(--sp-l) var(--sp-m) var(--sp-m);
}
.footer-grid {
  max-width: 1320px; margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--sp-l);
  padding-bottom: var(--sp-l);
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.footer-brand-name {
  font-family: var(--font-display);
  font-size: 1.8rem; font-weight: 300;
  color: var(--cream); margin-bottom: 1rem;
}
.footer-brand-name em { color: var(--gold-light); font-style: italic; }
.footer-tagline { font-size: 0.82rem; color: rgba(255,255,255,0.38); line-height: 1.65; max-width: 28ch; }
.footer-col-title {
  font-size: 0.62rem; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 1.35rem;
}
.footer-links { list-style: none; display: flex; flex-direction: column; gap: 0.7rem; }
.footer-links a {
  font-size: 0.85rem; color: rgba(255,255,255,0.45);
  transition: color var(--dur-fast);
}
.footer-links a:hover { color: var(--gold-light); }
.footer-bottom {
  max-width: 1320px; margin: var(--sp-m) auto 0;
  display: flex; align-items: center;
  justify-content: space-between;
  flex-wrap: wrap; gap: 1rem;
}
.footer-copy { font-size: 0.75rem; color: rgba(255,255,255,0.28); }
.footer-legal { display: flex; gap: 1.5rem; }
.footer-legal a {
  font-size: 0.72rem; color: rgba(255,255,255,0.28);
  transition: color var(--dur-fast);
}
.footer-legal a:hover { color: rgba(255,255,255,0.55); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .nav-links, .nav-cta { display: none; }
  .nav-hamburger { display: flex; }

  .usp-grid { grid-template-columns: 1fr; }
  .usp-card { border-right: none; border-bottom: 1px solid var(--sand); }

  .split, .split-reverse { grid-template-columns: 1fr; direction: ltr; }
  .split-img { min-height: 380px; }

  .spaces-grid { grid-template-columns: 1fr; }
  .space-card.tall { grid-row: auto; }

  .menu-layout { grid-template-columns: 1fr; }
  .menu-img { aspect-ratio: 16/9; }

  .events-grid { grid-template-columns: 1fr; }
  .reviews-grid { grid-template-columns: 1fr; }
  .contact-layout { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .instagram-grid { grid-template-columns: repeat(3, 1fr); }
  .faq-layout { grid-template-columns: 1fr; }
  .gallery-mosaic { grid-template-columns: repeat(2, 1fr); }
  .gallery-item.wide { grid-column: auto; }
}

@media (max-width: 640px) {
  :root {
    --sp-l: 3rem;
    --sp-xl: 4.5rem;
  }
  .hero-content { padding-bottom: 3rem; }
  .calendar-inner { flex-direction: column; text-align: center; }
  .google-inner { flex-direction: column; text-align: center; }
  .footer-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .gallery-mosaic { grid-auto-rows: 140px; }
  .instagram-grid { grid-template-columns: repeat(3, 1fr); }
  .hero-ctas { flex-direction: column; }
  .hero-ctas .btn-primary,
  .hero-ctas .btn-outline { width: 100%; justify-content: center; }
  .wa-fab { bottom: 1.25rem; right: 1.25rem; }
}

/* ============================================================
   FOOTER — mobile refinement
   ============================================================ */
@media (max-width: 640px) {
  footer {
    padding: 3rem 1.25rem calc(2rem + env(safe-area-inset-bottom));
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 0;
    padding-bottom: 2rem;
    text-align: left;
  }

  .footer-grid > div {
    padding: 1.35rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.07);
  }

  .footer-grid > div:first-child {
    padding-top: 0;
  }

  .footer-grid > div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
  }

  .footer-brand-name {
    font-size: clamp(2rem, 11vw, 2.8rem);
    line-height: 1;
    margin-bottom: 0.9rem;
  }

  .footer-tagline {
    max-width: none;
    font-size: 0.92rem;
    line-height: 1.75;
    color: rgba(255,255,255,0.52);
  }

  .footer-col-title {
    margin-bottom: 1rem;
    font-size: 0.68rem;
    color: var(--gold-light);
  }

  .footer-links {
    gap: 0;
  }

  .footer-links li + li {
    border-top: 1px solid rgba(255,255,255,0.055);
  }

  .footer-links a {
    display: block;
    padding: 0.85rem 0;
    font-size: 0.98rem;
    line-height: 1.45;
    color: rgba(255,255,255,0.66);
  }

  .footer-links a:active {
    color: var(--gold-light);
  }

  .footer-bottom {
    margin-top: 1.6rem;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }

  .footer-copy {
    font-size: 0.78rem;
    line-height: 1.6;
    color: rgba(255,255,255,0.36);
  }

  .footer-legal {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    border-top: 1px solid rgba(255,255,255,0.07);
  }

  .footer-legal a {
    display: block;
    padding: 0.85rem 0;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.42);
    border-bottom: 1px solid rgba(255,255,255,0.055);
  }
}

@media (max-width: 380px) {
  footer {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .footer-links a {
    font-size: 0.94rem;
  }
}
/* ===== BOLLINI MATRIMONIO.COM ===== */

.wedding-badges {
  background: #fff;
  overflow: hidden;
}

.wedding-badges-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 2.5rem;
}

.wedding-badges-header .display-m {
  margin: 0.75rem 0 0.75rem;
}

.badges-carousel-wrap {
  position: relative;
}

.badges-carousel {
  display: flex;
  align-items: center;
  gap: 3rem;
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  padding: 1rem 4rem 1.5rem;
  scrollbar-width: none;
}

.badges-carousel::-webkit-scrollbar {
  display: none;
}

.badge-item {
  flex: 0 0 auto;
  scroll-snap-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.badge-item img {
  height: 150px;
  width: auto;
  max-width: 230px;
  object-fit: contain;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.badge-item:hover img {
  transform: translateY(-4px);
  opacity: 0.92;
}

.badges-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  border: 0;
  background: rgba(255,255,255,0.95);
  box-shadow: 0 14px 40px rgba(0,0,0,0.12);
  color: var(--dark);
  font-size: 3rem;
  line-height: 1;
  cursor: pointer;
}

.badges-prev {
  left: 0;
}

.badges-next {
  right: 0;
}

@media (max-width: 768px) {
  .wedding-badges-header {
    margin-bottom: 1.5rem;
  }

  .badges-carousel {
    gap: 1.6rem;
    padding: 0.75rem 2.5rem 1.25rem;
  }

  .badge-item img {
    height: 118px;
    max-width: 170px;
  }

  .badges-arrow {
    width: 46px;
    height: 46px;
    font-size: 2.4rem;
  }
}