/* =============================================
   C.M.D. – COSTRUZIONI MECCANICHE
   Global Stylesheet – Multi-page website
   ============================================= */

/* ---- Variables ---- */
:root {
  --primary:       #1a2b3c;
  --primary-light: #2c4055;
  --accent:        #c8a96e;
  --accent-hover:  #b8915a;
  --text:          #1a1a1a;
  --text-muted:    #5a6472;
  --text-light:    #9aa5b1;
  --bg:            #ffffff;
  --bg-alt:        #f4f6f8;
  --bg-dark:       #0f1923;
  --border:        #e2e6ea;
  --shadow-sm:     0 2px 8px  rgba(0,0,0,.07);
  --shadow:        0 4px 20px rgba(0,0,0,.10);
  --shadow-lg:     0 8px 40px rgba(0,0,0,.14);
  --radius:        8px;
  --radius-lg:     16px;
  --ease:          cubic-bezier(.4,0,.2,1);
  --t:             .3s;
  --nav-h:         72px;
  --font:          'Inter', sans-serif;
  --heading:       'Barlow Condensed', sans-serif;
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--text);background:var(--bg);line-height:1.65;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
address{font-style:normal}
button{cursor:pointer;border:none;background:none;font-family:inherit}
input,textarea,select{font-family:inherit;font-size:1rem}

/* ---- Utility ---- */
.container   {max-width:1200px;margin:0 auto;padding:0 1.5rem}
.section     {padding:5rem 0}
.section-alt {background:var(--bg-alt)}
.section-dark{background:var(--bg-dark);padding:5rem 0}

.section-header{text-align:center;margin-bottom:3.5rem}
.section-tag{
  display:inline-block;font-size:.74rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent);margin-bottom:.65rem
}
.section-header h2{
  font-family:var(--heading);font-size:clamp(2rem,4vw,2.8rem);
  font-weight:700;color:var(--primary);line-height:1.15;letter-spacing:.02em
}
.section-sub{max-width:640px;margin:.9rem auto 0;color:var(--text-muted);font-size:1.05rem}
.section-divider{width:48px;height:3px;background:var(--accent);margin:.9rem auto 0;border-radius:2px}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.85rem 1.8rem;border-radius:var(--radius);
  font-size:.95rem;font-weight:600;transition:var(--t) var(--ease);
  cursor:pointer;border:2px solid transparent;white-space:nowrap
}
.btn-primary{background:var(--accent);color:var(--primary);border-color:var(--accent)}
.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);transform:translateY(-2px);box-shadow:0 6px 20px rgba(200,169,110,.35)}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn-outline:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-dark{background:var(--primary);color:#fff;border-color:var(--primary)}
.btn-dark:hover{background:var(--primary-light);transform:translateY(-2px);box-shadow:var(--shadow)}
.btn-full{width:100%;justify-content:center}

/* Fade-up helper */
.fade-up{opacity:0;transform:translateY(20px);transition:opacity .5s cubic-bezier(.25,1,.5,1),transform .5s cubic-bezier(.25,1,.5,1);will-change:opacity,transform}
.fade-up.visible{opacity:1;transform:translateY(0);will-change:auto}

/* =============================================
   NAVBAR
   ============================================= */
.navbar{
  position:fixed;top:0;left:0;right:0;height:var(--nav-h);
  background:rgba(255,255,255,.97);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);z-index:1000;
  transition:box-shadow var(--t) var(--ease)
}
.navbar.scrolled{box-shadow:var(--shadow)}
.nav-container{
  max-width:1280px;margin:0 auto;padding:0 1.5rem;
  height:100%;display:flex;align-items:center;gap:1.5rem
}
.nav-logo img{height:50px;width:auto;object-fit:contain}
.nav-menu{display:flex;align-items:center;gap:.15rem;margin-left:auto}
.nav-link{
  display:inline-block;padding:.45rem .85rem;font-size:.87rem;
  font-weight:500;color:var(--text-muted);border-radius:var(--radius);
  transition:var(--t) var(--ease);white-space:nowrap
}
.nav-item-dropdown {
  position: relative;
}
.nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  background: #ffffff;
  min-width: 250px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  padding: .5rem 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: var(--t) var(--ease);
  z-index: 1001;
}
.nav-item-dropdown:hover .nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.nav-dropdown-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .7rem 1.2rem;
  font-size: .88rem;
  color: var(--text);
  font-weight: 500;
  transition: var(--t) var(--ease);
}
.nav-dropdown-item i {
  color: var(--accent);
  font-size: .9rem;
}
.nav-dropdown-item:hover {
  background: var(--bg-alt);
  color: var(--primary);
  padding-left: 1.5rem;
}

