/* DA NONNA GIÒ — Mobile-first, premium dark UI
   Fix: header stable on smartphone, boxed nav pills + Prenota CTA, logo floating.
*/

:root{
  --bg:#0c0f12;
  --panel:rgba(255,255,255,.06);
  --panel2:rgba(255,255,255,.10);
  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.70);
  --muted2:rgba(255,255,255,.56);
  --line:rgba(255,255,255,.14);
  --shadow:0 24px 70px rgba(0,0,0,.55);
  --radius:18px;
  --radius2:26px;
  --accent:#ff3b2f;
  --accent2:#8fe1c6;
  --gold:#f2d28b;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background:
    radial-gradient(1100px 560px at 20% 10%, rgba(255,59,47,.18), transparent 60%),
    radial-gradient(980px 520px at 80% 15%, rgba(143,225,198,.14), transparent 55%),
    radial-gradient(900px 520px at 55% 110%, rgba(242,210,139,.12), transparent 55%),
    var(--bg);
  color:var(--text);
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* Layout helpers */
.container{width:min(var(--max), calc(100% - 40px)); margin:0 auto}
.grid{display:grid; gap:18px}

/* Accessibility */
.skip{
  position:absolute; left:-999px; top:auto;
  width:1px; height:1px; overflow:hidden;
}
.skip:focus{
  left:16px; top:16px; width:auto; height:auto;
  background:rgba(0,0,0,.82); color:#fff;
  padding:10px 12px; border-radius:12px;
  border:1px solid var(--line); z-index:200;
}

/* Buttons */
.btn, .btn-small, .btn--small, .btn-ghost, .btn--ghost{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
  user-select:none;
}
.btn:hover, .btn-small:hover, .btn--small:hover, .btn-ghost:hover, .btn--ghost:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.22);
}
.btn--ghost, .btn-ghost{background:transparent}
.btn.ghost{background:transparent}
.btn.small{padding:9px 12px; font-size:14px}

.btn--small, .btn-small{padding:10px 14px; font-size:14px}

/* Pills inside header/nav */
.nav-pill{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  font-size:14px;
  color:rgba(255,255,255,.90);
  white-space:nowrap;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.nav-pill:hover{background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.22); transform: translateY(-1px)}
.nav-pill.active{background:rgba(255,59,47,.18); border-color:rgba(255,59,47,.35)}
.nav-pill--cta{
  background: linear-gradient(135deg, rgba(255,59,47,.95), rgba(255,59,47,.62));
  border-color: rgba(255,59,47,.55);
}
.nav-pill--cta:hover{background: linear-gradient(135deg, rgba(255,59,47,1), rgba(255,59,47,.72))}

