:root{

--bg:#f5f7fb;
--card:#ffffff;

--accent1:#5a7cff;
--accent2:#7da6ff;

--text:#1f2937;
--sub:#6b7280;

--border:#e5e7eb;

--shadow:0 12px 30px rgba(0,0,0,0.08);

}

/* GLOBAL */

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

body{
font-family:'Inter', sans-serif;
background:linear-gradient(180deg,#f9fbff,#f1f4fb);
color:var(--text);
}

/* NAVBAR (FIXED TOP) */

nav{

position:fixed;

top:0;
left:0;

width:100%;

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

padding:20px 40px;

background:rgba(255,255,255,0.9);
backdrop-filter:blur(10px);

border-bottom:1px solid var(--border);

z-index:1000;

}

/* TITLE */

nav h1{

font-size:26px;
letter-spacing:.5px;
/*font-family: 'Cardo', serif;*/
font-family:'Cinzel Decorative', serif;
/*font-family: 'Great Vibes', cursive;*/


font-weight:500;
background:white;
color: black;

padding:6px 14px;
border-radius:6px;

}

/* NAV LINK */

nav a{

text-decoration:none;
font-weight:500;

background:var(--accent1);
color:white;

padding:8px 14px;
border-radius:8px;

transition:.25s;

}

nav a:hover{

background:var(--accent2);
transform:translateY(-1px);

}

/* MAIN CONTENT */

main{

max-width:900px;

margin:auto;

padding:120px 20px 140px 20px;

width:100%;

}

/* TITLE */

.section-title{

font-size:24px;
margin-bottom:30px;
color: gray;

}

/* BLOG CARDS */

.blog{

background:var(--card);

padding:26px;

border-radius:14px;

border:1px solid var(--border);

margin-bottom:22px;

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

cursor:pointer;

transition:.35s;

box-shadow:0 4px 10px rgba(0,0,0,0.02);

}

.blog:hover{

transform:translateY(-4px) scale(1.01);

box-shadow:var(--shadow);

border-color:#d9e0ff;

}

.blog-title{

font-size:19px;
font-weight:500px;

}

.blog-date{

font-size:14px;
color:var(--sub);

}

/* ARTICLE PAGE */

.container{

max-width:760px;
margin:auto;

padding:120px 20px 140px 20px;

}

article{

user-select:none;

}

.title{

font-size:31px;
margin-bottom:12px;
/*font-family: 'Source Serif 4', serif;*/
/*font-family:'Cinzel Decorative', serif;*/
/*font-family: 'Cardo', serif;*/
/*font-family:'Playfair Display', serif; font-weight:400;*/
/*font-family:'Noto Serif', serif; font-weight:400;*/
/*font-family: 'Cardo', serif;*/
/*font-family:'Inter', sans-serif;*/
/*font-style: bold;*/
/*font-family: 'Merriweather', serif;*/
font-family: 'Jost', sans-serif;



}

.date{

color:var(--sub);
margin-bottom:28px;

}

.content{

font-size:19px;
line-height:1.9;
/*font-family: 'Source Serif 4', serif;*/

}

/* PERSONAL NOTE */

.note{

margin-top:50px;

padding:22px;

background:linear-gradient(135deg,#eef2ff,#f6f8ff);

border-left:5px solid var(--accent1);

border-radius:8px;

font-size:15px;

}

/* FOOTER (FIXED BOTTOM) */

footer{

position:fixed;

bottom:0;
left:0;

width:100%;

border-top:1px solid var(--border);

background:white;

padding:18px 20px;

text-align:center;

z-index:1000;

}

/* FOOTER TEXT */

footer p{

margin-bottom:12px;
color:var(--sub);

}

/* INPUT */

footer input{

padding:12px;

border:1px solid var(--border);

border-radius:8px;

margin-right:10px;

width:230px;

transition:.2s;

}

footer input:focus{

outline:none;

border-color:var(--accent1);

box-shadow:0 0 0 3px rgba(90,124,255,0.15);

}

/* BUTTON */

button{

padding:12px 20px;

border:none;

border-radius:9px;

background:linear-gradient(135deg,var(--accent1),var(--accent2));

color:white;

font-weight:500;

cursor:pointer;

transition:.3s;

}

button:hover{

transform:translateY(-2px);

box-shadow:0 10px 20px rgba(90,124,255,0.35);

}

/* ABOUT PAGE */

.author-img{

width:190px;
height:190px;

border-radius:50%;

object-fit:cover;

border:5px solid white;

box-shadow:var(--shadow);

margin-bottom:28px;

}

.bio{
max-width: 900px;   /* limits text width */
margin: 40px auto;  /* centers it horizontally */
text-align: justify;   /* better for reading paragraphs */
line-height: 1.7;   /* improves readability */
font-size: 20px;
/*font-style: italic;*/
/*font-family: 'Source Serif 4', serif;*/
}