/* Monkey Artisan Article Widgets */
.monkey-artisan-hero,
.monkey-artisan-story,
.monkey-artisan-hero *,
.monkey-artisan-story *{
    box-sizing:border-box;
}

.monkey-artisan-hero{
    --monkey-hero-card-height:420px;
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:transparent;
    min-height:calc(var(--monkey-hero-card-height) + 140px);
}

.monkey-artisan-hero-bg{
    position:absolute;
    inset:0;
    z-index:0;
}

.monkey-artisan-hero-bg img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.monkey-artisan-hero-overlay{
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:linear-gradient(90deg, rgba(0,0,0,.14), rgba(0,0,0,.02) 48%, rgba(0,0,0,.08));
}

.monkey-artisan-back{
    position:absolute;
    z-index:3;
    top:24px;
    left:clamp(18px, 5vw, 70px);
    display:inline-flex;
    align-items:center;
    gap:8px;
    text-decoration:none;
    line-height:1;
}

.monkey-artisan-hero-note{
    position:absolute;
    z-index:2;
    margin:0;
    min-width:220px;
    min-height:var(--monkey-hero-card-height);
    padding:54px 46px 42px;
    color:#253A24;
    box-shadow:0 20px 45px rgba(0,0,0,.16);
    overflow:visible;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
}

.monkey-artisan-hero-note.has-paper-bg::before,
.monkey-artisan-story-content.has-paper-bg::before,
.monkey-artisan-small-note.has-paper-bg::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background-image:
        radial-gradient(circle at 18% 24%, rgba(138,86,34,.18) 0 1px, transparent 2px),
        radial-gradient(circle at 72% 37%, rgba(138,86,34,.12) 0 1px, transparent 2px),
        radial-gradient(circle at 42% 78%, rgba(138,86,34,.11) 0 1px, transparent 2px),
        linear-gradient(110deg, rgba(255,255,255,.22), rgba(255,255,255,0) 50%, rgba(102,68,34,.06));
    background-size:34px 34px, 46px 46px, 58px 58px, 100% 100%;
    mix-blend-mode:multiply;
}

.monkey-artisan-hero-note.has-paper-bg::after,
.monkey-artisan-story-content.has-paper-bg::after,
.monkey-artisan-small-note.has-paper-bg::after{
    content:"";
    position:absolute;
    inset:-1px;
    pointer-events:none;
    background:
        linear-gradient(90deg, transparent 0 12px, rgba(94,55,22,.18) 12px 13px, transparent 13px calc(100% - 12px), rgba(94,55,22,.12) calc(100% - 12px) calc(100% - 11px), transparent calc(100% - 11px)),
        linear-gradient(0deg, transparent 0 10px, rgba(94,55,22,.14) 10px 11px, transparent 11px calc(100% - 10px), rgba(94,55,22,.1) calc(100% - 10px) calc(100% - 9px), transparent calc(100% - 9px));
    opacity:.45;
}

.monkey-artisan-tape,
.monkey-artisan-story-tape{
    position:absolute;
    z-index:5;
    display:block;
    opacity:.78;
    box-shadow:0 2px 8px rgba(0,0,0,.15);
    background-image:
        linear-gradient(0deg, rgba(255,255,255,.22), rgba(255,255,255,0) 45%, rgba(75,39,10,.08)),
        repeating-linear-gradient(90deg, rgba(255,255,255,.12) 0 10px, rgba(0,0,0,.035) 10px 12px);
}

.monkey-artisan-tape{
    left:50%;
    top:-20px;
    transform:translateX(-50%) rotate(-1deg);
}

.monkey-artisan-label,
.monkey-artisan-title,
.monkey-artisan-text,
.monkey-artisan-story-title,
.monkey-artisan-story-text,
.monkey-artisan-small-note-title,
.monkey-artisan-small-note-text{
    position:relative;
    z-index:2;
}

.monkey-artisan-label{
    display:inline-block;
    margin:0 0 14px;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-size:13px;
    font-weight:700;
}

.monkey-artisan-title,
.monkey-artisan-story-title,
.monkey-artisan-small-note-title{
    margin:0;
    line-height:1.08;
    font-family:"Patrick Hand", cursive;
    font-weight:400;
}

