body{
    font-family: var(--font-body);
    font-weight: 400;
    color: var(--ink);
    background: var(--cream);
    line-height: 1.75;
    overflow-x: hidden;
}

h1,h2,h3,h4{
    font-family: var(--font-display);
    font-weight: 500;
    color: var(--forest);
    line-height: 1.12;
    margin: 0;
}
/* ==========================================================
   HERO SECTION
   ========================================================== */

.hero-section{
    position: relative;
    min-height: 100dvh;
    display: flex;
    /*align-items: center;*/
    overflow: hidden;
}

/* Darken/gradient the background image for text legibility.
   Kadence already applies the bg image via its own row settings;
   this adds an extra gradient on top using a pseudo-element. */
.hero-section::after{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(to left, rgba(27,42,38,.72) 0%, rgba(27,42,38,.42) 42%, rgba(27,42,38,.12) 72%, rgba(27,42,38,.30) 100%),
        linear-gradient(to top, rgba(244,237,231,1) 0%, rgba(244,237,231,0) 26%, rgba(27,42,38,.18) 100%);
}

/* Make sure text content sits above the overlay */
.hero-section > *{
    position: relative;
    z-index: 1;
}

.hero-title{
    color: #fff !important;
    font-family: var(--font-display) !important; /* Values like these are set in home-navigation.css */
    font-weight: 500 !important;
    font-size: clamp(2.9rem, 4.34vw + 1.6rem, 6.8rem) !important;
    line-height: 1.12 !important;
    letter-spacing: -.01em;
    margin: 0 0 1.4rem;
}

.hero-subtitle{
    color: rgba(255,255,255,.94) !important;
    font-family: var(--font-display) !important;
    font-weight: 300 !important;
    font-size: clamp(1.1rem, 0.7rem + 0.8vw, 1.7rem) !important;
    max-width: 34rem;
    margin: 0 0 .7rem;
}

.hero-tagline{
    color: var(--sand) !important;
    font-family: var(--font-display) !important;
    font-style: italic;
    font-weight: 400 !important;
    font-size: clamp(1.15rem, 1.25vw + .7rem, 1.95rem) !important;
    margin: 0 0 2.4rem;
}

/* Eyebrow (small pill label above the H1) */
.hero-eyebrow{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .6rem .85rem;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 9999px;
    background: rgba(255,255,255,.08);
    color: #fff !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 0 1.6rem;
}

.hero-eyebrow-num{
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: 0;
    color: var(--sand);
}

.hero-cta{
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.hero-cta a{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    border-radius: 9999px !important;
    padding: .85rem 1.7rem !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: .98rem;
    transition: transform .35s ease, background .35s ease, box-shadow .35s ease, color .35s ease, border-color .35s ease;
}

/* Primary CTA (sand-filled) */
.hero-cta a:not(.hero-cta-ghost){
    background: var(--sand) !important;
    color: var(--green-deep) !important;
    border: 1px solid var(--sand);
}

.hero-cta a:not(.hero-cta-ghost):hover{
    background: #fff !important;
    color: var(--green-deep) !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px -12px rgba(27,42,38,.55);
}

/* Ghost CTA (outline, transparent) */
.hero-cta-ghost{
    background: rgba(255,255,255,.1) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.4) !important;
}

.hero-cta-ghost:hover{
    background: rgba(255,255,255,.22) !important;
    color: #fff !important;
    transform: translateY(-2px);
}

/* Arrow icon — Kadence renders this as an inline SVG using
   stroke="currentColor", so it inherits the link's `color`.
   We just need to make sure `color` itself is set/changes correctly,
   and nothing overrides the SVG's stroke directly. */
