
/* =========================================================
DISHA RECRUITMENT
ACCOUNTS EXECUTIVE RECRUITMENT
PAGE-SPECIFIC CSS — COMMERCIAL / EMPLOYER-FIRST
Filename: accounts-executive-recruitment.css
========================================================= */

.accounts-commercial-page{
    --acc2-blue:#0B4F9C;
    --acc2-blue-dark:#083C76;
    --acc2-green:#148C3B;
    --acc2-green-dark:#0E7130;
    --acc2-ink:#253746;
    --acc2-text:#435567;
    --acc2-muted:#69798A;
    --acc2-border:#DCE6F0;
    --acc2-soft:#F4F8FD;
    --acc2-soft-green:#F3FAF5;
    --acc2-shadow:0 7px 20px rgba(17,62,105,.065);
    color:var(--acc2-text);
}

.accounts-commercial-page .container{
    width:min(1180px,calc(100% - 40px));
    margin-inline:auto;
}

.accounts-commercial-page h1,
.accounts-commercial-page h2,
.accounts-commercial-page h3{
    font-family:"Poppins",Arial,sans-serif;
}

.accounts-commercial-page p,
.accounts-commercial-page li,
.accounts-commercial-page span,
.accounts-commercial-page small{
    font-family:"Open Sans",Arial,sans-serif;
}

/* =========================================================
01 HERO — COMMERCIAL, NOT INSIGHT CLONE
========================================================= */
.accx2-hero{
    padding:38px 0 36px;
    background:
        radial-gradient(circle at 88% 20%,rgba(20,140,59,.08),transparent 28%),
        linear-gradient(135deg,#F2F7FD 0%,#F8FBFF 55%,#EEF6F1 100%);
    border-bottom:1px solid #E2EAF2;
}
.accx2-hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(330px,.9fr);
    gap:42px;
    align-items:center;
}
.accx2-hero-copy{min-width:0;max-width:760px;}
.accx2-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-bottom:10px;
    padding:5px 10px;
    border-radius:20px;
    background:#EAF3FF;
    color:var(--acc2-blue);
    font-size:10.5px;
    font-weight:800;
    letter-spacing:.9px;
}
.accx2-eyebrow i{color:var(--acc2-green);}
.accx2-hero h1{
    margin:0 0 12px;
    max-width:720px;
    color:var(--acc2-blue);
    font-size:39px;
    line-height:1.12;
    letter-spacing:-.45px;
}
.accx2-hero-lead{
    margin:0 0 9px;
    color:#334E67;
    font-size:16px;
    line-height:1.65;
    font-weight:600;
}
.accx2-hero-text{
    max-width:730px;
    margin:0;
    color:var(--acc2-muted);
    font-size:14.5px;
    line-height:1.65;
}
.accx2-hero-text strong{color:#425A70;}
.accx2-hero-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:13px;
    margin-top:16px;
}
.accx2-hero-actions .btn{
    min-height:41px;
    padding:10px 17px;
    font-size:13.5px;
}
.accx2-text-link{
    color:var(--acc2-blue);
    font-size:12.5px;
    font-weight:800;
    text-decoration:none;
}
.accx2-text-link:hover{color:var(--acc2-green);text-decoration:underline;text-underline-offset:3px;}
.accx2-proof-row{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:14px;
}
.accx2-proof-row span{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 9px;
    border:1px solid #D7E3EE;
    border-radius:7px;
    background:#fff;
    color:#52677B;
    font-size:11.5px;
    font-weight:700;
}
.accx2-proof-row i{color:var(--acc2-green);}
.accx2-hero-visual{display:flex;justify-content:flex-end;}
.accx2-image-frame{
    position:relative;
    width:100%;
    max-width:410px;
    overflow:hidden;
    border:1px solid #D7E2EC;
    border-radius:15px;
    background:#fff;
    box-shadow:0 12px 28px rgba(12,60,105,.11);
}
.accx2-image-frame img{display:block;width:100%;height:auto;}
.accx2-image-note{
    position:absolute;
    left:14px;
    right:14px;
    bottom:-10px;
    padding:10px 12px;
    border:1px solid rgba(220,232,246,.95);
    border-radius:9px;
    background:rgba(255,255,255,.95);
    box-shadow:0 6px 18px rgba(0,0,0,.08);
}
.accx2-image-note strong{
    display:block;
    color:var(--acc2-blue);
    font-size:13px;
    line-height:1.3;
}
.accx2-image-note span{
    display:block;
    margin-top:2px;
    color:#627385;
    font-size:11.5px;
    line-height:1.4;
}

