/* Editorial photography replaces the old pictogram panels. */
.connection-photo{aspect-ratio:4/3;width:100%;margin:0;border-radius:12px;overflow:hidden;background:#dfe5d6}
.connection-photo img{width:100%;height:100%;object-fit:cover;display:block}
.connection-rows{gap:clamp(90px,10vw,150px)}
.connection-row{min-height:0}
.connection-copy .connection-name{font-size:22px;line-height:1.4;margin:0 0 24px;color:var(--teal)}
.connection-copy h3{font-size:clamp(34px,3.5vw,51px)}
.connection-copy>p:not(.connection-name){font-size:clamp(20px,1.75vw,24px)}
.connection-copy .text-link{font-size:18px;margin-top:34px}

/* Original supplier logos, grouped by their role in the project. */
.brand-section{padding-block:clamp(82px,8vw,122px);background:#fff;overflow:clip}
.brand-intro{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:start;margin-bottom:62px}
.brand-intro h2{font-size:clamp(38px,4vw,56px);line-height:1.12;max-width:650px}
.brand-intro p{font-size:clamp(20px,1.8vw,24px);line-height:1.65;color:var(--muted);max-width:550px}
.brand-logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:40px;list-style:none;padding:0;margin:0}
.brand-logos li{min-width:0;height:104px;display:flex;align-items:center;justify-content:center;padding:20px 10px}
.brand-logos img{display:block;width:auto;height:auto;max-width:100%;max-height:52px;object-fit:contain}
.brand-logos .brand-axis{max-height:66px}
.brand-logos .brand-mobotix{max-height:45px}
.brand-logos .brand-dahua{max-height:58px}
.brand-logos .brand-bosch{max-height:40px}
.brand-logos .brand-vodafone{max-height:76px}
.brand-logos .brand-tim{max-height:60px}
.brand-logos .brand-windtre{max-height:75px}
.brand-logos .brand-iliad{max-height:48px}
.brand-logos .brand-1nce{max-height:59px}
.brand-logos .brand-eiotclub{max-height:45px}
.brand-logos .brand-starlink{max-width:190px;max-height:45px}
.brand-logos.providers{grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 70px}
.brand-logos.routers{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1000px;margin-inline:auto;gap:70px}
.brand-logos.routers img{max-width:220px;max-height:60px;width:100%}
.brand-section-routers .brand-intro{margin-bottom:40px}

@media(prefers-reduced-motion:no-preference){
 .motion-ready .connection-photo img{transform:scale(1.035);transition:transform 1.6s var(--ease)}
 .motion-ready .connection-row.in .connection-photo img{transform:scale(1)}
}
@media(max-width:1000px){
 .brand-logos{gap:28px}.brand-logos.providers{gap:26px 40px}
 .brand-logos.routers{gap:55px}.brand-intro{gap:7%}
}
@media(max-width:760px){
 .connection-photo{max-width:640px;justify-self:center;border-radius:9px}
 .connection-rows{gap:100px}.connection-copy .connection-name{font-size:20px;margin-bottom:20px}
 .connection-copy h3{font-size:clamp(34px,7vw,44px)}
 .connection-copy>p:not(.connection-name){font-size:20px;line-height:1.7}
 .connection-copy .text-link{font-size:18px;margin-top:28px}
 .brand-intro{grid-template-columns:1fr;gap:25px;margin-bottom:40px}
 .brand-intro h2{font-size:42px}.brand-intro p{font-size:20px}
 .brand-logos,.brand-logos.providers{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 35px}
 .brand-logos li{height:105px;padding:20px 6px}
 .brand-logos img{max-height:48px;max-width:180px;width:100%}
 .brand-logos .brand-vodafone{width:auto;max-width:105px}
 .brand-logos .brand-tim,.brand-logos .brand-iliad{width:auto;max-width:140px}
 .brand-logos.routers{grid-template-columns:1fr;gap:18px;max-width:250px}
 .brand-logos.routers li{height:92px}
}
@media(max-width:380px){
 .brand-intro h2{font-size:36px}.brand-logos,.brand-logos.providers{column-gap:25px}
 .brand-logos img{max-width:100%}.brand-logos .brand-tim{max-width:100%}
 .connection-copy h3{font-size:33px}
}