/* ---- Nav Toggle (Hamburger Button) ---- */
.nav-toggle {
  display: none;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 32px;
  height: 24px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  margin-left: auto;
  z-index: 1002;
  position: relative;
  border-radius: 4px;
  transition: opacity var(--t) var(--ease);
}
.nav-toggle span {
  display: block;
  width: 100%;
  height: 3px;
  background-color: var(--primary);
  border-radius: 3px;
  transition: transform 0.3s var(--ease), opacity 0.3s var(--ease), background-color 0.3s var(--ease);
  transform-origin: center;
}
.nav-toggle:hover span {
  background-color: var(--accent);
}
/* When menu is open, hamburger transforms to X */
.nav-toggle.open span:nth-child(1) {
  transform: translateY(10.5px) rotate(45deg);
  background-color: var(--accent);
}
.nav-toggle.open span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav-toggle.open span:nth-child(3) {
  transform: translateY(-10.5px) rotate(-45deg);
  background-color: var(--accent);
}

@media(max-width:768px){
  .nav-dropdown {
    position: static;
    box-shadow: none;
    border: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
    padding-left: 1rem;
    background: transparent;
  }
  .nav-item-dropdown.active-mobile .nav-dropdown {
    display: block;
  }
}


/* =============================================
   PAGE HEADER (inner pages)
   ============================================= */
.page-header{
  padding:calc(var(--nav-h) + 3rem) 0 3rem;
  background:linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
  text-align:center;color:#fff;position:relative;overflow:hidden
}
.page-header::after{
  content:'';position:absolute;inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")
}
.page-header-content{position:relative;z-index:1}
.page-header .section-tag{color:var(--accent)}
.page-header h1{
  font-family:var(--heading);font-size:clamp(2.2rem,5vw,3.5rem);
  font-weight:800;letter-spacing:.02em;margin-bottom:.75rem;line-height:1.1
}
.page-header p{font-size:1.05rem;opacity:.8;max-width:560px;margin:0 auto}
.page-breadcrumb{
  display:flex;align-items:center;justify-content:center;gap:.5rem;
  font-size:.8rem;opacity:.65;margin-top:1.5rem
}
.page-breadcrumb a:hover{opacity:1;color:var(--accent)}
.page-breadcrumb .sep{opacity:.5}

/* =============================================
   HERO (homepage)
   ============================================= */
.hero{
  position:relative;min-height:100vh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;text-align:center
}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(10,18,28,.78) 0%,rgba(10,18,28,.60) 60%,rgba(10,18,28,.80) 100%)
}
.hero-content{
  position:relative;z-index:1;color:#fff;
  padding:calc(var(--nav-h) + 2rem) 1.5rem 5rem;
  max-width:860px;margin:0 auto;
  display:flex;flex-direction:column;align-items:center
}
.hero-content h1{
  font-family:var(--heading);font-size:clamp(2.8rem,7vw,5.5rem);
  font-weight:800;line-height:1.05;letter-spacing:.02em;
  margin-bottom:1.25rem;text-shadow:0 2px 30px rgba(0,0,0,.4)
}
.hero-content h1 .accent{color:var(--accent)}
.hero-content p{
  font-size:clamp(1rem,2vw,1.2rem);
  color:rgba(255,255,255,.82);max-width:580px;margin-bottom:2.25rem
}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;margin-bottom:3.5rem}
.hero-stats{
  display:flex;align-items:center;gap:2.5rem;flex-wrap:wrap;justify-content:center;
  padding:1.75rem 2.5rem;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--radius-lg);
  backdrop-filter:blur(8px)
}
.stat{display:flex;flex-direction:column;align-items:center;gap:.2rem}
.stat-num{font-family:var(--heading);font-size:2.2rem;font-weight:800;color:var(--accent);line-height:1}
.stat-num small{font-size:1.1rem}
.stat-label{font-size:.72rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.08em}
.stat-divider{width:1px;height:44px;background:rgba(255,255,255,.18)}
.scroll-down{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);z-index:1;
  width:44px;height:44px;border:2px solid rgba(255,255,255,.35);border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;
  animation:bounce 2.4s ease-in-out infinite;transition:var(--t) var(--ease)
}
.scroll-down:hover{border-color:var(--accent);color:var(--accent)}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(8px)}}

/* =============================================
   CHI SIAMO
   ============================================= */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center;margin-bottom:4rem}