/* =========================================================
02 INTENT STRIP
========================================================= */
.accx2-intent-strip{
    padding:12px 0;
    background:#fff;
    border-bottom:1px solid #E6EDF4;
}
.accx2-intent-grid{
    display:grid;
    grid-template-columns:1fr 1fr 1fr auto;
    gap:9px;
    align-items:stretch;
}
.accx2-intent-grid>div{
    padding:10px 12px;
    border:1px solid var(--acc2-border);
    border-radius:8px;
    background:#FBFDFF;
}
.accx2-intent-grid strong,
.accx2-intent-grid span{display:block;}
.accx2-intent-grid strong{
    margin-bottom:2px;
    color:var(--acc2-blue);
    font-size:12px;
}
.accx2-intent-grid span{
    color:#68798A;
    font-size:11px;
    line-height:1.4;
}
.accx2-intent-grid>a{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px 14px;
    border-radius:8px;
    background:var(--acc2-green);
    color:#fff;
    font-size:11.5px;
    font-weight:800;
    text-decoration:none;
    white-space:nowrap;
}
.accx2-intent-grid>a:hover{background:var(--acc2-green-dark);}

/* =========================================================
03 SECTION FRAME
========================================================= */
.accx2-section{padding:42px 0;}
.accx2-section-white{background:#fff;}
.accx2-section-tint{background:#F5F9FD;}
.accx2-section-split{
    background:
        linear-gradient(90deg,#F7FAFD 0%,#F7FAFD 50%,#F2F8F4 50%,#F2F8F4 100%);
}
.accx2-heading{
    max-width:820px;
    margin:0 auto 23px;
    text-align:center;
}
.accx2-heading>span{
    display:inline-block;
    margin-bottom:6px;
    color:var(--acc2-green-dark);
    font-size:10px;
    line-height:1.3;
    font-weight:800;
    letter-spacing:1.1px;
}
.accx2-heading h2{
    margin:0;
    color:var(--acc2-blue);
    font-size:26px;
    line-height:1.23;
    letter-spacing:-.15px;
}
.accx2-heading p{
    max-width:780px;
    margin:7px auto 0;
    color:var(--acc2-muted);
    font-size:14px;
    line-height:1.62;
}

/* =========================================================
04 ROLE MATRIX
========================================================= */
.accx2-role-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.accx2-role-card{
    position:relative;
    min-width:0;
    padding:17px 16px 16px;
    border:1px solid var(--acc2-border);
    border-left:4px solid var(--acc2-blue);
    border-radius:10px;
    background:#fff;
    box-shadow:0 5px 15px rgba(18,60,105,.045);
}
.accx2-role-card.accx2-green{border-left-color:var(--acc2-green);}
.accx2-role-icon{
    width:35px;
    height:35px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:9px;
    border-radius:9px;
    background:#EEF5FD;
    color:var(--acc2-blue);
}
.accx2-role-card.accx2-green .accx2-role-icon{
    background:#EEF8F1;
    color:var(--acc2-green);
}
.accx2-role-card h3{
    margin:0 0 6px;
    color:var(--acc2-ink);
    font-size:15px;
    line-height:1.35;
}
.accx2-role-card p{
    margin:0;
    color:var(--acc2-muted);
    font-size:13px;
    line-height:1.52;
}

/* =========================================================
05 SIX DECISIONS
========================================================= */
.accx2-six-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
}
.accx2-six-grid article{
    min-width:0;
    padding:15px 15px 14px;
    border:1px solid var(--acc2-border);
    border-top:3px solid var(--acc2-blue);
    border-radius:9px;
    background:#fff;
}
.accx2-six-grid article:nth-child(2n){border-top-color:var(--acc2-green);}
.accx2-six-grid b{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:27px;
    height:27px;
    margin-bottom:7px;
    border-radius:7px;
    background:#EEF5FD;
    color:var(--acc2-blue);
    font-size:10px;
}
.accx2-six-grid article:nth-child(2n) b{background:#EEF8F1;color:var(--acc2-green);}
.accx2-six-grid h3{
    margin:0 0 5px;
    color:var(--acc2-ink);
    font-size:14.5px;
    line-height:1.35;
}
.accx2-six-grid p{
    margin:0;
    color:var(--acc2-muted);
    font-size:12.8px;
    line-height:1.52;
}
.accx2-callout{
    display:flex;
    gap:10px;
    align-items:flex-start;
    max-width:980px;
    margin:15px auto 0;
    padding:12px 14px;
    border-left:4px solid var(--acc2-green);
    border-radius:8px;
    background:#F6FBF7;
    color:#5C6D7D;
    font-size:12.8px;
    line-height:1.55;
}
.accx2-callout i{color:var(--acc2-green);font-size:17px;margin-top:1px;}
.accx2-callout strong{color:var(--acc2-blue);}

/* =========================================================
06 TALLY PANEL
========================================================= */
.accx2-tally-panel{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(260px,.45fr);
    gap:16px;
    max-width:1000px;
    margin:0 auto;
    padding:20px;
    border:1px solid var(--acc2-border);
    border-radius:12px;
    background:#fff;
    box-shadow:var(--acc2-shadow);
}
.accx2-tally-title{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin-bottom:12px;
}
.accx2-tally-title span,
.accx2-mini-label{
    color:var(--acc2-green-dark);
    font-size:9.5px;
    line-height:1.3;
    font-weight:800;
    letter-spacing:1px;
}
.accx2-tally-title strong{
    color:var(--acc2-blue);
    font-family:"Poppins",Arial,sans-serif;
    font-size:17px;
    line-height:1.35;
}
.accx2-check-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px 16px;
}
.accx2-check-grid div{
    display:flex;
    gap:7px;
    color:#506477;
    font-size:13px;
    line-height:1.45;
}
.accx2-check-grid i{flex:0 0 auto;color:var(--acc2-green);margin-top:3px;}
.accx2-tally-tip{
    padding:15px;
    border-left:4px solid var(--acc2-green);
    border-radius:8px;
    background:#F3FAF5;
}
.accx2-tally-tip>span{
    color:var(--acc2-green-dark);
    font-size:9.5px;
    font-weight:800;
    letter-spacing:1px;
}
.accx2-tally-tip h3{
    margin:6px 0 6px;
    color:var(--acc2-blue);
    font-size:16px;
    line-height:1.35;
}
.accx2-tally-tip p{
    margin:0;
    color:#657585;
    font-size:12.8px;
    line-height:1.55;
}

/* =========================================================
07 BANGALORE MARKET GRID
========================================================= */
.accx2-market-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    max-width:1030px;
    margin:0 auto;
}
.accx2-market-card{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:11px;
    min-width:0;
    padding:17px;
    border:1px solid #DCE7E1;
    border-radius:10px;
    background:#fff;
    box-shadow:0 5px 15px rgba(18,60,105,.04);
}
.accx2-market-card.accx2-salary{background:#fff;}
.accx2-market-icon{
    width:39px;
    height:39px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#EEF5FD;
    color:var(--acc2-blue);
}
.accx2-market-icon.green{background:#EEF8F1;color:var(--acc2-green);}
.accx2-market-icon.blue{background:#EEF5FD;color:var(--acc2-blue);}
.accx2-market-card h3{
    margin:4px 0 6px;
    color:var(--acc2-ink);
    font-size:15px;
    line-height:1.35;
}
.accx2-market-card p{
    margin:0 0 5px;
    color:var(--acc2-muted);
    font-size:12.8px;
    line-height:1.55;
}
.accx2-market-card p:last-child{margin-bottom:0;}
.accx2-market-card strong{color:#405A70;}
.accx2-market-card small{
    display:block;
    color:#7A8794;
    font-size:10.5px;
    line-height:1.45;
}
.accx2-small{font-size:11.5px!important;}

/* =========================================================
08 PROCESS
========================================================= */
.accx2-process{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:9px;
}
.accx2-process-step{
    min-width:0;
    padding:15px 13px;
    border:1px solid var(--acc2-border);
    border-top:3px solid var(--acc2-blue);
    border-radius:9px;
    background:#fff;
}
.accx2-process-step:nth-child(2n){border-top-color:var(--acc2-green);}
.accx2-process-step b{
    display:block;
    margin-bottom:7px;
    color:#8AA0B4;
    font-size:10px;
    letter-spacing:.5px;
}
.accx2-process-step h3{
    margin:0 0 5px;
    color:var(--acc2-blue);
    font-size:14px;
    line-height:1.3;
}
.accx2-process-step p{
    margin:0;
    color:var(--acc2-muted);
    font-size:11.8px;
    line-height:1.48;
}

/* =========================================================
09 EVALUATION
========================================================= */
.accx2-evaluation{
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);
    gap:15px;
    max-width:1000px;
    margin:0 auto;
    padding:18px;
    border:1px solid var(--acc2-border);
    border-radius:12px;
    background:#fff;
    box-shadow:var(--acc2-shadow);
}
.accx2-evaluation-main{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 18px;
}
.accx2-eval-row{
    display:grid;
    grid-template-columns:27px minmax(0,1fr);
    gap:8px;
    padding:9px 0;
    border-bottom:1px solid #EDF2F6;
}
.accx2-eval-row:nth-last-child(-n+2){border-bottom:0;}
.accx2-eval-row>span{
    display:flex;
    align-items:center;
    justify-content:center;
    width:25px;
    height:25px;
    border-radius:7px;
    background:#EEF5FD;
    color:var(--acc2-blue);
    font-size:9px;
    font-weight:800;
}
.accx2-eval-row strong{
    display:block;
    margin-bottom:2px;
    color:var(--acc2-ink);
    font-size:13.5px;
    line-height:1.35;
}
.accx2-eval-row p{
    margin:0;
    color:var(--acc2-muted);
    font-size:11.8px;
    line-height:1.45;
}
.accx2-evaluation-side{
    align-self:stretch;
    padding:17px;
    border-radius:9px;
    background:linear-gradient(160deg,#EEF5FD,#F4FAF6);
}
.accx2-evaluation-side>i{
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin-bottom:10px;
    border-radius:9px;
    background:#fff;
    color:var(--acc2-green);
}
.accx2-evaluation-side>span{
    color:var(--acc2-green-dark);
    font-size:9.5px;
    font-weight:800;
    letter-spacing:1px;
}
.accx2-evaluation-side h3{
    margin:5px 0 6px;
    color:var(--acc2-blue);
    font-size:17px;
    line-height:1.35;
}
.accx2-evaluation-side p{
    margin:0;
    color:#647585;
    font-size:12.5px;
    line-height:1.55;
}

/* =========================================================
10 BLUE GUIDE BRIDGE
========================================================= */
.accx2-section-blue{
    padding:31px 0;
    background:linear-gradient(135deg,#0B4F9C,#083C76);
}
.accx2-heading-light{margin-bottom:0;}
.accx2-heading-light>span{color:#B9E6C6;}
.accx2-heading-light h2{color:#fff;}
.accx2-heading-light p{color:#DCEBFA;}
.accx2-light-link{
    display:inline-flex;
    margin-top:11px;
    padding:8px 12px;
    border:1px solid rgba(255,255,255,.32);
    border-radius:7px;
    color:#fff;
    font-size:12px;
    font-weight:800;
    text-decoration:none;
}
.accx2-light-link:hover{background:rgba(255,255,255,.1);}

/* =========================================================
11 FAQ
========================================================= */
.accx2-faq-section{background:#F5F9FD;}
.accx2-faq-list{
    max-width:930px;
    margin:0 auto;
}
.accx2-faq-list details{
    margin-bottom:7px;
    border:1px solid var(--acc2-border);
    border-radius:8px;
    background:#fff;
}
.accx2-faq-list summary{
    position:relative;
    padding:12px 38px 12px 14px;
    color:var(--acc2-blue);
    font-family:"Poppins",Arial,sans-serif;
    font-size:13px;
    line-height:1.4;
    font-weight:700;
    cursor:pointer;
    list-style:none;
}
.accx2-faq-list summary::-webkit-details-marker{display:none;}
.accx2-faq-list summary::after{
    content:"+";
    position:absolute;
    right:14px;
    top:10px;
    color:var(--acc2-green);
    font-size:16px;
    line-height:1;
}
.accx2-faq-list details[open] summary::after{content:"−";}
.accx2-faq-list details p{
    margin:0;
    padding:0 14px 13px;
    color:var(--acc2-muted);
    font-size:12.8px;
    line-height:1.58;
}

/* =========================================================
12 RELATED RESOURCES
========================================================= */
.accx2-related{background:#fff;}
.accx2-related .accx2-heading{margin-bottom:18px;}
.accx2-related-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}
.accx2-related-grid a{
    display:flex;
    flex-direction:column;
    min-width:0;
    min-height:115px;
    padding:14px;
    border:1px solid var(--acc2-border);
    border-top:3px solid var(--acc2-blue);
    border-radius:9px;
    background:#fff;
    text-decoration:none;
    box-shadow:0 4px 12px rgba(18,60,105,.035);
}
.accx2-related-grid a:nth-child(2n){border-top-color:var(--acc2-green);}
.accx2-related-grid span{
    margin-bottom:5px;
    color:var(--acc2-green-dark);
    font-size:9.5px;
    font-weight:800;
    letter-spacing:.8px;
    text-transform:uppercase;
}
.accx2-related-grid strong{
    color:var(--acc2-blue);
    font-family:"Poppins",Arial,sans-serif;
    font-size:14px;
    line-height:1.35;
}
.accx2-related-grid small{
    margin-top:auto;
    padding-top:8px;
    color:#697A8A;
    font-size:11px;
    line-height:1.35;
}
.accx2-related-grid a:hover{border-color:#BDD2E5;transform:translateY(-1px);}

/* =========================================================
13 FINAL COMMERCIAL CTA
========================================================= */
.accx2-final-cta{
    padding:32px 0 35px;
    background:linear-gradient(135deg,#0A468F,#0B4F9C);
    text-align:center;
}
.accx2-final-cta>div>span{
    color:#BFE7C9;
    font-size:10px;
    font-weight:800;
    letter-spacing:1.1px;
}
.accx2-final-cta h2{
    margin:5px 0 6px;
    color:#fff;
    font-size:27px;
    line-height:1.22;
}
.accx2-final-cta p{
    max-width:760px;
    margin:0 auto 14px;
    color:#E5F0FB;
    font-size:13.5px;
    line-height:1.58;
}
.accx2-final-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
}
.accx2-final-actions .btn{min-height:40px;padding:9px 17px;font-size:13px;}
.accx2-call{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#fff;
    font-size:12.5px;
    font-weight:800;
    text-decoration:none;
}
.accx2-call:hover{text-decoration:underline;text-underline-offset:3px;}

/* =========================================================
14 RESPONSIVE
========================================================= */
@media(max-width:1050px){
    .accx2-hero-grid{grid-template-columns:minmax(0,1fr) 350px;gap:30px;}
    .accx2-process{grid-template-columns:repeat(3,minmax(0,1fr));}
    .accx2-related-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:850px){
    .accx2-hero-grid{grid-template-columns:1fr;}
    .accx2-hero-visual{justify-content:flex-start;}
    .accx2-image-frame{max-width:420px;}
    .accx2-role-grid{grid-template-columns:1fr 1fr;}
    .accx2-six-grid{grid-template-columns:1fr 1fr;}
    .accx2-tally-panel,
    .accx2-evaluation{grid-template-columns:1fr;}
    .accx2-section-split{background:#F5F9FD;}
}
@media(max-width:650px){
    .accounts-commercial-page .container{width:calc(100% - 28px);}
    .accx2-hero{padding:28px 0 27px;}
    .accx2-hero h1{font-size:31px;line-height:1.15;}
    .accx2-hero-lead{font-size:15px;}
    .accx2-hero-text{font-size:13.8px;}
    .accx2-hero-actions{align-items:stretch;}
    .accx2-hero-actions .btn{width:100%;}
    .accx2-text-link{width:100%;text-align:center;}
    .accx2-intent-grid{grid-template-columns:1fr;}
    .accx2-intent-grid>a{min-height:40px;}
    .accx2-section{padding:33px 0;}
    .accx2-heading{margin-bottom:18px;}
    .accx2-heading h2{font-size:22px;}
    .accx2-heading p{font-size:13.2px;}
    .accx2-role-grid,
    .accx2-six-grid,
    .accx2-market-grid,
    .accx2-process,
    .accx2-related-grid{grid-template-columns:1fr;}
    .accx2-role-card{padding:14px;}
    .accx2-tally-panel,
    .accx2-evaluation{padding:14px;}
    .accx2-check-grid{grid-template-columns:1fr;}
    .accx2-evaluation-main{grid-template-columns:1fr;}
    .accx2-eval-row:nth-last-child(-n+2){border-bottom:1px solid #EDF2F6;}
    .accx2-eval-row:last-child{border-bottom:0;}
    .accx2-market-card{grid-template-columns:37px minmax(0,1fr);padding:14px;}
    .accx2-final-cta h2{font-size:23px;}
    .accx2-final-actions .btn{width:100%;}
}

@media(prefers-reduced-motion:reduce){
    .accx2-related-grid a{transform:none!important;}
}