.hero-cta a,
.hero-cta a .kb-svg-icon-wrap svg{
    transition: transform .35s ease, color .35s ease, background .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.hero-cta a:not(.hero-cta-ghost){
    color: var(--green-deep) !important;
}
.hero-cta a:not(.hero-cta-ghost):hover{
    color: var(--green-deep) !important;
}

.hero-cta-ghost{
    color: #fff !important;
}
.hero-cta-ghost:hover{
    color: #fff !important;
}

.hero-cta a .kb-svg-icon-wrap svg{
    stroke: currentColor !important;
    transform: none;
}
.hero-cta a:hover .kb-svg-icon-wrap svg{
    transform: translateX(-4px);
}

/* Hero inner column — 700px on desktop, full width on mobile */
.hero-section .wp-block-column{
    flex-basis: 700px !important;
    max-width: 700px !important;
    min-width: 0 !important;
}

/* Hero row — align content to the right side (RTL start) */
.hero-section .kt-row-column-wrap{
    justify-content: flex-end;
    width: 100%;
}

/* Hero column — fixed width on desktop */
.kadence-column5229_ed5206-73{
    max-width: 760px;
    width: 100%;
    padding-inline-end: var(--gutter) !important;
}

.kadence-column5229_ed5206-73 > .kt-inside-inner-col{
    padding-left: 0 !important;
}

.hero-columns{
    padding-right: 150px;
}

/* Remove the unscoped block entirely and replace with: */
@media (max-width: 767px){
    .hero-section{
        min-height: 100dvh;
        align-items: flex-start;
        padding-top: 6rem;
        text-align: right;
    }

    .hero-section .kt-row-column-wrap{
        flex-direction: column !important;
        justify-content: flex-start !important;
    }

    .hero-section .kadence-column5229_ed5206-73{
        max-width: 100% !important;
        width: 100% !important;
        padding-inline-start: var(--gutter) !important;
        padding-inline-end: var(--gutter) !important;
    }

    /* This overrides the inline style="flex-basis:700px" */
    .hero-section .wp-block-column{
        flex-basis: 100% !important;
        max-width: 100% !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .hero-section .wp-block-columns{
        flex-direction: column !important;
        width: 100% !important;
    }

    .hero-cta{
        flex-direction: column;
        align-items: flex-start;
    }
    
    .hero-columns {
        padding-right: 0px;
    }
}

@media (max-width: 880px){
    .hero-section{
        min-height: 80vh;
        text-align: right;
    }
    .hero-columns {
        padding-right: 0px;
    }
}
@media (min-width: 881px){
    .kadence-column5229_46bfcb-9c{
        flex-basis: 100%;
        width: 100%;
    }
}
/* ==========================================================
   HERO SCROLL INDICATOR
   ========================================================== */

.hero-scroll{
    position: absolute;
    left: 50%;
    bottom: 1.6rem;
    transform: translateX(-50%);
    z-index: 10;
    pointer-events: none;
}

.hero-scroll span{
    color: rgba(255,255,255,.75);
    font-size: .7rem;
    letter-spacing: .3em;
    writing-mode: vertical-rl;
    display: flex;
    align-items: center;
    gap: .6rem;
    font-family: var(--font-body);
}

.hero-scroll i{
    width: 1px;
    height: 34px;
    background: rgba(255,255,255,.5);
    display: block;
    animation: scrollPulse 2.4s ease infinite;
}

@keyframes scrollPulse{
    0%, 100%{
        transform: scaleY(.3);
        opacity: .4;
        transform-origin: top;
    }
    50%{
        transform: scaleY(1);
        opacity: 1;
        transform-origin: top;
    }
}
@media (max-width: 767px){
    .hero-scroll{
        display: none;
    }
}
/* ==========================================================
   FILM SECTION
   ========================================================== */

.film-section{
    background: var(--sage);
    padding: clamp(4rem, 7vw, 7rem) 0;
}

.film-eyebrow{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    padding: .4rem .85rem;
    border: 1px solid var(--rule);
    border-radius: 9999px;
    background: rgba(255,255,255,.55);
    color: var(--green) !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 auto 1.6rem;
}

.film-eyebrow-num {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    color: var(--sand);

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

    width: 1.6em;
    height: 1.6em;

    line-height: 1;
    flex: 0 0 auto;
}

.film-title{
    color: var(--forest) !important;
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(2rem, 2.2vw + 1rem, 4rem) !important;
    text-align: center;
    margin: 0 0 1.1rem;
}

.film-kicker{
    color: var(--forest-soft, var(--green)) !important;
    font-family: var(--font-body) !important;
    font-weight: 600;
    font-size: clamp(1rem, 0.7rem + 0.5vw, 1.2rem) !important;
    max-width: 42rem;
    margin: 0 auto clamp(2.5rem, 5vw, 4rem);
    text-align: center;
}

/* Stage — the positioned container holding image + play + caption */
.film-stage{
    position: relative;
    max-width: 66rem;
    margin-inline: auto;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 40px 90px -40px rgba(27,42,38,.55), 0 0 0 1px var(--rule);
}

.film-stage .kt-inside-inner-col{
    position: relative;
}

.film-stage::after{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(to top, rgba(27,42,38,.55), rgba(27,42,38,.05) 55%, rgba(27,42,38,.25));
}

.film-image{
    position: relative;
    z-index: 0;
}

.film-image img{
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    display: block;
    transform: scale(1.02);
    transition: transform 1.4s ease;
}

.film-stage:hover .film-image img{
    transform: scale(1.07);
}

/* Play button — centered over the image */
.film-play{
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;

    width: clamp(74px, 9vw, 108px);
    height: clamp(74px, 9vw, 108px);
    border-radius: 50%;

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

    background: rgba(255,255,255,.16) !important;
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,.5) !important;

    cursor: pointer;
    padding: 0 !important;
    border-radius: 50% !important;
    transition: transform .5s ease, background .5s ease;
}

.film-play::before{
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.4);
    animation: filmRipple 2.8s ease infinite;
    pointer-events: none;
}

