/* =========================================================
   LOCAL FEMALE GUIDES UGANDA
   BLOG + SINGLE STORY
   LUXURY SAFARI EDITORIAL DESIGN
   COMPLETE REPLACEMENT
   ========================================================= */


/* =========================================================
   DESIGN TOKENS
   ========================================================= */

:root{
    --safari-green:#1F4D3A;
    --deep-green:#163A2C;
    --gold:#C8A24C;
    --gold-dark:#9A762F;
    --ivory:#F8F5EF;
    --cream:#FCFAF6;
    --sand:#E8E2D7;
    --text:#424841;
    --muted:#777C76;
    --white:#FFFFFF;
}


/* =========================================================
   BLOG / SINGLE STORY BASE
   ========================================================= */

.blog-page,
.single-story-page{
    width:100%;
    margin:0;
    padding:0;
    background:#fff;
    color:var(--text);
}

.blog-page *,
.single-story-page *{
    box-sizing:border-box;
}

.blog-page img,
.single-story-page img{
    max-width:100%;
    height:auto;
}

.blog-page a,
.single-story-page a{
    text-decoration-thickness:1px;
}

.blog-page .container,
.single-story-page .container{
    width:100%;
}


/* =========================================================
   BLOG HERO
   ========================================================= */

.blog-hero{
    position:relative;
    display:flex;
    align-items:center;
    min-height:760px;
    overflow:hidden;
    background:var(--deep-green);
}

.blog-hero-image{
    position:absolute;
    inset:0;
    overflow:hidden;
}

.blog-hero-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transform:scale(1.01);
}

.blog-hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(10,25,19,.72) 0%,
            rgba(10,25,19,.52) 43%,
            rgba(10,25,19,.20) 100%
        );
}

.blog-hero > .container{
    position:relative;
    z-index:2;
}

.blog-hero-content{
    position:relative;
    z-index:2;
    max-width:900px;
    padding:80px 0;
    color:#fff;
}

.blog-hero-eyebrow{
    display:block;
    margin:0 0 22px;
    color:#C8A24C;
    font-family:Arial,Helvetica,sans-serif;
    font-size:12px;
    font-weight:700;
    letter-spacing:5px;
    line-height:1.4;
    text-transform:uppercase;
}

.blog-hero-line{
    display:block;
    width:58px;
    height:1px;
    margin:0 0 28px;
    background:#C8A24C;
}

.blog-hero-content h1{
    max-width:900px;
    margin:0 0 28px;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(46px,6vw,78px);
    font-weight:700;
    line-height:1.06;
    letter-spacing:-.025em;
}

.blog-hero-content p{
    max-width:720px;
    margin:0 0 40px;
    color:rgba(255,255,255,.92);
    font-family:Arial,Helvetica,sans-serif;
    font-size:18px;
    line-height:1.85;
}


/* =========================================================
   BLOG HERO — STORIES FROM THE WILD
   ========================================================= */

.blog-hero-feature{
    display:flex;
    align-items:center;
    gap:18px;
    margin-top:40px;
}

.blog-hero-feature-line{
    display:block;
    width:42px;
    height:1px;
    flex:0 0 42px;
    background:var(--gold);
}

.blog-hero-feature-label{
    display:block;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:3px;
    line-height:1.5;
    text-transform:uppercase;
}


/* =========================================================
   BLOG HERO BUTTON
   ========================================================= */

.blog-hero .btn-primary{
    display:inline-flex;
    align-items:center;
    gap:18px;
    padding:16px 24px 16px 27px;
    border:1px solid var(--gold);
    border-radius:0;
    background:var(--gold);
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:1.8px;
    line-height:1.3;
    text-decoration:none;
    text-transform:uppercase;
    transition:
        background-color .3s ease,
        border-color .3s ease,
        padding-right .3s ease;
}

.blog-hero .btn-primary:after{
    content:"→";
    font-size:17px;
    font-weight:400;
    line-height:1;
    transition:transform .3s ease;
}

.blog-hero .btn-primary:hover{
    padding-right:30px;
    border-color:var(--safari-green);
    background:var(--safari-green);
}

.blog-hero .btn-primary:hover:after{
    transform:translateX(4px);
}


/* =========================================================
   FEATURED STORY SECTION
   ========================================================= */

.blog-featured-section{
    position:relative;
    padding:125px 0 135px;
    background:#fff;
}

.blog-featured-heading{
    max-width:760px;
    margin:0 auto 70px;
    text-align:center;
}

