:root{
  --navy:#0B2D5B; --tech:#007BFF; --soft:#111827; --gray:#6B7280;
  --ice:#F4F8FC; --line:#DCE7F2; --white:#fff; --dark:#06172A;
  --shadow:0 24px 70px rgba(3,24,48,.16);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Montserrat,Poppins,Arial,sans-serif;color:var(--soft);background:#fff}
button,a{font:inherit}
a{text-decoration:none;color:inherit}
.topbar{position:fixed;z-index:50;top:20px;left:50%;transform:translateX(-50%);width:min(1240px,calc(100% - 40px));
  display:flex;align-items:center;gap:24px;padding:10px 14px 10px 18px;background:rgba(4,20,36,.86);
  border:1px solid rgba(255,255,255,.16);border-radius:18px;backdrop-filter:blur(18px);box-shadow:0 16px 40px rgba(0,0,0,.22)}
.topbar .brand{display:flex;align-items:center;min-width:72px}
.topbar .brand img{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,123,255,.28))}
.nav{display:flex;gap:22px;align-items:center;justify-content:center;flex:1;color:#eaf3ff;font-size:13px;font-weight:600}
.nav a{opacity:.88}.nav a:hover{opacity:1;color:#55aaff}
.actions{display:flex;align-items:center;gap:12px;color:#fff;font-size:12px;font-weight:700}
.lang{display:flex;gap:8px;align-items:center}.lang button{background:none;border:0;color:#b7c6d6;cursor:pointer;padding:4px}.lang button.active{color:#fff}
.btn{border:0;border-radius:10px;padding:13px 18px;cursor:pointer;font-weight:800;font-size:12px;letter-spacing:.2px}
.btn-primary{background:var(--tech);color:#fff;box-shadow:0 10px 24px rgba(0,123,255,.3)}
.btn-outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35)}
.btn-dark{background:var(--navy);color:#fff}
.hero{min-height:900px;position:relative;overflow:hidden;background:#04182c;color:#fff;display:flex;align-items:center}
.hero:before{content:"";position:absolute;inset:0;background:
 linear-gradient(90deg,rgba(2,15,31,.76) 0%,rgba(3,19,35,.48) 46%,rgba(3,19,35,.16) 100%),
 url("assets/site-v32/sam360-hero-bg.png") center/cover no-repeat;filter:saturate(1.04) contrast(1.04)}
.hero:after{content:"";position:absolute;inset:0;opacity:.12;background-image:linear-gradient(rgba(69,161,255,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(69,161,255,.55) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000 0 62%,transparent 92%)}
.blueprint{position:absolute;right:-40px;bottom:-30px;width:720px;height:520px;opacity:.23;pointer-events:none;background:
linear-gradient(150deg,transparent 49%,#2d9bff 50%,transparent 51%),
linear-gradient(30deg,transparent 49%,#2d9bff 50%,transparent 51%);background-size:130px 130px;transform:skewY(-8deg)}
.hero-inner{position:relative;z-index:2;width:min(1240px,calc(100% - 40px));margin:0 auto;padding-top:130px;display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}
.hero-copy{max-width:660px}
.kicker{display:flex;align-items:center;gap:12px;color:#70baff;font-size:12px;font-weight:800;letter-spacing:3px;text-transform:uppercase}
.kicker:before{content:"";width:42px;height:2px;background:#1591ff}
.hero-logo-wrap{display:inline-flex;align-items:center;justify-content:center;margin:20px 0 24px;padding:14px 20px;border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(235,244,252,.76));box-shadow:0 20px 55px rgba(0,0,0,.28);backdrop-filter:blur(10px)}
.hero-logo{width:min(520px,92%);height:auto;display:block;filter:drop-shadow(0 10px 20px rgba(0,0,0,.16))}
.hero h1{font-size:clamp(48px,6vw,86px);line-height:.95;margin:0 0 22px;letter-spacing:-3.8px;font-weight:900;text-transform:uppercase}
.hero h1 span{color:#1388ff}
.hero p{font-size:18px;line-height:1.65;color:#d9e8f7;max-width:650px;margin:0 0 28px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.proof{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px;color:#b7cde2;font-size:12px;font-weight:700}
.proof span:before{content:"✓";color:#31a3ff;margin-right:7px}
.hero-product{position:relative}
.hero-product .glow{position:absolute;inset:8% 0 8% 5%;background:radial-gradient(circle,rgba(0,123,255,.38),transparent 62%);filter:blur(16px)}
.device{position:relative;margin-left:auto;width:min(610px,100%);border-radius:26px;border:1px solid rgba(150,206,255,.36);background:linear-gradient(145deg,#0b2946,#06192d);padding:12px;box-shadow:0 40px 90px rgba(0,0,0,.48);transform:rotate(1deg)}
.device-top{height:28px;display:flex;align-items:center;justify-content:space-between;color:#7e9bb5;font-size:9px;padding:0 8px}
.dashboard{display:grid;grid-template-columns:145px 1fr;min-height:390px;background:#f7fbff;border-radius:16px;overflow:hidden}
.side{background:#08223b;color:#bcd1e3;padding:14px 10px}
.side .mini-brand{width:90px;height:36px;object-fit:contain;margin:0 auto 12px;display:block}
.side a{display:block;padding:9px 8px;border-radius:8px;font-size:10px;margin:2px 0}.side a.active{background:#087fea;color:#fff}
.dash{padding:16px;background:#f6f9fc;color:#122b45}.dash-head{display:flex;justify-content:space-between;align-items:center}.dash h3{margin:0;font-size:17px}.live{font-size:9px;color:#14915b}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}.kpi{background:#fff;border:1px solid #dce8f3;border-radius:10px;padding:10px}.kpi small{font-size:8px;color:#789}.kpi strong{display:block;font-size:19px;margin-top:4px}
.charts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.chart{background:#fff;border:1px solid #dce8f3;border-radius:10px;padding:12px;height:130px}.donut{width:66px;height:66px;border-radius:50%;border:13px solid #dce9f5;border-top-color:#087fea;border-right-color:#087fea;margin:10px auto}.bars{display:flex;align-items:end;gap:8px;height:82px}.bars i{display:block;width:12px;background:#1d92f4;border-radius:3px 3px 0 0}.rows{margin-top:10px;background:#fff;border:1px solid #dce8f3;border-radius:10px;padding:8px}.row{display:grid;grid-template-columns:1fr 60px 55px;gap:8px;padding:8px 4px;border-bottom:1px solid #eef3f7;font-size:8px}.row:last-child{border-bottom:0}.pill{background:#dff7e9;color:#15814b;border-radius:30px;padding:3px 6px;text-align:center}
.section{padding:100px 0}.container{width:min(1240px,calc(100% - 40px));margin:auto}
.section-tag{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:#147ff0;font-weight:800}.section h2{font-size:clamp(34px,4.3vw,58px);line-height:1.02;margin:12px 0 18px;color:var(--navy);letter-spacing:-2px}.section-intro{color:#63758a;max-width:720px;line-height:1.7}
.value{background:#04182c;color:#fff;position:relative;overflow:hidden}.value:after{content:"";position:absolute;right:-130px;bottom:-120px;width:620px;height:520px;border:1px solid rgba(0,123,255,.25);transform:rotate(-18deg);box-shadow:0 0 0 40px rgba(0,123,255,.04),0 0 0 80px rgba(0,123,255,.025)}
.value h2{color:#fff}.value .section-intro{color:#b9cbdd}
.value-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}.benefits{display:grid;gap:18px}.benefit{display:grid;grid-template-columns:52px 1fr;gap:15px;align-items:start}.benefit .icon{width:46px;height:46px;border:1px solid rgba(255,255,255,.22);border-radius:12px;display:grid;place-items:center;color:#49a8ff;font-size:20px}.benefit strong{display:block;font-size:17px}.benefit span{display:block;color:#9fb6ca;font-size:13px;margin-top:4px}
.modules{background:#f4f8fc}.module-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:36px}.module{background:#fff;border:1px solid #dce7f2;border-radius:16px;padding:22px;min-height:150px;transition:.2s}.module:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#b8d7f7}.module b{color:var(--navy);font-size:16px}.module p{color:#6c7f91;font-size:12px;line-height:1.6}.module .mi{color:#0785fa;font-size:20px;margin-bottom:14px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center}.phone-wrap{display:flex;justify-content:center;gap:25px;align-items:end}.phone{width:230px;border-radius:36px;background:#071b30;border:8px solid #0b1220;padding:9px;box-shadow:0 30px 60px rgba(4,28,54,.25)}.phone-screen{background:linear-gradient(#0a2947,#07182a);border-radius:25px;overflow:hidden;padding:12px;min-height:430px;color:#fff}.phone-logo{width:86px;height:86px;object-fit:contain;display:block;margin:10px auto 2px}.app-brand-name{font-weight:900;font-size:18px;text-align:center;letter-spacing:-.5px}.app-brand-sub{font-size:7px;letter-spacing:1.3px;text-align:center;color:#8fb5d8;margin-top:2px}.phone-screen .pbtn{display:block;background:#0b87f5;border-radius:30px;text-align:center;padding:11px;margin-top:16px;font-size:11px}.nfc{width:300px;background:#0a2340;color:#fff;border-radius:22px;padding:25px;box-shadow:var(--shadow);border:1px solid #1b4b75}.nfc .reader{height:155px;border-radius:14px;background:linear-gradient(145deg,#0c3154,#061a2d);display:grid;place-items:center;font-size:56px;color:#28a0ff}.nfc h3{margin:18px 0 8px}.nfc p{font-size:12px;color:#aac1d4;line-height:1.6}
.showcase{background:#f6f9fc}.showcase-card{background:#071a2c;border-radius:26px;padding:16px;box-shadow:var(--shadow);border:1px solid #173a5a}.showcase-inner{background:#f5f8fb;border-radius:16px;display:grid;grid-template-columns:210px 1fr;overflow:hidden;min-height:500px}.showcase-inner .side{padding:20px 14px}.bigdash{padding:25px}.bigdash .kpis .kpi strong{font-size:24px}.bigcharts{display:grid;grid-template-columns:1fr 1fr;gap:15px}.bigchart{height:170px}.progress{height:8px;background:#dfeaf3;border-radius:20px;overflow:hidden}.progress i{display:block;height:100%;background:#087fea;border-radius:20px}
.cta{background:linear-gradient(120deg,#08264a,#0b2d5b);color:#fff;text-align:center;padding:92px 0}.cta h2{color:#fff;margin-bottom:14px}.cta p{color:#bcd0e3;max-width:680px;margin:0 auto 26px;line-height:1.7}
.footer{background:#030f1d;color:#9eb3c7;padding:40px 0}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}.footer-logo{width:245px;height:95px;object-fit:contain;object-position:left center;filter:drop-shadow(0 10px 24px rgba(0,0,0,.25))}.footer h4{color:#fff;margin:0 0 12px}.footer a{display:block;font-size:12px;margin:8px 0}.copyright{margin-top:30px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font-size:11px;display:flex;justify-content:space-between}

.mobile-menu{display:none;background:none;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:8px;padding:8px}
@media(max-width:1050px){.nav{gap:12px}.hero-inner{grid-template-columns:1fr}.hero-product{max-width:760px}.module-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.app-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.topbar{top:8px;width:calc(100% - 16px)}.nav,.actions .demo{display:none}.mobile-menu{display:block}.hero{min-height:auto;padding-bottom:70px}.hero-inner{padding-top:120px}.hero h1{font-size:50px;letter-spacing:-2.5px}.hero-logo{width:280px}.dashboard{grid-template-columns:95px 1fr}.side{padding:8px 6px}.side a{font-size:8px}.kpis{grid-template-columns:1fr 1fr}.section{padding:72px 0}.value-grid,.split,.app-grid{grid-template-columns:1fr}.module-grid{grid-template-columns:1fr}.phone-wrap{flex-direction:column}.nfc{width:100%}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:8px}.app-sidebar{width:0;padding:0;overflow:hidden}.app-main{margin-left:0;width:100%}.app-section-grid{grid-template-columns:1fr}.app-content{padding:18px}}


.hero-logo-wrap{background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;padding:0!important;border-radius:0!important;margin:18px 0 24px!important}
.hero-logo{width:min(610px,92vw)!important;filter:drop-shadow(0 18px 38px rgba(0,0,0,.38));display:block}


/* V27 public site: smaller hero slogan and clearer mobile-app area */
.hero-copy h1{font-size:clamp(38px,5.1vw,72px)!important;line-height:1.02!important;max-width:760px!important}
#mobile .sam-app-coming{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:34px}
.sam-app-card{position:relative;background:rgba(5,24,41,.82);border:1px solid rgba(89,151,197,.28);border-radius:20px;padding:26px;box-shadow:0 18px 45px rgba(0,0,0,.22);overflow:hidden}
.sam-app-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,123,255,.10),transparent 55%);pointer-events:none}
.sam-app-card h3{font-size:24px;margin:0 0 8px;color:#fff}
.sam-app-card p{font-size:15px;line-height:1.65;color:#b7cadb;margin:0 0 18px}
.sam-app-badge{display:inline-flex;align-items:center;gap:9px;min-width:150px;padding:10px 14px;border-radius:11px;background:#050b12;border:1px solid rgba(255,255,255,.16);color:#fff;font-weight:700;font-size:12px;opacity:.95}
.sam-app-badge .sam-badge-icon{font-size:20px;line-height:1}
.sam-app-badges{display:flex;gap:10px;flex-wrap:wrap}
.sam-coming{position:absolute;right:18px;top:18px;border:1px solid rgba(0,190,255,.35);color:#54cfff;background:rgba(0,123,255,.10);border-radius:999px;padding:6px 10px;font-size:10px;font-weight:900;letter-spacing:.8px}
@media(max-width:800px){#mobile .sam-app-coming{grid-template-columns:1fr}.hero-copy h1{font-size:40px!important}}


/* Final requested home-page adjustments */
.hero-copy h1{
  font-size:clamp(42px,4.25vw,60px)!important;
  line-height:1.02!important;
  letter-spacing:-2.4px!important;
  max-width:690px!important;
}
@media(max-width:800px){
  .hero-copy h1{font-size:38px!important;letter-spacing:-1.7px!important;max-width:620px!important}
}

.nav.is-open{display:flex!important;position:absolute;top:calc(100% + 8px);left:0;right:0;flex-direction:column;gap:2px;padding:10px;border:1px solid rgba(120,180,225,.22);border-radius:14px;background:rgba(5,20,34,.98);box-shadow:0 18px 36px rgba(0,0,0,.28)}
.nav.is-open a{padding:12px;border-radius:8px}
.mobile-menu{cursor:pointer}

/* Home hero refresh: blueprint atmosphere, current S.A.M.360 workspace preview, tablet proportions. */
.hero{
  min-height:100svh;
  background:#04152a;
  isolation:isolate;
}
.hero:before{
  z-index:-2;
  background:
    linear-gradient(90deg,rgba(3,17,34,.98) 0%,rgba(4,21,41,.88) 18%,rgba(4,21,41,.62) 34%,rgba(4,21,41,.26) 51%,rgba(4,21,41,.06) 68%,transparent 78%),
    linear-gradient(180deg,rgba(5,21,40,.04) 0%,rgba(3,17,32,.12) 70%,rgba(3,17,32,.24) 100%),
    radial-gradient(ellipse at 77% 24%,rgba(0,151,255,.10),transparent 34%),
    radial-gradient(ellipse at 43% 105%,rgba(0,188,220,.08),transparent 37%);
  filter:saturate(1.02) contrast(1.04);
}
.hero-photo{
  position:absolute;inset:0;z-index:-3;pointer-events:none;
  background:url("assets/cantiere-miniatura-blueprint.png") right center/auto 100% no-repeat;
  transform-origin:right center;will-change:transform;
  animation:sam-hero-photo-settle 4.2s cubic-bezier(.18,.68,.25,1) both;
}
.hero:after{
  z-index:-1;
  opacity:.06;
  background-image:linear-gradient(rgba(61,169,255,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(61,169,255,.5) 1px,transparent 1px);
  background-size:58px 58px;
  mask-image:linear-gradient(90deg,#000 0%,#000 72%,transparent 100%);
}
.hero .blueprint{
  width:800px;height:660px;right:-120px;bottom:-230px;opacity:.15;
  background:radial-gradient(ellipse at center,transparent 39%,rgba(21,157,235,.8) 39.15%,transparent 39.4%,transparent 51%,rgba(21,157,235,.62) 51.15%,transparent 51.4%,transparent 63%,rgba(21,157,235,.42) 63.15%,transparent 63.4%);
  transform:rotate(-16deg);
}
.hero-inner{
  width:min(1380px,calc(100% - 64px));
  padding-top:112px;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(24px,3.2vw,48px);
}
.hero-copy{max-width:680px}
.hero-logo-wrap{margin:18px 0 20px!important;max-width:100%}
.hero-logo{width:min(640px,100%)!important;filter:drop-shadow(0 12px 28px rgba(0,0,0,.28)) drop-shadow(0 0 18px rgba(0,145,255,.22))!important}
.hero-copy h1{font-size:clamp(36px,3.45vw,50px)!important;line-height:1.04!important;letter-spacing:-2px!important}
.hero-copy h1 span{color:#198aff}
.hero-copy>p{max-width:610px;color:#c7d9e9}
.hero-product{perspective:1500px}
@media(min-width:1051px){.hero-product{transform:translateY(clamp(22px,8vh,72px))}}
.hero-product .glow{inset:7% -3% 8% 3%;background:radial-gradient(ellipse,rgba(0,131,255,.27),rgba(0,199,255,.07) 42%,transparent 72%);filter:blur(26px)}
.hero .device{
  width:min(690px,100%);
  aspect-ratio:1.54;
  display:flex;
  flex-direction:column;
  padding:10px;
  margin-left:auto;
  border-radius:29px;
  border:1px solid rgba(154,215,255,.53);
  background:linear-gradient(145deg,#24425b 0%,#071b2e 20%,#061629 100%);
  box-shadow:0 36px 86px rgba(0,0,0,.5),0 0 0 3px rgba(4,17,30,.72),inset 0 1px 0 rgba(255,255,255,.27),inset 0 -2px 0 rgba(0,0,0,.5);
  transform:rotateY(-4deg) rotateZ(-.7deg);
  transition:transform .35s ease,box-shadow .35s ease;
}
.hero .device:hover{transform:rotateY(-1deg) rotateZ(0);box-shadow:0 42px 96px rgba(0,0,0,.54),0 0 32px rgba(0,154,255,.14),inset 0 1px 0 rgba(255,255,255,.28)}
.hero .device-top{height:27px;min-height:27px;flex:0 0 27px;padding:0 10px;color:#7f9ab1;font-size:8px}
.hero .device-top .device-dots{letter-spacing:2px;color:#81a0bb}
.hero .device-top>b{font-size:9px;letter-spacing:.45px;color:#c6d7e7}
.hero .device-top>b i{font-style:normal;color:#26a0ff}
.hero .device-top>b small{color:#7892aa;font-size:6px;letter-spacing:1px}
.hero .device-live{display:flex;align-items:center;gap:5px;color:#9db4c8;font-size:7px;letter-spacing:.7px}
.hero .device-live i,.preview-connected i{width:6px;height:6px;border-radius:50%;background:#32d2a2;box-shadow:0 0 9px rgba(50,210,162,.7)}
.hero .dashboard{
  flex:1;min-height:0;height:auto;
  display:grid;grid-template-columns:128px minmax(0,1fr);
  background:#f4f7fb;border-radius:18px;overflow:hidden;
  border:1px solid rgba(255,255,255,.68);
  box-shadow:0 0 0 1px rgba(7,26,43,.4);
}
.hero .dashboard .side{
  min-width:0;padding:13px 9px 9px;
  display:flex;flex-direction:column;
  background:linear-gradient(165deg,#0b2038,#07162b 72%,#081a30);
  border-right:1px solid #1b3854;color:#b9cadd;
}
.hero .side .mini-brand{width:112px;height:32px;max-width:100%;object-fit:contain;object-position:left center;margin:0 0 11px;filter:drop-shadow(0 3px 8px rgba(0,128,255,.14))}
.preview-nav-label{padding:0 5px 7px;color:#7297bb;font-size:6px;font-weight:800;letter-spacing:1px;white-space:nowrap}
.hero .side a{display:flex;align-items:center;gap:7px;min-height:27px;padding:5px 7px;margin:1px 0;border-radius:7px;color:#bfd0e1;font-size:7.5px;font-weight:600;white-space:nowrap}
.hero .side a i{width:12px;color:#89b5dc;font-size:10px;font-style:normal;text-align:center}
.hero .side a.active{color:#fff;background:linear-gradient(95deg,#087cff,#078bdc);box-shadow:0 5px 14px rgba(0,112,240,.22)}
.hero .side a.active i{color:#fff}
.preview-connected{display:flex;align-items:center;gap:6px;margin-top:auto;padding:8px 3px 0;border-top:1px solid #ffffff13;color:#7e9ab4;font-size:6px;white-space:nowrap}
.preview-connected i{width:5px;height:5px}
.hero .dash{min-width:0;min-height:0;padding:9px 10px 10px;background:#f4f7fb;color:#182b44;display:flex;flex-direction:column;gap:8px;overflow:hidden}
.app-topline{height:19px;flex:0 0 19px;display:flex;align-items:center;justify-content:space-between;color:#8795a8;font-size:7px}
.app-topline b{padding:0 5px;color:#c1cad5;font-weight:500}.app-topline strong{color:#20344d;font-size:7px}
.app-avatar{width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#dceaff,#a9c7f2);color:#194a83;font-size:6px;font-weight:800}
.preview-hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:94px;flex:0 0 94px;padding:11px 12px;border-radius:11px;overflow:hidden;background:radial-gradient(ellipse at 82% 15%,#2479c844,transparent 34%),linear-gradient(112deg,#08182e 0%,#0b2441 64%,#103664 100%);color:#fff;box-shadow:0 5px 15px rgba(11,35,64,.12)}
.preview-hero:after{content:"";position:absolute;right:58px;top:-54px;width:152px;height:152px;border:1px solid #ffffff15;border-radius:50%;box-shadow:0 0 0 16px #ffffff05,0 0 0 34px #ffffff04;pointer-events:none}
.preview-hero-copy{position:relative;z-index:1;min-width:0}
.preview-hero-copy>small{display:block;color:#66b6ff;font-size:6px;font-weight:800;letter-spacing:1px;white-space:nowrap}
.preview-hero-copy h3{font:800 16px/1.08 Manrope,Montserrat,Arial,sans-serif;letter-spacing:-.35px;color:#fff;margin:6px 0 4px}
.preview-hero-copy p{font-size:6.5px;line-height:1.35;color:#bacbe0;margin:0;max-width:215px}
.preview-date{position:relative;z-index:1;flex:0 0 112px;padding:8px;border:1px solid #ffffff24;border-radius:8px;background:#ffffff0c;display:flex;flex-direction:column;gap:4px;box-shadow:inset 0 1px 0 #ffffff0b}
.preview-date>span{position:absolute;left:8px;top:9px;color:#79bfff;font-size:12px}
.preview-date small{padding-left:15px;color:#a6bdd4;font-size:5px;letter-spacing:.45px;white-space:nowrap}
.preview-date b{font-size:7px;color:#fff;white-space:nowrap}
.preview-date em{color:#93abc2;font-size:5.5px;font-style:normal}
.preview-panels{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(112px,.82fr);gap:8px;flex:1;min-height:0}
.preview-expiries,.preview-stats>div{min-width:0;border:1px solid #e5ebf2;border-radius:9px;background:#fff;box-shadow:0 5px 13px rgba(16,43,73,.045)}
.preview-expiries{padding:9px 9px 7px;overflow:hidden}
.preview-panel-head{display:flex;justify-content:space-between;align-items:center;gap:5px}
.preview-panel-head>div>small{display:block;color:#428df4;font-size:5.5px;font-weight:800;letter-spacing:.7px}
.preview-panel-head h4{font:750 10px Manrope,Montserrat,sans-serif;color:#142946;margin:3px 0 0;white-space:nowrap}
.preview-panel-head>b{display:grid;place-items:center;min-width:21px;height:21px;border-radius:7px;background:#fff0ee;color:#c74747;font-size:9px}
.preview-filters{display:flex;gap:4px;margin:6px 0 4px;overflow:hidden}
.preview-filters>span{display:flex;align-items:center;gap:4px;padding:4px 5px;border:1px solid #e9edf3;border-radius:12px;color:#71829b;font-size:5px;white-space:nowrap}
.preview-filters>span b{display:grid;place-items:center;width:10px;height:10px;border-radius:4px;background:#f1f4f8;color:#53657b;font-size:5px}
.preview-filters>span.selected{border-color:#b9d5f5;background:#f0f7ff;color:#176fda}
.preview-filters>span.selected b{background:#dcecff;color:#176fda}
.preview-expiry-row{display:flex;align-items:center;gap:5px;min-height:32px;padding:4px 0;border-top:1px solid #edf0f5}
.preview-expiry-row>i{display:grid;place-items:center;flex:0 0 17px;width:17px;height:17px;border-radius:5px;background:#edf5ff;color:#4483d3;font-size:8px;font-style:normal}
.preview-expiry-row>span{min-width:0;flex:1;display:grid;gap:2px}
.preview-expiry-row>span b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#263a55;font-size:6px}
.preview-expiry-row>span small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8b98aa;font-size:5px}
.preview-expiry-row>strong{padding:4px 5px;border-radius:5px;background:#fff4df;color:#b77c19;font-size:4.8px;white-space:nowrap}
.preview-expiry-row.expired>i{background:#fff0ee;color:#d34f57}
.preview-expiry-row.expired>strong{background:#ffeded;color:#c74747}
.preview-stats{min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:7px}
.preview-stats>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-content:center;column-gap:5px;padding:7px 8px;overflow:hidden}
.preview-stats small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7c8ba0;font-size:5.5px;font-weight:700}
.preview-stats b{grid-row:span 2;align-self:center;color:#142946;font:800 17px Manrope,Arial,sans-serif;letter-spacing:-.5px}
.preview-stats i{color:#159875;font-size:6px;font-style:normal}
@media(max-width:1050px){
  .hero{min-height:auto;padding:122px 0 76px}
  .hero-inner{width:min(1080px,calc(100% - 48px));padding:0;grid-template-columns:1fr;gap:34px}
  .hero-copy{max-width:760px}
  .hero-product{width:min(720px,100%);max-width:none;margin:0 auto}
  .hero .device{margin:0 auto}
}
@media(max-width:760px){
  .hero{padding:112px 0 58px}
  .hero-inner{width:calc(100% - 32px);gap:26px}
  .hero-logo-wrap{margin:15px 0 18px!important}
  .hero-logo{width:min(470px,96%)!important}
  .hero-copy h1{font-size:clamp(32px,7.8vw,44px)!important;letter-spacing:-1.5px!important}
  .hero-copy>p{font-size:15px;line-height:1.55}
  .hero .device{width:100%;aspect-ratio:1.28;border-radius:22px;padding:7px;transform:none}
  .hero .device-top{height:22px;min-height:22px;flex-basis:22px}
  .hero .dashboard{grid-template-columns:82px minmax(0,1fr);border-radius:14px}
  .hero .dashboard .side{padding:8px 5px 6px}
  .hero .side .mini-brand{height:25px;margin-bottom:6px}
  .preview-nav-label{font-size:4.8px;letter-spacing:.6px}
  .hero .side a{min-height:21px;gap:3px;padding:4px;font-size:5.6px}
  .hero .side a i{width:9px;font-size:8px}
  .preview-connected{font-size:4.3px;gap:3px}
  .hero .dash{padding:6px;gap:5px}
  .app-topline{height:15px;flex-basis:15px}
  .app-avatar{width:15px;height:15px}
  .preview-hero{min-height:78px;flex-basis:78px;padding:8px;gap:4px}
  .preview-hero-copy>small{font-size:4.5px;letter-spacing:.6px}
  .preview-hero-copy h3{font-size:12px}
  .preview-hero-copy p{font-size:5px}
  .preview-date{flex-basis:86px;padding:6px}
  .preview-date small{font-size:4px;padding-left:11px}
  .preview-date>span{left:6px;top:7px;font-size:9px}
  .preview-date b{font-size:5.7px}
  .preview-date em{font-size:4.5px}
  .preview-panels{grid-template-columns:minmax(0,1.12fr) minmax(82px,.88fr);gap:5px}
  .preview-expiries{padding:6px}
  .preview-panel-head>div>small{font-size:4.2px}
  .preview-panel-head h4{font-size:7px}
  .preview-panel-head>b{min-width:17px;height:17px;font-size:7px}
  .preview-filters{gap:2px;margin:4px 0}
  .preview-filters>span{gap:2px;padding:3px;font-size:4px}
  .preview-filters>span b{width:8px;height:8px;font-size:4px}
  .preview-expiry-row{min-height:27px;gap:3px}
  .preview-expiry-row>i{flex-basis:13px;width:13px;height:13px;font-size:6px}
  .preview-expiry-row>span b{font-size:4.8px}
  .preview-expiry-row>span small{font-size:4px}
  .preview-expiry-row>strong{padding:3px;font-size:3.8px}
  .preview-stats{gap:4px}
  .preview-stats>div{padding:5px;column-gap:3px}
  .preview-stats small{font-size:4px}
  .preview-stats b{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.hero .device{transition:none}}

/* Futuristic home transition: carry the hero palette into the first content section. */
#platform.section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(82px,9vw,126px) 0;
  color:#edf7ff;
  border-top:1px solid rgba(87,184,255,.2);
  background:
    linear-gradient(90deg,rgba(3,15,31,.90) 0%,rgba(3,15,31,.83) 34%,rgba(3,15,31,.66) 49%,rgba(3,15,31,.28) 68%,rgba(3,15,31,.10) 100%),
    linear-gradient(180deg,rgba(3,15,31,.10) 0%,rgba(3,15,31,.02) 58%,rgba(3,15,31,.30) 100%),
    url("assets/platform-cinque-schede-italiano.png") center 52%/cover no-repeat;
}
#platform.section:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  opacity:.12;
  background-image:linear-gradient(rgba(82,172,245,.45) 1px,transparent 1px),linear-gradient(90deg,rgba(82,172,245,.45) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 100%);
}
#platform.section .container{position:relative;z-index:1}
#platform .section-tag{color:#6ec9ff}
#platform.section h2{color:#f5faff}
#platform .section-intro{color:#bfd2e5}
@media(max-width:760px){
  #platform.section{
    background-image:
      linear-gradient(90deg,rgba(3,15,31,.88) 0%,rgba(3,15,31,.78) 62%,rgba(3,15,31,.58) 100%),
      linear-gradient(180deg,rgba(3,15,31,.16) 0%,rgba(3,15,31,.08) 52%,rgba(3,15,31,.34) 100%),
      url("assets/platform-cinque-schede-italiano.png");
    background-position:center,center,58% center;
    background-size:cover;
    background-repeat:no-repeat;
  }
}

/* Interactive product tour screens inside the homepage tablet */
.hero .side .preview-nav-item{width:100%;min-width:0;display:flex;align-items:center;gap:7px;min-height:27px;padding:5px 7px;margin:1px 0;border:0;border-radius:7px;background:transparent;color:#bfd0e1;text-align:left;font:600 7.5px/1.2 Manrope,Montserrat,Arial,sans-serif;white-space:nowrap;cursor:pointer;transition:background .18s ease,color .18s ease,box-shadow .18s ease}
.hero .side .preview-nav-item:hover{background:#ffffff10;color:#fff}
.hero .side .preview-nav-item:focus-visible{outline:2px solid #64c4ff;outline-offset:1px}
.hero .side .preview-nav-item.active{color:#fff;background:linear-gradient(95deg,#087cff,#078bdc);box-shadow:0 5px 14px rgba(0,112,240,.22)}
.hero .side .preview-nav-item i{flex:0 0 12px;width:12px;color:#89b5dc;font-size:10px;font-style:normal;text-align:center}
.hero .side .preview-nav-item.active i{color:#fff}
.hero .side .preview-nav-item span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.preview-view{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;gap:7px;overflow:hidden}
.preview-view[hidden]{display:none!important}
.preview-page-heading{flex:0 0 57px;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border:1px solid #e3eaf2;border-radius:9px;background:linear-gradient(115deg,#fff,#f9fbfe);box-shadow:0 4px 12px rgba(23,50,79,.035)}
.preview-page-heading>div{min-width:0}
.preview-page-heading small,.preview-card-head small{display:block;color:#3785e8;font-size:5px;font-weight:800;letter-spacing:.65px;white-space:nowrap}
.preview-page-heading h3{margin:3px 0 2px;color:#142946;font:800 12px/1.1 Manrope,Montserrat,Arial,sans-serif;letter-spacing:-.2px;white-space:nowrap}
.preview-page-heading p{margin:0;color:#77869c;font-size:5.5px;line-height:1.2;white-space:nowrap}
.preview-page-symbol{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;border:1px solid #dceaff;border-radius:9px;background:linear-gradient(145deg,#edf6ff,#e0edff);color:#147bf2;font-size:15px;font-style:normal}
.preview-page-symbol.jobs{background:#e9f6ff;color:#0785ca}.preview-page-symbol.shifts{background:#f1edff;color:#7256db}.preview-page-symbol.leave{background:#eaf9f3;color:#149673}.preview-page-symbol.reports{background:#fff4e6;color:#d58a22}
.preview-mini-kpis{flex:0 0 58px;min-height:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.preview-mini-kpis article{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:6px 7px;border:1px solid #e5ebf2;border-radius:8px;background:#fff;box-shadow:0 4px 12px rgba(16,43,73,.04);overflow:hidden}
.preview-mini-kpis small{overflow:hidden;color:#7c8ba0;font-size:5px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.preview-mini-kpis b{color:#142946;font:800 15px/1 Manrope,Arial,sans-serif;letter-spacing:-.4px}
.preview-mini-kpis em{overflow:hidden;color:#8996a8;font-size:4.8px;font-style:normal;text-overflow:ellipsis;white-space:nowrap}
.preview-data-card,.preview-people-list,.preview-shift-grid{flex:1;min-width:0;min-height:0;padding:8px 9px;border:1px solid #e5ebf2;border-radius:9px;background:#fff;box-shadow:0 5px 13px rgba(16,43,73,.045);overflow:hidden}
.preview-card-head{display:flex;align-items:center;justify-content:space-between;gap:6px;padding-bottom:6px;border-bottom:1px solid #edf1f6}
.preview-card-head>span{min-width:0;display:grid;gap:3px}
.preview-card-head>span>b{overflow:hidden;color:#20344d;font:750 8px Manrope,Arial,sans-serif;text-overflow:ellipsis;white-space:nowrap}
.preview-card-head>em{color:#147bf2;font-size:5px;font-style:normal;white-space:nowrap}
.preview-role-row{display:grid;grid-template-columns:minmax(70px,.8fr) 20px minmax(45px,1.2fr);align-items:center;gap:7px;min-height:27px;border-bottom:1px solid #f0f3f7;color:#596b82;font-size:6px}
.preview-role-row>b{color:#233a56;font-size:7px;text-align:right}
.preview-role-row>i,.preview-job-row>i{height:5px;border-radius:8px;background:#edf2f8;overflow:hidden}
.preview-role-row>i>u,.preview-job-row>i>u{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0785fa,#23b6e6);text-decoration:none}
.preview-list-toolbar{flex:0 0 26px;display:flex;align-items:center;justify-content:space-between;gap:6px;color:#75859b;font-size:5.5px}
.preview-list-toolbar>span:nth-child(2){margin-left:auto;padding:4px 7px;border:1px solid #e4eaf2;border-radius:6px;color:#9aa7b8;white-space:nowrap}
.preview-list-toolbar i{font-style:normal}
.preview-list-toolbar>b{padding:5px 7px;border-radius:6px;background:#087cff;color:#fff;font-size:5px;white-space:nowrap}
.preview-people-list{padding:2px 9px}
.preview-person-row,.preview-leave-row,.preview-report-row{display:flex;align-items:center;gap:7px;min-height:37px;border-bottom:1px solid #edf1f6}
.preview-person-row:last-child,.preview-leave-row:last-child,.preview-report-row:last-child{border-bottom:0}
.preview-person-row>i,.preview-leave-row>i,.preview-report-row>i{flex:0 0 22px;width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:#e8f2ff;color:#2879d4;font-size:6px;font-style:normal;font-weight:800}
.preview-person-row>i.violet,.preview-leave-row>i.violet,.preview-report-row>i.violet{background:#f0eaff;color:#7956c8}
.preview-person-row>i.teal,.preview-leave-row>i.teal,.preview-report-row>i.teal{background:#e5f7f3;color:#168d76}
.preview-person-row>i.amber{background:#fff3df;color:#bb8124}
.preview-person-row>span,.preview-leave-row>span,.preview-report-row>span{flex:1;min-width:0;display:grid;gap:2px}
.preview-person-row>span>b,.preview-leave-row>span>b,.preview-report-row>span>b{overflow:hidden;color:#263a55;font-size:6px;text-overflow:ellipsis;white-space:nowrap}
.preview-person-row>span>small,.preview-leave-row>span>small,.preview-report-row>span>small{overflow:hidden;color:#8795a8;font-size:5px;text-overflow:ellipsis;white-space:nowrap}
.preview-person-row>em,.preview-leave-row>strong,.preview-report-row>em{padding:4px 5px;border-radius:5px;background:#e8f8f2;color:#159875;font-size:4.5px;font-style:normal;font-weight:800;white-space:nowrap}
.preview-person-row>em.away{background:#fff3df;color:#b77c19}
.preview-person-row> b:last-child{color:#8c9aae;font-size:10px}
.preview-week-bar{flex:0 0 27px;display:flex;align-items:center;gap:7px;padding:0 8px;border:1px solid #e5ebf2;border-radius:7px;background:#fff;color:#6e8098;font-size:6px}
.preview-week-bar>b{color:#273c58;font-size:6px}.preview-week-bar>em{margin-left:auto;color:#4388df;font-size:4.5px;font-style:normal;font-weight:800;white-space:nowrap}
.preview-shift-grid{padding:4px 7px}
.preview-shift-head,.preview-shift-grid>div:not(.preview-shift-head){display:grid;grid-template-columns:.62fr 1fr 1fr;align-items:center;gap:6px}
.preview-shift-head{min-height:18px;border-bottom:1px solid #e9eef4;color:#7f8da1;font-size:4.5px;font-weight:800;letter-spacing:.3px}
.preview-shift-grid>div:not(.preview-shift-head){min-height:43px;border-bottom:1px solid #edf1f6;color:#334a66;font-size:5.5px}
.preview-shift-grid>div:last-child{border-bottom:0}
.preview-shift-grid>div>span:not(.empty-shift){min-width:0;position:relative;display:grid;gap:2px;padding-left:7px}
.preview-shift-grid>div>span>i{position:absolute;left:0;top:2px;width:3px;height:18px;border-radius:4px;background:#1689f8}
.preview-shift-grid>div>span>i.second{background:#8b6ee8}
.preview-shift-grid>div>span>strong{color:#30445f;font-size:5px;white-space:nowrap}
.preview-shift-grid>div>span>small{overflow:hidden;color:#8b98aa;font-size:4.5px;text-overflow:ellipsis;white-space:nowrap}
.preview-shift-grid .empty-shift{color:#9aa5b4;font-size:5px}
.preview-leave-row{min-height:40px}
.preview-leave-row>strong{background:#fff4df;color:#b77c19}
.preview-leave-row>strong.approved,.preview-report-row>em.approved{background:#e8f8f2;color:#159875}
.preview-leave-summary{display:grid;gap:4px;padding:7px 0 0}
.preview-leave-summary>small{color:#4388df;font-size:4.5px;font-weight:800;letter-spacing:.4px}
.preview-leave-summary>b{overflow:hidden;color:#586b83;font-size:5.5px;text-overflow:ellipsis;white-space:nowrap}
.preview-report-row{min-height:39px}
.preview-report-row>strong{color:#263a55;font-size:6px;white-space:nowrap}
.preview-report-row>em{background:#fff4df;color:#b77c19}
@media(max-width:760px){
  .hero .side .preview-nav-item{min-height:21px;gap:3px;padding:4px;font-size:5.6px}
  .hero .side .preview-nav-item i{flex-basis:9px;width:9px;font-size:8px}
  .preview-page-heading{flex-basis:48px;padding:6px 7px;gap:4px}
  .preview-page-heading small{font-size:4px}.preview-page-heading h3{font-size:9px}.preview-page-heading p{font-size:4.5px}
  .preview-page-symbol{flex-basis:23px;width:23px;height:23px;font-size:12px}
  .preview-view{gap:5px}.preview-mini-kpis{flex-basis:49px;gap:4px}
  .preview-mini-kpis article{padding:4px}.preview-mini-kpis small{font-size:4px}.preview-mini-kpis b{font-size:12px}.preview-mini-kpis em{font-size:3.8px}
  .preview-data-card,.preview-shift-grid{padding:6px}.preview-card-head{padding-bottom:4px}.preview-card-head>span>b{font-size:6px}
  .preview-role-row{min-height:22px;font-size:5px}.preview-person-row,.preview-leave-row,.preview-report-row{min-height:30px;gap:4px}
  .preview-person-row>i,.preview-leave-row>i,.preview-report-row>i{flex-basis:18px;width:18px;height:18px;font-size:5px}
  .preview-person-row>span>b,.preview-leave-row>span>b,.preview-report-row>span>b{font-size:5px}.preview-person-row>span>small,.preview-leave-row>span>small,.preview-report-row>span>small{font-size:4px}
  .preview-shift-grid>div:not(.preview-shift-head){min-height:35px;gap:3px}.preview-week-bar{flex-basis:22px;font-size:5px}
}

/* The interactive tablet now lives in the "Come funziona" workflow section. */
.workflow-tablet-shell.hero{
  display:block;min-height:0;height:auto;overflow:visible;padding:0;
  color:inherit;background:transparent;isolation:auto;
}
.workflow-tablet-shell.hero:before,
.workflow-tablet-shell.hero:after,
.workflow-tablet-shell.hero>.blueprint{display:none}
.workflow-tablet-shell .hero-product{
  width:min(960px,100%);max-width:100%;margin:30px auto 0;
  perspective:1500px;transform:none!important;
}
.workflow-tablet-shell .hero-product .glow{inset:7% -2% 8%;opacity:.5}
.workflow-tablet-shell .device{
  width:100%;max-width:960px;aspect-ratio:1.62;margin:0 auto;
  transform:none;border-radius:28px;
}
.workflow-tablet-shell .device:hover{transform:translateY(-3px)}
@media(max-width:760px){
  .workflow-tablet-shell .hero-product{margin-top:22px}
  .workflow-tablet-shell .device{aspect-ratio:1.12;padding:7px;border-radius:20px}
  .workflow-tablet-shell .dashboard{grid-template-columns:94px minmax(0,1fr)}
}

/* Hero typography and vertical rhythm: align the brand left and anchor the final proof row. */
@media(min-width:1051px){
  .hero-inner{
    width:min(1480px,calc(100% - 64px));
    height:100svh;min-height:100svh;
    display:flex;align-items:stretch;
    padding-top:clamp(150px,18vh,170px);
    padding-bottom:26px;
  }
  .hero-copy{
    display:flex;flex:1;flex-direction:column;align-items:flex-start;
    max-width:680px;min-height:0;
  }
  .hero-logo-wrap{margin:0!important}
  .hero-copy h1{margin:clamp(34px,4vh,44px) 0 0!important}
  .hero-copy>p{margin:clamp(18px,2.5vh,24px) 0 0}
  .hero-actions{margin-top:clamp(20px,2.8vh,26px)}
  .proof{margin:auto 0 0;padding-top:28px}
}
@media(max-width:1050px){
  .hero{padding:122px 0 24px}
  .hero-inner{
    width:calc(100% - 48px);height:auto;min-height:calc(100svh - 146px);
    display:flex;align-items:stretch;padding:0;
  }
  .hero-copy{display:flex;flex:1;flex-direction:column;align-items:flex-start;max-width:680px}
  .hero-logo-wrap{margin:0!important}
  .hero-copy h1{margin:32px 0 0!important}
  .hero-copy>p{margin:20px 0 0}
  .hero-actions{margin-top:22px}
  .proof{margin:auto 0 0;padding-top:28px}
}
@media(max-width:760px){
  .hero{padding:96px 0 22px}
  .hero-inner{width:calc(100% - 32px);min-height:calc(100svh - 118px)}
  .hero-logo-wrap{margin:0!important}
  .hero-copy h1{margin:26px 0 0!important}
  .hero-copy>p{margin:18px 0 0}
  .hero-actions{margin-top:20px}
  .proof{padding-top:24px}
}
@media(min-width:1051px){
  /* Use the empty left area while keeping a safe page gutter at narrower widths. */
  .hero-copy{transform:translateX(max(-150px,min(0px,calc(764px - 50vw))))}
}
@media(min-width:1051px){.hero-copy h1{margin-top:clamp(90px,10vh,104px)!important}}
@media(max-width:1050px){.hero-copy h1{margin-top:80px!important}}
@media(max-width:760px){.hero-copy h1{margin-top:62px!important}}

/* Cinematic entrance: reveal the brand and hero copy in a calm sequence. */
@keyframes sam-hero-reveal{
  from{opacity:0;transform:translate3d(0,24px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes sam-hero-backdrop-reveal{
  from{opacity:.42}
  to{opacity:1}
}
@keyframes sam-hero-photo-settle{
  from{transform:scale(var(--hero-photo-start-scale,1.10))}
  to{transform:scale(1)}
}
.hero:before{animation:sam-hero-backdrop-reveal 1.6s ease-out both}
.hero-logo-wrap,.hero-copy h1,.hero-copy>p,.hero-actions,.hero-copy .proof{
  opacity:0;animation:sam-hero-reveal .78s cubic-bezier(.2,.75,.25,1) both
}
.hero-logo-wrap{animation-delay:.12s}
.hero-copy h1{animation-delay:.42s}
.hero-copy>p{animation-delay:.65s}
.hero-actions{animation-delay:.84s}
.hero-copy .proof{animation-delay:1.04s}
@media(prefers-reduced-motion:reduce){
  .hero:before,.hero-photo,.hero-logo-wrap,.hero-copy h1,.hero-copy>p,.hero-actions,.hero-copy .proof{animation:none!important}
  .hero-logo-wrap,.hero-copy h1,.hero-copy>p,.hero-actions,.hero-copy .proof{opacity:1;transform:none}
}
@media(max-width:760px){.hero-photo{--hero-photo-start-scale:1.04}}
@media(max-width:1050px){.hero-photo{background-position:42% center;opacity:.52}}
@media(max-width:760px){.hero-photo{background-position:50% center;opacity:.38}}

/* Value section: preserve the panoramic illustration and keep its copy in the clear left area. */
.value{
  display:flex;
  align-items:center;
  min-height:clamp(360px,33.34vw,760px);
  padding:48px 0;
  background-color:#04182c;
  background-image:url("assets/diorama-cantiere-digitale-panoramico.png");
  background-position:center center;
  background-size:contain;
  background-repeat:no-repeat;
}
.value:after{content:none}
.value-grid{display:block;position:relative;z-index:1}
.value-grid>div:first-child{max-width:540px}
.value .container{
  width:min(1480px,calc(100% - 64px));
  transform:translateX(max(-150px,min(0px,calc(764px - 50vw))));
}
.value h2{
  max-width:520px;
  font-size:clamp(32px,3.35vw,46px);
  line-height:1.04;
  letter-spacing:-1.6px;
}
.value .section-intro{max-width:500px}
@media(max-width:1050px){
  .value .container{width:calc(100% - 48px);transform:none}
}
@media(max-width:900px){
  .value{
    display:block;
    min-height:0;
    padding:calc(33.34vw + 28px) 0 56px;
    background-position:center top;
    background-size:100% auto;
  }
  .value .container{width:calc(100% - 48px);margin:0 auto;transform:none}
  .value-grid>div:first-child{max-width:640px}
  .value h2{font-size:clamp(34px,5vw,44px)}
}
@media(max-width:760px){
  .value{padding:calc(33.34vw + 24px) 0 48px}
  .value .container{width:calc(100% - 36px)}
  .value h2{font-size:clamp(32px,8vw,38px);letter-spacing:-1px}
}

/* Platform section: light diorama with unboxed copy integrated directly into the open space. */
#platform.section{
  display:flex;
  align-items:center;
  min-height:clamp(380px,35.68vw,760px);
  padding:clamp(48px,6vw,88px) 0;
  color:#102b49;
  border-top:1px solid rgba(61,145,207,.18);
  background-color:#f4faff;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.02) 0%,rgba(255,255,255,.02) 46%,rgba(255,255,255,.16) 68%,rgba(255,255,255,.34) 100%),
    linear-gradient(180deg,rgba(235,246,255,.08) 0%,rgba(255,255,255,0) 58%,rgba(231,244,255,.16) 100%),
    url("assets/platform-diorama-griglia-chiara.png");
  background-position:center,center,center center;
  background-size:cover,cover,contain;
  background-repeat:no-repeat,no-repeat,no-repeat;
}
#platform.section:before{
  opacity:.16;
  background-image:linear-gradient(rgba(54,145,211,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(54,145,211,.24) 1px,transparent 1px);
}
#platform.section .container{
  width:min(660px,calc(100% - 64px));
  margin-left:auto;
  margin-right:clamp(36px,6vw,112px);
  position:relative;
  z-index:1;
}
#platform.section h2{
  max-width:590px;
  margin-top:12px;
  color:#102b49;
  font-size:clamp(32px,3.15vw,44px);
  line-height:1.06;
  letter-spacing:-1.5px;
  text-shadow:0 1px 0 rgba(255,255,255,.84),0 7px 24px rgba(20,87,145,.13);
}
#platform .section-tag{
  display:inline-flex;
  align-items:center;
  padding:0;
  color:#0879db;
  background:none;
  border:0;
  border-radius:0;
  text-shadow:0 1px 8px rgba(7,133,250,.16);
}
#platform .section-tag:before{
  content:"";
  width:24px;
  height:2px;
  margin-right:10px;
  background:linear-gradient(90deg,#0785fa,rgba(7,133,250,.28));
  box-shadow:0 0 12px rgba(7,133,250,.22);
}
#platform.section .section-intro{
  max-width:560px;
  color:#526a83;
  text-shadow:0 1px 0 rgba(255,255,255,.82),0 3px 14px rgba(36,98,151,.08);
}
@media(max-width:980px){
  #platform.section{
    display:block;
    min-height:0;
    padding:calc(35.68vw + 30px) 0 68px;
    background-image:
      linear-gradient(180deg,rgba(245,250,255,0) 0%,rgba(245,250,255,.06) 25vw,rgba(245,250,255,.98) 38vw,#f4faff 100%),
      url("assets/platform-diorama-griglia-chiara.png");
    background-position:center,center top;
    background-size:cover,100% auto;
    background-repeat:no-repeat,no-repeat;
  }
  #platform.section .container{
    width:min(650px,calc(100% - 48px));
    margin:0 clamp(24px,5vw,72px) 0 auto;
  }
  #platform.section h2{font-size:clamp(32px,4.6vw,42px)}
}
@media(max-width:600px){
  #platform.section{padding:calc(35.68vw + 20px) 0 56px}
  #platform.section .container{width:calc(100% - 36px);margin:0 18px 0 auto}
  #platform.section h2{font-size:clamp(30px,8vw,36px);letter-spacing:-1px}
}

/* Modules: align real hover cards with the blueprint reference while keeping the artwork as the background. */
.modules{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  scroll-margin-top:48px;
  padding-top:clamp(116px,8vw,132px);
  background-color:#f4f8ff;
  background-image:url("assets/tre-icone-cubiche-rete-tecnologica.png");
  background-position:center 24px;
  background-size:100% auto;
  background-repeat:no-repeat;
}
.modules .container{width:92%}
.modules h2{
  max-width:740px;
  font-size:clamp(38px,4vw,54px);
  letter-spacing:-1.8px;
  text-shadow:0 1px 0 rgba(255,255,255,.88),0 7px 22px rgba(28,88,145,.11);
}
.modules .section-intro{color:#5e7691;text-shadow:0 1px 0 rgba(255,255,255,.85)}
.modules .module-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:70px;
}
.modules .module{
  display:grid;
  grid-template-columns:68px minmax(0,1fr);
  grid-template-rows:auto auto;
  align-content:center;
  align-items:center;
  column-gap:15px;
  min-height:172px;
  padding:16px 18px;
  border:1px solid rgba(106,169,228,.38);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 24px rgba(21,75,128,.07),inset 0 1px 0 #fff;
  transition:transform .24s cubic-bezier(.2,.75,.25,1),box-shadow .24s ease,border-color .24s ease,background-color .24s ease;
}
.modules .module:hover{
  transform:translateY(-5px);
  border-color:#72baff;
  background:#fff;
  box-shadow:0 18px 38px rgba(13,91,165,.16),0 0 0 3px rgba(23,143,255,.06);
}
.modules .module .mi{
  grid-column:1;
  grid-row:1 / span 2;
  display:grid;
  place-items:center;
  width:68px;
  height:68px;
  margin:0;
  border:1px solid #d3e8fb;
  border-radius:17px;
  color:#096dc7;
  background:linear-gradient(145deg,#fff 4%,#e8f4ff 100%);
  box-shadow:inset 0 1px 0 #fff,0 8px 18px rgba(30,113,188,.12);
  transition:transform .24s cubic-bezier(.2,.75,.25,1),box-shadow .24s ease;
}
.modules .module:hover .mi{
  transform:translateY(-2px) scale(1.035);
  box-shadow:inset 0 1px 0 #fff,0 10px 22px rgba(14,124,216,.2);
}
.modules .module .mi svg{display:block;width:46px;height:46px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.modules .module .mi svg .accent{stroke:#0785fa}
.modules .module b{grid-column:2;grid-row:1;align-self:end;color:#0b2d5b;font-size:16px;line-height:1.25}
.modules .module p{grid-column:2;grid-row:2;align-self:start;margin:5px 0 0;color:#6e8299;font-size:12px;line-height:1.5}
@media(max-width:1050px){
  .modules .container{width:calc(100% - 48px)}
  .modules .module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .modules{padding-top:104px;background-size:100% auto;background-position:center 8px}
  .modules .container{width:calc(100% - 32px)}
  .modules .module-grid{grid-template-columns:1fr;gap:12px;margin-top:32px}
  .modules .module{grid-template-columns:58px minmax(0,1fr);min-height:112px;padding:15px 16px}
  .modules .module .mi{width:58px;height:58px;border-radius:15px}
  .modules .module .mi svg{width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce){
  .modules .module,.modules .module .mi{transition:none!important}
  .modules .module:hover,.modules .module:hover .mi{transform:none}
}

/* Mobile app showcase: keep the provided equipment scene as a full-width backdrop and render its feature list as real HTML. */
#mobile.mobile-showcase{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:660px;
  padding:clamp(64px,6vw,88px) 0 28px;
  background-color:#f7fbff;
  background-image:url("assets/miniatura-nfc-qr-cantiere.png");
  background-size:100% auto;
  background-position:left center;
  background-repeat:no-repeat;
}
.mobile-showcase-layout{
  width:min(1530px,calc(100% - 64px));
  min-height:510px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(460px,.92fr);
  gap:24px;
  align-items:center;
}
.mobile-showcase-copy{position:relative;z-index:1;max-width:630px;margin-left:auto;padding:20px 0}
.mobile-showcase-copy .section-tag{color:#087fea}
.mobile-showcase-copy h2{max-width:620px;margin:12px 0 16px;color:#102e50;font-size:clamp(38px,4vw,54px);line-height:1.04;letter-spacing:-1.8px;text-shadow:0 2px 12px rgba(255,255,255,.55)}
.mobile-showcase-copy .section-intro{max-width:590px;margin:0;color:#5c7189;font-size:15px;line-height:1.7}
.mobile-use-cases{display:grid;gap:10px;margin-top:24px}
.mobile-use-case{display:grid;grid-template-columns:58px minmax(0,1fr);gap:15px;align-items:center;min-height:64px}
.mobile-use-icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid rgba(37,148,233,.18);border-radius:17px;background:rgba(255,255,255,.84);box-shadow:0 8px 22px rgba(40,116,175,.12),inset 0 1px 0 #fff;color:#087fea;transition:transform .22s ease,box-shadow .22s ease}
.mobile-use-icon svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.mobile-use-icon svg .icon-accent{stroke:#00a6f5}
.mobile-use-case:hover .mobile-use-icon{transform:translateY(-2px) scale(1.04);box-shadow:0 12px 26px rgba(30,131,212,.18),inset 0 1px 0 #fff}
.mobile-use-case b{display:block;color:#12345a;font-size:16px;line-height:1.3}
.mobile-use-case small{display:block;margin-top:3px;color:#657c97;font-size:13px;line-height:1.45}
.mobile-store-links{display:flex;flex-wrap:wrap;gap:11px;margin-top:25px}
.mobile-store-badge{min-width:178px;min-height:58px;display:inline-flex;align-items:center;gap:11px;padding:8px 14px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:linear-gradient(145deg,#0b2949,#06172b);color:#fff;text-decoration:none;box-shadow:0 10px 22px rgba(13,56,98,.16);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.mobile-store-badge:hover{transform:translateY(-3px);border-color:rgba(42,164,255,.72);box-shadow:0 15px 28px rgba(11,94,160,.24)}
.mobile-store-badge:focus-visible{outline:3px solid #1699ff;outline-offset:3px}
.mobile-store-badge .store-logo{width:27px;height:27px;flex:0 0 27px}
.mobile-store-badge .apple-logo{fill:#fff}
.mobile-store-badge span{display:grid;gap:2px}
.mobile-store-badge small{color:#b6c9dc;font-size:8px;font-weight:700;letter-spacing:.85px;line-height:1.15}
.mobile-store-badge strong{color:#fff;font-size:16px;line-height:1.15;letter-spacing:-.25px}
@media(max-width:1050px){
  #mobile.mobile-showcase{min-height:680px;background-size:auto 420px;background-position:left top}
  .mobile-showcase-layout{width:calc(100% - 48px);grid-template-columns:minmax(250px,.72fr) minmax(400px,1fr);gap:12px}
  .mobile-showcase-copy h2{font-size:clamp(36px,4.7vw,48px)}
}
@media(max-width:760px){
  #mobile.mobile-showcase{min-height:0;padding:0 0 68px;background-image:url("assets/miniatura-nfc-qr-cantiere.png");background-size:auto 320px;background-position:left top}
  .mobile-showcase-layout{width:calc(100% - 36px);min-height:0;grid-template-columns:1fr;gap:0}
  .mobile-showcase-spacer{height:360px}
  .mobile-showcase-copy{max-width:none;margin:0;padding:0}
  .mobile-showcase-copy h2{font-size:clamp(36px,10vw,46px);letter-spacing:-1.5px}
  .mobile-showcase-copy .section-intro{font-size:14px}
  .mobile-use-cases{gap:9px;margin-top:20px}
  .mobile-use-case{grid-template-columns:54px minmax(0,1fr);gap:13px;min-height:60px}
  .mobile-use-icon{width:54px;height:54px;border-radius:15px}
  .mobile-use-icon svg{width:35px;height:35px}
  .mobile-use-case b{font-size:15px}
  .mobile-use-case small{font-size:12px}
  .mobile-store-links{gap:9px;margin-top:22px}
  .mobile-store-badge{min-width:0;flex:1 1 150px;padding:8px 10px;gap:8px}
  .mobile-store-badge strong{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .mobile-use-icon,.mobile-store-badge{transition:none!important}
  .mobile-use-case:hover .mobile-use-icon,.mobile-store-badge:hover{transform:none}
}

/* Contact section: use the panoramic blueprint artwork and align its copy with the home hero. */
#contact.section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  align-items:center;
  min-height:clamp(430px,35vw,680px);
  padding:clamp(58px,7vw,104px) 0;
  color:#102e50;
  background-color:#f2f8ff;
  background-image:linear-gradient(90deg,rgba(250,253,255,.18) 0%,rgba(250,253,255,.12) 42%,rgba(242,248,255,.06) 100%),url("assets/modello-sam360-sfondo-tecnico-panoramico.png");
  background-size:cover,cover;
  background-position:center,center center;
  background-repeat:no-repeat,no-repeat;
}
#contact .container{
  position:relative;
  top:clamp(70px,4.5vw,84px);
  z-index:1;
  width:min(1480px,calc(100% - 64px));
  margin:0 auto;
}
#contact .section-tag{color:#087fea;text-shadow:0 1px 8px rgba(255,255,255,.7)}
#contact h2{
  max-width:680px;
  color:#102e50;
  text-shadow:0 2px 14px rgba(255,255,255,.7),0 8px 28px rgba(27,84,139,.09);
}
#contact .section-intro{
  max-width:560px;
  color:#526b84;
  text-shadow:0 1px 8px rgba(255,255,255,.75);
}
@media(min-width:1051px){
  #contact .container{transform:translateX(max(-150px,min(0px,calc(764px - 50vw))))}
}
@media(max-width:1050px){
  #contact .container{width:calc(100% - 48px)}
  #contact.section{min-height:clamp(500px,65vw,680px);background-position:center,right center}
}
@media(max-width:760px){
  #contact .container{width:calc(100% - 32px)}
  #contact.section{
    min-height:480px;
    padding:96px 0 56px;
    background-image:linear-gradient(90deg,rgba(249,252,255,.97) 0%,rgba(249,252,255,.93) 68%,rgba(249,252,255,.74) 100%),url("assets/modello-sam360-sfondo-tecnico-panoramico.png");
    background-size:cover,auto 100%;
    background-position:center,right center;
  }
  #contact h2{font-size:clamp(34px,9vw,42px);letter-spacing:-1.2px}
}

/* Compact platform/value pair: both sections fit together beneath the fixed navigation. */
#platform.section,
.value{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  align-items:center;
  min-height:clamp(340px,44.5svh,460px);
  padding:22px 0;
  scroll-margin-top:88px;
}
#platform.section{
  color:#102b49;
  border-top:1px solid rgba(61,145,207,.18);
  background-color:#f4faff;
  background-image:
    linear-gradient(90deg,rgba(244,250,255,0) 0%,rgba(244,250,255,0) 54%,rgba(244,250,255,.12) 100%),
    url("assets/value-modello-architettonico-blueprint.png");
  background-size:100% 100%,cover;
  background-position:center,left center;
  background-repeat:no-repeat,no-repeat;
}
#platform.section:before{opacity:.07}
#platform.section .container,
.value .container{
  position:relative;
  z-index:1;
  width:min(1480px,calc(100% - 64px));
  margin:0 auto;
  transform:translateX(max(-150px,min(0px,calc(764px - 50vw))));
}
#platform.section .container{
  width:calc(100% - 64px);
  max-width:none;
  transform:none;
}
#platform.section .section-tag,
#platform.section h2,
#platform.section .section-intro{
  width:min(650px,100%);
  margin-left:auto;
  margin-right:0;
}
#platform.section .section-tag{display:flex}
#platform .section-tag{color:#0879db}
#platform.section h2{
  max-width:650px;
  margin:10px 0 14px auto;
  color:#102b49;
  font-size:clamp(36px,3.35vw,48px);
  line-height:1.04;
  text-shadow:0 2px 12px rgba(255,255,255,.82);
}
#platform.section .section-intro{
  max-width:650px;
  text-align:left;
  color:#526a83;
  line-height:1.55;
  text-shadow:0 1px 8px rgba(255,255,255,.82);
}
.value{
  color:#f5f9ff;
  background-color:#06172b;
  background-image:
    linear-gradient(90deg,#06172b 0%,rgba(6,23,43,.96) 34%,rgba(6,23,43,.45) 56%,rgba(6,23,43,.08) 100%),
    url("assets/platform-cantiere-compatto-navy.png");
  background-size:100% 100%,auto 122%;
  background-position:center,right center;
  background-repeat:no-repeat,no-repeat;
}
.value:after{content:none}
.value-grid{display:block;position:relative;z-index:1}
.value-grid>div:first-child{width:min(650px,100%);max-width:650px;margin-left:0;transform:translateX(clamp(82px,7.5vw,132px))}
.value .section-tag{color:#7dd2ff}
.value h2{
  margin:10px 0 14px;
  color:#f5f9ff;
  font-size:clamp(36px,3.25vw,46px);
  line-height:1.04;
  text-shadow:0 3px 18px rgba(0,0,0,.4);
}
.value .section-intro{color:#c7d8e9;text-shadow:0 2px 12px rgba(0,0,0,.45);line-height:1.55}
@media(min-width:1051px){
  #platform.section .section-tag,
  #platform.section h2,
  #platform.section .section-intro{transform:translateX(-80px);text-align:left}
}
@media(min-width:761px) and (max-width:1050px){
  #platform.section .container,.value .container{width:calc(100% - 48px);transform:none}
  #platform.section .container{width:calc(100% - 48px)}
  .value-grid>div:first-child{width:min(650px,100%);transform:translateX(clamp(54px,6vw,66px))}
}
@media(max-width:760px){
  #platform.section,.value{min-height:clamp(320px,44.5svh,380px);padding:18px 0;scroll-margin-top:78px}
  #platform.section .container,.value .container{width:calc(100% - 32px);margin:0 16px;transform:none}
  #platform.section .section-tag,#platform.section h2,#platform.section .section-intro{width:100%;margin-left:0;margin-right:0}
  #platform.section{background-image:linear-gradient(90deg,rgba(244,250,255,.92) 0%,rgba(244,250,255,.82) 100%),url("assets/value-modello-architettonico-blueprint.png");background-position:center,left center}
  #platform.section .section-intro{color:#526a83;text-shadow:0 1px 8px rgba(255,255,255,.82)}
  #platform.section h2,.value h2{font-size:clamp(29px,7.6vw,34px);letter-spacing:-1px}
  #platform .section-intro,.value .section-intro{font-size:14px;line-height:1.48}
  .value{background-image:linear-gradient(90deg,rgba(6,23,43,.97) 0%,rgba(6,23,43,.9) 56%,rgba(6,23,43,.52) 100%),url("assets/platform-cantiere-compatto-navy.png");background-position:center,right center}
  .value .section-intro{color:#c7d8e9;text-shadow:0 2px 12px rgba(0,0,0,.45)}
  .value-grid>div:first-child{width:min(100%,650px);margin-left:0;transform:none}
}

/* Align the entire value-section copy to a shared right edge. */
.value .section-tag,.value h2,.value .section-intro{box-sizing:border-box;width:min(100%,520px);max-width:520px;margin-left:auto;margin-right:0;text-align:right}
.value .section-tag{display:flex;justify-content:flex-end}
.value .section-intro{max-width:500px}