/* AFS Formation — landing (si appoggia a style.css) */

/* header sopra la hero scura */
.lp-header{position:fixed;inset-inline:0;top:0}
.lp-header:not(.scrolled) .menu a,.lp-header:not(.scrolled) .lang{color:var(--on-night)}
.lp-header:not(.scrolled) .lang.active{background:#fff;color:var(--ink)}
.lp-header:not(.scrolled) .langs{border-color:var(--line-n)}
.lp-header:not(.scrolled) .brand img{content:url(ph/logo-w-200.webp)}
.lp-header:not(.scrolled) .nav-cta{--bg:var(--s);--fg:var(--ink)}
.lp-header:not(.scrolled) .hamb{border-color:var(--line-n)}
.lp-header:not(.scrolled) .hamb span{background:#fff}
@media (max-width:960px){
  .lp-header{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
  .lp-header.scrolled{background:rgba(244,241,234,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .menu-open .lp-header .brand img{content:url(ph/logo-200.webp)}
  .menu-open .lp-header .hamb span{background:var(--ink)}
  .menu-open .lp-header .menu a,.menu-open .lp-header .lang{color:var(--ink)}
  .menu-open .lp-header .lang.active{background:var(--ink);color:#fff}
}

/* hero */
.lp-hero{position:relative;overflow:hidden;background:var(--night) var(--noise);color:var(--on-night);padding:calc(80px + clamp(32px,6vw,80px)) 0 0}
.lp-hero::before{content:"";position:absolute;width:min(60vw,760px);aspect-ratio:1;inset-inline-end:-12%;top:-10%;border-radius:50%;background:radial-gradient(circle,rgba(29,91,234,.35),transparent 65%);pointer-events:none}
.lp-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:center}
.h-lp{font-size:clamp(2.8rem,6.6vw,6rem);line-height:.95;letter-spacing:-.05em;color:#fff;margin:28px 0}
body[dir=rtl] .h-lp{font-size:clamp(2.4rem,5.4vw,4.8rem)}
.h-lp .hl{color:var(--s)}
.lp-hero .lead{color:var(--on-night-2);margin-bottom:36px}
.lp-hero .facts-row{margin-top:clamp(40px,6vw,80px)}

/* perché */
.why{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-2)}
.why li{padding:32px 28px 8px 0}
.why li+li{padding-inline-start:28px;border-inline-start:1px solid var(--line-2)}
.why .pr{font-size:4rem;margin:0 0 28px;display:block}
.why h3{font-size:1.4rem}
.why p{color:var(--muted);margin:0}

/* domini */
.doms{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.dom{display:flex;flex-direction:column;border-top:1px solid var(--line-n);padding-top:20px}
.dom-img{margin:0 0 22px;aspect-ratio:4/5;overflow:hidden;border-radius:var(--r)}
.dom-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.dom:hover .dom-img img{transform:scale(1.04)}
.dom-k{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--on-night-2);font-size:.88rem}
.dom-k .pr{font-size:1.9rem;margin:0}
.dom h3{font-size:1.4rem;margin-bottom:14px}
.dom ul{list-style:none;margin:0;padding:0}
.dom li a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-n);color:var(--on-night);text-decoration:none;font-size:.95rem;transition:color .25s,padding .4s var(--ease)}
.dom li a svg{width:16px;height:16px;opacity:0;transition:opacity .25s;color:var(--s);flex:none}
.dom li a:hover{color:#fff;padding-inline-start:6px}
.dom li a:hover svg{opacity:1}

/* CTA fissa su mobile */
.sticky-cta{position:fixed;inset-inline:12px;bottom:12px;z-index:70;display:none;gap:10px;padding:10px;background:rgba(244,241,234,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--r-lg);box-shadow:0 14px 40px rgba(11,21,51,.25);transform:translateY(140%);transition:transform .5s var(--ease)}
.sticky-cta.show{transform:none}
.sticky-cta .btn{flex:1}
.sticky-cta .btn-wa{flex:0 0 56px;padding:0}

@media (max-width:1100px){.why,.doms{grid-template-columns:1fr 1fr}.why li:nth-child(3){padding-inline-start:0;border:0}.why li:nth-child(n+3){border-top:1px solid var(--line-2)}}
@media (max-width:960px){.lp-grid{grid-template-columns:1fr}}
@media (max-width:640px){
  .sticky-cta{display:flex}
  .lp .float-wa{display:none}
  .why,.doms{grid-template-columns:1fr}
  .why li,.why li+li{padding:26px 0;border-inline-start:0;border-top:1px solid var(--line-2)}
  .why li:first-child{border-top:0}
  .why .pr{font-size:3rem;margin-bottom:16px}
  .dom-img{aspect-ratio:16/10}
  .lp .final{padding-bottom:120px}
  .lp .foot{padding-bottom:110px}
}
.lp-grid .hero-3d{grid-area:auto;align-self:center}