/* Header (stable on smartphone) */
.site-header{
  position:sticky; top:0; z-index:120;
  padding-top: env(safe-area-inset-top);
  background: rgba(12,15,18,.58);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.site-header.scrolled{background: rgba(12,15,18,.72)}

.nav-wrap{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px;
  padding:12px 0;
  position:relative;
}
.brand{
  display:flex; align-items:center; gap:12px;
  min-width: 0;
}
.brand-logo{
  width:52px; height:auto;
  filter: drop-shadow(0 18px 30px rgba(0,0,0,.55));
  transform: translateZ(0);
}
.float{animation: floaty 4.2s ease-in-out infinite}
@keyframes floaty{0%,100%{transform: translateY(0)}50%{transform: translateY(-6px)}}

.brand-text{display:flex; flex-direction:column; line-height:1.05; min-width:0}
.brand-text strong{font-size:14px; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.brand-text em{font-style:normal; font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.nav-toggle{
  display:none;
  width:44px; height:44px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  align-items:center; justify-content:center;
  padding:0;
}

.nav-icon{width:22px; height:22px; display:block; filter: drop-shadow(0 10px 18px rgba(0,0,0,.45))}

/* Pizza icon spin on open/close */
.nav-toggle.spin-open .nav-icon{animation: spinOpen .38s ease-out both}
.nav-toggle.spin-close .nav-icon{animation: spinClose .38s ease-out both}
@keyframes spinOpen{from{transform: rotate(0deg)}to{transform: rotate(180deg)}}
@keyframes spinClose{from{transform: rotate(0deg)}to{transform: rotate(-180deg)}}

.site-nav{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}

/* Progress bar */
.progress{height:2px; background:rgba(255,255,255,.08)}
.progress span{display:block; height:100%; width:0%; background: linear-gradient(90deg, rgba(255,59,47,.95), rgba(143,225,198,.80))}

/* Mobile menu: prevents shifting/wrapping in header */
@media (max-width: 920px){
  .brand-text em{display:none}
}
@media (max-width: 980px){
  .nav-toggle{display:flex}
  .site-nav{
    position:absolute;
    top: calc(100% + 10px);
    left:0; right:0;
    margin:0;
    padding:12px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.14);
    background: rgba(12,15,18,.86);
    box-shadow: var(--shadow);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .site-nav.open{display:flex}
  .site-nav .nav-pill{width:100%; justify-content:flex-start; padding:14px 14px; border-radius:16px}
  .site-nav .nav-pill--cta{justify-content:center}
}

/* Hero */
.hero{position:relative; padding: 30px 0 24px}
.hero-bg, .hero-overlay, .hero-noise{position:absolute; inset:0; pointer-events:none}
.hero-bg{
  background:
    radial-gradient(900px 480px at 15% 10%, rgba(255,59,47,.22), transparent 60%),
    radial-gradient(700px 420px at 85% 20%, rgba(143,225,198,.18), transparent 60%),
    radial-gradient(800px 520px at 65% 110%, rgba(242,210,139,.10), transparent 60%);
  opacity:.95;
}
.hero-noise{opacity:.10; mix-blend-mode: overlay; background-image: url("../img/noise.svg"); background-size: 260px 260px}

.hero-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:22px;
  align-items:stretch;
}
.hero-copy{padding:28px; border:1px solid rgba(255,255,255,.14); border-radius: var(--radius2); background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); box-shadow: var(--shadow); position:relative; overflow:hidden}
.hero-copy::after{content:""; position:absolute; inset:-1px; background: radial-gradient(700px 420px at 10% 0%, rgba(255,59,47,.18), transparent 60%); opacity:.85}
.hero-copy > *{position:relative; z-index:1}

.kicker{color:var(--muted); font-size:13px; letter-spacing:.08em; text-transform:uppercase}
.hero-copy h1{font-size: clamp(34px, 4.6vw, 56px); line-height:1.05; margin:10px 0 12px}
.accent{color:#fff; text-shadow: 0 0 28px rgba(255,59,47,.22)}
.lead{color:var(--muted); line-height:1.7; font-size:16px; margin:0}
.hero-cta, .hero-ctas{display:flex; gap:12px; flex-wrap:wrap; margin-top:18px}
.hero-meta{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px}
.pill{padding:10px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background: rgba(0,0,0,.16); color: rgba(255,255,255,.86); font-size:13px}

.hero-media{border:1px solid rgba(255,255,255,.14); border-radius: var(--radius2); background: rgba(255,255,255,.04); box-shadow: var(--shadow); overflow:hidden}
.media-card{position:relative}
.media-img{width:100%; height: 360px; object-fit:cover; background:rgba(255,255,255,.03)}
.media-float{position:absolute; left:14px; right:14px; bottom:14px; display:flex; gap:10px; flex-wrap:wrap}
.float-badge{flex:1 1 180px; padding:12px 12px; border-radius:16px; border:1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.28); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px)}
.float-badge strong{display:block; font-size:13px}
.float-badge span{display:block; margin-top:4px; font-size:12px; color:var(--muted)}

@media (max-width: 900px){
  .hero-grid{grid-template-columns:1fr}
  .media-img{height:300px}
  .hero-copy{padding:22px}
}

/* Sections */
.section{padding:64px 0}
.section.alt, .section--soft, .section-soft{background: rgba(255,255,255,.02); border-top:1px solid rgba(255,255,255,.06); border-bottom:1px solid rgba(255,255,255,.06)}
.section-head, .section__head{margin-bottom:18px}
.section-head h2, .section__head h2{margin:0 0 10px; font-size: clamp(24px, 3.2vw, 40px); line-height:1.12}
.section-head p, .section__head p{margin:0; color:var(--muted); line-height:1.7}

