/* ============================================================
   Pagina Servizio (template-servizio.php)
   ============================================================ */

.serv-hero{ position:relative; min-height:60vh; display:flex; align-items:flex-end; background-size:cover; background-position:center; color:#fff; padding:9rem 0 3.5rem; }
.serv-hero .wrap{ position:relative; z-index:2; }
.serv-crumb{ font-size:.8rem; letter-spacing:.04em; color:rgba(255,255,255,.75); margin-bottom:1.2rem; }
.serv-crumb a{ color:rgba(255,255,255,.75); }
.serv-crumb a:hover{ color:#fff; }
.serv-crumb span{ margin:0 .5rem; opacity:.5; }
.serv-hero h1{ color:#fff; max-width:18ch; }
.serv-hero__lead{ font-size:1.2rem; color:rgba(255,255,255,.88); max-width:60ch; margin-top:1rem; }

/* Intro testo + immagine */
.serv-intro{ background:#fff; }
.serv-intro__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,6vw,4.5rem); align-items:center; }
.serv-intro__text p{ color:var(--muted); }
.serv-intro__text .btn{ margin-top:.8rem; }
.serv-intro__img{ position:relative; }
.serv-intro__img::before{ content:""; position:absolute; inset:16px -16px -16px 16px; border-radius:var(--radius); background:var(--tint); z-index:0; }
.serv-intro__img img{ position:relative; z-index:1; width:100%; border-radius:var(--radius); box-shadow:var(--shadow); }

/* Cosa consegniamo */
.serv-deliver{ background:var(--tint); }
.deliver-grid{ list-style:none; margin:3rem 0 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.deliver-item{ display:flex; align-items:center; gap:.9rem; background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.15rem 1.3rem; font-weight:500; color:var(--ink); transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.deliver-item:hover{ transform:translateY(-4px); box-shadow:var(--shadow-sm); }
.deliver-item svg{ width:22px; height:22px; color:var(--blue); flex:0 0 auto; }

/* Gallery */
.serv-gallery{ background:#fff; }
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:3rem; }
.gallery-item{ margin:0; aspect-ratio:1/1; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.gallery-item:hover img{ transform:scale(1.08); }

@media (max-width:980px){
  .serv-intro__grid{ grid-template-columns:1fr; }
  .deliver-grid{ grid-template-columns:repeat(2,1fr); }
  .gallery-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:680px){
  .deliver-grid{ grid-template-columns:1fr; }
  .serv-hero{ min-height:52vh; padding-top:7.5rem; }
}