.blog-featured-eyebrow{
    display:block;
    margin:0 0 17px;
    color:var(--gold-dark);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:3px;
    line-height:1.5;
    text-transform:uppercase;
}

.blog-featured-heading h2{
    margin:0 0 18px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:46px;
    font-weight:400;
    line-height:1.15;
}

.blog-featured-heading p{
    max-width:630px;
    margin:0 auto;
    color:var(--muted);
    font-family:Arial,Helvetica,sans-serif;
    font-size:15px;
    line-height:1.8;
}


/* =========================================================
   FEATURED EDITORIAL LAYOUT
   ========================================================= */

.blog-featured{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1.38fr) minmax(380px,.82fr);
    width:100%;
    overflow:hidden;
    border-top:1px solid var(--sand);
    border-bottom:1px solid var(--sand);
    background:var(--cream);
}

.blog-featured-image{
    position:relative;
    min-height:600px;
    overflow:hidden;
    background:#EDE8DE;
}

.blog-featured-image a{
    display:block;
    width:100%;
    height:100%;
}

.blog-featured-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform 1s cubic-bezier(.2,.6,.2,1);
}

.blog-featured:hover .blog-featured-image img{
    transform:scale(1.035);
}

.blog-featured-image:after{
    position:absolute;
    inset:22px;
    content:"";
    border:1px solid rgba(255,255,255,.38);
    pointer-events:none;
}

.blog-featured-content{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:75px 70px;
}

.blog-featured-content:before{
    position:absolute;
    top:75px;
    left:0;
    width:2px;
    height:70px;
    content:"";
    background:var(--gold);
}

.blog-featured-category{
    display:block;
    margin:0 0 20px;
    color:var(--gold-dark);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:2.5px;
    line-height:1.4;
    text-transform:uppercase;
}

.blog-featured-content h2{
    margin:0 0 22px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:39px;
    font-weight:400;
    line-height:1.18;
}

.blog-featured-content h2 a{
    color:inherit;
    text-decoration:none;
    transition:color .3s ease;
}

.blog-featured-content h2 a:hover{
    color:var(--gold-dark);
}

.blog-featured-meta{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:12px;
    margin:0 0 28px;
    color:var(--muted);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:1px;
    line-height:1.5;
    text-transform:uppercase;
}

.blog-featured-meta span + span{
    padding-left:12px;
    border-left:1px solid #D8D2C8;
}

.blog-featured-excerpt{
    max-width:510px;
    margin:0 0 35px;
}

.blog-featured-excerpt p{
    margin:0;
    color:#5B625B;
    font-family:Arial,Helvetica,sans-serif;
    font-size:15px;
    line-height:1.85;
}


/* =========================================================
   EDITORIAL READ LINK
   ========================================================= */

.blog-read-more{
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    max-width:250px;
    padding:17px 0;
    border-top:1px solid var(--sand);
    border-bottom:1px solid var(--sand);
    color:var(--safari-green);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:1.8px;
    line-height:1.4;
    text-decoration:none;
    text-transform:uppercase;
    transition:
        color .3s ease,
        max-width .3s ease;
}

.blog-read-more:hover{
    max-width:275px;
    color:var(--gold-dark);
}

.blog-read-more-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    width:31px;
    height:31px;
    border:1px solid rgba(200,162,76,.7);
    border-radius:50%;
    color:var(--gold-dark);
    font-size:15px;
    font-weight:400;
    line-height:1;
    transition:
        background-color .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.blog-read-more:hover .blog-read-more-arrow{
    border-color:var(--safari-green);
    background:var(--safari-green);
    color:var(--gold);
    transform:translateX(4px);
}


/* =========================================================
   LATEST STORIES SECTION
   ========================================================= */

.blog-latest-section{
    padding:125px 0 135px;
    background:var(--ivory);
}


/* =========================================================
   THREE COLUMN JOURNAL / JOURNEY CARD
   ========================================================= */

.blog-journal-card{
    display:grid;
    grid-template-columns:1fr 1fr .65fr;
    width:100%;
    min-height:300px;
    margin:0 0 70px;
    overflow:hidden;
    border:1px solid var(--sand);
    background:#fff;
}


/* =========================================================
   JOURNAL CARD COLUMNS
   ========================================================= */

.blog-journal-column{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:55px 50px;
}

.blog-journal-column + .blog-journal-column{
    border-left:1px solid var(--sand);
}


