:root{
    --ink:#20221e;
    --paper:#ffffff;
    --cream:#ffffff;
    --gold:#c89532;
    --green:#536551;
    --line:rgba(32,34,30,.16);
    --muted:#676860;
    --radius:18px;
    --marker:'Permanent Marker',cursive;
    --sans:'Manrope',sans-serif;
    --mono:'DM Mono',monospace
}

*{
    box-sizing:border-box
}

html{
    scroll-behavior:smooth
}

body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
    font-size:16px;
    line-height:1.55
}

a{
    color:inherit;
    text-decoration:none
}

button,
input,
textarea{
    font:inherit
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.skip-link{
    position:fixed;
    left:1rem;
    top:-5rem;
    z-index:99;
    padding:.6rem 1rem;
    background:var(--gold);
    color:var(--ink)
}

.skip-link:focus{
    top:1rem
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header{
    position:sticky;
    top:0;
    z-index:20;
    background:rgba(255,255,255,.94);
    backdrop-filter:blur(12px);
    border-bottom:1px solid transparent
}

.nav-shell{
    max-width:1280px;
    height:78px;
    margin:auto;
    padding:0 32px;
    display:flex;
    align-items:center;
    justify-content:space-between
}

.brand{
    font-size:20px;
    font-weight:800;
    letter-spacing:-1px;
    display:flex;
    align-items:center;
    gap:9px;
    white-space:nowrap
}

/* =========================================================
   EXPLOREZA PUBLIC SITE
   ========================================================= */

:root{
    --ez-ink:#111111;
    --ez-muted:#656565;
    --ez-line:rgba(17,17,17,.12);
    --ez-soft:#f6f4ef;
    --ez-sage:#56624f;
    --ez-sand:#d7b56d;
    --ez-radius:8px
}

.page-home,
.page-destinations,
.page-experiences,
.page-stays,
.page-routes,
.page-guides,
.page-about,
.page-work,
.page-contact{
    background:#fff;
    color:var(--ez-ink)
}

.brand-logo-img{
    width:210px
}

.main-nav{
    gap:18px;
    font-size:12px
}

.instagram-link{
    color:var(--ez-sage)
}

.ez-hero{
    position:relative;
    min-height:680px;
    display:grid;
    align-items:end;
    overflow:hidden;
    background:#111
}

.ez-hero>img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.68
}

.ez-hero:after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.3) 55%,rgba(0,0,0,.08))
}

.ez-hero-copy{
    position:relative;
    z-index:1;
    width:min(820px,calc(100% - 48px));
    margin:0 auto;
    padding:120px 0 92px;
    color:#fff
}

.ez-hero-copy .eyebrow,
.ez-hero-copy h1{
    color:#fff
}

.ez-hero-copy h1{
    font-size:clamp(3.1rem,7vw,6.8rem);
    line-height:.94;
    max-width:760px;
    margin:0 0 24px
}

.ez-hero-copy p:not(.eyebrow){
    max-width:640px;
    font-size:1.16rem;
    color:rgba(255,255,255,.88)
}

.ez-hero .text-link{
    color:#fff
}

.ez-section{
    width:min(1180px,calc(100% - 48px));
    margin:0 auto;
    padding:76px 0
}

.ez-muted{
    width:100%;
    max-width:none;
    padding-left:max(24px,calc((100vw - 1180px)/2));
    padding-right:max(24px,calc((100vw - 1180px)/2));
    background:var(--ez-soft)
}

.ez-intro{
    display:grid;
    grid-template-columns:.75fr 1.25fr;
    gap:42px;
    align-items:start
}

.ez-intro h2,
.ez-page-hero h1,
.ez-final-cta h2{
    font-size:clamp(2.2rem,4vw,4.6rem);
    line-height:1;
    margin:0
}

.ez-intro p:last-child{
    font-size:1.08rem;
    color:var(--ez-muted)
}

.section-heading{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:24px
}

.section-heading h2{
    font-size:clamp(2rem,3.5vw,3.6rem)
}

.ez-card-grid{
    display:grid;
    gap:18px
}

.ez-card-grid-4{
    grid-template-columns:repeat(4,minmax(0,1fr))
}

.ez-card-grid-3{
    grid-template-columns:repeat(3,minmax(0,1fr))
}

.ez-image-card,
.ez-destination-card,
.ez-guide-card,
.ez-text-card{
    border:1px solid var(--ez-line);
    border-radius:var(--ez-radius);
    background:#fff;
    overflow:hidden
}

.ez-image-card{
    min-height:360px;
    display:grid;
    grid-template-rows:190px auto auto;
    padding-bottom:18px
}

.ez-image-card img,
.ez-destination-card img,
.ez-guide-card img{
    width:100%;
    height:100%;
    object-fit:cover
}

.ez-image-card span,
.ez-image-card p,
.ez-destination-card div,
.ez-guide-card div,
.ez-text-card{
    padding-left:18px;
    padding-right:18px
}

.ez-image-card span{
    display:block;
    padding-top:18px;
    font-size:1.08rem;
    font-weight:800
}