.cards-3{grid-template-columns: repeat(3, 1fr)}
@media (max-width: 900px){.cards-3{grid-template-columns:1fr}}
.card{
  padding:18px;
  border-radius: var(--radius);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: 0 18px 50px rgba(0,0,0,.38);
}
.card h3{margin:0 0 10px; font-size:18px}
.card p{margin:0 0 12px; color:var(--muted); line-height:1.7}
.link{color:#fff; opacity:.92}
.link:hover{opacity:1; text-decoration:underline}

.split{display:grid; grid-template-columns: 1fr 1fr; gap:22px; align-items:center}
.split .img{border-radius: var(--radius2); border:1px solid rgba(255,255,255,.14); box-shadow: var(--shadow); background:rgba(255,255,255,.03)}
.split-copy h2{margin:0 0 10px; font-size: clamp(24px, 3vw, 40px); line-height:1.12}
.split-copy p{margin:0 0 12px; color:var(--muted); line-height:1.7}
@media (max-width: 900px){.split{grid-template-columns:1fr}}

.checklist, .check{list-style:none; padding:0; margin:12px 0 0}
.checklist li, .check li{margin:8px 0; padding-left:26px; position:relative; color:rgba(255,255,255,.86); line-height:1.6}
.checklist li::before, .check li::before{content:"✓"; position:absolute; left:0; top:0; color: rgba(143,225,198,.95)}

.inline-cta{margin-top:16px}

/* Menu page */
.filters, .chips{display:flex; gap:10px; flex-wrap:wrap}
.chip{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.88);
  cursor:pointer;
}
.chip.active{background: rgba(255,59,47,.18); border-color: rgba(255,59,47,.35)}
.menu-grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:18px; margin-top:18px}
@media (max-width: 980px){.menu-grid{grid-template-columns:1fr}}
.menu-card{padding:18px; border-radius: var(--radius); border:1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04)}
.menu-card h3{margin:0 0 8px}
.menu-card p{margin:0; color:var(--muted); line-height:1.65}
.price{margin-top:12px; display:flex; justify-content:space-between; align-items:center; color: rgba(255,255,255,.88)}
.price strong{color:#fff}

/* Gallery */
.masonry{display:grid; grid-template-columns: repeat(12, 1fr); gap:12px}
.masonry__item, .masonry .gallery-item{grid-column: span 4}
@media (max-width: 980px){.masonry__item, .masonry .gallery-item{grid-column: span 6}}
@media (max-width: 620px){.masonry__item, .masonry .gallery-item{grid-column: span 12}}
.gallery-item{
  border-radius: var(--radius2);
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  overflow:hidden;
  box-shadow: 0 16px 44px rgba(0,0,0,.35);
  cursor:pointer;
}
.gallery-item img{width:100%; height: 240px; object-fit:cover}
.masonry__tag{position:absolute; left:12px; bottom:12px; padding:8px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background: rgba(0,0,0,.35); font-size:12px; color: rgba(255,255,255,.88)}

.lightbox{
  position:fixed; inset:0; z-index:300;
  display:none; place-items:center;
  background: rgba(0,0,0,.72);
  padding: 18px;
}
.lightbox.open{display:grid}
.lightbox__img{max-height: 78vh; border-radius: 18px; border:1px solid rgba(255,255,255,.14); box-shadow: var(--shadow)}
.lightbox__close{
  position:absolute; top:18px; right:18px;
  width:44px; height:44px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.35);
  color:#fff; cursor:pointer;
}

.no-scroll{overflow:hidden}

/* Footer */
.site-footer{
  margin-top: 40px;
  border-top:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.14);
}
.foot-grid, .footer-grid, .footer__grid{display:grid; grid-template-columns: 1.3fr 1fr 1fr; gap:18px; padding: 34px 0}
@media (max-width: 900px){.foot-grid, .footer-grid, .footer__grid{grid-template-columns:1fr}}
.foot a, .foot-links a, .footer-links a{color: rgba(255,255,255,.86)}
.foot a:hover, .foot-links a:hover, .footer-links a:hover{text-decoration:underline}
.footer-bottom, .foot-bottom, .footer__bottom{border-top:1px solid rgba(255,255,255,.08); padding:14px 0; color: var(--muted2); font-size:13px}