.monkey-artisan-title{
    font-size:clamp(42px, 5vw, 74px);
}

/* v1.0.36: hard reset real H1-H5 title tags so theme heading CSS cannot break note padding/layout.
   The padding stays on the note/card, never on the title itself. */
.monkey-artisan-hero-note > .monkey-artisan-title,
.monkey-artisan-story-content > .monkey-artisan-story-title,
.monkey-artisan-small-note > .monkey-artisan-small-note-title,
h1.monkey-artisan-title,
h2.monkey-artisan-title,
h3.monkey-artisan-title,
h4.monkey-artisan-title,
h5.monkey-artisan-title,
h1.monkey-artisan-story-title,
h2.monkey-artisan-story-title,
h3.monkey-artisan-story-title,
h4.monkey-artisan-story-title,
h5.monkey-artisan-story-title,
h1.monkey-artisan-small-note-title,
h2.monkey-artisan-small-note-title,
h3.monkey-artisan-small-note-title,
h4.monkey-artisan-small-note-title,
h5.monkey-artisan-small-note-title{
    display:block;
    box-sizing:border-box;
    min-width:0;
    width:auto;
    max-width:100%;
    margin:0 !important;
    padding:0 !important;
    border:0;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:normal;
}

.monkey-artisan-hero-note > *,
.monkey-artisan-story-content > *,
.monkey-artisan-small-note > *{
    max-width:100%;
    min-width:0;
}

.monkey-artisan-hero-note,
.monkey-artisan-story-content,
.monkey-artisan-small-note{
    box-sizing:border-box;
}

.monkey-artisan-title::after,
.monkey-artisan-story-title::after,
.monkey-artisan-small-note-title::after{
    content:"";
    display:block;
    width:86px;
    height:4px;
    margin:18px 0 0;
    border-radius:999px;
    transform:rotate(-2deg);
}

.monkey-artisan-text,
.monkey-artisan-story-text,
.monkey-artisan-small-note-text{
    min-width:0;
    max-width:100%;
    overflow-wrap:break-word;
    margin-top:22px;
    font-size:16px;
    line-height:1.75;
    font-family:Montserrat, Arial, sans-serif;
}

.monkey-artisan-text p,
.monkey-artisan-story-text p,
.monkey-artisan-small-note-text p{
    margin:0 0 1em;
}

.monkey-artisan-text p:last-child,
.monkey-artisan-story-text p:last-child,
.monkey-artisan-small-note-text p:last-child{
    margin-bottom:0;
}

.monkey-artisan-leaf{
    position:absolute;
    z-index:2;
    right:34px;
    bottom:30px;
    width:72px;
    height:105px;
    opacity:.72;
    border-left:2px solid currentColor;
    transform:rotate(22deg);
    color:#5F6F52;
}

.monkey-artisan-leaf::before,
.monkey-artisan-leaf::after{
    content:"";
    position:absolute;
    width:32px;
    height:18px;
    border:2px solid currentColor;
    border-left:none;
    border-bottom:none;
    border-radius:100% 0 100% 0;
}

.monkey-artisan-leaf::before{
    left:5px;
    top:22px;
    transform:rotate(-30deg);
    box-shadow:0 26px 0 -1px currentColor, 0 52px 0 -1px currentColor;
}

.monkey-artisan-leaf::after{
    right:5px;
    top:10px;
    transform:scaleX(-1) rotate(-30deg);
    box-shadow:0 26px 0 -1px currentColor, 0 52px 0 -1px currentColor;
}

.monkey-artisan-story{
    display:flex;
    align-items:center;
    position:relative;
    background:transparent;
    padding:70px clamp(22px, 5vw, 78px);
    overflow:visible;
}

.monkey-artisan-story.is-image-left{
    flex-direction:row-reverse;
}

.monkey-artisan-story-content{
    position:relative;
    z-index:1;
    padding:54px 48px;
    min-width:0;
    box-shadow:0 12px 30px rgba(0,0,0,.08);
}

.monkey-artisan-story-title{
    font-size:clamp(34px, 3.2vw, 54px);
}

