:root{
    --afb-dark:#0C3050;
    --afb-navy:#0C3050;
    --afb-dark-2:#0A253F;
    --afb-blue:#0095db;
    --afb-orange:#fea501;
    --afb-white:#ffffff;
    --afb-text:#24374a;
    --container:1440px;
    --shadow-heavy:0 18px 45px rgba(0,0,0,0.34);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:"Open Sans",Arial,Helvetica,sans-serif;
    color:var(--afb-text);
    background:var(--afb-dark);
    line-height:1.65;
    font-size:14px;
}
a{
    color:var(--afb-blue);
    text-decoration:none;
    transition:color .22s ease,background .22s ease,border-color .22s ease,transform .22s ease;
}
a:hover{color:var(--afb-orange)}
.container{width:min(100% - 48px,var(--container));margin:0 auto}
.site-shell .container{width:calc(100% - 70px);max-width:none}
.site-shell{position:absolute;top:0;left:0;width:100%;z-index:30}
.topbar{
    min-height:45px;
    background:rgba(12,48,80,.7);
    border-top:1px solid rgba(255,255,255,.06);
    border-bottom:1px solid rgba(0,53,89,1);
    box-shadow:0 4px 2px -2px rgba(0,0,0,.4);
    backdrop-filter:blur(2px);
    color:#fff;
    font-size:13px;
    position:relative;
    z-index:4;
    padding:5px 0;
}
.topbar-inner{min-height:45px;display:flex;align-items:center;justify-content:flex-end;gap:16px}
.topbar a{color:#fff;font-weight:700}
.topbar .phone{color:var(--afb-orange);white-space:nowrap}
.socials{display:flex;align-items:center;gap:8px}
.socials a{
    min-width:40px;
    height:40px;
    padding:0 12px;
    border-radius:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:var(--afb-blue);
    color:#fff;
    font-size:13px;
    font-weight:800;
    line-height:1;
}
.socials a:hover{background:#6b6b6b;color:#fff}
.site-header{
    background:rgba(12,48,80,.5);
    border-top:1px solid rgba(255,255,255,.06);
    border-bottom:1px solid rgba(0,53,89,1);
    box-shadow:0 4px 2px -2px rgba(0,0,0,.4);
    backdrop-filter:blur(2px);
    position: relative;
    z-index:3;
    padding:15px 0;
}
.site-header-inner{
    min-height:112px;
    display:grid;
    grid-template-columns:minmax(210px,280px) 1fr minmax(210px,280px);
    align-items:center;
    gap:30px;
    padding:16px 0;
}
.brand{display:flex;align-items:center;justify-self:start;min-width:0}
.brand img{
    height:92px;
    width:auto;
    display:block;
    filter:drop-shadow(2px 2px 2px rgba(0,0,0,.55));
}
.nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:30px;
    flex-wrap:wrap;
    justify-self:center;
}
.nav a{
    position:relative;
    color:#fff;
    font-size:14px;
    font-weight:700;
    line-height:1;
}
.nav a:hover,.nav a.active{color:var(--afb-orange)}
.nav a.active:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-14px;
    height:3px;
    background:var(--afb-orange);
}
.search-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:24px;
    height:24px;
    color:var(--afb-orange)!important;
}
.search-link svg{display:block}
.header-spacer{min-width:210px;justify-self:end}
.hero{
    min-height:680px;
    color:#fff;
    padding:245px 0 90px;
    background:
        linear-gradient(rgba(12,48,80,.42),rgba(12,48,80,.58)),
        url('https://www.afbcommunications.com/wp-content/uploads/2025/11/afb-home-header-2560x1440-04-2.jpg') center center / cover no-repeat;
    position:relative;
    z-index:2;
    box-shadow:0 4px 2px -2px rgba(0,0,0,.2);
}
.wrap{width:min(100% - 48px,var(--container));margin:0 auto}
.hero-grid{
    min-height:310px;
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);
    gap:58px;
    align-items:center;
}
.hero-grid>div:first-child{text-align:right;text-shadow:4px 4px 10px #000}
.eyebrow{
    display:inline-block;
    margin-bottom:12px;
    color:var(--afb-blue);
    font-size:12px;
    font-weight:800;
    letter-spacing:.15em;
}
.hero .eyebrow{color:#fff}
h1,h2,h3{margin-top:0}
h1{
    margin-bottom:26px;
    color:var(--afb-orange);
    font-size:clamp(42px,5vw,66px);
    line-height:1.08;
    letter-spacing:-.02em;
    font-weight:700;
}
h2{
    margin:0 0 22px;
    color:var(--afb-dark);
    font-size:clamp(30px,3.5vw,46px);
    line-height:1.18;
}
h3{color:var(--afb-dark);line-height:1.2}
.lead{
    margin:0 0 28px auto;
    max-width:920px;
    color:rgba(255,255,255,.96);
    font-size:20px;
    line-height:1.4;
    font-weight:600;
}
.actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px}
.btn{
    min-height:48px;
    padding:12px 20px;
    border-radius:4px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
}
.btn.primary{background:var(--afb-blue);color:#fff}
.btn.secondary{border:1px solid rgba(255,255,255,.75);background:rgba(12,48,80,.58);color:#fff}
.btn:hover{background:var(--afb-orange);color:#fff}
.hero-card{
    padding:30px;
    background:rgba(12,48,80,.86);
    border:1px solid rgba(255,255,255,.16);
    box-shadow:var(--shadow-heavy);
    color:#fff;
}
.hero-card strong{display:block;margin-bottom:20px;color:#fff;font-size:23px}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.hero-tags span{
    padding:7px 11px;
    background:rgba(255,255,255,.09);
    border:1px solid rgba(255,255,255,.15);
    color:#fff;
    font-size:12px;
    font-weight:700;
}
.hero-card p{margin:0;color:rgba(255,255,255,.88)}
.section{padding:95px 0;background:#fff;color:var(--afb-text)}
.section-intro{max-width:920px;margin:-6px 0 42px;color:#536779;font-size:18px}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.feature{
    padding:30px;
    background:#fff;
    border-top:4px solid var(--afb-blue);
    box-shadow:0 12px 32px rgba(12,48,80,.10);
}
.feature h3{margin:0 0 12px;font-size:21px}
.feature p{margin:0;color:#536779}
.number{display:block;margin-bottom:16px;color:var(--afb-orange);font-size:13px;font-weight:800}
.contrast,.afb-links{
    background-image:linear-gradient(to bottom right,#eee,#dbdbdb,#fff,#eee,#f5f5f5,#fff,#eee)!important;
}
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.integration-map{
    position:relative;
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-areas:"mail ticket" "core core" "crm pbx";
    gap:14px;
    padding:26px;
    background:var(--afb-dark);
    box-shadow:var(--shadow-heavy);
}
.integration-node,.integration-core{
    min-height:88px;
    padding:16px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    text-align:center;
}
.integration-node{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.15)}
.integration-node span{color:#fff;font-weight:800}
.integration-node small{color:rgba(255,255,255,.72)}
.integration-core{
    grid-area:core;
    width:min(250px,72%);
    justify-self:center;
    background:var(--afb-blue);
    box-shadow:0 12px 30px rgba(0,0,0,.25);
}
.integration-core strong{color:#fff;font-size:20px}
.integration-core small{color:rgba(255,255,255,.78)}
.integration-mail{grid-area:mail}.integration-ticket{grid-area:ticket}.integration-crm{grid-area:crm}.integration-pbx{grid-area:pbx}
.text-link{display:inline-block;margin-top:10px;color:var(--afb-blue);font-weight:800}
.text-link:hover{color:var(--afb-orange)}
.link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.link-grid a{padding:25px 28px;background:var(--afb-dark);box-shadow:var(--shadow-heavy)}
.link-grid strong,.link-grid span{display:block}
.link-grid strong{margin-bottom:6px;color:var(--afb-blue);font-size:18px}
.link-grid span{color:#fff;font-size:13px}
.link-grid a:hover strong{color:var(--afb-orange)}
.faq details{border-top:1px solid #ccd7df;padding:20px 0}
.faq details:last-child{border-bottom:1px solid #ccd7df}
.faq summary{cursor:pointer;color:var(--afb-dark);font-size:18px;font-weight:800}
.faq details p{max-width:900px;color:#536779}
.cta{
    color:#fff;
    border-top:2px solid #0095e2;
    border-bottom:2px solid #0095e2;
    padding:66px 0 70px;
    background-image:linear-gradient(to bottom right,#0095db,#40b0e6,#0095e2,#007CB9,#139de3,#49b4e7,#0095db);
    box-shadow:0 3px 10px rgb(0 0 0 / .15);
}
.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}
.cta h2,.cta .eyebrow{color:#fff}
.cta p{max-width:800px;margin-bottom:0;color:#fff;font-size:17px;font-weight:600}
.btn.light{flex:0 0 auto;background:#fff;color:var(--afb-dark)}
.footer-main{
    color:rgba(255,255,255,.94);
    background:
        linear-gradient(rgba(10,37,63,.5),rgba(9,31,53,.5)),
        url('https://www.afbcommunications.com/wp-content/uploads/2023/10/footer-parallax-2560x1440-02.jpg.webp') center center / cover no-repeat;
    padding:85px 0 50px;
}
.footer-inner{position:relative;z-index:1}
.footer-separator-top,.footer-separator{max-width:var(--container);height:.5px;background:rgba(145,145,145,.2)}
.footer-separator-top{margin:-10px auto 70px}.footer-separator{margin:70px auto}
.footer-grid,.footer-cards{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1fr 1fr 2fr;gap:24px}
.footer-cards.second{margin-top:60px;grid-template-columns:1.2fr 1.2fr 1fr 1fr}
.footer-card{background:rgba(12,48,80,.84);padding:25px 28px;box-shadow:var(--shadow-heavy);min-height:170px}
.footer-card h3{margin:0 0 15px;color:var(--afb-blue);font-size:1.2em;font-weight:600}
.footer-card p,.footer-card li{margin:0 0 8px;color:#fff;font-size:.9rem;line-height:1.5rem}
.footer-card ul{list-style:none;margin:0;padding:0}
.footer-card a{color:#fff;font-size:12px;font-weight:700;text-transform:uppercase}
.footer-card a:hover{color:var(--afb-orange)}
.footer-card .normal-link{text-transform:none;font-size:13px;font-weight:600}
.footer-card li{display:flex;align-items:flex-start;gap:8px}
.mini-arrow{flex:0 0 13px;width:13px;height:13px;color:#fff;margin-top:4px}
.footer-logo-block{margin:60px auto 0;text-align:center}
.footer-logo-block img{width:220px;height:auto;filter:drop-shadow(2px 2px 2px rgba(0,0,0,.55))}
.footer-socials{display:flex;justify-content:center;gap:12px;margin-top:50px}
.footer-socials a{
    width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
    background:var(--afb-blue);color:#fff;font-size:15px;font-weight:800
}
.footer-socials a:hover{background:#6b6b6b;color:#fff}
.footer-bottom{
    max-width:var(--container);
    margin:20px auto 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:var(--afb-blue);
    font-size:11px;
}
.footer-bottom p{margin:0;font-size:11px}.footer-bottom a{color:var(--afb-blue);font-size:11px}
@media(max-width:1100px){
    .site-header-inner{grid-template-columns:auto 1fr}
    .nav{justify-content:flex-end;justify-self:end;gap:18px}
    .header-spacer{display:none}
    .footer-cards,.footer-cards.second{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 900px){
    .site-shell{position:relative}
    .topbar,.site-header{background:rgba(12,48,80,.98)}
    .site-shell .container{width:min(100% - 32px,var(--container))}
    .site-header-inner{min-height:auto;grid-template-columns:1fr;padding:20px 0}
    .brand img{height:80px}.nav{display:none}
    .hero{min-height:auto;padding:72px 0 82px}
    .hero-grid{grid-template-columns:1fr;gap:32px}
    .hero-grid>div:first-child{text-align:left;text-shadow:2px 2px 7px #000}
    .lead{margin-left:0}.actions{justify-content:flex-start}
    .feature-grid,.link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .split{grid-template-columns:1fr;gap:38px}
    .footer-main{padding:70px 0 42px}
}
@media (max-width: 620px){
    .container,.wrap{width:min(100% - 28px,var(--container))}
    .topbar-inner{justify-content:center;flex-wrap:wrap;gap:9px;padding:7px 0}
    h1{font-size:34px}.lead{font-size:17px}
    .feature-grid,.link-grid,.footer-cards,.footer-cards.second{grid-template-columns:1fr}
    .section{padding:70px 0}
    .integration-map{grid-template-columns:1fr;grid-template-areas:"mail" "ticket" "core" "crm" "pbx"}
    .integration-core{width:min(270px,86%)}
    .cta{padding:46px 0 50px}
    .cta-inner{flex-direction:column;align-items:flex-start}
    .footer-bottom{flex-direction:column;text-align:center;margin-bottom:20px}
}