@keyframes filmRipple{
    0%   { transform: scale(1);   opacity: .7; }
    100% { transform: scale(1.7); opacity: 0; }
}

.film-play:hover{
    transform: translate(-50%, -50%) scale(1.08);
    background: rgba(205,171,115,.85) !important;
}

/* Play triangle — works whether it's an icon font, SVG, or plain text "▶" */
.film-play::after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 13px 0 13px 21px;
    border-color: transparent transparent transparent #fff;
    margin-inline-start: 5px;
    transition: border-color .5s ease;
}

.film-play:hover::after{
    border-color: transparent transparent transparent var(--green-deep);
}

/* If Kadence renders an actual icon/text inside the button instead of
   relying on the ::after triangle above, hide it so we don't get two
   overlapping triangles — uncomment if needed:
.film-play .kt-btn-inner-text,
.film-play .kb-svg-icon-wrap{ display:none; }
*/

/* Caption — pinned to bottom of the stage */
.film-caption{
    position: absolute !important;
    inset-inline: 0;
    bottom: clamp(1rem, 2.4vw, 1.8rem);
    z-index: 2;

    text-align: center !important;
    color: rgba(255,255,255,.92) !important;
    font-family: var(--font-body) !important;
    font-size: .9rem !important;
    letter-spacing: .04em;
    margin: 0 !important;
    pointer-events: none;
}

@media (max-width: 880px){
    .film-stage{
        border-radius: 12px;
    }
}

/* ==========================================================
   ESSAY / INTRO SECTION
   ========================================================== */

.essay-section{
    background: linear-gradient(to bottom, var(--cream) 0%, var(--sage-soft, var(--sage)) 35%, var(--sage-soft, var(--sage)) 100%);
    padding: clamp(3.5rem, 6vw, 6.3rem) 0;
}

.essay-lede{
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(1.4rem, 1vw + 1.1rem, 2rem) !important;
    line-height: 1.5 !important;
    color: var(--forest) !important;
    max-width: min(42rem, 64ch);
    margin: 0 0 1.3rem;
}

.essay-body{
    font-family: var(--font-display) !important;
    font-weight: 300 !important;
    font-size: clamp(1.1rem, 0.7rem + 0.8vw, 1.7rem) !important;
    line-height: 1.85 !important;
    color: var(--forest) !important;
    max-width: min(42rem, 64ch);
    margin: 0 0 1.3rem;
}

/* Image column — positioning context for the ORGANIC tag pill */
.essay-image-wrap{
    position: relative;
}