.ez-image-card p,
.ez-destination-card p,
.ez-guide-card p,
.ez-text-card p{
    color:var(--ez-muted)
}

.ez-destination-card,
.ez-guide-card{
    display:grid;
    grid-template-rows:220px 1fr
}

.ez-destination-card div,
.ez-guide-card div{
    padding-top:18px;
    padding-bottom:20px
}

.ez-destination-card h2,
.ez-destination-card h3,
.ez-guide-card h2,
.ez-guide-card h3,
.ez-text-card h2{
    margin:0 0 10px;
    font-size:1.24rem
}

.ez-text-card{
    padding:24px;
    min-height:210px
}

.ez-page-hero{
    width:min(980px,calc(100% - 48px));
    margin:0 auto;
    padding:96px 0 54px
}

.ez-page-hero p:not(.eyebrow){
    max-width:760px;
    color:var(--ez-muted);
    font-size:1.12rem
}

.ez-country-strip{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:22px
}

.ez-country-strip span{
    border:1px solid var(--ez-line);
    border-radius:999px;
    padding:8px 12px;
    font-weight:800;
    font-size:.82rem
}

.ez-split{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:44px
}

.ez-split p{
    color:var(--ez-muted)
}

.ez-final-cta{
    width:min(1180px,calc(100% - 48px));
    margin:0 auto 80px;
    padding:64px;
    border-radius:var(--ez-radius);
    background:#111;
    color:#fff
}

.ez-final-cta h2,
.ez-final-cta .eyebrow,
.ez-final-cta .text-link{
    color:#fff
}

.ez-final-cta .text-link{
    border-bottom-color:rgba(255,255,255,.5)
}

@media (max-width:1100px){
    .main-nav{
        gap:14px
    }

    .ez-card-grid-4{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

    .ez-card-grid-3{
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
}

@media (max-width:820px){
    .ez-hero{
        min-height:620px
    }

    .ez-hero-copy{
        width:min(100% - 32px,720px);
        padding:96px 0 70px
    }

    .ez-section,
    .ez-page-hero,
    .ez-final-cta{
        width:min(100% - 32px,720px)
    }

    .ez-intro,
    .ez-split,
    .ez-card-grid-4,
    .ez-card-grid-3{
        grid-template-columns:1fr
    }

    .section-heading{
        display:block
    }

    .ez-muted{
        padding-left:16px;
        padding-right:16px
    }

    .ez-final-cta{
        padding:36px 22px
    }
}

.brand-logo-img{
    display:block;
    width:220px;
    max-width:42vw;
    height:auto
}

.brand em{
    font-family:var(--marker);
    font-style:normal;
    font-weight:400;
    color:var(--gold);
    letter-spacing:0
}

.brand-mark{
    background:var(--ink);
    color:var(--paper);
    height:29px;
    width:34px;
    display:grid;
    place-items:center;
    border-radius:8px;
    font:14px var(--marker);
    letter-spacing:0;
    transform:rotate(-7deg)
}

.main-nav{
    display:flex;
    align-items:center;
    gap:29px;
    font-size:13px;
    font-weight:700
}

.main-nav>a:not(.button):not(.cart-link){
    position:relative
}

.main-nav>a[aria-current=page]:after{
    content:'';
    height:3px;
    border-radius:3px;
    background:var(--gold);
    position:absolute;
    left:0;
    right:0;
    bottom:-11px
}

.cart-link{
    border-left:1px solid var(--line);
    padding-left:25px
}

.button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    background:var(--gold);
    border:1px solid var(--gold);
    color:var(--ink);
    padding:15px 22px;
    border-radius:99px;
    font-weight:800;
    font-size:13px;
    cursor:pointer;
    transition:
        transform .2s ease,
        background .2s ease,
        box-shadow .2s ease
}

.button:hover{
    transform:translateY(-2px);
    background:#d8a63e;
    box-shadow:0 8px 20px rgba(200,149,50,.2)
}

.button span,
.text-link span{
    font-size:19px;
    line-height:12px
}

.button-small{
    padding:10px 17px;
    font-size:12px
}

.menu-toggle{
    display:none;
    background:none;
    border:0;
    padding:10px
}

.menu-toggle span{
    display:block;
    width:22px;
    height:2px;
    background:var(--ink);
    margin:4px
}


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

.hero{
    min-height:650px;
    max-width:1280px;
    margin:auto;
    padding:85px 32px 70px;
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    gap:50px;
    align-items:center
}

.eyebrow{
    text-transform:uppercase;
    letter-spacing:1.5px;
    font:11px var(--mono);
    font-weight:500;
    color:var(--green);
    margin:0 0 15px
}

.hero h1,
.page-hero h1{
    font-size:clamp(50px,6.7vw,91px);
    line-height:.98;
    letter-spacing:-5px;
    margin:0;
    max-width:690px
}

.hero h1 i,
.page-hero h1 i{
    font-family:var(--marker);
    font-size:.87em;
    font-weight:400;
    letter-spacing:-3px;
    color:var(--gold);
    white-space:nowrap
}

.hero-text{
    max-width:470px;
    font-size:18px;
    margin:28px 0
}

.hero-actions{
    display:flex;
    align-items:center;
    gap:28px
}

.text-link{
    font-weight:800;
    font-size:13px;
    display:inline-flex;
    gap:9px;
    align-items:center
}

.text-link:hover{
    color:var(--green)
}


/* =========================================================
   HERO PRODUCT SHOWCASE
   ========================================================= */

.hero-showcase{
    position:relative;
    min-height:500px;
    width:100%;
    padding:22px 15px 30px
}

.showcase-main{
    position:relative;
    display:block;
    width:min(430px,78%);
    margin-left:auto;
    margin-right:4%;
    border-radius:22px;
    overflow:hidden;
    background:#ffffff;
    border:1px solid rgba(32,34,30,.12);
    box-shadow:0 24px 55px rgba(32,34,30,.12);
    transition:
        transform .25s ease,
        box-shadow .25s ease;
    z-index:2
}

.showcase-main:hover{
    transform:translateY(-6px) rotate(.5deg);
    box-shadow:0 30px 65px rgba(32,34,30,.17)
}

.showcase-image{
    position:relative;
    aspect-ratio:1 / 1;
    overflow:hidden;
    background:#f5f5f2
}

.showcase-image img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover
}

