/*!
Theme Name: InyogNagri
Theme URI: https://inyognagri.com/
Author: Amit Nautiyal
Author URI: https://inyognagri.com/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: inyognagri
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

InyogNagri, (C) 2012-2020 Automattic, Inc.
Distributed under the terms of the GNU GPL v2 or later. 
*/

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

body{

font-family:Arial, Helvetica, sans-serif;
color:#333;
background:#fafafa;
line-height:1.7;

}

.container{

width:90%;
max-width:1200px;
margin:auto;

}

/* Hero */

.hero{

background:linear-gradient(135deg,#2563eb,#1e3a8a);
color:#fff;
padding:120px 0;
text-align:center;

}

.hero h1{

font-size:52px;
margin-bottom:20px;

}

.hero p{

max-width:650px;
margin:auto;
font-size:20px;
opacity:.9;

}

.hero-buttons{

margin-top:40px;

}

.btn{

display:inline-block;
padding:15px 35px;
border-radius:40px;
text-decoration:none;
font-weight:bold;
margin:10px;
transition:.3s;

}

.btn-primary{

background:#fff;
color:#2563eb;

}

.btn-primary:hover{

transform:translateY(-4px);

}

.btn-outline{

border:2px solid #fff;
color:#fff;

}

.btn-outline:hover{

background:#fff;
color:#2563eb;

}

/* Sections */

section{

padding:90px 0;

}

.section-title{

text-align:center;
margin-bottom:60px;

}

.section-title h2{

font-size:40px;
margin-bottom:15px;

}

.service-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;

}

.card{

background:#fff;
padding:40px;
border-radius:15px;
box-shadow:0 15px 40px rgba(0,0,0,.08);
transition:.3s;
text-align:center;

}

.card:hover{

transform:translateY(-10px);

}

.icon{

font-size:60px;
margin-bottom:20px;

}

.feature-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
text-align:center;

}

.feature-grid div{

padding:30px;
background:white;
border-radius:12px;
font-size:18px;
font-weight:600;
box-shadow:0 8px 25px rgba(0,0,0,.08);

}

.latest-posts{

background:#f4f7fb;

}

.post-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
gap:30px;

}

.post-card{

background:white;
border-radius:15px;
overflow:hidden;
box-shadow:0 15px 40px rgba(0,0,0,.08);

}

.post-card img{

width:100%;
height:220px;
object-fit:cover;

}

.post-content{

padding:25px;

}

.post-content h3{

margin-bottom:15px;

}

.readmore{

display:inline-block;
margin-top:20px;
text-decoration:none;
color:#2563eb;
font-weight:bold;

}

.cta{

background:#2563eb;
color:white;
text-align:center;

}

.cta h2{

font-size:42px;
margin-bottom:20px;

}

.cta p{

margin-bottom:35px;
font-size:20px;

}

/* Responsive */

@media(max-width:768px){

.hero{

padding:80px 0;

}

.hero h1{

font-size:36px;

}

.section-title h2{

font-size:32px;

}

.cta h2{

font-size:30px;

}

}

/* Single Post */

.post-hero{

background:#fff;
padding-bottom:50px;

}

.post-image img{

width:100%;
height:500px;
object-fit:cover;
display:block;

}

.post-title{

font-size:48px;
line-height:1.2;
margin-top:30px;

}

.post-meta{

display:flex;
gap:15px;
color:#777;
margin-top:40px;
font-size:14px;

}

.single-post{

padding:70px 0;

}

.post-wrapper{

max-width:900px;
margin:auto;

}

.post-content{

font-size:18px;
line-height:1.9;
color:#444;

}

.post-content h2,
.post-content h3{

margin-top:45px;
margin-bottom:15px;

}

.post-content img{

max-width:100%;
height:auto;
border-radius:10px;
margin:25px 0;

}

.post-content p{

margin-bottom:25px;

}

.post-footer{

margin-top:60px;
padding-top:30px;
border-top:1px solid #eee;

}

.categories,
.tags{

margin-bottom:15px;

}

.author-box{

background:#f7f9fc;
padding:60px 0;

}