/* =========================================================
   JOURNAL CARD EYEBROW
   ========================================================= */

.blog-journal-eyebrow{
    display:block;
    margin:0 0 18px;
    color:var(--gold-dark);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:3px;
    line-height:1.5;
    text-transform:uppercase;
}


/* =========================================================
   COLUMN 1 — FROM THE JOURNAL
   ========================================================= */

.blog-journal-intro h2{
    margin:0 0 18px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:42px;
    font-weight:400;
    line-height:1.15;
}

.blog-journal-intro p{
    max-width:430px;
    margin:0;
    color:#5B625B;
    font-family:Arial,Helvetica,sans-serif;
    font-size:15px;
    line-height:1.8;
}


/* =========================================================
   COLUMN 2 — YOUR EAST AFRICAN JOURNEY
   ========================================================= */

.blog-journal-journey h3{
    max-width:450px;
    margin:0 0 18px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:31px;
    font-weight:400;
    line-height:1.2;
}

.blog-journal-journey p{
    max-width:450px;
    margin:0;
    color:#5B625B;
    font-family:Arial,Helvetica,sans-serif;
    font-size:15px;
    line-height:1.8;
}


/* =========================================================
   COLUMN 3 — PLAN YOUR SAFARI
   ========================================================= */

.blog-journal-action{
    align-items:center;
    justify-content:center;
    padding:45px;
    background:var(--deep-green);
}

.blog-journal-button{
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    width:100%;
    max-width:235px;
    padding:10px 11px 10px 22px;
    border:1px solid rgba(200,162,76,.9);
    background:transparent;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:2px;
    line-height:1.3;
    text-decoration:none;
    text-transform:uppercase;
    transition:
        background-color .35s ease,
        border-color .35s ease,
        color .35s ease;
}

.blog-journal-button-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    flex:0 0 38px;
    border:1px solid rgba(200,162,76,.85);
    border-radius:50%;
    color:var(--gold);
    font-family:Arial,Helvetica,sans-serif;
    font-size:16px;
    font-weight:400;
    line-height:1;
    transition:
        background-color .35s ease,
        border-color .35s ease,
        color .35s ease,
        transform .35s ease;
}

.blog-journal-button:hover{
    border-color:var(--gold);
    background:var(--gold);
    color:var(--deep-green);
}

.blog-journal-button:hover .blog-journal-button-arrow{
    border-color:var(--deep-green);
    background:var(--deep-green);
    color:var(--gold);
    transform:translateX(4px);
}


/* =========================================================
   BLOG GRID
   ========================================================= */

.blog-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:30px;
    width:100%;
    margin:0;
    padding:0;
    align-items:stretch;
}


/* =========================================================
   BLOG CARD
   ========================================================= */

