/*
 * Ornexa Home homepage styling.
 * Designed for Kadence child theme.
 */

.ornexa-home{
    --oh-brown:#a77c50;
    --oh-dark:#181818;
    --oh-cream:#f3eee7;
    --oh-light:#faf9f7;
    --oh-text:#2b2b2b;
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    overflow:hidden;
    background:#fff;
    color:var(--oh-text);
    font-family:Arial,Helvetica,sans-serif;
    line-height:1.5;
}

.ornexa-home *,
.ornexa-home *::before,
.ornexa-home *::after{box-sizing:border-box}

.ornexa-home img{display:block;max-width:100%}
.ornexa-home a{text-decoration:none}

/* HERO */
.oh-hero{
    display:grid;
    grid-template-columns:minmax(0,2fr) minmax(300px,1fr);
    min-height:580px;
    background:#111;
}
.oh-hero__main,
.oh-side-card{
    position:relative;
    overflow:hidden;
}
.oh-hero__main{min-height:580px}
.oh-hero__main>a,
.oh-side-card>a{
    display:block;
    position:relative;
    height:100%;
}
.oh-hero__main img{
    width:100%;
    height:580px;
    object-fit:cover;
}
.oh-hero__main::after,
.oh-side-card::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(to top,rgba(0,0,0,.86),rgba(0,0,0,.04));
}
.oh-hero__overlay{
    position:absolute;
    left:55px;
    right:45px;
    bottom:48px;
    z-index:3;
    color:#fff;
}
.oh-hero__eyebrow,
.oh-side-card__overlay span,
.oh-label{
    display:block;
    margin-bottom:12px;
    color:var(--oh-brown);
    font-size:11px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}
.oh-hero__eyebrow{color:#fff}
.oh-hero__overlay h1{
    max-width:800px;
    margin:0 0 14px;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(34px,4.2vw,62px);
    line-height:1.05;
    font-weight:400;
}
.oh-hero__overlay p{
    max-width:620px;
    margin:0;
    color:rgba(255,255,255,.9);
    font-size:15px;
    line-height:1.7;
}
.oh-hero__side{
    display:grid;
    grid-template-rows:1fr 1fr;
}
.oh-side-card{min-height:290px}
.oh-side-card img{
    width:100%;
    height:100%;
    min-height:290px;
    object-fit:cover;
}
.oh-side-card__overlay{
    position:absolute;
    left:25px;
    right:20px;
    bottom:25px;
    z-index:3;
    color:#fff;
}
.oh-side-card__overlay span{color:#fff}
.oh-side-card__overlay h2{
    margin:0;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:23px;
    line-height:1.2;
    font-weight:400;
}
.oh-empty-hero{
    width:100%;
    min-height:580px;
    padding:80px 25px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    background:linear-gradient(rgba(20,20,20,.7),rgba(20,20,20,.7));
    color:#fff;
}
.oh-empty-hero span{font-size:12px;letter-spacing:2px}
.oh-empty-hero h1{
    max-width:850px;
    margin:15px 0;
    color:#fff;
    font:400 clamp(34px,5vw,62px)/1.08 Georgia,serif;
}
.oh-empty-hero p{max-width:650px;color:#ddd}

/* TRENDING */
.oh-trending{
    width:100%;
    padding:12px 20px;
    background:#fff;
}
.oh-trending__inner{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:10px;
    max-width:1250px;
    margin:auto;
}
.oh-trending-card{
    position:relative;
    display:block;
    height:125px;
    overflow:hidden;
    background:#eee;
}
.oh-trending-card img{
    width:100%;
    height:125px;
    object-fit:cover;
}
.oh-trending-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.82),transparent);
}
.oh-trending-card span{
    position:absolute;
    left:12px;
    right:12px;
    bottom:10px;
    z-index:2;
    color:#fff;
    font:13px/1.2 Georgia,serif;
}