.about-image{position:relative}
.about-image img{width:100%;height:480px;object-fit:cover;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg)}
.about-badge{
  position:absolute;bottom:-1.5rem;right:-1.5rem;
  background:var(--accent);color:var(--primary);
  padding:1.25rem 1.5rem;border-radius:var(--radius);text-align:center;box-shadow:var(--shadow)
}
.badge-num{display:block;font-family:var(--heading);font-size:2.2rem;font-weight:800;line-height:1}
.badge-text{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.about-lead{font-size:1.08rem;color:var(--text);line-height:1.7;margin-bottom:1.5rem}
.about-list{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:.65rem}
.about-list li{display:flex;align-items:flex-start;gap:.75rem;font-size:.95rem;color:var(--text-muted)}
.about-list li i{color:var(--accent);font-size:1rem;margin-top:.2rem;flex-shrink:0}
.about-note{
  font-size:.95rem;color:var(--text-muted);margin-bottom:2rem;
  padding:1rem 1.25rem;background:var(--bg-alt);
  border-left:3px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0
}
.about-note strong{color:var(--primary)}
.about-numbers{display:flex;gap:1.25rem;flex-wrap:wrap}
.abt-num{
  display:flex;flex-direction:column;align-items:center;gap:.25rem;
  background:var(--bg-alt);padding:1rem 1.25rem;border-radius:var(--radius);min-width:90px;text-align:center
}
.abt-num i{color:var(--accent);font-size:1.2rem}
.abt-num span{font-family:var(--heading);font-size:1.4rem;font-weight:700;color:var(--primary)}
.abt-num small{font-size:.7rem;color:var(--text-light);text-transform:uppercase;letter-spacing:.06em}

/* ---- Partners marquee ---- */
.partners-section{margin-top:2rem;padding-top:3rem;border-top:1px solid var(--border)}
.partners-title{
  text-align:center;font-size:.8rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--text-light);margin-bottom:2rem
}
.marquee-wrapper{overflow:hidden;width:100%}
.marquee-track{
  display:flex;align-items:center;gap:0;
  /* 4 items * 200px each = 800px, duplicate = 1600px total, animate half */
  width:calc(200px * 8);
  animation:marqueeSlide 20s linear infinite
}
.marquee-track:hover{animation-play-state:paused}
.marquee-item{
  flex:0 0 200px;
  display:flex;align-items:center;justify-content:center;padding:0 2rem
}
.marquee-item img{
  height:56px;width:auto;max-width:140px;object-fit:contain;
  filter:grayscale(60%);opacity:.7;transition:filter .4s ease,opacity .4s ease
}
.marquee-item img:hover{filter:grayscale(0);opacity:1}
@keyframes marqueeSlide{
  0%  {transform:translateX(0)}
  100%{transform:translateX(calc(-200px * 4))}
}

/* =============================================
   PRODUZIONE
   ============================================= */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-bottom:3rem}
.prod-card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:2rem;transition:var(--t) var(--ease);position:relative;overflow:hidden
}
.prod-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:3px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;transition:var(--t) var(--ease)
}
.prod-card:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.prod-card:hover::after{transform:scaleX(1)}
.prod-icon{font-size:2rem;color:var(--accent);margin-bottom:1.25rem}
.prod-card h3{font-family:var(--heading);font-size:1.2rem;font-weight:700;color:var(--primary);margin-bottom:.65rem;letter-spacing:.02em}
.prod-card p{font-size:.9rem;color:var(--text-muted);line-height:1.65}
.prod-showcase{position:relative;border-radius:var(--radius-lg);overflow:hidden;height:320px}
.prod-showcase img{width:100%;height:100%;object-fit:cover}
.showcase-overlay{
  position:absolute;bottom:0;left:0;right:0;
  background:linear-gradient(to top,rgba(0,0,0,.75) 0%,transparent 100%);
  padding:2rem;color:#fff
}
.showcase-overlay h3{font-family:var(--heading);font-size:1.5rem;font-weight:700;margin-bottom:.4rem}
.showcase-overlay p{font-size:.9rem;opacity:.85}

/* =============================================
   LAVORAZIONI
   ============================================= */
.lav-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.75rem}
.lav-card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:2rem;position:relative;overflow:hidden;transition:var(--t) var(--ease)
}
.lav-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px);border-color:var(--accent)}
.lav-num{
  position:absolute;top:1.25rem;right:1.5rem;
  font-family:var(--heading);font-size:3rem;font-weight:800;
  color:var(--border);line-height:1;transition:var(--t) var(--ease)
}
.lav-card:hover .lav-num{color:rgba(200,169,110,.15)}
.lav-icon{font-size:2rem;color:var(--accent);margin-bottom:1rem}
.lav-card h3{font-family:var(--heading);font-size:1.25rem;font-weight:700;color:var(--primary);margin-bottom:.65rem;letter-spacing:.02em}
.lav-card p{font-size:.9rem;color:var(--text-muted);line-height:1.65;margin-bottom:1.25rem}
.lav-tags{display:flex;flex-wrap:wrap;gap:.4rem}
.lav-tags span{
  display:inline-block;padding:.25rem .7rem;background:var(--bg-alt);color:var(--text-muted);
  font-size:.7rem;font-weight:600;letter-spacing:.06em;border-radius:100px;
  text-transform:uppercase;transition:var(--t) var(--ease)
}
.lav-card:hover .lav-tags span{background:rgba(200,169,110,.12);color:var(--accent)}

