/* Tema Dolce — Romantic Confectionery
   Playfair Display + Quicksand. Rosa caldo #D6336C, pesca #F4B5A6, cipria #FFF5F2.
   Per pasticcerie, gelaterie, bakery, cake designer, fiorai, confetterie, cafè romantici.

   FIRMA VISIVA UNICA:
   - Gradient mesh animato sullo sfondo (rosa/pesca/cipria che si muovono)
   - Scallop borders in SVG sui card (stile merletto torta)
   - Heart bullet points al posto dei dots
   - Hero centered con visual circolare "petali"
   - Service grid "café menu" a 2 colonne con dotted separator
   - Reviews a scroll orizzontale (marquee) non a griglia
   - Hover ripple con petali su CTA
   - Card hover: tilt + "nastro" decorative */

/* === FONTS === */
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/playfair-400.ttf') format('truetype')}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/playfair-400i.ttf') format('truetype')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/playfair-700.ttf') format('truetype')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/quicksand-400.ttf') format('truetype')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/quicksand-500.ttf') format('truetype')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/quicksand-600.ttf') format('truetype')}
@font-face{font-family:'Quicksand';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/quicksand-700.ttf') format('truetype')}

/* === VARIABLES === */
:root {
  --bg:#FFF5F2;--card:#FFFFFF;--ink:#5C2A36;--green:#D6336C;--green-light:#E55A85;
  --green-pale:#FDE3EB;--gold:#F4B5A6;--gold-light:#FDEEEA;--muted:#8B5060;
  --border:#F5DDE0;--cream:#FCE8EC;
  --font-serif:'Playfair Display',Georgia,serif;
  --font-sans:'Quicksand','Nunito',sans-serif;
}
::selection{background:#D6336C;color:#FFF5F2}

/* === KEYFRAMES === */
@keyframes meshFloat{
  0%,100%{background-position:0% 0%,100% 100%,50% 50%}
  33%{background-position:30% 10%,70% 90%,60% 40%}
  66%{background-position:10% 60%,90% 30%,40% 70%}
}
@keyframes petalFall{
  0%{transform:translateY(-20px) rotate(0deg);opacity:0}
  10%{opacity:.5}
  90%{opacity:.3}
  100%{transform:translateY(40px) rotate(360deg);opacity:0}
}
@keyframes ribbonWiggle{
  0%,100%{transform:rotate(-2deg)}
  50%{transform:rotate(2deg)}
}
@keyframes scalloppulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.02)}
}