.showcase-placeholder{
    width:100%;
    height:100%;
    display:grid;
    place-items:center;
    background:#f5f5f2;
    color:var(--gold)
}

.showcase-placeholder span{
    font-size:70px
}

.showcase-badge{
    position:absolute;
    top:16px;
    left:16px;
    background:var(--gold);
    color:var(--ink);
    padding:8px 11px;
    border-radius:999px;
    font:10px var(--mono);
    letter-spacing:1px;
    font-weight:700
}

.showcase-main-info{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
    padding:19px 20px 21px
}

.showcase-label{
    display:block;
    margin-bottom:5px;
    font:10px var(--mono);
    letter-spacing:1px;
    text-transform:uppercase;
    color:var(--green)
}

.showcase-main-info h2{
    margin:0;
    max-width:250px;
    font-size:17px;
    line-height:1.25;
    letter-spacing:-.4px
}

.showcase-main-info strong{
    flex:none;
    color:var(--green);
    font-size:15px
}

.showcase-secondary{
    position:absolute;
    left:1%;
    top:85px;
    width:46%;
    display:flex;
    flex-direction:column;
    gap:17px;
    z-index:3
}

.showcase-card{
    width:255px;
    display:grid;
    grid-template-columns:92px 1fr;
    background:#ffffff;
    border:1px solid rgba(32,34,30,.11);
    border-radius:17px;
    overflow:hidden;
    box-shadow:0 16px 38px rgba(32,34,30,.10);
    transition:
        transform .22s ease,
        box-shadow .22s ease
}

.showcase-card:hover{
    box-shadow:0 21px 43px rgba(32,34,30,.14)
}

.showcase-card-one{
    transform:rotate(-4deg)
}

.showcase-card-two{
    margin-left:40px;
    transform:rotate(4deg)
}

.showcase-card-one:hover{
    transform:rotate(-4deg) translateY(-4px)
}

.showcase-card-two:hover{
    transform:rotate(4deg) translateY(-4px)
}

.showcase-card-image{
    height:110px;
    overflow:hidden;
    background:#f5f5f2
}

.showcase-card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}

.showcase-card-info{
    padding:11px 12px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-width:0
}

.showcase-card-info span{
    font:9px var(--mono);
    text-transform:uppercase;
    letter-spacing:1px;
    color:var(--green);
    margin-bottom:4px
}

.showcase-card-info h3{
    font-size:11px;
    line-height:1.25;
    margin:0 0 7px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden
}

.showcase-card-info strong{
    font-size:11px;
    color:var(--green)
}

.showcase-note{
    position:absolute;
    left:5%;
    bottom:4px;
    display:flex;
    align-items:center;
    gap:9px;
    font:17px var(--marker);
    color:var(--ink);
    transform:rotate(-4deg)
}

.showcase-note-dot{
    width:9px;
    height:9px;
    background:var(--gold);
    border-radius:50%
}

.showcase-empty{
    min-height:420px;
    border:1px dashed rgba(32,34,30,.18);
    border-radius:22px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    background:#fafaf8;
    padding:30px
}

.showcase-empty-icon{
    font-size:60px;
    color:var(--gold);
    margin-bottom:15px
}

.showcase-empty p{
    color:var(--muted);
    margin:0 0 20px
}


/* =========================================================
   TICKER
   ========================================================= */

.ticker{
    background:var(--ink);
    color:var(--paper);
    padding:13px 8px;
    display:flex;
    gap:27px;
    justify-content:center;
    overflow:hidden;
    white-space:nowrap;
    font:11px var(--mono);
    letter-spacing:1.3px
}

.ticker b{
    color:var(--gold)
}


/* =========================================================
   GENERAL SECTIONS
   ========================================================= */

.section{
    max-width:1280px;
    margin:auto;
    padding:112px 32px
}

.section-heading{
    display:flex;
    justify-content:space-between;
    align-items:end;
    margin-bottom:37px
}