/* =============================================
   SERVIZI
   ============================================= */
.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
.service-item{
  display:flex;gap:1.25rem;align-items:flex-start;
  padding:1.75rem;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-lg);
  transition:var(--t) var(--ease)
}
.service-item:hover{background:rgba(255,255,255,.08);border-color:rgba(200,169,110,.35);transform:translateY(-3px)}
.service-icon{
  width:52px;height:52px;background:rgba(200,169,110,.15);color:var(--accent);
  font-size:1.25rem;border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:var(--t) var(--ease)
}
.service-item:hover .service-icon{background:var(--accent);color:var(--primary)}
.service-body h3{font-family:var(--heading);font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:.4rem;letter-spacing:.02em}
.service-body p{font-size:.88rem;color:rgba(255,255,255,.6);line-height:1.6}

/* =============================================
   I NOSTRI LAVORI
   ============================================= */
.works-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto;gap:1.25rem}
.work-card{position:relative;border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;aspect-ratio:4/3}
.work-featured{grid-column:1/3;aspect-ratio:16/9}
.work-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.work-card:hover img{transform:scale(1.06)}
.work-overlay{
  position:absolute;bottom:0;left:0;right:0;
  background:linear-gradient(to top,rgba(15,25,35,.88) 0%,transparent 100%);
  padding:1.5rem;color:#fff;transform:translateY(10px);opacity:0;transition:var(--t) var(--ease)
}
.work-card:hover .work-overlay{transform:translateY(0);opacity:1}
.work-cat{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}
.work-overlay h3{font-family:var(--heading);font-size:1.2rem;font-weight:700}

/* =============================================
   RECENSIONI
   ============================================= */