/* === ANIMATED MESH GRADIENT BACKGROUND === */
body{
  background:
    radial-gradient(at 10% 20%,#FDE3EB 0%,transparent 40%),
    radial-gradient(at 90% 80%,#FDEEEA 0%,transparent 40%),
    radial-gradient(at 50% 50%,#FCE8EC 0%,transparent 60%),
    #FFF5F2;
  background-size:200% 200%,200% 200%,200% 200%;
  animation:meshFloat 25s ease-in-out infinite;
  color:#5C2A36;
  font-family:'Quicksand',sans-serif;
}

/* === GLOBAL SHAPE — Super rounded, scallop shadow === */
.svc-card,.review-card,.team-card,.offerta-card,.blog-card,.contact-card,.orari-card,.faq-item{
  border-radius:24px!important;
  border:none!important;
  background:#fff;
  box-shadow:0 8px 30px rgba(214,51,108,.08);
  transition:all .55s cubic-bezier(.25,.8,.25,1);
  position:relative;
}
.svc-card:hover,.team-card:hover,.offerta-card:hover,.blog-card:hover,.contact-card:hover{
  transform:translateY(-8px);
  box-shadow:0 26px 55px -15px rgba(214,51,108,.22);
}
.svc-card::after{display:none!important}

/* === SCALLOP BORDER (SVG merletto torta) on cards === */
.svc-card::before{
  content:'';
  position:absolute;top:-12px;left:0;right:0;height:14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 14' preserveAspectRatio='none'%3E%3Cpath d='M0,14 L0,7 C5,0 10,0 15,7 C20,14 25,14 30,7 C35,0 40,0 45,7 C50,14 55,14 60,7 C65,0 70,0 75,7 C80,14 85,14 90,7 C95,0 100,0 100,7 L100,14 Z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat;
  background-size:100% 100%;
  pointer-events:none;
}

/* === Buttons — Pill with ribbon effect === */
.btn-hero,.nav-cta,.filter-btn,.page-btn{border-radius:50px!important}
.btn-hero-primary{
  background:linear-gradient(135deg,#D6336C,#E55A85)!important;
  color:#FFF5F2!important;padding:1.1rem 2.8rem!important;
  font-weight:700;letter-spacing:.04em;font-size:.82rem;
  border:none;
  box-shadow:0 10px 28px rgba(214,51,108,.32),inset 0 1px 0 rgba(255,255,255,.3);
  text-transform:uppercase;position:relative;overflow:hidden;
}
.btn-hero-primary::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.4) 0%,transparent 40%);
  opacity:0;transition:opacity .4s;
}
.btn-hero-primary:hover::before{opacity:1}
.btn-hero-primary:hover{
  transform:translateY(-3px) scale(1.02);
  box-shadow:0 16px 38px rgba(214,51,108,.42),inset 0 1px 0 rgba(255,255,255,.3);
}
.btn-hero-outline{
  border:2px solid #D6336C!important;color:#D6336C;
  padding:1.1rem 2.8rem!important;background:#fff;font-weight:700;
  text-transform:uppercase;font-size:.82rem;
}
.btn-hero-outline:hover{background:#FDE3EB;color:#D6336C!important;transform:translateY(-2px)}

/* === Icons — Soft circles with petal halo === */
.svc-icon,.orari-card-icon,.contact-card-icon{
  border-radius:50%!important;
  width:72px;height:72px;
  background:radial-gradient(circle,#FDEEEA,#FDE3EB);
  color:#D6336C;
  box-shadow:0 6px 18px rgba(214,51,108,.1),0 0 0 4px #FFF5F2,0 0 0 5px #FDE3EB;
  transition:all .4s;
  position:relative;
}
.svc-card:hover .svc-icon{
  background:radial-gradient(circle,#F4B5A6,#D6336C);
  color:#fff;
  transform:rotate(-8deg) scale(1.08);
  box-shadow:0 10px 24px rgba(214,51,108,.25),0 0 0 4px #FFF5F2,0 0 0 5px #D6336C;
}
.contact-card-icon{background:radial-gradient(circle,#FDE3EB,#F4B5A6);color:#D6336C}

/* === Hero badge — scalloped ribbon === */
.hero-badge{
  border-radius:50px;
  background:linear-gradient(135deg,#FDE3EB,#FDEEEA);
  color:#D6336C;
  padding:.6rem 1.6rem;letter-spacing:.12em;font-size:.72rem;font-weight:700;
  text-transform:uppercase;
  box-shadow:0 4px 14px rgba(214,51,108,.1);
  position:relative;
}
.hero-badge::before{
  content:'❤';background:transparent;
  width:auto;height:auto;
  color:#D6336C;font-size:.88rem;
  border-radius:0;
}

/* === Sections === */
.services,.orari,.reviews,.team,.contact,.gallery,.faq,.offerte-preview,.offerte-section,.turni-section,.booking-section,.blog-section{
  padding:6rem 2.5rem!important;
  background:transparent;
  position:relative;
}

/* === Hero — CENTERED, NOT SPLIT (different from base 2-col) === */
.hero{
  padding:10rem 2rem 6rem!important;
  text-align:center;position:relative;overflow:hidden;
}
.hero-inner{
  grid-template-columns:1fr!important;
  max-width:900px!important;
  text-align:center;
  gap:2rem!important;
}
.hero-content{text-align:center;max-width:720px;margin:0 auto}
.hero-visual{display:none!important}
.hero-sub{margin-left:auto!important;margin-right:auto!important;text-align:center}
.hero-buttons{justify-content:center!important}
.hero-stats{justify-content:center!important}

.hero::before{
  content:'';position:absolute;top:5%;left:5%;
  width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(244,181,166,.3),transparent 60%);
  pointer-events:none;
}
.hero::after{
  content:'';position:absolute;bottom:5%;right:5%;
  width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle,rgba(214,51,108,.15),transparent 60%);
  pointer-events:none;
}
.hero h1{
  font-size:clamp(3rem,6.5vw,5.4rem)!important;
  color:#5C2A36!important;font-weight:400!important;
  font-family:'Playfair Display',serif!important;
  line-height:1.05!important;letter-spacing:-.02em;
  position:relative;
}
.hero h1 em{
  color:#D6336C;font-style:italic;font-weight:400;
  position:relative;display:inline-block;
}
.hero h1 em::before{
  content:'';position:absolute;left:-8%;right:-8%;bottom:-4px;
  height:14px;background:#FDE3EB;z-index:-1;
  border-radius:50%;transform:skewX(-3deg);
}
.hero .lead,.hero-sub{color:#8B5060;font-weight:500;font-size:1.1rem}
.hero-visual-circle{
  width:380px;height:380px;
  background:conic-gradient(from 45deg,#FDE3EB,#F4B5A6,#D6336C,#F4B5A6,#FDE3EB);
  border-radius:50%;
  box-shadow:0 24px 70px rgba(214,51,108,.28),inset 0 0 60px rgba(255,255,255,.3);
  position:relative;
}
.hero-visual-circle::after{
  content:'';position:absolute;inset:12px;
  border-radius:50%;
  background:radial-gradient(circle,#FFF5F2,#FDEEEA);
  box-shadow:inset 0 0 40px rgba(214,51,108,.15);
}
.hero-visual-cross::before,.hero-visual-cross::after{background:#D6336C;border-radius:10px;z-index:2}
.hero-stat-num{color:#D6336C;font-size:2.8rem!important;font-family:'Playfair Display',serif!important;font-style:italic}
.hero-float{
  border-radius:22px;border:none;
  box-shadow:0 12px 36px rgba(214,51,108,.14);background:#fff;
}
.hero-float-icon.green{background:#FDE3EB;color:#D6336C}
.hero-float-icon.gold{background:#FDEEEA;color:#E55A85}

/* === Section headings — WITH heart-shaped divider === */
.section-heading{
  font-size:clamp(2.2rem,4.8vw,3.6rem)!important;
  color:#5C2A36!important;
  font-family:'Playfair Display',serif!important;
  font-weight:400!important;letter-spacing:-.01em;
  text-align:center;display:block;
}
.section-heading em,.about-title em{color:#D6336C;font-style:italic;font-weight:400;position:relative}
.section-heading::after{
  content:'❤';display:block;
  color:#F4B5A6;font-size:1.3rem;
  text-align:center;margin-top:.8rem;
}
.section-tag,.contact-tag{
  color:#D6336C!important;font-size:.78rem!important;
  letter-spacing:.2em!important;text-transform:uppercase!important;
  font-weight:700!important;
  display:inline-flex;align-items:center;gap:.5rem;
}
.section-tag::before,.contact-tag::before{
  content:'';display:inline-block;
  width:24px;height:2px;background:#F4B5A6;border-radius:2px;
}
.section-desc{text-align:center;max-width:640px;margin-left:auto;margin-right:auto}

/* === Service grid — CAFÉ MENU 2-col with dotted lines === */
.svc-grid{
  grid-template-columns:1fr 1fr!important;
  gap:2rem 3rem!important;
  max-width:1100px;margin:0 auto;
}
.svc-card{padding:2.2rem 2rem 2.2rem 2rem!important;text-align:left;background:#fff}
.svc-card h3{
  font-size:1.35rem!important;
  font-family:'Playfair Display',serif!important;
  color:#5C2A36;margin-top:1.4rem;font-weight:400;
  display:flex;align-items:baseline;gap:.6rem;
}
.svc-card h3::after{
  content:'';flex:1;height:1px;
  background:repeating-linear-gradient(90deg,#F4B5A6 0 4px,transparent 4px 8px);
  align-self:center;
  margin-left:.4rem;
}
.svc-card p{color:#8B5060;font-size:.95rem}
@media(max-width:720px){.svc-grid{grid-template-columns:1fr!important}}

/* === Nav — pink blush with heart logo === */
.nav{
  background:rgba(255,245,242,.92)!important;
  backdrop-filter:blur(14px);
  border-bottom:1px solid #F5DDE0!important;
}
.nav-name,.nav .brand{color:#5C2A36!important;font-family:'Playfair Display',serif!important;font-weight:400;font-style:italic}
.nav-links a{color:#8B5060!important;font-weight:600;letter-spacing:.04em}
.nav-links a:hover{color:#D6336C!important}
.nav-cross::before,.nav-cross::after{background:#D6336C}
.nav-cta{
  background:linear-gradient(135deg,#D6336C,#E55A85)!important;
  color:#FFF5F2!important;
  font-size:.78rem!important;padding:.8rem 1.8rem!important;
  border-radius:50px!important;font-weight:700;
  box-shadow:0 6px 18px rgba(214,51,108,.28);
  text-transform:uppercase;letter-spacing:.08em;
}
.nav-cta:hover{transform:translateY(-2px) scale(1.03)}
.nav.scrolled{background:rgba(255,245,242,.98);box-shadow:0 6px 28px rgba(214,51,108,.1)}
.mobile-overlay{background:linear-gradient(160deg,#D6336C,#5C2A36)}
.mobile-overlay a{color:#FDE3EB}
.mobile-overlay a:hover{color:#F4B5A6}

/* === About — pink gradient with heart bullets === */
.about{
  background:linear-gradient(135deg,#D6336C 0%,#E55A85 50%,#F4B5A6 100%)!important;
  color:#FFF5F2!important;border-radius:0;
  padding:6rem 3rem!important;position:relative;overflow:hidden;
}
.about::before{
  content:'';position:absolute;top:-30%;right:-10%;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.15),transparent 70%);
}
.about::after{
  content:'';position:absolute;bottom:-20%;left:-5%;
  width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.1),transparent 70%);
}
.about h1,.about h2,.about h3,.about-title{color:#FFF5F2!important;font-style:normal}
.about-title em{color:#FDE3EB;font-style:italic}
.about-stat-num{color:#FDE3EB;font-family:'Playfair Display',serif;font-style:italic}
.about-quote{border-color:#FFF5F2;color:#FDE3EB;font-style:italic;border-left-width:3px}
.about-values li{color:#FDE3EB;position:relative;padding-left:1.8rem;margin-bottom:.6rem}
.about-values li::before{
  content:'❤';background:transparent!important;
  position:absolute;left:0;top:0;
  width:auto;height:auto;color:#FDE3EB;
  font-size:.88rem;
}

/* === Reviews — HORIZONTAL MARQUEE SCROLL (unique!) === */
.reviews{padding:6rem 0!important;background:transparent;overflow:hidden}
.reviews-inner{max-width:none!important}
.review-grid,.reviews-grid,.reviews-slider{
  display:flex!important;
  grid-template-columns:none!important;
  gap:2rem;
  animation:dolceMarquee 45s linear infinite;
  width:max-content;
  padding:2rem 1rem;
}
.reviews:hover .review-grid,.reviews:hover .reviews-grid,.reviews:hover .reviews-slider{animation-play-state:paused}
.review-card{
  flex:0 0 360px!important;
  padding:2.4rem 2rem!important;
  text-align:center;
  background:#fff;
}
@keyframes dolceMarquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
.review-stars{color:#F4B5A6;font-size:1.2rem;letter-spacing:.3em}
.review-author{color:#D6336C;font-weight:700;font-family:'Playfair Display',serif}
.review-text{color:#5C2A36;font-style:italic;font-size:.95rem}
.review-card::before{
  content:'"';
  position:absolute;top:.4rem;left:1.2rem;
  font-family:'Playfair Display',serif;
  font-size:5rem;line-height:.8;
  color:#FDE3EB;
  pointer-events:none;
}

/* === Team — round photos with floating heart === */
.team-photo{
  border-radius:50%!important;
  width:150px!important;height:150px!important;
  border:6px solid #FDE3EB;
  box-shadow:0 12px 30px rgba(214,51,108,.15);
  transition:all .5s;
}
.team-card{text-align:center;padding:2.4rem 1.6rem!important;background:#fff;position:relative}
.team-card::before{
  content:'❤';
  position:absolute;top:1rem;right:1.2rem;
  color:#F4B5A6;font-size:1rem;
  opacity:0;transition:all .4s;
}
.team-card:hover::before{opacity:1;transform:scale(1.3) rotate(-10deg)}
.team-card:hover .team-photo{border-color:#F4B5A6;transform:scale(1.04)}
.team-role{color:#D6336C;font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.74rem}
.team-name{font-family:'Playfair Display',serif;color:#5C2A36;font-size:1.4rem;font-weight:400}

/* === Gallery — sticker style with varying sizes === */
.gallery-grid{gap:1.2rem!important}
.gallery-grid img,.gallery-grid a{
  border-radius:24px!important;
  border:4px solid #fff;
  box-shadow:0 10px 30px rgba(214,51,108,.12);
  transition:all .5s cubic-bezier(.34,1.4,.64,1);
}
.gallery-grid img:hover,.gallery-grid a:hover{
  transform:scale(1.04) rotate(-2deg);
  box-shadow:0 20px 50px rgba(214,51,108,.22);
  border-color:#FDE3EB;
}

/* === Offerte === */
.offerta-badge{
  background:linear-gradient(135deg,#D6336C,#E55A85);
  color:#FFF5F2;border-radius:50px;
  padding:.5rem 1.2rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;
  box-shadow:0 4px 14px rgba(214,51,108,.3);
}
.offerta-scadenza{color:#D6336C;font-weight:600}
.offerta-title{font-family:'Playfair Display',serif;color:#5C2A36;font-weight:400}
.offerta-card img{border-radius:22px 22px 0 0}

/* === Blog === */
.cat-news,.cat-offerta,.cat-blog{
  background:#FDE3EB;color:#D6336C;
  border-radius:50px;padding:.35rem 1.1rem;
  font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700;
  border:none;
}
.cat-offerta{background:linear-gradient(135deg,#FDEEEA,#F4B5A6);color:#5C2A36}
.blog-card h3{font-family:'Playfair Display',serif;color:#5C2A36;font-weight:400}
.blog-card img{border-radius:22px 22px 0 0}

/* === Contact === */
.contact{background:transparent}
.contact-card{background:#fff}
.contact-card a{color:#5C2A36}
.contact-card a:hover{color:#D6336C}

/* === Footer — burgundy with ribbon top === */
.site-footer{
  background:linear-gradient(135deg,#5C2A36,#3D1823)!important;
  color:#FDE3EB;
  position:relative;padding-top:5rem!important;
}
.site-footer::before{
  content:'';position:absolute;top:0;left:0;right:0;height:8px;
  background:linear-gradient(90deg,#D6336C,#F4B5A6,#D6336C,#F4B5A6,#D6336C);
  background-size:200% 100%;
  animation:meshFloat 8s linear infinite;
}
.site-footer a{color:#FDE3EB}
.site-footer a:hover{color:#F4B5A6}
.footer-logo{color:#F4B5A6;font-family:'Playfair Display',serif;font-style:italic}
.footer-cross::before,.footer-cross::after{background:#F4B5A6}
.footer-col h4{color:#FFF5F2;font-family:'Playfair Display',serif;font-weight:400}
.footer-bottom{border-top:1px solid rgba(244,181,166,.2)}
.footer-bottom a{color:#F4B5A6}

/* === FAQ — Accordion with heart indicator === */
.faq-item{
  background:#fff;border:none;
  box-shadow:0 6px 22px rgba(214,51,108,.06);
  border-radius:22px!important;
  margin-bottom:1rem;
}
.faq-item::before{display:none}
.faq-item.open{
  box-shadow:0 10px 30px rgba(214,51,108,.15);
  background:linear-gradient(135deg,#fff,#FDEEEA);
}
.faq-item.open .faq-question{color:#D6336C}
.faq-item.open .faq-question::after{content:'❤';color:#D6336C;margin-left:auto}
.faq-question{
  font-family:'Playfair Display',serif;color:#5C2A36;font-weight:400;font-size:1.08rem;
  display:flex;align-items:center;
}

/* === Turni === */
.turni-day.today{outline-color:#F4B5A6;outline-width:3px;outline-style:dashed}
.turni-event{border-left-color:#D6336C;border-left-width:4px;border-radius:14px}

/* === Forms === */
.booking-form input,.booking-form textarea,.booking-form select{
  border-radius:18px!important;
  border:2px solid #F5DDE0!important;
  background:#fff;
  padding:.9rem 1.2rem;
  transition:all .3s;
}
.booking-form input:focus,.booking-form textarea:focus{
  border-color:#D6336C;outline:none;
  box-shadow:0 0 0 4px rgba(214,51,108,.08);
}
.booking-form label{color:#D6336C;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.74rem}

/* === Brands === */
.brands{border-color:#F5DDE0;background:transparent}

/* === Filter / Pagination === */
.filter-btn{border:2px solid #F5DDE0;background:#fff;color:#5C2A36;border-radius:50px;font-weight:600}
.filter-btn.active,.filter-btn:hover{background:linear-gradient(135deg,#D6336C,#E55A85);color:#FFF5F2;border-color:transparent}
.page-btn{border:2px solid #F5DDE0;border-radius:50px;background:#fff}
.page-btn.active,.page-btn:hover{background:#D6336C;color:#FFF5F2;border-color:#D6336C}

/* === Cookie === */
.cookie-banner{background:#5C2A36;color:#FDE3EB;border-top:3px solid #F4B5A6}
.cookie-banner button{background:linear-gradient(135deg,#D6336C,#E55A85);color:#FFF5F2;border-radius:50px;font-weight:700}
.cookie-banner button:hover{background:linear-gradient(135deg,#E55A85,#F4B5A6)}

/* === Typography === */
h1,h2,h3,h4,h5,h6{font-family:'Playfair Display',Georgia,serif;color:#5C2A36;font-weight:400;letter-spacing:-.005em}
h1 em,h2 em,h3 em,h4 em,h5 em,h6 em{font-style:italic;color:#D6336C}
a{color:#D6336C;transition:color .2s}
a:hover{color:#E55A85}

/* === Mobile === */
@media(max-width:768px){
  .hero{padding:8rem 1.5rem 4rem!important}
  .hero-visual-circle{width:260px;height:260px}
  .services,.orari,.reviews,.team,.contact,.faq{padding:4rem 1.5rem!important}
  .svc-grid{grid-template-columns:1fr!important}
  .review-card{flex-basis:280px!important}
}