/* Cookie */
.cookie{position:fixed; left:0; right:0; bottom:0; z-index:250; padding: 16px; display:none}
.cookie.show{display:block}
.cookie-card{
  margin:0 auto;
  width:min(var(--max), calc(100% - 40px));
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(12,15,18,.86);
  box-shadow: var(--shadow);
  padding:14px;
  display:flex; gap:14px; align-items:center; justify-content:space-between; flex-wrap:wrap;
}
.cookie-card p{margin:0; color: var(--muted); line-height:1.6; font-size:14px}
.cookie-actions{display:flex; gap:10px}

/* Reveal */
[data-reveal], .reveal{opacity:0; transform: translateY(14px); transition: opacity .55s ease, transform .55s ease}
.in{opacity:1 !important; transform:none !important}

/* Small fixes */
hr{border:0; border-top:1px solid rgba(255,255,255,.10); margin:22px 0}
.muted{color:var(--muted)}
.muted2{color:var(--muted2)}
.mini{font-size:14px; color:var(--muted2); line-height:1.6}

/* ============================
   MOBILE & GLOBAL IMPROVEMENTS
   ============================ */

/* Better tap targets on mobile */
@media (max-width: 600px) {
  .btn, .btn--ghost, .btn-ghost {
    padding: 13px 18px;
    font-size: 15px;
  }
  .section { padding: 44px 0; }
  .container, .wrap {
    width: calc(100% - 32px);
  }
}

/* Fix hero text on sub-pages: always readable */
.hero--sub {
  position: relative;
  overflow: hidden;
  padding: 80px 0 60px;
  min-height: auto !important;
}
.hero--sub .hero-media {
  position: absolute; inset: 0; border-radius: 0; border: none;
}
.hero--sub .hero-media img {
  width: 100%; height: 100%; object-fit: cover; opacity: .22;
}
.hero--sub .hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(160deg, rgba(12,15,18,.88) 35%, rgba(12,15,18,.80));
}
.hero--sub .hero-inner, .hero--sub .wrap.hero-inner {
  position: relative; z-index: 1;
}
.hero--sub .hero-copy {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}
.hero--sub .hero-copy::after { display: none; }

/* Micro text */
.micro { font-size: 12px; color: var(--muted2); margin-top: 12px; }

/* Grid helpers */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 680px) { .grid2 { grid-template-columns: 1fr; } }

/* Nav active fix */
.nav-pill.active {
  background: rgba(255,59,47,.18);
  border-color: rgba(255,59,47,.35);
}

/* Card padding variant */
.card.pad { padding: 22px 24px; }

/* List reset in footer */
footer ul { list-style: none; padding: 0; margin: 0; }
footer ul li { margin: 6px 0; }
footer ul li a { color: rgba(255,255,255,.75); font-size: 14px; transition: color .15s; }
footer ul li a:hover { color: #fff; }
footer h4 { margin: 0 0 12px; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.55); }

/* Footer responsive */
@media (max-width: 700px) {
  .footer-grid { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 440px) {
  .footer-grid { grid-template-columns: 1fr !important; }
}

/* Map iframe */
.map iframe, .map-wrap iframe {
  width: 100%; height: 260px; border: 0;
  display: block; border-radius: 0;
}
.map { border-radius: var(--radius); overflow: hidden; }

/* Ticks / checklist */
.ticks { list-style: none; padding: 0; margin: 12px 0 0; }
.ticks li { padding: 7px 0 7px 24px; position: relative; color: rgba(255,255,255,.85); font-size: 14px; }
.ticks li::before { content: '✓'; position: absolute; left: 0; color: rgba(143,225,198,.9); }

/* Callout box */
.callout {
  padding: 14px 16px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
}

/* HR */
.hr { height: 1px; background: rgba(255,255,255,.08); margin: 14px 0; }

/* Tiny */
.tiny { font-size: 13px; color: var(--muted2); }

/* List for contact */
.list { list-style: none; padding: 0; margin: 0; }
.list li {
  display: flex; justify-content: space-between;
  padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.07);
  font-size: 14px;
}
.list li:last-child { border-bottom: none; }