.blog-card{
    position:relative;
    display:flex;
    flex-direction:column;
    width:100%;
    min-width:0;
    height:100%;
    margin:0;
    padding:0;
    overflow:hidden;
    border:1px solid var(--sand);
    background:#fff;
    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.blog-card:hover{
    transform:translateY(-7px);
    box-shadow:0 22px 55px rgba(31,77,58,.13);
}


/* =========================================================
   BLOG CARD IMAGE
   ========================================================= */

.blog-card-image{
    position:relative;
    width:100%;
    height:285px;
    min-height:285px;
    margin:0;
    padding:0;
    overflow:hidden;
    background:#EDE8DE;
}

.blog-card-image a{
    display:block;
    width:100%;
    height:100%;
}

.blog-card-image img{
    display:block;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    object-fit:cover;
    transition:transform .7s ease;
}

.blog-card:hover .blog-card-image img{
    transform:scale(1.05);
}

.blog-card-image:after{
    position:absolute;
    inset:14px;
    content:"";
    border:1px solid rgba(255,255,255,.30);
    pointer-events:none;
}


/* =========================================================
   BLOG CARD CATEGORY
   ========================================================= */

.blog-card-category{
    position:absolute;
    top:20px;
    left:20px;
    z-index:2;
    display:inline-block;
    padding:8px 12px;
    background:rgba(255,255,255,.95);
    color:var(--safari-green);
    font-family:Arial,Helvetica,sans-serif;
    font-size:9px;
    font-weight:700;
    letter-spacing:1.5px;
    line-height:1.3;
    text-transform:uppercase;
}


/* =========================================================
   BLOG CARD CONTENT
   ========================================================= */

.blog-card-content{
    display:flex;
    flex:1;
    flex-direction:column;
    width:100%;
    min-width:0;
    padding:30px 30px 28px;
}

.blog-card-content h3{
    margin:0 0 15px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:25px;
    font-weight:400;
    line-height:1.28;
}

.blog-card-content h3 a{
    color:inherit;
    text-decoration:none;
    transition:color .25s ease;
}

.blog-card-content h3 a:hover{
    color:var(--gold-dark);
}


/* =========================================================
   BLOG CARD META
   ========================================================= */

.blog-card-meta{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin:0 0 18px;
    padding:0;
    color:#858A84;
    font-family:Arial,Helvetica,sans-serif;
    font-size:9px;
    font-weight:700;
    letter-spacing:1px;
    line-height:1.4;
    text-transform:uppercase;
}

.blog-card-meta span + span{
    padding-left:9px;
    border-left:1px solid #DCD8D0;
}


/* =========================================================
   BLOG CARD EXCERPT
   ========================================================= */

.blog-card-excerpt{
    margin:0 0 25px;
    padding:0;
}

.blog-card-excerpt p{
    margin:0;
    padding:0;
    color:#5B625B;
    font-family:Arial,Helvetica,sans-serif;
    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CARD READ LINK
   ========================================================= */

.blog-card .blog-read-more{
    margin-top:auto;
}


/* =========================================================
   EMPTY BLOG STATE
   ========================================================= */

.blog-empty{
    padding:100px 30px;
    border-top:1px solid var(--sand);
    border-bottom:1px solid var(--sand);
    background:#fff;
    text-align:center;
}

.blog-empty h2{
    margin:0 0 15px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:38px;
    font-weight:400;
}

.blog-empty p{
    margin:0;
    color:var(--muted);
    font-family:Arial,Helvetica,sans-serif;
    font-size:15px;
}


/* =========================================================
   SINGLE STORY HERO
   ========================================================= */

.single-story-hero{
    position:relative;
    display:flex;
    align-items:flex-end;
    min-height:760px;
    overflow:hidden;
    background:var(--deep-green);
}

.single-story-hero-image{
    position:absolute;
    inset:0;
    overflow:hidden;
}

.single-story-hero-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}

.single-story-hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            rgba(0,0,0,.10) 0%,
            rgba(0,0,0,.30) 45%,
            rgba(0,0,0,.82) 100%
        );
}

.single-story-hero-content{
    position:relative;
    z-index:2;
    width:100%;
    max-width:920px;
    padding:0 0 95px;
    color:#fff;
}

.single-story-category{
    display:block;
    margin:0 0 20px;
    color:var(--gold);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:3px;
    line-height:1.5;
    text-transform:uppercase;
}

.single-story-hero-content h1{
    max-width:900px;
    margin:0 0 25px;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:65px;
    font-weight:400;
    line-height:1.08;
    letter-spacing:-.6px;
}

.single-story-meta{
    display:flex;
    flex-wrap:wrap;
    gap:13px;
    color:#F3E7C4;
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:1px;
    line-height:1.5;
    text-transform:uppercase;
}

.single-story-meta span + span{
    padding-left:13px;
    border-left:1px solid rgba(255,255,255,.4);
}


/* =========================================================
   STORY INTRO
   ========================================================= */

.single-story-intro{
    padding:95px 0 45px;
    background:#fff;
}

.single-story-intro-inner{
    max-width:850px;
    margin:0 auto;
}

.single-story-intro p{
    position:relative;
    margin:0;
    padding-left:35px;
    color:#4F574F;
    font-family:Georgia,"Times New Roman",serif;
    font-size:25px;
    font-style:italic;
    font-weight:400;
    line-height:1.75;
}

.single-story-intro p:before{
    position:absolute;
    top:7px;
    bottom:7px;
    left:0;
    width:2px;
    content:"";
    background:var(--gold);
}


/* =========================================================
   STORY CONTENT
   ========================================================= */

.single-story-content{
    padding:35px 0 110px;
    background:#fff;
}

.single-story-content-inner{
    max-width:850px;
    margin:0 auto;
}

.single-story-content-inner > p{
    margin:0 0 27px;
    color:#424841;
    font-family:Arial,Helvetica,sans-serif;
    font-size:17px;
    line-height:1.95;
}

.single-story-content-inner > ul,
.single-story-content-inner > ol{
    margin:0 0 30px;
    padding-left:28px;
    color:#424841;
    font-family:Arial,Helvetica,sans-serif;
    font-size:17px;
    line-height:1.9;
}