.monkey-artisan-story-media{
    position:relative;
    min-width:0;
}

.monkey-artisan-story-img{
    position:relative;
    overflow:hidden;
    background:transparent;
    box-shadow:0 16px 35px rgba(0,0,0,.13);
}

.monkey-artisan-story-img img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.monkey-artisan-story-tape{
    width:150px;
    height:38px;
    left:14%;
    top:-18px;
    transform:rotate(-4deg);
}

.monkey-artisan-small-note{
    position:absolute;
    z-index:4;
    min-width:170px;
    padding:42px 32px 34px;
    box-shadow:0 16px 34px rgba(0,0,0,.14);
}

.monkey-artisan-small-note .small-tape{
    width:82px;
    height:28px;
    top:-13px;
}

.monkey-artisan-small-note-title{
    font-size:clamp(28px, 2.3vw, 42px);
    text-align:center;
}

.monkey-artisan-small-note-title::after{
    margin-left:auto;
    margin-right:auto;
}

.monkey-artisan-small-note-text{
    text-align:center;
    font-size:15px;
    line-height:1.65;
}

.monkey-artisan-leaf.small{
    width:56px;
    height:80px;
    right:28px;
    bottom:22px;
    opacity:.55;
}

@media (max-width: 1024px){
    .monkey-artisan-hero-note{
        width:min(82%, 520px) !important;
    }
    .monkey-artisan-story,
    .monkey-artisan-story.is-image-left{
        flex-direction:column;
    }
    .monkey-artisan-story-content,
    .monkey-artisan-story-media{
        flex-basis:auto !important;
        width:100%;
    }
    .monkey-artisan-small-note{
        position:relative;
        left:auto !important;
        top:auto !important;
        width:100% !important;
        margin:28px auto 0;
        transform:rotate(0deg) !important;
    }
}

@media (max-width: 767px){
    .monkey-artisan-hero{
        min-height:calc(var(--monkey-hero-card-height) + 90px);
    }
    .monkey-artisan-back{
        top:18px;
        left:18px;
    }
    .monkey-artisan-hero-note{
        left:50% !important;
        top:auto !important;
        bottom:34px;
        transform:translateX(-50%) rotate(0deg) !important;
        width:calc(100% - 36px) !important;
        padding:44px 28px 34px;
    }
    .monkey-artisan-title{
        font-size:42px;
    }
    .monkey-artisan-story{
        padding:46px 18px;
    }
    .monkey-artisan-story-content{
        padding:38px 28px;
    }
    .monkey-artisan-story-img{
        height:300px !important;
    }
    .monkey-artisan-leaf{
        display:none;
    }
}

/* v1.0.24 controls: no forced section background + reliable note X/Y positioning */
.monkey-artisan-story.has-bg-image{
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
}

.monkey-artisan-hero.is-note-left .monkey-artisan-hero-note{
    left:7%;
    top:23%;
    transform:rotate(-2deg);
}
.monkey-artisan-hero.is-note-center .monkey-artisan-hero-note{
    left:50%;
    top:50%;
    transform:translate(-50%, -50%) rotate(0deg);
}
.monkey-artisan-hero.is-note-right .monkey-artisan-hero-note{
    left:auto;
    right:7%;
    top:23%;
    transform:rotate(2deg);
}

.monkey-artisan-small-note{
    --monkey-note-x:62%;
    --monkey-note-y:20%;
    --monkey-note-rotation:5deg;
    left:var(--monkey-note-x);
    top:var(--monkey-note-y);
    right:auto;
    bottom:auto;
    transform:rotate(var(--monkey-note-rotation));
}
.monkey-artisan-note-2{
    --monkey-note-x:8%;
    --monkey-note-y:68%;
    --monkey-note-rotation:-4deg;
}
.monkey-artisan-note-3{
    --monkey-note-x:42%;
    --monkey-note-y:76%;
    --monkey-note-rotation:2deg;
}
.monkey-artisan-small-note.is-pos-top-left{
    --monkey-note-x:4%;
    --monkey-note-y:6%;
}
.monkey-artisan-small-note.is-pos-top-right{
    --monkey-note-x:68%;
    --monkey-note-y:6%;
}
.monkey-artisan-small-note.is-pos-bottom-left{
    --monkey-note-x:4%;
    --monkey-note-y:68%;
}
.monkey-artisan-small-note.is-pos-bottom-right{
    --monkey-note-x:68%;
    --monkey-note-y:68%;
}
.monkey-artisan-small-note.is-pos-center{
    --monkey-note-x:50%;
    --monkey-note-y:50%;
    transform:translate(-50%, -50%) rotate(var(--monkey-note-rotation));
}

