/* Blocchi ripresi dalla bozza index1 ("Cosa facciamo" e "Facciamoci notare"), stili da layout1.css/common.css/motion.css con prefisso l1- */
.l1-services,.l1-contact{--muted:#aaa9a6;padding:110px 7.2%}
.l1-services{background:var(--dark)}
.l1-eyebrow{margin:0;font-size:12px;letter-spacing:2.1px;font-weight:600}
.l1-services h2{margin:0;font-size:clamp(42px,5.5vw,82px);letter-spacing:-3.5px;line-height:1.02;font-weight:700}
.l1-section-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;margin-bottom:65px}
.l1-section-top h2{width:56%}
.l1-service-list{border-top:1px solid var(--line)}
.l1-service-list details{border-bottom:1px solid var(--line)}
.l1-service-list summary{list-style:none;display:flex;align-items:center;gap:30px;padding:30px 0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.l1-service-list summary::-webkit-details-marker{display:none}
.l1-service-list summary:focus-visible{outline:2px solid var(--green);outline-offset:6px}
.l1-service-list summary h3{margin:0;font-size:clamp(20px,2.4vw,35px);font-weight:400;letter-spacing:-.8px}
.l1-service-list summary>span{margin-left:auto;color:var(--green);font-size:30px;font-weight:300}
.l1-service-list details[open] summary>span{transform:rotate(45deg)}
.l1-service-list details>p{margin-top:0;padding:0 0 24px;max-width:700px;line-height:1.7;color:var(--muted);font-size:16px}
.l1-service-list details[open]>p{animation:l1-open .4s ease both}

.l1-contact{background:var(--green);color:var(--dark)}
.l1-contact .l1-eyebrow{margin-bottom:45px}
.l1-contact-title{display:block;position:relative;font-size:clamp(70px,10.4vw,158px);font-weight:700;letter-spacing:-7px;line-height:.95}
.l1-contact-title em{color:transparent;-webkit-text-stroke:1.5px var(--dark)}
.l1-contact-title>span{position:absolute;right:0;top:0;font-family:Arial,Helvetica,sans-serif;font-variant-emoji:text;font-size:clamp(80px,13vw,200px);font-weight:300;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.l1-contact-title:is(:hover,:focus-visible)>span{transform:translate(8px,-8px)}
.l1-contact-bottom{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #19181844;margin-top:60px;padding-top:24px;font-size:16px}
.l1-contact-bottom p{margin:0}
.l1-contact-bottom a{border-bottom:1px solid var(--dark)}
.l1-contact a:focus-visible{outline-color:var(--dark)}

/* Entrata allo scroll, come in index1 */
.l1-entrance{opacity:0;translate:0 38px;transition:opacity .8s ease var(--entrance-delay,0ms),translate 1s cubic-bezier(.16,1,.3,1) var(--entrance-delay,0ms)}
.l1-entrance.entered{opacity:1;translate:0 0}
@keyframes l1-open{from{opacity:0;transform:translateX(-20px) scale(1.025)}to{opacity:1;transform:translateX(0) scale(1)}}

@media(max-width:1000px){.l1-contact-title{letter-spacing:-4px}}
@media(max-width:650px){
  .l1-services,.l1-contact{padding:70px 6%}
  .l1-services h2{letter-spacing:-2px}
  .l1-eyebrow{letter-spacing:1.5px}
  .l1-section-top{display:block;margin-bottom:35px}
  .l1-section-top h2{width:100%;margin-top:30px}
  .l1-service-list summary{gap:17px;padding:25px 0}
  .l1-service-list summary h3{font-size:21px}
  .l1-contact-title{font-size:clamp(56px,12vw,80px);letter-spacing:-3px}
  .l1-contact-title>span{font-size:67px}
  .l1-contact-bottom{display:block;margin-top:40px;font-size:14px}
  .l1-contact-bottom p{margin-bottom:20px}
  .l1-entrance{translate:-18px 0;scale:1.025}
  .l1-entrance.entered{translate:0 0;scale:1}
}
@media(prefers-reduced-motion:reduce){
  .l1-entrance{opacity:1;translate:none;scale:none}
  .l1-service-list details[open]>p{animation:none}
  .l1-contact-title:is(:hover,:focus-visible)>span{transform:none}
}