.section-heading h2,
.why-content h2,
.what-we-do h2,
.belief-section h2,
.stock-section h2{
    font-size:clamp(33px,4vw,53px);
    letter-spacing:-2.8px;
    line-height:1.05;
    margin:0
}

.section-heading p:not(.eyebrow){
    margin:12px 0 0;
    color:var(--muted);
    max-width:480px
}


/* =========================================================
   PRODUCT GRID
   ========================================================= */

.product-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px
}

.product-card{
    border-radius:var(--radius);
    overflow:hidden;
    background:#fff;
    box-shadow:0 4px 20px rgba(32,34,30,.05);
    transition:
        transform .25s ease,
        box-shadow .25s ease
}

.product-card:hover{
    transform:translateY(-6px);
    box-shadow:0 13px 28px rgba(32,34,30,.13)
}

.product-image{
    height:275px;
    display:grid;
    place-content:center;
    text-align:center;
    position:relative;
    color:var(--paper);
    overflow:hidden;
    background:#f5f5f2
}

.product-image img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover
}

.product-image span{
    font-size:115px;
    line-height:.7;
    z-index:1
}

.product-image small{
    font:10px var(--mono);
    letter-spacing:1px;
    text-transform:uppercase;
    margin-top:15px;
    z-index:1
}

.product-info{
    padding:18px
}

.product-info p{
    font:10px var(--mono);
    color:var(--green);
    text-transform:uppercase;
    margin:0 0 7px
}

.product-info h3{
    font-size:14px;
    margin:0 0 12px
}

.product-info span{
    font-size:12px;
    color:var(--muted)
}

.mobile-link{
    display:none
}

.store-empty{
    padding:30px;
    text-align:center;
    color:var(--muted)
}

.store-empty a{
    color:var(--green);
    font-weight:800
}


/* =========================================================
   CATEGORIES
   ========================================================= */

.categories-section{
    padding-top:25px
}

.category-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:11px
}

.category-card{
    height:136px;
    background:#f0eee8;
    padding:14px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    border-radius:13px;
    font-weight:800;
    font-size:13px;
    transition:
        transform .2s ease,
        box-shadow .2s ease
}

.category-card:hover{
    transform:rotate(-2deg) translateY(-3px);
    box-shadow:0 10px 25px rgba(32,34,30,.1)
}

.category-card b{
    align-self:end;
    font-size:21px
}

.category-1,
.category-5{
    background:#d0a85d
}

.category-2{
    background:#708069;
    color:#fff
}

.category-3{
    background:#e8e6df
}

.category-4{
    background:#797b72;
    color:#fff
}


/* =========================================================
   WHY SECTION
   ========================================================= */

.why-section{
    display:grid;
    grid-template-columns:1fr 1.15fr;
    gap:10%;
    align-items:center
}

.why-image{
    height:510px;
    border-radius:49% 49% 16px 16px;
    background:var(--gold);
    position:relative;
    display:grid;
    place-items:center;
    overflow:hidden
}

.why-image:before{
    content:'✦';
    position:absolute;
    color:var(--ink);
    font-size:350px;
    opacity:.12
}

.why-image span{
    font:clamp(47px,6vw,75px)/.9 var(--marker);
    color:var(--ink);
    transform:rotate(-7deg);
    z-index:1
}

.benefit-list{
    margin-top:32px
}

.benefit-list article{
    display:grid;
    grid-template-columns:42px 1fr;
    border-top:1px solid var(--line);
    padding:17px 0
}

.benefit-list b{
    font:11px var(--mono);
    color:var(--gold)
}

.benefit-list h3{
    font-size:15px;
    margin:0
}

.benefit-list p{
    margin:5px 0 0;
    font-size:13px;
    color:var(--muted)
}


/* =========================================================
   PROCESS
   ========================================================= */

.process-section{
    padding-top:37px
}

.centered{
    text-align:center;
    display:block
}

.process-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    margin-top:40px
}

.process-grid article{
    padding:22px;
    border-left:1px solid var(--line)
}

.process-grid article:first-child{
    border-left:0
}

.process-grid b{
    font:25px var(--marker);
    color:var(--gold)
}

.process-grid h3{
    font-size:16px;
    margin:34px 0 7px
}

.process-grid p{
    font-size:13px;
    color:var(--muted);
    margin:0
}


/* =========================================================
   STORE CTA
   ========================================================= */

.store-cta{
    background:var(--green);
    color:var(--paper);
    text-align:center;
    padding:105px 20px
}

.store-cta .eyebrow{
    color:#e4b965
}

.store-cta h2{
    font-size:clamp(44px,6vw,72px);
    letter-spacing:-4px;
    line-height:1;
    margin:0
}

.store-cta>p:not(.eyebrow){
    max-width:510px;
    margin:25px auto
}

.button-light{
    background:var(--paper);
    border-color:var(--paper);
    margin-top:10px
}


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

.site-footer{
    background:var(--ink);
    color:var(--paper);
    padding:68px max(32px,calc((100vw - 1216px)/2)) 22px
}

.footer-top{
    display:grid;
    grid-template-columns:2fr repeat(3,1fr);
    gap:56px
}