.rating-summary{display:flex;align-items:center;gap:.75rem;justify-content:center;margin-top:.75rem}
.rating-stars-big{display:flex;gap:.2rem}
.rating-stars-big i{color:#f59e0b;font-size:1.5rem}
.rating-num{font-family:var(--heading);font-size:2.5rem;font-weight:800;color:var(--primary)}
.rating-label{font-size:.9rem;color:var(--text-muted)}
.reviews-marquee-wrapper{overflow:hidden;margin-top:2.5rem;width:100%}
.reviews-marquee-track{
  display:flex;gap:1.5rem;
  width:calc((320px + 1.5rem)*12);
  animation:reviewsSlide 36s linear infinite
}
.reviews-marquee-track:hover{animation-play-state:paused}
@keyframes reviewsSlide{0%{transform:translateX(0)}100%{transform:translateX(calc(-1*(320px + 1.5rem)*6))}}
.review-card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:1.5rem;width:320px;flex:0 0 320px;box-shadow:var(--shadow-sm);transition:var(--t) var(--ease)
}
.review-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.review-header-flex{display:flex;align-items:center;justify-content:space-between;margin-bottom:.85rem}
.review-header-flex .review-stars{margin-bottom:0}
.review-google-badge{
  display:inline-flex;align-items:center;gap:.35rem;font-size:.74rem;font-weight:600;
  color:#5f6368;background:#f8f9fa;padding:.22rem .55rem;border-radius:100px;
  border:1px solid #dadce0;text-decoration:none;transition:var(--t) var(--ease)
}
.review-google-badge:hover{background:#fff;border-color:#4285F4;color:#1a73e8;transform:scale(1.04);box-shadow:0 1px 4px rgba(66,133,244,.2)}
.review-stars{display:flex;gap:.15rem}
.review-stars i{color:#f59e0b;font-size:.9rem}
.review-card p{font-size:.92rem;color:var(--text-muted);line-height:1.6;margin-bottom:1.25rem;font-style:italic}
.reviewer{display:flex;align-items:center;gap:.65rem}
.reviewer-initial{
  width:36px;height:36px;background:var(--primary);color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;flex-shrink:0
}
.reviewer-name{font-size:.88rem;font-weight:600;color:var(--primary)}
.reviewer-meta{display:flex;flex-direction:column}
.reviewer-verified{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;color:var(--text-light);margin-top:2px}

/* Google Rating Card & Buttons */
.home-rating-box{
  display:flex;align-items:center;justify-content:space-between;
  max-width:760px;margin:0 auto 2.5rem;padding:1.35rem 2rem;
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);flex-wrap:wrap;gap:1.5rem
}
.home-rating-left{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.google-brand-pill{
  display:inline-flex;align-items:center;gap:.45rem;
  background:#f8f9fa;border:1px solid #dadce0;padding:.4rem .85rem;border-radius:100px;
  font-size:.88rem;font-weight:700;color:#3c4043
}
.home-rating-score-num{font-family:var(--heading);font-size:2.8rem;font-weight:800;color:var(--primary);line-height:1}
.home-rating-info{display:flex;flex-direction:column;gap:.25rem}
.home-rating-stars{display:flex;gap:.2rem}
.home-rating-stars i{color:#f59e0b;font-size:1.15rem}
.home-rating-subtext{font-size:.82rem;color:var(--text-muted)}
.btn-google-maps{
  display:inline-flex;align-items:center;gap:.65rem;
  background:#fff;color:#3c4043;font-size:.88rem;font-weight:600;
  padding:.7rem 1.35rem;border-radius:100px;border:1px solid #dadce0;
  box-shadow:0 1px 3px rgba(60,64,67,.12);transition:all .25s ease;text-decoration:none
}
.btn-google-maps:hover{
  background:#f8f9fa;color:#202124;border-color:#4285F4;
  box-shadow:0 4px 12px rgba(66,133,244,.2);transform:translateY(-2px)
}
.home-reviews-banner{
  display:flex;align-items:center;justify-content:space-between;
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:1.5rem 2.25rem;margin-top:2.5rem;gap:1.5rem;box-shadow:var(--shadow-sm);flex-wrap:wrap
}
.home-reviews-banner-text{display:flex;align-items:center;gap:1.25rem}
.home-reviews-banner-icon{
  width:50px;height:50px;background:#e8f0fe;color:#1a73e8;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:1.35rem;flex-shrink:0
}
.home-reviews-banner-text strong{display:block;font-size:1.05rem;color:var(--primary);margin-bottom:.25rem}
.home-reviews-banner-text p{font-size:.88rem;color:var(--text-muted);margin:0}
.home-reviews-banner-actions{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap}
@media(max-width:768px){
  .home-rating-box{flex-direction:column;text-align:center;padding:1.25rem}
  .home-rating-left{justify-content:center}
  .home-reviews-banner{flex-direction:column;text-align:center;padding:1.25rem}
  .home-reviews-banner-text{flex-direction:column;text-align:center}
  .home-reviews-banner-actions{justify-content:center;width:100%}
}

/* =============================================
   CONTATTI
   ============================================= */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:1.25rem}
.info-card{
  display:flex;gap:1.25rem;align-items:flex-start;padding:1.25rem;
  background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);transition:var(--t) var(--ease)
}
.info-card:hover{box-shadow:var(--shadow);border-color:var(--accent)}
.info-icon{
  width:44px;height:44px;background:var(--primary);color:var(--accent);
  font-size:1.1rem;border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;flex-shrink:0
}
.info-body h4{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-light);margin-bottom:.35rem}
.info-body p,.info-body a{font-size:.95rem;color:var(--text);line-height:1.55}
.info-body a:hover{color:var(--accent)}
.closed{color:var(--text-light)!important;font-size:.85rem!important;margin-top:.25rem;display:flex;align-items:center;gap:.35rem}
.closed i{color:#e03737}
.contact-form-wrap{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.75rem;box-shadow:var(--shadow-sm)}
.contact-form-wrap h3{font-family:var(--heading);font-size:1.4rem;font-weight:700;color:var(--primary);margin-bottom:1.5rem;letter-spacing:.02em}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-group{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.form-group label{font-size:.82rem;font-weight:600;color:var(--text-muted);letter-spacing:.04em}
.form-group input,.form-group textarea,.form-group select{
  padding:.75rem 1rem;border:1.5px solid var(--border);border-radius:var(--radius);
  font-size:.92rem;color:var(--text);background:#fff;transition:var(--t) var(--ease);outline:none;resize:vertical
}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(200,169,110,.15)}
.form-note{font-size:.78rem;color:var(--text-light);text-align:center;margin-top:.75rem}
.contact-map{display:flex;flex-direction:column;gap:1rem}
.map-wrap{height:480px;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow)}
.map-cta{
  display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.5rem;
  background:var(--primary);color:#fff;border-radius:var(--radius);
  font-size:.92rem;font-weight:600;transition:var(--t) var(--ease);justify-content:center
}
.map-cta:hover{background:var(--primary-light);transform:translateY(-2px);box-shadow:var(--shadow)}
.map-cta i{color:var(--accent)}

/* =============================================
   FOOTER
   ============================================= */
