*{

margin:0;
padding:0;
box-sizing:border-box;

}

body{

background:#F7F3F0;

font-family:Georgia,serif;

color:#663760;

line-height:2;

overflow-x:hidden;

padding:0;

margin:0;

}

/* NAV */

header{

position:sticky;

top:0;

background:rgba(247,243,240,.95);

backdrop-filter:blur(10px);

padding:18px 50px;

display:flex;

justify-content:space-between;

align-items:center;

border-bottom:1px solid #E7DED8;

z-index:999;

}

.logo{

font-size:1.3rem;

letter-spacing:2px;

color:#663760;

font-weight:300;

}

nav a{

margin-left:28px;

text-decoration:none;

letter-spacing:2px;

font-size:.85rem;

color:#762254ce;

}

nav a:hover{

opacity:.6;

}

/* BLOG CONTENT */

.blog-post{

max-width:850px;

margin:auto;

padding:

100px 35px;

}

.blog-post h1{

font-size:3rem;

font-weight:300;

margin-bottom:40px;

color:#792253;

line-height:1.2;

}

.blog-post p{

font-size:1.1rem;

margin-bottom:24px;

color:#663760;

}

.quote-box{

background:white;

padding:35px;

border-left:

4px solid #a76a8fa8;

margin:

45px 0;

font-style:italic;

color:#7e2960;

box-shadow:

0 6px 20px

rgba(0,0,0,.04);

}

.highlight{

font-weight:600;

color:#7e2764;

}

.final-line{

font-size:1.3rem;

margin-top:45px;

color:#741d57;

font-style:italic;

}

/* FOOTER */

footer{

padding:

80px 25px;

text-align:center;

border-top:

1px solid #E7DED8;

margin-top:80px;

color:#812253;

letter-spacing:2px;

}

/* MOBILE */

@media(max-width:768px){

.blog-post{

padding:

70px 28px;

}

.blog-post h1{

font-size:2.2rem;

}

header{

padding:18px;

flex-direction:column;

gap:10px;

}

nav a{

margin:0 8px;

}

}