.footer-brand{
    max-width:340px
}

.brand-footer{
    display:inline-flex;
    background:#ffffff;
    border-radius:10px;
    padding:8px 10px
}

.brand-footer .brand-logo-img{
    width:230px;
    max-width:100%
}

.footer-tagline{
    font:26px/1.1 var(--marker);
    margin:18px 0 8px;
    color:#ffffff
}

.footer-copy{
    font-size:12px;
    line-height:1.6;
    color:#aaa99f;
    margin:0;
    max-width:280px
}

.footer-column h2{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:1.4px;
    color:var(--gold);
    margin:4px 0 16px
}

.footer-column a{
    display:block;
    font-size:13px;
    color:#d8d6ce;
    margin:0 0 9px;
    transition:color .2s ease
}

.footer-column a:hover{
    color:var(--gold)
}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.15);
    margin-top:55px;
    padding-top:18px;
    display:flex;
    justify-content:space-between;
    gap:20px;
    color:#aaa99f;
    font:10px var(--mono)
}

@media(max-width:800px){

    .site-footer{
        padding:52px 20px 20px
    }

    .footer-top{
        grid-template-columns:1fr 1fr;
        gap:34px 28px
    }

    .footer-brand{
        grid-column:1/-1;
        max-width:100%
    }

    .footer-bottom{
        display:block;
        line-height:2
    }

    .footer-bottom span{
        display:block
    }
}

@media(max-width:480px){

    .footer-top{
        grid-template-columns:1fr
    }

    .footer-brand{
        grid-column:auto
    }
}

/* =========================================================
   ABOUT / CONTENT PAGES
   ========================================================= */

.page-hero{
    max-width:1280px;
    margin:auto;
    padding:125px 32px 104px;
    background:radial-gradient(
        circle at 82% 10%,
        rgba(200,149,50,.25),
        transparent 22%
    )
}

.page-hero p:not(.eyebrow){
    max-width:640px;
    font-size:18px;
    margin:28px 0 0
}

.split-story{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:15%;
    align-items:center;
    background:#ffffff;
    max-width:none;
    padding-left:max(32px,calc((100vw - 1216px)/2));
    padding-right:max(32px,calc((100vw - 1216px)/2))
}

.story-stamp{
    height:270px;
    width:270px;
    border-radius:50%;
    background:var(--green);
    display:grid;
    place-content:center;
    text-align:center;
    color:var(--paper);
    font:44px/1 var(--marker);
    transform:rotate(-10deg)
}

.split-story h2{
    font-size:clamp(33px,4vw,52px);
    line-height:1.05;
    letter-spacing:-2px;
    margin:0
}

.split-story p:not(.eyebrow){
    max-width:620px;
    color:#4c4e47
}

.what-we-do{
    padding-bottom:40px
}

.what-we-do h2{
    max-width:600px
}

.check-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin-top:42px
}

.check-grid span{
    padding:20px;
    border:1px solid var(--line);
    border-radius:10px;
    font-weight:700;
    font-size:14px
}

.check-grid span:before{
    content:'✓';
    color:var(--gold);
    font-size:19px;
    margin-right:10px
}

.belief-section{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10%;
    background:var(--ink);
    color:var(--paper);
    max-width:none;
    padding-left:max(32px,calc((100vw - 1216px)/2));
    padding-right:max(32px,calc((100vw - 1216px)/2))
}

.belief-section .eyebrow{
    color:var(--gold)
}

.belief-section p{
    color:#d2d0c8;
    max-width:480px;
    margin-top:0
}

.belief-section .text-link{
    color:var(--gold);
    margin-top:20px
}

.stock-section{
    text-align:center;
    padding:130px 32px
}

.stock-section .eyebrow{
    margin-bottom:20px
}

.stock-section p:last-child{
    max-width:570px;
    margin:25px auto;
    color:var(--muted)
}


/* =========================================================
   CONTACT
   ========================================================= */

.contact-hero{
    padding-bottom:73px
}

.contact-layout{
    display:grid;
    grid-template-columns:1.35fr .65fr;
    gap:11%;
    padding-top:30px
}

.contact-form{
    background:#ffffff;
    padding:33px;
    border-radius:var(--radius);
    border:1px solid rgba(32,34,30,.08)
}

.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px
}

.contact-form label{
    display:block;
    font-weight:700;
    font-size:12px;
    margin-bottom:18px
}

.contact-form input,
.contact-form textarea{
    display:block;
    width:100%;
    background:var(--paper);
    border:1px solid rgba(32,34,30,.12);
    border-radius:7px;
    padding:12px;
    margin-top:6px;
    outline:0
}

.contact-form input:focus,
.contact-form textarea:focus{
    border-color:var(--gold)
}

.contact-form textarea{
    resize:vertical
}

.form-note{
    font-size:11px;
    color:var(--muted);
    margin:17px 0 0
}

.contact-details h2{
    font-size:39px;
    letter-spacing:-2px;
    margin:0 0 34px
}

.contact-details>div{
    border-top:1px solid var(--line);
    padding:17px 0
}