.author-wrapper{

max-width:900px;
display:flex;
gap:25px;
align-items:center;
margin:auto;

}

.author-avatar img{

border-radius:50%;

}

.author-info h3{

margin-bottom:10px;

}

.post-navigation{

padding:50px 0;
border-top:1px solid #eee;

}

.nav-wrapper{

display:flex;
justify-content:space-between;
flex-wrap:wrap;
gap:20px;

}

.nav-wrapper a{

text-decoration:none;
font-weight:600;
color:#2563eb;

}

.comments-section{

padding:60px 0;
background:#fafafa;

}

@media(max-width:768px){

.post-image img{

height:250px;

}

.post-title{

font-size:34px;

}

.author-wrapper{

flex-direction:column;
text-align:center;

}

.nav-wrapper{

flex-direction:column;

}

}

/*==========================
 SINGLE POST
==========================*/

.single-post-page{

background:#f5f7fb;

padding:60px 0;

}


.featured-banner{

max-height:550px;

overflow:hidden;

margin-bottom:60px;

}


.featured-banner img{

width:100%;

height:550px;

object-fit:cover;

display:block;

}


.container{

width:90%;

max-width:900px;

margin:auto;

}


.single-post{

background:#fff;

padding:60px;

border-radius:18px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

}


.post-meta{

display:flex;

gap:15px;

font-size:14px;

color:#777;

margin-bottom:20px;

flex-wrap:wrap;

}


.single-post h1{

font-size:48px;

line-height:1.2;

margin-bottom:35px;

color:#1e293b;

}


.post-content{

font-size:19px;

line-height:1.9;

color:#444;

}


.post-content p{

margin-bottom:25px;

}


.post-content h2{

margin:45px 0 20px;

font-size:34px;

}


.post-content h3{

margin:40px 0 15px;

font-size:28px;

}


.post-content ul,
.post-content ol{

padding-left:30px;

margin-bottom:30px;

}


.post-content img{

width:100%;

height:auto;

border-radius:12px;

margin:30px 0;

}


.post-content blockquote{

margin:40px 0;

padding:25px;

border-left:5px solid #2563eb;

background:#eef5ff;

font-style:italic;

border-radius:10px;

}


.post-content a{

color:#2563eb;

text-decoration:none;

}


.post-content a:hover{

text-decoration:underline;

}


.post-tags{

margin-top:45px;

padding-top:25px;

border-top:1px solid #eee;

}


.post-tags a{

display:inline-block;

background:#2563eb;

color:#fff;

padding:8px 15px;

border-radius:25px;

margin:5px;

text-decoration:none;

font-size:14px;

transition:.3s;

}


.post-tags a:hover{

background:#1e40af;

}


.post-nav{

display:flex;

justify-content:space-between;

margin:50px 0;

gap:20px;

}


.post-nav a{

display:block;

background:#fff;

padding:20px 30px;

border-radius:12px;

text-decoration:none;

font-weight:bold;

color:#2563eb;

box-shadow:0 8px 20px rgba(0,0,0,.08);

transition:.3s;

}


.post-nav a:hover{

transform:translateY(-4px);

}


.comments-area{

background:#fff;

padding:40px;

border-radius:18px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

margin-bottom:60px;

}


/*==========================
 Responsive
==========================*/

@media(max-width:768px){

.single-post{

padding:30px;

}

.featured-banner img{

height:260px;

}

.single-post h1{

font-size:34px;

}

.post-content{

font-size:17px;

}

.post-nav{

flex-direction:column;

}

}
/* Header */
.site-header {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
}

.header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 15px 20px;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Navigation */
.main-navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;

    display: flex;
    align-items: center;
    gap: 30px;
}

.main-navigation ul li {
    margin: 0;
    padding: 0;
}

.main-navigation ul li a {
    display: block;
    text-decoration: none;
    color: #222;
    font-size: 16px;
    font-weight: 600;
    padding: 10px 0;
    transition: .3s;
}

.main-navigation ul li a:hover,
.main-navigation .current-menu-item > a {
    color: #2563eb;
}