/* =========================================================
AVM NETWORKS — HOME PAGE GLASS CARRIER THEME (FINAL)
Clean Corporate Glass UI + 4 Column Solution Grid
Background untouched
========================================================= */

html{scroll-behavior:smooth;}

.home-wrapper{
max-width:1180px;
margin:auto;
padding:0 22px;
}

.home-page section{
padding:85px 0;
}

/* --------------------------------------------------
HEADINGS (ADVANCED UNDERLINE)
-------------------------------------------------- */

.home-page h2{
text-align:center;
font-size:30px;
color:#eaf4ff;
margin-bottom:48px;
position:relative;
}

/* premium underline */
.home-page h2::after{
content:"";
width:140px;
height:3px;
display:block;
margin:18px auto 0;
border-radius:3px;
background:linear-gradient(
90deg,
transparent 0%,
rgba(57,209,255,.2) 20%,
#39d1ff 50%,
rgba(57,209,255,.2) 80%,
transparent 100%
);
box-shadow:0 0 18px rgba(57,209,255,.35);
}

/* --------------------------------------------------
HERO
-------------------------------------------------- */

.hero{
display:flex;
align-items:center;
gap:60px;
min-height:70vh;
position:relative;
padding:90px 45px;
}

.hero-left{flex:1 1 520px;}
.hero-right{flex:1 1 420px;}

.hero h1{
color:#ffffff;
font-size:40px;
line-height:1.25;
margin:14px 0 18px;
}

.hero-badge{
display:inline-block;
background:rgba(57,209,255,.15);
color:#9fe7ff;
padding:7px 14px;
border-radius:20px;
font-size:13px;
}

.hero-sub,
.hero-desc{
color:#cfe6ff;
line-height:1.7;
margin-bottom:16px;
}

.carrier-context{
color:#b7dbff;
margin-bottom:22px;
}

.service-highlight{
color:#39d1ff;
text-decoration:none;
}

/* CTA buttons */

.btn-primary{
background:#19bfff;
color:#002033;
padding:13px 24px;
border-radius:6px;
text-decoration:none;
font-weight:600;
display:inline-block;
transition:.25s;
}
.btn-primary:hover{
transform:translateY(-2px);
box-shadow:0 10px 26px rgba(57,209,255,.35);
}

.btn-secondary{
border:2px solid #39d1ff;
color:#d8f4ff;
padding:11px 22px;
border-radius:6px;
text-decoration:none;
margin-left:12px;
}

/* --------------------------------------------------
NETWORK PROOF PANEL (GLASS)
-------------------------------------------------- */

.network-proof{
background:rgba(255,255,255,.05);
border:1px solid rgba(255,255,255,.15);
padding:26px;
border-radius:14px;
backdrop-filter:blur(7px);
position:relative;
overflow:hidden;
}

.network-proof::after{
content:"";
position:absolute;
top:0;
left:-120%;
width:120%;
height:100%;
background:linear-gradient(120deg, transparent, rgba(255,255,255,.18), transparent);
transition:1.2s;
}
.network-proof:hover::after{left:120%;}

.network-proof h3{
color:#ffffff;
margin-bottom:14px;
}

.proof-list{
list-style:none;
padding:0;
}

.proof-list li{
color:#cfe6ff;
padding:7px 0;
border-bottom:1px solid rgba(255,255,255,.08);
}

.network-link{
color:#39d1ff;
text-decoration:none;
display:inline-block;
margin-top:14px;
}

/* --------------------------------------------------
BUYERS GRID
-------------------------------------------------- */

.buyer-grid{
display:flex;
flex-wrap:wrap;
gap:20px;
justify-content:center;
}

.buyer-card{
width:230px;
padding:18px;
text-align:center;
border-radius:12px;
background:rgba(255,255,255,.05);
border:1px solid rgba(255,255,255,.12);
color:#eaf4ff;
transition:.25s;
}

.buyer-card:hover{
transform:translateY(-6px);
border-color:#39d1ff;
box-shadow:0 12px 28px rgba(57,209,255,.18);
}

/* --------------------------------------------------
SERVICES
-------------------------------------------------- */

.service-grid{
display:flex;
gap:24px;
flex-wrap:wrap;
justify-content:center;
}

.service-box{
width:300px;
padding:22px;
border-radius:14px;
background:rgba(255,255,255,.05);
border:1px solid rgba(255,255,255,.12);
color:#eaf4ff;
transition:.25s;
}

.service-box p{color:#cfe6ff;}

.service-box:hover{
transform:translateY(-6px);
border-color:#39d1ff;
box-shadow:0 12px 28px rgba(57,209,255,.18);
}

/* --------------------------------------------------
SOLUTIONS (NOW 4 COLUMN GRID)
-------------------------------------------------- */

.solution-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px;
align-items:stretch;
}

.solution-box{
padding:22px;
border-radius:14px;
background:rgba(255,255,255,.05);
border:1px solid rgba(255,255,255,.12);
color:#eaf4ff;
transition:.25s;
min-height:185px;
position:relative;
overflow:hidden;
}

/* glass shine reflection */
.solution-box::after{
content:"";
position:absolute;
top:0;
left:-120%;
width:120%;
height:100%;
background:linear-gradient(120deg, transparent, rgba(255,255,255,.22), transparent);
transition:1.1s;
}

.solution-box:hover::after{
left:120%;
}

.solution-box:hover{
transform:translateY(-6px);
border-color:#39d1ff;
box-shadow:0 12px 28px rgba(57,209,255,.18);
}

/* --------------------------------------------------
CTA
-------------------------------------------------- */

.final-cta{
text-align:center;
color:#eaf4ff;
}

.final-cta p{
color:#cfe6ff;
margin:14px 0 24px;
}

/* --------------------------------------------------
SECTION GLASS PANELS
-------------------------------------------------- */

.home-page section{
position:relative;
margin:40px 0;
padding:70px 40px;
border-radius:18px;
background:rgba(255,255,255,.04);
border:1px solid rgba(255,255,255,.14);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);
box-shadow:0 18px 45px rgba(0,0,0,.25);
}

.home-page section:hover{
border-color:rgba(57,209,255,.35);
box-shadow:0 20px 60px rgba(57,209,255,.15);
}

/* --------------------------------------------------
SEO SUPPORT TEXT
-------------------------------------------------- */

.carrier-identity{
max-width:720px;
margin-top:18px;
font-size:14px;
opacity:.85;
line-height:1.6;
}

.coverage-note{
font-size:13.5px;
opacity:.75;
margin-top:10px;
line-height:1.5;
}

.entity-definition{
max-width:760px;
margin:12px 0 8px 0;
font-size:15px;
opacity:.9;
line-height:1.6;
}

/* --------------------------------------------------
MOBILE
-------------------------------------------------- */

@media(max-width:900px){
.solution-grid{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:768px){

.hero{
flex-direction:column;
text-align:center;
gap:40px;
}

.hero h1{font-size:28px;}

.btn-primary,
.btn-secondary{
display:block;
width:85%;
margin:10px auto;
}

.buyer-card,
.service-box,
.solution-box{
width:100%;
}

.home-page section{
margin:25px 0;
padding:55px 20px;
}

}

@media(max-width:520px){
.solution-grid{grid-template-columns:1fr;}
}