body{
    font-family:'EB Garamond', serif;
    background:#0f1419;
    color:#e6e2d9;
}

/* Headings */

h1,h2,h3{
    font-family:'Cinzel', serif;
    color:#f0eadc;
}

/* Script tagline */

.cursive{
    font-family:'Herr Von Muellerhoff', cursive;
    letter-spacing:0.13em;
}


.hero{
    background-image:url("img/screenshot3.png");
    background-size:cover;
    background-position:center;
    color:white;
    text-align:center;

    position:relative;
    padding:140px 0;
}

.hero-overlay{
    background:rgba(0,0,0,0.55);

    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    padding:60px;
}


/* Section layout */

.section{
    padding:80px 0;
}

/* Optional alternating sections */

.section:nth-child(even){
    background:#2c3136;
}


/* Images */

.screenshot{
    border-radius:8px;
    box-shadow:0 6px 25px rgba(0,0,0,0.6);
}

.video-frame{
    border-radius:8px;
    overflow:hidden;
    box-shadow:0 6px 25px rgba(0,0,0,0.6);
}


/* Feature icons */

.feature-icon{
    font-size:2rem;
}


/* Cards */

.card{
    background:#29313a;
    color:#e6e2d9;
    border:none;
    box-shadow:0 6px 25px rgba(0,0,0,0.5);
}

.blog-card{
    border:none;
    box-shadow:0 6px 25px rgba(0,0,0,0.5);
}


/* Companion cards */

.companion-card img{
    border-radius:6px;
}

.companion-card .badge{
    margin:2px;
    font-size:0.75rem;
    letter-spacing:0.03em;
    background:#2b3640;
}


/* Portrait frame */

.companion-card .portrait-frame{
    height:320px;
    background:#0a0f14;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px;
}

/* Portrait image behavior */

.companion-card .portrait-frame img{
    height:100%;
    width:auto;
    max-width:100%;
    object-fit:contain;
    border-radius:6px;
}

.portrait-frame{
    border-bottom:3px solid #2b3640;
}


/* Navbar */

.navbar-brand{
    font-family:'Cinzel', serif;
}


/* Tagline */

.tagline{
    font-size:2rem;
}


/* Footer */

footer{
    background:#080c10;
    color:#bfc7cf;
    padding:40px;
}

footer a{
    color:#bfc7cf;
}


/* Contact cards */

#contact .card{
    border:none;
    box-shadow:0 6px 25px rgba(0,0,0,0.5);
}

.material-icons{
vertical-align:middle;
margin-right:6px;
}

.feature-icon .material-icons{
font-size:40px;
}

.material-symbols-outlined{
font-size:40px;
vertical-align:middle;
margin-right:6px;
}