/*==========================================================
                PDS JHARKHAND 2026
                HOME PAGE CSS - PART 1
==========================================================*/

/*************
    RESET
**************/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Noto Sans',sans-serif;
    background:#f4f7fb;
    color:#343434;
    line-height:1.7;
}

img{
    max-width:100%;
    height:auto;
    display:block;
}

a{
    text-decoration:none;
    transition:.3s;
}

/**********************
    FULL WIDTH
**********************/

.container,
.container-fluid{

    width:100%;
    max-width:100%;

}

section{

    width:100%;
    padding:20px 0;

}

.aahar-wrap{

    width:100%;
    max-width:100%;
    margin:0;
    padding:0;

}

/**********************
        HERO
**********************/

.aahar-wrap{

background:linear-gradient(135deg,#0d6b46,#179b54);

position:relative;

overflow:hidden;

padding:80px 30px;

color:#fff;

text-align:center;

margin-bottom:50px;

}

.aahar-wrap::before{

content:"";

position:absolute;

width:350px;

height:350px;

background:rgba(255,255,255,.08);

right:-120px;

top:-100px;

border-radius:50%;

}

.aahar-wrap::after{

content:"";

position:absolute;

width:280px;

height:280px;

background:rgba(255,255,255,.07);

left:-80px;

bottom:-120px;

border-radius:50%;

}

.aahar-title{

font-size:42px;

font-weight:800;

margin-bottom:18px;

position:relative;

z-index:2;

}

.aahar-intro{

max-width:950px;

margin:auto;

font-size:18px;

line-height:1.9;

color:#f8f8f8;

position:relative;

z-index:2;

margin-bottom:18px;

}

/**********************
    GREEN NOTICE
**********************/

.hero-update{

max-width:900px;

margin:30px auto;

background:rgba(255,255,255,.15);

backdrop-filter:blur(10px);

padding:20px;

border-radius:12px;

border:1px solid rgba(255,255,255,.25);

position:relative;

z-index:2;

}

.hero-update strong{

display:block;

font-size:20px;

margin-bottom:10px;

}

/**********************
    BUTTON GRID
**********************/

.aahar-actions{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(240px,1fr));

gap:18px;

margin-top:35px;

position:relative;

z-index:2;

}

.aahar-btn{

display:flex;

justify-content:center;

align-items:center;

padding:16px;

background:#fff;

color:#0b6b45;

font-weight:700;

border-radius:12px;

font-size:16px;

box-shadow:0 12px 25px rgba(0,0,0,.15);

}

.aahar-btn:hover{

background:#ffc107;

color:#222;

transform:translateY(-5px);

box-shadow:0 18px 30px rgba(0,0,0,.18);

}

/**********************
SECTION TITLE
**********************/

.section-title{

text-align:center;

font-size:34px;

font-weight:800;

margin-bottom:18px;

color:#0d6b46;

}

.section-desc{

text-align:center;

max-width:850px;

margin:auto;

color:#666;

margin-bottom:40px;

}

/**********************
COMMON CARD
**********************/

.card-box{

background:#fff;

padding:25px;

border-radius:16px;

box-shadow:0 8px 25px rgba(0,0,0,.08);

transition:.3s;

}

.card-box:hover{

transform:translateY(-6px);

box-shadow:0 12px 30px rgba(0,0,0,.12);

}

/**********************
IMPORTANT BOX
**********************/

.important-box{

background:#fff8e5;

padding:22px;

border-left:5px solid #ffb400;

border-radius:10px;

margin:35px 0;

}

.important-box h3{

margin-bottom:12px;

color:#8b5d00;

}

/**********************
LINK BUTTON
**********************/

.btn-green{

display:inline-block;

padding:13px 25px;

background:#16a34a;

color:#fff;

border-radius:8px;

font-weight:700;

}

.btn-green:hover{

background:#0d6b46;

color:#fff;

}

/**********************
MOBILE
**********************/

