
:root{
 --green:#234b2a;--gold:#d8b85d;--cream:#f7f5ef;--dark:#193622;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Georgia,serif;background:var(--cream);color:#333}
header{position:absolute;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:flex-start;padding:20px 50px;z-index:10}
nav a{color:#fff;text-decoration:none;margin-right:20px;font:700 15px Arial,sans-serif}
nav a:hover{color:var(--gold)}
.logo{width:180px}
.hero{min-height:100vh;background:linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.55)),url('images/sunrise-cross.png.jpg') center/cover no-repeat}
.hero-content{max-width:760px;padding:220px 70px;color:#fff}
.eyebrow,.tag{color:var(--gold);text-transform:uppercase;letter-spacing:3px;font:700 14px Arial,sans-serif}
.photo-card img{
    width:100%;
    height:100%;
    object-fit:contain;
    background:white;
}
h1{font-size:64px;margin:18px 0} h2{font-size:42px;color:var(--green);margin:15px 0 25px}
p{line-height:1.8}
.btn{display:inline-block;padding:14px 28px;border-radius:40px;text-decoration:none;font:700 16px Arial,sans-serif;margin:20px 10px 0 0}
.primary{background:var(--green);color:#fff}.secondary{background:var(--gold);color:#222}
.wrap{max-width:1200px;margin:auto;padding:80px 50px}
.two{display:grid;grid-template-columns:2fr 1fr;gap:50px}
.photo-card img{
    width:100%;
    height:100%;
    object-fit:contain;
    background:white;
}

footer{
    background:#193622;
}

/* ---------- Photo Cards ---------- */

.photo-card{
    width:100%;
    height:320px;
    overflow:hidden;
    border-radius:20px;
}

.photo-card img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* ---------- Mobile ---------- */

@media (max-width: 768px) {

    html, body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .site-header {
        position: relative;
        width: 100%;
        background: rgba(0,0,0,.78);
        padding: 10px 0 12px;
    }

    .header-inner {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .logo-link {
        left: 0;
        top: 0;
        margin-bottom: 5px;
    }

    .logo-link img {
        height: 65px;
        width: auto;
    }

    nav {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px 10px;
        padding: 8px 10px 4px;
        box-sizing: border-box;
    }

    nav a {
        margin: 0;
        font-size: 14px;
        line-height: 1.2;
        white-space: nowrap;
    }

    .hero {
        min-height: auto;
        background-position: center center;
        background-size: cover;
    }

    .hero-content {
        width: 100%;
        max-width: none;
        box-sizing: border-box;
        padding: 45px 22px 55px;
    }

    .hero h1 {
        font-size: 42px;
        line-height: 1.05;
        margin-bottom: 18px;
    }

    .hero p {
        font-size: 17px;
        line-height: 1.55;
    }

    .hero .eyebrow {
        font-size: 13px;
    }

    .hero-actions {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 10px;
    }

    .hero-actions .btn {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    .hero-highlights {
        padding-left: 20px;
        margin-top: 25px;
    }

    .hero-highlights li {
        margin-bottom: 8px;
        line-height: 1.4;
    }
}