.single-story-content-inner li{
    margin-bottom:9px;
}

.single-story-content-inner h2{
    margin:65px 0 22px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:38px;
    font-weight:400;
    line-height:1.2;
}

.single-story-content-inner h3{
    margin:50px 0 18px;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:29px;
    font-weight:400;
    line-height:1.3;
}

.single-story-content-inner h4{
    margin:38px 0 15px;
    color:var(--safari-green);
    font-family:Arial,Helvetica,sans-serif;
    font-size:17px;
    font-weight:700;
    letter-spacing:.2px;
    line-height:1.5;
}

.single-story-content-inner strong{
    color:var(--safari-green);
}

.single-story-content-inner a{
    color:var(--gold-dark);
    text-decoration:underline;
    text-decoration-color:rgba(154,118,47,.35);
    text-underline-offset:4px;
    transition:color .25s ease;
}

.single-story-content-inner a:hover{
    color:var(--safari-green);
}


/* =========================================================
   ARTICLE IMAGES
   ========================================================= */

.single-story-content-inner img{
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    margin:45px auto;
}

.single-story-content-inner figure{
    margin:55px 0;
}

.single-story-content-inner figure img{
    width:100%;
    margin:0;
}

.single-story-content-inner figcaption{
    margin-top:12px;
    color:#858A84;
    font-family:Arial,Helvetica,sans-serif;
    font-size:11px;
    line-height:1.6;
    text-align:center;
}


/* =========================================================
   ARTICLE BLOCKQUOTE
   ========================================================= */

.single-story-content-inner blockquote{
    position:relative;
    margin:55px 0;
    padding:30px 35px;
    border-top:1px solid var(--sand);
    border-right:0;
    border-bottom:1px solid var(--sand);
    border-left:2px solid var(--gold);
    background:var(--ivory);
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:22px;
    font-style:italic;
    line-height:1.7;
}


/* =========================================================
   STORY FOOTER
   ========================================================= */

.single-story-footer{
    padding:48px 0;
    border-top:1px solid var(--sand);
    border-bottom:1px solid var(--sand);
    background:var(--ivory);
}

.single-story-footer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.single-story-filed-under{
    color:#858A84;
    font-family:Arial,Helvetica,sans-serif;
    font-size:9px;
    font-weight:700;
    letter-spacing:1.5px;
    line-height:1.5;
    text-transform:uppercase;
}

.single-story-filed-under a{
    color:var(--safari-green);
    text-decoration:none;
}

.single-story-filed-under a:hover{
    color:var(--gold-dark);
}


/* =========================================================
   STORY PREVIOUS / NEXT
   ========================================================= */

.single-story-navigation{
    display:flex;
    align-items:center;
    gap:10px;
}

.single-story-navigation a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    border:1px solid rgba(200,162,76,.7);
    border-radius:50%;
    color:var(--gold-dark);
    font-family:Arial,Helvetica,sans-serif;
    font-size:15px;
    line-height:1;
    text-decoration:none;
    transition:
        background-color .3s ease,
        border-color .3s ease,
        color .3s ease,
        transform .3s ease;
}

.single-story-navigation a:hover{
    border-color:var(--safari-green);
    background:var(--safari-green);
    color:var(--gold);
    transform:translateX(2px);
}


/* =========================================================
   RELATED STORIES
   ========================================================= */

.single-story-related{
    padding:120px 0 130px;
    background:var(--ivory);
}

.single-story-related-heading{
    max-width:760px;
    margin:0 auto 70px;
    text-align:center;
}

.single-story-related-eyebrow{
    display:block;
    margin:0 0 17px;
    color:var(--gold-dark);
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:3px;
    line-height:1.5;
    text-transform:uppercase;
}

.single-story-related-heading h2{
    margin:0;
    color:var(--safari-green);
    font-family:Georgia,"Times New Roman",serif;
    font-size:46px;
    font-weight:400;
    line-height:1.15;
}


/* =========================================================
   TABLET / SMALL DESKTOP
   ========================================================= */

@media (max-width:1100px){

    .blog-hero,
    .single-story-hero{
        min-height:680px;
    }

    .blog-hero-content h1{
        font-size:60px;
    }

    .single-story-hero-content h1{
        font-size:57px;
    }

    .blog-featured{
        grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);
    }

    .blog-featured-image{
        min-height:540px;
    }

    .blog-featured-content{
        padding:55px 45px;
    }

    .blog-featured-content h2{
        font-size:34px;
    }
}


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