.essay-image img{
    width: 100%;
    border-radius: 16px;
    aspect-ratio: 4/5;
    object-fit: cover;
    display: block;
    box-shadow: 0 36px 80px -44px rgba(27,42,38,.6);
}

.essay-tag{
    position: absolute !important;
    bottom: 1rem;
    inset-inline-start: 1rem;
    z-index: 1;

    background: rgba(244,237,231,.92) !important;
    color: var(--green) !important;
    font-family: var(--font-body) !important;
    font-size: .72rem !important;
    font-weight: 600;
    letter-spacing: .2em;
    padding: .4rem .9rem !important;
    border-radius: 9999px !important;
    margin-bottom: 20px !important;
    width: max-content;
}
.essay-eyebrow{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem .85rem .8rem .85rem;
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 9999px;
    background: #fff;
    color: var(--green) !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 0 1.6rem;
}

.essay-eyebrow-num{
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: 0;
    color: var(--sand);
}
/* ==========================================================
   GET INVOLVED SECTION
   ========================================================== */

.involve-section{
    background: var(--sage);
    padding: clamp(4rem, 7vw, 7rem) 0;
    text-align: center;
}

.involve-section .kt-inside-inner-col{
    max-width: 54rem;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.involve-title{
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(2rem, 2.2vw + 1rem, 4rem) !important;
    color: var(--forest) !important;
    margin: 0 0 1.4rem;
}

.involve-text{
    font-family: var(--font-display) !important;
    font-weight: 300 !important;
    font-size: clamp(1.1rem, 0.7rem + 0.8vw, 1.7rem) !important;
    color: var(--forest-soft, var(--green)) !important;
    line-height: 1.8;
    max-width: 42rem;
    margin: 0 0 2.2rem !important;
}

.involve-btn-wrap{
    text-align: center;
    margin-top: 2.2rem !important;
}

.involve-btn-wrap a{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    background: var(--green) !important;
    color: var(--cream) !important;
    border: 1px solid var(--green);
    border-radius: 9999px;
    padding: .85rem 1.7rem;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: .98rem;
    text-decoration: none;
    transition: transform .4s ease, background .4s ease, box-shadow .4s ease;
}

.involve-btn-wrap a::after{
    content: "←";
    display: inline-block;
    transition: transform .4s ease;
}

.involve-btn-wrap a:hover{
    background: var(--forest) !important;
    color: var(--cream) !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px -12px rgba(27,42,38,.55);
}

.involve-btn-wrap a:hover::after{
    transform: translateX(-4px);
}

/* ==========================================================
   TEAM SECTION
   ========================================================== */

.team-section{
    background: var(--cream) !important;
    padding: clamp(4rem, 7vw, 7rem) 0;
}

.team-eyebrow{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    padding: .4rem .85rem;
    border: 1px solid var(--rule);
    border-radius: 9999px;
    background: rgba(255,255,255,.55);
    color: var(--green) !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 auto 1.6rem;
}

.team-eyebrow-num {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    color: var(--sand);

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

    width: 1.6em;
    height: 1.6em;

    line-height: 1;
    flex: 0 0 auto;
}


.team-title{
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(2rem, 2.2vw + 1rem, 4rem) !important;
    color: var(--forest) !important;
    text-align: center;
    margin: 0 0 clamp(2.5rem, 5vw, 4rem);
}

/* wp-block-columns already handles the two-column layout —
   just constrain width and center */
.team-section .wp-block-columns{
    max-width: 1200px;
    margin-inline: auto !important;
    gap: clamp(1.5rem, 3vw, 2.4rem) !important;
    align-items: stretch !important;
}

.team-section .wp-block-column{
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Card — fixed max-width, centered within its column */
.team-card{
    background: var(--paper);
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: 0 24px 60px -42px rgba(27,42,38,.5), 0 0 0 1px var(--rule) !important;
    transition: transform .55s ease, box-shadow .55s ease;
    border: none !important;
    width: 100%;
    max-width: 680px !important;
}

.team-card:hover{
    transform: translateY(-6px);
    box-shadow: 0 40px 80px -40px rgba(27,42,38,.55), 0 0 0 1px var(--rule) !important;
}

/* Strip default link wrap styling */
.team-card .kt-blocks-info-box-link-wrap{
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* Image container chain */
.team-card .kt-blocks-info-box-media-container{
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.team-card .kt-blocks-info-box-media{
    position: relative;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    overflow: visible;
}

/* Override Kadence's intrinsic ratio system with a fixed height */
.team-card .kadence-info-box-image-intrisic{
    position: relative !important;
    width: 100% !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    height: 320px !important;
    border-radius: 16px 16px 0 0 !important;
    overflow: hidden;
}

.team-card .kadence-info-box-image-inner-intrisic{
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.team-card .kt-info-box-image,
.team-card .kt-info-box-image img{
    width: 100% !important;
    height: 100% !important;
    object-fit: fill !important;
    display: block;
    transition: transform 1.2s ease;
}

.team-card:hover .kt-info-box-image img{
    transform: scale(1.06);
}

/* INSTAGRAM badge */
.team-card .kt-blocks-info-box-media::after{
    content: "INSTAGRAM";
    position: absolute;
    top: 1rem;
    inset-inline-start: 1rem;
    z-index: 1;
    background: rgba(27,42,38,.78);
    color: var(--cream);
    font-family: var(--font-body);
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .18em;
    padding: .35rem .8rem;
    border-radius: 9999px;
    backdrop-filter: blur(4px);
}

/* Text content */
.team-card .kt-infobox-textcontent{
    padding: 1.4rem 1.5rem 1.5rem;
    display: flex;
    flex-direction: column;
    flex: 1;
    text-align: right;
}

.team-card .kt-blocks-info-box-title{
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(1.2rem, 1vw + .9rem, 1.6rem) !important;
    color: var(--forest) !important;
    margin: 0 0 .6rem !important;
    text-align: right !important;
}

.team-card .kt-blocks-info-box-text{
    color: var(--ink-soft, var(--green)) !important;
    font-size: .98rem !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    text-align: right !important;
}

/* "עקבו ב־Instagram" is baked into body text as <strong> */
.team-card .kt-blocks-info-box-text strong{
    color: var(--green) !important;
    font-weight: 600;
    transition: color .3s ease;
}

.team-card:hover .kt-blocks-info-box-text strong{
    color: var(--forest) !important;
}

/* =========================================================
   RES CARD — Kadence FULL BLEED FIX (WORKING VERSION)
   ========================================================= */
   
.res-eyebrow{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    padding: .4rem .85rem;
    border: 1px solid var(--rule);
    border-radius: 9999px;
    background: rgba(255,255,255,.55);
    color: var(--green) !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 auto 1.6rem;
}

.res-eyebrow-num {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    color: var(--sand);

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

    width: 1.6em;
    height: 1.6em;

    line-height: 1;
    flex: 0 0 auto;
}

/* Badge */
.res-overlay .res-badge{
    display: block;
    font-family: var(--font-body);
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .2em;
    color: #e7d6b4;
    margin-bottom: .6rem;
}


/* Learn more link */
.res-more{
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: #fff !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: .92rem;
    text-decoration: none;
}

.res-more .arrow{
    display: inline-block;
    transition: transform .4s ease;
}

.res-card:hover .res-more .arrow{
    transform: translateX(-4px);
}

/* CARD */
.res-card{
    position:relative;
    overflow:hidden;
    border-radius:18px;
    min-height:500px;
    padding:0 !important;
}

/* IMAGE */
.res-card figure{
    margin:0;
    height:100%;
}

.res-card picture,
.res-card img{
    display:block;
    width:100%;
    height:500px;
}

.res-card img{
    object-fit:cover;
    transition:transform 1.2s ease;
}

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

/* DARK OVERLAY */
.res-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(20,20,20,.82),
        rgba(20,20,20,.35) 45%,
        transparent
    );
    z-index:1;
}

/* REMOVE KADENCE COLUMN SPACING */
.res-card > .wp-block-columns{
    margin:0 !important;
    gap:0 !important;
}

/* TEXT */
.res-overlay{
    position:absolute;
    left:0;
    right:0;
    bottom:0;

    z-index:2;

    padding:2rem;

    color:#fff;

    text-align:right;
}

/* Heading */
.res-overlay h3{
    color: #fff;
    font-family: var(--font-display) !important;
    font-weight: 500;
    font-size: clamp(1.35rem, 1.2vw + 1rem, 1.9rem);
    line-height: 1.2;
    margin: 0 0 .7rem;
}

/* Body */
.res-overlay p{
    color: rgba(255,255,255,.9);
    font-family: var(--font-body);
    font-size: .98rem;
    line-height: 1.65;
    margin: 0 0 1rem;
}

.res-overlay p:last-child{
    font-weight:600;
}

.res-card figure{
    margin:0 !important;
    line-height:0;
}

.res-card picture,
.res-card img{
    display:block;
}
.res-link{
    font-weight:600;
}

.res-link::after{
    content:" ←";
    margin-right:.5rem;
    transition:transform .3s ease;
}

.res-card:hover .resource-link::after{
    transform:translateX(-4px);
}  

.res-card .res-overlay a,
.res-card .res-overlay a:visited{
    color:#fff !important;
    text-decoration: none;
}

.res-card .res-overlay a:hover,
.res-card .res-overlay a:focus{
    color:#fff !important;
    text-decoration: none;
}

.res-card{
    cursor:pointer;
}
/* ==========================================================
   FEATURE SECTIONS (Eco Torah + Infographics)
   ========================================================== */

.feature-section{
    background: #f3ebe5;
    padding: clamp(2rem, 7vw, 3.5rem) 0;
}

/* Eyebrow */
.feature-eyebrow{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem .85rem;
    border: 1px solid var(--rule);
    border-radius: 9999px;
    background: rgba(255,255,255,.55);
    color: var(--green) !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 0 1.3rem;
}

.feature-eyebrow-num{
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: 0;
    color: var(--sand);
}

/* Heading */
.feature-title{
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(2rem, 2.2vw + 1rem, 4rem) !important;
    color: var(--forest) !important;
    line-height: 1.12;
    margin: 0 0 1.1rem;
}

/* Body */
.feature-body{
    color: var(--ink-soft, var(--green)) !important;
    font-family: var(--font-body) !important;
    font-size: clamp(1rem, 0.7rem + 0.5vw, 1.2rem) !important;
    line-height: 1.8;
    margin: 0 0 1.6rem !important;
}

/* Ghost button — paragraph tag wrapping an <a> */
.feature-btn{
    margin: 0 !important;
}

.feature-btn a{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    background: transparent !important;
    color: var(--forest) !important;
    border: 1px solid var(--forest);
    border-radius: 9999px;
    padding: .85rem 1.7rem;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: .98rem;
    text-decoration: none;
    transition: transform .4s ease, background .4s ease, color .4s ease, border-color .4s ease, box-shadow .4s ease;
}

.feature-btn a::after{
    content: "←";
    display: inline-block;
    transition: transform .4s ease;
}

.feature-btn a:hover{
    background: var(--forest) !important;
    color: var(--cream) !important;
    border-color: var(--forest);
    transform: translateY(-2px);
    box-shadow: 0 14px 30px -12px rgba(27,42,38,.55);
}

.feature-btn a:hover::after{
    transform: translateX(-4px);
}

/* All feature images */
.feature-art img{
    width: 100%;
    border-radius: 16px;
    object-fit: cover;
    display: block;
    box-shadow: 0 36px 80px -44px rgba(27,42,38,.6);
    max-width: 100%;
    height: auto;
}

/* Book image (Eco Torah) — contained with gradient background */
.feature-art.book img{
    aspect-ratio: 1/1;
    object-fit: contain;
    background: linear-gradient(135deg, var(--sage-soft, #e6eadd), var(--cream-deep, #faf6f0));
    padding: clamp(1.5rem, 4vw, 3rem);
}

/* Tall image (Infographics) */
.feature-art.tall img{
    aspect-ratio: 3/4;
    object-fit: cover;
}
/* ==========================================================
   CLOSER / TAKE PART SECTION
   ========================================================== */

.closer-section{
    background: var(--green-deep, #1b2a26);
    padding: clamp(4.4rem, 8vw, 9rem) 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

/* Radial glow from top center — matches HTML mockup */
.closer-section::before{
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(120% 90% at 50% 0%, rgba(205,171,115,.16), transparent 60%);
    pointer-events: none;
}

.closer-section .kt-inside-inner-col{
    position: relative;
    max-width: 48rem;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Eyebrow — dark variant */
.closer-eyebrow{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem .85rem;
    border: 1px solid rgba(231,214,180,.3);
    border-radius: 9999px;
    background: rgba(255,255,255,.06);
    color: #e7d6b4 !important;
    font-family: var(--font-body) !important;
    font-size: .7rem !important;
    font-weight: 600;
    letter-spacing: .22em;
    width: max-content;
    margin: 0 0 1.6rem;
}

.closer-eyebrow-num{
    font-family: var(--font-display);
    font-weight: 700;
    font-size: .95rem;
    letter-spacing: 0;
    color: var(--sand, #cdab73);
}

/* Heading */
.closer-title{
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    font-size: clamp(2rem, 2.2vw + 1rem, 4rem) !important;
    color: #fff !important;
    line-height: 1.12;
    margin: 0 0 1.4rem;
}

/* Body */
.closer-text{
    color: rgba(244,237,231,.82) !important;
    font-family: var(--font-body) !important;
    font-size: clamp(1.1rem, 0.7rem + 0.8vw, 1.7rem) !important;
    font-weight: 300;
    line-height: 1.8;
    max-width: 38rem;
    margin: 0 0 2.4rem !important;
}

/* Sand pill button */
.closer-btn{
    margin: 0 !important;
}

.closer-btn a{
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    background: var(--sand, #cdab73) !important;
    color: var(--green-deep, #1b2a26) !important;
    border: 1px solid var(--sand, #cdab73);
    border-radius: 9999px;
    padding: .85rem 1.7rem;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: .98rem;
    text-decoration: none;
    transition: transform .4s ease, background .4s ease, color .4s ease, box-shadow .4s ease;
}

.closer-btn a::after{
    content: "←";
    display: inline-block;
    transition: transform .4s ease;
}

.closer-btn a:hover{
    background: var(--cream, #f4ede7) !important;
    color: var(--green-deep, #1b2a26) !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 30px -12px rgba(0,0,0,.5);
}

.closer-btn a:hover::after{
    transform: translateX(-4px);
}

/* Remove border from Kadence's outer footer wrapper */
#colophon.site-footer{
    border-top: none !important;
    background: transparent !important;
    padding: 0 !important;
}

/* Apply border only to your custom inner footer */
footer.site-footer[dir="rtl"]{
    border-top: 1px solid rgba(231,214,180,.12) !important;
}

#colophon .site-container,
#colophon .site-footer-wrap,
#colophon .site-bottom-footer-wrap,
#colophon .site-footer-row-container-inner,
#colophon .site-bottom-footer-inner-wrap,
#colophon .footer-widget-area,
#colophon .footer-widget-area-inner,
#colophon .site-info-inner,
#colophon .widget{
    max-width: 100% !important;
    width: 100% !important;
    padding-inline: 0 !important;
    margin-inline: 0 !important;
}
/* ==========================================================
   SCROLL REVEAL ANIMATIONS
   ========================================================== */

.anim-up{
    opacity: 0;
    transform: translateY(38px);
    transition: opacity .9s cubic-bezier(0.32, 0.72, 0, 1),
                transform 1.1s cubic-bezier(0.32, 0.72, 0, 1);
}

.anim-up.is-visible{
    opacity: 1;
    transform: translateY(0);
}

.d1{ transition-delay: .12s; }
.d2{ transition-delay: .24s; }
.d3{ transition-delay: .36s; }
.d4{ transition-delay: .48s; }

@media (prefers-reduced-motion: reduce){
    .anim-up{
        transition: none;
        opacity: 1;
        transform: none;
    }
}