@media (max-width: 1024px){
    .monkey-artisan-small-note[class*="is-pos-"]{
        left:auto;
        right:auto;
        top:auto;
        bottom:auto;
        transform:rotate(0deg);
    }
}


/* v1.0.30: keep paper/card backgrounds independent from section background images */
.monkey-artisan-hero:not(:has(.monkey-artisan-hero-bg)) .monkey-artisan-hero-overlay{
    display:none;
}
.monkey-artisan-hero-note,
.monkey-artisan-story-content,
.monkey-artisan-small-note{
    background-color:#FBF7EC;
}

/* v1.0.26: Artisan hero note image mode additions */
.monkey-artisan-hero-note.is-content-image,
.monkey-artisan-hero-note.is-content-mixed{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:stretch;
    gap:22px;
}

.monkey-artisan-note-image-wrap{
    position:relative;
    z-index:2;
    width:100%;
    overflow:hidden;
    background:transparent;
}

.monkey-artisan-note-image-wrap img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.monkey-artisan-hero-note.is-content-image{
    padding:34px;
}

.monkey-artisan-hero-note.is-content-image .monkey-artisan-note-image-wrap{
    margin:0;
}

.monkey-artisan-hero-note.is-text-hidden .monkey-artisan-label,
.monkey-artisan-hero-note.is-text-hidden .monkey-artisan-title,
.monkey-artisan-hero-note.is-text-hidden .monkey-artisan-text,
.monkey-artisan-hero-note.is-text-hidden .monkey-artisan-leaf{
    display:none !important;
}

@media (max-width: 767px){
    .monkey-artisan-hero-note.is-content-image,
    .monkey-artisan-hero-note.is-content-mixed{
        gap:18px;
    }
    .monkey-artisan-hero-note.is-content-image{
        padding:24px;
    }
}

/* v1.0.31: when the text card is hidden, let the image column take the full available space. */
.monkey-artisan-story-media.is-full-width{
    flex: 1 1 100%;
}


/* v1.0.37: Artisan hero sizing is driven by the card, not by a separate hero height. */
.monkey-artisan-hero{
    min-height:calc(var(--monkey-hero-card-height, 420px) + 140px) !important;
}
.monkey-artisan-hero-note{
    min-height:var(--monkey-hero-card-height, 420px);
    height:auto;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
}
.monkey-artisan-hero-note > .monkey-artisan-label,
.monkey-artisan-hero-note > .monkey-artisan-title,
.monkey-artisan-hero-note > .monkey-artisan-text,
.monkey-artisan-hero-note > .monkey-artisan-note-image-wrap{
    flex:0 0 auto;
}
@media (max-width:767px){
    .monkey-artisan-hero{
        min-height:calc(var(--monkey-hero-card-height, 420px) + 90px) !important;
    }
}


/* v1.0.41 - remove useless top space in Artisan Hero and keep note centered inside its card */
.monkey-artisan-hero{
    min-height:var(--monkey-hero-card-height, 420px) !important;
}
.monkey-artisan-hero-note{
    min-height:var(--monkey-hero-card-height, 420px) !important;
    height:auto!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
}
@media (max-width:767px){
    .monkey-artisan-hero{
        min-height:var(--monkey-hero-card-height, 420px) !important;
    }
}


/* v1.0.42 - restore texture, remove unwanted hero top space without killing background, add stable text movement */
.monkey-artisan-hero{
    padding-top:0!important;
    min-height:var(--monkey-hero-card-height, 420px)!important;
}
.monkey-artisan-hero-bg,
.monkey-artisan-hero-overlay{
    inset:0!important;
}
.monkey-artisan-hero-note.has-paper-bg::before,
.monkey-artisan-hero-note.has-paper-bg::after{
    display:block!important;
}
.monkey-artisan-label,
.monkey-artisan-title,
.monkey-artisan-text{
    will-change:transform;
}