@media (max-width:992px){

    .blog-featured-section,
    .blog-latest-section{
        padding:90px 0 100px;
    }

    .blog-featured{
        grid-template-columns:1fr;
    }

    .blog-featured-image{
        min-height:480px;
    }

    .blog-featured-content{
        padding:55px 50px 60px;
    }

    .blog-featured-content:before{
        top:0;
        left:50px;
        width:65px;
        height:2px;
    }


    /* JOURNAL CARD */

    .blog-journal-card{
        grid-template-columns:1fr 1fr;
    }

    .blog-journal-action{
        grid-column:1 / -1;
        min-height:150px;
        border-top:1px solid var(--sand);
        border-left:0;
    }


    /* BLOG GRID */

    .blog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:30px;
    }


    .single-story-intro{
        padding-top:75px;
    }

    .single-story-content{
        padding-bottom:90px;
    }
}


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

@media (max-width:768px){

    .blog-hero{
        min-height:610px;
    }

    .single-story-hero{
        min-height:650px;
    }


    /* HERO */

    .blog-hero-overlay{
        background:
            linear-gradient(
                rgba(0,0,0,.60),
                rgba(0,0,0,.60)
            );
    }

    .single-story-hero-overlay{
        background:
            linear-gradient(
                rgba(0,0,0,.20),
                rgba(0,0,0,.80)
            );
    }

    .blog-hero-content{
        padding:55px 0;
    }

    .blog-hero-content h1{
        font-size:45px;
        line-height:1.08;
        letter-spacing:-.4px;
    }

    .blog-hero-content p{
        font-size:16px;
        line-height:1.8;
    }

    .blog-hero-eyebrow{
        font-size:11px;
        letter-spacing:4px;
    }

    .blog-hero-feature{
        margin-top:30px;
    }

    .blog-hero-feature-label{
        font-size:9px;
        letter-spacing:2.5px;
    }


    /* FEATURED */

    .blog-featured-section{
        padding:75px 0 85px;
    }

    .blog-featured-heading{
        margin-bottom:45px;
    }

    .blog-featured-heading h2{
        font-size:38px;
    }

    .blog-featured-heading p{
        font-size:14px;
    }

    .blog-featured-image{
        min-height:360px;
    }

    .blog-featured-image:after{
        inset:15px;
    }

    .blog-featured-content{
        padding:42px 30px 45px;
    }

    .blog-featured-content:before{
        left:30px;
    }

    .blog-featured-content h2{
        font-size:31px;
    }


    /* LATEST STORIES */

    .blog-latest-section{
        padding:75px 0 85px;
    }


    /* JOURNAL CARD */

    .blog-journal-card{
        grid-template-columns:1fr;
        margin-bottom:45px;
    }

    .blog-journal-column{
        padding:40px 30px;
    }

    .blog-journal-column + .blog-journal-column{
        border-top:1px solid var(--sand);
        border-left:0;
    }

    .blog-journal-intro h2{
        font-size:36px;
    }

    .blog-journal-journey h3{
        font-size:29px;
    }

    .blog-journal-action{
        min-height:145px;
        padding:35px 30px;
    }

    .blog-journal-button{
        width:100%;
        max-width:none;
    }


    /* BLOG GRID */

    .blog-grid{
        grid-template-columns:1fr;
        gap:28px;
    }

    .blog-card{
        width:100%;
        margin:0;
    }

    .blog-card-image{
        height:270px;
        min-height:270px;
    }

    .blog-card-content{
        padding:28px 25px 27px;
    }

    .blog-card-content h3{
        font-size:24px;
    }


    /* SINGLE STORY */

    .single-story-hero-content{
        padding-bottom:65px;
    }

    .single-story-hero-content h1{
        font-size:45px;
        line-height:1.08;
    }

    .single-story-category{
        font-size:9px;
        letter-spacing:2.5px;
    }

    .single-story-intro{
        padding:65px 0 30px;
    }

    .single-story-intro p{
        padding-left:25px;
        font-size:21px;
        line-height:1.7;
    }

    .single-story-content{
        padding:30px 0 75px;
    }

    .single-story-content-inner > p{
        font-size:16px;
        line-height:1.85;
    }

    .single-story-content-inner > ul,
    .single-story-content-inner > ol{
        font-size:16px;
        line-height:1.8;
    }

    .single-story-content-inner h2{
        margin-top:50px;
        font-size:32px;
    }

    .single-story-content-inner h3{
        font-size:26px;
    }

    .single-story-content-inner blockquote{
        padding:25px;
        font-size:20px;
    }

    .single-story-footer{
        padding:38px 0;
    }

    .single-story-footer-inner{
        flex-direction:column;
        align-items:flex-start;
    }

    .single-story-related{
        padding:75px 0 85px;
    }

    .single-story-related-heading{
        margin-bottom:45px;
    }

    .single-story-related-heading h2{
        font-size:38px;
    }
}


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