.footer{background:var(--bg-dark)}
.footer-top{padding:4rem 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:2.5rem}
.footer-logo{height:54px;width:auto;margin-bottom:1.25rem}
.footer-brand p{font-size:.88rem;color:rgba(255,255,255,.5);line-height:1.65;margin-bottom:1.5rem;max-width:260px}
.footer-social{display:flex;gap:.65rem}
.footer-social a{
  width:36px;height:36px;background:rgba(255,255,255,.06);color:rgba(255,255,255,.6);
  border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:.85rem;
  transition:var(--t) var(--ease);border:1px solid rgba(255,255,255,.08)
}
.footer-social a:hover{background:var(--accent);color:var(--primary);border-color:var(--accent)}
.footer-col h4{font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:1.25rem}
.footer-col ul{display:flex;flex-direction:column;gap:.55rem}
.footer-col ul li a{font-size:.88rem;color:rgba(255,255,255,.5);transition:var(--t) var(--ease)}
.footer-col ul li a:hover{color:var(--accent);padding-left:4px}
.footer-col address p{font-size:.88rem;color:rgba(255,255,255,.5);display:flex;gap:.55rem;margin-bottom:.75rem;line-height:1.55}
.footer-col address i{color:var(--accent);margin-top:.15rem;flex-shrink:0}
.footer-col address a{color:rgba(255,255,255,.5)}
.footer-col address a:hover{color:var(--accent)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.06);padding:1.25rem 0;text-align:center}
.footer-bottom p{font-size:.8rem;color:rgba(255,255,255,.3)}

/* =============================================
   BACK TO TOP
   ============================================= */
.back-top{
  position:fixed;bottom:2rem;right:2rem;width:44px;height:44px;
  background:var(--primary);color:var(--accent);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.85rem;
  box-shadow:var(--shadow);opacity:0;pointer-events:none;
  transform:translateY(12px);transition:var(--t) var(--ease);z-index:800;
  border:1px solid rgba(200,169,110,.3)
}
.back-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.back-top:hover{background:var(--accent);color:var(--primary);transform:translateY(-2px)}

/* =============================================
   RESPONSIVE
   ============================================= */
