@font-face{font-family:'Noto Serif Bengali';src:url(fonts/noto-serif-bengali.woff2) format("woff2")}
*{margin:0;padding:0;box-sizing:border-box;font-family:'Noto Serif Bengali',sans-serif}
body{background-color:#fff5d8;color:#4d2600}
header{background-color:#8b0000;text-align:center}
header img{max-width:250px;margin:5px 0}
h1{color:#6c2f15;font-size:1.6rem;margin:10px 0;line-height:90%}
h2{color:#8b0000;text-align:center;font-size:24px}
h3{color:#8b0000;text-align:center;font-size:20px}
ul{list-style-type:"🌺 ";padding-left:30px;padding-right:10px;font-size: 18px; font-weight: 500;}
li{padding-bottom: 10px;}
p{padding:10px; font-size: 18px; font-weight: 500;} .post-title{font-size: 25px; text-align: center; margin-top: 10px;line-height: 1.1;} 
.content-p{padding:10px;margin-bottom:normal}
.drawer-menu{position:fixed;top:0;left:0;height:100%;width:300px;background-color:#f9db63;transform:translateX(-100%);transition:transform .3s ease;padding:20px;z-index:1000;overflow-y:auto}
.drawer-menu.open{transform:translateX(0)}
.drawer-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;background-color:#4b2e2e;padding:15px;border-radius:8px}
.drawer-header img{width:90%;height:55px}
.close-drawer{cursor:pointer;color:#fff;font-size:24px}
.drawer-menu a{display:flex;align-items:center;padding:10px;color:#8b0408;text-decoration:none;margin:10px 0;border-radius:5px;transition:background-color .3s;background-color:#f3a855;position:relative;font-size:16px}
.drawer-menu a:hover{color:#fff;background-color:#4b2e2e} .drawer-headline{color: #8b0408; text-align: center;}
.drawer-menu a img{width:20px;height:20px;margin-right:10px}
.burger{position:absolute;top:20px;left:20px;cursor:pointer}
.burger div{width:30px;height:4px;background-color:#f9db63;margin:5px 0}
.content{padding:20px;max-width:900px;margin:0 auto;padding:0}
.months-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;padding:20px}
.month{background-color:#ffe298;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,0.1);text-align:center;padding:15px;transition:transform .3s ease-in-out}
.month:hover{transform:scale(1.05)}
.month a{text-decoration:none;color:inherit;display:block}
.month h2{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:1.4rem;color:#8b0000}
.month img{width:60px;height:60px;object-fit:contain;margin-bottom:10px;transition:transform .3s ease-in-out}
.month img:hover{transform:rotate(10deg) scale(1.1)}
@media (max-width: 768px) {
.months-grid{grid-template-columns:repeat(2,1fr)}
.month img{width:50px;height:50px}
.month h2{font-size:1rem}
}
footer{background-color:#4b2e2e;color:#fff;text-align:center;padding:10px;margin-top:20px;display:flex;flex-direction:column}
footer a{text-decoration:none;color:#fcd674 !important;} footer p{padding:10px; font-size: 16px;}
.footer-section{margin:10px 0}
.drawer-menu::-webkit-scrollbar{display:none}
@media (max-width: 768px) {
.burger{display:block}
.drawer-menu{width:100%}
.month{flex:1 1 100%}
h3{font-size:18px}
}
.special-content{text-align:center;margin:20px 0;padding:10px;background-color:#fffaf0;border-radius:10px;box-shadow:0 0 10px rgba(0,0,0,0.1)}
.cards-section{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
.card{width:260px;min-width:260px;max-width:100%;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,0.1);overflow:hidden;margin:10px;text-align:center}
.card p{line-height:1}
.card:hover{transform:scale(1.05)}
.card-title{background-color:#8b0000;color:#fff;padding:5px;text-align:center;font-size:1.4rem;font-weight:700}
.card-content{padding:10px;color:#4d2600;text-align:center;font-size:26px;line-height:1.6;flex-grow:1}
.card-footer{background-color:#fcd674;color:#4b2e2e;text-align:center;padding:5px;font-weight:700}
@media (max-width: 768px) {
.card{flex:1 1 100%}
.card-content p{line-height:.4;font-size:20px}
.card-footer p{line-height:.9}
}
section{width:100%;margin:20px auto;padding:10px;border-radius:10px;box-shadow:0 4px 8px rgba(0,0,0,0.1);background-color:#ffeeb9}
.info-box{text-align:center;padding:10px}
.info-box p{line-height:1.8;font-size:1rem;font-weight:500;text-align:justify;color:#4d2600;padding:10px 15px;margin-bottom:10px;background-color:#fffaf0;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.muhurat-grid{display:grid;grid-template-columns:repeat(1,1fr);grid-auto-rows:auto;gap:15px}
.muhurat-item{background-color:#ffe298;padding:10px;text-align:center;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.rashifal-cards{display:flex;justify-content:space-around;gap:10px;flex-wrap:wrap}
.rashifal-card{width:45%;background-color:#ffe298;padding:15px;border-radius:8px;text-align:center}
.rashifal-card img{width:50px;height:50px;margin-bottom:10px}
.festival-list{display:flex;flex-direction:column;align-items:center;gap:10px;padding:0;list-style:none}
.festival-item{display:flex;align-items:center;gap:10px;background-color:#ffe298;padding:10px;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.festival-item img{width:30px;height:30px}
@media (max-width: 768px) {
section{width:95%}
.rashifal-card{width:100%}
}
@media (max-width: 768px) {
.muhurat-grid{grid-template-columns:1fr}
.muhurat-item{width:100%}
}
@media (min-width: 1024px) {
.muhurat-grid{display:grid;grid-template-columns:repeat(1,1fr);grid-auto-rows:max-content;grid-auto-flow:dense;gap:15px}
.muhurat-item{background-color:#ffe298;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,0.1);padding:10px;text-align:center;break-inside:avoid}
}
.calendar-container{width:100%;margin:20px auto;border-radius:10px;box-shadow:0 0 10px rgba(0,0,0,0.1);overflow:hidden}
.calendar-header{text-align:center;background-color:#8b0000;color:#fff;padding:10px 0;font-size:1.5rem;border-radius:10px 10px 0 0}
.calendar-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));background-color:#f3a855}
.day{position:relative;background-color:#ffe298;color:#6c2f15;padding:5px;text-align:center;font-weight:700;display:flex;flex-direction:column;justify-content:center;min-height:60px;border:1px solid #f3a855;transition:background-color .3s}
.day a{color:inherit;text-decoration:none;display:flex;flex-direction:column;justify-content:center;height:100%}
.day:hover{background-color:#f3a855}
.day .date{font-size:40px;font-weight:700;padding-top:10px}
.day .label{position:absolute;top:5px;left:5px;font-size:12px;color:#3b3b3b}
.day .right{position:absolute;top:5px;right:5px;font-size:12px;color:#3b3b3b}
.day p{font-size:18px;padding:0;margin:0;line-height:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.day.empty{background-color:#f3a855}
@media (max-width: 768px) {
.calendar-container{width:95%;}
.calendar-grid{grid-template-columns:repeat(auto-fit,minmax(70px,1fr))}
.day{padding:4px;min-height:50px}
.day .date{font-size:30px}
.day .label{font-size:10px}
.day .right{font-size:10px}
.day p{font-size:16px}
}
.calendar-nav{display:flex;justify-content:space-between;} .calendar-title{color: #fff;}
.nav-button{background-color:#8b0408;color:#fff;padding:8px 15px;border-radius:4px;font-size:.7rem;text-decoration:none;font-weight:700;width:15%;text-align:center;transition:background-color .3s ease}
.nav-button:hover{background-color:#c21807}
.nav-button-big{background-color:#8b0408;color:#fff;padding:8px 15px;border-radius:4px;font-size:.7rem;text-decoration:none;font-weight:700;width:15%;text-align:center;transition:background-color .3s ease}
.nav-button-big:hover{background-color:#c21807}
@media (max-width: 768px) {
.calendar-nav{display:flex;justify-content:space-between;gap:10px}
.nav-button{width:20%;padding:5px;margin:5px}
.nav-button-big{width:30%;padding:5px;margin:5px}
}
.table-section{width:100%;margin:5px auto;transition:width .3s ease-in-out}
.responsive-table{width:100%;background-color:#fffaf0}
table{width:100%;border-collapse:collapse;font-family:'Arial',sans-serif;background-color:#fff}
td{padding:15px;border:1px solid #8b0000;font-size:18px;color:#4b2e2e;line-height:1.5;word-break:break-word}
tr:nth-child(even){background-color:#ffe298}
tr:nth-child(odd){background-color:#fcd674}
strong{color:#8b0000}
.text-center{text-align: center;}
@media (max-width: 768px) {
.table-section{width:100%}
td{font-size:18px;padding:10px}
}
@media (max-width: 480px) {
td{font-size:17px;padding:8px}
}
@media (max-width: 768px) {
h1{font-size:1.4rem;line-height:normal}
}
@media (max-width: 480px) {
h1{font-size:1.4rem;line-height:normal}
}

/* Main Section Styling */
.festival-date-section {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
    background-color: #a02c00; /* Reddish background */
    text-align: center;
}

.festival-box {
    flex: 1 1 350px;
    max-width: 400px;
    padding: 20px;
    border-radius: 10px;
    box-sizing: border-box;
    border: 2px solid #fff;
    box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

/* Left Box Styling */
.left-box {
    background-color: #229954;
    color: #fff;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.left-box h2 {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.left-box .date {
    font-size: 2.5rem;
    font-weight: bold;
    color: #fff;
}

.left-box .large-number {
    font-size: 4rem;
    font-weight: bold;
}

.left-box .month-year {
    font-size: 1.5rem;
    color: #fff;
}

.left-box .day {
    font-size: 1.2rem;
    font-weight: bold;
    background-color: rgba(245, 176, 65, 0.6);
    padding: 10px;
    border-radius: 8px;
}

/* Right Box Image Styling */
.right-box {
    background-color: #fff;
    padding: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.right-box img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    object-fit: cover;
    border: 2px solid #fff;
}

/* Title Above Boxes (like the image) */
.festival-date-section::before {
    text-align: center;
    font-size: 1.2rem;
    color: #fff;
    width: 100%;
    padding-bottom: 10px;
}

.right-box::before {
    text-align: center;
    font-size: 1.2rem;
    color: #fff;
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
    .festival-date-section {
        padding: 15px;
    }

    .festival-box {
        width: 100%;
    }

    .left-box {
        height: auto;
    }

    .right-box {
        height: auto;
    }

    .left-box .large-number {
        font-size: 3rem;
    }
    .post-title{font-size: 20px; text-align: center; margin-top: 10px;line-height: 1.1;}
}