/* ============================================================
   HOME — layout 1:1 dal Figma (palette #2D2D43 / #FBB90F)
   ============================================================ */

/* ---------------- 1. Hero: banner social + slider ---------------- */
.hero-fig{padding:1rem 0 0}
.hero-fig-grid{display:grid;grid-template-columns:330px 1fr;gap:10px;align-items:stretch}
.hero-social{display:block;border-radius:10px;overflow:hidden;box-shadow:var(--shadow-sm)}
.hero-social img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
a.hero-social:hover img{transform:scale(1.03)}
.hero-slider{position:relative;border-radius:10px;overflow:hidden;box-shadow:var(--shadow-sm);aspect-ratio:1057/589}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;pointer-events:none;background:var(--navy-900)}
.hero-slide.is-active{opacity:1;pointer-events:auto}
.hero-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.hero-slide-link{position:absolute;inset:0;z-index:2}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.85);color:var(--navy-900);display:grid;place-items:center;cursor:pointer;transition:.15s;box-shadow:var(--shadow-sm)}
.hero-arrow:hover{background:var(--yellow-500)}
.hero-arrow-prev{left:14px}
.hero-arrow-next{right:14px}
.hero-dots{position:absolute;bottom:14px;right:18px;display:flex;gap:.45rem;z-index:5}
.hero-dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.55);cursor:pointer;padding:0;transition:.2s}
.hero-dots button.active{background:var(--yellow-500);transform:scale(1.25)}
@media(max-width:980px){
  .hero-fig-grid{grid-template-columns:1fr}
  .hero-social{display:none}
}

/* ---------------- Titoli sezione (Figma: 30px SemiBold) ---------------- */
.fig-h2{font-family:var(--font-display);font-weight:600;font-size:1.7rem;color:var(--navy-900);margin:0 0 .5rem}
.fig-sub{color:var(--navy-900);font-size:1rem;max-width:620px;margin:0 0 1.8rem}

/* ---------------- 2. Banda 45 anni ---------------- */
.band-45{background:var(--navy-900);margin-top:1.6rem;padding:2.6rem 0}
.band-45-grid{display:grid;grid-template-columns:1.2fr .9fr;gap:3.5rem;align-items:start}
.band-45-title{font-family:var(--font-display);font-weight:600;font-size:1.7rem;color:var(--yellow-500);margin:0 0 .8rem}
.band-45-text{color:#fff;font-size:1rem;margin:0;max-width:640px}
.band-45-claim{font-family:var(--font-display);font-weight:500;font-size:1.7rem;line-height:1.3;color:var(--yellow-500);margin:0}
@media(max-width:860px){.band-45-grid{grid-template-columns:1fr;gap:1.5rem}}

/* ---------------- 3. I servizi: 4 card gialle con foro ---------------- */
.servizi-fig{padding:3rem 0 3.6rem}
.serv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.8rem}
.serv-card{position:relative;display:flex;flex-direction:column;background:var(--yellow-500);border-radius:12px;aspect-ratio:294/331;padding:1.4rem 1.5rem;transition:transform .2s,box-shadow .2s;overflow:visible}
.serv-card::after{content:"";position:absolute;top:18px;right:18px;width:30px;height:30px;border-radius:50%;background:#fff}
.serv-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(251,185,15,.45)}
.serv-title{font-family:var(--font-display);font-weight:700;font-size:1.65rem;color:var(--navy-900);line-height:1.1}
.serv-icon{margin:auto auto .6rem;width:58%;aspect-ratio:1;height:auto;background:transparent;--icon-line:var(--navy-900);--icon-fill:rgba(45,45,67,.12);--icon-accent:var(--navy-850)}
.serv-icon svg{width:100%;height:100%}
@media(max-width:980px){.serv-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.serv-grid{grid-template-columns:1fr;max-width:330px;margin-inline:auto}}

/* ---------------- 4. Banner preventivo ---------------- */
.home-preventivo{position:relative;padding:4.2rem 0;overflow:hidden}
.preventivo-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.preventivo-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(35,35,47,.72) 0%,rgba(35,35,47,.35) 70%)}
.preventivo-in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}
.preventivo-title{font-family:var(--font-display);font-weight:600;font-size:clamp(2.2rem,4.5vw,3.4rem);color:var(--yellow-500);margin:0;line-height:1.05}
.preventivo-sub{font-family:var(--font-display);font-weight:600;font-size:1.55rem;line-height:1.25;color:#fff;margin:.5rem 0 1.1rem}
.preventivo-in .btn{font-size:1.05rem;padding:.6rem 1.6rem;text-transform:none;font-weight:700}

/* ---------------- 5. I nostri brand ---------------- */
.brands-fig{padding:2.8rem 0 0}
.brands-band{background:#fff;padding:2.4rem 0;margin-top:.6rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brands-marquee{overflow:hidden;position:relative}
.marquee-track{display:flex;width:max-content;animation:marquee 48s linear infinite}
.brands-marquee:hover .marquee-track{animation-play-state:paused}
.marquee-group{display:flex;align-items:center;gap:3.6rem;padding-right:3.6rem}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.brand-logo{display:grid;place-items:center;height:64px;min-width:130px}
.brand-logo img{max-height:52px;max-width:155px;object-fit:contain;transition:transform .2s}
.brand-logo:hover img{transform:scale(1.07)}
.brand-logo-text{font-family:var(--font-display);font-weight:800;font-size:1.15rem;color:#8a8a96;white-space:nowrap;transition:.2s}
.brand-logo:hover .brand-logo-text{color:var(--navy-900)}

/* ---------------- 6. Partner AS Cittadella ---------------- */
.citta-fig{padding:2.8rem 0 0}
.citta-band{background:var(--navy-900);padding:.6rem 0;margin-top:1rem}
.citta-row{display:grid;grid-template-columns:repeat(5,1fr);gap:.9rem;align-items:center;padding-top:.4rem;padding-bottom:.4rem}
.citta-row img{width:100%;aspect-ratio:253/337;object-fit:cover;border-radius:8px}
.citta-crest-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;aspect-ratio:253/337;color:#fff}
.citta-crest-card img{width:62%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:0}
.citta-crest-card span{font-family:var(--font-display);font-weight:600;font-size:1.05rem}
@media(max-width:860px){
  .citta-row{grid-template-columns:repeat(2,1fr)}
  .citta-crest-card{grid-column:span 2;max-width:280px;margin-inline:auto;width:100%}
}

/* util */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}