/* SECTIONS */
.oh-section{
    width:100%;
    max-width:1200px;
    margin:auto;
    padding:88px 25px;
    background:#fff;
}
.oh-section--cream{
    max-width:none;
    padding-left:max(25px,calc((100vw - 1150px)/2));
    padding-right:max(25px,calc((100vw - 1150px)/2));
    background:var(--oh-cream);
}
.oh-section--light{
    max-width:none;
    padding-left:max(25px,calc((100vw - 1150px)/2));
    padding-right:max(25px,calc((100vw - 1150px)/2));
    background:var(--oh-light);
}
.oh-section__heading{
    max-width:760px;
    margin:0 auto 44px;
    text-align:center;
}
.oh-section__heading h2{
    margin:0 0 14px;
    color:#292929;
    font:400 clamp(30px,4vw,45px)/1.15 Georgia,"Times New Roman",serif;
}
.oh-section__heading p{
    margin:0;
    color:#777;
    font-size:15px;
    line-height:1.8;
}
.oh-grid{display:grid;gap:25px}
.oh-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.oh-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* CARDS */
.oh-card{
    min-width:0;
    overflow:hidden;
    background:#fff;
    transition:transform .25s ease,box-shadow .25s ease;
}
.oh-card:hover{
    transform:translateY(-5px);
    box-shadow:0 14px 35px rgba(0,0,0,.1);
}
.oh-card__image{
    display:block;
    width:100%;
    aspect-ratio:4/3;
    overflow:hidden;
    background:#e9e3da;
}
.oh-card__image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .45s ease;
}
.oh-card:hover .oh-card__image img{transform:scale(1.04)}
.oh-card__placeholder{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    color:#806342;
    font:16px Georgia,serif;
}
.oh-card__body{padding:18px}
.oh-card__category{
    display:block;
    margin-bottom:8px;
    color:var(--oh-brown);
    font-size:9px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;
}
.oh-card__title{
    margin:0;
    font:400 20px/1.3 Georgia,"Times New Roman",serif;
}
.oh-card__title a{color:#252525}
.oh-card__title a:hover{color:var(--oh-brown)}
.oh-card__excerpt{
    margin:10px 0 0;
    color:#777;
    font-size:13px;
    line-height:1.65;
}

/* EDITORIAL */
.oh-editorial{
    display:grid;
    grid-template-columns:minmax(0,3fr) minmax(0,2fr);
    min-height:520px;
}
.oh-editorial__image{min-height:520px;overflow:hidden}
.oh-editorial__image img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.oh-editorial__content{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    padding:70px;
    background:var(--oh-cream);
}
.oh-editorial__content h2{
    margin:0 0 20px;
    color:#292929;
    font:400 clamp(30px,4vw,48px)/1.12 Georgia,"Times New Roman",serif;
}
.oh-editorial__content p{
    margin:0 0 28px;
    color:#666;
    font-size:15px;
    line-height:1.8;
}

/* BUTTONS */
.oh-button,.oh-light-button{
    display:inline-block;
    padding:14px 23px;
    font-size:10px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;
}
.oh-button{background:var(--oh-brown);color:#fff}
.oh-button:hover{background:#8d673f;color:#fff}
.oh-light-button{background:#fff;color:#222}
.oh-light-button:hover{background:var(--oh-brown);color:#fff}

/* DARK GUIDE */
.oh-dark-banner{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:430px;
    padding:50px 25px;
    background:
        linear-gradient(rgba(12,12,12,.8),rgba(12,12,12,.8)),
        url("https://images.unsplash.com/photo-1505693416388-ac5ce068fe85?auto=format&fit=crop&w=1800&q=80")
        center/cover no-repeat;
    text-align:center;
}
.oh-dark-banner__content{max-width:760px}
.oh-label--white{color:#fff}
.oh-dark-banner h2{
    margin:0 0 20px;
    color:#fff;
    font:400 clamp(31px,4vw,50px)/1.12 Georgia,"Times New Roman",serif;
}
.oh-dark-banner p{
    max-width:650px;
    margin:0 auto 30px;
    color:rgba(255,255,255,.86);
    font-size:15px;
    line-height:1.8;
}

/* FINAL */
.oh-final{
    padding:95px 25px;
    background:var(--oh-brown);
    text-align:center;
}
.oh-final>div{max-width:760px;margin:auto}
.oh-final span{color:#fff}
.oh-final h2{
    margin:0 0 20px;
    color:#fff;
    font:400 clamp(32px,5vw,55px)/1.1 Georgia,"Times New Roman",serif;
}
.oh-final p{
    max-width:650px;
    margin:0 auto 30px;
    color:rgba(255,255,255,.9);
    font-size:15px;
    line-height:1.8;
}

/* KADENCE HOME PAGE CONTAINER OVERRIDE */
body.home .content-area,
body.home .entry-content,
body.home .site-content,
body.home .content-wrap{
    width:100%;
    max-width:none;
    padding-left:0;
    padding-right:0;
}
body.home .entry-content{
    margin:0;
}

/* TABLET */
@media (max-width:900px){
    .oh-hero{grid-template-columns:1fr}
    .oh-hero__main{min-height:500px}
    .oh-hero__main img{height:500px}
    .oh-hero__side{grid-template-columns:1fr 1fr;grid-template-rows:none}
    .oh-side-card{min-height:260px}
    .oh-side-card img{min-height:260px}
    .oh-grid--4,.oh-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
    .oh-editorial{grid-template-columns:1fr}
    .oh-editorial__image{min-height:400px}
    .oh-editorial__content{padding:55px 35px}
}

/* MOBILE */
@media (max-width:600px){
    .ornexa-home{width:100vw;margin-left:calc(50% - 50vw)}
    .oh-hero__main{min-height:420px}
    .oh-hero__main img{height:420px}
    .oh-hero__overlay{left:22px;right:22px;bottom:28px}
    .oh-hero__overlay h1{font-size:31px}
    .oh-hero__overlay p{font-size:13px}
    .oh-hero__side{grid-template-columns:1fr 1fr}
    .oh-side-card{min-height:210px}
    .oh-side-card img{min-height:210px}
    .oh-side-card__overlay{left:14px;right:12px;bottom:14px}
    .oh-side-card__overlay h2{font-size:17px}
    .oh-trending{padding:8px}
    .oh-trending__inner{grid-template-columns:repeat(2,1fr);gap:7px}
    .oh-trending-card{height:100px}
    .oh-trending-card img{height:100px}
    .oh-trending-card span{font-size:11px;left:8px;right:8px;bottom:8px}
    .oh-section{padding:60px 18px}
    .oh-section--cream,.oh-section--light{padding-left:18px;padding-right:18px}
    .oh-section__heading{margin-bottom:30px}
    .oh-section__heading h2{font-size:30px}
    .oh-section__heading p{font-size:14px}
    .oh-grid--4,.oh-grid--3{grid-template-columns:1fr}
    .oh-card__title{font-size:19px}
    .oh-editorial__image{min-height:300px}
    .oh-editorial__content{padding:45px 24px}
    .oh-editorial__content h2{font-size:32px}
    .oh-dark-banner{min-height:400px}
    .oh-final{padding:70px 22px}
}
/* =========================================================
   ORNEXA HOME — HERO IMAGE HEIGHT FIX
   Removes black empty space below main hero image
========================================================= */

.oh-hero {
    align-items: stretch;
}

.oh-hero__main {
    position: relative;
    min-height: 580px;
    height: 100%;
    overflow: hidden;
}

.oh-hero__main > a {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.oh-hero__main img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100% !important;
    min-height: 100%;
    object-fit: cover;
    object-position: center center;
}

/* Keep the title/content on top of the image */
.oh-hero__overlay {
    position: absolute;
    left: 55px;
    right: 45px;
    bottom: 48px;
    z-index: 5;
}

/* Make sure overlay gradient covers the complete image */
.oh-hero__main::after {
    z-index: 2;
}

/* Keep hero text above gradient */
.oh-hero__overlay {
    z-index: 5;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .oh-hero__main {
        min-height: 500px;
    }

    .oh-hero__main > a {
        position: absolute;
        inset: 0;
    }

    .oh-hero__main img {
        height: 100% !important;
        min-height: 100%;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .oh-hero__main {
        min-height: 420px;
    }

    .oh-hero__main > a {
        position: absolute;
        inset: 0;
    }

    .oh-hero__main img {
        height: 100% !important;
        min-height: 100%;
    }

    .oh-hero__overlay {
        left: 22px;
        right: 22px;
        bottom: 28px;
    }

}
/* =========================================================
   ORNEXA HOME — 3 POST HERO LAYOUT
   Show all 3 featured posts together
========================================================= */

.oh-hero {
    display: grid !important;
    grid-template-columns: 2fr 1fr 1fr !important;
    grid-template-rows: 580px !important;
    height: 580px !important;
    min-height: 580px !important;
    gap: 0 !important;
    background: #111;
}

/* Main post */
.oh-hero__main {
    grid-column: 1;
    grid-row: 1;
    height: 580px !important;
    min-height: 580px !important;
}

/* Side container becomes transparent */
.oh-hero__side {
    display: contents !important;
}

/* Post 2 */
.oh-side-card:nth-child(1) {
    grid-column: 2;
    grid-row: 1;
    height: 580px !important;
    min-height: 580px !important;
}

/* Post 3 */
.oh-side-card:nth-child(2) {
    grid-column: 3;
    grid-row: 1;
    height: 580px !important;
    min-height: 580px !important;
}

/* All images fill their cards */
.oh-hero__main img,
.oh-side-card img {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;
}

/* Main title */
.oh-hero__overlay {
    left: 35px;
    right: 30px;
    bottom: 35px;
}

/* Smaller side titles */
.oh-side-card__overlay {
    left: 20px;
    right: 18px;
    bottom: 25px;
}

.oh-side-card__overlay h2 {
    font-size: 21px;
    line-height: 1.25;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .oh-hero {
        grid-template-columns: 2fr 1fr !important;
        grid-template-rows: 500px !important;
        height: 500px !important;
        min-height: 500px !important;
    }

    .oh-hero__main {
        height: 500px !important;
        min-height: 500px !important;
    }

    .oh-side-card:nth-child(1),
    .oh-side-card:nth-child(2) {
        height: 500px !important;
        min-height: 500px !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .oh-hero {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: 420px 260px !important;
        height: auto !important;
        min-height: 0 !important;
    }

    .oh-hero__main {
        grid-column: 1 !important;
        grid-row: 1 !important;
        height: 420px !important;
        min-height: 420px !important;
    }

    .oh-side-card:nth-child(1) {
        grid-column: 1 !important;
        grid-row: 2 !important;
        height: 260px !important;
        min-height: 260px !important;
    }

    /* Hide third post on mobile */
    .oh-side-card:nth-child(2) {
        display: none !important;
    }

    .oh-side-card__overlay h2 {
        font-size: 19px;
    }

}
/* =========================================================
   ORNEXA HOME — FINAL HERO POLISH
========================================================= */

.oh-hero {
    grid-template-columns: 2.15fr 1fr 1fr !important;
}

/* Main hero title */
.oh-hero__overlay {
    left: 32px !important;
    right: 28px !important;
    bottom: 32px !important;
}

.oh-hero__overlay h1 {
    max-width: 680px !important;
    font-size: clamp(42px, 3.5vw, 54px) !important;
    line-height: 1.08 !important;
    margin-bottom: 12px !important;
}

/* Main description */
.oh-hero__overlay p {
    max-width: 600px !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* Side cards */
.oh-side-card__overlay {
    left: 20px !important;
    right: 18px !important;
    bottom: 24px !important;
}

.oh-side-card__overlay h2 {
    font-size: 19px !important;
    line-height: 1.25 !important;
}

/* Slightly stronger side-card readability */
.oh-side-card::after {
    background: linear-gradient(
        to top,
        rgba(0,0,0,.82),
        rgba(0,0,0,.08)
    ) !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .oh-hero {
        grid-template-columns: 2fr 1fr !important;
    }

    .oh-hero__overlay h1 {
        font-size: 40px !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .oh-hero {
        grid-template-columns: 1fr !important;
    }

    .oh-hero__overlay h1 {
        font-size: 31px !important;
    }

}