@media(max-width:991px){

.aahar-wrap{

padding:60px 20px;

}

.aahar-title{

font-size:34px;

}

.aahar-intro{

font-size:16px;

}

}

@media(max-width:768px){

section{

padding:45px 0;

}

.aahar-title{

font-size:28px;

line-height:1.4;

}

.aahar-intro{

font-size:15px;

}

.aahar-actions{

grid-template-columns:1fr;

}

.aahar-btn{

font-size:15px;

padding:15px;

}

.hero-update{

padding:15px;

}

}

@media(max-width:480px){

.aahar-wrap{

padding:45px 15px;

}

.aahar-title{

font-size:24px;

}

}

/*==========================================================
            PDS JHARKHAND CSS
            PART 2
==========================================================*/

/*************************************************
            SECTION HEADING
*************************************************/

.aahar-heading{

font-size:34px;

font-weight:800;

text-align:center;

margin-bottom:15px;

color:#0d6b46;

}

.aahar-heading::after{

content:"";

display:block;

width:90px;

height:4px;

background:#16a34a;

margin:15px auto;

border-radius:20px;

}

/*************************************************
            SERVICES GRID
*************************************************/

.aahar-services{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:22px;

padding:0;

margin:40px 0;

list-style:none;

background:none;

box-shadow:none;

}

.aahar-services li{

background:#fff;

border-radius:14px;

padding:22px;

border:1px solid #e7edf2;

position:relative;

padding-left:65px;

font-size:16px;

font-weight:600;

min-height:82px;

display:flex;

align-items:center;

box-shadow:0 8px 20px rgba(0,0,0,.06);

transition:.35s;

}

.aahar-services li::before{

content:"✓";

position:absolute;

left:20px;

width:30px;

height:30px;

background:#16a34a;

color:#fff;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

font-size:16px;

font-weight:bold;

}

.aahar-services li:hover{

background:#16a34a;

color:#fff;

transform:translateY(-6px);

}

.aahar-services li:hover::before{

background:#fff;

color:#16a34a;

}

/*************************************************
            QUICK LINKS
*************************************************/