.contact-details h3{
    font:10px var(--mono);
    text-transform:uppercase;
    letter-spacing:1px;
    color:var(--green);
    margin:0 0 5px
}

.contact-details p,
.contact-details a{
    font-size:14px;
    margin:0
}

.contact-details a:hover{
    color:var(--gold)
}


/* =========================================================
   LEGAL PAGES
   ========================================================= */

.legal-hero{
    max-width:1280px;
    margin:auto;
    padding:105px 32px 68px;
    background:radial-gradient(
        circle at 80% 20%,
        rgba(200,149,50,.2),
        transparent 24%
    )
}

.legal-hero h1{
    font-size:clamp(44px,6vw,72px);
    line-height:1;
    letter-spacing:-3px;
    margin:0
}

.legal-hero>p:last-child{
    font:11px var(--mono);
    color:var(--muted);
    margin-top:22px
}

.legal-content{
    max-width:820px;
    margin:0 auto;
    padding:65px 32px 110px
}

.legal-content .legal-lead{
    font-size:20px;
    line-height:1.55;
    color:var(--green);
    margin-top:0
}

.legal-content h2{
    font-size:25px;
    letter-spacing:-1px;
    margin:45px 0 10px
}

.legal-content p,
.legal-content li{
    color:#50524b
}

.legal-content a{
    color:var(--green);
    font-weight:800;
    text-decoration:underline;
    text-underline-offset:3px
}

.legal-content ol{
    padding-left:22px
}

.legal-content li{
    margin:9px 0
}

.error-hero .hero-actions{
    margin-top:30px
}


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

@media(max-width:1000px){

    .hero{
        grid-template-columns:1fr;
        padding-top:70px
    }

    .hero-copy{
        max-width:680px
    }

    .hero-showcase{
        max-width:680px;
        margin:20px auto 0;
        min-height:470px
    }

    .showcase-main{
        width:390px;
        margin-right:5%
    }

    .showcase-secondary{
        left:0;
        top:95px
    }
}


@media(max-width:800px){

    .nav-shell{
        height:68px;
        padding:0 20px
    }

    .brand-logo-img{
        width:176px;
        max-width:58vw
    }

    .menu-toggle{
        display:block;
        z-index:2
    }

    .main-nav{
        position:absolute;
        top:68px;
        left:0;
        right:0;
        background:var(--paper);
        display:none;
        padding:20px;
        box-shadow:0 10px 20px rgba(0,0,0,.09);
        align-items:stretch;
        gap:0
    }

    .main-nav.is-open{
        display:flex;
        flex-direction:column
    }

    .main-nav>a{
        padding:13px 0
    }

    .main-nav>a[aria-current=page]:after{
        display:none
    }

    .cart-link{
        border-left:0;
        padding-left:0
    }

    .main-nav .button{
        text-align:center;
        margin-top:10px
    }

    .hero{
        padding:68px 20px 50px;
        display:block;
        min-height:auto
    }

    .hero h1,
    .page-hero h1{
        letter-spacing:-3px
    }

    .hero-showcase{
        min-height:420px;
        padding:15px 0 40px
    }

    .showcase-main{
        width:75%;
        margin-right:0;
        margin-left:auto
    }

    .showcase-secondary{
        left:0;
        top:80px;
        width:auto
    }

    .showcase-card{
        width:220px;
        grid-template-columns:75px 1fr
    }

    .showcase-card-image{
        height:92px
    }

    .showcase-card-two{
        margin-left:25px
    }

    .showcase-note{
        left:4%;
        bottom:4px;
        font-size:15px
    }

    .section{
        padding:72px 20px
    }

    .section-heading{
        margin-bottom:25px
    }

    .desktop-link{
        display:none
    }

    .product-grid{
        grid-template-columns:repeat(2,1fr);
        gap:12px
    }

    .product-image{
        height:200px
    }

    .product-image span{
        font-size:80px
    }

    .product-info{
        padding:13px
    }

    .product-info h3{
        font-size:13px
    }

    .mobile-link{
        display:flex;
        margin:25px auto 0;
        width:max-content
    }

    .category-grid{
        grid-template-columns:repeat(2,1fr)
    }

    .category-card{
        height:105px
    }

    .why-section{
        display:flex;
        flex-direction:column;
        gap:35px
    }

    .why-image{
        width:100%;
        height:330px
    }

    .process-grid{
        grid-template-columns:repeat(2,1fr);
        gap:0
    }

    .process-grid article:nth-child(odd){
        border-left:0
    }

    .process-grid article{
        border-top:1px solid var(--line)
    }

    .process-grid h3{
        margin-top:20px
    }

    .store-cta{
        padding:75px 20px
    }

    .site-footer{
        padding:48px 20px 20px
    }

    .footer-top{
        grid-template-columns:1fr 1fr;
        gap:30px
    }

    .footer-top>div:first-child{
        grid-column:1/-1
    }

    .footer-bottom{
        display:block;
        line-height:2
    }

    .footer-bottom span{
        display:block
    }

    .page-hero{
        padding:82px 20px 68px
    }

    .page-hero p:not(.eyebrow){
        font-size:16px
    }

    .split-story{
        grid-template-columns:1fr;
        padding:65px 20px;
        gap:40px
    }

    .story-stamp{
        height:180px;
        width:180px;
        font-size:32px
    }

    .check-grid{
        grid-template-columns:1fr 1fr;
        margin-top:28px
    }

    .belief-section{
        grid-template-columns:1fr;
        padding:72px 20px;
        gap:28px
    }

    .stock-section{
        padding:90px 20px
    }

    .contact-layout{
        grid-template-columns:1fr;
        gap:45px;
        padding-top:15px
    }

    .contact-form{
        padding:22px
    }

    .form-row{
        grid-template-columns:1fr;
        gap:0
    }
}