@media (max-width:480px){

    .blog-hero{
        min-height:570px;
    }

    .single-story-hero{
        min-height:600px;
    }

    .blog-hero-content h1{
        font-size:37px;
    }

    .blog-hero-content p{
        font-size:15px;
        line-height:1.75;
    }

    .blog-hero-eyebrow{
        font-size:9px;
        letter-spacing:2.5px;
    }

    .blog-hero-feature{
        gap:13px;
        margin-top:25px;
    }

    .blog-hero-feature-line{
        width:30px;
        flex-basis:30px;
    }

    .blog-hero-feature-label{
        font-size:8px;
        letter-spacing:2px;
    }


    /* FEATURED + LATEST */

    .blog-featured-section,
    .blog-latest-section{
        padding:65px 0 75px;
    }

    .blog-featured-heading h2{
        font-size:32px;
    }

    .blog-featured-image{
        min-height:285px;
    }

    .blog-featured-content{
        padding:38px 23px 40px;
    }

    .blog-featured-content:before{
        left:23px;
    }

    .blog-featured-content h2{
        font-size:28px;
    }

    .blog-featured-meta{
        font-size:9px;
    }


    /* JOURNAL CARD */

    .blog-journal-card{
        margin-bottom:40px;
    }

    .blog-journal-column{
        padding:35px 23px;
    }

    .blog-journal-eyebrow{
        font-size:9px;
        letter-spacing:2.5px;
    }

    .blog-journal-intro h2{
        font-size:32px;
    }

    .blog-journal-journey h3{
        font-size:27px;
    }

    .blog-journal-intro p,
    .blog-journal-journey p{
        font-size:14px;
        line-height:1.75;
    }

    .blog-journal-action{
        padding:30px 23px;
    }


    /* BLOG CARD */

    .blog-card-image{
        height:235px;
        min-height:235px;
    }

    .blog-card-content{
        padding:25px 22px;
    }

    .blog-card-content h3{
        font-size:23px;
    }


    /* SINGLE STORY */

    .single-story-hero-content{
        padding-bottom:55px;
    }

    .single-story-hero-content h1{
        font-size:37px;
    }

    .single-story-meta{
        gap:8px;
        font-size:9px;
    }

    .single-story-meta span + span{
        padding-left:8px;
    }

    .single-story-intro{
        padding:55px 0 25px;
    }

    .single-story-intro p{
        padding-left:20px;
        font-size:19px;
    }

    .single-story-content-inner > p{
        font-size:15px;
        line-height:1.8;
    }

    .single-story-content-inner h2{
        font-size:29px;
    }

    .single-story-content-inner h3{
        font-size:24px;
    }

    .single-story-content-inner blockquote{
        margin:40px 0;
        padding:22px;
        font-size:19px;
    }

    .single-story-related{
        padding:65px 0 75px;
    }

    .single-story-related-heading h2{
        font-size:32px;
    }
}


/* =========================================================
   SINGLE STORY FOOTER — PLAN YOUR SAFARI
========================================================= */

.single-story-footer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.single-story-safari-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;

    margin-left:auto;
    flex-shrink:0;

    padding:14px 24px;

    border:1px solid var(--gold);
    background:var(--gold);
    color:#fff;

    font-size:11px;
    font-weight:700;
    letter-spacing:2px;
    line-height:1;
    text-transform:uppercase;
    text-decoration:none;

    transition:
        background .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.single-story-safari-button span:last-child{
    font-size:18px;
    line-height:1;
    transition:transform .3s ease;
}

.single-story-safari-button:hover{
    background:transparent;
    color:var(--gold);
    border-color:var(--gold);
    transform:translateY(-2px);
}

.single-story-safari-button:hover span:last-child{
    transform:translateX(4px);
}


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

