@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;800&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,body{
    font-family:'Noto Sans',Arial,sans-serif;
    background:#f7faff;
    color:#07164d;
}

a{
    text-decoration:none;
    color:inherit;
}

button,input{
    font-family:inherit;
}

.web-layout{
    display:flex;
    min-height:100vh;
}

/* SIDEBAR */

.web-sidebar{
    width:280px;
    height:100vh;
    position:fixed;
    left:0;
    top:0;
    background:#ffffff;
    border-right:1px solid #e8eef8;
    padding:26px 18px;
    z-index:50;
    display:flex;
    flex-direction:column;
}

.sidebar-logo a{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:34px;
}

.logo-icon{
    width:42px;
    height:42px;
    background:#0057ff;
    color:#fff;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
}

.logo-text{
    font-size:23px;
    font-weight:800;
    color:#07164d;
}

.sidebar-menu{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.sidebar-menu a{
    height:52px;
    border-radius:8px;
    padding:0 16px;
    display:flex;
    align-items:center;
    gap:14px;
    color:#26345f;
    font-size:15px;
    font-weight:700;
}

.sidebar-menu a.active,
.sidebar-menu a:hover{
    background:#eef5ff;
    color:#0057ff;
}

/* CHAT */

.sidebar-chat{
    margin-top:26px;
    background:#fff;
    border:1px solid #e6edf8;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(20,60,120,.08);
}

.chat-header{
    background:#0057ff;
    color:#fff;
    padding:15px 16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.chat-header h4{
    font-size:16px;
    margin-bottom:3px;
}

.chat-header small{
    font-size:12px;
    color:#dfffea;
}

.chat-agent{
    padding:16px;
    display:flex;
    gap:10px;
    align-items:center;
}

.chat-agent img{
    width:43px;
    height:43px;
    border-radius:50%;
    object-fit:cover;
}

.chat-agent strong{
    display:block;
    font-size:13px;
}

.chat-agent span{
    display:block;
    font-size:11px;
    color:#66769a;
    margin-top:2px;
}

.chat-messages{
    padding:0 14px 12px;
}

.message{
    max-width:190px;
    padding:10px 12px;
    border-radius:10px;
    font-size:12px;
    line-height:1.5;
    margin-bottom:9px;
}

.message.left{
    background:#f1f5fb;
    color:#26345f;
}

.message.right{
    margin-left:auto;
    background:#0057ff;
    color:#fff;
}

.chat-input{
    border-top:1px solid #edf2fa;
    padding:10px;
    display:flex;
    gap:8px;
}

.chat-input input{
    flex:1;
    border:0;
    outline:0;
    background:#f4f7fc;
    height:36px;
    border-radius:20px;
    padding:0 12px;
    font-size:12px;
}

.chat-input button{
    width:36px;
    height:36px;
    border:0;
    border-radius:50%;
    background:#0057ff;
    color:#fff;
    cursor:pointer;
}

.support-card{
    margin-top:18px;
    background:#f1f6ff;
    border-radius:12px;
    padding:18px;
}

.support-icon{
    font-size:28px;
    margin-bottom:8px;
}

.support-card h4{
    font-size:15px;
    margin-bottom:7px;
}

.support-card p{
    color:#66769a;
    font-size:13px;
    line-height:1.5;
    margin-bottom:10px;
}

.support-card a{
    color:#0057ff;
    font-weight:800;
    font-size:13px;
}

/* HEADER */

.web-header{
    position:fixed;
    left:280px;
    right:0;
    top:0;
    height:82px;
    background:#fff;
    border-bottom:1px solid #e8eef8;
    z-index:40;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 34px;
}

.header-search{
    width:420px;
    height:46px;
    background:#f5f8fd;
    border:1px solid #e7eef9;
    border-radius:8px;
    display:flex;
    align-items:center;
    overflow:hidden;
}

.header-search input{
    flex:1;
    border:0;
    background:transparent;
    outline:0;
    padding:0 16px;
    color:#07164d;
}

.header-search button{
    width:52px;
    height:46px;
    border:0;
    background:transparent;
    cursor:pointer;
}

.header-right{
    display:flex;
    align-items:center;
    gap:14px;
}

.header-icon,
.header-bell{
    width:44px;
    height:44px;
    border:0;
    background:#fff;
    font-size:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
}

.header-bell span{
    position:absolute;
    top:1px;
    right:2px;
    width:20px;
    height:20px;
    background:#0057ff;
    color:#fff;
    border-radius:50%;
    font-size:11px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.header-btn{
    min-width:105px;
    height:46px;
    border-radius:7px;
    border:1px solid #0057ff;
    color:#0057ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:14px;
    padding:0 18px;
}

.header-btn.primary{
    background:#0057ff;
    color:#fff;
}

/* MAIN */

.web-main{
    width:calc(100% - 280px);
    margin-left:280px;
    padding:104px 32px 34px;
}

/* HERO */

.web-hero{
    height:320px;
    border-radius:12px;
    background-size:cover;
    background-position:center right;
    overflow:hidden;
    box-shadow:0 12px 35px rgba(20,60,120,.08);
    margin-bottom:20px;
}

.web-hero-layer{
    width:100%;
    height:100%;
    background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.96) 34%,rgba(255,255,255,.55) 63%,rgba(255,255,255,.05) 100%);
    display:flex;
    align-items:center;
}

.web-hero-text{
    max-width:590px;
    padding-left:58px;
}

.web-hero h1{
    font-size:38px;
    line-height:1.22;
    font-weight:800;
    color:#07164d;
    margin-bottom:16px;
}

.web-hero h1 span{
    color:#0057ff;
}

.web-hero p{
    color:#526389;
    font-size:16px;
    line-height:1.7;
    margin-bottom:28px;
}

.web-hero-buttons{
    display:flex;
    gap:16px;
}

.blue-btn,
.white-btn{
    height:52px;
    border-radius:8px;
    padding:0 26px;
    display:flex;
    align-items:center;
    gap:9px;
    font-size:15px;
    font-weight:800;
}

.blue-btn{
    background:#0057ff;
    color:#fff;
}

.white-btn{
    background:#fff;
    color:#0057ff;
    border:1px solid #b8cdf5;
}

/* SECTIONS */

.web-card-section{
    background:#fff;
    border:1px solid #e8eef8;
    border-radius:12px;
    padding:22px;
    margin-bottom:20px;
    box-shadow:0 8px 28px rgba(20,60,120,.04);
}

.section-title-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.section-title-row h2{
    font-size:21px;
    color:#07164d;
    font-weight:800;
}

.section-title-row a{
    color:#0057ff;
    font-size:14px;
    font-weight:800;
}

/* LAWYERS */

.web-lawyers-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}