/* v1.0.45 - remove clipping mask from Artisan Hero so rotated cards/tape are not cut.
   The section no longer hides overflow; add spacing with the section padding control only when wanted. */
.monkey-artisan-hero{
    overflow:visible!important;
    contain:layout!important;
}
.monkey-artisan-hero-bg,
.monkey-artisan-hero-overlay{
    overflow:hidden!important;
}
.monkey-artisan-hero-note{
    overflow:visible!important;
}
.monkey-artisan-note-image-wrap,
.monkey-artisan-label,
.monkey-artisan-title,
.monkey-artisan-text{
    will-change:transform;
}

/* v1.0.46: Monkey Artisan Image + Notes height, joint positioning, and restored paper texture */
.monkey-artisan-story{
    min-height: var(--monkey-artisan-story-height, auto);
    overflow: visible !important;
}
.monkey-artisan-story-content,
.monkey-artisan-story-media{
    --monkey-story-move-x: 0px;
    --monkey-story-move-y: 0px;
    transform: translate(var(--monkey-story-move-x), var(--monkey-story-move-y));
}
.monkey-artisan-story-content.has-paper-bg::before,
.monkey-artisan-small-note.has-paper-bg::before{
    opacity: .55;
}
.monkey-artisan-story-content.has-paper-bg::before,
.monkey-artisan-story-content.has-paper-bg::after,
.monkey-artisan-small-note.has-paper-bg::before,
.monkey-artisan-small-note.has-paper-bg::after{
    z-index: 0;
}
.monkey-artisan-story-content > *,
.monkey-artisan-small-note > *{
    position: relative;
    z-index: 2;
}
.monkey-artisan-story-media{
    overflow: visible !important;
}

/* v1.0.47: restore original Artisan Image + Notes layout behavior.
   Height and position controls are available, but old joint movement values from v1.0.46 are ignored. */
.elementor-widget-monkey_artisan_image_note,
.elementor-widget-monkey_artisan_image_note .elementor-widget-container{
    overflow:visible!important;
}
.elementor-widget-monkey_artisan_image_note{
    position:relative;
    z-index:5;
}
.monkey-artisan-story{
    position:relative;
    z-index:5;
    overflow:visible!important;
    isolation:isolate;
}
.monkey-artisan-story-content{
    --monkey-story-content-x:0px;
    --monkey-story-content-y:0px;
    transform:translate(var(--monkey-story-content-x), var(--monkey-story-content-y));
}
.monkey-artisan-story-media{
    --monkey-story-media-x:0px;
    --monkey-story-media-y:0px;
    transform:translate(var(--monkey-story-media-x), var(--monkey-story-media-y));
    overflow:visible!important;
}
.monkey-artisan-small-note .small-tape{
    z-index:8!important;
}
.monkey-artisan-story-content.has-paper-bg::before,
.monkey-artisan-story-content.has-paper-bg::after,
.monkey-artisan-small-note.has-paper-bg::before,
.monkey-artisan-small-note.has-paper-bg::after{
    display:block!important;
    pointer-events:none!important;
}
.monkey-artisan-story-content > :not(.monkey-artisan-tape),
.monkey-artisan-small-note > :not(.monkey-artisan-tape){
    position:relative;
    z-index:2;
}


/* v1.0.48: Artisan Image + Notes - card height only and fixed tape anchor */
.monkey-artisan-story{
    min-height:auto!important;
}
.monkey-artisan-small-note{
    box-sizing:border-box!important;
    overflow:visible!important;
}
.monkey-artisan-small-note .small-tape,
.monkey-artisan-small-note > .monkey-artisan-tape.small-tape{
    position:absolute!important;
    left:50%!important;
    top:-14px!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%) rotate(-1deg)!important;
    z-index:20!important;
    pointer-events:none!important;
}
.monkey-artisan-small-note > :not(.monkey-artisan-tape){
    position:relative!important;
    z-index:2!important;
}