@media (max-width:768px){

    .single-story-footer-inner{
        align-items:flex-start;
        flex-direction:column;
    }

    .single-story-safari-button{
        margin-left:0;
    }

}


/* =========================================================
   CATEGORY ARCHIVE — EAST AFRICAN JOURNEY CTA
========================================================= */

.blog-category-journey{
    padding:100px 0;
    background:#f5f1e8;
}

.blog-category-journey-inner{
    position:relative;

    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:center;

    gap:80px;

    max-width:1200px;
    margin:0 auto;

    padding:70px 75px;

    background:var(--deep-green);

    overflow:hidden;
}


/* Subtle premium background detail */

.blog-category-journey-inner::before{
    content:"";

    position:absolute;
    top:-180px;
    right:-120px;

    width:420px;
    height:420px;

    border:1px solid rgba(200,162,76,.16);
    border-radius:50%;

    pointer-events:none;
}

.blog-category-journey-inner::after{
    content:"";

    position:absolute;
    bottom:-220px;
    right:120px;

    width:360px;
    height:360px;

    border:1px solid rgba(255,255,255,.05);
    border-radius:50%;

    pointer-events:none;
}


/* =========================================================
   CTA CONTENT
========================================================= */

.blog-category-journey-content{
    position:relative;
    z-index:2;

    max-width:720px;
}

.blog-category-journey-content .blog-section-eyebrow{
    display:block;

    margin:0 0 20px;

    color:var(--gold);

    font-size:11px;
    font-weight:700;

    letter-spacing:4px;
    line-height:1.5;

    text-transform:uppercase;
}

.blog-category-journey-content h2{
    margin:0 0 22px;

    color:#fff;

    font-size:clamp(34px,4vw,54px);
    font-weight:700;

    line-height:1.08;
    letter-spacing:-.025em;
}

.blog-category-journey-content p{
    max-width:650px;

    margin:0;

    color:rgba(255,255,255,.82);

    font-size:17px;
    line-height:1.8;
}


/* =========================================================
   CTA BUTTON
========================================================= */

.blog-category-journey-action{
    position:relative;
    z-index:2;

    display:flex;
    align-items:center;
    justify-content:flex-end;

    flex-shrink:0;
}

.blog-category-journey-action .blog-latest-intro-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:18px;

    min-width:210px;

    padding:17px 25px;

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

    background:var(--gold);
    color:#fff;

    font-size:11px;
    font-weight:700;

    letter-spacing:2px;
    line-height:1;

    text-transform:uppercase;
    text-decoration:none;

    white-space:nowrap;

    transition:
        background .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.blog-category-journey-action
.blog-latest-intro-button span:last-child{
    font-size:19px;
    line-height:1;

    transition:transform .3s ease;
}

.blog-category-journey-action
.blog-latest-intro-button:hover{
    background:transparent;
    color:var(--gold);

    border-color:var(--gold);

    transform:translateY(-2px);
}

.blog-category-journey-action
.blog-latest-intro-button:hover span:last-child{
    transform:translateX(5px);
}


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

@media (max-width:992px){

    .blog-category-journey{
        padding:80px 0;
    }

    .blog-category-journey-inner{
        grid-template-columns:minmax(0,1fr) auto;

        gap:45px;

        padding:55px 45px;
    }

    .blog-category-journey-content h2{
        font-size:42px;
    }

}


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

@media (max-width:768px){

    .blog-category-journey{
        padding:60px 0;
    }

    .blog-category-journey-inner{
        grid-template-columns:1fr;

        gap:35px;

        padding:45px 30px;
    }

    .blog-category-journey-content h2{
        font-size:36px;
    }

    .blog-category-journey-content p{
        font-size:16px;
    }

    .blog-category-journey-action{
        justify-content:flex-start;
    }

}


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

@media (max-width:480px){

    .blog-category-journey-inner{
        padding:38px 24px;
    }

    .blog-category-journey-content h2{
        font-size:32px;
    }

    .blog-category-journey-action .blog-latest-intro-button{
        width:100%;
        min-width:0;
    }

}


/* =========================================================
   SINGLE STORY — MOBILE READING MARGINS
   ========================================================= */

@media (max-width:768px){

    .single-story-content-inner{
        width:calc(100% - 40px);
        max-width:850px;
        margin-left:auto;
        margin-right:auto;
    }

}

@media (max-width:480px){

    .single-story-content-inner{
        width:calc(100% - 36px);
        max-width:850px;
    }

}