/* Grain overlay */
.grain {
  position: fixed; inset: 0; z-index: 999; pointer-events: none;
  opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

/* Wrap alias */
.wrap { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }
@media (max-width: 600px) { .wrap { width: calc(100% - 28px); } }

/* btn--small variant */
.btn--small { padding: 9px 14px; font-size: 13px; }

/* ══════════════════════════════════════
   ANIMATIONS & MICRO-INTERACTIONS
   ══════════════════════════════════════ */

/* Fade-up reveal (replaces basic data-reveal) */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .65s cubic-bezier(.22,1,.36,1), transform .65s cubic-bezier(.22,1,.36,1);
}
[data-reveal].revealed {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger children of reveal containers */
[data-reveal] > *:nth-child(1) { transition-delay: .05s; }
[data-reveal] > *:nth-child(2) { transition-delay: .13s; }
[data-reveal] > *:nth-child(3) { transition-delay: .21s; }
[data-reveal] > *:nth-child(4) { transition-delay: .29s; }
[data-reveal] > *:nth-child(5) { transition-delay: .37s; }
[data-reveal] > *:nth-child(6) { transition-delay: .45s; }

/* Floating logo */
@keyframes float-logo {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-6px); }
}
.brand-logo.float { animation: float-logo 3.5s ease-in-out infinite; }

/* Card hover lift */
.card, .dish-card, .quote-card, .fry-card, .degu-card, .rist-section, .pizza-card {
  transition: transform .22s cubic-bezier(.22,1,.36,1), box-shadow .22s, border-color .22s, background .22s !important;
}
.card:hover, .dish-card:hover, .quote-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0,0,0,.35);
}
.pizza-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 28px rgba(0,0,0,.3);
}

/* Button pulse on hover */
.btn {
  position: relative; overflow: hidden;
}
.btn::after {
  content: '';
  position: absolute; inset: 0;
  background: rgba(255,255,255,.0);
  transition: background .18s;
}
.btn:hover::after { background: rgba(255,255,255,.08); }

/* Nav pill hover */
.nav-pill {
  transition: background .18s, color .18s, border-color .18s;
}

/* Hero text shimmer on load */
@keyframes shimmer-in {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero__copy h1, .hero-home h1 {
  animation: shimmer-in .7s cubic-bezier(.22,1,.36,1) both;
}
.hero__copy .lead, .hero-home .lead {
  animation: shimmer-in .7s .15s cubic-bezier(.22,1,.36,1) both;
}
.hero__cta, .hero-home .cta-row {
  animation: shimmer-in .7s .28s cubic-bezier(.22,1,.36,1) both;
}

/* Media card parallax subtle zoom */
.media-img {
  transition: transform .6s cubic-bezier(.22,1,.36,1);
}
.media-card:hover .media-img {
  transform: scale(1.04);
}

/* Progress bar smooth */
#progressBar {
  transition: width .1s linear;
}

/* Eyebrow text pop */
.eyebrow {
  animation: shimmer-in .5s .05s cubic-bezier(.22,1,.36,1) both;
}

/* Tab active underline animation */
.menu-tab, .cat-tab {
  position: relative;
  transition: background .18s, border-color .18s, color .18s;
}

/* Scroll indicator pulse */
@keyframes scroll-bounce {
  0%, 100% { transform: translateY(0); opacity: .6; }
  50%       { transform: translateY(5px); opacity: 1; }
}

/* Quote card left accent */
.quote-card {
  position: relative; overflow: hidden;
}
.quote-card::before {
  content: '"';
  position: absolute; top: -10px; left: 14px;
  font-size: 80px; line-height: 1;
  color: rgba(255,59,47,.12);
  font-family: 'Fraunces', serif;
  pointer-events: none;
}

/* Masonry item zoom */
.masonry__item img {
  transition: transform .4s cubic-bezier(.22,1,.36,1);
}
.masonry__item:hover img {
  transform: scale(1.05);
}

/* Chatbot bounce in */
@keyframes chat-bounce-in {
  0%   { opacity:0; transform: scale(.85) translateY(10px); }
  60%  { transform: scale(1.03) translateY(-2px); }
  100% { opacity:1; transform: scale(1) translateY(0); }
}
#nng-chat-bubble.open {
  animation: chat-bounce-in .3s cubic-bezier(.22,1,.36,1) both;
}

/* ── CONTORNI MADE IT footer credit ── */
.contorni-credit {
  text-align: center;
  padding: 12px 0 18px;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.22);
  border-top: 1px solid rgba(255,255,255,.06);
  margin-top: 4px;
}
.contorni-credit a {
  color: rgba(255,59,47,.5);
  text-decoration: none;
  font-weight: 600;
  transition: color .18s;
}
.contorni-credit a:hover { color: rgba(255,59,47,.85); }