/* Reti LAN / WAN - pagina HTML reale */

.lanwan-hero{position:relative;overflow:hidden;color:#fff;padding:64px 0 78px;background:radial-gradient(circle at 82% 12%,rgba(0,166,81,.14),transparent 26%),radial-gradient(circle at 18% 95%,rgba(0,109,255,.22),transparent 32%),linear-gradient(135deg,#061b33 0%,#082c5f 52%,#04142a 100%)}
.lanwan-hero::after{content:"";position:absolute;inset:auto -10% 0 -10%;height:170px;background:radial-gradient(ellipse at 32% 80%,rgba(0,109,255,.34),transparent 58%),repeating-radial-gradient(ellipse at 35% 100%,rgba(0,180,255,.18) 0 2px,transparent 2px 16px);opacity:.7;transform:rotate(-2deg)}
.lanwan-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.85fr) minmax(430px,.82fr);gap:42px;align-items:center}
.lanwan-copy h1{max-width:820px;margin:0 0 18px;color:#fff;font-size:clamp(2.25rem,5vw,4.45rem);line-height:1.02;letter-spacing:-.06em}
.lanwan-lead{max-width:760px;color:rgba(255,255,255,.88);font-size:1.08rem;line-height:1.7}
.lanwan-actions,.lanwan-badges{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.lanwan-badges span{display:inline-flex;align-items:center;border-radius:14px;padding:10px 13px;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);font-weight:850}
.lanwan-visual-card{padding:16px;border-radius:34px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.17);box-shadow:0 30px 90px rgba(0,0,0,.22)}
.lanwan-visual-card img{display:block;width:100%;border-radius:26px}
.lanwan-feature-strip{background:#f4f7fb;padding:0 0 54px}
.lanwan-feature-grid{position:relative;z-index:3;margin-top:-34px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;border-radius:26px;background:#fff;box-shadow:0 22px 70px rgba(6,27,51,.14);border:1px solid rgba(9,25,44,.08)}
.lanwan-feature-grid article{text-align:center;padding:28px 22px;border-right:1px solid rgba(9,25,44,.08)}
.lanwan-feature-grid article:last-child{border-right:0}
.lanwan-feature-grid span{display:block;color:#006dff;font-size:2.15rem;font-weight:950;line-height:1;margin-bottom:12px}
.lanwan-feature-grid h3{margin:0 0 8px;color:#071b35;font-size:1.04rem}
.lanwan-feature-grid p{margin:0;color:#5f6c7b;line-height:1.5;font-size:.92rem}
.lanwan-section,.lanwan-cta-section{background:#fff;padding:66px 0}
.lanwan-section{padding-top:0}
.lanwan-light{background:#f4f7fb;padding-top:66px}
.section-title.centered{max-width:900px;margin:0 auto 32px;text-align:center}
.section-title h2,.lanwan-two-col h2{color:#071b35;letter-spacing:-.045em}
.section-title p,.lanwan-two-col p{color:#5f6c7b;line-height:1.7}
.lanwan-value-grid,.networking-grid{display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr))}
.lanwan-value-grid article,.networking-grid article,.process-list div{border:1px solid rgba(9,25,44,.08);border-radius:20px;background:#fff;padding:24px;box-shadow:0 16px 42px rgba(6,27,51,.07)}
.lanwan-value-grid span,.networking-grid span{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:16px;margin-bottom:14px;color:#fff;background:linear-gradient(135deg,#006dff,#00A651);font-size:1.45rem;font-weight:900}
.lanwan-value-grid h3,.networking-grid h3{margin:0 0 8px;color:#071b35;font-size:1.08rem}
.lanwan-value-grid p,.networking-grid p{margin:0;color:#5f6c7b;line-height:1.55;font-size:.94rem}
.lanwan-two-col{display:grid;grid-template-columns:minmax(0,.85fr) minmax(360px,.95fr);gap:42px;align-items:start}
.process-list{display:grid;gap:13px}
.process-list strong{display:block;color:#071b35;margin-bottom:6px}
.process-list span{color:#5f6c7b;line-height:1.5}
.lanwan-cta-section{padding-top:0}
.lanwan-cta-box{display:grid;grid-template-columns:.78fr 1fr;gap:30px;align-items:center;border-radius:28px;padding:36px 40px;color:#fff;background:radial-gradient(circle at 86% 45%,rgba(0,109,255,.38),transparent 18%),linear-gradient(135deg,#061b33 0%,#082c5f 52%,#04142a 100%);box-shadow:0 22px 70px rgba(6,27,51,.15)}
.lanwan-cta-box h2{color:#fff;margin:0;font-size:clamp(2rem,3vw,3.2rem);line-height:1.05}
.lanwan-cta-box p{color:rgba(255,255,255,.86);line-height:1.6;margin:0}
.lanwan-cta-box .btn-outline{color:#fff;border-color:rgba(255,255,255,.35)}
@media (max-width:1100px){.lanwan-hero-grid,.lanwan-two-col,.lanwan-cta-box{grid-template-columns:1fr}.lanwan-feature-grid,.lanwan-value-grid,.networking-grid{grid-template-columns:1fr 1fr}.lanwan-visual-card{max-width:680px}}
@media (max-width:680px){.lanwan-hero{padding:42px 0 58px}.lanwan-feature-grid,.lanwan-value-grid,.networking-grid{grid-template-columns:1fr}.lanwan-feature-grid article{border-right:0;border-bottom:1px solid rgba(9,25,44,.08)}}


/* ICONE MODERNE - PROGETTAZIONE RETI LAN / WAN
   Sostituiscono simboli/emoji con icone lineari coerenti. */
.lan-icon {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='22' fill='none' stroke='black' stroke-width='6'/%3E%3C/svg%3E");
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 62px !important;
  height: 62px !important;
  min-width: 62px;
  border-radius: 18px;
  margin: 0 auto 14px !important;
  color: transparent !important;
  background: linear-gradient(135deg, rgba(0,109,255,.14), rgba(0,166,81,.12)) !important;
  border: 1px solid rgba(0,59,134,.12);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.54), 0 10px 24px rgba(6,27,51,.065);
  font-size: 0 !important;
  line-height: 1 !important;
  position: relative;
}

.lan-icon::before {
  content: "";
  width: 34px;
  height: 34px;
  display: block;
  background: #003b86;
  -webkit-mask: var(--icon-url) center / contain no-repeat;
  mask: var(--icon-url) center / contain no-repeat;
}

.lanwan-feature-grid .lan-icon,
.lanwan-value-grid .lan-icon,
.networking-grid .lan-icon {
  display: flex !important;
}

.lanwan-value-grid .lan-icon,
.networking-grid .lan-icon {
  margin: 0 0 16px !important;
}

/* icone specifiche */
.icon-analysis {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='28' cy='28' r='15' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M40 40l12 12M22 28h12M28 22v12' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-config {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='9' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M32 8v9M32 47v9M8 32h9M47 32h9M15 15l7 7M42 42l7 7M49 15l-7 7M22 42l-7 7' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-traffic,
.icon-bandwidth {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M12 20h35M39 12l9 8-9 8M52 44H17M25 36l-9 8 9 8' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21 32h22' stroke='black' stroke-width='5' stroke-linecap='round' opacity='.65'/%3E%3C/svg%3E");
}

.icon-monitor {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='10' y='13' width='44' height='31' rx='5' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M24 53h16M32 44v9M18 32h8l5-9 7 16 4-7h5' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-modular {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='10' y='10' width='18' height='18' rx='4' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='36' y='10' width='18' height='18' rx='4' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='10' y='36' width='18' height='18' rx='4' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='36' y='36' width='18' height='18' rx='4' fill='none' stroke='black' stroke-width='5'/%3E%3C/svg%3E");
}

.icon-cloud {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M22 48h24c7 0 12-5 12-11s-5-11-12-11h-1C43 17 36 12 28 14c-7 1-12 7-12 14v1c-6 1-10 5-10 10 0 6 5 9 16 9z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M28 32h16M36 24v16' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-redundancy {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M20 18c8-6 19-5 26 2l3 3M44 46c-8 6-19 5-26-2l-3-3' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M49 13v10H39M15 51V41h10' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='32' cy='32' r='7' fill='none' stroke='black' stroke-width='5'/%3E%3C/svg%3E");
}

.icon-lan {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect x='24' y='8' width='16' height='14' rx='3' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='8' y='42' width='16' height='14' rx='3' fill='none' stroke='black' stroke-width='5'/%3E%3Crect x='40' y='42' width='16' height='14' rx='3' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M32 22v10M16 42V32h32v10' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-wan {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='23' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M9 32h46M32 9c8 8 12 16 12 23S40 47 32 55M32 9C24 17 20 25 20 32s4 15 12 23' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-wifi-pro {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M12 26c12-10 28-10 40 0M20 36c7-6 17-6 24 0M28 46c2-2 6-2 8 0' fill='none' stroke='black' stroke-width='6' stroke-linecap='round'/%3E%3Ccircle cx='32' cy='53' r='4' fill='black'/%3E%3Cpath d='M50 44l3 3 6-8' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.icon-security {
  --icon-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 8 51 16v14c0 13-8 22-19 27-11-5-19-14-19-27V16L32 8z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M23 32l6 6 13-14' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
