/* ============================================================
   Tema Sannio — Warm Territory Style
   Ispirato a sannio.com: cream + arancio salmone + verde tenue
   Inter serif + system sans, pulito e accogliente
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

/* === VARIABLES === */
:root {
  --bg:#F8F4ED;
  --card:#FFFFFF;
  --ink:#2E2E2E;
  --green:#E8825C;
  --green-light:#F09475;
  --green-pale:#FDEEE6;
  --gold:#8BA562;
  --gold-light:#E6EEDC;
  --muted:#7A7067;
  --border:#EBE4D7;
  --cream:#FDF8F0;
  --accent:#3A3028;
  --font-serif:'Playfair Display',Georgia,serif;
  --font-sans:'Inter','Segoe UI',sans-serif;
}
::selection{background:#E8825C;color:#fff}

/* === GLOBAL === */
body{
  font-family:var(--font-sans)!important;
  color:var(--ink)!important;
  background:var(--bg)!important;
  font-weight:400;
  line-height:1.7;
}

/* === NAV — White minimal with orange CTA === */
.nav{
  padding:1.2rem 3rem!important;
  background:rgba(255,255,255,.98)!important;
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  transition:all .3s;
}
.nav-cross{
  width:36px!important;height:36px!important;
  background:var(--green)!important;
  border-radius:8px!important;
  box-shadow:0 4px 14px rgba(232,130,92,.25);
}
.nav-cross::before,.nav-cross::after{background:#fff!important;border-radius:2px}
.nav-name{
  font-family:var(--font-serif)!important;
  font-weight:700!important;
  font-size:1.4rem!important;
  color:var(--ink)!important;
  letter-spacing:.01em;
}
.nav-links a{
  font-family:var(--font-sans)!important;
  font-size:.88rem!important;
  font-weight:500!important;
  color:var(--ink)!important;
  text-transform:none!important;
  letter-spacing:0!important;
}
.nav-links a:hover{color:var(--green)!important}
.nav-cta{
  background:var(--green)!important;
  color:#fff!important;
  border:none!important;
  padding:.75rem 1.5rem!important;
  font-family:var(--font-sans)!important;
  font-size:.82rem!important;
  font-weight:600!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
  border-radius:6px!important;
  box-shadow:0 4px 14px rgba(232,130,92,.3)!important;
  transition:all .3s!important;
}
.nav-cta:hover{
  background:#d4714a!important;
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(232,130,92,.4)!important;
}
.nav.scrolled{
  box-shadow:0 4px 30px rgba(0,0,0,.06);
}
.mobile-overlay{background:#fff!important}
.mobile-overlay a{color:var(--ink)!important;font-weight:500}
.mobile-overlay a:hover{color:var(--green)!important}

/* === HERO — Landscape photo with overlapping white card === */
.hero{
  min-height:90vh!important;
  padding:10rem 2rem 6rem!important;
  background:
    linear-gradient(rgba(248,244,237,.5),rgba(248,244,237,.95)),
    url('https://images.unsplash.com/photo-1543856089-56e9c51d4a5f?w=1920&q=85') center/cover no-repeat!important;
  position:relative;
  display:flex!important;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.hero::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 0%,rgba(248,244,237,.3) 50%,var(--bg) 100%);
  pointer-events:none;
}
.hero-inner{
  display:block!important;
  grid-template-columns:unset!important;
  max-width:780px!important;
  margin:0 auto!important;
  text-align:center!important;
  position:relative;
  z-index:2;
  background:#fff!important;
  padding:4rem 3.5rem!important;
  border-radius:24px!important;
  box-shadow:0 30px 80px rgba(58,48,40,.15);
  border:1px solid rgba(255,255,255,.8);
}
.hero-content{text-align:center!important;max-width:100%!important;margin:0 auto!important}
.hero-visual{display:none!important}

.hero-badge{
  display:inline-flex!important;
  align-items:center;gap:8px;
  background:var(--green)!important;
  color:#fff!important;
  font-family:var(--font-sans)!important;
  font-size:.72rem!important;
  font-weight:700!important;
  letter-spacing:.15em!important;
  text-transform:uppercase!important;
  padding:.55rem 1.2rem!important;
  margin-bottom:1.6rem!important;
  border-radius:30px!important;
  box-shadow:0 4px 16px rgba(232,130,92,.3);
}
.hero-badge::before{display:none!important}

.hero h1{
  font-family:var(--font-serif)!important;
  font-size:clamp(2.4rem,5vw,4rem)!important;
  font-weight:700!important;
  line-height:1.15!important;
  letter-spacing:-.02em!important;
  color:var(--ink)!important;
  margin-bottom:1.3rem!important;
}
.hero h1 em{
  color:var(--green)!important;
  font-style:italic!important;
  font-weight:500!important;
}

.hero-sub{
  font-family:var(--font-sans)!important;
  font-size:1.02rem!important;
  font-weight:400!important;
  color:var(--muted)!important;
  max-width:580px!important;
  margin:0 auto 2rem!important;
  line-height:1.8!important;
}

.hero-buttons{
  justify-content:center!important;
  gap:1rem!important;
}

.hero-stats{
  justify-content:center!important;
  gap:2.5rem!important;
  margin-top:2.5rem!important;
  padding-top:2rem!important;
  border-top:1px solid var(--border)!important;
}
.hero-stat-num{
  font-family:var(--font-serif)!important;
  font-size:1.8rem!important;
  color:var(--green)!important;
  font-weight:700!important;
}
.hero-stat-label{
  font-size:.75rem!important;
  font-weight:500!important;
  color:var(--muted)!important;
}

/* === SECTION HEADINGS === */
.section-tag{
  display:inline-block!important;
  background:var(--green-pale)!important;
  color:var(--green)!important;
  font-family:var(--font-sans)!important;
  font-size:.72rem!important;
  font-weight:700!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  padding:.5rem 1.2rem!important;
  border-radius:30px!important;
  margin-bottom:1.2rem!important;
}
.section-tag::before,.section-tag::after{display:none!important}

.section-heading{
  font-family:var(--font-serif)!important;
  font-size:clamp(2rem,4vw,3rem)!important;
  font-weight:700!important;
  line-height:1.2!important;
  color:var(--ink)!important;
  letter-spacing:-.01em;
}

.page-header{text-align:center}
.page-header h1{
  font-family:var(--font-serif)!important;
  font-size:clamp(2.2rem,4.5vw,3.4rem)!important;
  font-weight:700!important;
  color:var(--ink)!important;
  letter-spacing:-.01em;
}
.page-header p{
  font-family:var(--font-sans)!important;
  font-size:1.05rem!important;
  color:var(--muted)!important;
  font-weight:400!important;
  margin-top:.5rem!important;
}

/* === SECTIONS === */
section{padding:6rem 2rem!important}
.services{background:var(--cream)!important}
.reviews{background:var(--bg)!important}
.team{background:var(--cream)!important}
.faq{background:var(--bg)!important}
.contact{background:var(--cream)!important}
.gallery{background:var(--bg)!important}

/* === CARDS — Clean white with soft shadow === */
.svc-card,.review-card,.team-card,.offerta-card,.blog-card,.contact-card,.orari-card{
  background:#fff!important;
  border:1px solid var(--border)!important;
  border-radius:16px!important;
  padding:2.2rem!important;
  box-shadow:0 4px 20px rgba(58,48,40,.04);
  transition:all .35s cubic-bezier(.25,.8,.25,1);
}
.svc-card:hover,.review-card:hover,.team-card:hover,.offerta-card:hover,
.blog-card:hover,.contact-card:hover{
  border-color:var(--green)!important;
  box-shadow:0 16px 40px rgba(232,130,92,.12);
  transform:translateY(-6px);
}

/* === SERVICES === */
.svc-icon{
  width:64px!important;height:64px!important;
  background:var(--green-pale)!important;
  color:var(--green)!important;
  border-radius:14px!important;
  font-size:1.4rem!important;
  margin-bottom:1.4rem!important;
  transition:all .3s;
}
.svc-card:hover .svc-icon{
  background:var(--green)!important;
  color:#fff!important;
  transform:scale(1.05);
}
.svc-card h3{
  font-family:var(--font-serif)!important;
  font-size:1.3rem!important;
  font-weight:700!important;
  margin-bottom:.7rem!important;
  color:var(--ink)!important;
}
.svc-card p{
  font-size:.92rem!important;
  color:var(--muted)!important;
  line-height:1.8!important;
}

/* === BUTTONS === */
.btn-hero,.nav-cta,.filter-btn,.page-btn{
  border-radius:8px!important;
  font-family:var(--font-sans)!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
  font-size:.82rem!important;
  font-weight:600!important;
  padding:.95rem 2rem!important;
  transition:all .3s!important;
}
.btn-hero-primary{
  background:var(--green)!important;
  color:#fff!important;
  border:none!important;
  box-shadow:0 6px 20px rgba(232,130,92,.3)!important;
}
.btn-hero-primary:hover{
  background:#d4714a!important;
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(232,130,92,.4)!important;
}
.btn-hero-outline{
  background:#fff!important;
  border:1.5px solid var(--border)!important;
  color:var(--ink)!important;
}
.btn-hero-outline:hover{
  border-color:var(--green)!important;
  color:var(--green)!important;
  transform:translateY(-2px);
}

/* === REVIEWS === */
.review-card{
  text-align:center!important;
  padding:2.5rem 2rem!important;
  position:relative;
}
.review-card::before{
  content:'"'!important;
  position:absolute;top:1rem;left:2rem;
  font-family:var(--font-serif);
  font-size:4rem;line-height:1;
  color:var(--green-pale);
}
.review-card p{
  font-family:var(--font-sans)!important;
  font-size:1rem!important;
  color:var(--ink)!important;
  line-height:1.9!important;
  margin-bottom:1.5rem!important;
  position:relative;z-index:1;
}
.review-stars{
  color:var(--green)!important;
  letter-spacing:.15em!important;
  margin-bottom:1rem!important;
}
.review-author{
  color:var(--green)!important;
  font-family:var(--font-sans)!important;
  font-size:.85rem!important;
  font-weight:700!important;
}

/* === TEAM === */
.team-card{text-align:center!important}
.team-photo{
  width:120px!important;height:120px!important;
  border-radius:50%!important;
  border:4px solid var(--green-pale)!important;
  margin:0 auto 1.2rem!important;
  transition:border-color .3s;
}
.team-card:hover .team-photo{border-color:var(--green)!important}
.team-card h3{
  font-family:var(--font-serif)!important;
  font-size:1.3rem!important;
  font-weight:700!important;
  margin-bottom:.2rem!important;
}
.team-role{
  color:var(--green)!important;
  font-family:var(--font-sans)!important;
  font-size:.82rem!important;
  font-weight:600!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
.team-card p{
  font-size:.9rem!important;
  color:var(--muted)!important;
  margin-top:1rem!important;
}
.team-social a{
  background:var(--green-pale)!important;
  color:var(--green)!important;
  border-radius:50%!important;
  width:36px!important;height:36px!important;
}
.team-social a:hover{
  background:var(--green)!important;
  color:#fff!important;
  transform:translateY(-2px);
}

/* === OFFERTE === */
.offerta-badge{
  background:var(--green)!important;
  color:#fff!important;
  border-radius:20px!important;
  padding:.4rem 1rem!important;
  font-family:var(--font-sans)!important;
  font-weight:700!important;
  font-size:.75rem!important;
  letter-spacing:.05em!important;
}
.offerta-card h3{
  font-family:var(--font-serif)!important;
  font-weight:700!important;
}
.offerta-scadenza{
  color:var(--green)!important;
  font-family:var(--font-sans)!important;
  font-size:.8rem!important;
  font-weight:600!important;
}

/* === BLOG === */
.blog-card h3{
  font-family:var(--font-serif)!important;
  font-weight:700!important;
  font-size:1.3rem!important;
}
.cat-news,.cat-offerta,.cat-blog{
  background:var(--green-pale)!important;
  color:var(--green)!important;
  border-radius:20px!important;
  font-family:var(--font-sans)!important;
  font-weight:600!important;
  font-size:.72rem!important;
  padding:.35rem 1rem!important;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
}

/* === ABOUT === */
.about{
  background:linear-gradient(135deg,var(--green) 0%,#d4714a 100%)!important;
  color:#fff;
}
.about h2,.about h3,.about-title{
  font-family:var(--font-serif)!important;
  color:#fff!important;
  font-weight:700!important;
}
.about-tag{
  color:#fff!important;
  background:rgba(255,255,255,.2)!important;
  padding:.5rem 1.2rem!important;
  border-radius:30px!important;
}
.about-stat-num{color:#fff!important;font-family:var(--font-serif)!important}
.about-quote{
  border-left:4px solid #fff!important;
  font-family:var(--font-serif)!important;
  font-style:italic;
}
.about-text{color:rgba(255,255,255,.9)!important}

/* === CONTACT === */
.contact-card h3{font-family:var(--font-serif)!important;font-weight:700!important}
.contact-card a{color:var(--green)!important;font-weight:600}
.contact-card a:hover{color:#d4714a!important}
.contact-card-icon{
  background:var(--green-pale)!important;
  color:var(--green)!important;
  border-radius:14px!important;
}

/* === FAQ === */
.faq-item{
  background:#fff!important;
  border:1px solid var(--border)!important;
  border-radius:14px!important;
  box-shadow:0 4px 16px rgba(58,48,40,.04);
  margin-bottom:1rem;
}
.faq-item.open{
  border-color:var(--green)!important;
  box-shadow:0 8px 24px rgba(232,130,92,.12);
}
.faq-question{
  font-family:var(--font-serif)!important;
  font-weight:700!important;
  font-size:1.1rem!important;
}
.faq-item.open .faq-question{color:var(--green)!important}

/* === GALLERY === */
.gallery-item{
  border-radius:14px;
  overflow:hidden;
  transition:transform .4s;
}
.gallery-item:hover{transform:scale(1.02)}
.gallery-item img{transition:transform .6s}
.gallery-item:hover img{transform:scale(1.08)}

/* === FOOTER === */
.site-footer{
  background:var(--accent)!important;
  color:rgba(255,255,255,.7)!important;
}
.footer-cross{
  background:var(--green)!important;
  width:32px!important;height:32px!important;
  border-radius:6px!important;
}
.footer-cross::before,.footer-cross::after{background:#fff!important}
.footer-name{
  font-family:var(--font-serif)!important;
  color:#fff!important;
  font-size:1.3rem!important;
  font-weight:700!important;
}
.footer-col h4{
  font-family:var(--font-sans)!important;
  font-size:.85rem!important;
  font-weight:700!important;
  color:#fff!important;
}
.footer-col a:hover,.footer-bottom a{color:var(--green)!important}
.footer-social-link{
  background:rgba(255,255,255,.08)!important;
  border:none!important;
}
.footer-social-link:hover{background:var(--green)!important}

/* === BREADCRUMB === */
.breadcrumb-bar{
  background:var(--cream)!important;
  border-bottom:1px solid var(--border)!important;
}
.breadcrumb-bar a{
  font-family:var(--font-sans)!important;
  font-size:.85rem!important;
  color:var(--muted)!important;
}
.breadcrumb-bar a:hover{color:var(--green)!important}
.bc-current{color:var(--ink)!important;font-weight:600!important}

/* === WHATSAPP + BACK TO TOP === */
.whatsapp-float,.back-to-top{
  background:var(--green)!important;
  color:#fff!important;
  box-shadow:0 8px 25px rgba(232,130,92,.35)!important;
}
.whatsapp-float:hover,.back-to-top:hover{
  background:#d4714a!important;
  transform:translateY(-3px) scale(1.05)!important;
}

/* === COOKIE BANNER === */
.cookie-banner{
  background:#fff!important;
  border-top:3px solid var(--green)!important;
  box-shadow:0 -4px 20px rgba(0,0,0,.08)!important;
}
.cookie-banner p{color:var(--ink)!important}
.cookie-banner button{
  background:var(--green)!important;
  color:#fff!important;
  border-radius:8px!important;
  font-family:var(--font-sans)!important;
  font-weight:600!important;
  padding:.6rem 1.4rem!important;
}

/* === MOBILE === */
@media(max-width:768px){
  .nav{padding:1rem 1.2rem!important}
  section{padding:4rem 1.2rem!important}
  .hero{padding:7rem 1.2rem 3rem!important}
  .hero h1{font-size:clamp(1.8rem,7vw,2.8rem)!important}
  .hero-stats{gap:1.5rem!important;flex-wrap:wrap}
  .svc-grid{grid-template-columns:1fr!important;gap:1.2rem!important}
  .svc-card,.review-card,.team-card,.offerta-card,.blog-card,.contact-card{
    padding:1.8rem!important;
  }
}