.quick-links{

margin:45px 0;

background:#fff;

padding:30px;

border-radius:18px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.quick-links h3{

font-size:26px;

margin-bottom:25px;

text-align:center;

color:#0d6b46;

}

.quick-links a{

display:inline-flex;

align-items:center;

justify-content:center;

margin:10px;

padding:14px 22px;

background:#16a34a;

color:#fff;

border-radius:8px;

font-weight:700;

transition:.3s;

}

.quick-links a:hover{

background:#0b6b45;

transform:translateY(-3px);

}

/*************************************************
        IMPORTANT LINKS
*************************************************/

.important-links{

margin-top:40px;

background:#fff8e5;

padding:30px;

border-left:6px solid #ffb400;

border-radius:15px;

box-shadow:0 8px 18px rgba(0,0,0,.06);

}

.important-links h3{

font-size:24px;

margin-bottom:20px;

color:#8b5d00;

}

.important-links a{

display:block;

padding:15px;

margin-bottom:12px;

background:#fff;

border-radius:10px;

font-weight:600;

color:#333;

transition:.3s;

border-left:4px solid #16a34a;

}

.important-links a:hover{

background:#16a34a;

color:#fff;

padding-left:25px;

}

/*************************************************
        RELATED SERVICES
*************************************************/

.related-services{

margin-top:45px;

background:#fff;

padding:30px;

border-radius:18px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.related-services h3{

text-align:center;

font-size:28px;

margin-bottom:25px;

color:#0d6b46;

}

.related-services a{

display:inline-block;

margin:8px;

padding:14px 22px;

background:#eef8f2;

color:#0d6b46;

border-radius:30px;

font-weight:700;

transition:.3s;

border:1px solid #d8eede;

}

.related-services a:hover{

background:#16a34a;

color:#fff;

}

/*************************************************
        TABLE OF CONTENT
*************************************************/

.aahar-table{

margin-top:45px;

background:#fff;

padding:30px;

border-radius:18px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.aahar-table h3{

font-size:28px;

text-align:center;

margin-bottom:25px;

color:#0d6b46;

}

.aahar-table ul{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:18px;

padding:0;

margin:0;

list-style:none;

}

.aahar-table li{

margin:0;

}

.aahar-table a{

display:flex;

align-items:center;

padding:18px;

background:#f8fafc;

border-radius:12px;

font-weight:700;

color:#333;

border-left:5px solid #16a34a;

transition:.3s;

}

.aahar-table a::before{

content:"📄";

margin-right:12px;

font-size:18px;

}

.aahar-table a:hover{

background:#16a34a;

color:#fff;

padding-left:24px;

}

/*************************************************
        MOBILE
*************************************************/

@media(max-width:991px){

.aahar-services{

grid-template-columns:repeat(2,1fr);

}

.aahar-table ul{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.aahar-services{

grid-template-columns:1fr;

}

.aahar-table ul{

grid-template-columns:1fr;

}

.quick-links{

text-align:center;

}

.quick-links a{

display:block;

margin:10px 0;

}

.related-services{

text-align:center;

}

.related-services a{

display:block;

margin:10px 0;

}

}

/*==========================================================
        PDS JHARKHAND CSS
        PART 3
==========================================================*/

/************************************************
        CONTENT SECTION
************************************************/

.aahar-section{

background:#fff;

padding:50px;

margin:40px 0;

border-radius:20px;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.aahar-section h2{

font-size:32px;

color:#0b6b45;

margin-bottom:25px;

text-align:center;

font-weight:700;

}

.content-box{

margin-bottom:35px;

}

.content-box p{

font-size:16px;

line-height:1.9;

color:#444;

margin-bottom:18px;

text-align:justify;

}

.content-box ul{

padding-left:25px;

}

.content-box li{

margin-bottom:10px;

line-height:1.8;

}

/************************************************
        IMAGE
************************************************/

.aahar-section img{

margin:30px auto;

border-radius:14px;

border:1px solid #dfe8e5;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.35s;

}

.aahar-section img:hover{

transform:scale(1.02);

}

/************************************************
        FAQ
************************************************/

.aahar-faq{

margin:50px 0;

}

.aahar-faq h2{

font-size:32px;

text-align:center;

margin-bottom:30px;

color:#0b6b45;

}

.faq-item{

background:#fff;

border-radius:14px;

padding:22px;

margin-bottom:18px;

box-shadow:0 8px 22px rgba(0,0,0,.07);

transition:.3s;

border-left:5px solid #16a34a;

}

.faq-item:hover{

transform:translateY(-4px);

}

.faq-item h3{

font-size:18px;

margin-bottom:12px;

color:#0b6b45;

}

.faq-item p{

margin:0;

line-height:1.8;

color:#444;

}

/************************************************
        HELPLINE
************************************************/

.aahar-helpline{

background:linear-gradient(135deg,#0b6b45,#179b54);

padding:60px 30px;

border-radius:20px;

text-align:center;

color:#fff;

margin:50px 0;

}

.aahar-helpline-title{

font-size:34px;

margin-bottom:35px;

font-weight:700;

}

.aahar-helpline-box,

.aahar-portal-box{

background:rgba(255,255,255,.12);

padding:30px;

border-radius:15px;

margin-bottom:25px;

backdrop-filter:blur(8px);

}

.aahar-helpline-box h3,

.aahar-portal-box h3{

color:#fff;

margin-bottom:10px;

}

.helpline-number{

font-size:30px;

font-weight:bold;

margin-top:15px;

color:#FFD700;

}

.portal-link{

display:inline-block;

margin-top:15px;

padding:14px 25px;

background:#fff;

color:#0b6b45;

font-weight:700;

border-radius:10px;

}

.portal-link:hover{

background:#FFD700;

color:#222;

}

/************************************************
        BLOG CARDS
************************************************/

.blog-item-box{

background:#fff;

border-radius:18px;

overflow:hidden;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.3s;

margin-bottom:30px;

}

.blog-item-box:hover{

transform:translateY(-6px);

}

.blog-item-box img{

width:100%;

height:220px;

object-fit:cover;

}

.blog-content{

padding:22px;

}

.blog-content h3{

font-size:18px;

margin-bottom:12px;

}

.blog-content h3 a{

color:#0b6b45;

}

.blog-content p{

font-size:15px;

color:#555;

line-height:1.7;

}

.blog-read-btn{

display:inline-block;

margin-top:18px;

padding:12px 22px;

background:#16a34a;

color:#fff;

border-radius:8px;

font-weight:700;

}

.blog-read-btn:hover{

background:#0b6b45;

}

/************************************************
        ANIMATION
************************************************/

.aahar-section,
.faq-item,
.blog-item-box,
.aahar-services li,
.aahar-table a{

transition:.35s ease;

}

/************************************************
        MOBILE
************************************************/

@media(max-width:991px){

.aahar-section{

padding:35px;

}

.aahar-section h2{

font-size:28px;

}

}

@media(max-width:768px){

.aahar-section{

padding:22px;

}

.aahar-section h2{

font-size:24px;

}

.content-box p{

font-size:15px;

text-align:left;

}

.aahar-helpline{

padding:35px 20px;

}

.aahar-helpline-title{

font-size:26px;

}

.helpline-number{

font-size:24px;

}

.blog-item-box img{

height:180px;

}

}

@media(max-width:480px){

.aahar-section{

padding:18px;

border-radius:12px;

}

.aahar-section h2{

font-size:22px;

}

.faq-item{

padding:18px;

}

.portal-link{

width:100%;

}

.blog-read-btn{

width:100%;

text-align:center;

}

}
/*=============================
    Important Notice
==============================*/

.important-notice{
    padding:25px 15px;
}

.notice-box{

    background:#fff;
    border-radius:12px;
    overflow:hidden;

    border:1px solid #e4e4e4;

    box-shadow:0 8px 25px rgba(0,0,0,.08);

}

.notice-header{

    background:#c62828;

    color:#fff;

    text-align:center;

    padding:14px 20px;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:10px;

}

.notice-header h2{

    margin:0;

    font-size:24px;

    font-weight:700;

}

.notice-icon{

    font-size:26px;

}

.notice-body{

    background:#fff8f2;

    padding:20px;

}

.notice-item{

    display:flex;

    gap:18px;

    margin-bottom:18px;

    align-items:flex-start;

    border:1px solid #ffd7d7;

    border-radius:10px;

    background:#fff;

    padding:15px;

}

.notice-badge{

    width:55px;

    min-width:55px;

    height:55px;

    border-radius:50%;

    color:#fff;

    font-weight:bold;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:18px;

}

.notice-badge.danger{

    background:#d32f2f;

}

.notice-badge.warning{

    background:#ff9800;

}

.notice-content{

    flex:1;

}

.notice-content p{

    margin:0;

    font-size:16px;

    line-height:30px;

    color:#333;

}

.notice-success{

    background:#e8f8e8;

    border:1px solid #39b54a;

    color:#188038;

    font-size:17px;

    font-weight:600;

    text-align:center;

    border-radius:8px;

    padding:15px;

}

/*=========================
    Mobile
=========================*/

@media(max-width:768px){

.notice-header h2{

    font-size:20px;

}

.notice-item{

    flex-direction:column;

    text-align:left;

}

.notice-badge{

    width:42px;

    height:42px;

    min-width:42px;

    font-size:16px;

}

.notice-content p{

    font-size:15px;

    line-height:26px;

}

.notice-success{

    font-size:15px;

    line-height:24px;

    text-align:left;

}

}