@media(max-width:1024px){
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
}
@media(max-width:900px){
  .about-grid{grid-template-columns:1fr}
  .about-badge{bottom:1rem;right:1rem}
  .lav-grid{grid-template-columns:repeat(2,1fr)}
  .works-grid{grid-template-columns:1fr 1fr}
  .work-featured{grid-column:1/3}
  .contact-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
  :root{--nav-h:64px}
  .section{padding:3rem 0}
  .section-dark{padding:3rem 0}

  /* === NAVBAR === */
  .nav-toggle{display:flex}
  .nav-logo img{height:42px}
  .nav-menu{
    position:fixed;top:var(--nav-h);left:0;right:0;
    background:#fff;flex-direction:column;align-items:stretch;
    padding:1rem;border-bottom:1px solid var(--border);box-shadow:var(--shadow);
    gap:.25rem;transform:translateY(-10px);opacity:0;pointer-events:none;
    transition:var(--t) var(--ease);z-index:999;max-height:calc(100vh - var(--nav-h));
    overflow-y:auto;
  }
  .nav-menu.open{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav-link{padding:.75rem 1rem;border-radius:var(--radius);font-size:.95rem}
  .nav-cta{text-align:center}

  /* === HERO === */
  .hero-content{padding:calc(var(--nav-h) + 1.5rem) 1rem 3rem}
  .hero-actions{flex-direction:column;align-items:center}
  .hero-actions .btn{width:100%;max-width:280px;justify-content:center}
  .hero-stats{gap:.85rem;padding:1rem 1.25rem;flex-wrap:wrap}
  .stat-divider{display:none}
  .stat-num{font-size:1.6rem}

  /* === ABOUT === */
  .about-grid{grid-template-columns:1fr;gap:2rem}
  .about-image img{height:260px}
  .about-badge{bottom:1rem;right:1rem}
  .about-numbers{gap:.75rem}
  .abt-num{min-width:70px;padding:.75rem 1rem}

  /* === PROD === */
  .prod-grid{grid-template-columns:1fr}

  /* === LAV CARDS === */
  .lav-grid{grid-template-columns:1fr}

  /* === WORKS === */
  .works-grid{grid-template-columns:1fr}
  .work-featured{grid-column:1;aspect-ratio:16/9}
  .work-card{aspect-ratio:4/3}
  .work-overlay{opacity:1;transform:translateY(0)}

  /* === SERVICES === */
  .services-grid{grid-template-columns:1fr}
  .service-item{flex-direction:row}

  /* === FOOTER === */
  .footer-grid{grid-template-columns:1fr}
  .footer-top{padding:2.5rem 0}
  .footer-logo{height:44px}

  /* === CONTACT / FORM === */
  .form-row{grid-template-columns:1fr}
  .map-wrap{height:280px}
  .contact-grid{grid-template-columns:1fr}
  .info-card{padding:1rem}
}

@media(max-width:640px){
  /* Container padding tighter on very small screens */
  .container{padding:0 1rem}
  .container-lav{padding:0 .85rem}

  /* === PAGE HEADER === */
  .page-header{padding:calc(var(--nav-h) + 2rem) 0 2rem}
  .page-header h1{font-size:clamp(1.8rem,7vw,2.5rem)}
  .page-header p{font-size:.9rem}
  .page-breadcrumb{font-size:.72rem;gap:.35rem}

  /* === HERO === */
  .hero-content h1{font-size:clamp(2rem,8vw,3rem)}
  .hero-content p{font-size:.92rem}
  .hero-stats{padding:.85rem 1rem;gap:.65rem}

  /* === ABOUT === */
  .about-image img{height:220px}
  .about-lead{font-size:.95rem}
  .about-numbers{justify-content:space-around}

  /* === REVIEWS === */
  .review-card{width:280px;flex:0 0 280px}
  .home-rating-box{padding:1rem}
  .home-rating-score-num{font-size:2rem}

  /* === SECTION HEADERS === */
  .section-header{margin-bottom:2.25rem}
  .section-header h2{font-size:clamp(1.5rem,5vw,2rem)}
  .section-sub{font-size:.9rem}

  /* === BUTTONS === */
  .btn{padding:.75rem 1.4rem;font-size:.88rem}

  /* === LAVORAZIONI PAGE specifics === */
  .lav-card-detail{padding:1.5rem 1rem}
  .branches-list{padding-left:.85rem}
  .branch-item{gap:.65rem;padding:.75rem .9rem}

  /* === PROD CARDS === */
  .prod-card{padding:1.5rem}
  .lav-card{padding:1.5rem}

  /* === FOOTER === */
  .footer-grid{gap:2rem}
  .footer-social{gap:.5rem}
  .footer-bottom{padding:1rem 0}

  /* === BACK-TOP === */
  .back-top{bottom:1.25rem;right:1.25rem;width:38px;height:38px}
}

@media(max-width:480px){
  /* === HERO === */
  .hero-content h1{font-size:clamp(1.7rem,9vw,2.4rem)}
  .hero-stats{flex-direction:column;gap:.5rem;align-items:flex-start;padding:.85rem 1.1rem}
  .stat{flex-direction:row;gap:.6rem;align-items:baseline}
  .stat-num{font-size:1.4rem}

  /* === ABOUT === */
  .about-image img{height:180px}

  /* === REVIEW CARDS === */
  .review-card{width:calc(100vw - 2.5rem);flex:0 0 calc(100vw - 2.5rem)}

  /* === WORKS === */
  .work-card{aspect-ratio:unset;height:200px}
  .work-featured{height:220px;aspect-ratio:unset}

  /* === SECTION HEADERS === */
  .section-header h2{font-size:clamp(1.4rem,8vw,1.8rem)}

  /* === BUTTONS FULL WIDTH in HERO === */
  .hero-actions .btn{max-width:100%}

  /* === FOOTER LEGAL === */
  .footer-legal-links{gap:.5rem}
  .footer-legal-links a{font-size:.7rem}

  /* === PROD CARDS === */
  .prod-card{padding:1.25rem}
  .prod-showcase{height:220px}

  /* === COOKIE BANNER === */
  #cookie-banner{padding:1rem}
  .cookie-banner-btns{width:100%;flex-wrap:wrap}
  .cookie-btn{flex:1;min-width:120px;text-align:center}
}


/* =============================================
   FOOTER BOTTOM – LEGAL
   ============================================= */
.footer-bottom{
  background:var(--bg-dark);
  border-top:1px solid rgba(255,255,255,.07);
  padding:1.5rem 0;
  text-align:center;
  color:rgba(255,255,255,.45);
  font-size:.78rem;
}
.footer-bottom-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55rem;
}
.footer-bottom .footer-copy{
  color:rgba(255,255,255,.65);
  font-size:.82rem;
  font-weight:500;
}
.footer-company-data{
  font-size:.74rem;
  color:rgba(255,255,255,.38);
  line-height:1.6;
}
.footer-legal-links{
  display:flex;
  gap:1.25rem;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:.15rem;
}
.footer-legal-links a{
  color:rgba(255,255,255,.45);
  font-size:.76rem;
  text-decoration:underline;
  text-underline-offset:3px;
  transition:color var(--t) var(--ease);
}
.footer-legal-links a:hover{color:var(--accent)}
.footer-byleo{
  font-size:.76rem;
  color:rgba(255,255,255,.32);
  margin-top:.1rem;
}
.footer-byleo .heart{color:#e74c3c}
@media(max-width:768px){
  .footer-company-data{font-size:.7rem}
  .footer-legal-links{gap:.75rem}
}

/* =============================================
   COOKIE BANNER – GDPR
   ============================================= */
#cookie-banner{
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:99999;
  background:var(--primary);
  border-top:3px solid var(--accent);
  box-shadow:0 -4px 32px rgba(0,0,0,.3);
  padding:1.25rem 1.5rem;
  display:flex;
  align-items:center;
  gap:1.5rem;
  flex-wrap:wrap;
  transition:transform .4s var(--ease);
}
#cookie-banner.hidden{transform:translateY(110%)}
.cookie-banner-text{
  flex:1;
  min-width:260px;
  color:rgba(255,255,255,.85);
  font-size:.85rem;
  line-height:1.6;
}
.cookie-banner-text strong{color:#fff;font-size:.9rem}
.cookie-banner-text a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.cookie-banner-text a:hover{color:#fff}
.cookie-banner-btns{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  align-items:center;
}
.cookie-btn{
  padding:.5rem 1.1rem;
  border-radius:6px;
  font-size:.82rem;
  font-weight:600;
  cursor:pointer;
  transition:all .2s;
  border:none;
  font-family:var(--font);
}
.cookie-btn-accept{
  background:var(--accent);
  color:var(--primary);
}
.cookie-btn-accept:hover{background:var(--accent-hover)}
.cookie-btn-necessary{
  background:rgba(255,255,255,.1);
  color:#fff;
  border:1px solid rgba(255,255,255,.2);
}
.cookie-btn-necessary:hover{background:rgba(255,255,255,.18)}
.cookie-btn-prefs{
  background:transparent;
  color:rgba(255,255,255,.6);
  border:1px solid rgba(255,255,255,.15);
  font-size:.78rem;
}
.cookie-btn-prefs:hover{color:#fff;border-color:rgba(255,255,255,.4)}

/* Cookie Preferences Modal */
#cookie-modal{
  position:fixed;
  inset:0;
  z-index:100000;
  background:rgba(0,0,0,.65);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1rem;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s;
}
#cookie-modal.open{opacity:1;pointer-events:auto}
.cookie-modal-box{
  background:#fff;
  border-radius:var(--radius-lg);
  max-width:520px;
  width:100%;
  max-height:90vh;
  overflow-y:auto;
  box-shadow:var(--shadow-lg);
}
.cookie-modal-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:1.25rem 1.5rem;
  border-bottom:1px solid var(--border);
}
.cookie-modal-header h3{
  font-family:var(--heading);
  font-size:1.2rem;
  color:var(--primary);
  font-weight:700;
}
.cookie-modal-close{
  background:none;border:none;cursor:pointer;
  font-size:1.4rem;color:var(--text-muted);
  line-height:1;padding:.2rem;
}
.cookie-modal-close:hover{color:var(--primary)}
.cookie-modal-body{padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:1rem}
.cookie-category{
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:1rem;
}
.cookie-cat-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:.4rem;
}
.cookie-cat-title{font-weight:600;font-size:.9rem;color:var(--primary)}
.cookie-cat-desc{font-size:.8rem;color:var(--text-muted);line-height:1.5}
/* Toggle switch */
.cookie-toggle{position:relative;width:44px;height:24px;flex-shrink:0}
.cookie-toggle input{opacity:0;width:0;height:0;position:absolute}
.cookie-toggle-slider{
  position:absolute;inset:0;
  background:#ccc;border-radius:24px;
  cursor:pointer;transition:.25s;
}
.cookie-toggle-slider::before{
  content:'';position:absolute;
  width:18px;height:18px;
  left:3px;bottom:3px;
  background:#fff;border-radius:50%;
  transition:.25s;
}
.cookie-toggle input:checked + .cookie-toggle-slider{background:var(--accent)}
.cookie-toggle input:checked + .cookie-toggle-slider::before{transform:translateX(20px)}
.cookie-toggle input:disabled + .cookie-toggle-slider{opacity:.5;cursor:not-allowed}
.cookie-modal-footer{
  padding:1rem 1.5rem;
  border-top:1px solid var(--border);
  display:flex;gap:.75rem;justify-content:flex-end;flex-wrap:wrap;
}
@media(max-width:600px){
  #cookie-banner{flex-direction:column;align-items:flex-start;gap:1rem}
  .cookie-banner-btns{width:100%}
  .cookie-btn{flex:1;text-align:center}
}