@media(max-width:560px){

    .hero-showcase{
        min-height:520px;
        padding-top:10px
    }

    .showcase-main{
        width:86%;
        margin-left:auto
    }

    .showcase-secondary{
        top:105px;
        left:0
    }

    .showcase-card{
        width:190px;
        grid-template-columns:65px 1fr
    }

    .showcase-card-image{
        height:84px
    }

    .showcase-card-info{
        padding:9px
    }

    .showcase-card-info h3{
        font-size:10px
    }

    .showcase-card-info strong{
        font-size:10px
    }

    .showcase-main-info{
        padding:15px
    }

    .showcase-main-info h2{
        font-size:14px
    }

    .showcase-main-info strong{
        font-size:13px
    }

    .showcase-note{
        left:2%;
        bottom:0
    }

    .check-grid{
        grid-template-columns:1fr
    }
}


@media(max-width:420px){

    .hero-showcase{
        min-height:480px
    }

    .showcase-main{
        width:88%
    }

    .showcase-secondary{
        top:112px
    }

    .showcase-card{
        width:165px;
        grid-template-columns:57px 1fr
    }

    .showcase-card-image{
        height:75px
    }

    .showcase-card-info{
        padding:8px
    }

    .showcase-card-info h3{
        font-size:9px
    }

    .showcase-card-info strong{
        font-size:9px
    }

    .showcase-main-info{
        display:block
    }

    .showcase-main-info strong{
        display:block;
        margin-top:8px
    }

    .showcase-note{
        font-size:13px
    }
}


@media(max-width:390px){

    .product-grid{
        grid-template-columns:1fr
    }

    .product-image{
        height:230px
    }

    .footer-top{
        grid-template-columns:1fr
    }

    .footer-top>div:first-child{
        grid-column:auto
    }

    .hero-actions{
        gap:18px
    }

    .button{
        padding:13px 17px
    }
}


@media(max-width:600px){

    .editorial-anchor{
        margin:4rem 0;
        padding:3.5rem 1rem
    }

    .editorial-anchor h2{
        font-size:1.9rem
    }
}

/* ExploreZA cascade overrides */
.brand-logo-img{
    width:210px
}

.main-nav{
    gap:18px;
    font-size:12px
}

.instagram-link{
    color:var(--ez-sage)
}

.ez-card-grid{
    display:grid
}

@media(max-width:1100px){
    .main-nav{
        gap:14px
    }
}

/* ExploreZA old-site inspired personal journal skin */
body[class^="page-"],
body[class*=" page-"]{
    background:#fff;
    color:#050505;
    font-family:Arial, Helvetica, sans-serif
}

.site-header{
    position:static;
    background:#fff;
    border:0;
    box-shadow:none
}

.nav-shell{
    max-width:1180px;
    height:auto;
    margin:0 auto;
    padding:28px 22px 22px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:22px
}

.brand-logo-img{
    width:min(320px, 70vw);
    height:auto
}

.main-nav{
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:24px 42px;
    font-size:14px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase
}

.main-nav a{
    color:#050505;
    padding:0;
    border:0
}

.main-nav a:hover,
.main-nav a[aria-current="page"]{
    color:#d17600
}

.menu-toggle{
    top:34px
}

.ez-old-hero{
    position:relative;
    max-width:1150px;
    min-height:345px;
    margin:10px auto 24px;
    border-radius:40px;
    overflow:hidden;
    display:grid;
    place-items:center;
    text-align:center
}

.ez-old-hero::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,.45)), rgba(0,0,0,.12)
}

.ez-old-hero img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover
}

.ez-old-hero-copy{
    position:relative;
    z-index:1;
    max-width:650px;
    padding:30px;
    color:#fff
}

.ez-old-hero-copy h1{
    margin:0 0 20px;
    font-size:clamp(38px, 5vw, 56px);
    line-height:.9;
    text-transform:uppercase;
    font-weight:900;
    letter-spacing:-.06em
}

.ez-old-hero-copy h2{
    margin:0 0 6px;
    font-size:clamp(19px, 2.6vw, 28px);
    line-height:1;
    text-transform:uppercase;
    font-weight:900;
    letter-spacing:-.06em
}

.ez-old-hero-copy p{
    margin:0 auto;
    max-width:640px;
    font-size:15px;
    line-height:1.08;
    font-weight:600
}

