/* Travertino — nero/blood/cream */
:root{
  --ink: #0a0605;
  --ink-2: #140d0b;
  --blood: #8b0a1a;
  --passion: #c8102e;
  --cream: #f4edd8;
  --cream-2: #d8cfb6;
  --cream-3: #8b8272;
}
*{box-sizing:border-box; margin:0; padding:0;}
html, body{background:var(--ink); color:var(--cream); scroll-behavior:smooth;}
body{
  font-family: 'Cormorant Garamond', 'Fraunces', Georgia, serif;
  -webkit-font-smoothing:antialiased;
  overflow-x: hidden;
}
img{max-width:100%; display:block;}

.display{font-family:'Fraunces', Georgia, serif; font-variation-settings:"opsz" 144;}
.cormorant{font-family:'Cormorant Garamond', Georgia, serif;}
.italiana{font-family:'Italiana', 'Fraunces', serif; font-weight:400;}
.script{font-family:'Playfair Display', 'Fraunces', serif; font-style:italic; font-weight:400; font-variation-settings:"opsz" 144;}

.reveal{opacity:0; transform:translateY(30px); transition:opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1; transform:translateY(0);}
.reveal-slow{transition-duration:1.8s;}

@keyframes drift{0%,100%{transform:translate(-50%, 0)} 50%{transform:translate(-50%, 8px)}}
@keyframes pulse{0%,100%{opacity:1; transform:scale(1)} 50%{opacity:.4; transform:scale(1.3)}}
@keyframes fadeUp{from{opacity:0; transform:translateY(20px)} to{opacity:1; transform:translateY(0)}}
@keyframes marquee{from{transform:translateX(0)} to{transform:translateX(-50%)}}
@keyframes eq0{0%{height:20%} 100%{height:90%}}
@keyframes eq1{0%{height:60%} 100%{height:30%}}
@keyframes eq2{0%{height:30%} 100%{height:80%}}
@keyframes eq3{0%{height:70%} 100%{height:40%}}

.rsvp-input{
  width:100%; padding:16px 0;
  background:transparent; border:none; border-bottom:1px solid rgba(10,6,5,.25);
  color:var(--ink); font-family:'Cormorant Garamond', serif; font-size:22px;
  font-style:italic; font-weight:400; outline:none;
  transition:border-color .3s;
}
.rsvp-input:focus{border-color:var(--blood);}
.rsvp-input::placeholder{color:rgba(10,6,5,.3);}
textarea.rsvp-input{resize:none; border:1px solid rgba(10,6,5,.2); padding:14px 16px;}
.rsvp-btn-sm{
  width:40px; height:40px; background:transparent; border:1px solid rgba(10,6,5,.25);
  cursor:pointer; color:var(--ink); font-size:18px; font-family:'Fraunces', serif;
}
::selection{background:var(--blood); color:var(--cream);}

/* scrollbar */
::-webkit-scrollbar{width:8px; background:var(--ink);}
::-webkit-scrollbar-thumb{background:var(--blood);}

/* ── MOBILE ≤ 767px ──────────────────────────────────────────── */
@media (max-width: 767px) {

  /* Hero */
  .hero-name { font-size: clamp(72px, 18vw, 110px) !important; }
  .hero-corner { display: none !important; }

  /* Messaggio */
  .messaggio-ring { display: none !important; }

  /* Storia */
  .storia-grid {
    grid-template-columns: 32px 1fr !important;
    gap: 0 16px !important;
  }
  .storia-photo {
    width: 100% !important;
    max-width: none !important;
    margin-bottom: 20px;
  }
  .storia-content { grid-column: 2 !important; }

  /* Programma */
  .programma-grid {
    grid-template-columns: 1fr !important;
  }
  .programma-time { font-size: clamp(40px, 10vw, 64px) !important; }

  /* Galleria — layout a colonna singola */
  .galleria-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  .galleria-item {
    width: 100% !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }

  /* Location */
  .location-grid {
    grid-template-columns: 1fr !important;
  }
  .countdown-digit { font-size: clamp(36px, 9vw, 64px) !important; }

  /* Regali */
  .regali-grid {
    grid-template-columns: 1fr !important;
  }
  .iban-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* RSVP */
  .rsvp-btn-sm { width: 44px !important; height: 44px !important; }

  /* FAQ */
  .faq-answer { padding-left: 24px !important; }

  /* Footer */
  .footer-hashtag { font-size: clamp(40px, 10vw, 80px) !important; }

  /* Nav hamburger */
  .nav-links { display: none !important; }
  .nav-hamburger { display: flex !important; }
  .nav-mobile-open .nav-links {
    display: flex !important;
    flex-direction: column !important;
    position: fixed !important;
    inset: 0 !important;
    background: var(--ink) !important;
    z-index: 9998 !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 28px !important;
  }
}
