/* SempliceBooking - landing (vetrina) */
:root{
  --blu:#1d3a5f; --blu2:#2b5a8c; --accento:#1f8a70; --chiaro:#f4f7fa; --bordo:#dfe6ee;
  --testo:#1c2633; --tenue:#5b6878; --r:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--testo);background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--blu2)}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}

/* barra */
.barra{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--bordo)}
.barra .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.logo{font-weight:800;font-size:1.25rem;color:var(--blu);text-decoration:none;letter-spacing:-.3px}
.logo span{color:var(--accento)}
.menu{display:flex;gap:22px;align-items:center}
.menu a{color:var(--testo);text-decoration:none;font-size:.95rem}
.menu a:hover{color:var(--blu2)}
.lingua{border:1px solid var(--bordo);border-radius:999px;padding:4px 12px;font-size:.85rem!important;font-weight:600}
@media (max-width:760px){.menu a:not(.lingua){display:none}}

/* hero */
.hero{background:linear-gradient(180deg,var(--chiaro),#fff);padding:64px 0 40px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center}
.badge{display:inline-block;background:#e3f3ee;color:var(--accento);font-weight:700;font-size:.82rem;letter-spacing:.4px;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:16px}
.hero h1{font-size:clamp(2rem,4.4vw,3.1rem);line-height:1.12;margin:0 0 16px;letter-spacing:-.8px;color:var(--blu)}
.hero p.sotto{font-size:1.15rem;color:var(--tenue);margin:0 0 26px;max-width:520px}
.punti{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.punti li{padding-left:28px;position:relative}
.punti li::before{content:"";position:absolute;left:0;top:.45em;width:16px;height:16px;border-radius:50%;background:var(--accento);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3C/svg%3E");}
.punti li::after{content:"";position:absolute;left:5px;top:calc(.45em + 4px);width:4px;height:7px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.vetrina{position:relative;padding-bottom:30px}
.schermo{border-radius:12px;overflow:hidden;box-shadow:0 20px 50px rgba(29,58,95,.18);border:1px solid var(--bordo);background:#fff}
.schermo .tasti{height:26px;background:#eef1f5;display:flex;gap:6px;align-items:center;padding:0 10px}
.schermo .tasti i{width:9px;height:9px;border-radius:50%;background:#cfd6df}
.telefono{position:absolute;right:-6px;bottom:0;width:31%;border:7px solid #1c2633;border-radius:26px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.25);background:#fff}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.telefono{width:34%}}

/* sezioni */
section{padding:72px 0}
section.alt{background:var(--chiaro)}
.titolo{text-align:center;max-width:680px;margin:0 auto 40px}
.titolo h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 10px;color:var(--blu);letter-spacing:-.4px}
.titolo p{margin:0;color:var(--tenue);font-size:1.05rem}

.griglia{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.card{background:#fff;border:1px solid var(--bordo);border-radius:var(--r);padding:22px}
section.alt .card{border-color:transparent;box-shadow:0 2px 10px rgba(29,58,95,.06)}
.card .ico{width:42px;height:42px;border-radius:10px;background:#e8eff7;color:var(--blu2);display:grid;place-items:center;margin-bottom:12px}
.card .ico svg{width:22px;height:22px}
.card h3{margin:0 0 6px;font-size:1.05rem;color:var(--blu)}
.card p{margin:0;font-size:.96rem;color:var(--tenue)}

/* schermate */
.galleria{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:20px;align-items:start}
.galleria figure{margin:0}
.galleria figcaption{font-size:.9rem;color:var(--tenue);margin-top:10px;text-align:center}
.galleria .tel{border:6px solid #1c2633;border-radius:22px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.galleria .tab{border:8px solid #1c2633;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.colonna{display:grid;gap:20px}
@media (max-width:900px){.galleria{grid-template-columns:1fr 1fr}.galleria .largo{grid-column:1/-1}}

/* caso reale */
.caso{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.caso h3{font-size:1.5rem;margin:0 0 8px;color:var(--blu)}
.caso .luogo{color:var(--accento);font-weight:600;margin:0 0 14px}
.caso p{color:var(--tenue)}
.bottone{display:inline-block;margin-top:10px;background:var(--blu);color:#fff;text-decoration:none;padding:11px 20px;border-radius:10px;font-weight:600}
.bottone:hover{background:var(--blu2)}
@media (max-width:820px){.caso{grid-template-columns:1fr}}

/* requisiti */
.req{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.req ul{margin:0;padding-left:20px;color:var(--tenue)}
.req li{margin-bottom:6px}
.req li b{color:var(--testo)}
@media (max-width:820px){.req{grid-template-columns:1fr}}

/* arrivo */
.arrivo{text-align:center;background:var(--blu);color:#fff;padding:60px 0}
.arrivo h2{margin:0 0 8px;font-size:clamp(1.5rem,3vw,2rem)}
.arrivo p{margin:0;opacity:.85}
footer{text-align:center;font-size:.85rem;color:var(--tenue);padding:26px 20px}

.galleria.due{margin-top:20px;grid-template-columns:1fr 1.6fr}
@media (max-width:640px){.galleria,.galleria.due{grid-template-columns:1fr}.galleria .tel,.galleria .tab{max-width:300px;margin:0 auto}}