.ez-old-note{
    max-width:1040px;
    margin:0 auto 36px;
    padding:0 20px;
    text-align:center
}

.ez-old-note h2{
    margin:0;
    font-size:24px;
    line-height:1.25
}

.ez-section.ez-old-section{
    max-width:1160px;
    margin:0 auto;
    padding:34px 20px 24px;
    background:transparent
}

.ez-old-section .section-heading{
    max-width:760px;
    margin:0 auto 34px;
    text-align:center
}

.ez-old-section .section-heading h2,
.ez-old-follow h2{
    margin:0 0 22px;
    font-size:clamp(28px, 3vw, 34px);
    letter-spacing:-.04em;
    color:#050505
}

.ez-old-section .section-heading p,
.ez-old-follow p{
    color:#6b6b6b;
    font-size:16px;
    line-height:1.7
}

.ez-card-grid.ez-card-grid-4{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:20px
}

.ez-card-grid.ez-card-grid-3{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:24px
}

.ez-old-tile{
    display:block;
    text-align:center;
    text-decoration:none;
    color:#050505
}

.ez-old-tile img{
    width:100%;
    aspect-ratio:1.62 / 1;
    object-fit:cover;
    border-radius:8px;
    filter:saturate(.95)
}

.ez-old-tile strong{
    min-height:0;
    margin:-104px 16px 58px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    color:#fff;
    font-size:clamp(24px, 2.2vw, 34px);
    line-height:.92;
    text-transform:uppercase;
    letter-spacing:-.09em;
    font-weight:900;
    text-shadow:0 3px 14px rgba(0,0,0,.45)
}

.ez-old-tile p{
    margin:16px 8px 0;
    color:#656565;
    font-size:15px;
    line-height:1.85
}

.ez-old-follow{
    max-width:900px;
    margin:34px auto 80px;
    padding:0 20px;
    text-align:center
}

.ez-old-follow .hero-actions{
    justify-content:center;
    margin-top:22px
}

.ez-blog-list{
    max-width:1150px;
    margin:0 auto;
    padding:30px 20px 80px
}

.ez-blog-meta{
    display:flex;
    flex-wrap:wrap;
    gap:10px 16px;
    align-items:center;
    color:#4b5563;
    font-size:14px
}

.ez-blog-card h3{
    margin:14px 0 6px;
    color:#050505;
    font-size:20px;
    line-height:1.05;
    letter-spacing:-.04em
}

.ez-blog-card .ez-blog-meta{
    justify-content:center;
    font-size:12px
}

.ez-blog-article{
    max-width:1150px;
    margin:40px auto 90px;
    padding:0 20px
}

.ez-blog-article-header{
    display:grid;
    grid-template-columns:1fr auto;
    gap:24px;
    align-items:end;
    margin-bottom:44px
}

.ez-blog-article h1{
    max-width:900px;
    font-size:clamp(32px, 4vw, 54px);
    line-height:1.04;
    letter-spacing:-.055em
}

.ez-blog-article img{
    width:100%;
    max-height:520px;
    object-fit:cover;
    border-radius:8px;
    margin:0 0 38px
}

.ez-blog-content{
    max-width:880px;
    color:#4b5563;
    font-size:17px;
    line-height:1.85
}

.ez-blog-content h2,
.ez-blog-content h3{
    color:#050505;
    line-height:1.15;
    margin-top:34px
}

.ez-blog-content p{
    margin:0 0 20px
}

.ez-pill{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:4px 10px;
    border-radius:6px;
    background:#eaf2ff;
    color:#006cff;
    font-size:13px;
    font-weight:700;
    text-decoration:none
}

.ez-page-hero{
    width:min(980px, calc(100% - 48px));
    margin:0 auto;
    padding:64px 0 44px;
    text-align:center
}

.ez-page-hero .eyebrow{
    color:#d17600
}

.ez-page-hero h1{
    font-size:clamp(30px, 4vw, 44px);
    line-height:1.05;
    letter-spacing:-.055em
}

.ez-page-hero p:not(.eyebrow){
    margin:22px auto 0;
    max-width:920px;
    color:#686868;
    font-size:16px;
    line-height:1.8
}

.ez-muted{
    background:#fff
}

.ez-text-card{
    border:1px solid #ececec;
    border-radius:10px;
    box-shadow:none
}

.ez-text-card h2{
    letter-spacing:-.04em
}

@media(max-width:980px){
    .ez-card-grid.ez-card-grid-4,
    .ez-card-grid.ez-card-grid-3{
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }

    .ez-blog-article-header{
        grid-template-columns:1fr
    }
}

@media(max-width:720px){
    .nav-shell{
        align-items:center;
        padding:18px 18px
    }

    .menu-toggle{
        display:flex
    }

    .main-nav{
        width:100%;
        display:none;
        gap:16px;
        padding:20px 0 6px
    }

    .main-nav.is-open{
        display:flex
    }

    .ez-old-hero{
        margin:6px 16px 22px;
        min-height:380px;
        border-radius:28px
    }

    .ez-card-grid.ez-card-grid-4,
    .ez-card-grid.ez-card-grid-3{
        grid-template-columns:1fr
    }
}