.web-lawyer-card{
    border:1px solid #edf2fa;
    border-radius:10px;
    padding:16px;
    display:flex;
    gap:14px;
    background:#fff;
}

.web-lawyer-card img{
    width:82px;
    height:82px;
    border-radius:50%;
    object-fit:cover;
    background:#eef3fb;
}

.lawyer-info h3{
    font-size:15px;
    font-weight:800;
    margin-bottom:5px;
}

.verified{
    background:#0057ff;
    color:#fff;
    font-size:11px;
    border-radius:50%;
    padding:1px 5px;
}

.lawyer-info p{
    font-size:12px;
    color:#66769a;
    margin-bottom:8px;
}

.lawyer-rating{
    font-size:12px;
    margin-bottom:7px;
}

.lawyer-rating span{
    color:#ff9b00;
}

.lawyer-rating small{
    color:#66769a;
}

.lawyer-location{
    font-size:12px;
    color:#26345f;
    margin-bottom:10px;
}

.lawyer-info a{
    height:34px;
    padding:0 14px;
    border-radius:6px;
    border:1px solid #b8cdf5;
    display:inline-flex;
    align-items:center;
    color:#0057ff;
    font-weight:800;
    font-size:12px;
}

/* LEGAL INFO */

.legal-info-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.legal-info-card{
    height:105px;
    border-radius:10px;
    background:linear-gradient(90deg,#f7faff,#fff);
    display:flex;
    align-items:center;
    gap:18px;
    padding:0 24px;
}

.legal-icon{
    width:66px;
    height:66px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    font-weight:800;
}

.legal-icon.blue{
    background:#eaf3ff;
    color:#0057ff;
}

.legal-icon.orange{
    background:#fff1e6;
    color:#ff8500;
}

.legal-icon.purple{
    background:#f3eaff;
    color:#842cff;
}

.legal-info-card h3{
    font-size:16px;
    margin-bottom:6px;
}

.legal-info-card p{
    font-size:13px;
    color:#66769a;
    line-height:1.45;
}

/* SERVICES */

.services-home-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.service-home-card{
    border:1px solid #edf2fa;
    border-radius:10px;
    padding:20px;
    background:#fff;
}

.service-home-card span{
    display:inline-flex;
    background:#eef5ff;
    color:#0057ff;
    border-radius:20px;
    padding:5px 12px;
    font-size:12px;
    font-weight:800;
    margin-bottom:12px;
}

.service-home-card h3{
    font-size:17px;
    margin-bottom:8px;
}

.service-home-card p{
    color:#66769a;
    font-size:14px;
    line-height:1.6;
    margin-bottom:14px;
}

.service-home-card strong{
    color:#0057ff;
    font-size:13px;
}

/* NEWS */

.web-news-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.web-news-card{
    display:grid;
    grid-template-columns:105px 1fr;
    gap:15px;
    align-items:center;
}

.news-photo{
    width:105px;
    height:105px;
    border-radius:9px;
    background-size:cover;
    background-position:center;
}

.news-content time{
    color:#66769a;
    font-size:12px;
}

.news-content h3{
    font-size:13px;
    line-height:1.45;
    margin:6px 0;
}

.news-content p{
    display:none;
}

.news-content strong{
    color:#0057ff;
    font-size:12px;
}

/* EMPTY */

.empty-box{
    grid-column:1/-1;
    padding:18px;
    border-radius:10px;
    background:#f7faff;
    color:#66769a;
    font-weight:700;
}

/* FOOTER */

.web-footer{
    margin-left:280px;
    background:#fff;
    border-top:1px solid #e8eef8;
    padding:34px 32px 18px;
}

.footer-top{
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:30px;
    margin-bottom:24px;
}

.footer-brand h3{
    font-size:22px;
    margin-bottom:10px;
}

.footer-brand p{
    color:#66769a;
    line-height:1.6;
    max-width:430px;
}

.footer-links h4{
    margin-bottom:12px;
}

.footer-links a{
    display:block;
    color:#66769a;
    margin-bottom:8px;
    font-size:14px;
}

.footer-bottom{
    border-top:1px solid #edf2fa;
    padding-top:16px;
    color:#66769a;
    font-size:13px;
}

/* RESPONSIVE WEB */

@media(max-width:1300px){
    .web-lawyers-grid,
    .web-news-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .legal-info-grid,
    .services-home-grid{
        grid-template-columns:1fr;
    }
}

/* ERIZECI.AZ yeni ana səhifə dizayn əlavələri */
:root{
    --blue:#0057ff;
    --dark:#07164d;
    --soft:#f7faff;
    --line:#e8eef8;
}

.web-sidebar{
    width:300px;
    padding:28px 18px 22px;
    overflow-y:auto;
}
.web-header{left:300px;height:82px}
.web-main{width:calc(100% - 300px);margin-left:300px;padding:104px 26px 28px}
.web-footer{margin-left:300px}

.sidebar-logo a{margin-bottom:34px;padding-left:10px}
.logo-icon.svg-logo{background:transparent;color:var(--blue);width:34px;height:34px;border-radius:0}
.logo-icon.svg-logo svg{width:34px;height:34px;stroke:var(--blue);stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.logo-text{font-size:23px;font-weight:900;letter-spacing:-.5px;color:#07164d}
.sidebar-menu{gap:10px}
.sidebar-menu a{height:54px;border-radius:9px;padding:0 16px;color:#07164d;font-size:15px;font-weight:800}
.sidebar-menu a.active,.sidebar-menu a:hover{background:#eef5ff;color:var(--blue)}
.menu-svg{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:currentColor}
.menu-svg svg{width:23px;height:23px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}

.sidebar-chat{display:none!important}
.sidebar-ad-card{
    min-height:520px;
    margin-top:34px;
    border-radius:10px;
    overflow:hidden;
    position:relative;
    background:
        linear-gradient(180deg,rgba(5,29,72,.74),rgba(3,30,76,.88)),
        url('https://images.unsplash.com/photo-1589829545856-d10d557cf95f?auto=format&fit=crop&w=700&q=80') center/cover no-repeat;
    box-shadow:0 12px 35px rgba(0,35,90,.16);
}
.sidebar-ad-content{position:absolute;left:0;right:0;top:0;padding:34px 26px;color:#fff;text-align:center}
.sidebar-ad-content span{font-size:18px;font-weight:800;letter-spacing:.5px}
.sidebar-ad-content h3{font-size:27px;line-height:1.15;margin:8px 0 16px;font-weight:900}
.sidebar-ad-content p{font-size:15px;line-height:1.5;margin:0 auto 20px;max-width:210px;color:#fff}
.sidebar-ad-content a{height:45px;padding:0 18px;border-radius:8px;background:var(--blue);display:inline-flex;align-items:center;gap:14px;color:#fff;font-weight:900;font-size:14px;box-shadow:0 10px 24px rgba(0,87,255,.25)}

.support-card{margin-top:22px;background:#f1f6ff;border:1px solid #edf3ff;border-radius:12px;padding:22px 18px;display:flex;gap:14px;align-items:flex-start}
.support-icon{width:48px;height:48px;border-radius:50%;background:#eaf3ff;color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none;margin:0}
.support-icon svg{width:27px;height:27px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.support-card h4{font-size:17px;font-weight:900;color:#07164d;margin:0 0 8px}
.support-card p{font-size:13px;line-height:1.65;color:#526389;margin:0 0 12px}
.support-card a{font-size:14px;color:var(--blue);font-weight:900;display:inline-flex;gap:10px;align-items:center}

.header-left{flex:1}.header-right{gap:16px}.header-icon-btn{background:#fff!important;border:0!important;color:#07164d}.header-btn{height:48px;min-width:128px;border-radius:7px}.header-btn.primary{box-shadow:0 8px 22px rgba(0,87,255,.18)}

.home-hero-card{
    height:350px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#fff;
    overflow:hidden;
    margin-bottom:16px;
    display:grid;
    grid-template-columns:44% 56%;
    box-shadow:0 8px 28px rgba(20,60,120,.04);
}
.home-hero-text{display:flex;flex-direction:column;justify-content:center;padding-left:68px;position:relative;z-index:2;background:#fff}
.home-hero-text h1{font-size:35px;line-height:1.24;font-weight:900;letter-spacing:-1px;color:#07164d;margin:0 0 20px}
.home-hero-text h1 span{color:var(--blue)}
.home-hero-text p{font-size:16px;line-height:1.75;color:#263f8d;max-width:380px;margin:0 0 30px}
.home-hero-image{position:relative;background-size:cover;background-position:center;height:100%}
.home-hero-image:before{content:"";position:absolute;left:-2px;top:0;bottom:0;width:260px;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.84) 42%,rgba(255,255,255,.36) 73%,rgba(255,255,255,0) 100%)}
.web-hero-buttons{gap:28px}.blue-btn,.white-btn{height:56px;border-radius:7px;padding:0 27px;font-weight:900}.white-btn{min-width:160px;justify-content:center}.btn-svg{width:22px;height:22px;display:flex}.btn-svg svg{width:22px;height:22px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}

.web-card-section.compact-section{padding:16px 20px;margin-bottom:14px;border-radius:13px}.section-title-row{margin-bottom:14px}.section-title-row h2{font-size:21px;letter-spacing:-.4px}.section-title-row a{font-size:14px}
.web-lawyers-grid{gap:14px}.web-lawyer-card{min-height:150px;border-color:#e7eef9;border-radius:10px;padding:17px 16px;gap:14px;align-items:flex-start;box-shadow:0 6px 18px rgba(20,60,120,.03)}
.web-lawyer-card img{width:76px;height:76px}.lawyer-info{flex:1}.lawyer-info h3{font-size:15px;color:#07164d;margin-bottom:6px}.verified{margin-left:5px;background:var(--blue);font-size:10px;padding:1px 5px}.lawyer-info p{color:#263f8d;font-size:12px;margin-bottom:8px}.lawyer-rating{font-size:12px;color:#07164d}.lawyer-location{font-size:12px;color:#07164d;margin-bottom:15px}.lawyer-info a{height:38px;border-radius:6px;border-color:#9fc0ff;display:flex;justify-content:center;width:100%;font-size:13px;color:var(--blue)}
.legal-info-grid{gap:28px}.legal-info-card{height:112px;border:1px solid #edf2fb;background:linear-gradient(90deg,#f9fbff,#fff);border-radius:10px;padding:0 28px}.legal-icon{width:68px;height:68px}.legal-icon svg{width:36px;height:36px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}.legal-info-card h3{font-size:15px}.legal-info-card p{font-size:13px;color:#263f8d;line-height:1.55}
.services-home-grid{gap:16px}.service-home-card{border-color:#e7eef9;box-shadow:0 5px 18px rgba(20,60,120,.03)}
.web-news-grid{gap:28px}.web-news-card{grid-template-columns:104px 1fr;gap:18px}.news-photo{width:104px;height:104px;border-radius:8px}.news-content time{font-size:12px;color:#263f8d}.news-content h3{font-size:13px;line-height:1.55;color:#07164d;font-weight:900}.news-content strong{font-size:13px;color:var(--blue)}

@media(max-width:1300px){.web-lawyers-grid,.web-news-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.web-sidebar{display:none}.web-header{left:0}.web-main{width:100%;margin-left:0;padding:100px 14px 24px}.web-footer{margin-left:0}.home-hero-card{height:auto;grid-template-columns:1fr}.home-hero-text{padding:34px 24px}.home-hero-image{height:220px}.home-hero-text h1{font-size:28px}.web-lawyers-grid,.web-news-grid,.legal-info-grid,.services-home-grid{grid-template-columns:1fr}.web-hero-buttons{flex-direction:column;gap:12px;align-items:flex-start}}
